:root{font:17px/1.7 system-ui,sans-serif;color:#173a3c;background:#f4f3eb}*{box-sizing:border-box}body{margin:0}header,main{max-width:1180px;margin:auto;padding:20px}h1{font-size:clamp(2rem,5vw,3.5rem);margin:0}header p:first-child{letter-spacing:.12em;font-size:.75rem}button,input{font:inherit;padding:9px;border:1px solid #526b6c;border-radius:6px;background:#fff;color:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible{outline:3px solid #b34b16;outline-offset:3px}button[aria-pressed=true]{background:#173a3c;color:white}.toolbar,.filters{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:12px}#viewport{height:450px;position:relative;border-radius:18px;overflow:hidden;background:#dfebe7}#viewport canvas{display:block;width:100%;height:100%;touch-action:none}#scene-status{position:absolute;top:8px;left:12px;z-index:2;background:#fff;padding:6px}.columns{display:grid;grid-template-columns:1fr 1.6fr;gap:24px}ul{padding:0;list-style:none}#list button{width:100%;text-align:left;margin:5px 0}article{padding:20px;background:white;border-radius:12px}.scene-label{background:#fffddd;color:#173a3c;padding:3px 8px;border-radius:4px;font-size:13px;pointer-events:none}@media(max-width:650px){.columns{grid-template-columns:1fr}#viewport{height:320px}header,main{padding:14px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}