.motion-page{--card:var(--surface);--warn:#f08a6c;--split:0}.motion-layout{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(340px,1fr);border-top:1px solid var(--line)}.motion-stage{position:sticky;top:0;height:100vh;overflow:hidden;background:#15171c}#scene{width:100%;height:100%;display:block}.motion-copy{padding:0 clamp(24px,3vw,44px) 40vh;border-left:1px solid var(--line);font-size:16px;line-height:1.9;color:var(--soft)}.motion-copy h1,.motion-copy h2{color:var(--text)}.motion-stage .hud{position:absolute;left:20px;bottom:18px;display:flex;gap:18px;font:600 12px/1.3 ui-monospace,Menlo,monospace;background:#0d0e11d1;border:1px solid var(--line);border-radius:12px;padding:8px 14px;color:var(--ink);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.motion-stage .hud b{display:block;font-size:19px}.progress{position:absolute;left:20px;top:16px;display:flex;gap:6px}.progress a{width:28px;height:28px;border-radius:50%;border:1.5px solid var(--line-strong);color:var(--ink);display:grid;place-items:center;font:700 12px ui-monospace,monospace;background:var(--card)}.progress a[aria-current]{background:var(--gold);border-color:var(--gold);color:var(--on-gold)}.view-tag{position:absolute;top:56px;padding:4px 12px;border-radius:999px;background:var(--ink);color:var(--paper);font-size:13px;opacity:var(--split);pointer-events:none}.view-tag.left{left:20px}.view-tag.right{left:calc(100% - 50% * var(--split) + 16px)}.divider{position:absolute;top:0;bottom:0;left:calc(100% - 50% * var(--split));width:3px;background:var(--paper);opacity:var(--split)}.motion-stage.portrait .view-tag.right{left:16px;top:auto;bottom:calc(50% * var(--split) - 40px)}.motion-stage.portrait .divider{left:0;right:0;width:auto;height:3px;top:auto;bottom:calc(50% * var(--split))}.lens{position:absolute;right:18px;bottom:88px;width:calc(var(--lens,0) * 1px);height:calc(var(--lens,0) * 1px);border:3px solid var(--ink);border-radius:14px;opacity:var(--lens-on,0);pointer-events:none;box-shadow:0 8px 24px #0006}.lens span{position:absolute;left:10px;top:-14px;background:var(--gold);color:var(--on-gold);font-size:12px;padding:2px 10px;border-radius:999px}.no-script{position:absolute;inset:auto 20px 20px;background:var(--card);border:1px solid var(--line);padding:12px 16px}.motion-copy .lesson-breadcrumb{display:flex;gap:8px;font-size:12px;color:var(--muted);padding-top:22px}.motion-intro{min-height:100vh;padding-top:24vh}.motion-intro h1{font-family:var(--serif);font-size:clamp(34px,3.4vw,52px);font-weight:600;line-height:1.3;margin:0 0 14px}.motion-intro .lesson-tags{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0}.motion-intro .lesson-tags span{font-family:var(--mono);font-size:12px;color:var(--soft);border:1px solid var(--line-strong);border-radius:999px;padding:2px 12px}.scroll-hint{color:var(--accent);font-size:14px}.motion-copy section{min-height:100vh;padding-top:24vh}.motion-copy .no{font:700 12px ui-monospace,monospace;letter-spacing:.14em;color:var(--accent);margin:0}.motion-copy h2{font-family:var(--serif);font-size:30px;font-weight:600;line-height:1.3;margin:6px 0 14px}.motion-copy .q{border-left:3px solid var(--accent);padding:2px 0 2px 14px;color:var(--accent)}.motion-copy .key{color:var(--accent);border-left:3px solid var(--accent);background:var(--gold-soft);padding:8px 12px;border-radius:0 10px 10px 0}.motion-copy .box{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px 16px}.motion-copy .box.warn{color:var(--warn)}.motion-copy .rules{padding-left:1.2em}.ctl{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}.ctl button{font:inherit;font-size:14px;min-height:36px;border:1px solid var(--line-strong);background:var(--card);border-radius:999px;padding:4px 16px;cursor:pointer;color:var(--ink);transition:background-color .3s var(--ease),border-color .3s var(--ease)}.ctl button:hover{background:var(--raise);border-color:var(--gold)}.ctl button:focus-visible,.progress a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.motion-copy input[type=range]{width:100%;accent-color:var(--accent)}.segments{border-collapse:collapse;width:100%;font:13px/1.5 ui-monospace,Menlo,monospace;margin:12px 0}.segments td,.segments th{border-bottom:1px solid var(--line);padding:6px 4px;text-align:right}.segments td:first-child,.segments th:first-child{text-align:left}.segments .total td{font-weight:700}.motion-copy .motion-notes{min-height:0;padding:10vh 0 0}.motion-notes summary{cursor:pointer;color:var(--accent)}.back-link{display:inline-block;margin-top:18px;color:var(--accent)}@media(max-width:820px){.motion-layout{display:block}.motion-stage{height:50vh;z-index:2;border-bottom:1px solid var(--line)}.motion-copy{padding:0 16px 50vh;border-left:0}.motion-intro{min-height:0;padding-top:6vh}.motion-copy section{min-height:90vh;padding-top:8vh}.motion-stage .hud{inset:8px 8px auto auto;gap:10px;padding:4px 8px;font-size:10px}.motion-stage .hud b{font-size:13px}.progress{left:8px;top:8px}.progress a{width:24px;height:24px}.view-tag{top:40px;font-size:12px}}