:root{font-family:"Yu Gothic UI","Meiryo",system-ui,sans-serif;color:#e0ecee;background:#091820;font-size:16px;line-height:1.65;--line:#334f5b;--sea:#68dcc8;--muted:#a9c1cb}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button,.file{border:1px solid #496a76;background:#203d4a;color:#edf6f6;border-radius:5px;padding:.55rem .9rem;cursor:pointer;min-height:44px}button:hover,.file:hover{background:#2b5561}button:disabled{opacity:.5;cursor:default}button.primary{background:var(--sea);color:#082b31;font-weight:700;border-color:var(--sea)}:focus-visible{outline:3px solid #ffda85;outline-offset:3px}a{color:var(--sea);overflow-wrap:anywhere}header{padding:1.2rem 3vw;display:flex;gap:1.5rem;align-items:center;border-bottom:1px solid var(--line);background:#0d1e27}.brand{color:var(--sea);font-family:Georgia,serif;letter-spacing:.18em;font-size:1.6rem;text-decoration:none}.brand span{font-family:system-ui,sans-serif;display:block;color:var(--muted);letter-spacing:.15em;font-size:.8rem}.connection{margin-left:auto;display:flex;align-items:center;gap:.55rem;color:var(--muted);font-size:.875rem}#lamp{width:8px;height:8px;border-radius:50%;background:#b9c6c8}#lamp.live{background:var(--sea);box-shadow:0 0 12px #68dcc866}main{max-width:1550px;margin:auto;padding:0 3vw 4rem}h1,h2,h3,p{margin-top:0}h1{font-size:1.8rem;line-height:1.4;margin-bottom:.7rem;font-weight:600}h2{font-size:1.15rem;margin-bottom:1rem}h3{font-size:1rem;margin:1rem 0}.eyebrow{font-size:.8rem;letter-spacing:.15em;color:var(--sea);margin-bottom:.4rem}.muted{color:var(--muted);font-size:.875rem}.entry{padding:6rem 3vw;display:grid;grid-template-columns:1fr 380px;gap:8vw;align-items:center}.entry h1{font-family:Georgia,"Yu Mincho",serif;font-size:clamp(2.2rem,4vw,4rem);line-height:1.45;letter-spacing:.06em}.entry form{border-left:2px solid var(--sea);padding-left:2rem}.entry p{color:var(--muted)}label{display:flex;flex-direction:column;gap:.3rem;font-size:.875rem;color:#bed1d7;margin-bottom:.9rem}input,select{width:100%;min-width:0;border:1px solid #43606c;border-radius:4px;padding:.6rem .7rem;background:#07141d;color:#edf6f6;min-height:44px}input[type=range]{padding:0;accent-color:var(--sea)}input[type=file]{max-width:260px;font-size:.875rem}nav{display:flex;gap:.3rem;align-items:center;padding:1.1rem 0;border-bottom:1px solid var(--line);flex-wrap:wrap}nav button{border:0;background:transparent;color:var(--muted)}nav button[aria-current=page]{background:#21474e;color:#c0fff2}.pill{margin-left:auto;font-family:ui-monospace,monospace;font-size:.875rem;color:var(--sea)}.worldbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.5rem 0}.worldbar h1{margin:0}.worldbar>div:last-child{display:flex;gap:1rem;align-items:center}.worldbar>div:first-child{display:block}.studio{display:grid;grid-template-columns:minmax(0,1fr) 300px;border:1px solid var(--line);border-radius:8px;overflow:hidden}.scene{background:#102c37;min-width:0;position:relative}canvas{display:block;width:100%;height:auto;max-height:560px;object-fit:contain}.scene-caption{position:absolute;left:1rem;right:1rem;bottom:.7rem;display:flex;justify-content:space-between;gap:1rem;font-size:.8rem;color:#b8d5d6}.studio aside{padding:1.25rem;background:#0d1e27;border-left:1px solid var(--line);max-height:650px;overflow:auto}.rows{display:grid;gap:.6rem}.rows>button{text-align:left;width:100%}.rows article{padding:1rem;border:1px solid var(--line);border-radius:5px;background:#10232e}.rows article p{margin:.2rem 0 .8rem}.inset{border-top:1px solid var(--line);padding-top:1rem;margin-top:1.2rem}.lower,.columns{display:grid;grid-template-columns:1fr 1fr;gap:3rem;padding:1.8rem 0}.columns>section{min-width:0}.row{display:flex;gap:.7rem;align-items:end;flex-wrap:wrap}.row>label{flex:1;min-width:100px;margin-bottom:0}.row>button{flex-shrink:0}.row{margin-bottom:1rem}.timeline{padding-left:0;list-style:none;max-height:380px;overflow:auto}.timeline li{padding:.65rem 0 .65rem 1rem;border-left:2px solid #335d68;margin-left:.2rem;font-size:.875rem;overflow-wrap:anywhere}.timeline time{color:var(--sea);font-family:ui-monospace,monospace;font-size:.8rem;margin-right:.7rem}.timeline li+li{border-top:1px solid #1a3541}.replay-controls{padding:1rem;display:flex;gap:1rem;align-items:center;background:#10232e;flex-wrap:wrap}.grow{flex:1;min-width:120px;margin:0}.replay-controls output{font-size:.8rem}.tab{padding-bottom:1rem}output{display:block;overflow-wrap:anywhere;margin:.7rem 0;color:#b6efdf}footer{display:flex;justify-content:space-between;padding:1.5rem 3vw;border-top:1px solid var(--line);font-size:.8rem;letter-spacing:.1em;color:#8eb3be}#status{position:fixed;bottom:1.5rem;left:50%;transform:translateX(-50%);max-width:calc(100vw - 2rem);padding:.8rem 1.3rem;background:#214d51;color:#fff;border:1px solid #6ec8b9;border-radius:6px;z-index:10;display:none}#status.error{background:#582b34;border-color:#e08a90}#status.visible{display:block}#shared{padding:2rem 0}#shared canvas{border:1px solid var(--line);border-radius:8px}#public-section{padding-top:2rem}progress{accent-color:var(--sea);width:100%}details{margin:1rem 0}summary{cursor:pointer}[hidden]{display:none!important}
@media(max-width:850px){.entry{grid-template-columns:1fr;gap:2rem;padding:3rem 0}.entry form{padding-left:1.3rem}.studio{grid-template-columns:1fr}.studio aside{border-left:0;border-top:1px solid var(--line);max-height:none}.lower,.columns{grid-template-columns:1fr;gap:1.4rem}.worldbar{align-items:start;flex-wrap:wrap}.brand{font-size:1.2rem}.brand span{font-size:.7rem}.connection{font-size:.8rem}.worldbar>div:last-child{flex-wrap:wrap}header{gap:.5rem}nav .pill{margin-left:0;width:100%}.scene-caption{font-size:.75rem}.row{gap:.5rem}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
.guide{margin:.9rem 0;border:1px solid var(--line);border-radius:6px;background:#0d1e27;padding:.2rem .9rem}.guide summary{color:var(--sea);font-size:.9rem;min-height:44px;display:flex;align-items:center}.guide ol{margin:.2rem 0 .8rem;padding-left:1.3rem;color:var(--muted);font-size:.875rem}.guide li{margin:.4rem 0}#media{padding:1.4rem 0}#media .row{align-items:center}#clip-progress{margin:.5rem 0}#media-note{min-height:1.2rem}.notice{color:#ffd587;border-left:2px solid #ffd587;padding-left:.7rem;margin:.5rem 0;font-size:.875rem}li.notice{list-style:none}#replay-canvas{touch-action:pan-y}#world-canvas,#replay-canvas{cursor:pointer}.rows article.highlight{display:flex;gap:.8rem;align-items:center;justify-content:space-between;flex-wrap:wrap}.rows article.highlight strong{flex:1;min-width:12rem}
@media(max-width:850px){main{padding:0 4vw 5rem}.entry{padding:2rem 0}.worldbar{padding:1rem 0}.worldbar>div:last-child{width:100%}nav{position:sticky;top:0;z-index:5;background:#091820;flex-wrap:nowrap;overflow-x:auto}nav button{white-space:nowrap;min-height:48px}nav .pill{width:auto;margin-left:.4rem}canvas{max-height:46vh}.replay-controls{padding:.7rem;gap:.6rem}.replay-controls output{order:3;width:100%}#media .row>button,#media .row>label{flex:1 1 44%;min-width:9.5rem}.timeline{max-height:320px}#status{bottom:calc(1rem + env(safe-area-inset-bottom));max-width:calc(100vw - 1.5rem)}footer{padding-bottom:calc(1.5rem + env(safe-area-inset-bottom))}}
@media(max-width:850px) and (orientation:landscape){header{padding:.5rem 3vw}.brand span{display:none}.entry{grid-template-columns:1fr 46%;gap:2rem;padding:1.5rem 0}.studio{grid-template-columns:minmax(0,1fr) 42%}.studio aside{border-left:1px solid var(--line);border-top:0;max-height:64vh}canvas{max-height:64vh}}
@media(hover:none){button,.file{padding:.7rem 1rem}}