.rule-reader{min-height:100vh;min-height:100dvh;background:radial-gradient(ellipse at 50% 20%,#202925 0%,#111715 64%);color:#eee8d9;font-family:Georgia,'Times New Roman',serif}.rule-header{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:24px max(22px,env(safe-area-inset-left));max-width:1000px;margin:0 auto;font-size:13px}.rule-header a{color:#c8c6b9;min-height:44px;display:flex;align-items:center}.rule-header span{color:#bca579;font-size:10px;letter-spacing:.2em;white-space:nowrap}.rule-shell{width:min(100%,690px);padding:22px 28px 30px;margin:0 auto}.rule-progress{display:grid;grid-template-columns:1fr auto;align-items:center;gap:14px;margin-bottom:24px;font-family:Cinzel,Georgia,serif}.rule-progress .eyebrow{margin:0;color:#bca579;font-size:9px}.rule-progress>span{font-size:12px;color:#c7c8ba;font-variant-numeric:tabular-nums}.rule-track{grid-column:1/-1;height:2px;background:#ffffff14;border-radius:2px;overflow:hidden}.rule-track>span{display:block;width:10%;height:100%;background:#cfb77e;transition:width .18s ease}.rule-card{min-height:420px;padding:28px 30px 32px;border:1px solid #bda57430;border-radius:18px;background:#ffffff02;position:relative}.rule-card[hidden],.rule-navigation [hidden]{display:none!important}.rule-emblem{font-size:29px;line-height:1;color:#c2a66f;margin-bottom:22px}.rule-kicker{font-family:Cinzel,Georgia,serif;font-size:9px!important;letter-spacing:.15em;color:#a7b2a8!important;margin:0 0 12px!important}.rule-card h1{font-family:'Uncial Antiqua',Georgia,serif;font-size:clamp(29px,5.4vw,43px);font-weight:400;line-height:1.23;letter-spacing:-.02em;margin:0 0 24px;color:#eee5cf}.rule-card h1:focus{outline:none}.rule-card p{font-size:17px;line-height:1.68;color:#c5cabc;margin:16px 0}.rule-card strong{color:#f0e6ce;font-weight:600}.rule-example{border-top:1px solid #bda57426;margin-top:26px;padding-top:21px;display:grid;gap:9px}.rule-example span{font-family:Cinzel,Georgia,serif;font-size:9px;letter-spacing:.1em;line-height:1.6;color:#9eaa9b}.rule-example strong{font-size:18px;line-height:1.5;color:#d3b980;font-weight:400}.rule-navigation{display:flex;justify-content:space-between;gap:16px;margin-top:22px}.rule-navigation button,.rule-navigation a{font:14px Georgia,serif;min-height:48px;padding:13px 18px;border-radius:12px;display:flex;align-items:center;justify-content:center;text-align:center;touch-action:manipulation}.rule-navigation button:disabled{opacity:.3}.rule-navigation .primary{background:#cfb77e;color:#192119;min-width:145px}.swipe-hint{font:10px Cinzel,Georgia,serif;text-align:center;letter-spacing:.06em;color:#879486;margin:20px 0 0}.rule-deck{touch-action:pan-y}.rule-reader a:focus-visible,.rule-reader button:focus-visible{outline:2px solid #e4cb99;outline-offset:4px}@media(max-width:480px){.rule-header{padding:12px 20px;font-size:12px}.rule-header span{font-size:8px;letter-spacing:.12em}.rule-shell{padding:12px 20px 24px}.rule-progress{margin-bottom:18px}.rule-card{padding:24px 22px;min-height:390px;border-radius:16px}.rule-card p{font-size:16px;line-height:1.6}.rule-card h1{margin-bottom:20px}.rule-example{margin-top:22px;padding-top:18px}.rule-example strong{font-size:17px}.rule-navigation{gap:10px;margin-top:18px}.rule-navigation button,.rule-navigation a{font-size:13px;padding:12px 13px}.rule-navigation .primary{min-width:135px}}@media(max-height:500px) and (min-aspect-ratio:1/1){.rule-header{padding-top:5px;padding-bottom:5px}.rule-shell{padding-top:5px}.rule-card{min-height:0;padding:20px 26px}.rule-emblem{display:none}.rule-card h1{font-size:30px;margin-bottom:15px}.rule-card p{font-size:16px;margin:10px 0}.rule-example{margin-top:18px;padding-top:15px}.rule-navigation{margin-top:16px}}@media(prefers-reduced-motion:reduce){.rule-track>span{transition:none}}
/* Keep the next step in reach, even while a longer card scrolls. */
html{scroll-behavior:auto}
.rule-shell{padding-bottom:calc(108px + env(safe-area-inset-bottom))}
.rule-navigation{position:fixed;z-index:20;left:50%;bottom:0;transform:translateX(-50%);width:min(100%,634px);margin:0;padding:14px 20px calc(14px + env(safe-area-inset-bottom));background:#111715;border-top:1px solid #bda57430;box-shadow:0 -12px 25px #11171590}
.rule-navigation button,.rule-navigation a{flex:0 1 auto}
@media(max-height:650px) and (max-aspect-ratio:1/1){.rule-header{padding-top:5px;padding-bottom:5px}.rule-shell{padding-top:6px}.rule-progress{gap:10px;margin-bottom:14px}.rule-card{min-height:0;padding:20px}.rule-emblem{font-size:23px;margin-bottom:15px}.rule-card h1{font-size:28px;margin-bottom:17px}.rule-card p{font-size:16px;line-height:1.55;margin:13px 0}.rule-example{margin-top:18px;padding-top:16px}.rule-navigation{padding-top:11px;padding-bottom:calc(11px + env(safe-area-inset-bottom))}.swipe-hint{margin-top:15px}}
.rule-navigation .primary{background:#c1cbb3;color:#112015}.rule-progress .eyebrow,.rule-header span,.rule-emblem{color:#c1cbb3}.rule-track>span{background:#c1cbb3}
/* V11: opaque reading surface. Illustrations are separate from the text. */
.rule-reader{background:#111715}.rule-card{background:#1c241f;border:1px solid #465344;box-shadow:0 14px 36px #0003}.rule-card:before,.rule-card:after{content:none!important}.rule-card p{color:#d1d5c9}.rule-card h1{color:#f2eddc}.rule-header .overview-link{font-size:11px;color:#c1cbb3;text-align:right}.rule-visual{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px;padding:20px 14px;margin:24px 0 0;border-radius:12px;background:#111915;border:1px solid #ffffff10;overflow:hidden}.lesson-hand{display:grid;gap:11px;text-align:center;min-width:0}.lesson-dice{display:flex;gap:7px;justify-content:center}.lesson-die{width:42px;height:42px;flex:0 0 42px;display:grid;grid-template:repeat(3,1fr)/repeat(3,1fr);gap:3px;padding:8px;border-radius:8px;background:linear-gradient(135deg,#ebe7d7,#b8b9a7);border:1px solid #e3e0cc;box-shadow:0 3px 0 #707666,0 5px 10px #0005}.pip-slot{border-radius:50%;display:block;background:transparent}.pip-slot.is-pip{background:#18251c;box-shadow:inset 0 1px 1px #0007}.lesson-die.focus-die{outline:2px solid #d0b16e;outline-offset:3px}.hand-caption{font:11px Georgia,serif;color:#c8cdbf;line-height:1.4}.duel-symbol{font:17px Georgia,serif;color:#b6c1ad;align-self:center}.visual-life{font:48px Cinzel,Georgia,serif;color:#c9d3b9;text-align:center;line-height:1.1;padding:0 10px}.visual-life small{display:block;font:8px Cinzel,Georgia,serif;letter-spacing:.08em;margin-top:10px}.visual-total{font:30px Cinzel,Georgia,serif;color:#d0d8c5}.visual-banner{width:100%;display:flex;justify-content:center;gap:14px;align-items:center;border-top:1px solid #ffffff14;padding-top:14px;margin-top:4px;color:#c8d2b9;font:13px Georgia,serif}.visual-banner span{color:#ecdfbc}.visual-banner em{font-size:12px;color:#87957f}.rule-example{margin-top:18px;padding-top:18px}.rule-example strong{color:#d2dabc}.fallen-player{color:#87917f;opacity:.5}.last-player{color:#d6dfc7}@keyframes lesson-roll{0%{transform:translateY(-8px) rotate(-60deg);opacity:.35}60%{transform:translateY(3px) rotate(8deg);opacity:1}100%{transform:translateY(0) rotate(0)}}@keyframes lesson-reveal{0%,25%{opacity:0;transform:translateY(8px)}100%{opacity:1;transform:none}}@keyframes lesson-heal{0%{color:#8f9b85;transform:scale(.94)}60%{color:#e1ebcf;transform:scale(1.06)}100%{transform:scale(1)}}@keyframes lesson-loss{0%{opacity:0;transform:translateX(15px)}100%{opacity:1;transform:none}}
@media(prefers-reduced-motion:no-preference){.rule-card:not([hidden]) .lesson-total .lesson-die,.rule-card:not([hidden]) .lesson-setup .lesson-die{animation:lesson-roll .55s ease-out both}.rule-card:not([hidden]) .lesson-total .lesson-die:nth-child(2),.rule-card:not([hidden]) .lesson-setup .lesson-die:nth-child(2){animation-delay:.08s}.rule-card:not([hidden]) .lesson-total .lesson-die:nth-child(3),.rule-card:not([hidden]) .lesson-setup .lesson-die:nth-child(3){animation-delay:.16s}.rule-card:not([hidden]) .reroll-result .focus-die{animation:lesson-roll .7s ease-out both}.rule-card:not([hidden]) .visual-total,.rule-card:not([hidden]) .lesson-stop .visual-banner,.rule-card:not([hidden]) .choice-result{animation:lesson-reveal .7s ease-out both}.rule-card:not([hidden]) .heal-result,.rule-card:not([hidden]) .last-player{animation:lesson-heal .75s ease-out both}.rule-card:not([hidden]) .damage-result{animation:lesson-loss .6s ease-out both}}
@media(max-width:400px){.rule-visual{padding:18px 8px;gap:8px}.lesson-dice{gap:5px}.lesson-die{width:30px;height:30px;flex-basis:30px;padding:5px;gap:2px;border-radius:6px}.hand-caption{font-size:9px}.duel-symbol{font-size:13px}.visual-banner{font-size:12px;gap:10px}.lesson-setup .lesson-die,.lesson-total .lesson-die{width:38px;height:38px;flex-basis:38px;padding:7px}.visual-life{font-size:37px}.visual-life small{font-size:7px}.visual-total{font-size:24px}}
.rule-reader .rule-card{background:#1c241f!important;background-image:none!important}.rule-reader .rule-card:before,.rule-reader .rule-card:after{display:none!important}.rule-reader .rule-card h1{color:#f2eddc}.rule-reader .rule-card p{color:#d1d5c9}
@media(max-width:350px){.rule-visual .lesson-die{width:27px;height:27px;flex-basis:27px;padding:5px;gap:2px}.rule-visual .lesson-dice{gap:4px}.rule-visual{gap:7px}.rule-visual .hand-caption{max-width:91px;font-size:9px}.lesson-setup .lesson-die,.lesson-total .lesson-die{width:35px;height:35px;flex-basis:35px}}