:root{font-family:Heebo,Arial,sans-serif;color-scheme:dark;--bg:#081620;--paper:#eee5ce;--muted:#aabbb9;--gold:#edbb5f;--copper:#97764a;--line:#43504b;--teal:#79d2c0;color:var(--paper);background:var(--bg)}
*{box-sizing:border-box}body{margin:0}button,a{touch-action:manipulation}button{font:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid var(--teal);outline-offset:5px}button:disabled{cursor:default}p,h1,h2,h3{margin:0}button{color:inherit} .masthead{height:76px;margin:auto;max-width:1320px;padding:0 40px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #9f825c33}.small-brand{display:flex;align-items:center;gap:12px}.small-brand img{width:36px;height:36px;object-fit:contain}.small-brand span{font-size:12px;color:#bba781}.masthead nav{display:flex;gap:28px;align-items:center}.masthead nav a,.masthead nav button{display:flex;align-items:center;min-height:48px;background:none;border:0;padding:0;font-size:13px;color:#c7c8b9}.masthead nav a:hover,.masthead nav button:hover{color:var(--gold)}
.title-screen{position:relative;isolation:isolate;overflow:hidden}.chamber{position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 50% 30%,#08162022,#08162099 80%),linear-gradient(0deg,#081620 0%,#08162000 40%,#08162044 100%),url('chamber-background.webp?asset=0fd90822ff5b') center 44%/cover no-repeat}.stage{display:grid;grid-template-columns:1fr 420px 1fr;align-items:center;max-width:1260px;padding:38px 38px 20px;margin:auto;min-height:580px;gap:24px}.entry{text-align:center;position:relative;z-index:2}.game-logo{width:105px;height:auto;display:block;margin:0 auto 12px;filter:drop-shadow(0 8px 16px #000b)}.kicker{display:flex;align-items:center;justify-content:center;gap:12px;color:#bba781;font-size:12px;font-weight:500;letter-spacing:.04em}.kicker span{width:24px;height:1px;background:#9d7b45aa}h1{font-size:43px;font-weight:900;line-height:1.22;letter-spacing:-.035em;margin:14px -20px 14px;color:#f2e5c8;text-shadow:0 3px 0 #0006}.intro{font-size:16px;line-height:1.8;color:#c3d0cb}.play-menu{width:320px;max-width:100%;margin:26px auto 0}.start-button{display:flex;align-items:center;justify-content:center;gap:20px;width:100%;min-height:56px;padding:10px 18px;background:var(--gold);color:#17232e;border:1px solid #f4d188;border-radius:3px;font-size:21px;font-weight:900;box-shadow:0 4px #9f742a,0 7px 20px #0005,inset 0 1px 0 #fff3cf,inset 0 -2px 0 #00000026;text-shadow:0 1px 0 #ffe4ab;transition:filter .15s,transform .15s}.start-button:hover{filter:brightness(1.09);transform:translateY(-1px)}.button-note{font-size:12px;color:#adbcb6;text-align:center;margin:10px 0 15px}.plate-button{position:relative;isolation:isolate;display:grid;gap:2px;align-content:center;min-height:65px;border:0;border-radius:0;background:linear-gradient(135deg,#937457,#4e4a3e 40%,#85664a 75%,#393e38);clip-path:polygon(5px 0,calc(100% - 5px) 0,100% 5px,100% calc(100% - 5px),calc(100% - 5px) 100%,5px 100%,0 calc(100% - 5px),0 5px);font-size:17px;font-weight:700;transition:filter .15s}.plate-button:before{content:'';position:absolute;inset:1px;z-index:-1;background:linear-gradient(#11262edc,#0c1d27ee),url('slate-ui/badge-plate.webp?asset=6314a61d2924') center/160% 280%;clip-path:polygon(4px 0,calc(100% - 4px) 0,100% 4px,100% calc(100% - 4px),calc(100% - 4px) 100%,4px 100%,0 calc(100% - 4px),0 4px)}.plate-button:hover{filter:brightness(1.2)}.plate-button:focus-visible{clip-path:none}.plate-button small{font-size:11px;font-weight:400;color:#aabbb9}.learn-link{display:block;margin:13px auto 0;min-height:44px;background:none;border:0;font-size:13px;color:#c9b98e}.learn-link:hover{color:var(--gold)}.learn-link span{padding-right:6px}.wing{position:relative;height:340px;min-width:0;filter:drop-shadow(0 24px 23px #0009);margin-top:45px}.show-card{position:relative;aspect-ratio:459/673;container-type:inline-size}.wing .show-card{width:190px;position:absolute;top:35px}.wing-right .back-card{right:-8px;transform:rotate(13deg) translateY(-18px);filter:brightness(.7)}.wing-right .front-card{right:80px;transform:rotate(-7deg)}.wing-left .back-card{left:-8px;transform:rotate(-13deg) translateY(-18px);filter:brightness(.7)}.wing-left .front-card{left:80px;transform:rotate(7deg)}.painted-card{border-radius:4.5% / 3.1%;box-shadow:0 8px 20px #0008}.mobile-fan{display:none}

footer{max-width:960px;padding:18px 24px;margin:auto;color:#8d9e9e;text-align:center;font-size:11px;border-top:1px solid #8e724433}footer p{line-height:1.8;max-width:800px;margin:auto}footer nav{display:flex;flex-wrap:wrap;justify-content:center;column-gap:24px;margin-top:4px}footer a{display:inline-flex;align-items:center;min-height:44px;font-size:11px}footer a:hover{color:var(--gold)}

#guide{width:min(650px,calc(100% - 28px));max-height:calc(100dvh - 32px);overflow:auto;padding:24px;color:var(--paper);background:linear-gradient(145deg,#142d34,#091a25);border:1px solid #8f794f;border-top:3px solid #a9976c;border-radius:6px;box-shadow:0 24px 80px #0009}#guide::backdrop{background:#020b11da;backdrop-filter:blur(5px)}.dialog-top{display:flex;align-items:center;justify-content:space-between;gap:12px}.dialog-top h2{font-size:23px}.close-guide{flex:none;width:44px;height:44px;background:#10242d;border:1px solid #8f794f;font-size:27px;border-radius:2px}.guide-intro{font-size:14px;color:var(--muted);margin-top:8px;line-height:1.7}.demo{display:grid;grid-template-columns:1fr 90px 1fr;align-items:center;gap:20px;background:linear-gradient(#07131d99,#081722bb),url('chamber-background.webp?asset=0fd90822ff5b') center/cover;border:1px solid #6b5636;margin:20px 0 14px;padding:20px 24px;box-shadow:inset 0 0 30px #0009}.combatant{text-align:center;min-width:0}.combatant>span{display:block;font-size:13px;color:var(--teal);margin-bottom:12px}.opponent>span{color:#bd9cef}.combatant .show-card{width:100%;max-width:140px;margin:auto}.combatant>p{font-size:12px;color:var(--muted);margin-top:14px;min-height:30px;line-height:1.5}.combatant b{color:var(--teal);font-size:18px}.opponent b{color:#bd9cef}.prize{text-align:center}.prize span,.prize small{display:block;font-size:11px;color:#c4b78e}.prize>b{display:block;font-size:50px;line-height:1.3;color:var(--gold)}.hidden-card{position:relative;max-width:140px;margin:auto}.real-card-back{position:absolute;inset:0;background:url('slate-ui/back-v3.webp?asset=333da4eeda50') center/100% 100%;border-radius:5px;box-shadow:0 8px 18px #000a}.demo.revealed .real-card-back{display:none}.demo.revealed .combatant:first-child .show-card{outline:2px solid var(--teal);outline-offset:3px;box-shadow:0 0 28px #79d2c033}.demo-result{text-align:center;min-height:59px}.demo-result strong{font-size:18px;color:var(--gold)}.demo-result p{font-size:13px;color:var(--muted);margin-top:5px}.reveal-button{font-size:17px;min-height:48px;margin-top:10px}.type-rule{padding:25px 0 20px;margin-top:25px;border-top:1px solid #536052;text-align:center}.type-rule h3{font-size:17px}.type-cycle{display:flex;align-items:center;justify-content:center;gap:18px;margin:15px 0}.type-cycle span{display:grid;justify-items:center;gap:6px;font-size:12px}.type-cycle i{display:block;width:24px;height:28px}.type-cycle svg{display:block;width:100%;height:100%}.type-cycle>b{color:#ac9666}.type-rule>p{font-size:12px;color:var(--muted);line-height:1.7}.extra-rules{border-top:1px solid #536052}.extra-rules details{border-bottom:1px solid #3c5052}.extra-rules summary{cursor:pointer;font-size:14px;min-height:48px;padding:14px 0}.extra-rules p{color:var(--muted);font-size:14px;line-height:1.8;margin:0 0 15px}.guide-start{font-size:18px;margin-top:22px}
@media(min-width:1400px){.stage{gap:40px}.wing .show-card{width:205px}.wing-right .front-card{right:88px}.wing-left .front-card{left:88px}}
@media(max-width:1100px) and (min-width:701px){.stage{grid-template-columns:1fr 340px 1fr;gap:4px;padding-inline:28px}.wing .show-card{width:155px}.wing-right .back-card{right:-25px}.wing-left .back-card{left:-25px}.wing-right .front-card{right:25px}.wing-left .front-card{left:25px}.wing{height:275px}h1{font-size:36px}}
@media(max-width:700px){.masthead{height:62px;padding:0 18px}.small-brand img{width:30px;height:30px}.small-brand span{display:none}.masthead nav{gap:22px}.masthead nav a,.masthead nav button{font-size:12px;min-height:48px}.stage{display:block;min-height:0;padding:17px 20px 0}.chamber{background:linear-gradient(#08162044,#08162033 40%,#081620 97%),url('chamber-background.webp?asset=0fd90822ff5b') center top/auto 660px no-repeat}.wing{display:none}.game-logo{width:70px;margin-bottom:8px}.kicker{font-size:10px;gap:8px}.kicker span{width:18px}h1{font-size:33px;margin:8px -5px 8px;line-height:1.2}.intro{font-size:13px;line-height:1.7}.mobile-fan{display:flex;justify-content:center;align-items:center;height:141px;width:255px;max-width:100%;margin:10px auto 7px;position:relative;direction:ltr}.mobile-fan .show-card{width:83px;flex:none;filter:drop-shadow(0 8px 10px #0009)}.mobile-fan .show-card:first-child{transform:rotate(-13deg) translate(6px,4px)}.mobile-fan .show-card:nth-child(2){z-index:2;width:92px;transform:translateY(-3px)}.mobile-fan .show-card:last-child{transform:rotate(13deg) translate(-6px,4px)}.play-menu{width:310px;margin-top:4px}.start-button{min-height:49px;font-size:19px;padding:7px 14px}.button-note{font-size:11px;margin:8px 0 11px}.plate-button{min-height:53px;font-size:15px}.plate-button small{font-size:10px}.learn-link{min-height:44px;font-size:11px;margin-top:5px}footer{margin:0 20px;padding:20px 0 15px;font-size:10px}footer nav{gap:17px}footer a{font-size:10px}#guide{padding:17px}.dialog-top h2{font-size:19px}.guide-intro{font-size:12px}.demo{gap:10px;grid-template-columns:1fr 55px 1fr;padding:16px 12px}.prize>b{font-size:37px}.prize span,.prize small{font-size:9px}.combatant>p{font-size:10px;min-height:35px}.combatant b{font-size:15px}.demo-result strong{font-size:16px}.demo-result p{font-size:12px}.type-rule>p{font-size:11px}.type-rule h3{font-size:15px}}
/* Clip the layered paper/artwork to the same rounded edge as the game cards. */
.show-card.painted-card{overflow:hidden}
/* Keep the complete fan inside the chamber at narrow desktop/tablet widths. */
@media(min-width:701px) and (max-width:900px){
 .wing .show-card{width:120px}
 .wing-right .back-card{right:0}.wing-left .back-card{left:0}
 .wing-right .front-card{right:25px}.wing-left .front-card{left:25px}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* Production states and accessibility. */
/* Fit the desktop welcome screen to the available height without clipping content. */
@media(min-width:701px){
 body#landing{min-height:100dvh;display:flex;flex-direction:column}
 .masthead{width:100%;height:64px;flex:none}
 #landing>main{flex:1;display:grid;align-content:center}
 .stage{min-height:0;padding-block:24px 12px}
 footer{width:100%;padding-block:12px;margin:0 auto;flex:none}
}
@media(min-width:701px) and (max-height:850px){
 .stage{padding-block:14px 8px}
 .game-logo{width:80px;margin-bottom:8px}
 h1{margin-block:10px}
 .play-menu{margin-top:16px}
 .learn-link{margin-top:6px}
}
.skip-link{position:fixed;top:-100px;right:20px;z-index:10;padding:12px 20px;background:var(--gold);color:#17232e}.skip-link:focus{top:12px}.learn-link{display:flex;justify-content:center;align-items:center}.returning[hidden]{display:none}.returning{display:grid;gap:5px;margin:10px 0 0;padding:10px;border-top:1px solid #93745788;color:var(--muted);font-size:12px;overflow-wrap:anywhere}.returning a{display:flex;align-items:center;justify-content:center;min-height:44px;color:var(--gold);font-weight:700}.no-script{padding:16px;text-align:center;color:var(--muted)}.demo-result bdi{white-space:nowrap}.combatant>p bdi{white-space:nowrap}

.learn-link.learn-primary{min-height:48px;margin:0 0 12px;border:1px solid var(--gold);border-radius:4px;background:#19333c;color:var(--paper);font-size:18px;font-weight:700}
.guide{width:min(760px,calc(100% - 40px));margin:8px auto 40px;padding-top:28px;border-top:1px solid #8e724433;color:var(--muted);font-size:15px;line-height:1.8}
.guide h2{margin:0 0 8px;color:var(--gold);font-size:clamp(22px,3.6vw,28px);line-height:1.4}
.guide h3{margin:22px 0 4px;color:var(--paper);font-size:18px}
.guide p{margin:0 0 10px}
.guide ol{margin:12px 0;padding-inline-start:22px}
.guide li{margin-bottom:6px}
.guide strong{color:var(--paper)}
.guide-links{display:flex;flex-wrap:wrap;gap:8px 24px}
.guide-links a{display:inline-flex;align-items:center;min-height:44px;color:var(--gold);text-underline-offset:4px}
