:root{--title-fs: 72px;--envlabel-fs: 44px;--btn-h: 160px;--btn-fs: 40px;--btn-gap: 26px;--ico-scale: 2.4em;--lbl-scale: 1.25em}#controls{position:fixed;top:24px;right:24px;z-index:10000;width:min(650px,25vw);max-width:calc(100vw - 48px);height:auto;max-height:92vh;overflow:auto;display:flex;flex-direction:column;background:#fffffff5;backdrop-filter:saturate(120%) blur(6px);border-radius:24px;box-shadow:0 20px 44px #0003;padding:28px;color:#0f172a;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif}#controls .header{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:24px;flex:0 0 auto}#controls .title{font-size:var(--title-fs);font-weight:900;letter-spacing:.2px;line-height:1.02;margin:0}#controls .badge{font-size:13px;font-weight:700;color:#475569;background:#e2e8f0;padding:6px 10px;border-radius:999px;white-space:nowrap}#controls .body{display:flex;flex-direction:column;align-items:stretch;gap:28px;flex:0 1 auto;overflow:visible}#controls .card{background:#fff;border:1px solid #eaecef;border-radius:20px;padding:24px;box-shadow:0 1px #00000005}#controls .card-title{font-size:20px;font-weight:800;color:#334155;margin:0 0 16px}#controls .env .env-toggle{width:100%;height:88px;border-radius:18px;border:1px solid #e5e7eb;background:#f8fafc;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 18px;cursor:pointer;transition:box-shadow .2s ease,border-color .2s ease,background .2s ease}#controls .env .env-toggle:hover{border-color:#cbd5e1;box-shadow:0 2px 10px #0000000d}#controls .env .env-toggle .left{display:inline-flex;align-items:center;gap:14px}#controls .env .env-toggle .dots{display:inline-flex;gap:6px}#controls .env .env-toggle .dot{width:10px;height:10px;background:#94a3b8;border-radius:999px;opacity:.9}#controls .env .env-toggle .label{font-size:18px;font-weight:800;color:#0f172a}#controls .env .env-toggle .chev{font-size:20px;color:#334155;transform:rotate(0);transition:transform .2s ease}#controls .env.expanded .env-toggle .chev{transform:rotate(180deg)}#controls .env .env-gallery{overflow:hidden;transition:max-height .28s ease,opacity .22s ease,margin-top .22s ease;max-height:0;opacity:0;margin-top:0}#controls .env.expanded .env-gallery{max-height:1200px;opacity:1;margin-top:16px}#controls .env .tiles{display:grid;grid-template-columns:1fr 1fr;gap:16px}@media (min-width: 900px){#controls .env .tiles{grid-template-columns:1fr 1fr 1fr}}#controls .env .tile{position:relative;border-radius:18px;overflow:hidden;border:1px solid #e5e7eb;background:#f1f5f9;cursor:pointer;transition:transform .12s ease,box-shadow .2s ease,border-color .2s ease;height:160px}#controls .env .tile:hover{transform:translateY(-2px);border-color:#cbd5e1;box-shadow:0 12px 24px #0000001a}#controls .env .tile.active{outline:3px solid #111827;outline-offset:0;box-shadow:0 14px 28px #0000001f}#controls .env .tile img{width:100%;height:100%;object-fit:cover;opacity:.85;transition:opacity .2s,transform .2s}#controls .env .tile:hover img{opacity:1;transform:scale(1.02)}#controls .env .tile .caption{position:absolute;left:12px;bottom:12px;padding:8px 12px;font-weight:800;font-size:16px;color:#0f172a;background:#ffffffc7;border-radius:999px;border:1px solid rgba(15,23,42,.08)}#controls .card.actions{display:grid;grid-template-columns:1fr;gap:20px}#controls select,#controls button{width:100%;height:var(--btn-h);border-radius:22px;font-size:var(--btn-fs);font-weight:800;line-height:1.05}#controls select{border:1px solid #e5e7eb;background:#f8fafc;padding:0 22px;color:#111827;outline:none}#controls select:focus{border-color:#94a3b8;box-shadow:0 0 0 4px #94a3b840}#controls button{display:inline-flex;align-items:center;justify-content:center;gap:var(--btn-gap);padding:0 24px;color:#fff;border:0;cursor:pointer;transition:transform .04s,filter .15s,background .15s,color .15s;box-shadow:0 10px 24px #0000001a;background:#111827;min-width:0}#controls button.primary{background:#111827;color:#fff;box-shadow:0 10px 24px #0000001a}#controls button.secondary{background:#e7eaf0;color:#111827;box-shadow:0 10px 24px #0000000f}#controls button:hover{filter:brightness(1.06)}#controls button:active{transform:translateY(1px)}#controls button .ico{font-size:var(--ico-scale);line-height:0;display:inline-block;transform:translateY(2px);flex:0 0 auto}#controls button .lbl{font-size:var(--lbl-scale);flex:0 1 auto;min-width:0;white-space:normal;text-wrap:balance;overflow-wrap:anywhere;line-height:1.1}#controls .hint{font-size:13px;color:#64748b;margin-top:10px}#envOverlay{position:fixed;inset:0;z-index:30000;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .28s ease,visibility .28s ease}#envOverlay.active{opacity:1;visibility:visible;pointer-events:auto}#envOverlay .backdrop{position:absolute;inset:0;background:#0f172a73;backdrop-filter:blur(2px);opacity:0;transition:opacity .28s ease}#envOverlay.active .backdrop{opacity:1}#envOverlay .sheet{position:absolute;top:50%;left:50%;transform:translate(-50%,-45%) scale(.98);width:min(90vw,1800px);max-height:90vh;overflow:auto;background:#ffffff38;border-radius:22px;box-shadow:0 30px 80px #00000059;padding:28px;opacity:0;transition:transform .35s cubic-bezier(.22,.61,.36,1),opacity .35s ease;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif}#envOverlay.active .sheet{transform:translate(-50%,-50%) scale(1);opacity:1}#envOverlay .head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}#envOverlay .h{font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;font-size:28px;font-weight:900;color:#0f172a}#envOverlay .close{appearance:none;border:0;background:#0f172a;color:#fff;width:44px;height:44px;border-radius:12px;cursor:pointer}#envOverlay .grid{display:grid;grid-template-columns:repeat(4,minmax(220px,1fr));gap:24px;align-content:start}@media (max-width: 1400px){#envOverlay .grid{grid-template-columns:repeat(3,minmax(220px,1fr))}}@media (max-width: 980px){#envOverlay .grid{grid-template-columns:repeat(2,minmax(200px,1fr))}}#envOverlay .tile{position:relative;aspect-ratio:1 / 1;border-radius:18px;overflow:hidden;background:#f1f5f9;cursor:pointer;transition:transform .12s ease,box-shadow .2s ease,border-color .2s ease;opacity:0;transform:translateY(8px)}#envOverlay .tile:hover{transform:translateY(-2px);border-color:#cbd5e1;box-shadow:0 12px 24px #0000001a}#envOverlay.active .tile{animation:tileIn .35s ease forwards}@keyframes tileIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}#envOverlay .tile img{width:100%;height:100%;object-fit:cover;display:block;opacity:.9;transition:opacity .2s ease,transform .2s ease}#envOverlay .tile:hover img{opacity:1;transform:scale(1.02)}#envOverlay .tile .caption{position:absolute;left:12px;bottom:12px;padding:10px 14px;font-weight:800;font-size:16px;color:#0f172a;background:#ffffff6b;border-radius:999px}#controls .card.foot{padding:18px}#controls .doclink{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;text-decoration:none;color:#0f172a;background:#f8fafc;border:1px solid #e5e7eb;border-radius:14px;padding:14px 16px;transition:filter .15s ease,transform .04s ease,background .15s ease}#controls .doclink:hover{filter:brightness(1.03)}#controls .doclink:active{transform:translateY(1px)}#controls .doclink .ico{font-size:22px;line-height:0}#controls .doclink .txt{display:flex;flex-direction:column;gap:2px}#controls .doclink .txt .main{font-weight:800;font-size:16px}#controls .doclink .txt .sub{font-size:13px;color:#64748b}#controls .doclink .arrow{font-size:18px;color:#334155}#switchOverlay{position:fixed;inset:0;z-index:32000;display:grid;place-items:center;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .28s ease,visibility .28s ease;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif}#switchOverlay.active{opacity:1;visibility:visible;pointer-events:auto}#switchOverlay .backdrop{position:absolute;inset:0;background:#000000f2}#switchOverlay .card{position:relative;background:#fffffffa;border:1px solid #e5e7eb;border-radius:24px;padding:clamp(20px,3vw,36px);box-shadow:0 40px 100px #00000059;width:min(740px,calc(100vw - 64px));display:grid;gap:clamp(16px,2.5vw,24px);transform:translateY(6px) scale(.985);opacity:0;transition:transform .32s cubic-bezier(.22,.61,.36,1),opacity .32s ease}#switchOverlay.active .card{transform:translateY(0) scale(1);opacity:1}#switchOverlay .header{display:grid;grid-template-columns:auto 1fr;gap:clamp(14px,2vw,20px);align-items:center}#switchOverlay .icon{font-size:clamp(36px,6vw,64px);line-height:1}#switchOverlay .texts .title{font-weight:900;font-size:clamp(24px,3.2vw,40px);letter-spacing:.2px;color:#0f172a}#switchOverlay .texts .sub{margin-top:6px;font-size:clamp(14px,1.6vw,18px);color:#475569;font-weight:700}#switchOverlay .progress{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:center}#switchOverlay .ring{width:clamp(28px,5vw,38px);height:clamp(28px,5vw,38px);border-radius:999px;border:3px solid #e2e8f0;border-top-color:#0f172a;animation:spin 1s linear infinite}#switchOverlay .hint{font-size:clamp(13px,1.4vw,15px);color:#64748b}#switchOverlay .dots{display:inline-flex;gap:8px}#switchOverlay .dot{width:8px;height:8px;border-radius:999px;background:#111827;opacity:.35;animation:bounce 1s infinite ease-in-out}#switchOverlay .dot:nth-child(2){animation-delay:.1s}#switchOverlay .dot:nth-child(3){animation-delay:.2s}@keyframes spin{to{transform:rotate(360deg)}}@keyframes bounce{0%,80%,to{transform:translateY(0);opacity:.35}40%{transform:translateY(-5px);opacity:.85}}@media (prefers-reduced-motion: reduce){#switchOverlay,#switchOverlay .card{transition:none}#switchOverlay .ring{animation:none}}.env-label{font-size:var(--envlabel-fs);font-weight:900;color:#0f172a;padding:16px 18px;border:1px solid #e5e7eb;border-radius:16px;background:#f8fafc}@media (min-width: 2560px) and (max-width: 3839px){:root{--title-fs: 60px;--envlabel-fs: 40px;--btn-h: 100px;--btn-fs: 34px;--btn-gap: 22px;--ico-scale: 2em;--lbl-scale: 1.2em}#controls{width:min(560px,21vw);max-width:calc(100vw - 48px)}#controls .card{padding:16px}#controls .card-title{margin:0 0 12px}#controls .hint{margin-top:8px}}@media (min-width: 1801px) and (max-width: 2559px){:root{--title-fs: 44px;--envlabel-fs: 32px;--btn-h: 80px;--btn-fs: 28px;--btn-gap: 20px;--ico-scale: 1.8em;--lbl-scale: 1.18em}#controls{width:min(420px,22vw);max-width:calc(100vw - 48px)}#controls .hint{margin-top:6px}#controls .card{padding:12px}#controls .card-title{margin:0 0 10px}#envOverlay .sheet{width:min(90vw,1400px);padding:20px}}@media (max-width: 1800px){:root{--title-fs: 38px;--envlabel-fs: 30px;--btn-h: 72px;--btn-fs: 26px;--btn-gap: 18px;--ico-scale: 1.6em;--lbl-scale: 1.15em}#controls{padding:10px;width:min(380px,23vw)}#controls .card{padding:16px}#controls .doclink{padding:10px 12px;gap:8px}#controls .doclink .ico{font-size:18px}#controls .doclink .txt .main{font-size:14px}#controls .doclink .txt .sub{font-size:12px}#controls .doclink .arrow{display:none}}#mobileControls{position:fixed;left:0;right:0;bottom:0;height:auto;max-height:60vh;min-height:120px;z-index:10000;display:none;background:#fffffff5;backdrop-filter:saturate(120%) blur(6px);border-top-left-radius:18px;border-top-right-radius:18px;box-shadow:0 -18px 44px #0003;padding:12px 14px calc(12px + env(safe-area-inset-bottom,0px));color:#0f172a;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif}#mobileControls .mini-label{top:10px;right:12px;font-weight:900;font-size:14px;color:#0f172a;background:#f1f5f9;border:1px solid #e5e7eb;border-radius:999px;padding:6px 10px;text-decoration:none;cursor:pointer}#mobileControls .bar{position:static!important;left:12px;right:12px;bottom:12px;display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:12px}#mobileControls .icon-btn{appearance:none;border:0;border-radius:16px;height:64px;min-width:0;display:grid;place-items:center;font-size:34px;background:#111827;color:#fff;box-shadow:0 10px 24px #0000001f;transition:transform .04s,filter .15s,background .15s}#mobileControls .icon-btn.secondary{background:#e7eaf0;color:#111827;box-shadow:0 10px 24px #0000000f}#mobileControls .icon-btn:active{transform:translateY(1px)}#mobileControls .bottomrow{display:flex;flex-direction:column;justify-content:flex-end;gap:12px}#mobileControls .doclink{display:inline-grid;grid-auto-flow:column;align-items:center;justify-content:center;gap:8px;text-decoration:none;color:#0f172a;background:#f8fafc;border:1px solid #e5e7eb;border-radius:999px;padding:10px 14px;font-weight:800;font-size:14px;transition:filter .15s ease,transform .04s ease,background .15s ease}#mobileControls .doclink:hover{filter:brightness(1.03)}#mobileControls .doclink:active{transform:translateY(1px)}#mobileControls .env-label{all:unset;display:block;margin-left:1rem;font-weight:600;font-size:15px;text-align:left;color:#0f172a;line-height:1.2;margin-bottom:0}#mobileControls .toprow{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem;gap:12px}@media (max-width: 1528px){#controls{display:none!important}#mobileControls{display:block}}@media (max-width: 500px){#envOverlay .sheet{width:90vw;max-width:100vw;height:90vh;max-height:90vh;border-radius:16px 16px 0 0;padding:14px;transform:translate(-50%,-50%) scale(1);overflow:auto}#envOverlay .grid{grid-template-columns:1fr;gap:12px}#envOverlay .tile{aspect-ratio:16 / 9;transform:none}#envOverlay .h{font-size:20px}#envOverlay .close{width:38px;height:38px;border-radius:10px}}:root{--stage-red: #ef4444;--stage-orange: #f59e0b;--stage-green: #22c55e;--ls-stack-gap: clamp(12px, 1.2vw, 20px);--ls-gap: clamp(16px, 1.8vw, 28px);--ls-dot: clamp(32px, 2.8vw, 64px);--ls-ring-size: clamp(2px, .2vw, 5px);--ls-ring-offset: clamp(2px,.2vw, 4px);--ls-ring-mix: 55%;--ls-title-fs: clamp(16px, 2.6vw, 54px);--ls-title-py: 5px;--ls-title-px: 16px;--ls-title-radius: 16px}#learningStagesHUD{position:fixed;top:16px;left:16px;z-index:20000;pointer-events:auto;user-select:none;display:grid;grid-auto-flow:row;align-items:start;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:#0f172a}#learningStagesHUD .ls-title{font-weight:900;font-size:var(--ls-title-fs);letter-spacing:.2px;line-height:1.12;background:#fffffff5;border:1px solid #e5e7eb;border-radius:var(--ls-title-radius);padding:var(--ls-title-py) var(--ls-title-px);backdrop-filter:saturate(120%) blur(4px);margin-bottom:var(--ls-stack-gap)}#learningStagesHUD .ls-dots{margin-left:1rem;display:flex;gap:var(--ls-gap)}#learningStagesHUD .ls-dot{appearance:none;border:0;cursor:pointer;width:var(--ls-dot);height:var(--ls-dot);border-radius:999px;background:transparent;position:relative;transform:translateZ(0)}#learningStagesHUD .ls-dot:before{content:"";position:absolute;inset:0;border-radius:999px;background:var(--dot-color, var(--stage-green));box-shadow:0 8px 22px #0000002e,inset 0 0 0 2px #ffffffb3;opacity:.98;transition:transform .15s ease,opacity .15s ease,box-shadow .15s ease}#learningStagesHUD .ls-dot:after{content:"";position:absolute;inset:-8px;border-radius:999px;background:var(--dot-color, var(--stage-green));opacity:.22;filter:blur(10px);transition:opacity .15s ease,filter .15s ease,inset .15s ease;pointer-events:none}#learningStagesHUD .ls-dot:hover:before{transform:translateY(-1px);opacity:1}#learningStagesHUD .ls-dot.active{transform:translateY(-1px) scale(1.06)}#learningStagesHUD .ls-dot.active:after{inset:-12px;opacity:.55;filter:blur(14px)}#learningStagesHUD .ls-dot.active:before{box-shadow:0 10px 26px #0003,inset 0 0 0 2px #ffffffc7}#learningStagesHUD .ls-dot.active{outline:var(--ls-ring-size) solid color-mix(in srgb,var(--dot-color) var(--ls-ring-mix),transparent);outline-offset:var(--ls-ring-offset)}#learningStagesHUD .ls-dot:focus-visible{outline:4px solid rgba(17,24,39,.35);outline-offset:3px}@media (prefers-reduced-motion: reduce){#learningStagesHUD .ls-dot,#learningStagesHUD .ls-dot:before,#learningStagesHUD .ls-dot:after{transition:none}}@media (max-width: 1528px){#learningStagesHUD{left:50%;right:auto;transform:translate(-50%);align-items:center;width:max-content}#learningStagesHUD .ls-title{text-align:center}#learningStagesHUD .ls-dots{margin-left:0;justify-content:center}}