.page-viewer{height:100vh;overflow:hidden}.page-viewer #app{display:flex;height:100vh}.page-viewer #canvas-wrap{flex:1;position:relative}.page-viewer canvas{display:block}.page-viewer #panel{width:360px;padding:20px 24px;overflow-y:auto;background:var(--panel);border-right:1px solid var(--line);font-size:13px;line-height:1.5}.page-viewer #panel h1{font-size:16px;margin-bottom:2px}.page-viewer .back-link{display:inline-block;color:var(--accent-cool);text-decoration:none;font-size:12px;margin-bottom:8px}.page-viewer .back-link:hover{text-decoration:underline}.page-viewer #panel .sub{color:var(--muted);font-size:12px;margin-bottom:16px}.page-viewer #panel h2{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--pine-dim);margin:18px 0 6px}.page-viewer #panel table{border-collapse:collapse;width:100%}.page-viewer #panel td{padding:2px 8px 2px 0;white-space:nowrap}.page-viewer #panel td.dim{font-variant-numeric:tabular-nums;color:var(--ink-dim)}.page-viewer #panel ol{list-style:decimal;padding-left:20px;margin:4px 0 0}.page-viewer .chapter-h{display:flex;justify-content:space-between;align-items:baseline;margin:14px 0 2px;padding-bottom:3px;border-bottom:1px solid var(--line);font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--accent-cool-soft)}.page-viewer .chapter-h .chapter-n{color:var(--faint-cool);text-transform:none;letter-spacing:0;font-size:10px}.page-viewer #panel li{margin-bottom:4px;cursor:pointer;padding:3px 6px 5px;border-radius:5px;border:1px solid transparent;position:relative}.page-viewer .step-progress{position:absolute;left:0;bottom:0;height:2px;width:0%;background:var(--accent-cool);border-radius:1px}.page-viewer #panel li:hover{background:var(--hover)}.page-viewer #panel li.sel{background:var(--sel);border-color:var(--line-cool)}.page-viewer #panel li.run-toggle{list-style:none;color:var(--accent-cool-soft);font-size:11px;padding:2px 6px}.page-viewer #panel li.run-hidden{display:none}.page-viewer #panel .run-arrow{display:inline-block;width:10px;color:var(--faint-cool)}.page-viewer #panel .final-list{list-style:none;padding-left:20px;margin-top:2px}.page-viewer #panel .final-row{color:var(--ok)}.page-viewer #panel .hint{font-weight:400;text-transform:none;letter-spacing:0;color:var(--faint-cool);font-size:11px}.page-viewer #transport{margin-left:8px;display:inline-flex;gap:4px;vertical-align:middle}.page-viewer .tbtn{background:var(--ok-bg);color:var(--ok);border:1px solid var(--ok-line);border-radius:4px;padding:3px 8px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}.page-viewer .tbtn:hover{background:var(--ok-bg-hover)}.page-viewer .tbtn svg{width:13px;height:13px}.page-viewer #panel .final-row{display:flex;align-items:center;gap:6px}.page-viewer #panel .final-row svg{width:13px;height:13px}.page-viewer .anno-label{background:color-mix(in srgb,var(--panel) 88%,transparent);border:1px solid var(--line-cool);color:var(--accent-cool-ink);padding:1px 7px;border-radius:4px;font-size:11px;white-space:nowrap;font-family:var(--sans)}.page-viewer .anno-dim{color:var(--accent-cool);font-size:10px;background:color-mix(in srgb,var(--bg) 75%,transparent);padding:0 4px;border-radius:3px;white-space:nowrap;font-variant-numeric:tabular-nums;font-family:var(--sans)}.page-viewer #panel .anim-tag{display:inline-block;font-size:10px;background:var(--chip);color:var(--accent-cool);border-radius:3px;padding:0 5px;margin-right:4px}.page-viewer #status{position:absolute;left:12px;bottom:calc(100vh - 100dvh + 10px + env(safe-area-inset-bottom));font-size:12px;color:var(--muted)}.page-viewer #fps{position:absolute;left:12px;bottom:calc(100vh - 100dvh + 30px + env(safe-area-inset-bottom));font-size:11px;color:var(--faint-cool);font-variant-numeric:tabular-nums}.page-viewer #reset-view{position:absolute;right:14px;bottom:calc(100vh - 100dvh + 12px + env(safe-area-inset-bottom));background:color-mix(in srgb,var(--panel) 92%,transparent);border:1px solid var(--line-cool);color:var(--accent-cool-ink);border-radius:6px;padding:5px 11px;font-size:12px;cursor:pointer;opacity:0;pointer-events:none;transition:opacity .2s;display:inline-flex;align-items:center;gap:6px}.page-viewer #reset-view svg{width:13px;height:13px}.page-viewer #reset-view.visible{opacity:1;pointer-events:auto}.page-viewer #reset-view:hover{background:var(--sel)}.page-viewer #method-badge{display:inline-block;padding:2px 8px;border-radius:4px;font-weight:600;font-size:12px}.page-viewer #method-badge.dado{background:var(--ok-bg);color:var(--ok)}.page-viewer #method-badge.screws{background:var(--warm-bg);color:var(--warm)}.page-viewer #menu-btn{display:none}.page-viewer .noscript-info{max-width:680px;margin:0 auto;padding:40px 24px}.page-viewer .noscript-info h1{font-size:24px;margin-bottom:8px}@media(max-width:768px){.page-viewer #menu-btn{display:inline-flex;align-items:center;justify-content:center;position:fixed;top:10px;left:10px;z-index:30;background:color-mix(in srgb,var(--panel) 92%,transparent);border:1px solid var(--line-cool);color:var(--accent-cool-ink);border-radius:6px;padding:8px;cursor:pointer}.page-viewer #menu-btn svg{width:17px;height:17px}.page-viewer #panel{display:none;position:fixed;inset:0;width:100%;z-index:25;padding-top:54px;padding-bottom:calc(100vh - 100dvh + 24px + env(safe-area-inset-bottom));border-right:none}body.panel-open .page-viewer #panel{display:block}body.panel-open .param-panel{display:none}.param-panel{max-width:60vw}}