.hero-stage{perspective:900px;justify-content:center;align-items:center;width:100%;height:clamp(250px,52vw,400px);display:flex;position:relative}.mono-3d-board{aspect-ratio:1;width:clamp(250px,64vw,380px);transform-style:preserve-3d;background:#cfe8d8;border:5px solid #fff;grid-template:repeat(11,1fr)/repeat(11,1fr);animation:6s ease-in-out infinite boardFloat;display:grid;transform:rotateX(58deg)rotate(-38deg);box-shadow:-24px 30px 40px #00000073}@keyframes boardFloat{50%{transform:rotateX(58deg)rotate(-38deg)translateZ(14px)}}.mono-board-center{background:#cfe8d8;border:0;grid-area:2/2/11/11;place-items:center;display:grid}.mono-board-center span{background:var(--red);color:#fff;font-family:var(--font-heading);letter-spacing:.05em;border:2px solid #fff;padding:4px 10px;font-size:clamp(12px,3.6vw,22px);font-weight:700;transform:rotate(-45deg)scale(1.15);box-shadow:0 4px 10px #00000040}.tophat-svg{filter:drop-shadow(0 12px 8px #0006);pointer-events:none;width:clamp(90px,24vw,140px);margin-left:-8%;animation:3s ease-in-out infinite hatHover;position:absolute;top:0;left:50%}@keyframes hatHover{50%{transform:translateY(-8px)rotate(-3deg)}}.dice-char{filter:drop-shadow(0 6px 4px #0006);-webkit-user-select:none;user-select:none;font-size:clamp(40px,10vw,64px);line-height:1;animation:4s ease-in-out infinite diceWiggle;position:absolute}.dice-1{bottom:6%;left:6%;transform:rotate(-14deg)}.dice-2{bottom:14%;right:6%;transform:rotate(18deg)}@keyframes diceWiggle{50%{transform:scale(1.05)rotate(10deg)}}.hero-cta-btn{min-width:240px;font-family:var(--font-heading);cursor:pointer;text-align:center;border:none;border-radius:14px;flex-direction:column;gap:3px;padding:14px 28px;font-size:20px;font-weight:700;text-decoration:none;transition:transform .15s,box-shadow .15s,filter .15s;display:flex;box-shadow:0 4px 14px #00000040}.hero-cta-btn:hover{filter:brightness(1.04);transform:translateY(-2px);box-shadow:0 6px 18px #0000004d}.hero-cta-btn:active{transform:translateY(2px);box-shadow:0 2px 8px #00000040}.hero-cta-btn small{font-family:var(--font-body);letter-spacing:.01em;font-size:13px;font-weight:600}@media (width<=560px){.hero-stage{height:clamp(210px,48vw,290px)}.mono-3d-board{width:clamp(200px,56vw,290px)}.hero-cta-btn{min-width:100%;max-width:360px;padding:12px 20px;font-size:18px}}.rules-top-nav-bar{top:calc(env(safe-area-inset-top,0px) + 50px);z-index:30;background-color:var(--bg);border-bottom:1px solid var(--border);flex-direction:column;align-items:center;gap:8px;margin-bottom:20px;padding:16px 6px 12px;display:flex;position:sticky;overflow:visible}.rules-chapter-track{justify-content:center;align-items:center;gap:clamp(4px,1.2vw,8px);width:100%;max-width:660px;padding:4px 0;display:flex;overflow:visible}.rules-chapter-btn{border:1px solid var(--border);background-color:var(--card);height:clamp(36px,4.5vw,42px);color:var(--ink);cursor:pointer;white-space:nowrap;font-family:var(--font-heading);transition:background-color var(--transition-fast), border-color var(--transition-fast), color var(--transition-fast), transform var(--transition-fast), box-shadow var(--transition-fast);-webkit-user-select:none;user-select:none;border-radius:9px;flex:1 1 0;justify-content:center;align-items:center;gap:clamp(3px,.8vw,6px);min-width:0;max-width:66px;padding:0 clamp(4px,1.4vw,12px);font-size:clamp(11px,1.2vw,13px);font-weight:600;display:inline-flex;position:relative;overflow:visible}.rules-chapter-btn:hover{background-color:var(--red-subtle);border-color:var(--red);color:var(--red);transform:translateY(-2px);box-shadow:0 3px 10px #d6202e26}.rules-chapter-btn:hover .rules-chapter-num{color:var(--red)}.rules-chapter-btn.active{background-color:var(--red);border-color:var(--red);color:#fff;box-shadow:0 2px 8px #d6202e47}.rules-chapter-btn.active .rules-chapter-num{color:#ffffffe6}.rules-chapter-num{letter-spacing:.04em;color:var(--mute);transition:color var(--transition-fast);flex-shrink:0;font-size:clamp(9.5px,1.1vw,12px);font-weight:700}.rules-topic-icon{flex-shrink:0;width:clamp(14px,1.8vw,18px);height:clamp(14px,1.8vw,18px)}.rules-chapter-tooltip{color:#fff;font-family:var(--font-heading);white-space:nowrap;pointer-events:none;z-index:70;opacity:0;visibility:hidden;background-color:#0f172a;border:1px solid #334155;border-radius:7px;padding:5px 11px;font-size:12px;font-weight:600;transition:opacity .2s cubic-bezier(.16,1,.3,1),transform .2s cubic-bezier(.16,1,.3,1),visibility .2s;position:absolute;bottom:calc(100% + 9px);left:50%;transform:translate(-50%)translateY(4px);box-shadow:0 4px 14px #00000040}.rules-chapter-tooltip:after{content:"";border:5px solid #0000;border-top-color:#0f172a;position:absolute;top:100%;left:50%;transform:translate(-50%)}@media (hover:hover) and (pointer:fine){.rules-chapter-btn:hover .rules-chapter-tooltip,.rules-chapter-btn:focus-visible .rules-chapter-tooltip{opacity:1;visibility:visible;transform:translate(-50%)translateY(0)}}.rules-chapter-indicator{font-family:var(--font-heading);color:var(--mute);transition:color var(--transition-fast);text-align:center;justify-content:center;align-items:center;gap:6px;width:100%;min-height:22px;padding:0 4px;font-size:clamp(12px,1.5vw,14px);display:flex}.rules-chapter-indicator.hovered{color:var(--red)}.rules-indicator-label{letter-spacing:.04em;text-transform:uppercase;white-space:nowrap;font-size:clamp(10px,1.2vw,11px);font-weight:700}.rules-indicator-divider{opacity:.4}.rules-indicator-title{color:var(--ink);transition:color var(--transition-fast);white-space:nowrap;text-overflow:ellipsis;font-size:clamp(12.5px,1.5vw,14.5px);font-weight:600;overflow:hidden}.rules-chapter-indicator.hovered .rules-indicator-title{color:var(--red)}.rules-content-section{width:100%;max-width:900px;margin:0 auto}.rules-topic-banner{border-bottom:1px solid var(--border);margin-bottom:20px;padding-bottom:16px}.rules-topic-title{letter-spacing:-.015em;color:var(--ink);margin:6px 0 8px;font-size:clamp(22px,3.2vw,32px)}.rules-topic-desc{color:var(--mute);margin:0;font-size:clamp(14px,1.8vw,16px);line-height:1.5}@media (width<=360px){.rules-chapter-track{gap:3px}.rules-chapter-btn{gap:2px;height:34px;padding:0 2px}.rules-chapter-num{font-size:9px}.rules-indicator-label{font-size:9.5px}.rules-indicator-title{font-size:11.5px}}:root{--bg:#f8fafc;--card:#fff;--card-subtle:#f1f5f9;--border:#e2e8f0;--border-strong:#cbd5e1;--ink:#0f172a;--ink-secondary:#334155;--mute:#64748b;--red:#d6202e;--red-hover:#b91c1c;--red-subtle:#d6202e14;--green:#0d8a4d;--green-hover:#096e3c;--green-subtle:#0d8a4d14;--amber:#d97706;--amber-hover:#b45309;--amber-subtle:#d9770614;--slate:#334155;--slate-subtle:#3341550f;--tip-bg:#f8fafc;--tip-border:#cbd5e1;--tip-text:#334155;--warn-bg:#fffbeb;--warn-border:#fde68a;--warn-text:#92400e;--good-bg:#f0fdf4;--good-border:#bbf7d0;--good-text:#166534;--shadow-sm:0 1px 3px #0f172a0d;--shadow-md:0 4px 12px #0f172a14;--shadow-lg:0 12px 28px #0f172a1f;--blue:var(--slate);--sky:var(--slate);--brown:var(--slate);--pink:var(--red);--orange:var(--amber);--yellow:var(--amber);--font-heading:"Fredoka", system-ui, sans-serif;--font-body:"Nunito", system-ui, sans-serif;--radius-sm:6px;--radius-md:10px;--radius-lg:14px;--radius-full:9999px;--transition-fast:.15s ease;--transition-normal:.25s ease}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#0b0f19;--card:#131d2e;--card-subtle:#1c283d;--border:#23334d;--border-strong:#334668;--ink:#f8fafc;--ink-secondary:#e2e8f0;--mute:#94a3b8;--red:#e23643;--red-hover:#f87171;--red-subtle:#e2364326;--green:#10b981;--green-hover:#34d399;--green-subtle:#10b98126;--amber:#f59e0b;--amber-hover:#fbbf24;--amber-subtle:#f59e0b26;--slate:#94a3b8;--slate-subtle:#94a3b81a;--tip-bg:#152033;--tip-border:#2b3e5e;--tip-text:#cbd5e1;--warn-bg:#2e1f0c;--warn-border:#5c3d14;--warn-text:#fde68a;--good-bg:#0d281e;--good-border:#1a533c;--good-text:#a7f3d0;--shadow-sm:0 1px 3px #0000004d;--shadow-md:0 4px 12px #00000073;--shadow-lg:0 12px 28px #0009}}:root[data-theme=dark]{--bg:#0b0f19;--card:#131d2e;--card-subtle:#1c283d;--border:#23334d;--border-strong:#334668;--ink:#f8fafc;--ink-secondary:#e2e8f0;--mute:#94a3b8;--red:#e23643;--red-hover:#f87171;--red-subtle:#e2364326;--green:#10b981;--green-hover:#34d399;--green-subtle:#10b98126;--amber:#f59e0b;--amber-hover:#fbbf24;--amber-subtle:#f59e0b26;--slate:#94a3b8;--slate-subtle:#94a3b81a;--tip-bg:#152033;--tip-border:#2b3e5e;--tip-text:#cbd5e1;--warn-bg:#2e1f0c;--warn-border:#5c3d14;--warn-text:#fde68a;--good-bg:#0d281e;--good-border:#1a533c;--good-text:#a7f3d0;--shadow-sm:0 1px 3px #0000004d;--shadow-md:0 4px 12px #00000073;--shadow-lg:0 12px 28px #0009}:root[data-theme=light]{--bg:#f8fafc;--card:#fff;--card-subtle:#f1f5f9;--border:#e2e8f0;--border-strong:#cbd5e1;--ink:#0f172a;--ink-secondary:#334155;--mute:#64748b;--red:#d6202e;--red-hover:#b91c1c;--red-subtle:#d6202e14;--green:#0d8a4d;--green-hover:#096e3c;--green-subtle:#0d8a4d14;--amber:#d97706;--amber-hover:#b45309;--amber-subtle:#d9770614;--slate:#334155;--slate-subtle:#3341550f;--tip-bg:#f8fafc;--tip-border:#cbd5e1;--tip-text:#334155;--warn-bg:#fffbeb;--warn-border:#fde68a;--warn-text:#92400e;--good-bg:#f0fdf4;--good-border:#bbf7d0;--good-text:#166534;--shadow-sm:0 1px 3px #0f172a0d;--shadow-md:0 4px 12px #0f172a14;--shadow-lg:0 12px 28px #0f172a1f}*,:before,:after{box-sizing:border-box}html{scroll-behavior:smooth;height:100%;scroll-padding-top:120px}body{background-color:var(--bg);color:var(--ink);font-family:var(--font-body);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);transition:background-color var(--transition-normal), color var(--transition-normal);margin:0;font-size:16px;line-height:1.6}h1,h2,h3,h4,button,.f{font-family:var(--font-heading)}a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid var(--red);outline-offset:2px}ul{padding-left:20px}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}