:root{--site-bg:#101820;--site-fg:#f2f0e8;--site-accent:#c6f56a;--site-on-accent:#101820;--site-surface:#182630;--site-muted:#a8b5b8;--site-border:#e8e5d829;--site-font:"PingFang SC", "Microsoft YaHei", "Noto Sans SC", system-ui, -apple-system, sans-serif;--site-radius:10px;--site-space:1;--site-type:1;--site-motion:1;--point-a:#c6f56a;--point-b:#5cc8ff;--point-c:#ff7a59;--space-unit:calc(24px * var(--site-space,1));--type-display:calc(48px * var(--site-type,1));--motion-unit:calc(.18s * var(--site-motion,1));--accent-tint:color-mix(in srgb, var(--site-accent) 12%, transparent);--accent-border:color-mix(in srgb, var(--site-accent) 55%, transparent);--scrim:#060a0e94;--panel-width-left:248px;--panel-width-right:312px}@media (prefers-reduced-motion:reduce){:root{--site-motion:0}}*{box-sizing:border-box}html,body{overscroll-behavior:none;height:100%;margin:0;overflow:hidden}body{background:var(--site-bg);color:var(--site-fg);font-family:var(--site-font);-webkit-font-smoothing:antialiased}#app{grid-template-rows:auto minmax(0,1fr) auto;height:100%;display:grid}button{font-family:inherit}button:focus-visible{outline:2px solid var(--site-fg);outline-offset:2px}#topbar{padding:calc(var(--space-unit) * .5) var(--space-unit);padding-top:calc(var(--space-unit) * .5 + env(safe-area-inset-top,0px));background:var(--site-surface);border-bottom:1px solid var(--site-border)}.brand{align-items:baseline;gap:calc(var(--space-unit) * .2) calc(var(--space-unit) * .6);flex-wrap:wrap;display:flex}#topbar h1{font-size:calc(26px * var(--site-type,1));letter-spacing:.02em;margin:0;font-weight:700;line-height:1.25}#topbar .en{color:var(--site-accent);letter-spacing:.08em;font-size:.72em;font-weight:600}#topbar .slogan{color:var(--site-muted);font-size:calc(14px * var(--site-type,1));margin:0}#workbench{grid-template-columns:var(--panel-width-left) minmax(0, 1fr) var(--panel-width-right);grid-template-areas:"controls stage data";min-height:0;display:grid}#stage{grid-area:stage;min-width:0;min-height:0;position:relative;overflow:hidden}#stage canvas{touch-action:none;cursor:grab;width:100%;height:100%;display:block}#stage canvas:active{cursor:grabbing}.panel-title{color:var(--site-muted);font-size:calc(12px * var(--site-type,1));letter-spacing:.12em;margin:0;font-weight:700}.panel-block{gap:calc(var(--space-unit) * .4);flex-direction:column;display:flex}#control-panel,#data-body{scrollbar-width:thin;scrollbar-color:var(--site-border) transparent}#control-panel::-webkit-scrollbar{width:8px}#data-body::-webkit-scrollbar{width:8px}#control-panel::-webkit-scrollbar-track{background:0 0}#data-body::-webkit-scrollbar-track{background:0 0}#control-panel::-webkit-scrollbar-thumb{background:var(--site-border);border-radius:999px}#data-body::-webkit-scrollbar-thumb{background:var(--site-border);border-radius:999px}#control-panel::-webkit-scrollbar-thumb:hover{background:var(--accent-border)}#data-body::-webkit-scrollbar-thumb:hover{background:var(--accent-border)}#control-panel{gap:calc(var(--space-unit) * .9);min-height:0;padding:calc(var(--space-unit) * .7) calc(var(--space-unit) * .6);background:var(--site-surface);border-right:1px solid var(--site-border);touch-action:pan-y;flex-direction:column;grid-area:controls;display:flex;overflow-y:auto}.solid-options{gap:calc(var(--space-unit) * .3);flex-direction:column;display:flex}.solid-button{appearance:none;width:100%;padding:calc(var(--space-unit) * .4) calc(var(--space-unit) * .5);border:1px solid var(--site-border);border-radius:var(--site-radius);background:var(--site-bg);color:var(--site-fg);text-align:left;cursor:pointer;transition:border-color var(--motion-unit) ease, background-color var(--motion-unit) ease, transform var(--motion-unit) ease;flex-direction:column;align-items:flex-start;gap:2px;display:flex}.solid-button:hover{border-color:var(--accent-border)}.solid-button:active{transform:scale(.98)}.solid-button.is-active{border-color:var(--site-accent);background:var(--accent-tint)}.solid-name{font-size:calc(15px * var(--site-type,1));font-weight:700}.solid-button.is-active .solid-name{color:var(--site-accent)}.solid-meta{color:var(--site-muted);font-size:calc(12px * var(--site-type,1));font-variant-numeric:tabular-nums}.tool-buttons{gap:calc(var(--space-unit) * .3);display:flex}.tool-buttons button{flex:1}#reset-view{appearance:none;border-radius:var(--site-radius);background:var(--site-accent);color:var(--site-on-accent);font-size:calc(14px * var(--site-type,1));padding:calc(var(--space-unit) * .3) calc(var(--space-unit) * .5);cursor:pointer;transition:filter var(--motion-unit) ease, transform var(--motion-unit) ease;border:none;font-weight:700}#reset-view:hover{filter:brightness(1.1)}#reset-view:active{transform:scale(.96)}#clear-points{appearance:none;border:1px solid var(--site-border);border-radius:var(--site-radius);background:var(--site-surface);color:var(--site-fg);font-size:calc(14px * var(--site-type,1));padding:calc(var(--space-unit) * .3) calc(var(--space-unit) * .5);cursor:pointer;transition:border-color var(--motion-unit) ease, color var(--motion-unit) ease, transform var(--motion-unit) ease;font-weight:600}#clear-points:hover{border-color:var(--site-accent);color:var(--site-accent)}#clear-points:active{transform:scale(.96)}.hint{color:var(--site-muted);font-size:calc(12px * var(--site-type,1));margin:0;line-height:1.7}#data-panel{background:var(--site-surface);border-left:1px solid var(--site-border);flex-direction:column;grid-area:data;min-height:0;display:flex}.data-header{align-items:center;gap:calc(var(--space-unit) * .4);padding:calc(var(--space-unit) * .5) calc(var(--space-unit) * .6);border-bottom:1px solid var(--site-border);display:flex}.data-summary{color:var(--site-accent);font-size:calc(12px * var(--site-type,1));font-variant-numeric:tabular-nums;white-space:nowrap;margin-left:auto;font-weight:700;display:none}#data-toggle{appearance:none;white-space:nowrap;border:1px solid var(--site-border);background:var(--site-bg);color:var(--site-fg);font-size:calc(12px * var(--site-type,1));padding:calc(var(--space-unit) * .15) calc(var(--space-unit) * .5);cursor:pointer;transition:border-color var(--motion-unit) ease;border-radius:999px;flex-shrink:0;align-items:center;gap:6px;margin-left:auto;font-weight:600;display:none}#data-toggle:hover{border-color:var(--accent-border)}#data-toggle .chevron{width:7px;height:7px;transition:transform var(--motion-unit) ease;border-bottom:2px solid;border-right:2px solid;transform:rotate(45deg)translateY(-1px)}#data-panel.is-collapsed #data-toggle .chevron{transform:rotate(-135deg)translateY(-1px)}#data-body{touch-action:pan-y;min-height:0;padding:calc(var(--space-unit) * .6);gap:calc(var(--space-unit) * .7);flex-direction:column;flex:1;display:flex;overflow-y:auto}#readout{gap:calc(var(--space-unit) * .3);flex-direction:column;display:flex}.readout-grid{gap:calc(var(--space-unit) * .4) calc(var(--space-unit) * .5);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.readout-item{min-width:0;padding:calc(var(--space-unit) * .35) calc(var(--space-unit) * .45);background:var(--site-bg);border:1px solid var(--site-border);border-radius:var(--site-radius);flex-direction:column;gap:2px;display:flex}.readout-label{color:var(--site-muted);font-size:calc(12px * var(--site-type,1));letter-spacing:.04em}.readout-value{color:var(--site-accent);font-size:calc(20px * var(--site-type,1));font-variant-numeric:tabular-nums;text-overflow:ellipsis;white-space:nowrap;font-weight:700;line-height:1.2;overflow:hidden}.readout-status{color:var(--site-muted);font-size:calc(12px * var(--site-type,1));margin:0;line-height:1.5}.readout-status.is-warning{color:var(--point-c)}.readout-units{color:var(--site-muted);font-size:calc(11px * var(--site-type,1));opacity:.85;margin:0;line-height:1.6}#preset-section{gap:calc(var(--space-unit) * .4);padding-top:calc(var(--space-unit) * .6);border-top:1px solid var(--site-border);flex-direction:column;display:flex}.preset-list{gap:calc(var(--space-unit) * .3);flex-direction:column;display:flex}.preset-button{appearance:none;align-items:center;gap:calc(var(--space-unit) * .45);width:100%;padding:calc(var(--space-unit) * .35) calc(var(--space-unit) * .45);border:1px solid var(--site-border);border-radius:var(--site-radius);background:var(--site-bg);color:var(--site-fg);text-align:left;cursor:pointer;transition:border-color var(--motion-unit) ease, background-color var(--motion-unit) ease, transform var(--motion-unit) ease;grid-template-columns:auto minmax(0,1fr);display:grid}.preset-button:hover{border-color:var(--accent-border)}.preset-button:active{transform:scale(.98)}.preset-button.is-active{border-color:var(--site-accent);background:var(--accent-tint)}.preset-index{border:1px solid var(--site-border);width:24px;height:24px;color:var(--site-muted);font-size:calc(12px * var(--site-type,1));font-variant-numeric:tabular-nums;transition:background-color var(--motion-unit) ease, color var(--motion-unit) ease, border-color var(--motion-unit) ease;border-radius:999px;place-items:center;font-weight:800;display:grid}.preset-button.is-active .preset-index{background:var(--site-accent);color:var(--site-on-accent);border-color:#0000}.preset-text{flex-direction:column;gap:1px;min-width:0;display:flex}.preset-name{font-size:calc(13px * var(--site-type,1));font-weight:700;line-height:1.35}.preset-button.is-active .preset-name{color:var(--site-accent)}.preset-meta{color:var(--site-muted);font-size:calc(11px * var(--site-type,1))}.preset-note{padding:calc(var(--space-unit) * .4) calc(var(--space-unit) * .45);border-left:3px solid var(--site-border);border-radius:0 calc(var(--site-radius) * .6) calc(var(--site-radius) * .6) 0;background:var(--site-bg);color:var(--site-muted);font-size:calc(12px * var(--site-type,1));transition:border-color var(--motion-unit) ease;margin:0;line-height:1.7}.preset-note.is-active{border-left-color:var(--site-accent);color:var(--site-fg)}#view-controls{align-items:center;gap:calc(var(--space-unit) * .3) calc(var(--space-unit) * .6);padding:calc(var(--space-unit) * .4) var(--space-unit);padding-bottom:calc(var(--space-unit) * .4 + env(safe-area-inset-bottom,0px));background:var(--site-surface);border-top:1px solid var(--site-border);flex-wrap:wrap;display:flex}#drawer-toggle{appearance:none;white-space:nowrap;border:1px solid var(--site-border);border-radius:var(--site-radius);background:var(--site-bg);color:var(--site-fg);font-size:calc(14px * var(--site-type,1));padding:calc(var(--space-unit) * .3) calc(var(--space-unit) * .7);cursor:pointer;transition:border-color var(--motion-unit) ease, color var(--motion-unit) ease;flex-shrink:0;align-items:center;font-weight:700;display:none}#drawer-toggle:hover,#drawer-toggle[aria-expanded=true]{border-color:var(--site-accent);color:var(--site-accent)}.hint--mobile{display:none}.point-chips{gap:calc(var(--space-unit) * .25);display:flex}.point-chip{border:1px solid var(--site-border);border-radius:calc(var(--site-radius) * .6);width:24px;height:24px;color:var(--site-muted);font-size:calc(12px * var(--site-type,1));opacity:.55;transition:background-color var(--motion-unit) ease, color var(--motion-unit) ease, opacity var(--motion-unit) ease;place-items:center;font-weight:800;display:grid}.point-chip.is-placed{opacity:1;color:var(--site-on-accent);border-color:#0000}.point-chip--a.is-placed{background:var(--point-a)}.point-chip--b.is-placed{background:var(--point-b)}.point-chip--c.is-placed{background:var(--point-c)}.point-label{z-index:5;min-width:20px;height:20px;color:var(--site-on-accent);font-size:calc(12px * var(--site-type,1));pointer-events:none;will-change:transform;border:1.5px solid #1018208c;border-radius:999px;place-items:center;padding:0 5px;font-weight:800;line-height:1;display:grid;position:absolute;top:0;left:0;box-shadow:0 1px 6px #00000073}.point-label[hidden]{display:none}.point-label--a{background:var(--point-a)}.point-label--b{background:var(--point-b)}.point-label--c{background:var(--point-c)}.visually-hidden{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}#drawer-scrim{z-index:35;background:var(--scrim);position:fixed;inset:0}#drawer-scrim[hidden]{display:none}@media (max-width:1279px) and (min-width:1024px){:root{--panel-width-left:216px;--panel-width-right:288px}}@media (max-width:1023px){#topbar{padding:calc(var(--space-unit) * .35) calc(var(--space-unit) * .6);padding-top:calc(var(--space-unit) * .35 + env(safe-area-inset-top,0px))}#topbar h1{font-size:calc(20px * var(--site-type,1))}#workbench{grid-template:"stage"minmax(0,1fr)"data"/minmax(0,1fr)}#control-panel{z-index:40;width:min(320px,86vw);padding-top:calc(var(--space-unit) * .7 + env(safe-area-inset-top,0px));padding-bottom:calc(var(--space-unit) * .7 + env(safe-area-inset-bottom,0px));padding-left:calc(var(--space-unit) * .6 + env(safe-area-inset-left,0px));border-right:1px solid var(--site-border);transition:transform var(--motion-unit) ease;position:fixed;top:0;bottom:0;left:0;transform:translate(-105%);box-shadow:12px 0 32px #00000059}#control-panel.is-open{transform:translate(0)}#data-panel{border-left:none;border-top:1px solid var(--site-border);max-height:min(46vh,420px)}#data-panel.is-collapsed{max-height:none}#data-panel.is-collapsed #data-body{display:none}#data-panel.is-collapsed .data-summary{display:inline}#data-panel.is-collapsed #data-toggle{margin-left:0}#data-toggle{display:inline-flex}#data-body{padding:calc(var(--space-unit) * .5) calc(var(--space-unit) * .6);gap:calc(var(--space-unit) * .5)}.readout-grid{gap:calc(var(--space-unit) * .3);grid-template-columns:repeat(4,minmax(0,1fr))}.readout-item{padding:calc(var(--space-unit) * .25) calc(var(--space-unit) * .35)}.readout-value{font-size:calc(16px * var(--site-type,1))}.preset-list{gap:calc(var(--space-unit) * .3);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}#drawer-toggle{display:inline-flex}.hint--mobile{flex-basis:100%;order:9;display:block}#view-controls{padding:calc(var(--space-unit) * .3) calc(var(--space-unit) * .6);padding-bottom:calc(var(--space-unit) * .3 + env(safe-area-inset-bottom,0px));gap:calc(var(--space-unit) * .25) calc(var(--space-unit) * .5)}}@media (max-width:479px){#topbar .slogan{display:none}.readout-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.preset-list{grid-template-columns:minmax(0,1fr)}.preset-name{font-size:calc(12px * var(--site-type,1))}}#webgl-fallback{z-index:10;padding:var(--space-unit);background:var(--site-bg);place-items:center;display:grid;position:absolute;inset:0}#webgl-fallback[hidden]{display:none}.fallback-card{max-width:34em;padding:var(--space-unit);background:var(--site-surface);border:1px solid var(--site-border);border-radius:var(--site-radius);text-align:center}.fallback-card h2{margin:0 0 calc(var(--space-unit) * .5);font-size:var(--type-display);color:var(--site-accent);line-height:1.15}.fallback-card p{color:var(--site-muted);font-size:calc(14px * var(--site-type,1));margin:0;line-height:1.7}.noscript-card{left:var(--space-unit);right:var(--space-unit);bottom:var(--space-unit);padding:calc(var(--space-unit) * .6);background:var(--site-surface);border:1px solid var(--site-border);border-radius:var(--site-radius);text-align:center;position:fixed}#topbar{align-items:center;gap:calc(var(--space-unit) * .6);display:flex}.brand{flex:1;min-width:0}.topbar-actions{gap:calc(var(--space-unit) * .25);flex-shrink:0;display:flex}.topbar-actions button{appearance:none;border:1px solid var(--site-border);background:var(--site-bg);color:var(--site-fg);font-size:calc(13px * var(--site-type,1));white-space:nowrap;padding:calc(var(--space-unit) * .15) calc(var(--space-unit) * .55);cursor:pointer;transition:border-color var(--motion-unit) ease, color var(--motion-unit) ease, background-color var(--motion-unit) ease;border-radius:999px;font-weight:700}.topbar-actions button:hover{border-color:var(--accent-border);color:var(--site-accent)}#tutorial-toggle[aria-expanded=true]{background:var(--site-accent);color:var(--site-on-accent);border-color:#0000}#rules-toggle[aria-expanded=true]{border-color:var(--site-accent);color:var(--site-accent)}#tutorial-card{left:calc(var(--space-unit) * .5);bottom:calc(var(--space-unit) * .5);z-index:8;width:min(360px, calc(100% - var(--space-unit)));max-height:calc(100% - var(--space-unit));padding:calc(var(--space-unit) * .55) calc(var(--space-unit) * .6);background:color-mix(in srgb, var(--site-surface) 94%, transparent);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid var(--accent-border);border-left:4px solid var(--site-accent);border-radius:var(--site-radius);flex-direction:column;display:flex;position:absolute;overflow:hidden;box-shadow:0 12px 32px #00000073}#tutorial-card[hidden]{display:none}.tutorial-scroll{touch-action:pan-y;scrollbar-width:thin;scrollbar-color:var(--site-border) transparent;flex:1;min-height:0;overflow-y:auto}.tutorial-scroll::-webkit-scrollbar{width:8px}.tutorial-scroll::-webkit-scrollbar-track{background:0 0}.tutorial-scroll::-webkit-scrollbar-thumb{background:var(--site-border);border-radius:999px}.tutorial-scroll::-webkit-scrollbar-thumb:hover{background:var(--accent-border)}.tutorial-head{align-items:center;gap:calc(var(--space-unit) * .35);flex-shrink:0;display:flex}.tutorial-foot{flex-shrink:0}.tutorial-badge{background:var(--site-accent);color:var(--site-on-accent);font-size:calc(11px * var(--site-type,1));letter-spacing:.08em;border-radius:999px;padding:2px 9px;font-weight:800}.tutorial-count{color:var(--site-muted);font-size:calc(12px * var(--site-type,1));font-variant-numeric:tabular-nums;margin-left:auto}#tutorial-exit{appearance:none;color:var(--site-muted);font-size:calc(12px * var(--site-type,1));cursor:pointer;background:0 0;border:none;padding:2px 4px;font-weight:600}#tutorial-exit:hover{color:var(--site-fg)}#tutorial-title{margin:calc(var(--space-unit) * .35) 0 calc(var(--space-unit) * .25);color:var(--site-fg);font-size:calc(16px * var(--site-type,1));font-weight:800;line-height:1.35}#tutorial-body{color:var(--site-fg);font-size:calc(13px * var(--site-type,1));margin:0;line-height:1.7}.tutorial-tip{margin:calc(var(--space-unit) * .3) 0 0;padding:calc(var(--space-unit) * .25) calc(var(--space-unit) * .4);border-left:3px solid var(--point-b);border-radius:0 calc(var(--site-radius) * .6) calc(var(--site-radius) * .6) 0;background:var(--site-bg);color:var(--site-muted);font-size:calc(12px * var(--site-type,1));line-height:1.6}.tutorial-tip[hidden]{display:none}.tutorial-progress{margin:calc(var(--space-unit) * .4) 0;gap:6px;display:flex}.tutorial-dot{background:var(--site-border);width:8px;height:8px;transition:background-color var(--motion-unit) ease, transform var(--motion-unit) ease;border-radius:999px}.tutorial-dot.is-done{background:var(--accent-border)}.tutorial-dot.is-active{background:var(--site-accent);transform:scale(1.25)}.tutorial-actions{align-items:center;gap:calc(var(--space-unit) * .3);display:flex}.tutorial-actions button{appearance:none;border-radius:var(--site-radius);font-size:calc(13px * var(--site-type,1));padding:calc(var(--space-unit) * .22) calc(var(--space-unit) * .5);cursor:pointer;transition:filter var(--motion-unit) ease, border-color var(--motion-unit) ease, transform var(--motion-unit) ease;font-weight:700}.tutorial-actions button:active{transform:scale(.97)}#tutorial-prev{border:1px solid var(--site-border);background:var(--site-bg);color:var(--site-fg)}#tutorial-prev:disabled{opacity:.45;cursor:default}#tutorial-next{background:var(--site-accent);color:var(--site-on-accent);border:none}#tutorial-next:hover{filter:brightness(1.1)}#tutorial-rules{color:var(--point-b);text-underline-offset:3px;background:0 0;border:none;margin-left:auto;padding:2px 4px;font-weight:600;text-decoration:underline}.tutorial-target{outline:2px solid var(--site-accent);outline-offset:2px;animation:tutorial-pulse calc(var(--motion-unit) * 6) ease-in-out infinite}.data-header.tutorial-target{outline-offset:-2px}@keyframes tutorial-pulse{0%,to{box-shadow:0 0 0 0 var(--accent-tint)}50%{box-shadow:0 0 0 6px var(--accent-tint)}}#rules-dialog{z-index:60;padding:calc(var(--space-unit) * .6);background:var(--scrim);place-items:center;display:grid;position:fixed;inset:0}#rules-dialog[hidden]{display:none}.rules-card{background:var(--site-surface);border:1px solid var(--accent-border);border-radius:var(--site-radius);flex-direction:column;width:min(720px,100%);max-height:min(86vh,780px);display:flex;overflow:hidden;box-shadow:0 24px 64px #00000080}.rules-header{align-items:center;gap:calc(var(--space-unit) * .4);padding:calc(var(--space-unit) * .5) calc(var(--space-unit) * .6);border-bottom:1px solid var(--site-border);display:flex}.rules-header h2{font-size:calc(18px * var(--site-type,1));margin:0;font-weight:800}.rules-sub{margin-left:calc(var(--space-unit) * .3);color:var(--site-muted);font-size:calc(12px * var(--site-type,1));font-weight:600}#rules-close{appearance:none;border:1px solid var(--site-border);background:var(--site-bg);color:var(--site-fg);font-size:calc(12px * var(--site-type,1));padding:calc(var(--space-unit) * .12) calc(var(--space-unit) * .5);cursor:pointer;transition:border-color var(--motion-unit) ease, color var(--motion-unit) ease;border-radius:999px;margin-left:auto;font-weight:700}#rules-close:hover{border-color:var(--site-accent);color:var(--site-accent)}.rules-body{touch-action:pan-y;min-height:0;padding:calc(var(--space-unit) * .6);gap:calc(var(--space-unit) * .6);scrollbar-width:thin;scrollbar-color:var(--site-border) transparent;flex-direction:column;flex:1;display:flex;overflow-y:auto}.rules-body::-webkit-scrollbar{width:8px}.rules-body::-webkit-scrollbar-track{background:0 0}.rules-body::-webkit-scrollbar-thumb{background:var(--site-border);border-radius:999px}.rules-body::-webkit-scrollbar-thumb:hover{background:var(--accent-border)}.rules-section h3{margin:0 0 calc(var(--space-unit) * .25);color:var(--site-accent);font-size:calc(14px * var(--site-type,1));letter-spacing:.04em;font-weight:800}.rules-section h3:before{content:"";background:var(--site-accent);border-radius:2px;width:8px;height:8px;margin-right:8px;display:inline-block}.rules-section:nth-child(2) h3:before{background:var(--point-b)}.rules-section:nth-child(3) h3:before{background:var(--point-c)}.rules-section:nth-child(4) h3:before{background:var(--point-a)}.rules-section:nth-child(5) h3:before{background:var(--point-b)}.rules-section:nth-child(6) h3:before{background:var(--point-c)}.rules-section ul{flex-direction:column;gap:4px;margin:0;padding-left:1.2em;display:flex}.rules-section li{color:var(--site-fg);font-size:calc(13px * var(--site-type,1));line-height:1.75}.rules-section li::marker{color:var(--site-accent)}.rules-section kbd{border:1px solid var(--site-border);background:var(--site-bg);color:var(--site-accent);border-bottom-width:2px;border-radius:5px;padding:1px 6px;font-family:inherit;font-size:.9em;font-weight:700}.rules-footer{gap:calc(var(--space-unit) * .3);padding:calc(var(--space-unit) * .45) calc(var(--space-unit) * .6);border-top:1px solid var(--site-border);display:flex}.rules-footer button{appearance:none;border-radius:var(--site-radius);font-size:calc(13px * var(--site-type,1));padding:calc(var(--space-unit) * .25) calc(var(--space-unit) * .6);cursor:pointer;transition:filter var(--motion-unit) ease, border-color var(--motion-unit) ease, color var(--motion-unit) ease;font-weight:700}#rules-start-tutorial{background:var(--site-accent);color:var(--site-on-accent);border:none}#rules-start-tutorial:hover{filter:brightness(1.1)}#rules-done{border:1px solid var(--site-border);background:var(--site-bg);color:var(--site-fg)}#rules-done:hover{border-color:var(--site-accent);color:var(--site-accent)}@media (max-width:1023px){#tutorial-card{width:min(320px, calc(100% - var(--space-unit) * .8))}.rules-card{max-height:88vh}}@media (max-width:479px){.topbar-actions button{font-size:calc(12px * var(--site-type,1));padding:calc(var(--space-unit) * .12) calc(var(--space-unit) * .4)}#tutorial-title{font-size:calc(15px * var(--site-type,1))}#tutorial-body{font-size:calc(12px * var(--site-type,1))}.rules-sub{display:none}}@media (prefers-reduced-motion:reduce){.tutorial-target{animation:none}}