/* Isometric coordinates are built as SVG; interaction is native radio + CSS. */
.hero{padding-block:45px;min-height:640px}
.code-world{display:block;align-self:center;margin:0 -28px 0 -24px;aspect-ratio:auto;min-width:0}
.scene-interactive{position:relative;width:100%}
.scene-input{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;left:50%;top:0;margin:0}
.scene-toolbar{display:flex;justify-content:center;align-items:center;gap:12px;position:relative;z-index:3;font-size:11px;min-height:42px}
.scene-invitation{color:#9aa2bc;letter-spacing:1px;margin-right:3px}
.role-options{display:flex;padding:4px;background:#1c2033;border:1px solid #3a3d56;border-radius:99px;gap:3px}
.role-options label{color:#a9b0c7;cursor:pointer;padding:7px 15px;border-radius:99px;min-height:32px;display:grid;place-items:center;transition:background .2s,color .2s;touch-action:manipulation}
.role-options label:hover{background:#34374e;color:#f3f3fa}
#role-worker:checked~.scene-toolbar label[for="role-worker"],#role-elder:checked~.scene-toolbar label[for="role-elder"],#role-family:checked~.scene-toolbar label[for="role-family"]{background:var(--lime);color:#27311b;font-weight:650}
#role-worker:focus-visible~.scene-toolbar label[for="role-worker"],#role-elder:focus-visible~.scene-toolbar label[for="role-elder"],#role-family:focus-visible~.scene-toolbar label[for="role-family"],#scene-paused:focus-visible~.scene-toolbar label[for="scene-paused"]{outline:2px solid #ecffd2;outline-offset:4px}
.motion-toggle{cursor:pointer;color:#a6aec8;padding:10px 8px;border-radius:6px;min-height:36px;white-space:nowrap;touch-action:manipulation}
.motion-toggle:hover{background:#20253a;color:#e1e6f5}.resume-label,.reduced-motion-note{display:none}
#scene-paused:checked~.scene-toolbar .pause-label{display:none}#scene-paused:checked~.scene-toolbar .resume-label{display:inline}
.scene-canvas{position:relative;margin-top:0;height:425px}
.community-scene{width:100%;height:100%;overflow:visible}
.scene-canvas::before{content:"";position:absolute;inset:15% 13% 11%;background:radial-gradient(ellipse,#a59cf414,transparent 68%);z-index:-1;pointer-events:none}
.scene-insight{position:relative;margin:-18px auto 0;width:fit-content;max-width:90%;min-height:45px;border:1px solid #3e435c;background:#1c2134;border-radius:9px;padding:12px 17px;color:#dbe1ee;box-shadow:0 8px 22px #070a171f}
.scene-insight p{display:none;font-size:12px;line-height:1.7}.scene-insight p>span{display:inline-block;font-size:10px;color:var(--lime);margin-right:12px;letter-spacing:.5px}
#role-worker:checked~.scene-insight .insight-worker,#role-elder:checked~.scene-insight .insight-elder,#role-family:checked~.scene-insight .insight-family{display:block}
.code-world figcaption{position:static;text-align:center;margin:17px 0 0;font-size:9px;letter-spacing:1px;color:#858ea9}
.role-halo{opacity:0;transition:opacity .3s}.scene-pin{opacity:.55;transition:opacity .3s}.building{transition:filter .3s}
#role-worker:checked~.scene-canvas .halo-worker,#role-elder:checked~.scene-canvas .halo-elder,#role-family:checked~.scene-canvas .halo-family{opacity:1}
#role-worker:checked~.scene-canvas .pin-worker,#role-elder:checked~.scene-canvas .pin-elder,#role-family:checked~.scene-canvas .pin-family{opacity:1}
#role-worker:checked~.scene-canvas .building-worker,#role-elder:checked~.scene-canvas .building-elder,#role-family:checked~.scene-canvas .building-family{filter:brightness(1.13)}
.route-flow{animation:route-flow 5s linear infinite}.pin-bob{animation:pin-bob 4s ease-in-out infinite}.pin-family .pin-bob{animation-delay:-1.3s}.pin-worker .pin-bob{animation-delay:-2.6s}
.halo-pulse{animation:halo-pulse 3s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
.garden-walker{animation:garden-walk 10s ease-in-out infinite}
#scene-paused:checked~.scene-canvas .community-scene *{animation-play-state:paused}
@keyframes route-flow{to{stroke-dashoffset:-60}}
@keyframes pin-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@keyframes halo-pulse{0%,100%{opacity:.9;transform:scale(1)}50%{opacity:.25;transform:scale(1.24)}}
@keyframes garden-walk{0%,12%,100%{transform:translate(0,0)}45%,60%{transform:translate(22px,11px)}}
/* The project card restores the original concept artwork; hero stays vector. */
.cover-community img{position:absolute;top:-6%;left:19%;width:88%;height:112%;max-width:none;object-fit:cover;mask-image:linear-gradient(90deg,transparent,#000 28%);filter:saturate(.82)}
.cover-community{background:linear-gradient(125deg,#2a3e3b,#1c2931)}
.cover-community .cover-word{font-size:25px;bottom:20px;left:20px}
@media(max-width:1150px){.code-world{margin:0 -17px 0 -12px}.scene-toolbar{gap:6px;font-size:10px}.scene-invitation{font-size:9px;letter-spacing:0}.role-options label{padding:7px 11px}.motion-toggle{font-size:10px;padding-inline:5px}.scene-insight{padding:10px 12px;max-width:95%}.scene-insight p{font-size:11px}.scene-insight p>span{font-size:9px;margin-right:7px}.code-world figcaption{font-size:8px}.scene-canvas{margin-top:15px}}
@media(max-width:850px){.hero{padding-top:58px;padding-bottom:38px;min-height:0}.scene-canvas{height:auto;aspect-ratio:8/5}.code-world{width:min(660px,100%);margin:48px auto 0;aspect-ratio:auto}.scene-toolbar{gap:11px;font-size:12px}.role-options label{padding:8px 18px;min-height:36px}.scene-invitation{font-size:11px}.motion-toggle{font-size:11px;padding:10px}.scene-insight p{font-size:12px}.scene-insight p>span{font-size:10px}.cover-community img{width:165%;height:100%;left:-28%;top:0;object-fit:contain;mask-image:none}}
@media(max-width:560px){.hero{padding-top:44px;padding-bottom:27px}.scene-pin text{display:none}.code-world{width:calc(100% + 20px);margin:38px -10px 0;max-width:none}.scene-toolbar{gap:6px;font-size:11px;flex-wrap:wrap}.scene-invitation{display:none}.role-options{padding:3px;gap:2px}.role-options label{min-height:38px;padding:7px 16px}.motion-toggle{min-height:44px;padding:11px 6px;font-size:10px}.scene-canvas{margin-top:12px}.scene-insight{margin:-5px auto 0;min-height:63px;padding:10px 14px;width:calc(100% - 28px);max-width:none}.scene-insight p{font-size:12px;line-height:1.65}.scene-insight p>span{display:block;font-size:9px;margin:0 0 3px}.code-world figcaption{font-size:8px;margin-top:13px}.cover-community img{width:100%;height:128%;left:14%;top:-12%;object-fit:cover;mask-image:linear-gradient(90deg,transparent,#000 20%)}.cover-community .cover-word{font-size:27px;bottom:22px}}
@media(prefers-reduced-motion:reduce){#scene-paused{display:none}.community-scene *{animation:none!important;transition:none!important}.motion-toggle{display:none}.reduced-motion-note{display:inline;color:#8f98b2;font-size:9px}.building{filter:none!important}}