:root{color-scheme:dark;--bg:#080f19;--ink:#edf2ee;--muted:#a1b1bc;--accent:#8bbbd5;--line:#344453;--panel:#101c28;--wash:rgba(8,15,25,.91);--shade:rgba(8,15,25,.35);font-family:Inter,"PingFang SC","Microsoft YaHei",system-ui,sans-serif}
:root[data-theme=light]{color-scheme:light;--bg:#f1f2e9;--ink:#18313c;--muted:#516770;--accent:#2d6480;--line:#b4c3c5;--panel:#f7f8f2;--wash:rgba(241,242,233,.95);--shade:rgba(241,242,233,.4)}
*{box-sizing:border-box}html{background:var(--bg);color:var(--ink)}body{margin:0;min-height:100vh;min-height:100svh;display:grid;grid-template-rows:auto 1fr auto auto;padding:0 clamp(22px,5.2vw,88px);isolation:isolate;line-height:1.7}button,a,input{touch-action:manipulation}button,input{font:inherit}button{cursor:pointer;color:inherit;border:1px solid var(--line);background:var(--wash);border-radius:8px;padding:9px 15px;min-height:44px}button:hover{border-color:var(--accent);color:var(--accent)}button:disabled{opacity:.5;cursor:default}a{color:inherit;text-underline-offset:4px}a:hover{color:var(--accent)}:focus-visible{outline:2px solid var(--accent);outline-offset:5px}[hidden]{display:none!important}
#universe{position:fixed;inset:0;width:100%;height:100%;z-index:-3;touch-action:pan-y}#universe[data-interaction=drag]{touch-action:none}@media(pointer:coarse){#universe[data-interaction=drag]{touch-action:pan-y}}
.veil{position:fixed;inset:0;z-index:-2;pointer-events:none;background:linear-gradient(90deg,var(--wash) 0%,var(--shade) 45%,transparent 72%),linear-gradient(0deg,var(--wash),transparent 26%)}
.skip-link{position:absolute;left:20px;top:-100px;z-index:5;background:var(--panel);padding:12px}.skip-link:focus{top:10px}.masthead{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;padding:34px 0 20px}.brand{display:flex;align-items:center;gap:13px;text-decoration:none;font-size:16px;letter-spacing:.17em;line-height:1.2}.brand small{display:block;letter-spacing:.14em;font-size:10px;color:var(--muted);margin-top:9px}.brand-mark{font-size:40px;font-weight:200;line-height:1}.tools{display:flex;gap:8px;flex-wrap:wrap}.tools button{font-size:12px}.tools button:last-child{margin-left:9px}
.hero{align-self:center;padding:70px 0 60px;max-width:640px;pointer-events:none}.hero button,.hero a{pointer-events:auto}.eyebrow{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:10px;letter-spacing:.2em;color:var(--accent);margin:0 0 17px}.hero h1{font-size:clamp(42px,6.5vw,90px);font-weight:450;letter-spacing:.12em;line-height:1.25;margin:0 0 27px}.intro{font-size:clamp(14px,1.2vw,17px);margin:0 0 4px;color:var(--ink)}.invitation{font-size:14px;color:var(--muted);margin:0}.hero-actions{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:34px}.primary{border-color:var(--accent);background:var(--ink);color:var(--bg);padding:11px 20px;border-radius:8px}.primary:hover{background:var(--accent);color:var(--bg)}.primary span{margin-left:20px}#rotation-note{font-size:11px;color:var(--muted)}#status:empty{display:none}#status{font-size:13px;color:var(--muted);max-width:34em}
.scene{max-width:520px;padding:0 0 32px}.scene-heading{display:flex;gap:17px;align-items:center}.scene-number{font:300 39px/1 ui-monospace,monospace;color:var(--muted);opacity:.65}.scene .eyebrow{margin:0 0 3px;font-size:9px}.scene h2{font-size:19px;font-weight:450;line-height:1.45;margin:0}.hint{font-size:12px;color:var(--muted);margin:12px 0 0}.scene-actions{display:flex;gap:12px;margin-top:7px;flex-wrap:wrap}.scene-actions button{padding:4px 0;font-size:11px;background:none;border-color:transparent;border-radius:0;min-height:36px}.scene-actions button+button{margin-left:6px}.parameters{display:grid;gap:10px;margin-top:12px}.parameters:empty{display:none}.parameter{display:grid;grid-template-columns:minmax(60px,auto) minmax(70px,1fr) 60px;align-items:center;gap:14px;font-size:11px;color:var(--muted)}input[type=range]{min-height:28px;min-width:0;width:100%;accent-color:var(--accent)}output{text-align:right}
.site-footer{border-top:1px solid var(--line);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:14px;padding:17px 0 max(18px,env(safe-area-inset-bottom));font-size:10px;color:var(--muted);position:relative}.site-footer a{font-size:12px;min-height:32px;display:flex;align-items:center;justify-content:center}.footer-note{text-align:right;letter-spacing:.12em}
dialog{width:min(960px,calc(100% - 32px));max-height:calc(100svh - 36px);padding:28px;background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:16px;overscroll-behavior:contain}dialog::backdrop{background:rgba(0,0,0,.67);backdrop-filter:blur(8px)}.dialog-header{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}.dialog-header h2,dialog h2{font-size:23px;font-weight:450;line-height:1.4;margin:0 0 10px}.dialog-header .eyebrow{margin-bottom:6px}.close{font-size:25px;line-height:1;min-width:44px;flex-shrink:0;background:none;padding:4px}.dialog-intro{color:var(--muted);font-size:13px;margin:6px 0 20px}.filters{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 22px}.filters button{font-size:12px;background:none}.filters button[aria-pressed=true]{background:var(--ink);color:var(--bg)}.scene-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.scene-card{padding:0;text-align:left;background:var(--bg);overflow:hidden}.scene-card[aria-pressed=true]{outline:2px solid var(--accent);outline-offset:2px}.scene-card canvas{width:100%;height:auto;display:block;aspect-ratio:16/9}.scene-card strong{display:block;font-size:13px;font-weight:450;padding:10px 12px 0}.scene-card small{display:block;font-size:10px;color:var(--muted);padding:0 12px 12px}.small-dialog{width:min(580px,calc(100% - 32px))}.small-dialog p{font-size:14px;line-height:1.9}.sources{display:grid;gap:12px;font-size:13px;margin:22px 0}.disclaimer{border-top:1px solid var(--line);padding-top:16px;color:var(--muted);font-size:11px!important}#share-link{display:block;width:100%;padding:12px;font-size:12px;border:1px solid var(--line);border-radius:7px;margin:9px 0 20px;background:var(--bg);color:var(--ink)}#copy-status{color:var(--muted);font-size:12px}
@media(min-width:1500px){.hero{padding:110px 0 100px}}
@media(max-width:700px){body{padding:0 22px}.masthead{padding-top:max(22px,env(safe-area-inset-top));gap:20px}.brand{font-size:13px}.brand-mark{font-size:31px}.brand small{font-size:9px}.tools{gap:5px}.tools button{padding:7px 9px;font-size:11px}.tools button:last-child{margin-left:0}.hero{padding:62px 0 130px}.hero h1{letter-spacing:.08em;font-size:clamp(38px,10.8vw,64px);margin-bottom:20px}.hero .eyebrow{font-size:8px;letter-spacing:.15em}.intro{font-size:13px}.invitation{font-size:12px}.hero-actions{gap:11px;margin-top:27px}.primary{font-size:12px}.scene{padding-bottom:24px}.scene h2{font-size:17px}.scene-number{font-size:33px}.site-footer{grid-template-columns:1fr;gap:2px;text-align:center;padding-top:13px}.footer-note{display:none}.site-footer a{font-size:12px}.veil{background:linear-gradient(180deg,var(--shade),transparent 65%),linear-gradient(0deg,var(--wash),transparent 55%)}dialog{padding:20px}.scene-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dialog-header h2{font-size:20px}}
@media(max-width:380px){.masthead{align-items:flex-start}.tools{width:100%;justify-content:flex-end}.hero{padding-top:35px}.hero-actions{align-items:flex-start;flex-direction:column}.parameter{gap:8px}.scene-grid{gap:9px}.scene-card strong{font-size:12px}}
@media(max-height:560px) and (min-width:701px){.hero{padding:35px 0}.hero h1{font-size:48px}.masthead{padding-top:18px}.scene{padding-bottom:15px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}