/* MAX9 V4 — mobile-first, game-first. */
:root{--ink:#101b32;--table:#123c55;--cyan:#35d0cf;--lime:#dff45b;--cream:#fff9ee}body{background:#f1eee7;color:var(--ink)}.site-header,.site-footer{display:none}main{max-width:none;padding:0;min-height:100dvh}.start-v4{min-height:100dvh;max-width:430px;margin:auto;padding:9vh 22px 30px;display:flex;flex-direction:column;background:radial-gradient(circle at 80% 10%,#54d3cf35,transparent 30%),var(--cream)}.hero-v4{text-align:center;margin-bottom:7vh}.mini-crown{font-size:28px;color:#f1b52e}.hero-v4 h1{font:900 clamp(62px,22vw,92px)/.9 system-ui;letter-spacing:-8px;color:#153c54;margin:7px 0}.hero-v4 h1 span{color:#ef9d29}.hero-v4 p{font-size:12px;letter-spacing:2px;text-transform:uppercase;color:#73808b}.mode-v4{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.mode-v4 button{height:90px;border:1px solid #dedbd2;background:#fff;border-radius:18px;padding:12px 6px;color:#65717a;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px}.mode-v4 button.active{background:#123c55;color:white;border-color:#123c55;transform:translateY(-3px);box-shadow:0 10px 20px #123c5530}.mode-v4 i{font-style:normal;font-size:20px;color:#30c3c4}.mode-v4 b{font-size:11px}.setup-v4{display:grid;grid-template-columns:1fr 110px;gap:10px;margin-top:20px}.setup-v4 input,.setup-v4 select{height:52px;border:1px solid #dedbd2;background:#fff;border-radius:13px;padding:0 14px;font-size:16px;color:var(--ink);min-width:0}.play-v4{grid-column:1/-1;height:58px;border-radius:15px;background:var(--lime);color:#172536;font-size:16px;font-weight:900;letter-spacing:1px;box-shadow:0 6px 0 #b8c83f}.join-v4{grid-column:1/-1;height:48px;background:transparent;color:#345064;font-weight:800}.names-v4{grid-column:1/-1;display:grid;gap:8px}.rules-v4{margin:auto 0 0;background:none;color:#697881;font-size:12px}.resume-v4{margin:-25px auto 20px;background:#e9f8f5;color:#166b70;border-radius:99px;padding:10px 18px;font-weight:700}
body[data-screen=game]{background:#092b3d}body[data-screen=game] main{background:radial-gradient(circle at 50% 38%,#1a5267,#092b3d 68%);padding-bottom:18px}.game-v4{width:100%;max-width:430px;margin:auto;min-height:100dvh;padding:10px 12px 24px;color:white}.gamebar-v4{height:48px;display:grid;grid-template-columns:42px 1fr auto;align-items:center;border-bottom:1px solid #ffffff14}.gamebar-v4>button{background:#ffffff0d;color:white;width:34px;height:34px;border-radius:12px;font-size:27px}.gamebar-v4>b{font-size:22px;font-style:italic;letter-spacing:-1px}.gamebar-v4>b span{color:#f3b42d}.gamebar-v4>div{text-align:right;font-size:10px;color:#8fb3bd;text-transform:uppercase}.gamebar-v4>div strong{display:block;color:var(--lime);font-size:16px}.status-v4{height:48px;margin:10px 0;display:flex;align-items:center;justify-content:center;gap:8px;border-radius:14px;background:#ffffff08;color:#a9c1c8;font-size:12px}.status-v4.mine{background:var(--lime);color:#152d3a}.status-v4 i{width:7px;height:7px;border-radius:50%;background:#38d5d1;box-shadow:0 0 12px #38d5d1}.status-v4.mine i{background:#123c55;box-shadow:none}.opponents-v4{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:10px}.opponents-v4>.board-v4{min-width:100%;scroll-snap-align:center}.board-v4{background:#ffffff08;border:1px solid #ffffff12;border-radius:18px;padding:10px}.board-v4>header{height:30px;display:flex;align-items:center;gap:8px;margin-bottom:7px}.avatar-v4{width:27px;height:27px;border-radius:9px;display:grid;place-items:center;background:#37ccc5;color:#07323d;font-size:11px}.board-v4>header b{font-size:12px}.board-v4>header strong{margin-left:auto;color:var(--lime);font-size:18px}.board-v4>footer{height:24px;display:flex;align-items:flex-end;color:#80a4ae;font-size:9px}.board-v4>footer>div{margin-left:auto;display:flex;gap:4px}.board-v4>footer i{font-style:normal;background:#dff45b;color:#183443;padding:3px 5px;border-radius:5px}.grid-v4{gap:6px}.grid-v4 .card{aspect-ratio:3/3.55;border-radius:9px;border-width:2px}.grid-v4 .card .number{font-size:34px}.grid-v4 .back-label{font-size:16px}.grid-v4 .back-label i{font-size:12px}.foe-v4{display:grid;grid-template-columns:105px 1fr;gap:8px;padding:9px 12px}.foe-v4>header{display:grid;grid-template-columns:27px 1fr;margin:0;height:auto}.foe-v4>header strong{grid-column:2;margin:0}.foe-v4 .grid-v4{grid-column:2;grid-row:1/3;max-width:155px;margin-left:auto}.foe-v4>footer{grid-column:1;align-self:end}.foe-v4 .card .number{font-size:22px}.foe-v4 .back-label{font-size:11px}.foe-v4 .back-label i{font-size:8px}.action-v4{height:118px;display:flex;align-items:center;justify-content:center;gap:21px;position:relative}.pile-v4,.picked-v4{width:64px;text-align:center}.action-v4 .card{width:58px;aspect-ratio:3/3.65;border-radius:9px;border-width:2px}.action-v4 .card .number{font-size:29px}.action-v4 .back-label{font-size:15px}.action-v4 .back-label i{font-size:11px}.pile-v4 span,.picked-v4 span{display:block;font-size:8px;letter-spacing:1px;color:#83a8b3;margin-top:6px}.ready-v4{outline:3px solid var(--lime);outline-offset:3px;animation:v4pulse 1.7s infinite}.picked-v4 .card{transform:rotate(4deg)}.or-v4{font-size:9px;color:#7097a2}.empty-v4{background:#ffffff05!important;border:1px dashed #ffffff25!important;color:#6c929e;box-shadow:none!important;font-size:20px}.me-v4{padding:11px 14px}.me-v4 .grid-v4{max-width:282px;margin:auto}.me-v4.active-v4{border-color:#dff45b66;box-shadow:0 0 30px #dff45b0a}.me-v4 .card.target{outline:1px dashed #dff45baa;outline-offset:2px}.game-tools-v4{display:flex;justify-content:center;gap:20px;margin-top:12px}.game-tools-v4 button{background:transparent;color:#6f9aa6;font-size:9px;letter-spacing:1px}.game-v4 .results{background:#fff;color:#142c3a;border-radius:20px;padding:18px;margin-top:12px}.game-v4 .results .eyebrow,.game-v4 .results .subtle{display:none}.game-v4 .results h2{font-size:22px}.game-v4 .result-cards{grid-template-columns:1fr}.game-v4 .result{padding:12px}.game-v4 details{background:white;color:#123}.room-code{letter-spacing:7px}@keyframes v4pulse{50%{box-shadow:0 0 22px #dff45b55}}@media(min-width:700px){body[data-screen=game] main{padding:20px}.game-v4{max-width:920px;min-height:auto;border-radius:28px}.opponents-v4{max-width:370px;margin:auto}.player-v4{max-width:370px;margin:auto}.action-v4{height:130px}.start-v4{margin-top:30px;min-height:760px;border-radius:28px;box-shadow:0 20px 60px #20304018}}

/* V5 polish: richer felt, brighter deck and more playful type. */
body[data-screen=game]{font-family:"Arial Rounded MT Bold","Trebuchet MS",system-ui,sans-serif;background:#061e30}
body[data-screen=game] main{position:relative;isolation:isolate;background:radial-gradient(circle at 12% 8%,#28bfcf2b,transparent 27%),radial-gradient(circle at 90% 40%,#cbef4f14,transparent 28%),linear-gradient(165deg,#123f59 0%,#08283c 52%,#061e30 100%);overflow:hidden}
body[data-screen=game] main:before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.22;background-image:radial-gradient(#ffffff30 .7px,transparent .7px),linear-gradient(115deg,transparent 48%,#ffffff08 49%,transparent 51%);background-size:13px 13px,90px 90px}
.game-v4{position:relative}.game-v4:before,.game-v4:after{content:"✦";position:absolute;color:#50d7d426;font-size:110px;line-height:1;z-index:-1}.game-v4:before{top:22%;left:-38px;transform:rotate(18deg)}.game-v4:after{top:58%;right:-45px;transform:rotate(-17deg)}
.gamebar-v4>b{font-family:"Arial Black","Arial Rounded MT Bold",sans-serif;font-style:italic;text-shadow:0 3px 0 #041c2b,0 0 18px #36d3d244}.gamebar-v4>b span{color:#ffd54a;text-shadow:0 3px 0 #9b631a}.gamebar-v4>button{border:1px solid #ffffff16;box-shadow:inset 0 1px #ffffff12}
.status-v4{font-weight:800;letter-spacing:.15px;border:1px solid #ffffff0d;box-shadow:inset 0 1px #ffffff08}.status-v4.mine{background:linear-gradient(135deg,#e8fb65,#cce943);box-shadow:0 6px 20px #dff45b24,inset 0 1px #fff9}
.board-v4{background:linear-gradient(145deg,#ffffff0c,#031b2c2c);border-color:#74cbd121;box-shadow:inset 0 1px #ffffff0c,0 12px 30px #03172428}.me-v4{background:linear-gradient(145deg,#154c62cc,#082c41cc)}.me-v4.active-v4{border-color:#e1f85d91;box-shadow:0 0 0 1px #e1f85d22,0 14px 35px #041b2a55}
.avatar-v4{background:linear-gradient(145deg,#56e6db,#25aebb);box-shadow:0 4px 10px #021c2c55;font-weight:900}.board-v4>header b{font-weight:900;letter-spacing:.1px}.board-v4>header strong{font-family:"Arial Black",system-ui,sans-serif;text-shadow:0 2px 8px #dff45b35}
.game-v4 .card{box-shadow:0 4px 0 #03172580,0 8px 15px #020f1838;transition:transform .16s ease,filter .16s ease,box-shadow .16s ease}.game-v4 .card.face{filter:saturate(1.12) brightness(1.08);border-color:#fffdf4}.game-v4 .card.face .number{font-family:"Arial Black","Trebuchet MS",sans-serif;text-shadow:0 3px 0 #0002}
.game-v4 .card.back{background:repeating-linear-gradient(135deg,#ffffff0b 0 2px,transparent 2px 10px),radial-gradient(circle at 30% 20%,#4edee1,#247ea1 45%,#14516f 100%);border-color:#8ff4ef;box-shadow:0 4px 0 #062a4080,0 8px 18px #020f1855,inset 0 0 0 3px #ffffff12}.game-v4 .card.back:after{border:1px solid #dff45b70;background:linear-gradient(145deg,#ffffff0c,transparent)}.game-v4 .back-label{color:#fff;font-family:"Arial Black",sans-serif;text-shadow:0 2px 0 #0a4964}.game-v4 .back-label i,.game-v4 .back-label em{color:#fff070;filter:drop-shadow(0 1px #785d16)}
.game-v4 .card.interactive:active{transform:translateY(3px) scale(.98);box-shadow:0 1px 0 #03172580,0 3px 8px #020f1838}.action-v4:before{content:"";position:absolute;width:230px;height:96px;border-radius:50%;background:radial-gradient(ellipse,#43c9cf12,transparent 70%);border:1px solid #6ed8d514;z-index:-1}.pile-v4 span,.picked-v4 span{font-weight:900;color:#a3ccd2}.or-v4{font-weight:900;color:#8eb5bd}.ready-v4{outline-color:#ecff61;filter:brightness(1.1);box-shadow:0 0 22px #ddf45b45!important}
.closer-penalty{color:#d76153!important;background:#fff0ec;border-radius:7px;padding:5px 7px!important}.closer-penalty dd{color:#bd453b!important;font-weight:800}
.start-v4{font-family:"Arial Rounded MT Bold","Trebuchet MS",system-ui,sans-serif;background:radial-gradient(circle at 82% 8%,#5fe1db45,transparent 28%),radial-gradient(circle at 10% 72%,#ffd85d26,transparent 27%),linear-gradient(160deg,#fffdf7,#f3f8f3)}.hero-v4 h1{font-family:"Arial Black",system-ui,sans-serif;text-shadow:0 5px 0 #dce8df}.mode-v4 button{box-shadow:0 7px 18px #1732450b}.mode-v4 button.active{background:linear-gradient(145deg,#17516a,#0b324a);box-shadow:0 9px 0 #062439,0 17px 25px #123c5530}.play-v4{background:linear-gradient(135deg,#ebff6a,#cbe63d);box-shadow:0 6px 0 #9cad2f,0 13px 24px #aabe3530}

/* V6 home screen: deep blue, luminous and tactile. */
body[data-screen=home]{background:#041b39}
body[data-screen=home] main{background:radial-gradient(circle at 50% -5%,#147edb66,transparent 36%),radial-gradient(circle at 100% 52%,#19d9d13b,transparent 34%),linear-gradient(155deg,#082d64 0%,#041c43 48%,#03152f 100%)}
.start-v4{position:relative;isolation:isolate;overflow:hidden;color:#f8fbff;background:radial-gradient(circle at 52% 4%,#238fe56b,transparent 34%),radial-gradient(circle at 0 70%,#1ad4cb29,transparent 30%),linear-gradient(160deg,#0a3773,#061e49 55%,#041632);box-shadow:inset 0 0 80px #02102799}
.start-v4:before{content:"";position:absolute;inset:0;z-index:-2;opacity:.42;background-image:radial-gradient(#8edfff 1px,transparent 1px),linear-gradient(125deg,transparent 47%,#69e7ff0d 48%,transparent 50%);background-size:24px 24px,105px 105px;mask-image:linear-gradient(to bottom,#000,transparent 80%)}
.start-v4:after{content:"9";position:absolute;right:-45px;top:18%;z-index:-1;font:900 250px/1 "Arial Black",sans-serif;color:#2ddbd70a;text-shadow:0 0 60px #30d6d61a;transform:rotate(-9deg)}
.hero-v4{position:relative}.hero-v4:after{content:"";position:absolute;width:220px;height:85px;left:50%;top:35px;translate:-50% 0;border-radius:50%;background:#35d9e12b;filter:blur(25px);z-index:-1}
.mini-crown{display:inline-block;color:#ffe05a;font-size:30px;filter:drop-shadow(0 0 8px #ffd94f) drop-shadow(0 0 22px #35d9e1);animation:homeCrown 2.8s ease-in-out infinite}
.hero-v4 h1{color:#fff;font-family:"Arial Black",system-ui,sans-serif;text-shadow:0 5px 0 #021536,0 0 18px #29cdd066,0 0 45px #168de955}.hero-v4 h1 span{color:#ffe14f;text-shadow:0 5px 0 #ae6c0a,0 0 18px #ffdd4f99}.hero-v4 p{color:#a9d8eb;font-weight:800;text-shadow:0 0 10px #37dce955}
.mode-v4{perspective:500px}.mode-v4 button{position:relative;color:#b9d8e6;border:1px solid #6bbbdc33;background:linear-gradient(145deg,#ffffff12,#ffffff05);box-shadow:inset 0 1px #ffffff18,0 10px 24px #020e2666;backdrop-filter:blur(8px);transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}.mode-v4 button:before{content:"";position:absolute;inset:1px;border-radius:16px;background:linear-gradient(135deg,#ffffff0c,transparent 45%);pointer-events:none}.mode-v4 button.active{color:white;border-color:#77f6efcc;background:linear-gradient(145deg,#117b9b,#075071);transform:translateY(-5px);box-shadow:0 7px 0 #032b4b,0 0 0 1px #5eeae755,0 0 28px #25d8d75a,inset 0 1px #ffffff33}.mode-v4 i{width:35px;height:35px;display:grid;place-items:center;border-radius:12px;color:#8dfaf2;background:#29c9ce18;border:1px solid #5ae4e34a;filter:drop-shadow(0 0 7px #35dcdb)}.mode-v4 button.active i{color:#062e46;background:#eaff72;border-color:#f1ff98;box-shadow:0 0 16px #eaff7280;filter:none}.mode-v4 b{font-size:10px;line-height:1.2}
.setup-v4{padding:14px;border:1px solid #8bcbe12b;border-radius:20px;background:#ffffff09;box-shadow:inset 0 1px #ffffff12,0 15px 35px #020d2566;backdrop-filter:blur(10px)}.setup-v4 input,.setup-v4 select{color:#fff;border-color:#75bbd342;background:#031a3db8;box-shadow:inset 0 2px 6px #010b1d55}.setup-v4 input::placeholder{color:#82aabd}.setup-v4 select option{background:#06224a;color:#fff}.play-v4{color:#10213b;border:1px solid #f4ff91;background:linear-gradient(135deg,#f2ff78,#c9ed3d);box-shadow:0 6px 0 #819f1f,0 0 25px #ddf85b55,inset 0 1px #fff}.play-v4:active{transform:translateY(4px);box-shadow:0 2px 0 #819f1f,0 0 16px #ddf85b44}.join-v4{color:#9de9ec;border:1px solid #57dfe052;border-radius:13px;background:#21cbd010}.join-v4:hover{background:#21cbd022;box-shadow:0 0 18px #21cbd028}.rules-v4{color:#8eb7ca;text-shadow:0 0 9px #2bd6d547}.resume-v4{color:#eaffff;border:1px solid #5ce7e477;background:#12bfc33d;box-shadow:0 0 20px #1bd3d33c;backdrop-filter:blur(8px)}
@keyframes homeCrown{50%{transform:translateY(-3px) scale(1.06);filter:drop-shadow(0 0 13px #ffd94f) drop-shadow(0 0 30px #35d9e1)}}
@media(min-width:700px){body[data-screen=home] main{padding:28px}.start-v4{margin:0 auto;border:1px solid #67dce044;box-shadow:0 35px 90px #010b226e,inset 0 0 80px #02102799}}
@media(prefers-reduced-motion:reduce){.mini-crown,.ready-v4{animation:none}}
