:root{--bg:#080b0e;--panel:#11171c;--panel2:#0b1014;--gold:#d2aa68;--gold-soft:#6d5738;--text:#eee5d8;--muted:#9b958c;--red:#9f443d;--blue:#3e6f9b;--green:#4f8a5d;--danger:#7c302d}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:radial-gradient(circle at 50% 0,#1b2026,#080b0e 55%);color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif}body{overflow-x:hidden}button,input,select{font:inherit}button{border:1px solid #5f6264;border-radius:6px;padding:.55rem .8rem;color:#eee7dc;background:#22292f;cursor:pointer}button:hover{border-color:var(--gold)}button:disabled{opacity:.4;cursor:not-allowed}.primary{border-color:#c59a57;background:linear-gradient(#bb8f4d,#8b6231);color:#fff}.danger{border-color:#9f514b;background:#542421}.hidden{display:none!important}.shell{width:min(1500px,100%);margin:0 auto}.masthead{text-align:center;padding:1.1rem 0 .7rem}.masthead h1{margin:.1rem 0;color:#d9b577;font:700 clamp(2.6rem,6vw,4.8rem)/1 Georgia,serif;letter-spacing:.08em;text-transform:uppercase}.eyebrow{margin:0;color:var(--gold);font-size:.68rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase}.subtitle{margin:.45rem 0 0;color:var(--gold);letter-spacing:.22em;text-transform:uppercase;font-size:.8rem}#notice{min-height:2rem;padding:.35rem .75rem;text-align:center;color:#f1cf98;font-size:.85rem}#notice.error{color:#ff938c}.screen{padding:0 1rem 1rem}.panel{background:linear-gradient(145deg,rgba(20,26,31,.98),rgba(8,12,15,.99));border:1px solid var(--gold-soft);border-radius:8px;box-shadow:0 14px 35px rgba(0,0,0,.28)}.menu-screen{display:grid;place-items:center}.menu-card{width:min(760px,100%);padding:1.5rem}.menu-brand{text-align:center}.menu-brand h2{margin:.3rem 0;color:#d9b577;font:700 2.7rem/1 Georgia,serif;text-transform:uppercase;letter-spacing:.06em}.menu-brand p:last-child{color:var(--muted)}.menu-actions{display:grid;grid-template-columns:repeat(2,1fr);gap:.7rem;margin-top:1.2rem}.menu-button{min-height:54px;font-weight:700}.menu-form{margin-top:1rem;padding-top:1rem;border-top:1px solid #3e4143}.menu-subform{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem;align-items:end}.menu-subform label{display:grid;gap:.3rem;color:var(--muted);font-size:.8rem}.menu-subform input,.menu-subform select{width:100%;padding:.55rem;color:var(--text);background:#0a0f13;border:1px solid #51575a;border-radius:5px}.compact-reconnect{grid-template-columns:1fr auto;margin-top:.8rem}.lobby-heading,.game-topbar,.control-row,.top-actions,.section-title,.queue-footer,.queue-actions{display:flex;align-items:center;justify-content:space-between;gap:.6rem}.lobby-heading{padding:1rem}.lobby-heading h2{margin:0;color:var(--gold);font-size:2rem;letter-spacing:.18em}.roster{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1rem 0}.team-panel,#host-controls{padding:1rem}.seat{display:flex;justify-content:space-between;margin-top:.5rem;padding:.65rem;background:#080c0f;border-radius:5px}.seat.empty{color:#777;border:1px dashed #394147}.control-row{justify-content:flex-start;flex-wrap:wrap}.waiting-copy{text-align:center;color:var(--muted)}
/* gameplay */
.game-shell{height:100vh;padding:.45rem .65rem .55rem;overflow:hidden}.game-topbar{height:46px;padding:0 .55rem;border-bottom:1px solid #4e4232}.game-title{color:var(--gold);font:700 1.05rem Georgia,serif;letter-spacing:.12em}.game-meta-inline{display:flex;gap:1rem;color:#cfc4b5;font-size:.78rem}.game-layout{height:calc(100vh - 60px);display:grid;grid-template-columns:minmax(0,1fr) 230px;gap:.55rem}.battle-area{min-width:0;display:grid;grid-template-rows:38px minmax(150px,1.2fr) minmax(145px,1fr) minmax(128px,.9fr) 38px;gap:.45rem;min-height:0}.compact-panel{padding:.5rem}.court-strip{display:flex;align-items:center;gap:.7rem;padding:0 .4rem;border:1px solid #42382b;border-radius:6px;background:#0d1216}.court-name{min-width:110px;color:#c9b89d;font-size:.72rem;font-weight:700;text-transform:uppercase}.court-seats{display:grid;grid-template-columns:repeat(4,minmax(95px,1fr));gap:.35rem;flex:1}.queen-seat{height:28px;display:flex;align-items:center;justify-content:center;gap:.35rem;border:1px solid #464b4e;border-radius:5px;background:#090d10;color:#797f82;font-size:.7rem;font-weight:700}.queen-seat.seated{border-color:#b58d52;color:#f0d09b;background:#211b13}.queen-seat .suit{font-size:1rem}.queen-seat.hearts .suit,.queen-seat.diamonds .suit{color:#dc554e}.queen-seat.clubs .suit{color:#62a776}.queen-seat.spades .suit{color:#d5d5d5}.edge-panel{display:grid;grid-template-rows:1fr auto;min-height:0}.edge-board{display:grid;grid-template-columns:145px minmax(260px,1fr) 145px;align-items:center;gap:.5rem;min-height:0}.waiting-slot{min-height:76px;display:grid;align-content:start;border:1px solid #485159;border-radius:6px;background:#080c0f;padding:.4rem;text-align:center}.waiting-slot>span{color:#8f989e;font-size:.58rem;font-weight:700;text-transform:uppercase}.waiting-slot.human{border-color:#743630}.waiting-slot.ace{border-color:#315f8e}.waiting-queen{min-height:49px;display:grid;place-items:center;color:#71787c;font-size:.64rem;line-height:1.15}.waiting-queen.occupied{color:#f1d19a}.waiting-crown{display:block;color:#ebc77c;font:1.35rem/1 Georgia,serif}.waiting-lock{display:block;color:#e58d86;font-size:.5rem;text-transform:uppercase}.active-track-wrap{min-width:0}.track-labels{display:flex;justify-content:space-between;align-items:end;margin-bottom:.25rem;color:#8f969a;font-size:.62rem}.track-labels strong{color:var(--gold);letter-spacing:.12em}.track{height:32px;position:relative;border:1px solid #a98553;background:repeating-linear-gradient(90deg,#0e151a 0,#0e151a calc(5% - 1px),#53606a 5%)}.zero{position:absolute;left:50%;bottom:-18px;color:#9f988d;font-size:.62rem}.queen-marker{position:absolute;top:50%;left:50%;z-index:2;color:#ebc77c;font-size:1.85rem;line-height:1;filter:drop-shadow(0 2px 2px #000);transform:translate(-50%,-50%);transition:left .35s ease}.queen-copy{margin-top:1.2rem;color:#aaa298;text-align:center;font-size:.68rem}.resource-bar{display:grid;grid-template-columns:repeat(6,1fr);gap:.35rem;margin-top:.35rem}.resource-bar>div{display:flex;align-items:center;justify-content:center;gap:.4rem;min-height:28px;border:1px solid #394147;border-radius:4px;background:#080c0f}.resource-bar span{color:#9c9b96;font-size:.6rem;text-transform:uppercase}.resource-bar strong{color:#e5bd7f;font-size:.9rem}.queue-panel,.hand-panel{min-height:0;overflow:hidden}.compact-title{height:28px}.compact-title h2{margin:.05rem 0 0;color:#d7b276;font-size:.95rem}.ready-pill{padding:.25rem .55rem;border:1px solid #555d61;border-radius:99px;color:#92999c;font-size:.65rem}.ready-pill.ready{border-color:var(--green);color:#bce6c4}.team-slots{height:calc(100% - 61px);display:grid;grid-template-columns:repeat(4,1fr);gap:.4rem;margin:.25rem 0}.slot{min-height:0;display:grid;place-items:center;position:relative;border:1px dashed #5b656b;border-radius:6px;background:#070b0e;padding:.25rem}.slot.drag-over{border-color:var(--gold)}.slot-number{position:absolute;top:.2rem;left:.3rem;color:#69747a;font-size:.55rem;font-weight:700}.slot-owner{position:absolute;right:.3rem;bottom:.18rem;left:.3rem;overflow:hidden;color:#7d878d;font-size:.52rem;text-align:center;text-overflow:ellipsis;white-space:nowrap}.empty-copy{color:#596269;font-size:.65rem}.queue-footer{height:29px}.confirmations{display:flex;gap:.3rem;overflow:hidden}.confirmation{padding:.18rem .35rem;border:1px solid #42494d;border-radius:4px;color:#899196;font-size:.55rem;white-space:nowrap}.confirmation.ready{color:#bce6c4;border-color:#487c54}.queue-actions button{padding:.3rem .55rem;font-size:.65rem}.hand{height:calc(100% - 31px);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:.28rem}.card{min-width:0;min-height:0;display:flex;flex-direction:column;justify-content:space-between;position:relative;padding:.3rem;color:#17120e;background:linear-gradient(135deg,#f0e8dc,#cfc3b3);border:1px solid #f4eadb;border-radius:6px;box-shadow:0 3px 7px rgba(0,0,0,.35);user-select:none}.card[draggable=true]{cursor:grab}.card.hearts,.card.diamonds{color:#b82d2a}.card.clubs{color:#235e3a}.card.spades{color:#111}.card.ace{color:#254d79}.card.king{color:#a35b10}.card.jack{color:#5c3879}.card-rank{font-size:clamp(.72rem,1vw,1rem);font-weight:800}.card-symbol{align-self:center;font-size:clamp(1rem,1.55vw,1.45rem)}.card-name{overflow:hidden;font-size:.48rem;font-weight:700;text-transform:uppercase;white-space:nowrap;text-overflow:ellipsis}.card-effect{display:none}.card.queued{opacity:.32;filter:grayscale(.5)}.remove-card{position:absolute;top:.12rem;right:.12rem;z-index:3;width:17px;height:17px;padding:0;border:0;border-radius:50%;background:#662b29;color:#fff;font-size:11px}.side-panel{min-height:0;display:grid;grid-template-rows:auto 1fr auto}.side-panel-head{padding:.15rem}.side-panel-head h3{margin:.15rem 0 .35rem;color:#d7b276}.action-log{min-height:0;overflow:auto;border-top:1px solid #30363a;border-bottom:1px solid #30363a;padding:.35rem}.log-line{padding:.28rem 0;border-bottom:1px solid #242b2f;color:#aaa49b;font-size:.61rem;line-height:1.2}.log-line:last-child{color:#e8d4b2}.match-info{display:flex;justify-content:space-between;padding:.35rem .1rem 0;color:#7f888d;font-size:.58rem}
/* resolution modal */
.resolution-overlay{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:1.2rem;background:rgba(2,4,6,.88);backdrop-filter:blur(5px)}.resolution-card{width:min(1180px,96vw);height:min(760px,94vh);padding:.75rem;display:grid;grid-template-rows:auto 1fr auto}.resolution-heading,.resolution-controls{display:flex;align-items:center;justify-content:space-between;gap:.5rem}.resolution-heading h2{margin:.1rem 0;color:#d8b57d;font-size:1.25rem}.step-counter{color:var(--gold);font-size:.7rem;font-weight:700}.resolution-grid{min-height:0;display:grid;grid-template-rows:minmax(100px,1fr) minmax(150px,1.25fr) minmax(100px,1fr);gap:.45rem}.resolution-team{min-height:0;padding:.35rem;border-radius:6px}.ace-team{border:1px solid #315f8e;background:rgba(39,82,123,.12)}.human-team{border:1px solid #743630;background:rgba(122,49,43,.12)}.team-tag{display:block;margin-bottom:.25rem;color:#c8b79f;font-size:.58rem;text-transform:uppercase}.result-cards{height:calc(100% - 18px);display:grid;grid-template-columns:repeat(4,1fr);gap:.35rem}.result-cards .card{padding:.35rem}.result-cards .card-effect{display:block;overflow:hidden;font-size:.5rem;line-height:1.1}.result-cards .card.resolved{opacity:.4}.result-cards .card.active{opacity:1;border-color:#f4c675;box-shadow:0 0 0 2px rgba(222,167,79,.32);transform:translateY(-3px)}.slot-badge{position:absolute;right:.25rem;top:.25rem;padding:.1rem .25rem;border-radius:99px;background:#29231c;color:#f4eadb;font-size:.46rem}.owner-badge{color:#584d42;font-size:.46rem;font-weight:700}.resolution-focus{display:grid;grid-template-rows:1fr auto auto;gap:.35rem;padding:.4rem;border:1px solid #735d3d;border-radius:6px;background:#090d10}.result-queen-stage{display:grid;grid-template-columns:120px 1fr 120px;align-items:center;gap:.4rem}.event-callout{min-height:36px;display:grid;place-items:center;padding:.35rem .55rem;border-left:3px solid var(--gold);background:#11171b;color:#efd7b0;text-align:center;font-size:.65rem}.resolution-pulls{display:grid;grid-template-columns:1fr 1fr;gap:.4rem}.resolution-pulls span{display:flex;align-items:center;justify-content:center;gap:.4rem;padding:.25rem;background:#080c0f;border:1px solid #343a3e;color:#aaa;font-size:.6rem}.resolution-pulls strong{color:var(--gold);font-size:1rem}.resolution-pulls small{color:#747d82}.resolution-controls{justify-content:center;padding-top:.45rem}.resolution-controls button{padding:.38rem .7rem}
@media(max-width:1100px){.game-layout{grid-template-columns:minmax(0,1fr) 180px}.court-seats{grid-template-columns:repeat(4,minmax(70px,1fr))}.court-name{min-width:88px}.edge-board{grid-template-columns:115px minmax(220px,1fr) 115px}.game-meta-inline{gap:.45rem}.card-name{display:none}.resource-bar span{font-size:.52rem}}
@media(max-width:760px){body{overflow:auto}.game-shell{height:auto;overflow:visible}.game-layout{height:auto;grid-template-columns:1fr}.battle-area{grid-template-rows:auto}.hand{grid-template-columns:repeat(6,1fr);height:auto}.hand .card{min-height:92px}.team-slots{height:auto}.slot{min-height:100px}.court-seats{grid-template-columns:repeat(4,1fr)}.edge-board{grid-template-columns:1fr}.waiting-slot{min-height:55px}.side-panel{min-height:180px}.menu-actions,.menu-subform,.roster{grid-template-columns:1fr}.game-meta-inline #identity-label{display:none}.resolution-card{height:auto;max-height:95vh;overflow:auto}.result-queen-stage{grid-template-columns:1fr}.result-cards{min-height:100px}}
.game-active .masthead{display:none}.game-active #notice{position:fixed;z-index:90;top:50px;right:12px;max-width:420px;min-height:0;padding:.35rem .6rem;border-radius:5px;background:rgba(9,13,16,.88);pointer-events:none}.game-active .screen{padding-top:0}

/* v0.7 visual polish: game-first hierarchy, readable card powers, no match-feed clutter */
:root{--violet:#7653a6;--violet-soft:#2a2038;--ivory:#f4eadb;--felt:#0d1217}
.game-shell{background:radial-gradient(ellipse at 50% 45%,rgba(73,52,99,.16),transparent 52%)}
.game-topbar{background:linear-gradient(90deg,#0a0d11,#15121b 48%,#0a0d11);border:1px solid #3f3549;border-radius:8px;box-shadow:0 8px 30px #0008}
.game-title{font-size:1.12rem;text-shadow:0 0 18px rgba(210,170,104,.22)}
.game-layout{grid-template-columns:minmax(0,1fr) 245px}
.edge-panel,.queue-panel,.hand-panel,.side-panel{border-color:#45384f;box-shadow:inset 0 1px rgba(255,255,255,.025),0 12px 28px #0005}
.edge-panel{background:radial-gradient(circle at 50% 50%,rgba(118,83,166,.12),transparent 42%),linear-gradient(145deg,#11171c,#080b0f)}
.track{box-shadow:inset 0 0 24px #000,0 0 0 1px #7d6745;background:linear-gradient(90deg,rgba(62,111,155,.18),rgba(118,83,166,.09) 50%,rgba(159,68,61,.18))}
.queen-marker{filter:drop-shadow(0 0 8px rgba(210,170,104,.55))}
.card{position:relative;overflow:hidden;background:linear-gradient(155deg,#f8f1e7,#ded2c1);color:#171514;border:1px solid #b9a78f;box-shadow:0 4px 10px #0007,inset 0 1px #fff;border-radius:7px}
.card::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(135deg,rgba(255,255,255,.2),transparent 35%,rgba(0,0,0,.05));}
.card-rank{font-family:Georgia,serif;font-weight:800}.card-symbol{filter:drop-shadow(0 1px 0 #fff8)}
.card-name{font-weight:800;letter-spacing:.035em;text-transform:uppercase}
.card-effect{display:block!important;opacity:1!important;color:#4b4339!important;font-size:clamp(.52rem,.62vw,.68rem)!important;line-height:1.18!important;margin-top:auto!important;padding-top:.25rem!important;border-top:1px solid #c8b9a6!important;white-space:normal!important}
.card.hearts .card-rank,.card.hearts .card-symbol,.card.diamonds .card-rank,.card.diamonds .card-symbol{color:#a92f32}.card.clubs .card-rank,.card.clubs .card-symbol{color:#267043}.card.spades .card-rank,.card.spades .card-symbol{color:#191919}
.hand .card{min-width:0}.hand{gap:.32rem}
.power-reference{display:grid;gap:.36rem;margin-top:.25rem}.power-reference>div{display:grid;gap:.08rem;padding:.42rem .45rem;border:1px solid #302a36;border-radius:6px;background:linear-gradient(90deg,#0a0e12,#111019)}.power-reference b{font:700 .72rem Georgia,serif;color:#ddd4c8;letter-spacing:.04em}.power-reference span{font-size:.63rem;line-height:1.22;color:#a9a19a}.power-reference .heart{color:#db5c59}.power-reference .diamond{color:#d55b58}.power-reference .club{color:#67ad7a}.reverse-status{margin-top:.55rem;padding:.5rem;border:1px solid #5b4674;border-radius:6px;background:#17111f;display:grid;gap:.12rem}.reverse-status span{font-size:.6rem;color:#a899b9;text-transform:uppercase;letter-spacing:.12em}.reverse-status strong{font-size:.72rem;color:#d8c1f2}.side-panel{overflow:hidden}.side-panel-head h3{margin:.08rem 0 .35rem;color:#e6d5ba;font-family:Georgia,serif}.court-strip{background:linear-gradient(90deg,#0b1014,#15111b,#0b1014);border-color:#44394c}.queen-seat.seated{box-shadow:inset 0 0 14px rgba(210,170,104,.14),0 0 8px rgba(210,170,104,.08)}
@media(max-height:800px){.power-reference{gap:.2rem}.power-reference>div{padding:.28rem .35rem}.power-reference span{font-size:.56rem}.card-effect{font-size:.54rem!important}.game-layout{grid-template-columns:minmax(0,1fr) 215px}}


/* v0.8 Royal Table — purple/black/gold, circular Court seats, Queen card on Edge, fanned hand */
:root{--royal-purple:#7c35b8;--royal-purple-deep:#271333;--royal-gold:#d6aa55;--royal-gold-bright:#f0cc78;--royal-black:#07060a}
body{background:radial-gradient(circle at 50% -10%,#2c1538 0,#0a080d 42%,#040406 100%);color:#eee7dc}
.game-shell{background:radial-gradient(ellipse at 50% 32%,rgba(116,45,163,.2),transparent 45%),linear-gradient(180deg,#08070b,#050507);padding:.45rem!important}
.game-topbar{height:48px;background:linear-gradient(90deg,#08070b,#1b0d24 48%,#08070b);border:1px solid #5d3473;box-shadow:0 0 24px #6e2ca922,inset 0 1px #ffffff0d}
.game-title{font-family:Georgia,serif;color:var(--royal-gold-bright);letter-spacing:.12em;text-shadow:0 0 18px #b85cff55}
.game-layout{grid-template-columns:minmax(0,1fr) 220px;gap:.42rem}.battle-area{gap:.38rem}
.court-strip{padding:.3rem .5rem;background:linear-gradient(90deg,#08070b,#180d20,#08070b);border:1px solid #51305f;box-shadow:inset 0 0 24px #0009}
.court-name{font-family:Georgia,serif;color:#ddc28c;letter-spacing:.1em}.court-seats{gap:.5rem}
.queen-seat{min-height:54px;grid-template-columns:46px 1fr;grid-template-rows:1fr 1fr;column-gap:.5rem;padding:.25rem .5rem;border:1px solid #3e3344;background:#09090c;border-radius:8px}
.queen-seat .seat-orb{grid-row:1/3;width:38px;height:38px;display:grid;place-items:center;border-radius:50%;border:1px solid #806a3a;background:radial-gradient(circle,#17131c,#050507 72%);box-shadow:inset 0 0 12px #000,0 0 0 2px #000}
.queen-seat .suit{font-size:1.2rem;opacity:.68}.queen-seat .seat-label{align-self:end;color:#9a8c9e;font-size:.52rem;text-transform:uppercase;letter-spacing:.09em}.queen-seat strong{align-self:start;color:#766f77;font-size:.56rem;letter-spacing:.08em}
.queen-seat.seated{border-color:#9c6e2f;background:linear-gradient(135deg,#24110e,#130a18);box-shadow:inset 0 0 22px #a9552630,0 0 12px #cd963525}.queen-seat.seated .seat-orb{border-color:var(--royal-gold-bright);box-shadow:inset 0 0 14px #000,0 0 16px #bd793b55}.queen-seat.seated .suit{opacity:1}.queen-seat.seated strong{color:#f1c868}
.edge-panel{padding:.45rem;background:radial-gradient(circle at 50% 30%,rgba(128,52,178,.17),transparent 40%),linear-gradient(180deg,#0d0b11,#08080b);border:1px solid #634276}
.track{height:54px;border:1px solid #a27b3c;background:linear-gradient(90deg,#1b1015,#141016 45%,#211129 55%,#1b1015);overflow:visible}.track::before{content:"";position:absolute;inset:50% 0 auto;height:1px;background:linear-gradient(90deg,#8d562a,#d4b56b,#a75eda,#d4b56b,#8d562a);box-shadow:0 0 8px #d699ff88}
.queen-marker{width:44px;height:64px;margin-left:-22px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:4px;background:linear-gradient(145deg,#fff9ed,#d7c8b6);border:2px solid #e1bb69;border-radius:6px;color:#8c252d;box-shadow:0 0 0 2px #391a4e,0 0 24px #b756e077,0 8px 18px #000b;z-index:5}.queen-marker .queen-rank{align-self:flex-start;font:800 13px Georgia,serif}.queen-marker .queen-suit{font-size:24px;line-height:1}.queen-marker.hearts,.queen-marker.diamonds{color:#a82b31}.queen-marker.clubs{color:#216a46}.queen-marker.spades{color:#111}
.queen-copy{color:#e8c980;font-family:Georgia,serif}.waiting-slot{border-radius:10px;border-color:#5e475e;background:linear-gradient(180deg,#0e0b12,#07070a)}
.resource-bar{grid-template-columns:repeat(7,minmax(0,1fr));gap:.3rem}.resource-bar>div{border:1px solid #3d3044;background:#09080c;border-radius:6px;padding:.25rem .35rem}.resource-bar span{color:#9d8ea2}.resource-bar strong{color:#e7c36f}.resource-bar small{display:block;color:#736b77;font-size:.48rem;margin-top:.08rem}.resource-bar .pull-ready{border-color:#6e4386;background:#160d1e}.resource-bar .pull-ready strong{color:#d799ff}.resource-bar .pull-charge{border-color:#3d3250}.resource-bar .pull-charge strong{color:#a98ec4}.deck-resource b{font-weight:800;color:#e7c36f}
.queue-panel,.hand-panel,.side-panel{background:linear-gradient(180deg,#0c0a10,#07070a);border:1px solid #4b3458}.team-slots{gap:.55rem}.slot{border-color:#4b3b55;background:#09080d}.slot:has(.card){border-style:solid;border-color:#6b4f73}
.hand-panel{overflow:visible}.hand{display:flex!important;align-items:flex-end;justify-content:center;gap:4px;overflow:visible;padding:4px 8px 1px;height:calc(100% - 29px)}.hand .card{flex:1 1 0;max-width:84px;min-width:48px;height:100%;transform:translateY(var(--fan-y)) rotate(var(--fan-rot));transform-origin:50% 120%;transition:transform .16s ease,box-shadow .16s ease,opacity .16s ease;z-index:var(--fan-z)}.hand .card:hover{transform:translateY(-16px) rotate(0deg) scale(1.13);z-index:40;box-shadow:0 0 0 2px #a45ad1,0 18px 34px #000d}.hand .card.queued{opacity:.28;transform:translateY(5px) scale(.96)}
.card{border-color:#c4b18d;background:linear-gradient(150deg,#fff9ee,#e4d8c7);box-shadow:0 5px 12px #000a,inset 0 1px #fff}.card-effect{font-size:clamp(.48rem,.55vw,.61rem)!important;line-height:1.12!important}.card-name{font-size:.45rem}.card-symbol{font-size:clamp(.9rem,1.25vw,1.25rem)}
.side-panel{padding:.45rem}.power-reference{grid-template-columns:1fr;gap:.25rem}.power-reference>div{padding:.32rem .38rem;border-color:#3f3048;background:#0b0910}.power-reference b{font-size:.64rem}.power-reference span{font-size:.54rem}.reverse-status{border-color:#6d3f87;background:linear-gradient(90deg,#160c1f,#0d0912)}
.victory-overlay{position:fixed;inset:0;z-index:80;display:grid;place-items:center;background:radial-gradient(circle at 50% 35%,rgba(112,31,154,.38),rgba(3,2,5,.94) 52%);backdrop-filter:blur(8px)}.victory-card{width:min(520px,92vw);padding:2rem 1.6rem;border:1px solid #9e6c31;border-radius:16px;background:radial-gradient(circle at 50% 0,#2b123a,#0b0710 55%,#050406);box-shadow:0 0 0 1px #4b2660,0 30px 90px #000,0 0 55px #a34ddb33;text-align:center}.victory-crown{font-size:4rem;color:#f1c45d;text-shadow:0 0 25px #e0a63e80}.victory-card h2{margin:.2rem 0;color:#f2c965;font:700 2.6rem Georgia,serif;letter-spacing:.08em}.victory-card>p:not(.eyebrow){color:#d7c3dd}.victory-suits{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem;margin:1.25rem 0}.victory-suits div{display:grid;place-items:center;gap:.3rem;min-height:76px;border:1px solid #76552f;border-radius:50%;font-size:2rem;background:#0a070d;box-shadow:inset 0 0 18px #000}.victory-suits span{font-size:.46rem;color:#d7b66d}.victory-stats{display:grid;grid-template-columns:repeat(3,1fr);margin:1rem 0;border:1px solid #583a62;border-radius:8px;overflow:hidden}.victory-stats div{padding:.65rem;border-right:1px solid #583a62}.victory-stats div:last-child{border:0}.victory-stats span{display:block;color:#9c8a9f;font-size:.56rem;text-transform:uppercase}.victory-stats strong{display:block;margin-top:.15rem;color:#ecc668;font-size:1.35rem}.victory-actions{display:flex;justify-content:center;gap:.75rem}.victory-actions button{min-width:130px}
.menu-card{border-color:#67377e;background:radial-gradient(circle at 50% 0,rgba(121,43,164,.18),transparent 40%),#09070d;box-shadow:0 25px 80px #000}.menu-brand h2{color:#eac66e;text-shadow:0 0 22px #a449d655}
@media(max-height:800px){.game-topbar{height:42px}.queen-seat{min-height:46px}.queen-seat .seat-orb{width:32px;height:32px}.track{height:46px}.queen-marker{width:38px;height:56px;margin-left:-19px}.resource-bar small{display:none}.hand .card:hover{transform:translateY(-10px) rotate(0) scale(1.08)}.power-reference span{font-size:.5rem}}
@media(max-width:1100px){.game-layout{grid-template-columns:minmax(0,1fr) 190px}.resource-bar{grid-template-columns:repeat(4,1fr)}.power-reference span{display:none}.queen-seat{grid-template-columns:34px 1fr}.queen-seat .seat-orb{width:30px;height:30px}.hand .card{max-width:70px}}

/* v0.9 Royal Purple — visual target: generated mockup #1, 1:1 structure */
body.game-active{overflow:hidden;background:#030205}
body.game-active .shell{width:100vw;height:100vh;max-width:none;padding:0;margin:0}
body.game-active #masthead,body.game-active #notice{display:none!important}
.game-shell{height:100vh!important;min-height:0!important;padding:8px!important;background:radial-gradient(circle at 50% 30%,#21102c 0,#09060d 42%,#030205 100%)!important;overflow:hidden}
.royal-topbar{height:58px!important;display:grid!important;grid-template-columns:235px 90px 150px 1fr auto;gap:10px;align-items:center;padding:6px 12px!important;border:1px solid #542768!important;border-radius:12px!important;background:linear-gradient(180deg,#0c0812,#060509)!important;box-shadow:inset 0 1px rgba(255,255,255,.06),0 0 28px rgba(130,49,181,.12)!important}
.royal-logo{display:flex;align-items:center;gap:8px;font:700 22px Georgia,serif;color:#f0c65f;letter-spacing:.04em;text-shadow:0 0 16px #8b31c455}.royal-logo .logo-crown{font-size:30px;color:#b84ced}.royal-logo small{font-size:.42em;display:inline-block;vertical-align:middle;color:#d9bd77}
.hud-chip{height:42px;border:1px solid #5c2b72;border-radius:8px;display:grid;place-items:center;padding:3px 12px;background:#0d0813;box-shadow:inset 0 0 13px #6b278220}.hud-chip span{font-size:9px;color:#d3bb79;line-height:1;text-transform:uppercase;letter-spacing:.09em}.hud-chip strong{font:700 15px Georgia,serif;color:#fff}.initiative-chip strong{color:#d996ff}.score-chip{justify-self:center;display:flex;align-items:center;gap:9px;height:40px;padding:0 15px;border:1px solid #2e2536;border-radius:8px;background:#09070d;color:#c7b1cc}.score-chip span{font-size:10px;color:#d6b86e}.score-chip strong{font:700 20px Georgia,serif;color:#fff}.score-chip i{font-style:normal;color:#644b6c}.identity-hidden{display:none}.royal-button,.menu-icon{height:38px!important;border:1px solid #6f3888!important;background:linear-gradient(180deg,#3b1452,#1b0b27)!important;color:#fff!important;box-shadow:inset 0 1px #ffffff1f,0 0 10px #7d2fa933!important}.menu-icon{width:42px;font-size:19px;padding:0!important}.top-actions{display:flex;gap:8px}
.royal-board{height:calc(100vh - 74px);display:grid;grid-template-rows:112px 151px 100px minmax(142px,1fr) 86px 112px;gap:6px;margin-top:7px;padding:0 4px;overflow:hidden}
.court-strip{position:relative!important;padding:23px 8px 7px!important;border:1px solid #4d295c!important;border-radius:10px!important;background:linear-gradient(180deg,#0c0910,#070609)!important}.court-name{position:absolute;top:5px;left:50%;transform:translateX(-50%);font:700 13px Georgia,serif;color:#d8ba78;letter-spacing:.08em;white-space:nowrap}.court-seats{height:100%;display:grid!important;grid-template-columns:repeat(4,1fr);gap:10px!important}.queen-seat{min-height:0!important;height:100%!important;display:grid!important;grid-template-columns:42px 1fr!important;grid-template-rows:1fr 1fr!important;column-gap:9px!important;padding:7px 12px!important;border:1px solid #55415f!important;border-radius:8px!important;background:linear-gradient(180deg,#100c13,#08070a)!important}.queen-seat .seat-orb{width:34px!important;height:34px!important;grid-row:1/3;border:1px solid #75612e!important;background:radial-gradient(circle,#18131d,#050407 72%)!important}.queen-seat .suit{font-size:20px!important}.queen-seat .seat-label{font-size:9px!important;color:#ddd!important}.queen-seat strong{font-size:9px!important;color:#b2aab2!important}.queen-seat.seated{border-color:#b1653a!important;background:radial-gradient(circle at 25% 50%,#3e1417,#12090f 65%)!important;box-shadow:inset 0 0 20px #ad42262e,0 0 9px #8b4d1933!important}.queen-seat.seated strong{color:#f6c95d!important}.queen-seat.hearts .suit{color:#ff4657}.queen-seat.diamonds .suit{color:#ff9c19}.queen-seat.clubs .suit{color:#8b8192}.queen-seat.spades .suit{color:#b7aabb}
.royal-edge{position:relative;border:1px solid #40284c;border-radius:10px;background:#08070b;padding:18px 18px 7px;overflow:visible}.edge-title{position:absolute;top:3px;left:50%;transform:translateX(-50%);font:700 12px Georgia,serif;color:#d7b76f;letter-spacing:.1em}.edge-line-wrap{position:relative}.track-numbers{display:grid;grid-template-columns:repeat(13,1fr);font:700 10px Georgia,serif;color:#e75f4e;margin-bottom:2px;text-align:center}.track-numbers span:nth-child(n+8){color:#d985f7}.royal-track{height:27px!important;border:0!important;border-radius:0!important;background:transparent!important;overflow:visible!important;position:relative}.royal-track::before{content:"";position:absolute!important;left:0;right:0;top:50%;height:2px!important;background:linear-gradient(90deg,#da5c3b,#c68b38 43%,#ead781 50%,#b65bdf 57%,#b146e0)!important;box-shadow:0 0 8px #9f43ce55!important}.royal-track::after{content:"";position:absolute;inset:5px 0;background:repeating-linear-gradient(90deg,transparent 0 calc(8.333% - 1px),#ae793e 0 8.333%);opacity:.65;mask:linear-gradient(#000 0 0) center/100% 11px no-repeat}.royal-track .zero{display:none}.queen-marker{width:47px!important;height:68px!important;margin-left:-23px!important;top:50%!important;z-index:10!important;border:2px solid #ecbf59!important;box-shadow:0 0 0 2px #51236e,0 0 24px #b14ce3aa,0 9px 22px #000c!important}.queen-copy{position:absolute;left:50%;top:51px;transform:translateX(-50%);font-size:11px!important;color:#fff!important;background:#2a1037;border:1px solid #773595;border-radius:5px;padding:3px 12px;white-space:nowrap}.waiting-row{display:flex;justify-content:space-between;margin-top:45px;padding:0 22px}.waiting-cluster{display:grid;gap:4px;color:#e5c16e;font:700 9px Georgia,serif}.waiting-cluster.human-side{text-align:right}.waiting-queen:empty::before{content:"○  ○  ○  ○";font-size:28px;line-height:20px;letter-spacing:4px;color:#d49b32}.waiting-queen{min-height:23px!important;background:none!important;border:0!important;padding:0!important}.waiting-queen:not(:empty){min-width:98px}
.queue-duel{display:grid;grid-template-columns:1fr 170px 1fr;gap:12px;align-items:center;padding:0 12px}.queue-side{min-width:0}.queue-label,.execution-order>span{display:block;text-align:center;font:700 10px Georgia,serif;color:#d6b56c;letter-spacing:.06em;margin-bottom:5px}.opponent-queue,.team-slots{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:8px!important;height:64px!important}.back-card,.slot{height:64px!important;min-height:0!important;border:1px solid #4d3358!important;border-radius:6px!important;background:#0a080c!important}.back-card{background:radial-gradient(circle,#4a1761,#160a20 60%,#08060b);box-shadow:inset 0 0 0 3px #120919,inset 0 0 0 4px #6f3188}.team-slots .card{height:64px!important;min-height:64px!important;padding:4px!important}.team-slots .card .card-effect,.team-slots .card .card-name{display:none!important}.queue-label-row{position:relative}.ready-pill{position:absolute!important;right:0;top:-3px}.execution-order{align-self:center}.order-dots{display:flex;align-items:center;justify-content:center;gap:5px}.order-dots i,.order-dots b{display:block;width:9px;height:9px;border-radius:50%;border:1px solid #9d742d;background:#08070a}.order-dots b{background:#9b3cce;border-color:#d36fff;box-shadow:0 0 8px #b74be4}
.hand-zone{display:grid;grid-template-columns:95px minmax(0,1fr) 95px;gap:8px;align-items:stretch;min-height:0}.resource-card{border:1px solid #4a2a56;border-radius:8px;background:linear-gradient(180deg,#0d0912,#070609);display:grid;place-items:center;align-content:center;gap:2px;text-align:center}.resource-card>span{font:700 9px Georgia,serif;color:#d9ba70}.resource-card>strong{font:700 24px Georgia,serif;color:#d997ff}.resource-card>small{font-size:7px;color:#9d8f9e}.resource-card>em{font-style:normal;font-size:8px;color:#b88dca}.mini-deck{margin-top:8px;border:1px solid #68427b;border-radius:5px;padding:4px 7px;background:#1a0d24}.mini-deck span{display:block;font-size:7px;color:#a795ad}.mini-deck b{font-size:12px;color:#e6c466}.hand-center{position:relative;border:1px solid #43284d;border-radius:10px;background:linear-gradient(180deg,#0b0810,#050407);overflow:visible;min-height:0}.hand-heading{position:absolute;top:4px;left:0;right:0;z-index:2;text-align:center;font:700 11px Georgia,serif;color:#d6b86f}.hand-heading small{margin-left:10px;color:#9d8aa0}.hand{position:absolute;left:0;right:0;bottom:-2px;height:calc(100% - 22px)!important;display:flex!important;justify-content:center!important;align-items:flex-end!important;gap:0!important;padding:0 24px!important;overflow:visible!important}.hand .card{flex:0 1 76px!important;width:clamp(48px,5.3vw,78px)!important;max-width:78px!important;height:92%!important;margin-left:-7px!important;transform:translateY(var(--fan-y)) rotate(var(--fan-rot))!important;transform-origin:50% 125%!important;border-radius:6px!important}.hand .card:first-child{margin-left:0!important}.hand .card:hover{transform:translateY(-16px) rotate(0deg) scale(1.1)!important;z-index:50!important}.hand .card-effect{font-size:clamp(.42rem,.48vw,.55rem)!important}.hand .card-name{font-size:.4rem!important}
.court-and-resources{display:grid;grid-template-columns:95px minmax(0,1fr) 95px;gap:8px}.court-and-resources .human-court-strip{height:86px!important}.reverse-orb{border:1px solid #4b2c56;border-radius:9px;background:#09070c;display:grid;place-items:center;align-content:center}.reverse-orb span{font:700 9px Georgia,serif;color:#d5b66e}.reverse-orb strong{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;margin:3px 0;border:2px solid #aa7932;background:radial-gradient(circle,#2e1539,#09070c 70%);font:700 21px Georgia,serif;color:#edc75d;box-shadow:0 0 15px #8639b944}.reverse-orb small{font-size:7px;color:#a795ad}.your-reverse strong{border-color:#8d46ae;color:#d98cff}
.bottom-controls{display:grid;grid-template-columns:220px 1fr 285px;gap:8px;min-height:0}.queue-confirm-block,.card-powers-strip,.reverse-rule{border:1px solid #43284d;border-radius:8px;background:#09070c}.queue-confirm-block{display:grid;align-content:center;padding:5px}.confirmations{font-size:8px!important;max-height:28px;overflow:hidden}.queue-actions{display:flex;gap:5px}.queue-actions button{font-size:9px;padding:5px 8px}.card-powers-strip{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;padding:7px}.card-powers-strip>div{min-width:0;border:1px solid #3e2d47;border-radius:6px;display:grid;place-items:center;align-content:center;padding:3px;background:linear-gradient(180deg,#0f0b13,#070609);text-align:center}.card-powers-strip b{font:700 17px Georgia,serif;color:#eee}.card-powers-strip b.heart{color:#ec4b5b}.card-powers-strip b.diamond{color:#e17529}.card-powers-strip b.club{color:#46c08a}.card-powers-strip strong{font-size:8px;color:#e5d1eb}.card-powers-strip span{font-size:6px;color:#95899b;line-height:1.15}.reverse-rule{padding:8px 10px;display:grid;align-content:center;gap:4px}.reverse-rule>span{font:700 9px Georgia,serif;color:#e0bd68}.reverse-rule>strong{font-size:9px;color:#d9a4f0;line-height:1.3}.reverse-rule>small{font-size:7px;color:#776d7b}.hidden{display:none!important}
@media(max-height:800px){.royal-board{grid-template-rows:92px 125px 82px minmax(118px,1fr) 70px 90px}.royal-topbar{height:48px!important}.royal-logo{font-size:18px}.queen-seat{grid-template-columns:32px 1fr!important;padding:4px 7px!important}.queen-seat .seat-orb{width:28px!important;height:28px!important}.waiting-row{margin-top:34px}.queen-marker{width:40px!important;height:58px!important;margin-left:-20px!important}.hand .card{max-width:70px!important}.card-powers-strip span{display:none}.bottom-controls{grid-template-columns:190px 1fr 240px}}
@media(max-width:1250px){.royal-topbar{grid-template-columns:190px 78px 130px 1fr auto}.royal-logo{font-size:18px}.score-chip{display:none}.royal-board{grid-template-rows:100px 140px 90px minmax(130px,1fr) 78px 100px}.hand .card{margin-left:-10px!important}.card-powers-strip span{display:none}.bottom-controls{grid-template-columns:190px 1fr 240px}}

/* v0.10 Royal Table Proportion Pass — tuned against the top-left reference mockup */
body.game-active{
  background:
    radial-gradient(circle at 50% -10%,rgba(93,26,121,.24),transparent 34%),
    radial-gradient(circle at 10% 55%,rgba(90,28,109,.12),transparent 28%),
    linear-gradient(180deg,#08050b 0%,#050307 100%);
}
body.game-active .shell{width:100%;max-width:none}
#game-screen.game-shell{
  width:min(1420px,calc(100vw - 48px));
  margin:0 auto;
  padding:10px 12px 12px;
  background:
    radial-gradient(circle at 50% 35%,rgba(99,31,125,.10),transparent 38%),
    linear-gradient(180deg,#0c0710 0%,#070509 100%);
  border-left:1px solid rgba(111,54,133,.26);
  border-right:1px solid rgba(111,54,133,.26);
  box-shadow:0 0 70px rgba(0,0,0,.7);
}
.royal-topbar{
  height:58px!important;
  grid-template-columns:250px 88px 145px 1fr auto!important;
  padding:0 14px!important;
  border:1px solid #54276a!important;
  border-radius:12px!important;
  background:
    radial-gradient(circle at 14% 50%,rgba(122,42,151,.18),transparent 30%),
    linear-gradient(180deg,#16091d,#0b0710)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.04),0 9px 25px rgba(0,0,0,.28)!important;
}
.royal-logo{font-size:24px!important;letter-spacing:.055em!important;text-shadow:0 0 14px rgba(237,198,92,.18)}
.logo-crown{font-size:30px!important;filter:drop-shadow(0 0 8px #9d44d0)}
.hud-chip{height:42px!important;border-radius:8px!important;background:linear-gradient(180deg,#21102a,#100816)!important}
.score-chip{justify-self:center;min-width:160px}
.royal-button{min-width:112px;height:38px;font-weight:700}
.menu-icon{height:38px!important}

.royal-board{
  width:100%;
  height:calc(100vh - 88px);
  grid-template-rows:102px 164px 104px minmax(156px,1fr) 82px 102px!important;
  gap:8px!important;
  margin-top:8px!important;
  padding:0!important;
}
.royal-board>*,.court-strip,.royal-edge,.queue-confirm-block,.card-powers-strip,.reverse-rule,.resource-card,.reverse-orb,.hand-center{
  box-shadow:inset 0 1px rgba(255,255,255,.025),0 8px 20px rgba(0,0,0,.18);
}
.court-strip{
  width:min(1110px,92%);
  justify-self:center;
  padding:25px 14px 9px!important;
  border-color:#5f3470!important;
  background:
    radial-gradient(circle at 50% 0,rgba(104,38,128,.13),transparent 48%),
    linear-gradient(180deg,#130b17,#09060c)!important;
}
.court-seats{gap:13px!important}
.queen-seat{
  grid-template-columns:48px 1fr!important;
  column-gap:11px!important;
  padding:8px 14px!important;
  border-color:#4d3b57!important;
  background:linear-gradient(180deg,#120e16,#09070b)!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.012)!important;
}
.queen-seat .seat-orb{
  width:39px!important;height:39px!important;
  border:1px solid #a77835!important;
  box-shadow:inset 0 0 0 5px #08060a,0 0 0 1px #3c2a18,0 0 10px rgba(143,79,171,.12)!important;
}
.queen-seat .seat-label{font-size:10px!important;letter-spacing:.06em}
.queen-seat strong{font-size:10px!important;letter-spacing:.04em}
.queen-seat.seated{box-shadow:inset 0 0 24px rgba(190,75,31,.16),0 0 12px rgba(217,142,49,.10)!important}

.royal-edge{
  width:min(1135px,94%);
  justify-self:center;
  padding:19px 28px 8px!important;
  border-color:#5b326b!important;
  background:
    radial-gradient(ellipse at center,rgba(69,23,89,.18),transparent 58%),
    linear-gradient(180deg,#0c0810,#070509)!important;
  overflow:visible!important;
}
.edge-title{font-size:13px!important;top:4px!important}
.track-numbers{font-size:10px!important;margin:1px 20px 5px!important}
.royal-track{margin:0 20px;height:34px!important}
.royal-track::before{height:3px!important;box-shadow:0 0 13px rgba(179,70,219,.32)!important}
.royal-track::after{inset:7px 0!important}
.queen-marker{
  width:72px!important;height:101px!important;
  margin-left:-36px!important;
  top:50%!important;
  border:2px solid #f1c65e!important;
  border-radius:8px!important;
  box-shadow:0 0 0 2px #5d2778,0 0 32px rgba(178,69,222,.7),0 14px 26px rgba(0,0,0,.8)!important;
}
.queen-marker .queen-rank{font-size:17px!important}
.queen-marker .queen-suit{font-size:32px!important}
.queen-copy{top:72px!important;font-size:11px!important;padding:4px 13px!important}
.waiting-row{margin-top:56px!important;padding:0 20px!important;align-items:end}
.waiting-cluster{min-width:200px;font-size:10px!important}
.waiting-cluster.human-side{justify-items:end}
.waiting-queen:empty::before{font-size:31px!important;letter-spacing:6px!important;color:#d6a64d!important}

.queue-duel{
  width:min(1000px,88%);
  justify-self:center;
  grid-template-columns:minmax(0,1fr) 150px minmax(0,1fr)!important;
  gap:18px!important;
  padding:0!important;
}
.queue-label,.execution-order>span{font-size:10px!important;margin-bottom:7px!important}
.opponent-queue,.team-slots{height:70px!important;gap:9px!important}
.back-card,.slot{height:70px!important;border-radius:8px!important}
.back-card{box-shadow:inset 0 0 0 3px #110817,inset 0 0 0 4px #7b3696,0 5px 12px rgba(0,0,0,.35)!important}
.order-dots i,.order-dots b{width:10px;height:10px}

.hand-zone{
  width:min(1160px,96%);
  justify-self:center;
  grid-template-columns:118px minmax(0,1fr) 118px!important;
  gap:12px!important;
}
.resource-card{
  border-color:#603574!important;
  background:
    radial-gradient(circle at 50% 30%,rgba(105,36,133,.20),transparent 55%),
    linear-gradient(180deg,#120b17,#08060b)!important;
}
.resource-card>span{font-size:10px!important}.resource-card>strong{font-size:30px!important}.resource-card>small{font-size:8px!important}.resource-card>em{font-size:9px!important}
.mini-deck{margin-top:9px!important;padding:6px 9px!important;border-color:#805098!important;background:linear-gradient(180deg,#281137,#130a1b)!important}
.mini-deck span{font-size:8px!important}.mini-deck b{font-size:14px!important}
.hand-center{
  border-color:#5b316b!important;
  background:
    radial-gradient(ellipse at 50% 110%,rgba(101,32,126,.22),transparent 58%),
    linear-gradient(180deg,#0d0911,#070509)!important;
}
.hand-heading{font-size:12px!important;top:5px!important}
.hand{padding:0 34px!important;bottom:-1px!important}
.hand .card{
  flex-basis:82px!important;
  width:clamp(56px,5vw,82px)!important;
  max-width:82px!important;
  height:91%!important;
  margin-left:-8px!important;
  box-shadow:0 6px 13px rgba(0,0,0,.48)!important;
}
.hand .card:hover{transform:translateY(-23px) rotate(0deg) scale(1.13)!important;box-shadow:0 11px 26px rgba(0,0,0,.65),0 0 0 2px rgba(184,83,224,.35)!important}
.hand .card-effect{font-size:clamp(.43rem,.46vw,.55rem)!important;line-height:1.15!important}

.court-and-resources{
  width:min(1110px,92%);
  justify-self:center;
  grid-template-columns:105px minmax(0,1fr) 105px!important;
  gap:12px!important;
}
.court-and-resources .human-court-strip{width:100%!important;height:82px!important}
.reverse-orb{
  border-color:#613575!important;
  background:radial-gradient(circle at 50% 50%,rgba(104,35,133,.23),#08060b 66%)!important;
}
.reverse-orb strong{
  width:54px!important;height:54px!important;
  border-color:#bb8935!important;
  font-size:25px!important;
  box-shadow:0 0 22px rgba(144,52,184,.35),inset 0 0 18px rgba(109,43,139,.24)!important;
}
.your-reverse strong{border-color:#a95ac7!important;color:#e5a2ff!important}

.bottom-controls{
  width:min(1200px,98%);
  justify-self:center;
  grid-template-columns:180px minmax(0,1fr) 230px!important;
  gap:10px!important;
}
.queue-confirm-block,.card-powers-strip,.reverse-rule{border-color:#533064!important;background:linear-gradient(180deg,#100a14,#08060b)!important}
.card-powers-strip{padding:8px!important;gap:6px!important}
.card-powers-strip>div{border-color:#4f3659!important;padding:5px 3px!important;background:linear-gradient(180deg,#160d1b,#0a0710)!important}
.card-powers-strip b{font-size:20px!important}.card-powers-strip strong{font-size:9px!important}.card-powers-strip span{font-size:7px!important}
.reverse-rule{padding:9px 12px!important}.reverse-rule>span{font-size:10px!important}.reverse-rule>strong{font-size:10px!important}.reverse-rule>small{display:none!important}
.queue-confirm-block{padding:7px!important}.queue-actions{justify-content:center!important}.queue-actions button{font-size:10px!important;padding:6px 9px!important}

/* give the main playfield the ornamental framed feel from the visual target */
.royal-board::before,.royal-board::after{content:"";position:fixed;pointer-events:none;z-index:-1;width:180px;height:180px;opacity:.18;background:radial-gradient(circle at 0 0,#9e5ab8,transparent 64%)}
.royal-board::before{left:0;top:70px}.royal-board::after{right:0;bottom:0;transform:rotate(180deg)}

@media(max-height:820px){
  #game-screen.game-shell{padding-top:7px}
  .royal-topbar{height:50px!important}
  .royal-board{height:calc(100vh - 72px);grid-template-rows:88px 137px 86px minmax(128px,1fr) 70px 88px!important;gap:6px!important}
  .queen-marker{width:60px!important;height:84px!important;margin-left:-30px!important}
  .queen-marker .queen-suit{font-size:27px!important}.queen-copy{top:58px!important}
  .waiting-row{margin-top:43px!important}
  .queen-seat{grid-template-columns:36px 1fr!important;padding:5px 9px!important}.queen-seat .seat-orb{width:31px!important;height:31px!important}
  .opponent-queue,.team-slots,.back-card,.slot{height:58px!important}
  .resource-card>strong{font-size:24px!important}.mini-deck{margin-top:4px!important;padding:3px 7px!important}
  .hand .card{max-width:74px!important}.hand .card:hover{transform:translateY(-17px) rotate(0deg) scale(1.1)!important}
  .reverse-orb strong{width:44px!important;height:44px!important;font-size:21px!important}
  .card-powers-strip span{display:none!important}
}
@media(max-width:1450px){
  #game-screen.game-shell{width:calc(100vw - 28px)}
  .court-strip,.court-and-resources{width:94%}.royal-edge{width:95%}.queue-duel{width:91%}.hand-zone{width:97%}.bottom-controls{width:99%}
}

/* v0.11 premium card + readable powers + inline queue controls */
.human-queue-side{min-width:0}
.human-queue-row{display:grid;grid-template-columns:minmax(0,1fr) 112px;gap:9px;align-items:stretch}
.human-queue-row .team-slots{width:100%;margin:0}
.queue-actions-inline{display:grid!important;grid-template-rows:1fr 1fr;gap:6px!important;align-items:stretch!important}
.queue-actions-inline button{width:100%;padding:5px 7px!important;font-size:9px!important;font-weight:800;line-height:1.05}

/* Card Powers are reference text, so favor legibility over tiny dashboard density. */
.card-powers-strip>div{min-height:66px!important;padding:6px 5px!important}
.card-powers-strip b{font-size:25px!important;line-height:1!important;transform:translateY(-2px)}
.card-powers-strip strong{font:700 13px/1 Georgia,serif!important;color:#f3d489!important}
.card-powers-strip span{display:block!important;font-size:10px!important;line-height:1.12!important;color:#eee3d4!important;margin-top:3px}
.card-powers-strip>div:nth-child(5) b,.card-powers-strip>div:nth-child(6) b,.card-powers-strip>div:nth-child(7) b{font-size:29px!important;transform:translateY(-4px)}

/* Master card template: ivory stock, double gold frame, filigree corners, strong suit identity. */
.card{
  overflow:hidden;
  padding:9px 7px 8px!important;
  border:2px solid #c79635!important;
  border-radius:9px!important;
  background:
    radial-gradient(circle at 50% 42%,rgba(255,255,255,.94),rgba(244,234,215,.96) 52%,rgba(222,205,176,.98)),
    linear-gradient(135deg,#fffaf0,#e5d1ac)!important;
  box-shadow:inset 0 0 0 2px #fff8df,inset 0 0 0 4px rgba(78,45,18,.42),0 7px 16px rgba(0,0,0,.55)!important;
  color:#20170f!important;
}
.card::before,.card::after{content:"❧";position:absolute;color:#b47c22;font:700 17px/1 Georgia,serif;opacity:.95;pointer-events:none}
.card::before{right:5px;top:5px}.card::after{left:5px;bottom:4px;transform:rotate(180deg)}
.card-rank{position:relative;z-index:2;align-self:flex-start;font:800 clamp(1.05rem,1.25vw,1.42rem)/.9 Georgia,serif!important;text-shadow:0 1px #fff}
.card-symbol{position:absolute!important;left:50%;top:38%;transform:translate(-50%,-50%);z-index:1;font-size:clamp(2.2rem,3vw,3.5rem)!important;line-height:1;filter:drop-shadow(0 2px 0 rgba(188,139,47,.75)) drop-shadow(0 3px 3px rgba(0,0,0,.22))}
.card-name{position:relative;z-index:2;margin-top:auto;padding-top:3px;border-top:1px solid rgba(153,105,36,.42);font:800 clamp(.54rem,.58vw,.7rem)/1 Georgia,serif!important;letter-spacing:.04em;text-align:center;white-space:normal!important;overflow:visible!important;text-overflow:clip!important}
.card-effect{display:block!important;position:relative;z-index:2;min-height:2.25em;margin-top:3px;font-size:clamp(.46rem,.49vw,.59rem)!important;line-height:1.08!important;text-align:center;color:#241b13!important}
.card.hearts .card-rank,.card.hearts .card-symbol,.card.diamonds .card-rank,.card.diamonds .card-symbol{color:#a82327!important}
.card.clubs .card-rank,.card.clubs .card-symbol{color:#075b31!important}
.card.spades .card-rank,.card.spades .card-symbol{color:#15131a!important}
.card.ace .card-rank,.card.ace .card-symbol{color:#234f86!important}
.card.king .card-rank,.card.king .card-symbol{color:#8e301f!important}
.card.jack .card-rank,.card.jack .card-symbol{color:#532b79!important}

/* Stronger real fan: each card has its own angle and vertical arc. */
.hand{overflow:visible!important;align-items:end!important;justify-content:center!important;gap:0!important;padding:0 38px 4px!important}
.hand .card{transform-origin:50% 120%;margin-left:-12px!important;height:94%!important;transition:transform .16s ease,filter .16s ease,box-shadow .16s ease,opacity .16s ease!important}
.hand .card:nth-child(1){transform:translateY(14px) rotate(-10deg)}
.hand .card:nth-child(2){transform:translateY(9px) rotate(-8deg)}
.hand .card:nth-child(3){transform:translateY(5px) rotate(-6deg)}
.hand .card:nth-child(4){transform:translateY(2px) rotate(-4deg)}
.hand .card:nth-child(5){transform:translateY(0) rotate(-2.5deg)}
.hand .card:nth-child(6){transform:translateY(-1px) rotate(-1deg)}
.hand .card:nth-child(7){transform:translateY(-1px) rotate(1deg)}
.hand .card:nth-child(8){transform:translateY(0) rotate(2.5deg)}
.hand .card:nth-child(9){transform:translateY(2px) rotate(4deg)}
.hand .card:nth-child(10){transform:translateY(5px) rotate(6deg)}
.hand .card:nth-child(11){transform:translateY(9px) rotate(8deg)}
.hand .card:nth-child(12){transform:translateY(14px) rotate(10deg)}
.hand .card:hover{z-index:30!important;transform:translateY(-29px) rotate(0deg) scale(1.16)!important;box-shadow:inset 0 0 0 2px #fff8df,inset 0 0 0 4px rgba(78,45,18,.42),0 15px 30px rgba(0,0,0,.72),0 0 0 3px #9f4bc4,0 0 25px rgba(181,69,222,.7)!important}
.hand .card.queued{opacity:.28!important;filter:grayscale(.65) brightness(.7)}

/* Queue cards retain the premium identity without cramming the full hand layout. */
.slot .card,.result-card{padding:5px!important;border-width:1px!important}
.slot .card .card-symbol,.result-card .card-symbol{font-size:1.65rem!important;top:40%}
.slot .card .card-effect{font-size:.43rem!important;min-height:0}

/* Resolution: active card physically lifts/glows; completed cards remain visibly dimmed. */
.result-card{transition:transform .22s ease,filter .22s ease,opacity .22s ease,box-shadow .22s ease!important}
.result-card.active{z-index:20!important;opacity:1!important;filter:none!important;transform:translateY(-25px) scale(1.12)!important;box-shadow:inset 0 0 0 2px #fff8df,0 15px 30px rgba(0,0,0,.72),0 0 0 3px #b54ee0,0 0 30px rgba(181,78,224,.8)!important}
.result-card.resolved{opacity:.27!important;filter:grayscale(.85) brightness(.55)!important;transform:translateY(3px) scale(.97)!important}

@media(max-height:820px){
 .card-powers-strip>div{min-height:57px!important}.card-powers-strip b{font-size:21px!important}.card-powers-strip strong{font-size:11px!important}.card-powers-strip span{display:block!important;font-size:8px!important}
 .hand .card{height:92%!important}.card-symbol{font-size:2.25rem!important}.card-effect{font-size:.44rem!important}
}

/* v0.12 one-to-one royal table — square composition and bespoke game art */
body.game-active{
  min-height:100vh;
  display:grid;
  place-items:center;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 4%,rgba(91,26,119,.30),transparent 29%),
    radial-gradient(circle at 50% 100%,rgba(67,18,88,.24),transparent 39%),
    #020104;
}
body.game-active .shell{height:100vh;display:grid;place-items:center}
#game-screen.game-shell{
  --royal-ink:#07030b;
  --royal-plum:#170823;
  --royal-violet:#6d2187;
  --royal-gold:#c9942b;
  --royal-bright:#f5cd5c;
  position:relative;
  width:min(1254px,100vw,100vh)!important;
  height:min(1254px,100vw,100vh)!important;
  aspect-ratio:1/1;
  margin:auto!important;
  padding:7px 18px 13px!important;
  overflow:hidden!important;
  isolation:isolate;
  border:2px solid #ac7520!important;
  border-radius:0!important;
  background:
    radial-gradient(ellipse at 50% 46%,rgba(75,18,104,.22),transparent 52%),
    repeating-linear-gradient(112deg,rgba(255,255,255,.012) 0 1px,transparent 1px 5px),
    linear-gradient(180deg,#0f0616 0%,#08030d 48%,#11051a 100%)!important;
  box-shadow:
    inset 0 0 0 3px #250d31,
    inset 0 0 0 5px rgba(220,160,45,.72),
    inset 0 0 64px #000,
    0 0 70px #000!important;
}
#game-screen.game-shell::before,#game-screen.game-shell::after{
  content:"❦";
  position:absolute;
  z-index:50;
  width:56px;
  height:56px;
  display:grid;
  place-items:center;
  color:#f1be43;
  font:700 38px/1 Georgia,serif;
  text-shadow:0 0 8px #73320b;
  pointer-events:none;
}
#game-screen.game-shell::before{left:0;top:0;transform:rotate(-42deg)}
#game-screen.game-shell::after{right:0;bottom:0;transform:rotate(138deg)}

.royal-topbar{
  height:7%!important;
  min-height:0!important;
  grid-template-columns:210px 82px 112px minmax(155px,1fr) auto!important;
  gap:10px!important;
  padding:5px 18px!important;
  border:1px solid #b47724!important;
  border-radius:4px!important;
  background:
    linear-gradient(90deg,rgba(83,23,105,.35),transparent 25% 75%,rgba(83,23,105,.30)),
    linear-gradient(180deg,#15071e,#09030e)!important;
  box-shadow:inset 0 0 0 2px #341044,0 5px 18px #0009!important;
}
.royal-logo{
  justify-content:flex-start!important;
  color:#f4c84f!important;
  font:700 clamp(17px,2.15vh,27px)/.88 Georgia,serif!important;
  letter-spacing:.035em!important;
  text-shadow:0 2px #5f2808,0 0 10px rgba(249,202,70,.23)!important;
}
.royal-logo small{font-size:.42em!important;vertical-align:super}
.logo-crown{font-size:clamp(26px,3.7vh,43px)!important;color:#c74df2!important}
.hud-chip,.score-chip{
  height:78%!important;
  min-height:0!important;
  border:1px solid #8d5520!important;
  border-radius:4px!important;
  background:linear-gradient(180deg,#28102f,#100718)!important;
  box-shadow:inset 0 0 0 1px #4d215b!important;
}
.score-chip{display:flex!important}
.hud-chip span,.score-chip span{color:#ebc45e!important;font-family:Georgia,serif!important}
.hud-chip strong,.score-chip strong{color:#fff2d0!important;font-family:Georgia,serif!important}
.score-chip{justify-self:center!important;padding:0 20px!important;gap:12px!important}
.royal-button,.menu-icon{
  height:72%!important;
  border:1px solid #b77c27!important;
  border-radius:4px!important;
  background:linear-gradient(#4c155d,#250a31)!important;
  box-shadow:inset 0 0 0 2px #190520,0 0 0 1px #5d2a6a!important;
  color:#fff4d2!important;
  font:700 clamp(10px,1.25vh,16px) Georgia,serif!important;
}

.royal-board{
  width:100%!important;
  height:calc(93% - 8px)!important;
  grid-template-rows:1.06fr 1.72fr .98fr 1.95fr 1.10fr 1.38fr!important;
  gap:6px!important;
  margin-top:7px!important;
  padding:0 5px 2px!important;
}
.royal-board>*,.court-strip,.royal-edge,.hand-center,.resource-card,.reverse-orb,.queue-confirm-block,.card-powers-strip,.reverse-rule{
  border-color:#9a6525!important;
  box-shadow:inset 0 0 0 1px #3c174b,0 4px 12px #0008!important;
}
.court-strip{
  width:98%!important;
  padding:25px 12px 8px!important;
  border-radius:5px!important;
  background:
    linear-gradient(90deg,transparent,rgba(95,25,126,.15),transparent),
    linear-gradient(180deg,#13081b,#08040d)!important;
}
.court-name{
  top:5px!important;
  color:#f0c74f!important;
  font:700 clamp(10px,1.25vh,15px) Georgia,serif!important;
  text-shadow:0 1px #552400!important;
}
.court-name::before,.court-name::after{content:" ───── ";color:#7d5424}
.court-seats{gap:10px!important}
.queen-seat{
  position:relative;
  height:100%!important;
  min-height:0!important;
  display:grid!important;
  grid-template-columns:82px minmax(0,1fr)!important;
  grid-template-rows:1fr 1fr!important;
  column-gap:4px!important;
  padding:8px 9px 7px 84px!important;
  overflow:hidden;
  border:1px solid #856025!important;
  border-radius:4px!important;
  background:linear-gradient(180deg,#130b18,#09050d)!important;
}
.queen-seat::before{
  content:"";
  position:absolute;
  left:4px;
  top:-9px;
  bottom:-9px;
  width:78px;
  background:url('/assets/royal-throne.png') center/contain no-repeat;
  mix-blend-mode:screen;
  opacity:.92;
  filter:saturate(1.2) contrast(1.05);
}
.queen-seat::after{
  content:"○ ○ ○ ○ ○";
  position:absolute;
  right:8px;
  bottom:5px;
  color:#d99f25;
  font:700 clamp(8px,1.05vh,13px)/1 Georgia,serif;
  letter-spacing:1px;
  white-space:nowrap;
}
.queen-seat .seat-orb{
  position:absolute!important;
  z-index:2;
  left:23px;
  top:42%;
  width:36px!important;
  height:36px!important;
  transform:translateY(-50%);
  border:0!important;
  background:none!important;
  box-shadow:none!important;
}
.queen-seat .suit{font-size:clamp(23px,3.1vh,38px)!important;opacity:1!important;filter:drop-shadow(0 1px 2px #000)}
.queen-seat .seat-label{align-self:end!important;color:#f1d17a!important;font:700 clamp(8px,1.05vh,12px) Georgia,serif!important;letter-spacing:.05em!important}
.queen-seat strong{align-self:start!important;color:#eee5d6!important;font:700 clamp(8px,.95vh,11px) Georgia,serif!important}
.queen-seat.seated{background:radial-gradient(circle at 35% 50%,#501a2f,#130713 65%)!important;box-shadow:inset 0 0 22px #c05a2630,0 0 10px #d9992a33!important}

.royal-edge{
  width:98%!important;
  padding:22px 28px 8px!important;
  border-radius:5px!important;
  background:
    radial-gradient(ellipse at 50% 45%,rgba(92,27,127,.28),transparent 54%),
    linear-gradient(180deg,#100619,#08040d)!important;
}
.edge-title{top:4px!important;color:#f3ca52!important;font:700 clamp(10px,1.35vh,16px) Georgia,serif!important}
.edge-title::before,.edge-title::after{content:"  ✦  ";color:#bc812b}
.track-numbers{margin:2px 13px 4px!important;color:#ff5a3c!important;font-size:clamp(8px,1.05vh,12px)!important}
.track-numbers span:nth-child(n+8){color:#e274fa!important}
.royal-track{height:37px!important;margin:0 13px!important}
.royal-track::before{height:4px!important;background:linear-gradient(90deg,#f14b34 0%,#ff9e29 44%,#fff2a2 50%,#d76cff 56%,#b22ee1 100%)!important;box-shadow:0 0 11px #bd4ed7!important}
.royal-track::after{inset:5px 0!important;opacity:.95!important;background:repeating-linear-gradient(90deg,transparent 0 calc(8.333% - 2px),#e1a736 0 calc(8.333% - 1px),transparent 0 8.333%)!important}
.queen-marker{
  width:92px!important;
  height:130px!important;
  margin-left:-46px!important;
  top:52%!important;
  overflow:hidden!important;
  border:2px solid #f6cf62!important;
  border-radius:9px!important;
  background:#f4ead5 url('/assets/queen-diamonds.png') center/cover no-repeat!important;
  box-shadow:0 0 0 3px #64217d,0 0 28px #cf5affb5,0 11px 22px #000d!important;
}
.queen-marker .queen-rank,.queen-marker .queen-suit{opacity:0!important}
.queen-copy{
  top:86px!important;
  min-width:150px;
  padding:4px 14px!important;
  border-color:#d39b31!important;
  border-radius:4px!important;
  background:linear-gradient(#3b1649,#190722)!important;
  color:#fff3d3!important;
  font:700 clamp(8px,1vh,12px) Georgia,serif!important;
}
.waiting-row{margin-top:76px!important;padding:0 24px!important}
.waiting-cluster{min-width:225px!important;color:#efd071!important;font-size:clamp(8px,1vh,12px)!important}
.waiting-empty{display:flex;gap:13px;align-items:center;justify-content:flex-start;height:28px}
.human-side .waiting-empty{justify-content:flex-end}
.waiting-empty i{display:block;width:23px;height:23px;border:2px solid #eeb43b;border-radius:50%;box-shadow:inset 0 0 8px #000,0 0 7px rgba(237,176,52,.16)}

.queue-duel{
  width:95%!important;
  grid-template-columns:minmax(0,1fr) 160px minmax(0,1fr)!important;
  gap:16px!important;
  padding:0 7px!important;
}
.queue-label,.execution-order>span{color:#f0ca63!important;font:700 clamp(8px,1.05vh,12px) Georgia,serif!important}
.opponent-queue,.team-slots{height:74%!important;min-height:58px!important;gap:9px!important}
.back-card,.slot{
  height:100%!important;
  min-height:58px!important;
  border:1px solid #b6782b!important;
  border-radius:7px!important;
  background:#0a050f!important;
  box-shadow:inset 0 0 0 2px #381143,0 4px 10px #0008!important;
}
.back-card{
  background:#12051c url('/assets/royal-card-back.png') center/94% 94% no-repeat!important;
  filter:saturate(1.15);
}
.human-queue-row{height:calc(100% - 20px)!important;grid-template-columns:minmax(0,1fr) 90px!important;gap:8px!important}
.human-queue-row .team-slots{height:100%!important}
.team-slots .card{height:100%!important;min-height:0!important}
.queue-actions-inline{gap:5px!important}
.queue-actions-inline button{border-color:#a86e25!important;background:linear-gradient(#461354,#22092d)!important;color:#f5e8c5!important;font-family:Georgia,serif!important}
.order-dots{gap:5px!important}
.order-dots i,.order-dots b{width:11px!important;height:11px!important;border-color:#c4932b!important}

.hand-zone{
  width:99%!important;
  grid-template-columns:108px minmax(0,1fr) 108px!important;
  gap:10px!important;
}
.resource-card{
  position:relative;
  overflow:hidden;
  padding:8px 5px!important;
  border-radius:6px!important;
  background:
    url('/assets/royal-card-back.png') center 58%/64% auto no-repeat,
    radial-gradient(circle at 50% 42%,rgba(108,34,137,.24),transparent 61%),
    linear-gradient(180deg,#13081b,#08040d)!important;
}
.resource-card>*{position:relative;z-index:2;text-shadow:0 1px 3px #000,0 0 5px #000}
.resource-card>span{align-self:start;color:#f0c95e!important;font:700 clamp(8px,.95vh,11px) Georgia,serif!important}
.resource-card>strong{font-size:clamp(21px,3vh,34px)!important;color:#f2b4ff!important}
.resource-card>small,.resource-card>em{color:#fff0cc!important}
.mini-deck{align-self:end!important;border-color:#b57b2c!important;background:linear-gradient(#2a0d36,#120617)!important}
.hand-center{
  border-radius:6px!important;
  background:
    radial-gradient(ellipse at 50% 110%,rgba(123,39,150,.34),transparent 57%),
    linear-gradient(180deg,#100719,#07040c)!important;
}
.hand-heading{top:5px!important;color:#f3ce66!important;font-size:clamp(9px,1.15vh,13px)!important}
.hand{bottom:0!important;height:calc(100% - 20px)!important;padding:0 32px 4px!important}
.hand .card{
  flex:0 1 94px!important;
  width:clamp(61px,7.55vw,94px)!important;
  max-width:94px!important;
  height:88%!important;
  margin-left:-12px!important;
  border-radius:7px!important;
}
.hand .card-rank{font-size:clamp(14px,1.75vh,20px)!important}
.hand .card-symbol{font-size:clamp(28px,3.8vh,44px)!important}
.hand .card-name{font-size:clamp(6px,.68vh,9px)!important}
.hand .card-effect{font-size:clamp(6px,.66vh,8.5px)!important;line-height:1.08!important}
.hand .card:hover{transform:translateY(-25px) rotate(0) scale(1.12)!important}

.court-and-resources{
  width:97%!important;
  grid-template-columns:104px minmax(0,1fr) 104px!important;
  gap:10px!important;
}
.court-and-resources .human-court-strip{height:100%!important;width:100%!important}
.reverse-orb{
  border-radius:6px!important;
  background:radial-gradient(circle at 50% 48%,#391047,#100619 62%,#07030b)!important;
}
.reverse-orb span{color:#f1cc64!important;font-family:Georgia,serif!important}
.reverse-orb strong{width:58px!important;height:58px!important;border-color:#dda936!important;box-shadow:0 0 18px #a82be27a,inset 0 0 18px #61127a!important}

.bottom-controls{
  position:relative;
  width:99%!important;
  grid-template-columns:1fr!important;
  gap:7px!important;
}
.bottom-controls .queue-confirm-block,.bottom-controls .reverse-rule{display:none!important}
.queue-confirm-block,.reverse-rule,.card-powers-strip{border-radius:5px!important;background:linear-gradient(180deg,#12081a,#08040c)!important}
.card-powers-strip{gap:5px!important;padding:7px!important}
.card-powers-strip>div{
  min-height:0!important;
  padding:5px 3px!important;
  border:1px solid #a96f26!important;
  border-radius:4px!important;
  background:linear-gradient(180deg,#160920,#09040f)!important;
  box-shadow:inset 0 0 0 1px #421350!important;
}
.card-powers-strip b{font-size:clamp(20px,3vh,34px)!important}
.card-powers-strip strong{color:#f6d477!important;font:700 clamp(9px,1.15vh,13px) Georgia,serif!important}
.card-powers-strip span{display:block!important;color:#f1e4d0!important;font-size:clamp(6px,.75vh,9px)!important;line-height:1.1!important}
.reverse-rule{padding:7px!important}
.reverse-rule>span{color:#f0c65e!important}.reverse-rule>strong{color:#efbdff!important;font-size:clamp(7px,.78vh,9px)!important}
.queue-confirm-block{padding:6px!important}
.confirmations{color:#ead8f2!important;font-size:clamp(6px,.75vh,9px)!important}

@media(max-height:860px),(max-width:860px){
  #game-screen.game-shell{padding:5px 11px 9px!important}
  .royal-topbar{grid-template-columns:170px 65px 92px minmax(125px,1fr) auto!important;gap:6px!important;padding:4px 12px!important}
  .royal-logo{font-size:16px!important}.logo-crown{font-size:24px!important}
  .score-chip{padding:0 10px!important;gap:7px!important}
  .royal-board{gap:4px!important;margin-top:5px!important}
  .court-strip{padding:20px 8px 5px!important}.queen-seat{grid-template-columns:62px 1fr!important;padding-left:63px!important}.queen-seat::before{width:61px!important}.queen-seat .seat-orb{left:18px!important;width:28px!important;height:28px!important}.queen-seat::after{font-size:7px!important}
  .royal-edge{padding:18px 20px 5px!important}.queen-marker{width:70px!important;height:99px!important;margin-left:-35px!important}.queen-copy{top:63px!important;min-width:120px!important}.waiting-row{margin-top:55px!important}.waiting-cluster{min-width:165px!important}
  .queue-duel{grid-template-columns:minmax(0,1fr) 125px minmax(0,1fr)!important;gap:10px!important}.human-queue-row{grid-template-columns:minmax(0,1fr) 72px!important}
  .hand-zone{grid-template-columns:86px minmax(0,1fr) 86px!important}.hand .card{max-width:76px!important;margin-left:-11px!important}.hand .card-effect{font-size:5.8px!important}.hand .card-name{font-size:6px!important}
  .court-and-resources{grid-template-columns:83px minmax(0,1fr) 83px!important}.reverse-orb strong{width:45px!important;height:45px!important}
  .bottom-controls{grid-template-columns:1fr!important}.card-powers-strip{padding:4px!important;gap:3px!important}.card-powers-strip span{font-size:6px!important}.reverse-rule>small{display:none!important}
}

@media(max-width:650px){
  body.game-active{display:block;overflow:auto}
  body.game-active .shell{display:block;width:100%;height:auto}
  #game-screen.game-shell{width:650px!important;height:650px!important;margin:0!important}
}

/* v0.13 cinematic clarity pass — hierarchy, alignment, responsive composition */
body.game-active{
  background:
    radial-gradient(ellipse at 50% 44%,rgba(86,25,110,.24),transparent 48%),
    radial-gradient(circle at 14% 12%,rgba(171,88,205,.09),transparent 22%),
    radial-gradient(circle at 86% 88%,rgba(183,112,36,.08),transparent 24%),
    linear-gradient(145deg,#020104 0%,#07020a 48%,#030105 100%)!important;
}
#game-screen.game-shell{
  border-color:#b77b25!important;
  background:
    linear-gradient(90deg,rgba(109,34,139,.07),transparent 15% 85%,rgba(109,34,139,.07)),
    radial-gradient(ellipse at 50% 42%,rgba(76,21,103,.20),transparent 54%),
    repeating-linear-gradient(112deg,rgba(255,255,255,.009) 0 1px,transparent 1px 6px),
    linear-gradient(180deg,#100617,#08030d 50%,#0d0414 100%)!important;
  box-shadow:
    inset 0 0 0 2px #281033,
    inset 0 0 0 4px rgba(233,176,59,.62),
    inset 0 0 70px rgba(0,0,0,.78),
    0 26px 90px rgba(0,0,0,.82)!important;
}
#game-screen.game-shell::before,#game-screen.game-shell::after{
  content:""!important;
  display:block!important;
  width:38px!important;
  height:38px!important;
  color:transparent!important;
  border:0!important;
  border-radius:0!important;
  filter:none!important;
  text-shadow:none!important;
}
#game-screen.game-shell::before{
  left:7px!important;top:7px!important;transform:none!important;
  border-top:2px solid #f2c657!important;border-left:2px solid #f2c657!important;
  box-shadow:-4px -4px 0 -2px #6e3513!important;
}
#game-screen.game-shell::after{
  right:7px!important;bottom:7px!important;transform:none!important;
  border-right:2px solid #f2c657!important;border-bottom:2px solid #f2c657!important;
  box-shadow:4px 4px 0 -2px #6e3513!important;
}

.royal-topbar{
  border-color:#a96927!important;
  background:
    linear-gradient(90deg,rgba(108,31,137,.28),transparent 32% 68%,rgba(108,31,137,.20)),
    linear-gradient(180deg,#1b0a25 0%,#0b0411 100%)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.05),inset 0 -1px #351044,0 7px 18px rgba(0,0,0,.48)!important;
}
.royal-logo{filter:drop-shadow(0 2px 7px rgba(0,0,0,.75))}
.logo-crown{
  display:inline-grid!important;place-items:center!important;
  width:1.1em!important;height:1.1em!important;
  color:#d65cff!important;
  font-family:Georgia,"Times New Roman",serif!important;
  line-height:1!important;
  transform:translateY(-1px)!important;
}
.hud-chip,.score-chip{
  border-color:#7f4e27!important;
  background:linear-gradient(180deg,rgba(59,20,71,.94),rgba(18,7,25,.98))!important;
  box-shadow:inset 0 0 0 1px rgba(184,89,214,.13),0 2px 7px rgba(0,0,0,.45)!important;
}
.hud-chip span,.score-chip span{letter-spacing:.07em!important}
.hud-chip strong,.score-chip strong{text-shadow:0 1px 5px #000!important}
.royal-button,.menu-icon{
  border-color:#b6762c!important;
  background:linear-gradient(180deg,#571a66,#260a31)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.08),inset 0 0 0 1px #33103d,0 4px 10px #0008!important;
}
.royal-button:hover,.menu-icon:hover{border-color:#f0c65c!important;filter:brightness(1.12)}

.royal-board{gap:8px!important}
.court-strip,.royal-edge,.hand-center,.resource-card,.reverse-orb,.card-powers-strip{
  border:1px solid rgba(174,113,40,.78)!important;
  box-shadow:inset 0 0 0 1px rgba(84,28,105,.52),0 5px 14px rgba(0,0,0,.36)!important;
}
.court-strip{
  background:
    linear-gradient(90deg,rgba(111,35,137,.10),transparent 25% 75%,rgba(111,35,137,.10)),
    linear-gradient(180deg,#13091a,#08040d)!important;
}
.court-name{letter-spacing:.12em!important;text-shadow:0 1px 5px #000!important}
.court-name::before,.court-name::after{color:#8b5a24!important;letter-spacing:-.08em}
.queen-seat{
  border-color:rgba(128,85,37,.82)!important;
  background:
    radial-gradient(circle at 24% 50%,rgba(80,27,95,.18),transparent 38%),
    linear-gradient(180deg,#120a18,#08040c)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.025),inset 0 -10px 20px rgba(0,0,0,.24)!important;
}
.queen-seat::before{opacity:.96!important;filter:saturate(1.12) contrast(1.08) brightness(1.03)!important}
.queen-seat .seat-orb{
  display:grid!important;place-items:center!important;
  top:50%!important;
  transform:translateY(-50%)!important;
}
.queen-seat .suit{
  display:block!important;
  width:1em!important;
  height:1em!important;
  line-height:.92!important;
  text-align:center!important;
}
.queen-seat.hearts .suit{color:#ff4a66!important}
.queen-seat.diamonds .suit{color:#ffad28!important}
.queen-seat.clubs .suit{color:#58d79d!important}
.queen-seat.spades .suit{color:#e3dcec!important}
.queen-seat .seat-label{color:#f0d080!important;text-shadow:0 1px 3px #000!important}
.queen-seat strong{justify-self:end!important;color:#d9cfda!important}
.queen-seat::after{color:#d7a43b!important;opacity:.92!important}
.queen-seat.seated{border-color:#e3a53e!important;box-shadow:inset 0 0 26px rgba(195,76,36,.20),0 0 15px rgba(221,158,48,.16)!important}

.royal-edge{
  overflow:hidden!important;
  border-color:rgba(189,125,43,.84)!important;
  background:
    radial-gradient(ellipse at 50% 43%,rgba(120,37,153,.27),transparent 45%),
    linear-gradient(180deg,#100718,#07030c)!important;
}
.edge-title{letter-spacing:.14em!important;text-shadow:0 2px 5px #000!important}
.royal-track::before{box-shadow:0 0 15px rgba(210,81,242,.48),0 0 4px #ffcf67!important}
.track-numbers span{text-shadow:0 1px 4px #000!important}
.queen-marker{filter:saturate(1.06) contrast(1.04)!important}
.queen-copy{box-shadow:0 4px 12px rgba(0,0,0,.48),inset 0 1px rgba(255,255,255,.06)!important}
.waiting-row{
  position:absolute!important;
  left:42px!important;right:42px!important;bottom:8px!important;
  margin:0!important;padding:0!important;
  align-items:end!important;
}
.waiting-cluster{gap:4px!important;text-shadow:0 1px 4px #000!important}
.waiting-empty{height:26px!important;gap:11px!important}
.waiting-empty i{width:22px!important;height:22px!important;border-color:#e9b33d!important;background:radial-gradient(circle,#13091a,#060309)!important}

.queue-duel{
  align-items:stretch!important;
  padding:5px 10px 1px!important;
}
.queue-side{display:grid!important;grid-template-rows:auto 1fr!important;align-items:stretch!important}
.queue-label,.execution-order>span{
  color:#f0ca62!important;
  letter-spacing:.10em!important;
  text-shadow:0 1px 4px #000!important;
}
.opponent-queue,.team-slots{align-self:stretch!important;height:100%!important;min-height:0!important}
.back-card,.slot{
  height:100%!important;min-height:0!important;
  border-color:rgba(177,116,43,.90)!important;
  box-shadow:inset 0 0 0 2px #281031,0 5px 10px rgba(0,0,0,.46)!important;
}
.back-card{background-size:90% 94%!important;filter:saturate(1.12) contrast(1.04)!important}
.human-queue-row{height:100%!important;min-height:0!important}
.human-queue-row .team-slots{height:100%!important}
.slot-number{color:#c8b2ce!important;letter-spacing:.04em!important}
.slot-owner{color:#9d8fa0!important}
.empty-copy{color:#8d8190!important}
.ready-pill{border-color:#70507b!important;background:#100817!important;color:#cdbbd1!important;box-shadow:0 2px 7px #0007!important}
.ready-pill.ready{border-color:#6eb37e!important;color:#d7f5dc!important}
.queue-actions-inline button{
  border-color:#87572b!important;
  background:linear-gradient(180deg,#451450,#1e0827)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.04),0 3px 8px #0008!important;
}
.queue-actions-inline button:disabled{opacity:.52!important;color:#9d8aa2!important;background:linear-gradient(180deg,#25102c,#130718)!important}
.execution-order{display:grid!important;place-items:center!important;align-content:center!important}
.order-dots{padding:7px 11px!important;border:1px solid rgba(123,77,37,.62)!important;border-radius:999px!important;background:rgba(5,2,8,.70)!important;box-shadow:inset 0 0 12px #000!important}
.order-dots i,.order-dots b{width:11px!important;height:11px!important;box-shadow:inset 0 0 5px #000!important}
.order-dots b{box-shadow:0 0 11px #d654ff,inset 0 0 4px #fff!important}

.hand-center{
  background:
    radial-gradient(ellipse at 50% 112%,rgba(121,38,153,.31),transparent 55%),
    linear-gradient(180deg,#100719,#07030c)!important;
}
.hand-heading{letter-spacing:.08em!important;text-shadow:0 1px 5px #000!important}
.hand{padding-inline:30px!important}
.hand .card{
  flex-basis:98px!important;
  width:clamp(66px,6.25vw,98px)!important;
  max-width:98px!important;
  height:86%!important;
  margin-left:-11px!important;
  padding:8px 7px 7px!important;
  border-color:#d2a348!important;
  border-radius:8px!important;
  box-shadow:inset 0 0 0 2px #fff8df,inset 0 0 0 3px rgba(99,57,20,.34),0 7px 14px rgba(0,0,0,.52)!important;
}
.hand .card-rank{line-height:.92!important}
.hand .card-symbol{top:33%!important;line-height:1!important}
.hand .card-name{padding-top:4px!important}
.hand .card-effect{line-height:1.12!important}
.hand .card:nth-child(1){transform:translateY(9px) rotate(-7deg)!important}
.hand .card:nth-child(2){transform:translateY(6px) rotate(-5.5deg)!important}
.hand .card:nth-child(3){transform:translateY(3px) rotate(-4deg)!important}
.hand .card:nth-child(4){transform:translateY(1px) rotate(-2.8deg)!important}
.hand .card:nth-child(5){transform:translateY(0) rotate(-1.7deg)!important}
.hand .card:nth-child(6){transform:translateY(-1px) rotate(-.6deg)!important}
.hand .card:nth-child(7){transform:translateY(-1px) rotate(.6deg)!important}
.hand .card:nth-child(8){transform:translateY(0) rotate(1.7deg)!important}
.hand .card:nth-child(9){transform:translateY(1px) rotate(2.8deg)!important}
.hand .card:nth-child(10){transform:translateY(3px) rotate(4deg)!important}
.hand .card:nth-child(11){transform:translateY(6px) rotate(5.5deg)!important}
.hand .card:nth-child(12){transform:translateY(9px) rotate(7deg)!important}
.hand .card:hover{transform:translateY(-25px) rotate(0deg) scale(1.10)!important;filter:saturate(1.04)!important}

.resource-card{
  isolation:isolate!important;
  background:
    radial-gradient(circle at 50% 44%,rgba(104,31,133,.22),transparent 59%),
    linear-gradient(180deg,#12091a,#07030c)!important;
}
.resource-card::before{
  content:"";
  position:absolute;
  z-index:1;
  left:50%;top:24%;
  width:54%;height:49%;
  transform:translateX(-50%);
  border-radius:6px;
  background:url('/assets/royal-card-back.png') center/contain no-repeat;
  filter:saturate(1.08) brightness(.84);
  opacity:.92;
  box-shadow:0 6px 13px rgba(0,0,0,.56);
}
.resource-card>span{position:absolute!important;z-index:3!important;left:5px;right:5px;top:7%!important;color:#f2ce69!important;letter-spacing:.08em!important}
.resource-card>strong{
  position:absolute!important;z-index:4!important;left:50%;top:44%!important;
  width:38px;height:38px;display:grid;place-items:center;
  transform:translate(-50%,-50%);
  border:2px solid #d7a53f;border-radius:50%;
  background:radial-gradient(circle,#42124f,#100619 68%);
  color:#fff1c9!important;text-shadow:0 2px 5px #000!important;
  box-shadow:0 0 13px rgba(203,69,238,.58),inset 0 0 10px #000!important;
}
.resource-card>small{position:absolute!important;z-index:4!important;left:0;right:0;top:58%!important;color:#f0dfc5!important}
.resource-card>em{position:absolute!important;z-index:4!important;left:0;right:0;top:65%!important;color:#d9a8e9!important}
.resource-card .mini-deck{
  position:absolute!important;z-index:4!important;left:12%;right:12%;bottom:6%!important;
  margin:0!important;padding:4px 5px!important;
  border-color:#a46a2c!important;background:rgba(20,7,27,.94)!important;
  box-shadow:0 3px 8px #0008!important;
}

.reverse-orb{
  background:radial-gradient(circle at 50% 48%,#3c114b,#100619 61%,#060309)!important;
}
.reverse-orb strong{background:radial-gradient(circle,#351041,#0b0410 70%)!important;box-shadow:0 0 21px rgba(170,55,214,.42),inset 0 0 16px #000!important}
.reverse-orb span{letter-spacing:.08em!important;text-shadow:0 1px 4px #000!important}

.card-powers-strip{background:linear-gradient(180deg,#100718,#07030c)!important}
.card-powers-strip>div{
  grid-template-rows:auto auto auto!important;
  align-content:center!important;
  row-gap:3px!important;
  min-height:0!important;
  border-color:rgba(153,97,37,.86)!important;
  background:linear-gradient(180deg,rgba(35,13,43,.92),rgba(10,4,14,.98))!important;
  box-shadow:inset 0 1px rgba(255,255,255,.03),inset 0 -12px 20px rgba(0,0,0,.20)!important;
}
.card-powers-strip>div:hover{border-color:#e6b84e!important;background:linear-gradient(180deg,#35113f,#120619)!important}
.card-powers-strip b{align-self:center!important;display:grid!important;place-items:center!important;height:1.08em!important;line-height:1!important;filter:drop-shadow(0 2px 3px #000)!important}
.card-powers-strip strong{letter-spacing:.03em!important;text-shadow:0 1px 4px #000!important}
.card-powers-strip span{max-width:95%;margin-inline:auto!important}

.resolution-overlay{background:rgba(3,1,6,.92)!important;backdrop-filter:blur(8px) saturate(.8)!important}
.resolution-card{
  border:1px solid #b77a2d!important;
  background:
    radial-gradient(ellipse at 50% 45%,rgba(88,25,114,.20),transparent 55%),
    linear-gradient(180deg,#13091a,#07030c)!important;
  box-shadow:inset 0 0 0 2px #361141,0 24px 70px #000!important;
}
.resolution-heading h2{color:#f1cc70!important}
.ace-team,.human-team{border-color:rgba(164,105,39,.78)!important;background:rgba(40,13,49,.34)!important}
.resolution-focus{border-color:#a96d2e!important;background:#08040c!important}
.event-callout{border-left-color:#edbe55!important;background:#160c1d!important;color:#f4e4c9!important}
.resolution-pulls span{border-color:#56325e!important;background:#0e0713!important}

@media (min-width:900px) and (min-aspect-ratio:6/5){
  #game-screen.game-shell{
    width:min(1254px,100vw,calc(100vh * 1.28))!important;
    height:auto!important;
    aspect-ratio:1.28/1!important;
  }
  .court-strip{width:97%!important}
  .royal-edge{width:97.5%!important}
  .queue-duel{width:94%!important}
  .hand-zone{width:98%!important}
  .court-and-resources{width:96%!important}
  .bottom-controls{width:98%!important}
  .hand .card{width:clamp(70px,6vw,98px)!important}
}

@media(max-height:860px){
  .royal-board{gap:6px!important}
  .waiting-row{left:28px!important;right:28px!important;bottom:5px!important}
  .waiting-empty{gap:8px!important;height:21px!important}.waiting-empty i{width:18px!important;height:18px!important}
  .queue-duel{padding-top:3px!important}
  .order-dots{padding:5px 8px!important}
  .hand .card{height:84%!important;padding:6px 5px 5px!important}
  .hand .card-effect{font-size:5.9px!important}
  .resource-card>strong{width:32px;height:32px;font-size:20px!important}
  .resource-card .mini-deck{padding:2px 4px!important}
}

@media(max-width:650px){
  #game-screen.game-shell{width:650px!important;height:650px!important;aspect-ratio:1/1!important}
}

@media(prefers-reduced-motion:reduce){
  .queen-marker,.hand .card,.result-card{transition:none!important}
}

/* Full-screen table: the browser viewport is the game canvas. */
body.game-active .shell{width:100vw!important;height:100vh!important;max-width:none!important}
#game-screen.game-shell{
  width:100vw!important;
  height:100vh!important;
  max-width:none!important;
  aspect-ratio:auto!important;
  margin:0!important;
  border-radius:0!important;
}

@media(max-width:650px){
  body.game-active{overflow:auto}
  body.game-active .shell{width:650px!important;height:650px!important}
  #game-screen.game-shell{width:650px!important;height:650px!important}
}

/* v0.14 production polish — proportion, card grammar, and optical alignment */
#game-screen.game-shell{
  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --card-ratio:5 / 7;
  --panel-gold:rgba(174,113,40,.82);
  --panel-violet:rgba(84,28,105,.58);
}

/* Give the queue real card room, preserve the hand, and compress the reference bar. */
.royal-board{
  grid-template-rows:1fr 1.58fr 1.30fr 2fr 1.03fr .88fr!important;
  gap:var(--space-2)!important;
}
.queue-duel{
  align-items:stretch!important;
  padding:3px 10px 2px!important;
}
.queue-side{
  grid-template-rows:18px minmax(0,1fr)!important;
  min-height:0!important;
}
.queue-label,.execution-order>span{
  margin:0!important;
  line-height:16px!important;
}
.opponent-queue,.team-slots{
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  display:grid!important;
  grid-template-columns:repeat(4,minmax(56px,78px))!important;
  justify-content:center!important;
  align-items:center!important;
  gap:10px!important;
  margin:0!important;
}
.back-card,.slot{
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  max-height:100%!important;
  aspect-ratio:var(--card-ratio)!important;
  align-self:center!important;
  border-radius:7px!important;
}
.human-queue-row{
  height:100%!important;
  min-height:0!important;
  grid-template-columns:minmax(0,1fr) 92px!important;
  align-items:stretch!important;
}
.human-queue-row .team-slots{height:100%!important}
.team-slots .card{
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  max-height:100%!important;
  aspect-ratio:var(--card-ratio)!important;
}
.slot:has(.card){padding:3px!important}
.queue-actions-inline{align-self:center!important}
.queue-actions-inline button{
  min-height:28px!important;
  padding:4px 6px!important;
  font-size:clamp(8px,.72vw,10px)!important;
}
.slot-number{top:4px!important;left:5px!important;line-height:1!important}
.slot-owner{right:4px!important;bottom:3px!important;left:4px!important;line-height:1!important}

.hand{top:25px!important;bottom:19px!important;height:auto!important;align-items:center!important;padding:0 28px!important}
.hand .card{
  flex:0 0 clamp(78px,8.2vw,108px)!important;
  width:clamp(78px,8.2vw,108px)!important;
  max-width:108px!important;
  height:auto!important;
  aspect-ratio:var(--card-ratio)!important;
  margin-left:-30px!important;
  padding:8px 7px 7px!important;
}
.hand .card:first-child{margin-left:0!important}
.hand .card-effect{font-size:clamp(6.4px,.61vw,8.6px)!important;line-height:1.12!important}
.hand .card-name{font-size:clamp(6.2px,.56vw,8px)!important}

.card-powers-strip{gap:6px!important;padding:5px 7px!important}
.card-powers-strip>div{
  min-height:0!important;
  padding:4px!important;
  row-gap:2px!important;
  border-radius:5px!important;
}
.card-powers-strip b{
  height:1em!important;
  font-size:clamp(19px,2.55vh,28px)!important;
  transform:none!important;
}
.card-powers-strip>div:nth-child(5) b,
.card-powers-strip>div:nth-child(6) b,
.card-powers-strip>div:nth-child(7) b{font-size:clamp(22px,2.8vh,31px)!important;transform:none!important}
.card-powers-strip strong{
  font-size:clamp(10px,1.12vh,13px)!important;
  line-height:1!important;
}
.card-powers-strip span{
  display:block!important;
  max-width:100%!important;
  color:#f3eadc!important;
  font:600 clamp(8.5px,.92vh,10.5px)/1.12 Inter,Segoe UI,sans-serif!important;
}

/* One card grammar everywhere: shared ratio, rank baseline, and optical suit centering. */
.card{
  aspect-ratio:var(--card-ratio);
  isolation:isolate;
  padding:8px 7px 7px;
  border-radius:8px!important;
}
.card-rank{
  position:relative!important;
  top:0!important;
  height:1em!important;
  line-height:.88!important;
  letter-spacing:-.035em!important;
}
.card-symbol{
  top:32.5%!important;
  line-height:1!important;
  transform:translate(-50%,-50%)!important;
  transform-origin:center!important;
}
.card.hearts .card-symbol{transform:translate(-50%,-50%) scale(.94)!important}
.card.diamonds .card-symbol{transform:translate(-50%,-50%) scale(.91)!important}
.card.clubs .card-symbol{transform:translate(-50%,-49%) scale(.88)!important}
.card.spades .card-symbol{transform:translate(-50%,-53%) scale(.93)!important}
.card.jack .card-rank{top:-1px!important}
.card.jack .card-symbol{top:31.5%!important}
.card.ace .card-symbol{top:31.7%!important}
.card.king .card-symbol{top:32%!important}
.card-name{
  line-height:1!important;
  letter-spacing:.035em!important;
}

/* Premium face hierarchy without changing card dimensions or information. */
.card.ace,.card.king,.card.jack{
  background:
    radial-gradient(circle at 50% 31%,rgba(255,255,255,.66),transparent 27%),
    linear-gradient(155deg,#fffaf0,#e7dbc8 58%,#d7c7ae)!important;
}
.card.ace{box-shadow:inset 0 0 0 2px #fff8df,inset 0 0 0 3px rgba(35,79,134,.35),0 7px 14px rgba(0,0,0,.52)!important}
.card.king{box-shadow:inset 0 0 0 2px #fff8df,inset 0 0 0 3px rgba(142,48,31,.36),0 7px 14px rgba(0,0,0,.52)!important}
.card.jack{box-shadow:inset 0 0 0 2px #fff8df,inset 0 0 0 3px rgba(83,43,121,.38),0 7px 14px rgba(0,0,0,.52)!important}
.card.ace .card-symbol{
  color:#1f4e8d!important;
  text-shadow:0 1px #fff,0 2px 0 #b58630,0 0 10px rgba(48,102,175,.18)!important;
}
.card.king .card-symbol{
  color:#8e301f!important;
  text-shadow:0 1px #fff,0 2px 0 #c99736,0 0 10px rgba(159,60,38,.18)!important;
}
.card.jack .card-symbol{
  color:#542779!important;
  text-shadow:0 1px #fff,0 2px 0 #b88b35,0 0 10px rgba(104,52,151,.20)!important;
}

/* Dimensional court emblems and cleaner empty states. */
.queen-seat::after{content:none!important;display:none!important}
.queen-seat .seat-orb{
  left:21px!important;
  top:45%!important;
  width:40px!important;
  height:40px!important;
  border:1px solid #e2b34b!important;
  border-radius:50%!important;
  background:radial-gradient(circle at 36% 28%,#fff8d7 0 4%,#684b18 6%,#160d1e 36%,#06030a 76%)!important;
  box-shadow:inset 0 0 0 2px rgba(255,218,108,.16),inset 0 -8px 13px rgba(0,0,0,.78),0 2px 7px #000!important;
}
.queen-seat .suit{
  width:auto!important;
  height:auto!important;
  font-size:clamp(22px,2.9vh,34px)!important;
  line-height:1!important;
  text-shadow:0 1px 0 rgba(255,255,255,.40),0 3px 2px #000,0 0 8px currentColor!important;
  filter:saturate(1.18) contrast(1.06)!important;
}
.queen-seat.hearts .seat-orb{background:radial-gradient(circle at 34% 27%,#ffd4da 0 5%,#a70f32 22%,#420715 57%,#090306 80%)!important}
.queen-seat.diamonds .seat-orb{background:radial-gradient(circle at 34% 27%,#fff0b6 0 5%,#d47608 23%,#573003 58%,#0b0602 81%)!important}
.queen-seat.clubs .seat-orb{background:radial-gradient(circle at 34% 27%,#d8ffec 0 5%,#14794e 23%,#073322 58%,#020906 81%)!important}
.queen-seat.spades .seat-orb{background:radial-gradient(circle at 34% 27%,#f1e9ff 0 5%,#624374 23%,#22172a 58%,#050307 81%)!important}
.queen-seat.hearts .suit{transform:translateY(1px) scale(.94)!important}
.queen-seat.diamonds .suit{transform:scale(.90)!important}
.queen-seat.clubs .suit{transform:translateY(1px) scale(.84)!important}
.queen-seat.spades .suit{transform:translateY(-1px) scale(.91)!important}

/* Resolution cards obey the same physical proportions as queue and hand cards. */
.result-cards{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  justify-items:center!important;
  align-items:center!important;
  gap:10px!important;
}
.result-card{
  width:auto!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  aspect-ratio:var(--card-ratio)!important;
}
.result-card .card-symbol{top:32.5%!important}

@media(max-height:820px){
  .royal-board{grid-template-rows:.98fr 1.53fr 1.25fr 1.94fr 1fr .82fr!important;gap:6px!important}
  .hand{top:23px!important;bottom:15px!important}
  .hand .card{flex-basis:clamp(72px,7.8vw,102px)!important;width:clamp(72px,7.8vw,102px)!important;margin-left:-28px!important;padding:6px!important}
  .hand .card-effect{font-size:clamp(5.8px,.58vw,7.5px)!important}
  .card-powers-strip{padding:4px 6px!important;gap:5px!important}
  .card-powers-strip span{font-size:clamp(8px,.86vh,9px)!important}
}

@media(max-width:1050px){
  .opponent-queue,.team-slots{grid-template-columns:repeat(4,minmax(50px,70px))!important;gap:7px!important}
  .human-queue-row{grid-template-columns:minmax(0,1fr) 78px!important;gap:6px!important}
  .hand .card{flex-basis:clamp(68px,7.7vw,92px)!important;width:clamp(68px,7.7vw,92px)!important;margin-left:-26px!important}
}

/* ========================================================================== 
   Resolution presentation pass — premium royal-table reveal / payoff screen
   Keeps gameplay and DOM structure intact; replaces dashboard framing with depth.
   ========================================================================== */
.resolution-overlay{
  --resolution-gold-muted:#765525;
  --resolution-gold:#c9983c;
  --resolution-gold-bright:#f1cd6a;
  --resolution-purple:#6f2b88;
  --resolution-purple-soft:#3c1849;
  --resolution-silver:#c7c4d0;
  --resolution-radius:12px;
  padding:clamp(10px,1.6vw,24px)!important;
  background:
    radial-gradient(circle at 50% 50%,rgba(92,26,116,.15) 0,rgba(24,7,32,.30) 32%,rgba(3,1,6,.94) 72%),
    rgba(3,1,6,.94)!important;
  backdrop-filter:blur(10px) saturate(.82)!important;
}

.resolution-card{
  position:relative!important;
  isolation:isolate!important;
  width:min(1240px,97vw)!important;
  height:min(800px,95vh)!important;
  padding:clamp(10px,1.2vw,16px)!important;
  grid-template-rows:auto minmax(0,1fr) auto!important;
  gap:10px!important;
  overflow:hidden!important;
  border:1px solid rgba(201,152,60,.80)!important;
  border-radius:var(--resolution-radius)!important;
  background:
    radial-gradient(ellipse at 50% 47%,rgba(123,42,148,.17) 0,rgba(65,18,79,.08) 28%,transparent 58%),
    radial-gradient(circle at 14% 9%,rgba(255,218,115,.035),transparent 28%),
    linear-gradient(180deg,#13091a 0,#0b0510 42%,#07030b 100%)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,235,171,.10),
    inset 0 0 0 1px rgba(62,21,74,.80),
    inset 0 -42px 90px rgba(0,0,0,.24),
    0 28px 85px rgba(0,0,0,.88)!important;
}
.resolution-card::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  pointer-events:none;
  opacity:.22;
  background:
    radial-gradient(circle at 50% 50%,transparent 0 30%,rgba(125,58,145,.08) 31%,transparent 32%),
    repeating-radial-gradient(circle at 50% 50%,transparent 0 58px,rgba(219,175,85,.035) 59px 60px,transparent 61px 118px);
  mask-image:linear-gradient(to bottom,transparent 1%,#000 22%,#000 80%,transparent 99%);
}
.resolution-card::after{
  content:"◆";
  position:absolute;
  left:50%;top:48%;
  z-index:-1;
  transform:translate(-50%,-50%) rotate(45deg);
  font-size:min(38vw,430px);
  line-height:1;
  color:rgba(151,73,174,.018);
  text-shadow:0 0 55px rgba(178,85,208,.035);
  pointer-events:none;
}

.resolution-heading{
  position:relative!important;
  min-height:54px!important;
  padding:4px 8px 10px!important;
  border-bottom:1px solid rgba(175,123,48,.34)!important;
}
.resolution-heading::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:-1px;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(240,198,94,.18) 20%,rgba(240,198,94,.70) 50%,rgba(240,198,94,.18) 80%,transparent);
}
.resolution-heading .eyebrow{
  color:#c99c48!important;
  font-size:clamp(9px,.75vw,11px)!important;
  letter-spacing:.18em!important;
}
.resolution-heading h2{
  margin:3px 0 0!important;
  color:#f2d178!important;
  font:700 clamp(21px,2vw,29px)/1 Georgia,serif!important;
  letter-spacing:.015em!important;
  text-shadow:0 2px 11px rgba(0,0,0,.85),0 0 18px rgba(200,143,52,.13)!important;
}
.step-counter{
  padding:6px 10px!important;
  border:1px solid rgba(172,119,44,.35)!important;
  border-radius:999px!important;
  color:#e8c465!important;
  background:rgba(25,10,31,.58)!important;
  font-size:clamp(9px,.72vw,11px)!important;
  letter-spacing:.06em!important;
  box-shadow:inset 0 1px rgba(255,255,255,.025)!important;
}

.resolution-grid{
  grid-template-rows:minmax(132px,1fr) minmax(214px,1.42fr) minmax(132px,1fr)!important;
  gap:10px!important;
  padding:0 2px!important;
}
.resolution-team{
  position:relative!important;
  min-height:0!important;
  padding:22px 12px 9px!important;
  border:0!important;
  border-radius:10px!important;
  overflow:visible!important;
  box-shadow:inset 0 1px rgba(255,255,255,.025),inset 0 -18px 35px rgba(0,0,0,.18)!important;
}
.resolution-team::before{
  content:"";
  position:absolute;
  left:3%;right:3%;top:0;
  height:1px;
  opacity:.8;
}
.ace-team{
  background:linear-gradient(180deg,rgba(76,49,17,.12),rgba(35,20,9,.045) 48%,rgba(0,0,0,.08))!important;
}
.ace-team::before{background:linear-gradient(90deg,transparent,rgba(216,166,67,.72),transparent)}
.human-team{
  background:linear-gradient(180deg,rgba(68,28,84,.14),rgba(32,17,42,.05) 48%,rgba(0,0,0,.08))!important;
}
.human-team::before{background:linear-gradient(90deg,transparent,rgba(165,119,185,.65),transparent)}
.team-tag{
  position:absolute!important;
  top:4px!important;left:12px!important;
  margin:0!important;
  font:700 clamp(9px,.74vw,11px)/1 Georgia,serif!important;
  letter-spacing:.14em!important;
  text-transform:uppercase!important;
}
.ace-team .team-tag{color:#d7ae58!important}
.human-team .team-tag{color:#c9bfd0!important}

.result-cards{
  height:100%!important;
  display:grid!important;
  grid-template-columns:repeat(4,minmax(72px,1fr))!important;
  gap:clamp(16px,3.1vw,54px)!important;
  align-items:center!important;
  justify-items:center!important;
  padding:3px clamp(10px,2vw,28px)!important;
}
.result-card{
  height:min(100%,154px)!important;
  width:auto!important;
  max-width:112px!important;
  aspect-ratio:var(--card-ratio)!important;
  filter:drop-shadow(0 9px 10px rgba(0,0,0,.58))!important;
  transition:transform .22s cubic-bezier(.2,.8,.2,1),filter .22s ease,opacity .22s ease,box-shadow .22s ease!important;
  will-change:transform,filter!important;
}
.result-card:hover:not(.resolved){
  transform:translateY(-4px)!important;
  filter:drop-shadow(0 13px 15px rgba(0,0,0,.70)) brightness(1.025)!important;
}
.ace-team .result-card:not(.active){box-shadow:inset 0 0 0 1px rgba(188,133,45,.16),0 8px 17px rgba(0,0,0,.42)!important}
.human-team .result-card:not(.active){box-shadow:inset 0 0 0 1px rgba(107,69,122,.18),0 8px 17px rgba(0,0,0,.42)!important}
.result-card.active{
  z-index:20!important;
  opacity:1!important;
  filter:drop-shadow(0 18px 22px rgba(0,0,0,.78)) brightness(1.05)!important;
  transform:translateY(-8px) scale(1.055)!important;
  border-color:#f0cc6c!important;
  box-shadow:
    inset 0 0 0 2px #fff9df,
    0 0 0 2px rgba(117,53,140,.86),
    0 0 20px rgba(173,72,211,.42),
    0 0 34px rgba(224,174,66,.15)!important;
}
.ace-team .result-card.active{box-shadow:inset 0 0 0 2px #fff9df,0 0 0 2px rgba(188,128,38,.82),0 0 22px rgba(217,163,52,.36),0 17px 28px rgba(0,0,0,.70)!important}
.human-team .result-card.active{box-shadow:inset 0 0 0 2px #fff9df,0 0 0 2px rgba(112,62,137,.90),0 0 24px rgba(151,75,180,.45),0 17px 28px rgba(0,0,0,.70)!important}
.result-card.resolved{
  opacity:.28!important;
  filter:grayscale(.78) brightness(.57) drop-shadow(0 4px 7px rgba(0,0,0,.4))!important;
  transform:translateY(2px) scale(.98)!important;
}
.result-card .slot-badge{
  top:5px!important;right:5px!important;
  padding:2px 5px!important;
  border:1px solid rgba(119,86,39,.40)!important;
  background:rgba(34,26,19,.86)!important;
  color:#f3e6c8!important;
  font-size:clamp(6px,.48vw,7px)!important;
  letter-spacing:.04em!important;
}
.result-card .owner-badge{
  color:#6b5c4c!important;
  font-size:clamp(6px,.49vw,7px)!important;
  letter-spacing:.04em!important;
}

/* Center stage: use illumination and elevation instead of another heavy rectangle. */
.resolution-focus{
  position:relative!important;
  z-index:2!important;
  display:grid!important;
  grid-template-rows:minmax(128px,1fr) auto auto!important;
  gap:8px!important;
  padding:10px 12px 8px!important;
  border:0!important;
  border-radius:12px!important;
  background:
    radial-gradient(ellipse at 50% 37%,rgba(112,37,137,.18),transparent 52%),
    linear-gradient(180deg,rgba(14,6,18,.88),rgba(7,3,10,.72))!important;
  box-shadow:
    inset 0 1px rgba(255,255,255,.025),
    inset 0 0 36px rgba(87,29,104,.09),
    0 7px 26px rgba(0,0,0,.30)!important;
}
.resolution-focus::before{
  content:"";
  position:absolute;
  z-index:-1;
  left:12%;right:12%;top:3%;height:64%;
  pointer-events:none;
  background:radial-gradient(ellipse at 50% 43%,rgba(157,64,187,.16),rgba(212,161,63,.035) 28%,transparent 66%);
  filter:blur(2px);
}
.resolution-focus.is-human-event{box-shadow:inset 0 1px rgba(255,255,255,.025),inset 0 0 40px rgba(112,59,133,.10),0 8px 28px rgba(0,0,0,.32)!important}
.resolution-focus.is-ace-event{box-shadow:inset 0 1px rgba(255,255,255,.025),inset 0 0 40px rgba(167,117,39,.095),0 8px 28px rgba(0,0,0,.32)!important}

.result-queen-stage{
  grid-template-columns:132px minmax(280px,1fr) 132px!important;
  gap:14px!important;
  align-items:center!important;
  min-height:0!important;
}
.waiting-slot{
  min-height:80px!important;
  align-content:center!important;
  padding:8px!important;
  border:0!important;
  border-radius:9px!important;
  background:linear-gradient(180deg,rgba(15,8,18,.64),rgba(6,3,9,.54))!important;
  box-shadow:inset 0 0 0 1px rgba(83,51,93,.34)!important;
}
.waiting-slot>span{
  color:#a59ba8!important;
  font-size:clamp(7px,.56vw,9px)!important;
  letter-spacing:.06em!important;
}
.waiting-slot.human{box-shadow:inset 0 0 0 1px rgba(120,83,132,.38)!important}
.waiting-slot.ace{box-shadow:inset 0 0 0 1px rgba(150,106,42,.40)!important}
.waiting-queen{min-height:42px!important;display:grid!important;place-items:center!important}
.waiting-empty{opacity:.48!important}
.waiting-empty i{border-color:#9a7a3e!important;box-shadow:inset 0 0 5px rgba(0,0,0,.7)!important}
.waiting-queen.occupied{
  color:#f2d393!important;
  text-shadow:0 1px 5px #000!important;
}
.waiting-crown{font-size:1.55rem!important;color:#edc661!important;filter:drop-shadow(0 0 7px rgba(213,161,60,.25))!important}

.active-track-wrap{
  position:relative!important;
  min-width:0!important;
  display:grid!important;
  align-content:center!important;
  padding:18px 0 4px!important;
}
.result-track{
  height:28px!important;
  border:0!important;
  border-radius:999px!important;
  overflow:visible!important;
  background:
    linear-gradient(90deg,rgba(82,54,91,.50),rgba(65,31,76,.36) 44%,rgba(183,135,46,.14) 50%,rgba(126,88,29,.32) 56%,rgba(119,80,25,.48))!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    inset 0 -1px 0 rgba(0,0,0,.7),
    inset 0 0 0 1px rgba(151,108,48,.42),
    0 4px 10px rgba(0,0,0,.42)!important;
}
.result-track::before{
  content:"";
  position:absolute;
  left:14px;right:14px;top:50%;
  height:3px;
  transform:translateY(-50%);
  border-radius:999px;
  background:linear-gradient(90deg,#78647e 0,#835c8d 42%,#e2c46e 50%,#ad833a 58%,#b08034 100%);
  box-shadow:0 0 9px rgba(141,67,161,.22),0 0 8px rgba(194,144,52,.16);
}
.result-track::after{
  content:"";
  position:absolute;
  inset:6px 14px;
  opacity:.72;
  background:repeating-linear-gradient(90deg,transparent 0 calc(10% - 1px),rgba(222,194,135,.38) calc(10% - 1px) 10%);
  mask:linear-gradient(#000 0 0) center/100% 10px no-repeat;
}
.result-track-side{
  position:absolute!important;
  z-index:3!important;
  top:-17px!important;
  color:#bdb3c1!important;
  font:700 clamp(8px,.62vw,10px)/1 Georgia,serif!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
}
.result-track-side.human{left:0!important;color:#c3b8ca!important}
.result-track-side.ace{right:0!important;color:#d4ae5b!important}
.result-track-center{
  position:absolute!important;
  left:50%;top:50%!important;
  z-index:3!important;
  transform:translate(-50%,-50%)!important;
  width:18px;height:18px;
  display:grid;place-items:center;
  border:1px solid rgba(240,205,113,.80);
  border-radius:50%;
  background:#160d18;
  color:#f0cf77!important;
  font-size:8px!important;
  box-shadow:0 0 8px rgba(224,179,71,.20);
}
.result-track .queen-marker{
  width:54px!important;
  height:76px!important;
  top:50%!important;
  margin-left:0!important;
  transform:translate(-50%,-50%)!important;
  border:1px solid #f1cc65!important;
  border-radius:7px!important;
  background:
    radial-gradient(circle at 50% 35%,rgba(255,245,189,.12),transparent 40%),
    linear-gradient(155deg,#30103e,#120718)!important;
  box-shadow:
    inset 0 0 0 2px rgba(255,224,129,.13),
    0 0 0 2px rgba(94,38,111,.82),
    0 0 18px rgba(180,77,214,.52),
    0 0 34px rgba(215,166,59,.13),
    0 13px 22px rgba(0,0,0,.78)!important;
  filter:none!important;
  transition:left .35s cubic-bezier(.2,.75,.2,1),transform .22s ease,box-shadow .22s ease!important;
}
.resolution-focus.queen-shift .result-track .queen-marker{
  transform:translate(-50%,-53%) scale(1.035)!important;
  box-shadow:inset 0 0 0 2px rgba(255,224,129,.18),0 0 0 2px rgba(103,40,122,.90),0 0 24px rgba(196,84,232,.62),0 0 42px rgba(230,185,78,.17),0 16px 25px rgba(0,0,0,.82)!important;
}
.result-track .queen-rank{font-size:18px!important;color:#f5de94!important;text-shadow:0 2px 4px #000!important}
.result-track .queen-suit{font-size:23px!important;color:#d784ec!important;text-shadow:0 0 8px rgba(213,109,239,.34),0 2px 4px #000!important}
.active-queen-label{
  margin-top:14px!important;
  min-height:22px!important;
  display:flex!important;
  justify-content:center!important;
  align-items:center!important;
  gap:7px!important;
  color:#c9bdca!important;
  font-size:clamp(8px,.64vw,10px)!important;
}
.active-queen-label strong{
  color:#f0cb67!important;
  font:700 12px Georgia,serif!important;
}

/* Player-facing event sentence becomes a compact cinematic result strip. */
.event-callout{
  position:relative!important;
  min-height:50px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:12px!important;
  padding:8px 14px!important;
  border:0!important;
  border-left:0!important;
  border-radius:8px!important;
  background:linear-gradient(90deg,rgba(30,12,38,.64),rgba(19,8,24,.88) 50%,rgba(31,19,8,.54))!important;
  color:#f1e5d1!important;
  text-align:center!important;
  box-shadow:inset 0 0 0 1px rgba(102,66,111,.30),inset 0 1px rgba(255,255,255,.025)!important;
}
.event-callout::before{
  content:"";
  position:absolute;
  left:15%;right:15%;top:0;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(230,187,87,.55),transparent);
}
.event-kicker,.event-result-label{
  color:#b99857!important;
  font:700 clamp(7px,.53vw,9px)/1 Georgia,serif!important;
  letter-spacing:.12em!important;
  text-transform:uppercase!important;
}
.event-headline{
  color:#f4e4c5!important;
  font:700 clamp(11px,.9vw,14px)/1.15 Georgia,serif!important;
}
.event-outcome{
  color:#bcaebd!important;
  font-size:clamp(8px,.62vw,10px)!important;
}
.event-source,.event-result{
  min-width:0!important;
  display:grid!important;
  gap:2px!important;
  align-items:center!important;
}
.event-source{grid-template-columns:auto auto auto!important;gap:8px!important}
.event-actor{color:#a99cab!important;font-size:clamp(7px,.55vw,9px)!important;text-transform:uppercase!important;letter-spacing:.06em!important}
.event-source.human .event-actor{color:#c4b6ca!important}
.event-source.ace .event-actor{color:#d3ab56!important}
.event-token{
  color:#f8e9bd!important;
  font:700 clamp(15px,1.3vw,20px)/1 Georgia,serif!important;
  text-shadow:0 2px 6px #000!important;
}
.event-action{color:#d6b86d!important;font-size:clamp(8px,.58vw,10px)!important;font-weight:800!important;letter-spacing:.04em!important}
.event-arrow{color:#9b6fac!important;font-size:20px!important;text-shadow:0 0 8px rgba(159,80,183,.25)!important}
.event-result strong{color:#efe0c7!important;font-size:clamp(9px,.68vw,11px)!important;line-height:1.2!important}

.resolution-pulls{
  grid-template-columns:1fr 1fr!important;
  gap:10px!important;
}
.resolution-pulls span{
  min-height:32px!important;
  padding:5px 10px!important;
  border:0!important;
  border-radius:7px!important;
  background:rgba(9,4,12,.56)!important;
  box-shadow:inset 0 0 0 1px rgba(84,52,91,.26)!important;
  color:#a9a0aa!important;
}
.resolution-pulls .human-pull{box-shadow:inset 0 0 0 1px rgba(112,78,122,.29)!important}
.resolution-pulls .ace-pull{box-shadow:inset 0 0 0 1px rgba(143,101,40,.30)!important}
.resolution-pulls b{
  font:700 clamp(8px,.62vw,10px)/1 Georgia,serif!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
}
.resolution-pulls em{font-style:normal!important;color:#8f8592!important;font-size:clamp(7px,.55vw,9px)!important}
.resolution-pulls strong{color:#e9c45e!important;font-size:clamp(15px,1.25vw,19px)!important}
.resolution-pulls small{color:#817783!important;font-size:clamp(7px,.5vw,8px)!important}

.resolution-controls{
  min-height:44px!important;
  justify-content:center!important;
  gap:8px!important;
  padding:4px 0 0!important;
  border-top:1px solid rgba(118,77,127,.18)!important;
}
.resolution-controls button{
  min-height:34px!important;
  padding:6px 12px!important;
  border:1px solid rgba(104,86,109,.62)!important;
  border-radius:7px!important;
  background:linear-gradient(180deg,#18121b,#0d0a10)!important;
  color:#d9d0dc!important;
  font-size:clamp(9px,.72vw,11px)!important;
  font-weight:700!important;
  box-shadow:inset 0 1px rgba(255,255,255,.035),0 3px 8px rgba(0,0,0,.30)!important;
  transition:transform .13s ease,border-color .15s ease,background .15s ease,box-shadow .15s ease!important;
}
.resolution-controls button:hover:not(:disabled){
  transform:translateY(-2px)!important;
  border-color:rgba(191,147,68,.78)!important;
  background:linear-gradient(180deg,#211725,#100b13)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.055),0 6px 12px rgba(0,0,0,.42)!important;
}
.resolution-controls button:active:not(:disabled){transform:translateY(1px)!important}
#play-resolution{
  min-width:138px!important;
  border-color:#d4a54a!important;
  background:linear-gradient(180deg,#b88632 0,#8e6324 52%,#674319 100%)!important;
  color:#fff5d8!important;
  font-family:Georgia,serif!important;
  font-size:clamp(10px,.8vw,12px)!important;
  letter-spacing:.02em!important;
  text-shadow:0 1px 2px rgba(0,0,0,.65)!important;
  box-shadow:inset 0 1px rgba(255,246,194,.24),inset 0 -7px 11px rgba(60,31,5,.20),0 4px 12px rgba(0,0,0,.40),0 0 12px rgba(205,153,52,.08)!important;
}
#play-resolution:hover:not(:disabled){
  background:linear-gradient(180deg,#c7963c,#976b27 54%,#70491a)!important;
  border-color:#edc96b!important;
  box-shadow:inset 0 1px rgba(255,248,205,.30),0 7px 15px rgba(0,0,0,.48),0 0 15px rgba(222,170,62,.12)!important;
}
#continue-planning{
  border-color:rgba(120,73,137,.74)!important;
  background:linear-gradient(180deg,#2a1232,#16091c)!important;
  color:#ead9ef!important;
}
.resolution-step-button{
  color:#aaa0ad!important;
  background:#0d0a10!important;
  border-color:rgba(83,69,87,.54)!important;
}
.resolution-controls button:disabled{opacity:.34!important;transform:none!important;box-shadow:none!important}

@media(max-height:760px){
  .resolution-card{height:97vh!important;padding:8px!important;gap:6px!important}
  .resolution-heading{min-height:44px!important;padding-bottom:7px!important}
  .resolution-grid{grid-template-rows:minmax(108px,1fr) minmax(178px,1.34fr) minmax(108px,1fr)!important;gap:6px!important}
  .resolution-team{padding-top:19px!important}
  .result-card{height:min(100%,128px)!important}
  .resolution-focus{padding:7px 9px 6px!important;gap:5px!important;grid-template-rows:minmax(106px,1fr) auto auto!important}
  .result-queen-stage{grid-template-columns:112px minmax(240px,1fr) 112px!important;gap:9px!important}
  .waiting-slot{min-height:64px!important;padding:5px!important}
  .result-track .queen-marker{width:47px!important;height:66px!important}
  .event-callout{min-height:43px!important;padding:6px 10px!important}
  .resolution-pulls span{min-height:28px!important;padding:3px 8px!important}
  .resolution-controls{min-height:38px!important}
  .resolution-controls button{min-height:30px!important;padding:4px 10px!important}
}

@media(max-width:760px){
  .resolution-card{height:auto!important;max-height:96vh!important;overflow:auto!important}
  .resolution-grid{grid-template-rows:auto!important}
  .resolution-team{min-height:150px!important}
  .result-cards{grid-template-columns:repeat(4,minmax(58px,1fr))!important;gap:8px!important;padding:4px!important}
  .result-card{height:118px!important;max-width:84px!important}
  .result-queen-stage{grid-template-columns:1fr!important;gap:8px!important}
  .waiting-slot{min-height:55px!important}
  .active-track-wrap{order:-1!important;padding:20px 4px 5px!important}
  .event-source{grid-template-columns:1fr!important;gap:2px!important}
  .event-arrow{display:none!important}
  .resolution-controls{flex-wrap:wrap!important}
}

@media(prefers-reduced-motion:reduce){
  .result-card,.result-track .queen-marker,.resolution-controls button{transition:none!important}
}

/* ========================================================================== */
/* v0.14 Royal Table Reimagination — user review pass                         */
/* ========================================================================== */

/* 1) Cards should not jump/bounce on hover. Keep the physical fan position
   stable and communicate hover with light/shadow only. */
.hand .card:hover{
  transform:translateY(var(--fan-y)) rotate(var(--fan-rot))!important;
  z-index:50!important;
  filter:brightness(1.045) saturate(1.03)!important;
  box-shadow:
    inset 0 0 0 2px #fff8df,
    inset 0 0 0 4px rgba(78,45,18,.38),
    0 10px 22px rgba(0,0,0,.64),
    0 0 0 2px rgba(166,76,200,.48),
    0 0 18px rgba(178,75,215,.35)!important;
}
.result-card:hover:not(.resolved){
  transform:none!important;
  filter:drop-shadow(0 10px 13px rgba(0,0,0,.68)) brightness(1.025)!important;
}

/* 2) Resolution Queen: use the actual Queen artwork instead of an empty
   decorative marker. The marker remains driven by the same game state. */
.result-track .queen-marker{
  width:60px!important;
  height:86px!important;
  overflow:hidden!important;
  border:2px solid #f1cc65!important;
  border-radius:7px!important;
  background:#f5ead6 url('/assets/queen-diamonds.png') center/cover no-repeat!important;
  box-shadow:
    inset 0 0 0 2px rgba(255,236,171,.26),
    0 0 0 2px rgba(96,35,117,.88),
    0 0 20px rgba(181,77,216,.58),
    0 0 34px rgba(222,170,63,.16),
    0 14px 24px rgba(0,0,0,.82)!important;
}
.result-track .queen-marker .queen-rank,
.result-track .queen-marker .queen-suit{display:none!important}

/* 3) Remove score HUD. Round + initiative are enough at the top. */
.score-chip{display:none!important}
.royal-topbar{
  grid-template-columns:235px 90px 150px minmax(0,1fr) auto!important;
}

/* 4) Court thrones: smaller centered gemstone medallions so the chair reads
   clearly, with stronger material depth and optical centering. */
.queen-seat{
  grid-template-columns:72px minmax(0,1fr)!important;
  padding-left:72px!important;
  background:
    radial-gradient(circle at 18% 54%,rgba(131,70,159,.10),transparent 28%),
    linear-gradient(180deg,#13091a,#08040d)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.025),inset 0 -8px 18px rgba(0,0,0,.28)!important;
}
.queen-seat::before{
  left:3px!important;
  top:-5px!important;
  bottom:-5px!important;
  width:68px!important;
  opacity:1!important;
  filter:saturate(1.05) contrast(1.08) brightness(1.02) drop-shadow(0 3px 3px #0008)!important;
}
.queen-seat .seat-orb{
  left:24px!important;
  top:44%!important;
  width:30px!important;
  height:30px!important;
  transform:translate(-50%,-50%)!important;
  border:1px solid rgba(247,206,100,.88)!important;
  box-shadow:
    inset 0 2px 4px rgba(255,255,255,.42),
    inset 0 -7px 9px rgba(0,0,0,.68),
    0 0 0 2px rgba(47,20,53,.72),
    0 3px 7px rgba(0,0,0,.72),
    0 0 10px rgba(214,153,46,.18)!important;
}
.queen-seat .seat-orb::after{
  content:"";
  position:absolute;
  left:5px;right:7px;top:4px;height:7px;
  border-radius:50%;
  background:linear-gradient(180deg,rgba(255,255,255,.58),rgba(255,255,255,0));
  transform:rotate(-18deg);
  pointer-events:none;
}
.queen-seat .suit{
  position:relative!important;
  z-index:2!important;
  font-size:19px!important;
  line-height:1!important;
  text-shadow:0 1px 0 rgba(255,255,255,.32),0 2px 2px #000,0 0 6px currentColor!important;
}
.queen-seat.hearts .suit{transform:translateY(1px) scale(.90)!important}
.queen-seat.diamonds .suit{transform:scale(.86)!important}
.queen-seat.clubs .suit{transform:translateY(1px) scale(.79)!important}
.queen-seat.spades .suit{transform:translateY(-1px) scale(.87)!important}

/* 5) Reimagine the table as a royal game surface instead of a bordered web
   dashboard. Preserve purple/black/gold, but use material, depth and negative
   space as the separators. */
.game-shell{
  background:
    radial-gradient(ellipse at 50% 48%,rgba(91,28,116,.16),transparent 44%),
    radial-gradient(circle at 12% 20%,rgba(194,133,42,.055),transparent 25%),
    linear-gradient(160deg,#08030c 0%,#030205 46%,#09030d 100%)!important;
}
.royal-board{
  position:relative!important;
  isolation:isolate!important;
  background:
    radial-gradient(ellipse at 50% 40%,rgba(112,33,137,.12),transparent 48%),
    repeating-linear-gradient(118deg,rgba(255,255,255,.008) 0 1px,transparent 1px 9px),
    linear-gradient(180deg,rgba(16,6,22,.94),rgba(6,3,9,.97))!important;
  border:1px solid rgba(190,129,44,.56)!important;
  box-shadow:
    inset 0 0 0 1px rgba(109,43,129,.35),
    inset 0 0 55px rgba(0,0,0,.52),
    0 16px 42px rgba(0,0,0,.38)!important;
}
.royal-board::before{
  content:"";
  position:absolute;
  inset:8px;
  z-index:-1;
  pointer-events:none;
  border:1px solid rgba(239,190,78,.12);
  border-radius:4px;
  box-shadow:inset 0 0 36px rgba(101,35,123,.08);
}
.royal-topbar{
  background:
    linear-gradient(90deg,rgba(74,17,94,.30),transparent 28%,transparent 72%,rgba(94,49,14,.16)),
    linear-gradient(180deg,#12071a,#07030b)!important;
  border-color:rgba(173,112,39,.62)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.045),0 8px 22px rgba(0,0,0,.28)!important;
}
.court-strip,
.queue-duel,
.hand-center,
.card-powers-strip{
  border-color:rgba(137,79,153,.48)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.02),inset 0 -12px 24px rgba(0,0,0,.20)!important;
}
.queue-duel{
  background:
    radial-gradient(ellipse at 50% 50%,rgba(110,31,136,.12),transparent 54%),
    linear-gradient(180deg,rgba(15,6,20,.90),rgba(6,3,9,.92))!important;
}
.hand-center{
  background:
    radial-gradient(ellipse at 50% 105%,rgba(129,52,151,.11),transparent 45%),
    linear-gradient(180deg,#0e0713,#050307)!important;
}

/* 6) Edge bar: exact visual story requested — dark red -> light orange
   from -30 to 0, then light pink -> dark purple from 0 to +30. */
.track-numbers span:nth-child(-n+7){color:#ff8b58!important;text-shadow:0 0 5px rgba(255,94,53,.20)!important}
.track-numbers span:nth-child(n+8){color:#e68aff!important;text-shadow:0 0 5px rgba(185,73,231,.22)!important}
.royal-track{
  border-color:rgba(190,128,45,.68)!important;
  background:
    linear-gradient(90deg,
      #4f0911 0%,
      #7c1118 16%,
      #b42a1e 30%,
      #e85d2b 42%,
      #ffad5c 50%,
      #ffb2cf 50.2%,
      #e784d7 62%,
      #b74ac7 78%,
      #702190 92%,
      #3f105e 100%)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.13),inset 0 -6px 10px rgba(0,0,0,.42),0 4px 12px rgba(0,0,0,.48)!important;
}
.royal-track::before{
  height:5px!important;
  background:linear-gradient(90deg,
    #5b0911 0%,#9e171b 22%,#e84f26 39%,#ffc26d 50%,
    #ffc0d9 50.2%,#dc79db 66%,#9d38bb 82%,#4b126c 100%)!important;
  box-shadow:0 0 8px rgba(255,107,61,.32),0 0 9px rgba(178,73,222,.30)!important;
}
.royal-track::after{
  background:repeating-linear-gradient(90deg,transparent 0 calc(8.333% - 2px),rgba(255,222,151,.74) 0 calc(8.333% - 1px),transparent 0 8.333%)!important;
}

/* Resolution track uses the same left/right language for visual continuity. */
.result-track{
  background:linear-gradient(90deg,#4f0911,#a51e1d 25%,#f06d32 43%,#ffb566 49.8%,#ffb8d2 50.2%,#d978d7 66%,#9636b4 82%,#451064)!important;
}
.result-track::before{
  background:linear-gradient(90deg,#6a0c13,#c42c21 30%,#ffab58 49.8%,#ffc1d9 50.2%,#c85ed2 72%,#531572 100%)!important;
}
.result-track-side.human{color:#ff9d71!important}
.result-track-side.ace{color:#db8af0!important}

/* 7) Reverse values remain part of game state, but their dedicated visual
   trackers are removed from the table as requested. */
.court-and-resources{
  grid-template-columns:minmax(0,1fr)!important;
  gap:0!important;
}
.court-and-resources>.reverse-orb{display:none!important}
.court-and-resources .human-court-strip{width:100%!important}

/* Cleaner bottom powers: less bordered-dashboard, more engraved command rail. */
.card-powers-strip{
  gap:0!important;
  padding:0!important;
  overflow:hidden!important;
  border-color:rgba(178,120,41,.55)!important;
  background:linear-gradient(180deg,#100718,#07030b)!important;
}
.card-powers-strip>div{
  border:0!important;
  border-right:1px solid rgba(130,76,145,.34)!important;
  border-radius:0!important;
  background:transparent!important;
  padding:6px 8px!important;
  transition:background .14s ease,box-shadow .14s ease!important;
}
.card-powers-strip>div:last-child{border-right:0!important}
.card-powers-strip>div:hover{
  background:radial-gradient(circle at 50% 100%,rgba(133,47,159,.16),transparent 65%)!important;
  box-shadow:inset 0 2px rgba(233,190,80,.13)!important;
}
.card-powers-strip strong{font-size:9px!important;color:#f2dfb4!important}
.card-powers-strip span{font-size:7px!important;color:#b4a9b7!important}

/* Main Queen remains the brightest permanent table object. */
.royal-edge .queen-marker{
  box-shadow:0 0 0 2px #6f257f,0 0 24px rgba(204,88,239,.52),0 0 42px rgba(245,166,53,.12),0 12px 25px #000d!important;
}

@media(max-height:820px){
  .queen-seat{grid-template-columns:58px minmax(0,1fr)!important;padding-left:58px!important}
  .queen-seat::before{width:56px!important}
  .queen-seat .seat-orb{left:20px!important;width:26px!important;height:26px!important}
  .queen-seat .suit{font-size:16px!important}
}

/* ================================================================
   v0.15 · Resolution Academy tutorial
   A self-contained animated teaching surface. No live match state.
   ================================================================ */
body.tutorial-active{overflow:hidden;background:#050208}
body.tutorial-active .masthead,body.tutorial-active #notice{display:none!important}
body.tutorial-active .shell{width:100%;max-width:none}
.tutorial-screen{height:100vh;padding:18px 22px!important;background:
 radial-gradient(circle at 50% 42%,rgba(91,27,104,.20),transparent 34%),
 radial-gradient(circle at 20% 10%,rgba(197,122,31,.08),transparent 26%),
 linear-gradient(145deg,#050207,#09030d 54%,#030205);overflow:auto}
.tutorial-shell{width:min(1460px,100%);min-height:calc(100vh - 36px);margin:0 auto;border:1px solid #8f612d;border-radius:14px;padding:16px;background:
 linear-gradient(180deg,rgba(29,9,31,.93),rgba(8,3,11,.98));box-shadow:0 30px 80px #0009,inset 0 0 0 1px #e0b35612;position:relative;overflow:hidden}
.tutorial-shell::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.18;background:
 radial-gradient(circle at 50% 38%,#b34ad51b,transparent 32%),
 repeating-linear-gradient(135deg,transparent 0 18px,#f2c86908 19px,transparent 20px 39px)}
.tutorial-header,.tutorial-stage,.tutorial-tabs,.tutorial-footer{position:relative;z-index:1}
.tutorial-header{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:2px 4px 13px;border-bottom:1px solid #664022}
.tutorial-header h2{margin:3px 0 2px;color:#f0cf77;font:700 clamp(26px,3vw,42px)/1 Georgia,serif;letter-spacing:.025em}
.tutorial-header p:last-child{margin:4px 0 0;color:#b3a7b3;font-size:13px}
.tutorial-tabs{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin:12px 0}
.tutorial-tab{min-height:42px;padding:6px 8px;border:1px solid #49304c;background:linear-gradient(#140a19,#0b060e);color:#bcb0bd;font:700 11px Georgia,serif;letter-spacing:.03em;transition:border-color .18s,background .18s,color .18s,box-shadow .18s;box-shadow:none!important;transform:none!important}
.tutorial-tab:hover{border-color:#88613e;color:#ead28d}
.tutorial-tab.active{border-color:#d39b3f;color:#ffe196;background:linear-gradient(#301335,#16091a);box-shadow:inset 0 -2px #a94fd0,0 0 14px #c259dd18!important}
.tutorial-stage{border:1px solid #6d4728;border-radius:12px;padding:12px;background:linear-gradient(180deg,#0c0610,#070409 55%,#050306);box-shadow:inset 0 1px #fff1c60b,0 12px 34px #0007}
.tutorial-stage-head{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:52px;padding:0 3px 10px}
.tutorial-step-label{color:#c49a51;font-size:9px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.tutorial-stage-head h3{margin:2px 0 0;color:#f3d783;font:700 clamp(20px,2vw,30px) Georgia,serif}
.tutorial-actions{display:flex;gap:7px;align-items:center}
.tutorial-actions button{min-width:42px;border-color:#624465;background:#130a18}
.tutorial-actions .primary{min-width:150px;border-color:#d1a14a;background:linear-gradient(#aa762d,#714316);box-shadow:inset 0 1px #ffe4a950,0 4px 12px #0007}
.tutorial-demo{display:grid;grid-template-columns:150px minmax(0,1fr) 150px;grid-template-rows:minmax(220px,36vh) 174px;gap:10px;border-radius:10px;background:
 radial-gradient(ellipse at center,#38123b50 0,#17091c35 30%,transparent 61%),
 linear-gradient(90deg,#180709,#12070f 35%,#100713 65%,#0c0714);border:1px solid #39243e;overflow:hidden;position:relative}
.tutorial-demo::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(145,38,29,.07),transparent 36%,transparent 64%,rgba(98,34,126,.09));}
.tutorial-side{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;padding:12px;text-align:center}
.tutorial-side>span{color:#d2b65f;font:700 10px Georgia,serif;letter-spacing:.1em}
.tutorial-side small{color:#8e828f;font-size:9px;line-height:1.45}
.tutorial-court-target{width:72px;height:82px;display:grid;place-items:center;color:#e5bf65;font:700 30px Georgia,serif;background:radial-gradient(circle at 50% 35%,#53213a,#170912 65%);border:1px solid #725129;border-radius:32px 32px 9px 9px;box-shadow:inset 0 0 22px #f1972f12,0 8px 18px #0008;position:relative}
.tutorial-court-target::before,.tutorial-court-target::after{content:"";position:absolute;bottom:-11px;width:8px;height:15px;border:1px solid #76502c;background:#2c111a;border-radius:0 0 3px 3px}.tutorial-court-target::before{left:13px}.tutorial-court-target::after{right:13px}
.tutorial-center{position:relative;z-index:1;display:grid;grid-template-rows:auto 1fr auto;align-items:center;padding:15px 10px 8px}
.tutorial-resolution-label{text-align:center;display:grid;gap:3px}.tutorial-resolution-label span{font-size:8px;color:#8f7e92;letter-spacing:.18em}.tutorial-resolution-label strong{color:#f1cf6d;font:700 14px Georgia,serif;letter-spacing:.08em}
.tutorial-edge-wrap{position:relative;padding:27px 0 18px;width:100%}
.tutorial-edge-numbers{display:grid;grid-template-columns:repeat(5,1fr);position:absolute;top:4px;left:0;right:0;color:#c48d63;font:700 9px Georgia,serif}.tutorial-edge-numbers span{text-align:center}.tutorial-edge-numbers span:nth-child(n+4){color:#c776dc}
.tutorial-edge-track{height:29px;border:1px solid #493139;background:#070409;border-radius:4px;position:relative;box-shadow:inset 0 0 13px #000,0 0 16px #9d3bb31a}
.tutorial-edge-track::before{content:"";position:absolute;left:7px;right:7px;top:50%;height:5px;transform:translateY(-50%);border-radius:5px;background:linear-gradient(90deg,#691417 0%,#a82c1f 18%,#f07632 42%,#ffc37a 50%,#f7a5c8 54%,#c55acb 73%,#65177f 100%);box-shadow:0 0 10px #bd49bf44}
.tutorial-edge-track::after{content:"";position:absolute;inset:4px 7px;background:repeating-linear-gradient(90deg,transparent 0 calc(12.5% - 1px),#f5c24f7e 0 12.5%);opacity:.42}
.tutorial-zero{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:2;width:16px;height:16px;border-radius:50%;display:grid;place-items:center;background:#140913;border:1px solid #e1ad48;color:#f6cf6c;font-size:7px}
.tutorial-queen{position:absolute;z-index:5;top:50%;left:50%;width:55px;height:78px;transform:translate(-50%,-50%);border:2px solid #d69a38;border-radius:7px;background:linear-gradient(145deg,#fff7df,#e9d8ae);box-shadow:0 9px 22px #000b,0 0 18px #b34ed746;display:grid;place-items:center;color:#5a1c25;transition:left .9s cubic-bezier(.22,.85,.25,1),box-shadow .25s,transform .25s}
.tutorial-queen span{position:absolute;top:4px;left:6px;font:700 13px Georgia,serif}.tutorial-queen b{font:700 25px Georgia,serif}.tutorial-queen.is-active{transform:translate(-50%,-50%) scale(1.07);box-shadow:0 12px 28px #000c,0 0 0 2px #f2c95a88,0 0 28px #c956dd80}
.tutorial-effect-zone{height:51px;display:flex;justify-content:center;align-items:center;opacity:0;transform:translateY(6px);transition:opacity .3s,transform .3s}.tutorial-effect-zone.show{opacity:1;transform:none}.tutorial-effect-zone.resolved{filter:saturate(.94)}
.reverse-demo,.bank-demo,.waiting-demo,.guard-demo{min-width:270px;height:45px;border:1px solid #5d3d5e;border-radius:8px;background:#110817;display:flex;align-items:center;justify-content:center;gap:9px;padding:6px 13px;box-shadow:inset 0 0 18px #6e2c7a1f,0 5px 14px #0007;color:#c5b8c5;position:relative}
.reverse-demo span,.bank-demo span,.waiting-demo>span,.guard-demo>span{font-size:8px;letter-spacing:.09em;color:#968899}.reverse-demo b,.bank-demo b{font:700 18px Georgia,serif;color:#b3a9b3}.reverse-demo i,.bank-demo i{font-style:normal;color:#e5ad3e;font-weight:800}.reverse-demo strong,.bank-demo strong{font:700 22px Georgia,serif;color:#f4cc67}.reverse-demo small{font-size:7px;color:#8c7d8e}
.waiting-demo,.guard-demo{min-width:330px;gap:14px}.waiting-demo-queen{width:38px;height:42px;display:grid;place-items:center;border:1px solid #d2a54d;border-radius:5px;background:#f2e5bf;color:#4f1933;font:700 13px Georgia,serif;animation:tutorial-waiting-hit .7s .35s both}.king-strike,.guard-king,.guard-shield{width:31px;height:36px;display:grid;place-items:center;border:1px solid #d0a14b;border-radius:5px;background:#eee0ba;color:#5c3219;font:700 18px Georgia,serif}.king-strike{animation:tutorial-king-strike .55s both}.waiting-demo strong,.guard-demo strong{font:700 10px Georgia,serif;color:#f0bf58;letter-spacing:.06em}.guard-king{animation:tutorial-guard-king .65s both}.guard-shield{color:#532268;border-color:#a96ac0;animation:tutorial-guard-jack .65s .25s both}.guard-demo strong{color:#d38bea}
.tutorial-card-lane{grid-column:1/-1;position:relative;z-index:1;display:grid;grid-template-columns:220px 1fr 320px;align-items:center;gap:24px;padding:12px 30px;border-top:1px solid #352139;background:linear-gradient(180deg,#0d0610,#09050b)}
.tutorial-card-origin{display:flex;align-items:center;gap:14px}.tutorial-card-origin>span,.tutorial-outcome-card>span{font-size:8px;color:#8c7f8d;letter-spacing:.12em}
.tutorial-demo-card{width:82px;height:128px;flex:0 0 auto;border:2px solid #d0a04a;border-radius:7px;background:linear-gradient(145deg,#fff9e8,#ead9b1);color:#2c1b17;position:relative;display:grid;grid-template-rows:22px 32px 19px 1fr;align-items:center;text-align:center;padding:4px 5px;box-shadow:0 9px 18px #000a;transition:transform .38s cubic-bezier(.2,.8,.2,1),box-shadow .3s,filter .3s}
.tutorial-demo-card.is-playing{transform:translate(78px,-10px) scale(1.08);box-shadow:0 18px 28px #000b,0 0 0 2px #d19d47,0 0 25px #c051db62;filter:saturate(1.12)}.tutorial-demo-card.is-resolved{box-shadow:0 8px 16px #0009,0 0 0 1px #8c6739}
.tutorial-card-rank{position:absolute;top:5px;left:6px;font:700 18px Georgia,serif}.tutorial-card-symbol{font:700 28px Georgia,serif;margin-top:13px}.tutorial-demo-card strong{font:700 9px Georgia,serif;border-top:1px solid #ab8953;padding-top:4px}.tutorial-demo-card small{font-size:7px;line-height:1.25;color:#66594a;padding-top:5px}.tutorial-demo-card.hearts .tutorial-card-rank,.tutorial-demo-card.hearts .tutorial-card-symbol{color:#b31f31}.tutorial-demo-card.diamonds .tutorial-card-rank,.tutorial-demo-card.diamonds .tutorial-card-symbol{color:#c65b1c}.tutorial-demo-card.clubs .tutorial-card-rank,.tutorial-demo-card.clubs .tutorial-card-symbol{color:#0b7650}.tutorial-demo-card.spades .tutorial-card-rank,.tutorial-demo-card.spades .tutorial-card-symbol{color:#17151a}.tutorial-demo-card.ace .tutorial-card-rank,.tutorial-demo-card.king .tutorial-card-rank,.tutorial-demo-card.jack .tutorial-card-rank{color:#65327a}
.tutorial-flight-line{display:flex;align-items:center;gap:10px;color:#9d8a9e;font-size:8px;letter-spacing:.12em;text-transform:uppercase}.tutorial-flight-line i{height:1px;background:linear-gradient(90deg,transparent,#806184);flex:1}.tutorial-flight-line i:last-child{background:linear-gradient(90deg,#806184,transparent)}
.tutorial-outcome-card{min-height:105px;border-left:2px solid #b17835;padding:10px 0 10px 17px;display:flex;flex-direction:column;justify-content:center}.tutorial-outcome-card strong{margin:5px 0;color:#efd07a;font:700 17px Georgia,serif}.tutorial-outcome-card p{margin:0;color:#a69ba7;font-size:10px;line-height:1.45}
.tutorial-explain{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-top:9px}.panel-lite{min-height:74px;border:1px solid #3e2a40;border-radius:8px;background:#0b060e;padding:11px 13px}.panel-lite span{display:block;color:#b18847;font-size:8px;font-weight:800;letter-spacing:.12em;margin-bottom:5px}.panel-lite strong{display:block;color:#d6cbd7;font-size:10px;line-height:1.45;font-weight:600}
.tutorial-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:11px 3px 0;color:#827783;font-size:9px}.tutorial-footer .primary{min-width:130px}
.tutorial-menu-button{grid-column:1/-1;border-color:#75512d!important;color:#e8c568!important;background:linear-gradient(180deg,#1c0c20,#100713)!important}
@keyframes tutorial-king-strike{0%{transform:translateX(80px) rotate(6deg);opacity:.2}70%{transform:translateX(2px) rotate(-4deg)}100%{transform:translateX(0);opacity:1}}
@keyframes tutorial-waiting-hit{0%,45%{transform:none;opacity:1;filter:none}65%{transform:translateX(4px) rotate(5deg);filter:brightness(1.8)}100%{transform:scale(.2) rotate(18deg);opacity:.08;filter:blur(2px)}}
@keyframes tutorial-guard-king{0%{transform:translateX(85px);opacity:.3}75%{transform:translateX(13px)}100%{transform:translateX(14px);opacity:.75}}
@keyframes tutorial-guard-jack{0%{transform:translateX(-25px) scale(.5);opacity:0}60%{transform:translateX(-6px) scale(1.22);opacity:1}100%{transform:translateX(-6px) scale(1);box-shadow:0 0 16px #b74ee1aa}}
@media(max-width:900px){.tutorial-screen{padding:8px!important}.tutorial-shell{padding:10px}.tutorial-tabs{grid-template-columns:repeat(4,1fr)}.tutorial-demo{grid-template-columns:95px minmax(0,1fr) 95px}.tutorial-card-lane{grid-template-columns:160px 1fr 220px;padding:10px 14px}.tutorial-explain{grid-template-columns:1fr}.tutorial-side small{display:none}.tutorial-card-origin>span{display:none}}
@media(max-height:760px){.tutorial-screen{padding:8px 14px!important}.tutorial-shell{min-height:calc(100vh - 16px);padding:10px}.tutorial-header h2{font-size:27px}.tutorial-tabs{margin:7px 0}.tutorial-tab{min-height:34px}.tutorial-stage{padding:8px}.tutorial-stage-head{min-height:42px;padding-bottom:5px}.tutorial-demo{grid-template-rows:minmax(180px,29vh) 142px}.tutorial-demo-card{width:71px;height:110px}.tutorial-explain{margin-top:6px}.panel-lite{min-height:58px;padding:7px 10px}.tutorial-footer{padding-top:6px}}

/* v0.17: initiative lives with the execution mechanic, not only in the HUD. */
.execution-order{gap:3px!important}
.execution-initiative{display:grid;place-items:center;margin-bottom:5px;padding:4px 12px;border-radius:999px;border:1px solid #6f3888;background:radial-gradient(circle at 50% 0,#4b1764 0,#17091f 72%);box-shadow:inset 0 1px #ffffff14,0 0 12px #8c35b02b;min-width:92px}
.execution-initiative small{font:700 7px/1.1 Inter,system-ui,sans-serif;letter-spacing:.16em;color:#b998c8}
.execution-initiative strong{margin-top:2px;font:700 12px/1 Georgia,serif;color:#f0ca63;text-shadow:0 0 8px #e5ae4c35}
.resolution-pulls small{font-weight:700;letter-spacing:.03em;color:#bca9c3}


/* v0.18 clarification pass */
.title-screen{position:relative;min-height:min(760px,calc(100vh - 110px));overflow:hidden;display:grid;place-items:center;background:radial-gradient(circle at 68% 42%,rgba(126,42,153,.28),transparent 31%),linear-gradient(135deg,#08030c 0%,#15071e 55%,#070309 100%);border:1px solid #7b4a30;border-radius:14px;box-shadow:inset 0 0 80px #000,0 22px 60px #0008}
.title-art{position:absolute;right:4%;bottom:0;width:min(43vw,540px);height:92%;display:flex;align-items:flex-end;justify-content:center;pointer-events:none;filter:drop-shadow(0 20px 28px #000)}
.title-art img{max-width:100%;max-height:100%;object-fit:contain;object-position:center bottom;mask-image:linear-gradient(to bottom,#000 0 88%,transparent 100%)}
.title-crest,.title-kicker,.title-wordmark,.title-tagline,.title-enter,.title-secondary,.title-version{position:relative;z-index:2;justify-self:start;margin-left:9%;max-width:44%}
.title-crest{font-size:52px;color:#e4b84e;text-shadow:0 0 20px #9d42c9}
.title-wordmark{font-size:clamp(46px,6vw,86px)!important;line-height:.86!important;text-shadow:0 4px 0 #3d183e,0 0 28px #7d287a66}
.title-enter,.title-secondary{width:min(360px,38vw);margin-top:10px}
/* Queue cards use the full card face again; never hide their text. */
.team-slots .card .card-effect,.team-slots .card .card-name{display:block!important}
.team-slots,.opponent-queue{height:96px!important}
.back-card,.slot,.team-slots .card{height:96px!important;min-height:96px!important}
.team-slots .card .card-name{font-size:7px!important;white-space:normal!important;text-align:center!important;line-height:1.05!important}
.team-slots .card .card-effect{font-size:6.5px!important;line-height:1.08!important;text-align:center!important;overflow:hidden!important}
/* Hover is stable: highlight without translating, scaling, or snapping out of the fan. */
.hand .card:hover{transform:translateY(var(--fan-y)) rotate(var(--fan-rot))!important;box-shadow:inset 0 0 0 2px #fff8df,inset 0 0 0 4px rgba(78,45,18,.42),0 12px 28px rgba(0,0,0,.72),0 0 0 3px #9f4bc4,0 0 22px rgba(181,69,222,.55)!important;filter:saturate(1.04)!important;z-index:50!important}
/* With reverse trackers retired, the court receives the full width. */
.court-and-resources{display:block!important}.court-and-resources .human-court-strip{width:100%!important}

/* v0.18.1: Initiative is a two-sided indicator; only the round holder lights. */
.execution-initiative{min-width:150px!important;padding:5px 10px!important;gap:4px!important}
.initiative-sides{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:2px}
.initiative-sides strong{margin:0!important;padding:4px 8px;border:1px solid #3f2b46;border-radius:999px;color:#766c79!important;background:#0c080f;box-shadow:none!important;text-shadow:none!important;font:700 9px/1 Georgia,serif!important;letter-spacing:.05em;transition:all .16s ease}
.initiative-sides b{font:700 7px/1 Inter,system-ui,sans-serif;color:#655b68;letter-spacing:.1em}
.initiative-sides strong.active{color:#ffe087!important;border-color:#d6a13b;background:radial-gradient(circle at 50% 0,#63336e 0,#26102e 70%);box-shadow:0 0 0 1px #e6b84e35,0 0 14px #b54ad76b,inset 0 1px #fff3!important;text-shadow:0 0 8px #eec65466!important}

/* Queue cards are the same complete card component as hand/battle cards. */
.team-slots .slot{padding:3px!important;overflow:visible!important}
.team-slots .card{width:100%!important;max-width:78px!important;margin:auto!important;aspect-ratio:5/7!important;height:auto!important;min-height:0!important;padding:5px!important}
.team-slots .card .card-rank{font-size:13px!important}
.team-slots .card .card-symbol{font-size:18px!important}
.team-slots .card .card-name{display:block!important;font-size:6.5px!important;line-height:1.05!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important}
.team-slots .card .card-effect{display:block!important;font-size:5.8px!important;line-height:1.08!important;max-height:none!important;overflow:visible!important}
.team-slots{height:116px!important;align-items:center!important}
.team-slots .slot{height:116px!important;min-height:116px!important}
.opponent-queue{height:116px!important}.opponent-queue .back-card{height:116px!important;min-height:116px!important}

/* v0.19 full settings */
.settings-full{max-width:980px;margin:0 auto;padding:24px}
.settings-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0 22px}
.settings-tabs button{padding:10px 16px;border-radius:999px}
.settings-tabs button.active{box-shadow:0 0 0 1px #efc85b inset,0 0 20px rgba(143,78,255,.3)}
.settings-pane{display:grid;gap:10px}
.settings-pane .setting-row{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:16px;border:1px solid rgba(239,200,91,.18);border-radius:14px;background:rgba(15,8,26,.58)}
.setting-row>div:first-child{display:grid;gap:4px}.setting-row span{opacity:.72;font-size:.88rem}
.setting-row select,.setting-row input[type=range]{min-width:190px}.setting-row input[type=checkbox]{width:22px;height:22px}
.settings-footer{display:flex;justify-content:space-between;align-items:center;margin-top:22px;padding-top:16px;border-top:1px solid rgba(239,200,91,.18)}
.control-reference{display:grid;grid-template-columns:1fr auto;gap:10px 18px;align-items:center}.control-reference kbd{padding:7px 11px;border:1px solid rgba(239,200,91,.35);border-radius:8px;background:#120a1f}
body.reduce-motion *,body.reduce-motion *::before,body.reduce-motion *::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
body.high-contrast .panel,body.high-contrast .card{filter:contrast(1.18)}
body.reduced-glow .card,body.reduced-glow .queen-marker,body.reduced-glow button{box-shadow:none!important;text-shadow:none!important}
body[data-card-text="large"] .card-effect{font-size:clamp(10px,.78vw,14px)!important}body[data-card-text="small"] .card-effect{font-size:clamp(7px,.55vw,10px)!important}
body[data-tooltips="off"] #card-tooltip{display:none!important}

/* v0.20 — Match Setup, Local hot-seat flow, tutorial chapters, teammate visibility */
.mode-card,.match-setup-card{width:min(1180px,94vw);margin:0 auto}
.mode-choice-grid,.online-choice-grid,.setup-team-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:stretch}
.mode-choice{min-height:150px;display:flex;flex-direction:column;justify-content:center;gap:10px;text-align:left;padding:26px}
.mode-choice strong{font-size:1.55rem;letter-spacing:.08em}.mode-choice span{opacity:.78;line-height:1.5}
.setup-header{display:flex;justify-content:space-between;gap:24px;align-items:flex-start;margin-bottom:22px}.setup-header h2{margin:.2rem 0}.setup-versus{align-self:center;font-weight:900;letter-spacing:.18em;opacity:.6}
.setup-team{padding:18px;border:1px solid rgba(236,205,122,.2);border-radius:16px;background:rgba(8,6,15,.5)}.setup-team h3{margin:0 0 14px;letter-spacing:.08em}.setup-slots{display:grid;gap:12px}
.setup-player-slot{padding:15px;border-radius:13px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.035)}.setup-player-slot header{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px}.setup-player-slot header>span{font-size:.76rem;letter-spacing:.12em;opacity:.72}.setup-player-slot label{display:grid;gap:6px;font-size:.75rem;letter-spacing:.05em;opacity:.95}.setup-player-slot input,.setup-player-slot select,.online-setup-panel input,.online-setup-panel select,.compact-reconnect input{width:100%;box-sizing:border-box}.slot-type-fixed{font-size:.78rem;color:#efcf77;letter-spacing:.08em}.terms-strip{margin:20px 0;display:flex;justify-content:space-between;gap:24px;align-items:center;padding:14px 16px;border-top:1px solid rgba(239,200,91,.22);border-bottom:1px solid rgba(239,200,91,.22)}.terms-strip>div{display:flex;gap:12px;align-items:center}.terms-strip span{font-size:.72rem;letter-spacing:.15em;color:#efcf77}.terms-strip label{display:flex;gap:10px;align-items:center;font-size:.78rem}.terms-strip input{width:110px}.match-setup-card #enter-match-button{display:block;margin:0 auto;min-width:240px}
.online-setup-panel{display:grid;gap:12px;padding:22px;border:1px solid rgba(239,200,91,.18);border-radius:16px;background:rgba(7,5,14,.5)}.online-setup-panel h3{margin:0 0 4px}.online-setup-panel label{display:grid;gap:6px}.compact-reconnect{margin-top:18px;display:flex;gap:10px;align-items:end}.compact-reconnect label{flex:1;display:grid;gap:6px}
.pass-card{text-align:center;max-width:620px}.pass-card h2{font-size:2.2rem;margin:.3rem 0}.pass-card p{max-width:480px;margin:0 auto 24px;line-height:1.6}
.tutorial-chapters{display:flex;gap:8px;overflow-x:auto;padding:4px 0 12px;margin-bottom:6px}.tutorial-chapter{white-space:nowrap;border-radius:999px;padding:9px 14px;font-size:.75rem;letter-spacing:.045em}.tutorial-chapter.active{border-color:#efc85b;box-shadow:0 0 0 1px rgba(239,200,91,.22),0 0 18px rgba(128,74,255,.18)}
.teammate-hand-wrap{margin-top:8px;padding-top:8px;border-top:1px solid rgba(255,255,255,.1)}.teammate-hand-wrap>span{display:block;text-align:center;font-size:.72rem;letter-spacing:.1em;opacity:.72;margin-bottom:5px}.teammate-hand{display:flex;justify-content:center;gap:3px;max-height:74px;overflow:hidden}.teammate-hand .card{width:48px;min-width:48px;height:68px;transform:none!important}.teammate-hand .card-name,.teammate-hand .card-effect{display:none!important}.teammate-hand .card-rank{font-size:.82rem}.teammate-hand .card-symbol{font-size:1rem}
.confirmations{display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end}.confirmation{font-size:.61rem;padding:4px 7px;border-radius:999px;border:1px solid rgba(255,255,255,.12);opacity:.66}.confirmation.ready{opacity:1;border-color:rgba(239,200,91,.45);color:#f2d680}
.match-summary{margin-top:16px;padding:16px;border:1px solid rgba(239,200,91,.18);border-radius:14px;background:rgba(0,0,0,.2)}.match-summary h3{margin:0 0 12px;letter-spacing:.08em}.summary-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.summary-grid div{display:grid;gap:4px;padding:10px;border-radius:10px;background:rgba(255,255,255,.035)}.summary-grid span{font-size:.68rem;letter-spacing:.08em;opacity:.65}.summary-grid strong{font-size:1rem}
.menu-button.subtle{opacity:.7}
@media(max-width:800px){.mode-choice-grid,.online-choice-grid,.setup-team-grid{grid-template-columns:1fr}.setup-versus{text-align:center}.terms-strip{align-items:stretch;flex-direction:column}.summary-grid{grid-template-columns:1fr 1fr}.compact-reconnect{align-items:stretch;flex-direction:column}}

/* v0.22: each Court may display up to two independently-timed Waiting Queens. */
.waiting-queen-entry { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.12rem; min-width:0; padding:.28rem .38rem; }
.waiting-queen-entry + .waiting-queen-entry { border-top:1px solid rgba(255,255,255,.16); }

/* v0.25 Resolution Experience */
.resolution-focus{grid-template-rows:1fr auto auto auto!important}
.resolution-change-strip{display:flex;justify-content:center;align-items:stretch;gap:7px;min-height:31px;flex-wrap:wrap}
.resolution-change{display:flex;align-items:center;gap:6px;padding:5px 9px;border:1px solid rgba(151,105,163,.28);border-radius:7px;background:rgba(12,6,16,.72);font-size:9px;color:#c9b9ca}
.resolution-change em{font-style:normal;color:#9d8da0;text-transform:uppercase;letter-spacing:.06em;font-size:7px}
.resolution-change b{color:#aaa;font-weight:700}.resolution-change i{font-style:normal;color:#8f649e}.resolution-change strong{color:#f0cb67;font:700 11px Georgia,serif}
.resolution-change.quiet strong{color:#cdbdce;font-size:9px}
.invert-source{display:inline-grid;grid-template-columns:auto auto;grid-template-rows:auto auto;column-gap:5px;align-items:center;padding:3px 6px;border:1px solid rgba(126,78,157,.55);border-radius:5px;background:rgba(56,23,72,.5)}
.invert-source em{grid-column:1;font-style:normal;font-size:6px;letter-spacing:.08em;color:#a894b1;text-transform:uppercase}.invert-source b{grid-column:2;grid-row:1/3;color:#f3d879;font:700 15px Georgia,serif}.invert-source i{grid-column:1;font-style:normal;font-size:7px;color:#b8a8bc}
.invert-opposite{font-size:7px;font-weight:900;letter-spacing:.08em;color:#c780dc}
@media(max-width:760px){.resolution-change-strip{gap:4px}.resolution-change{padding:4px 6px}.event-source{grid-template-columns:auto!important;justify-items:center}.invert-opposite{display:none}}

/* v0.26 Waiting & Seating Experience */
.waiting-queen{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px!important;min-width:210px!important;align-items:stretch!important}
.waiting-queen-entry,.waiting-position-empty{position:relative;min-height:70px!important;border:1px solid rgba(224,180,74,.28);border-radius:8px;background:linear-gradient(180deg,rgba(50,26,59,.7),rgba(10,6,14,.86));padding:5px 7px!important;text-align:center}
.waiting-queen-entry + .waiting-queen-entry{border-top:1px solid rgba(224,180,74,.28)!important}
.waiting-position-label,.waiting-position-empty b{font:700 6px/1 Inter,system-ui,sans-serif;letter-spacing:.12em;color:#a996aa}
.waiting-queen-entry strong{font:700 8px/1.05 Georgia,serif;color:#f1d17e;white-space:nowrap}
.waiting-queen-entry.duplicate{border-color:rgba(190,91,214,.48);box-shadow:inset 0 0 14px rgba(151,57,181,.12)}
.waiting-queen-entry.duplicate strong{color:#e6a7f2}
.waiting-queen-entry .waiting-crown{font-size:16px;line-height:15px}
.waiting-progress{display:flex;gap:4px;justify-content:center;margin-top:2px}.waiting-progress-pip{display:grid;place-items:center;width:17px;height:17px;border:1px solid #6f5e73;border-radius:50%;font:700 7px/1 Inter,system-ui,sans-serif;color:#847988;background:#09060c}.waiting-progress-pip.complete{border-color:#dfb844;color:#fff1b0;background:#59451c;box-shadow:0 0 7px rgba(231,186,64,.25)}
.waiting-queen-entry small{font-size:6px!important;line-height:1.05;color:#a79ca9}.waiting-position-empty{display:grid;place-items:center;align-content:center;gap:5px;border-style:dashed;opacity:.5}.waiting-position-empty i{font-style:normal;font-size:7px;color:#a999a9}
.waiting-empty{grid-column:1/-1;display:grid!important;grid-template-columns:1fr 1fr;gap:6px!important;height:auto!important}.waiting-empty i{width:auto!important;height:70px!important;border-radius:8px!important;border-style:dashed!important}
.waiting-queen.full{filter:none}.resolution-overlay .waiting-queen{min-width:170px!important}.resolution-overlay .waiting-queen-entry,.resolution-overlay .waiting-position-empty,.resolution-overlay .waiting-empty i{min-height:76px!important;height:76px!important}
@media(max-width:900px){.waiting-queen{min-width:170px!important}.waiting-queen-entry strong{font-size:7px}.waiting-queen-entry small{display:none}}

/* v0.27 Match Completion */
.match-summary{margin:1rem 0;padding:1rem;border:1px solid #583a62;border-radius:10px;background:#08060b;text-align:left;max-height:42vh;overflow:auto}
.match-summary h3{text-align:center;margin:.1rem 0 1rem;color:#ecc668;letter-spacing:.12em;font:700 1rem Georgia,serif}
.summary-courts{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin-bottom:.9rem}
.summary-courts>div{padding:.65rem;border:1px solid #3d2945;border-radius:8px;background:#0d0911}
.summary-courts>div>span{display:block;margin-bottom:.45rem;color:#bba9c0;font-size:.62rem;text-transform:uppercase;letter-spacing:.08em}
.summary-suits{display:flex;gap:.4rem}.summary-suit{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;border:1px solid #57405e;font-size:1rem}.summary-suit.seated{color:#f0c968;border-color:#9e6c31;box-shadow:inset 0 0 12px #6f421f55}.summary-suit.missing{color:#4c414f;opacity:.55}
.match-summary .summary-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.55rem}
.match-summary .summary-grid>div{padding:.55rem;border:1px solid #34243a;border-radius:7px;background:#0d0911}
.match-summary .summary-grid span{display:block;color:#9c8a9f;font-size:.54rem;text-transform:uppercase;line-height:1.2}.match-summary .summary-grid strong{display:block;margin-top:.22rem;color:#eee1f1;font-size:1rem}
@media(max-width:650px){.match-summary .summary-grid{grid-template-columns:repeat(2,1fr)}.summary-courts{grid-template-columns:1fr}.victory-actions{flex-wrap:wrap}}

/* v0.27 Match Completion */
.match-summary{margin:1rem 0;padding:1rem;border:1px solid #583a62;border-radius:10px;background:#08060b;text-align:left;max-height:42vh;overflow:auto}.match-summary h3{text-align:center;margin:.1rem 0 1rem;color:#ecc668;letter-spacing:.12em;font:700 1rem Georgia,serif}.summary-courts{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin-bottom:.9rem}.summary-courts>div{padding:.65rem;border:1px solid #3d2945;border-radius:8px;background:#0d0911}.summary-courts>div>span{display:block;margin-bottom:.45rem;color:#bba9c0;font-size:.62rem;text-transform:uppercase;letter-spacing:.08em}.summary-suits{display:flex;gap:.4rem}.summary-suit{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;border:1px solid #57405e;font-size:1rem}.summary-suit.seated{color:#f0c968;border-color:#9e6c31;box-shadow:inset 0 0 12px #6f421f55}.summary-suit.missing{color:#4c414f;opacity:.55}.match-summary .summary-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.55rem}.match-summary .summary-grid>div{padding:.55rem;border:1px solid #34243a;border-radius:7px;background:#0d0911}.match-summary .summary-grid span{display:block;color:#9c8a9f;font-size:.54rem;text-transform:uppercase;line-height:1.2}.match-summary .summary-grid strong{display:block;margin-top:.22rem;color:#eee1f1;font-size:1rem}@media(max-width:650px){.match-summary .summary-grid{grid-template-columns:repeat(2,1fr)}.summary-courts{grid-template-columns:1fr}.victory-actions{flex-wrap:wrap}}

/* v0.28 Tutorial Rebuild */
.tutorial-chapter-copy{margin:-4px 0 10px;padding:9px 12px;border-left:2px solid rgba(239,200,91,.5);background:rgba(239,200,91,.035);color:#b9aebc;font-size:10px;line-height:1.45}
.tutorial-chapter{display:inline-flex;align-items:center;gap:7px}.tutorial-chapter small{display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:rgba(255,255,255,.06);font-size:8px;color:#9f91a3}.tutorial-chapter.active small{background:rgba(239,200,91,.14);color:#f1d16d}
.tutorial-concept,.tutorial-initiative-demo,.tutorial-resolution-demo,.tutorial-conversion-demo{min-width:300px;display:grid;justify-items:center;gap:5px;padding:7px 14px;border:1px solid rgba(213,173,79,.3);border-radius:8px;background:rgba(18,8,23,.8)}
.tutorial-concept span,.tutorial-initiative-demo span,.tutorial-resolution-demo span,.tutorial-conversion-demo span{font-size:7px;letter-spacing:.14em;color:#a392a7}.tutorial-concept strong{font:700 21px Georgia,serif;letter-spacing:.17em;color:#f1c96a}.tutorial-concept small,.tutorial-initiative-demo small,.tutorial-resolution-demo small,.tutorial-conversion-demo small{font-size:7px;letter-spacing:.08em;color:#ad9caf}
.tutorial-initiative-demo strong{font:700 12px Georgia,serif;color:#f0cd71}.tutorial-resolution-demo strong{font:700 10px Georgia,serif;color:#efca6b}.tutorial-conversion-demo{grid-template-columns:auto auto auto;align-items:center}.tutorial-conversion-demo span{grid-column:1}.tutorial-conversion-demo b{grid-column:2;color:#b46fd0}.tutorial-conversion-demo strong{grid-column:3;color:#efcf76;font:700 15px Georgia,serif}.tutorial-conversion-demo small{grid-column:1/-1}
.tutorial-sequence-demo{display:grid;grid-template-columns:auto repeat(8,auto);align-items:center;gap:6px;padding:8px 12px;border:1px solid rgba(145,92,159,.35);border-radius:8px;background:rgba(20,8,27,.82)}.tutorial-sequence-demo span{font-size:7px;letter-spacing:.12em;color:#a994ad;margin-right:3px}.tutorial-sequence-demo b{width:17px;height:17px;display:grid;place-items:center;border-radius:50%;background:#28162f;color:#c79bd1;font-size:7px}.tutorial-sequence-demo strong{font:700 9px Georgia,serif;color:#efcc72}.tutorial-sequence-demo.advanced strong{font-size:8px}
.tutorial-waiting-slots{display:grid;grid-template-columns:1fr 1fr;gap:8px;min-width:320px}.tutorial-waiting-slots div{display:grid;gap:4px;padding:8px;border:1px solid rgba(213,173,79,.32);border-radius:7px;background:rgba(25,12,30,.82)}.tutorial-waiting-slots span{font-size:7px;letter-spacing:.1em;color:#9d8ca2}.tutorial-waiting-slots strong{font:700 11px Georgia,serif;color:#efcd72}
@media(max-width:760px){.tutorial-concept,.tutorial-initiative-demo,.tutorial-resolution-demo,.tutorial-conversion-demo,.tutorial-waiting-slots{min-width:0;width:100%}.tutorial-sequence-demo{grid-template-columns:repeat(4,auto)}.tutorial-sequence-demo span{grid-column:1/-1}}


/* v0.29 Settings Functionality Audit */
.card-suit-label{display:none;font-size:clamp(6px,.46vw,9px);font-weight:800;letter-spacing:.08em;text-transform:uppercase;opacity:.72}
body.suit-labels .card-suit-label{display:block}
body[data-visual-effects="medium"] .panel,body[data-visual-effects="medium"] .card,body[data-visual-effects="medium"] button{box-shadow:0 5px 14px rgba(0,0,0,.2)!important}
body[data-visual-effects="medium"] .title-crest,body[data-visual-effects="medium"] .queen-marker{filter:saturate(.9) brightness(.95)}
body[data-visual-effects="low"] .panel,body[data-visual-effects="low"] .card,body[data-visual-effects="low"] button,body[data-visual-effects="low"] .queen-marker{box-shadow:none!important;text-shadow:none!important}
body[data-visual-effects="low"] .title-crest{opacity:.45;filter:none!important}
body[data-visual-effects="low"] *::before,body[data-visual-effects="low"] *::after{filter:none!important}
body.reduced-flashing .waiting-demo-queen,body.reduced-flashing .guard-shield,body.reduced-flashing .result-card.active{filter:none!important;animation-timing-function:linear!important}
body.reduced-flashing .result-card.active{box-shadow:inset 0 0 0 2px #fff8df,0 10px 20px rgba(0,0,0,.55),0 0 0 2px #8b5a9b!important}
body.reduced-flashing .waiting-demo-queen{animation:tutorial-waiting-hit-reduced .7s .35s both!important}
@keyframes tutorial-waiting-hit-reduced{0%,45%{transform:none;opacity:1}100%{transform:scale(.2);opacity:.08}}
.setting-deferred{opacity:.82}.setting-status{display:inline-flex;align-items:center;justify-content:center;padding:6px 10px;border:1px solid rgba(239,200,91,.28);border-radius:999px;color:#efcf77!important;font-size:.68rem!important;font-weight:900;letter-spacing:.12em;opacity:1!important}

body[data-card-text="large"] .team-slots .card .card-effect{font-size:7px!important}body[data-card-text="small"] .team-slots .card .card-effect{font-size:5px!important}.settings-note{margin:14px 0 0;color:var(--muted);font-size:.82rem;line-height:1.5}

/* v0.30 — one canonical action-card component across Hand, Sequence, Resolution and Tutorial. */
.tutorial-demo-card{display:grid!important;place-items:center!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important}
.tutorial-demo-card>.card.tutorial-action-card,.tutorial-demo-card>.tutorial-concept-card{width:82px!important;height:128px!important;min-width:82px!important;min-height:128px!important}
.tutorial-demo-card>.card.tutorial-action-card{transform:none!important;margin:0!important;padding:7px 6px!important}
.tutorial-demo-card>.card.tutorial-action-card .card-rank{font-size:18px!important}
.tutorial-demo-card>.card.tutorial-action-card .card-symbol{font-size:28px!important}
.tutorial-demo-card>.card.tutorial-action-card .card-name{display:block!important;font-size:8px!important;white-space:normal!important;text-align:center!important;line-height:1.05!important}
.tutorial-demo-card>.card.tutorial-action-card .card-effect{display:block!important;font-size:7px!important;line-height:1.2!important;text-align:center!important;overflow:visible!important}
.tutorial-concept-card{border:2px solid #d0a04a;border-radius:7px;background:linear-gradient(145deg,#fff9e8,#ead9b1);color:#2c1b17;position:relative;display:grid;grid-template-rows:22px 32px 19px 1fr;align-items:center;text-align:center;padding:4px 5px;box-shadow:0 9px 18px #000a}
.tutorial-demo-card.is-playing>.card,.tutorial-demo-card.is-playing>.tutorial-concept-card{transform:translate(78px,-10px) scale(1.08)!important;box-shadow:0 18px 28px #000b,0 0 0 2px #d19d47,0 0 25px #c051db62!important;filter:saturate(1.12)}
.tutorial-demo-card.is-resolved>.card,.tutorial-demo-card.is-resolved>.tutorial-concept-card{box-shadow:0 8px 16px #0009,0 0 0 1px #8c6739!important}

/* v0.33 Local Multiplayer Polish */
.local-privacy-note{display:flex;align-items:center;justify-content:center;gap:11px;max-width:680px;margin:-7px auto 18px;padding:11px 14px;border:1px solid rgba(239,200,91,.24);border-radius:12px;background:rgba(44,25,58,.42)}
.local-privacy-note .privacy-lock{color:#efcf77;font-size:.82rem}.local-privacy-note>div{display:flex;gap:8px;align-items:baseline;flex-wrap:wrap}.local-privacy-note strong{font-size:.78rem;letter-spacing:.08em;color:#f0d57e}.local-privacy-note span{font-size:.76rem;opacity:.76}
.pass-card{position:relative;overflow:hidden;padding:34px 38px 38px!important;border-color:rgba(239,200,91,.34)!important;background:radial-gradient(circle at 50% 0,rgba(105,53,131,.24),transparent 45%),linear-gradient(180deg,rgba(18,10,28,.98),rgba(8,5,13,.98))!important}
.pass-card::before{content:"";position:absolute;inset:8px;border:1px solid rgba(239,200,91,.11);border-radius:14px;pointer-events:none}
.pass-lock{width:54px;height:54px;margin:0 auto 12px;border:1px solid rgba(239,200,91,.45);border-radius:50%;display:grid;place-items:center;color:#f0d16e;font:700 27px Georgia,serif;box-shadow:0 0 24px rgba(139,73,173,.22)}
.pass-position{display:block;font-size:.67rem;letter-spacing:.16em;opacity:.6;margin:2px 0 8px}.pass-card h2{font-size:2.45rem!important;margin:.2rem 0 .55rem!important}
.pass-badges{display:flex;justify-content:center;gap:7px;flex-wrap:wrap;margin-bottom:18px}.pass-badges span{padding:5px 9px;border:1px solid rgba(239,200,91,.25);border-radius:999px;background:rgba(255,255,255,.035);font-size:.65rem;letter-spacing:.08em;text-transform:uppercase;color:#dccfdd}
.pass-privacy-copy{display:grid;gap:4px;max-width:430px;margin:0 auto 24px;padding:11px 14px;border:1px solid rgba(139,84,167,.28);border-radius:10px;background:rgba(71,34,86,.22)}.pass-privacy-copy strong{font-size:.69rem;letter-spacing:.13em;color:#efcf77}.pass-privacy-copy span{font-size:.74rem;opacity:.68}
.pass-card #pass-ready-button{min-width:230px;margin:0 auto}
@media(max-width:640px){.pass-card{padding:28px 22px 30px!important}.pass-card h2{font-size:2rem!important}.local-privacy-note>div{display:grid;gap:2px}}

/* v0.34 Match Setup Polish + mobile-ready setup surfaces */
.setup-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0 0 18px}
.setup-summary>div{display:grid;gap:4px;padding:11px 13px;border:1px solid rgba(239,200,91,.16);border-radius:11px;background:rgba(255,255,255,.025)}
.setup-summary span,.online-format-banner span,.online-panel-heading>span{font-size:.65rem;letter-spacing:.14em;color:#efcf77}
.setup-summary strong{font-size:.9rem}
.setup-player-slot header>span{display:grid;gap:3px}
.setup-player-slot header>span small{font-size:.58rem;letter-spacing:.09em;opacity:.55;font-weight:700}
.seed-control>span{display:flex;gap:8px;align-items:center}.seed-control>span input{min-width:120px}.seed-control button{white-space:nowrap;padding:8px 11px}
.setup-validation{margin:12px 0 0;padding:10px 12px;border:1px solid rgba(255,125,142,.42);border-radius:10px;background:rgba(91,20,32,.24);color:#ffd5dc;font-size:.8rem;text-align:center}
#enter-match-button:disabled{opacity:.45;cursor:not-allowed;filter:saturate(.55)}
.online-format-banner{display:grid;grid-template-columns:auto auto 1fr;align-items:center;gap:10px 16px;margin-bottom:18px;padding:13px 16px;border:1px solid rgba(239,200,91,.18);border-radius:13px;background:rgba(17,9,26,.54)}
.online-format-banner strong{color:#f2d680}.online-format-banner small{justify-self:end;opacity:.63;text-align:right}
.online-panel-heading{display:flex;align-items:center;gap:10px}.online-panel-heading h3{margin:0}.online-setup-panel>p{margin:0 0 5px;opacity:.68;line-height:1.45;font-size:.84rem}
.setup-player-slot input,.setup-player-slot select,.online-setup-panel input,.online-setup-panel select,.compact-reconnect input,.seed-control input{min-height:44px}
.mode-choice,.setup-player-slot button,.online-setup-panel button,.seed-control button,#enter-match-button{touch-action:manipulation}
@media(max-width:800px){
  .match-setup-card{width:min(100%,96vw);padding:18px}
  .setup-header{align-items:stretch}.setup-header>button{min-height:44px}
  .setup-summary{grid-template-columns:1fr 1fr}
  .online-format-banner{grid-template-columns:1fr auto}.online-format-banner small{grid-column:1/-1;justify-self:start;text-align:left}
  .setup-team{padding:14px}.setup-versus{padding:2px 0}
  .match-setup-card #enter-match-button{width:100%;min-height:50px}
  .online-setup-panel button,.compact-reconnect button{min-height:48px}
}
@media(max-width:520px){
  .setup-header{flex-direction:column;gap:12px}.setup-header>button{width:100%}
  .setup-summary{grid-template-columns:1fr 1fr;gap:7px}.setup-summary>div{padding:9px}
  .terms-strip{margin:14px 0}.terms-strip>div{align-items:flex-start}.terms-strip label{display:grid;width:100%;gap:7px}.seed-control>span{display:grid;grid-template-columns:1fr auto;width:100%}.seed-control input{width:100%!important;min-width:0}
  .setup-player-slot header{align-items:flex-start;flex-direction:column}.setup-player-slot header select{width:100%}
  .online-format-banner{grid-template-columns:1fr}.online-format-banner small{grid-column:auto}.online-format-banner strong{justify-self:start}
  .setup-player-slot input,.setup-player-slot select,.online-setup-panel input,.online-setup-panel select,.compact-reconnect input,.seed-control input{font-size:16px}
}

/* v0.35 Audio Foundation */
.volume-control{display:flex;align-items:center;gap:.7rem;min-width:230px}.volume-control input[type="range"]{width:170px;accent-color:var(--gold)}.volume-control output{min-width:3.2rem;text-align:right;color:var(--gold);font-variant-numeric:tabular-nums}.audio-volume-row>div span{max-width:58ch}@media(max-width:700px){.audio-volume-row{align-items:stretch}.volume-control{width:100%;min-width:0}.volume-control input[type="range"]{flex:1;min-height:44px}}

/* v0.36 Accessibility & Display */
.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}
.skip-link{position:fixed;z-index:1000;top:8px;left:8px;padding:10px 14px;border:2px solid #fff3bd;border-radius:8px;background:#09050d;color:#fff3bd;font-weight:900;transform:translateY(-160%)}
.skip-link:focus{transform:none}
:where(button,a,input,select,textarea,[tabindex]):focus-visible{outline:3px solid #fff3bd!important;outline-offset:3px!important;box-shadow:0 0 0 6px #542b78!important}
button.card{appearance:none;-webkit-appearance:none;text-align:inherit;font:inherit}
.hand .card:focus-visible{transform:translateY(-22px) rotate(0deg) scale(1.1)!important;z-index:55!important}
.card[aria-pressed="true"]{opacity:.55!important;filter:saturate(.7)!important;box-shadow:inset 0 0 0 3px #501a68,0 0 0 2px #f0ce70!important}
.card[aria-pressed="true"]::after{content:"SELECTED";position:absolute;z-index:5;right:2px;bottom:2px;padding:2px 3px;border-radius:3px;background:#2c1037;color:#fff7d0;font:900 6px/1 system-ui,sans-serif;letter-spacing:.06em}
.keyboard-tooltip{position:fixed!important;top:auto!important;right:auto!important;bottom:18px!important;left:50%!important;max-width:min(560px,calc(100vw - 32px))!important;transform:translateX(-50%);font-size:.9rem!important}
body.game-active #notice{display:block!important;position:fixed!important;z-index:95!important;top:54px!important;right:14px!important;max-width:min(430px,calc(100vw - 28px))!important;min-height:0!important;padding:7px 11px!important;border:1px solid #7c5b2e!important;border-radius:7px!important;background:rgba(8,4,11,.96)!important;color:#ffe4a1!important;text-align:left!important;pointer-events:none!important;box-shadow:0 8px 24px #000a!important}
body.game-active #notice.error{border-color:#ff8795!important;color:#ffe4e8!important}#notice:empty{visibility:hidden}
.accessibility-system-note{margin-top:0!important;padding:10px 12px;border:1px solid rgba(239,200,91,.22);border-radius:9px;background:rgba(239,200,91,.045)}
.settings-tabs button[aria-selected="true"],.tutorial-tab[aria-selected="true"]{border-color:#f0c85c!important;color:#fff0ad!important}
.setting-row select,.setting-row input[type="checkbox"],.setting-row input[type="range"]{accent-color:#d6a43d}
.setting-row input[type="checkbox"]{min-width:24px;min-height:24px}

body[data-card-text="small"] :is(.hand,.team-slots,.result-cards,.tutorial-demo-card) .card-effect{font-size:clamp(6px,.52vw,8px)!important}
body[data-card-text="medium"] :is(.hand,.team-slots,.result-cards,.tutorial-demo-card) .card-effect{font-size:clamp(7px,.62vw,10px)!important}
body[data-card-text="large"] :is(.hand,.team-slots,.result-cards,.tutorial-demo-card) .card-effect{font-size:clamp(9px,.76vw,13px)!important;line-height:1.18!important}
body[data-card-text="large"] .result-cards .card-name,body[data-card-text="large"] .tutorial-demo-card .card-name{font-size:clamp(8px,.65vw,11px)!important}
body[data-card-text="large"] .team-slots .card-effect{font-size:7px!important;line-height:1.05!important}
body.suit-labels .card-suit-label{display:block!important;color:currentColor!important;text-align:center}

body.high-contrast{--bg:#000;--panel:#080808;--panel2:#000;--gold:#ffd95a;--gold-soft:#d8ae28;--text:#fff;--muted:#ddd}
body.high-contrast,body.high-contrast .game-shell{background:#000!important;color:#fff!important}
body.high-contrast :is(.panel,.settings-card,.menu-card,.tutorial-stage,.edge-panel,.court-strip,.hand-center,.resource-card,.queue-duel){border-color:#ffd95a!important;background:#050505!important;filter:none!important}
body.high-contrast :is(button,input,select){border-color:#f5d866!important;color:#fff!important;background:#111!important}
body.high-contrast button.primary{background:#765000!important;color:#fff!important;border-color:#fff0a3!important}
body.high-contrast button:disabled{opacity:.65!important;border-style:dashed!important}
body.high-contrast .card{background:#fff!important;border:2px solid #111!important;filter:none!important;color:#000!important}
body.high-contrast .card:is(.hearts,.diamonds){color:#a00000!important}body.high-contrast .card.clubs{color:#004f23!important}body.high-contrast .card:is(.ace,.jack){color:#18205e!important}body.high-contrast .card.king{color:#653300!important}
body.high-contrast .card-suit-label{display:block!important;font-weight:900!important;opacity:1!important}
body.high-contrast :is(.queen-copy,.court-name,.queue-label,.hand-heading,.team-tag,.waiting-cluster,.resource-card>span,.resource-card>small,.resource-card>em){color:#fff!important;opacity:1!important}
body.high-contrast :is(.waiting-progress-pip,.waiting-position-empty,.confirmation,.ready-pill){border-color:#fff!important;color:#fff!important;background:#000!important}
body.high-contrast :is(.waiting-progress-pip.complete,.confirmation.ready,.ready-pill.ready){border-color:#ffe065!important;color:#ffe065!important}
body.high-contrast .result-card.active{outline:4px solid #ffe066!important;outline-offset:2px!important;opacity:1!important}
body.high-contrast .result-card.resolved{opacity:.62!important}

body.reduced-flashing *,body.reduced-flashing *::before,body.reduced-flashing *::after{animation:none!important}
body.reduced-glow :is(.panel,.card,.queen-marker,button,.victory-card,.resolution-card,.title-crest){box-shadow:none!important;text-shadow:none!important;filter:none!important}
body[data-visual-effects="low"] :is(.tutorial-effect-zone,.title-art)::before,body[data-visual-effects="low"] :is(.tutorial-effect-zone,.title-art)::after{display:none!important}
body.reduce-motion *,body.reduce-motion *::before,body.reduce-motion *::after{scroll-behavior:auto!important;animation:none!important;transition-duration:.001ms!important;transition-delay:0ms!important}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition-duration:.001ms!important;transition-delay:0ms!important}
}
@media(prefers-contrast:more){
  :root{--text:#fff;--muted:#ddd;--gold:#ffd95a;--gold-soft:#d8ae28}
  :is(button,input,select):focus-visible{outline-color:#fff!important}
}
@media(forced-colors:active){
  *{forced-color-adjust:auto}
  .card,.panel,.slot,.waiting-progress-pip{border:2px solid CanvasText!important}
  .card[aria-pressed="true"],.result-card.active{outline:4px solid Highlight!important;outline-offset:2px!important}
  .queen-marker{border:3px solid Highlight!important}
}
@media(max-width:700px){
  .settings-tabs{overflow-x:auto;justify-content:flex-start;scrollbar-width:thin}.settings-tabs button{flex:0 0 auto;min-height:44px}
  .settings-pane .setting-row{gap:12px}.settings-pane :is(button,input,select){min-height:44px}
  .keyboard-tooltip{bottom:10px!important}
}
.terms-strip .seed-control{display:grid;gap:7px;min-width:230px}.terms-strip .seed-control>label{font-size:.72rem;color:#cbbdd0}.terms-strip .seed-control>span{display:flex;gap:8px;align-items:center}
@media(max-width:650px){
  body.game-active{overflow:auto!important;place-items:start!important}
  body.game-active .shell{width:650px!important;max-width:none!important;margin-left:0!important;margin-right:0!important}
  #game-screen.game-shell{margin:0!important}
}
/* v0.36.5 — first online playtest hotfix */
.title-screen{padding:0!important;background:#050208!important;min-height:min(760px,calc(100vh - 110px))!important}
.title-full-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:13px;display:block}
.title-screen::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 62%,rgba(3,1,5,.78) 100%);pointer-events:none}
.title-enter,.title-secondary,.title-version{z-index:3!important;align-self:end!important}
.title-enter{position:absolute!important;left:7%!important;bottom:76px!important;margin:0!important;width:260px!important}
.title-secondary{position:absolute!important;left:calc(7% + 274px)!important;bottom:76px!important;margin:0!important;width:220px!important}
.title-version{position:absolute!important;left:7%!important;bottom:42px!important;margin:0!important;max-width:none!important}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
/* Each online player sees their own Court at the bottom and opponent at the top. */
#game-screen.perspective-ace .ace-court-strip{grid-row:6}
#game-screen.perspective-ace .court-and-resources{grid-row:1}
#game-screen.perspective-ace .waiting-row{flex-direction:row-reverse}
#game-screen.perspective-ace .hand-zone .left-resource{grid-column:3}
#game-screen.perspective-ace .hand-zone .right-resource{grid-column:1}
#game-screen.perspective-ace .hand-zone .hand-center{grid-column:2;grid-row:1}
.tutorial-practice{margin-top:10px;border:1px solid #5d3566;border-radius:10px;background:linear-gradient(180deg,#120817,#08040b);padding:12px}
.tutorial-practice-head{display:flex;justify-content:space-between;gap:16px;align-items:start}.tutorial-practice-head span,.tutorial-practice-label{color:#d0a552;font-size:8px;font-weight:800;letter-spacing:.14em}.tutorial-practice-head h3{margin:3px 0;color:#efd27c;font:700 18px Georgia,serif}.tutorial-practice-head p{margin:0;color:#a99daa;font-size:10px}
.tutorial-practice-state{display:flex;gap:8px;margin:10px 0}.tutorial-practice-state span{flex:1;border:1px solid #3e2b43;border-radius:6px;padding:7px;color:#9e91a0;font-size:8px}.tutorial-practice-state strong{display:block;color:#f0cb72;font-size:13px;margin-top:2px}
.tutorial-practice-hand{display:grid;grid-template-columns:repeat(8,1fr);gap:6px;margin:5px 0 10px}.tutorial-practice-card{min-height:82px;padding:5px;display:grid;grid-template-rows:auto 1fr auto;text-align:center;background:linear-gradient(145deg,#f7ecd2,#d7c49d);color:#21141b;border-color:#b78b3e}.tutorial-practice-card b{font:700 17px Georgia,serif;text-align:left}.tutorial-practice-card i{font:700 24px Georgia,serif;font-style:normal}.tutorial-practice-card small{font-size:6px;line-height:1.15}.tutorial-practice-card.hearts,.tutorial-practice-card.diamonds{color:#a82532}.tutorial-practice-card.clubs{color:#176044}.tutorial-practice-card.used{opacity:.3}
.tutorial-practice-sequence{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-top:5px}.tutorial-practice-slot{min-height:54px;border:1px dashed #644b68;border-radius:6px;background:#09050b;color:#746b77;display:grid;grid-template-columns:24px 1fr;align-items:center;padding:6px}.tutorial-practice-slot span{font-size:9px;color:#a485aa}.tutorial-practice-slot.filled{border-style:solid;border-color:#b48740;background:#171019;color:#e8cf8c}.tutorial-practice-slot b{font:700 17px Georgia,serif}.tutorial-practice-slot small{grid-column:2;font-size:7px;color:#a99daa}.tutorial-practice-actions{display:flex;gap:12px;align-items:center;margin-top:10px}.tutorial-practice-actions p{margin:0;color:#c3b5c5;font-size:9px;line-height:1.35}
@media(max-width:760px){.tutorial-practice-hand{grid-template-columns:repeat(4,1fr)}.tutorial-practice-state{flex-direction:column}.title-enter{left:5%!important;bottom:70px!important;width:43%!important}.title-secondary{left:52%!important;bottom:70px!important;width:43%!important}}

/* v0.36.6 Online QOL Hotfix: readability, discard, history, in-match menu, 3-slot Waiting */
html{font-size:17px}
.queue-label,.execution-order>span{font-size:clamp(12px,.82vw,15px)!important}
.hand-heading{font-size:clamp(14px,.9vw,17px)!important}
.court-name{font-size:clamp(12px,.78vw,15px)!important}
.queen-copy{font-size:clamp(13px,.82vw,16px)!important}
.confirmation,.ready-pill{font-size:clamp(11px,.7vw,14px)!important}
.queue-actions button,.royal-button,.mini-deck,.resource-card>span,.resource-card>small,.resource-card>em{font-size:clamp(11px,.7vw,14px)!important}
.resource-card .mini-deck span,.resource-card .mini-deck b{font-size:clamp(11px,.72vw,14px)!important}
.card-name{font-size:clamp(10px,.66vw,13px)!important;line-height:1.05!important;white-space:normal!important}
body[data-card-text="small"] :is(.hand,.team-slots,.result-cards,.tutorial-demo-card) .card-effect{font-size:clamp(10px,.65vw,12px)!important;line-height:1.16!important}
body[data-card-text="medium"] :is(.hand,.team-slots,.result-cards,.tutorial-demo-card) .card-effect{font-size:clamp(11px,.72vw,14px)!important;line-height:1.18!important}
body[data-card-text="large"] :is(.hand,.team-slots,.result-cards,.tutorial-demo-card) .card-effect{font-size:clamp(13px,.82vw,16px)!important;line-height:1.2!important}
body[data-card-text="xlarge"] :is(.hand,.team-slots,.result-cards,.tutorial-demo-card) .card-effect{font-size:clamp(15px,.95vw,18px)!important;line-height:1.22!important}

/* v0.37 Controller & Keyboard: deliberate game navigation and real input status */
.input-mode-chip{display:inline-flex;align-items:center;justify-content:center;min-height:25px;max-width:230px;padding:3px 9px;border:1px solid rgba(218,178,92,.32);border-radius:999px;background:rgba(17,8,24,.72);color:#cfb9d8;font-size:clamp(9px,.62vw,12px);line-height:1.15;text-align:center;white-space:nowrap}
body[data-input-mode="mouse"] .input-mode-chip,body[data-input-mode="touch"] .input-mode-chip{max-width:90px;color:#a89aae}
.controls-status-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:14px}
.controls-status-grid>div{display:grid;gap:4px;padding:12px 14px;border:1px solid rgba(223,181,82,.24);border-radius:10px;background:rgba(10,6,14,.7)}
.controls-status-grid span{color:#a996ae;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase}
.controls-status-grid strong{color:#f0cf77;font:700 1rem Georgia,serif}
.control-bindings{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:14px}
.control-bindings section{padding:14px;border:1px solid rgba(161,86,190,.32);border-radius:10px;background:linear-gradient(180deg,rgba(35,14,45,.62),rgba(8,5,12,.8))}
.control-bindings h3{margin:0 0 10px;color:#f0cf77;font:700 .9rem Georgia,serif;letter-spacing:.08em;text-transform:uppercase}
.control-bindings section>div{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:35px;border-top:1px solid rgba(255,255,255,.07);color:#ddd0df;font-size:.78rem}
.control-bindings section>div:first-of-type{border-top:0}
.control-bindings section>div span{margin-right:auto}
.control-bindings kbd{display:inline-flex;align-items:center;justify-content:center;min-width:28px;min-height:24px;padding:2px 7px;border:1px solid #79627e;border-bottom-width:3px;border-radius:5px;background:#120d17;color:#fff0bd;font:700 .68rem system-ui,sans-serif;white-space:nowrap}
.settings-note{color:#aa9caf;line-height:1.45}
.slot:focus-visible,[data-game-region="info"]:focus-visible{outline:3px solid #fff3bd!important;outline-offset:4px!important;box-shadow:0 0 0 7px #542b78,0 0 24px rgba(201,104,239,.65)!important}
.slot:focus-visible{border-color:#f4d67c!important}
[data-game-region="info"]:focus-visible{border-radius:8px}
body[data-input-mode="gamepad"] :where(button,a,input,select,textarea,.slot,[data-game-region="info"]):focus{outline:3px solid #fff3bd!important;outline-offset:4px!important;box-shadow:0 0 0 7px #542b78,0 0 24px rgba(201,104,239,.65)!important}
body[data-input-mode="gamepad"] .hand .card:focus{transform:translateY(-22px) rotate(0deg) scale(1.1)!important;z-index:55!important}
body.high-contrast .input-mode-chip,body.high-contrast .control-bindings section,body.high-contrast .controls-status-grid>div{border-color:#ffd95a!important;background:#050505!important;color:#fff!important}
body.high-contrast :is(.slot,[data-game-region="info"]):focus-visible{outline-color:#fff!important;box-shadow:0 0 0 7px #000!important}
body.reduced-glow :is(.slot,[data-game-region="info"]):focus-visible,body.reduced-glow[data-input-mode="gamepad"] :where(button,a,input,select,textarea,.slot,[data-game-region="info"]):focus{box-shadow:0 0 0 6px #542b78!important}
@media(max-width:900px){.input-mode-chip{display:none}.control-bindings{grid-template-columns:1fr}.controls-status-grid{grid-template-columns:1fr}}
body[data-card-text="xlarge"] :is(.card-name,.result-cards .card-name,.tutorial-demo-card .card-name){font-size:clamp(12px,.8vw,15px)!important}
.team-slots .card .card-effect{font-size:clamp(10px,.63vw,12px)!important;line-height:1.1!important}
body[data-card-text="large"] .team-slots .card .card-effect{font-size:clamp(11px,.7vw,14px)!important}
body[data-card-text="xlarge"] .team-slots .card .card-effect{font-size:clamp(12px,.76vw,15px)!important}

.waiting-queen{grid-template-columns:repeat(3,minmax(0,1fr))!important;min-width:280px!important}
.waiting-empty{grid-template-columns:repeat(3,1fr)!important}
.waiting-position-label,.waiting-position-empty b{font-size:9px!important}
.waiting-queen-entry strong{font-size:11px!important}
.waiting-queen-entry small,.waiting-position-empty i{font-size:9px!important;line-height:1.15!important}
.waiting-progress-pip{width:20px;height:20px;font-size:9px}
.waiting-cluster{min-width:0}
@media(max-width:900px){.waiting-queen{min-width:225px!important}.waiting-queen-entry strong{font-size:10px!important}.waiting-queen-entry small{display:block!important;font-size:8px!important}}

.discard-controls{position:absolute;top:27px;left:50%;z-index:12;display:flex;align-items:center;justify-content:center;gap:8px;transform:translateX(-50%);white-space:nowrap}
.discard-controls button{padding:5px 10px;font-size:12px}
.discard-controls span{font-size:11px;color:#c3b5c7}
.hand{height:calc(100% - 48px)!important}
.card.discard-selected{opacity:1!important;filter:none!important;outline:3px solid #d77a86!important;outline-offset:2px!important;box-shadow:0 0 0 3px rgba(89,13,25,.6),0 0 18px rgba(231,103,123,.5)!important}
.card.discard-selected::after{content:"DISCARD"!important;background:#7b1e2c!important;color:#fff!important}

.match-menu-overlay,.history-overlay{position:fixed;inset:0;z-index:85;display:grid;place-items:center;padding:20px;background:rgba(2,2,5,.86);backdrop-filter:blur(7px)}
.match-menu-overlay.hidden,.history-overlay.hidden{display:none!important}
.match-menu-card{width:min(520px,94vw);padding:28px;border:1px solid rgba(235,197,92,.45);border-radius:16px;background:linear-gradient(180deg,#130b18,#07050a);box-shadow:0 22px 70px #000c;text-align:center}
.match-menu-card h2{margin:.2rem 0 1rem;color:#f0ca67;font:700 clamp(1.5rem,3vw,2rem) Georgia,serif}
.match-menu-card p{font-size:1rem;line-height:1.55;color:#d9cddd}
.match-menu-actions{display:grid;gap:10px}.match-menu-actions.horizontal{grid-template-columns:1fr 1fr}
.match-menu-actions button{min-height:48px;font-size:1rem}
button.danger{border-color:#a74c59!important;background:#43141c!important;color:#ffe3e7!important}

.history-card{width:min(1120px,96vw);height:min(780px,94vh);padding:22px;overflow:hidden;border:1px solid rgba(235,197,92,.42);border-radius:16px;background:linear-gradient(180deg,#100915,#060408);display:grid;grid-template-rows:auto auto 1fr;gap:14px}
.history-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}.history-heading h2{margin:.2rem 0;color:#f0ca67;font:700 clamp(1.45rem,2.6vw,2rem) Georgia,serif}
.history-round-tabs{display:flex;gap:8px;overflow-x:auto;padding-bottom:3px}.history-round-tabs button{white-space:nowrap;font-size:.9rem}.history-round-tabs button.active{border-color:#f0c95f;color:#ffe9a3;background:#312317}
.history-content{min-height:0;overflow:auto;padding-right:5px}.history-summary{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:12px}.history-summary span{padding:9px 12px;border:1px solid #47394a;border-radius:9px;background:#0d0911;font-size:.83rem;letter-spacing:.06em}.history-summary strong{color:#f0cf77}
.history-sequences{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px}.history-sequences>div{padding:12px;border:1px solid #3b2c40;border-radius:10px;background:#0b080e}.history-sequences h3{margin:0 0 9px;font-size:1rem}.history-sequences span{display:inline-grid;place-items:center;min-width:48px;padding:7px 8px;margin:2px;border:1px solid #65526b;border-radius:6px;background:#f1e5d3;color:#20150e;font-weight:800}
.history-events{display:grid;gap:8px}.history-event{display:grid;grid-template-columns:38px minmax(150px,.7fr) minmax(120px,.6fr) 1.6fr;gap:10px;align-items:center;padding:10px 12px;border:1px solid #36283b;border-radius:9px;background:#0b080e}.history-event>b{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#2a1b30;color:#f0ca67}.history-event strong{font-size:.92rem}.history-event span{font-weight:800;color:#f0cf77}.history-event small{font-size:.86rem;line-height:1.35;color:#cdbfd0}.history-event.system{grid-template-columns:38px 220px 1fr}.history-event.system small{grid-column:3}
@media(max-width:760px){.history-card{height:96vh;padding:14px}.history-heading{align-items:flex-start;flex-direction:column}.history-sequences{grid-template-columns:1fr}.history-event,.history-event.system{grid-template-columns:34px 1fr}.history-event span,.history-event small,.history-event.system small{grid-column:2}.discard-controls{position:static;transform:none;margin:4px auto 0;flex-wrap:wrap}.hand{height:calc(100% - 72px)!important}.waiting-queen{min-width:0!important}}

/* ==================================================================
   v0.38 Mobile & Responsive I
   Touch-first responsive Match layout. This final layer intentionally
   overrides the legacy 650px square-canvas fallbacks from early builds.
   ================================================================== */
:root{
  --mobile-readable:clamp(.875rem,2.8vw,1rem);
  --mobile-control:48px;
}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{min-width:0}
.screen{max-width:100%}
:is(button,input,select){touch-action:manipulation}

@supports(height:100dvh){
  body.game-active .shell{min-height:100dvh!important;height:auto!important}
  #game-screen.game-shell{min-height:100dvh!important}
}

/* Tablet / narrow desktop: stop shrinking important text and controls. */
@media(max-width:1000px){
  .game-topbar .top-actions{gap:.4rem}
  .game-topbar :is(button,.input-mode-chip){min-height:42px}
  .queue-actions button,.discard-controls button{min-height:42px}
  .queue-label,.execution-order>span,.court-name,.queen-copy{font-size:clamp(.78rem,1.7vw,.96rem)!important}
  .resource-card>span,.resource-card>small,.resource-card>em,.resource-card .mini-deck span,.resource-card .mini-deck b{font-size:clamp(.72rem,1.5vw,.9rem)!important}
  .waiting-position-label,.waiting-position-empty b,.waiting-queen-entry small,.waiting-position-empty i{font-size:clamp(.66rem,1.35vw,.8rem)!important}
}

/* Phone portrait / compact browser window. No fixed 650px canvas. */
@media(max-width:760px){
  html,body{width:100%;max-width:100%;overflow-x:hidden!important}
  body.game-active{display:block!important;overflow-y:auto!important;overflow-x:hidden!important}
  body.game-active .shell{width:100%!important;max-width:100%!important;height:auto!important;min-height:100svh!important;margin:0!important}
  #game-screen.game-shell{
    width:100%!important;max-width:100%!important;height:auto!important;min-height:100svh!important;aspect-ratio:auto!important;
    overflow:visible!important;margin:0!important;
    padding:max(6px,env(safe-area-inset-top)) max(7px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(7px,env(safe-area-inset-left))!important;
  }

  .royal-topbar{
    position:sticky!important;top:0;z-index:60;
    width:100%!important;height:auto!important;min-height:58px!important;
    display:grid!important;grid-template-columns:minmax(0,1fr) auto auto!important;
    gap:6px!important;padding:7px 8px!important;
  }
  .royal-logo{font-size:clamp(.88rem,3.7vw,1.08rem)!important;min-width:0}
  .logo-crown{font-size:1.35rem!important}
  .hud-chip{min-width:0!important;padding:4px 7px!important}
  .initiative-chip{display:none!important}
  .royal-topbar>.top-actions{grid-column:1/-1;display:grid!important;grid-template-columns:1fr auto!important;width:100%;gap:7px!important}
  .royal-topbar #history-button{min-height:46px!important;font-size:.92rem!important}
  .royal-topbar #main-menu-button{width:50px!important;min-height:46px!important;font-size:1.25rem!important}
  .input-mode-chip,#lobby-code-small,#seed-label{display:none!important}

  .royal-board{
    width:100%!important;height:auto!important;min-height:0!important;margin:7px 0 0!important;padding:8px!important;
    display:flex!important;flex-direction:column!important;gap:10px!important;overflow:visible!important;
  }
  .royal-board::before{inset:4px!important}
  .ace-court-strip{order:1}.royal-edge{order:2}.queue-duel{order:3}.hand-zone{order:4}.court-and-resources{order:5}
  #game-screen.perspective-ace .ace-court-strip{order:5!important}
  #game-screen.perspective-ace .court-and-resources{order:1!important}

  .court-strip,.court-and-resources,.royal-edge,.queue-duel,.hand-zone{width:100%!important;max-width:100%!important;margin:0!important}
  .court-strip{height:auto!important;min-height:108px!important;padding:24px 7px 8px!important;display:block!important;overflow:hidden!important}
  .court-name{display:block!important;min-width:0!important;margin-bottom:6px;font-size:.82rem!important;text-align:center}
  .court-seats{width:100%!important;display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:5px!important}
  .queen-seat{
    width:100%!important;height:70px!important;min-width:0!important;
    display:grid!important;grid-template-columns:1fr!important;place-items:center!important;
    padding:34px 3px 4px!important;font-size:.7rem!important;overflow:hidden!important;
  }
  .queen-seat::before{left:50%!important;top:2px!important;bottom:auto!important;width:42px!important;height:36px!important;transform:translateX(-50%)!important;background-size:contain!important;background-position:center!important}
  .queen-seat .seat-orb{left:50%!important;top:20px!important;width:25px!important;height:25px!important;transform:translate(-50%,-50%)!important}
  .queen-seat .suit{font-size:15px!important}
  .queen-seat::after{font-size:.58rem!important;left:2px!important;right:2px!important;bottom:3px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

  .royal-edge{min-height:300px!important;padding:20px 10px 10px!important;overflow:hidden!important}
  .edge-title{font-size:.82rem!important}
  .edge-line-wrap{min-width:0!important}
  .track-numbers{font-size:.58rem!important}
  .queen-marker{width:54px!important;height:76px!important;margin-left:-27px!important}
  .queen-copy{top:54px!important;min-width:100px!important;font-size:.82rem!important}
  .waiting-row{
    position:static!important;left:auto!important;right:auto!important;bottom:auto!important;
    margin-top:78px!important;padding:0!important;width:100%!important;
    display:grid!important;grid-template-columns:1fr!important;gap:8px!important;
  }
  .waiting-cluster{width:100%!important;min-width:0!important;padding:6px!important}
  .waiting-cluster>span{font-size:.76rem!important}
  .waiting-queen{width:100%!important;min-width:0!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:5px!important}
  .waiting-queen-entry,.waiting-position-empty{min-width:0!important;min-height:66px!important;padding:5px 3px!important}
  .waiting-queen-entry strong{font-size:.75rem!important}.waiting-queen-entry small{font-size:.66rem!important}
  .waiting-progress-pip{width:22px!important;height:22px!important;font-size:.66rem!important}

  .queue-duel{
    min-height:0!important;height:auto!important;padding:10px 8px!important;
    display:grid!important;grid-template-columns:1fr!important;gap:10px!important;
  }
  .ace-queue-side{order:1}.execution-order{order:2}.human-queue-side{order:3}
  .queue-side{min-width:0!important;width:100%!important}
  .queue-label,.execution-order>span{font-size:.8rem!important}
  .opponent-queue,.team-slots{width:100%!important;height:auto!important;min-height:112px!important;display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:6px!important}
  .back-card,.slot,.team-slots .slot{width:100%!important;height:112px!important;min-height:112px!important}
  .human-queue-row{display:grid!important;grid-template-columns:1fr!important;gap:8px!important}
  .queue-actions-inline{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px!important;width:100%!important}
  .queue-actions-inline .confirmations{grid-column:1/-1;justify-content:center!important}
  .queue-actions-inline button{width:100%!important;min-height:46px!important;font-size:.86rem!important}
  .execution-order{min-height:54px!important;display:flex!important;flex-direction:column!important;justify-content:center!important}
  .execution-initiative{min-width:0!important;width:min(240px,100%)!important}

  .hand-zone{
    height:auto!important;min-height:0!important;padding:8px!important;
    display:grid!important;grid-template-columns:1fr 1fr!important;grid-template-rows:auto auto!important;gap:8px!important;
  }
  .hand-center{grid-column:1/-1!important;grid-row:1!important;min-height:236px!important;height:auto!important;padding:8px 0 6px!important;overflow:hidden!important}
  .left-resource{grid-column:1!important;grid-row:2!important}.right-resource{grid-column:2!important;grid-row:2!important}
  #game-screen.perspective-ace .hand-zone .left-resource{grid-column:2!important;grid-row:2!important}
  #game-screen.perspective-ace .hand-zone .right-resource{grid-column:1!important;grid-row:2!important}
  #game-screen.perspective-ace .hand-zone .hand-center{grid-column:1/-1!important;grid-row:1!important}
  .resource-card{width:100%!important;min-width:0!important;min-height:128px!important;padding:9px!important}
  .resource-card>span{font-size:.78rem!important;line-height:1.15!important}.resource-card>small,.resource-card>em{font-size:.72rem!important}
  .resource-card>strong{font-size:1.55rem!important}
  .mini-deck{padding:6px!important}.resource-card .mini-deck :is(span,b){font-size:.74rem!important}
  .hand-heading{position:static!important;min-height:24px!important;padding:0 8px;font-size:.9rem!important}
  .discard-controls{position:static!important;transform:none!important;width:100%!important;margin:5px 0 6px!important;padding:0 8px!important;display:grid!important;grid-template-columns:1fr 1fr!important;white-space:normal!important}
  .discard-controls span{grid-column:1/-1;text-align:center;font-size:.76rem!important}.discard-controls button{min-height:44px!important;font-size:.8rem!important}
  .hand{
    position:relative!important;left:auto!important;right:auto!important;bottom:auto!important;
    width:100%!important;height:142px!important;min-height:142px!important;
    display:flex!important;justify-content:flex-start!important;align-items:stretch!important;
    gap:7px!important;margin:0!important;padding:6px 12px 12px!important;
    overflow-x:auto!important;overflow-y:hidden!important;overscroll-behavior-x:contain;scroll-snap-type:x proximity;
    scrollbar-width:thin;-webkit-overflow-scrolling:touch;
  }
  .hand .card{
    flex:0 0 88px!important;width:88px!important;max-width:88px!important;height:124px!important;min-height:124px!important;
    margin:0!important;padding:6px!important;transform:none!important;transform-origin:center!important;scroll-snap-align:center;
  }
  .hand .card:hover,.hand .card:focus{transform:translateY(-3px)!important}
  .hand .card-rank{font-size:1.05rem!important}.hand .card-symbol{font-size:1.45rem!important}
  .hand .card-name{font-size:.68rem!important}.hand .card-effect{font-size:.67rem!important;line-height:1.12!important}
  body[data-card-text="large"] .hand .card-effect{font-size:.72rem!important}
  body[data-card-text="xlarge"] .hand .card-effect{font-size:.78rem!important}
  .teammate-hand-wrap{padding:5px 8px}.teammate-hand{overflow-x:auto;justify-content:flex-start;max-height:none}

  .card-powers-strip{overflow-x:auto!important}.card-powers-strip>div{min-width:150px!important}

  .match-menu-overlay,.history-overlay,.resolution-overlay,.victory-overlay{padding:max(10px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left))!important;overflow-y:auto!important;place-items:start center!important}
  .match-menu-card{width:100%!important;max-width:520px!important;padding:20px 14px!important;margin:auto 0!important}
  .match-menu-actions button{min-height:52px!important}
  .history-card{width:100%!important;height:auto!important;min-height:min(92svh,720px)!important;max-height:none!important;padding:14px!important}
  .history-heading{flex-direction:row!important;align-items:center!important}.history-heading button{min-height:46px!important}
  .history-round-tabs button{min-height:44px!important;font-size:.84rem!important}
  .history-event,.history-event.system{grid-template-columns:32px minmax(0,1fr)!important;padding:9px!important}.history-event :is(span,small),.history-event.system small{grid-column:2!important}

  .resolution-card{width:100%!important;max-width:100%!important;height:auto!important;max-height:none!important;overflow:visible!important;padding:12px!important}
  .resolution-heading{gap:8px!important}.resolution-heading h2{font-size:1.45rem!important}
  .resolution-grid{display:flex!important;flex-direction:column!important;gap:10px!important}
  .resolution-focus{order:1!important}.resolution-team.ace-team{order:2!important}.resolution-team.human-team{order:3!important}
  .result-queen-stage{grid-template-columns:1fr!important;gap:7px!important}.result-queen-stage .waiting-slot{min-height:90px!important}
  .result-cards{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:5px!important;min-height:118px!important}
  .result-cards .card{min-width:0!important;height:116px!important;padding:5px!important}.result-cards .card-effect{font-size:.62rem!important}
  .resolution-controls{position:sticky!important;bottom:0!important;z-index:5;display:grid!important;grid-template-columns:1fr 1fr!important;gap:7px!important;padding:8px 0 max(4px,env(safe-area-inset-bottom))!important;background:linear-gradient(180deg,transparent,#08040c 20%)!important}
  .resolution-controls button{min-height:48px!important;font-size:.86rem!important}

  .victory-card{width:100%!important;max-width:560px!important;max-height:none!important;margin:auto 0!important;padding:18px 12px!important;overflow:visible!important}
  .victory-stats,.summary-grid{grid-template-columns:1fr 1fr!important}.victory-actions{display:grid!important;grid-template-columns:1fr!important;gap:8px!important}.victory-actions button{min-height:50px!important}

  .match-setup-card,.menu-card,.settings-full{width:100%!important;max-width:100%!important;padding:14px!important}
  .setup-header{align-items:flex-start!important}.setup-header h2{font-size:1.65rem!important}
  .setup-team-grid,.online-choice-grid,.mode-choice-grid{grid-template-columns:1fr!important}
  .setup-player-slot,.online-setup-panel{padding:13px!important}
  .setup-player-slot label,.online-setup-panel label{font-size:.86rem!important}
  .setup-player-slot :is(input,select),.online-setup-panel :is(input,select),.terms-strip :is(input,button){min-height:48px!important;font-size:1rem!important}
  .terms-strip{flex-direction:column!important;align-items:stretch!important;gap:12px!important}.terms-strip .seed-control{min-width:0!important}.terms-strip .seed-control>span{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important}

  .title-screen{min-height:100svh!important;border-radius:0!important}.title-full-art{object-position:center!important;border-radius:0!important}
  .title-enter,.title-secondary{bottom:max(78px,calc(env(safe-area-inset-bottom) + 64px))!important;min-height:50px!important;font-size:.88rem!important}
  .title-version{bottom:max(36px,calc(env(safe-area-inset-bottom) + 26px))!important;font-size:.72rem!important}
}

/* Very narrow phones: protect content from crowding without horizontal page scroll. */
@media(max-width:390px){
  .royal-topbar{grid-template-columns:minmax(0,1fr) auto!important}.royal-topbar .hud-chip.initiative-chip{display:none!important}.royal-logo small{display:none}
  .court-seats{gap:3px!important}.queen-seat{height:66px!important}.queen-seat::after{font-size:.52rem!important}
  .track-numbers span:nth-child(even){visibility:hidden}
  .queue-actions-inline{grid-template-columns:1fr!important}.queue-actions-inline .confirmations{grid-column:1!important}
  .hand .card{flex-basis:84px!important;width:84px!important;max-width:84px!important}
  .history-heading{align-items:flex-start!important;flex-direction:column!important}
  .victory-stats,.summary-grid{grid-template-columns:1fr!important}
}

/* Landscape phones: use the extra horizontal room while preserving touch targets. */
@media(max-height:520px) and (orientation:landscape){
  #game-screen.game-shell{min-height:100dvh!important}
  .royal-topbar{position:sticky!important;min-height:48px!important;grid-template-columns:minmax(150px,1fr) auto auto auto!important}
  .royal-topbar>.top-actions{grid-column:auto!important;display:flex!important;width:auto!important}.initiative-chip{display:flex!important}
  .royal-board{padding:7px!important}
  .hand-center{min-height:208px!important}.hand{height:124px!important}.hand .card{height:110px!important;min-height:110px!important}
}

/* Coarse pointers receive comfortable hit areas even on larger tablets. */
@media(pointer:coarse){
  :is(button,input,select){min-height:44px}
  #game-screen :is(button,input,select){min-height:var(--mobile-control)}
  .card[draggable=true]{cursor:pointer}
  .hand .card{touch-action:pan-x}
}

/* ==================================================================
   v0.39 Visual + Mobile Polish — landscape-first phone Match
   Portrait remains a supported fallback, but the primary touch table
   uses the phone's horizontal space to preserve the left/right battle.
   ================================================================== */
@media (orientation:landscape) and (max-height:600px) and (pointer:coarse){
  html,body{width:100%;height:100%;overflow:hidden!important}
  body.game-active{overflow:hidden!important}
  body.game-active .shell,#game-screen.game-shell{width:100vw!important;max-width:100vw!important;height:100dvh!important;min-height:100dvh!important;overflow:hidden!important}
  #game-screen.game-shell{padding:max(4px,env(safe-area-inset-top)) max(6px,env(safe-area-inset-right)) max(4px,env(safe-area-inset-bottom)) max(6px,env(safe-area-inset-left))!important}

  .royal-topbar{position:relative!important;height:44px!important;min-height:44px!important;display:grid!important;grid-template-columns:minmax(150px,1fr) auto auto auto!important;gap:5px!important;padding:4px 7px!important}
  .royal-logo{font-size:clamp(.78rem,2.2vw,.98rem)!important}.logo-crown{font-size:1.05rem!important}
  .hud-chip{min-height:34px!important;padding:3px 6px!important;font-size:.72rem!important}.initiative-chip{display:flex!important}
  .royal-topbar>.top-actions{grid-column:auto!important;display:flex!important;width:auto!important;gap:5px!important}
  .royal-topbar :is(#history-button,#main-menu-button){min-height:36px!important;height:36px!important;padding:4px 9px!important}
  .royal-topbar #main-menu-button{width:42px!important}

  .royal-board{height:calc(100dvh - 52px)!important;min-height:0!important;display:grid!important;grid-template-columns:minmax(118px,16%) minmax(0,1fr) minmax(118px,16%)!important;grid-template-rows:minmax(112px,1fr) minmax(126px,1.08fr)!important;gap:6px!important;padding:6px!important;margin:4px 0 0!important;overflow:hidden!important}
  .ace-court-strip{grid-column:1!important;grid-row:1/3!important;order:initial!important}
  .court-and-resources{grid-column:3!important;grid-row:1/3!important;order:initial!important}
  #game-screen.perspective-ace .ace-court-strip{grid-column:3!important;grid-row:1/3!important;order:initial!important}
  #game-screen.perspective-ace .court-and-resources{grid-column:1!important;grid-row:1/3!important;order:initial!important}
  .royal-edge{grid-column:2!important;grid-row:1!important;order:initial!important}
  .queue-duel{grid-column:2!important;grid-row:2!important;order:initial!important}
  .hand-zone{grid-column:1/4!important;grid-row:3!important;order:initial!important}

  .court-strip,.court-and-resources{height:100%!important;min-height:0!important;padding:25px 5px 5px!important;overflow:hidden!important}
  .court-name{margin-bottom:4px!important;font-size:.7rem!important}
  .court-seats{grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-template-rows:repeat(2,minmax(0,1fr))!important;gap:4px!important;height:calc(100% - 20px)!important}
  .queen-seat{height:100%!important;min-height:0!important;padding:30px 2px 3px!important}.queen-seat::before{width:34px!important;height:30px!important}.queen-seat .seat-orb{width:22px!important;height:22px!important}.queen-seat::after{font-size:.5rem!important}

  .royal-edge{height:100%!important;min-height:0!important;padding:17px 8px 6px!important;overflow:hidden!important}
  .edge-title{font-size:.68rem!important}.track{height:38px!important}.track-numbers{font-size:.52rem!important}.queen-marker{width:40px!important;height:57px!important;margin-left:-20px!important}.queen-copy{top:40px!important;font-size:.66rem!important;min-width:84px!important}
  .waiting-row{position:absolute!important;left:7px!important;right:7px!important;bottom:5px!important;margin:0!important;display:grid!important;grid-template-columns:1fr 1fr!important;gap:6px!important;width:auto!important}
  .waiting-cluster{padding:4px!important}.waiting-cluster>span{font-size:.58rem!important}.waiting-queen{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:3px!important}.waiting-queen-entry,.waiting-position-empty{min-height:48px!important;padding:3px 2px!important}.waiting-queen-entry strong{font-size:.58rem!important}.waiting-queen-entry small{font-size:.5rem!important}.waiting-progress-pip{width:17px!important;height:17px!important;font-size:.5rem!important}

  .queue-duel{height:100%!important;min-height:0!important;padding:5px 6px!important;display:grid!important;grid-template-columns:minmax(0,1fr) 88px minmax(0,1fr)!important;gap:5px!important;overflow:hidden!important}
  .ace-queue-side{order:1!important}.execution-order{order:2!important}.human-queue-side{order:3!important}
  .queue-label,.execution-order>span{font-size:.62rem!important}.opponent-queue,.team-slots{height:82px!important;min-height:82px!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:3px!important}.back-card,.slot,.team-slots .slot{height:82px!important;min-height:82px!important}.human-queue-row{grid-template-columns:minmax(0,1fr)!important;gap:3px!important}.queue-actions-inline{grid-template-columns:1fr 1fr!important;gap:3px!important}.queue-actions-inline button{min-height:32px!important;height:32px!important;padding:2px 5px!important;font-size:.62rem!important}.queue-actions-inline .confirmations{font-size:.54rem!important}.execution-order{min-height:0!important}.execution-initiative{width:100%!important;font-size:.58rem!important}

  /* Hand is a bottom drawer in landscape so the board keeps its tabletop proportions. */
  .hand-zone{position:fixed!important;z-index:45!important;left:max(6px,env(safe-area-inset-left))!important;right:max(6px,env(safe-area-inset-right))!important;bottom:max(4px,env(safe-area-inset-bottom))!important;width:auto!important;height:116px!important;min-height:116px!important;padding:4px 6px!important;display:grid!important;grid-template-columns:105px minmax(0,1fr) 105px!important;grid-template-rows:1fr!important;gap:5px!important;background:linear-gradient(180deg,rgba(10,5,13,.94),rgba(5,2,8,.99))!important;box-shadow:0 -8px 24px rgba(0,0,0,.48)!important}
  .hand-center{grid-column:2!important;grid-row:1!important;min-height:0!important;height:108px!important;padding:1px 0!important;overflow:hidden!important}.left-resource{grid-column:1!important;grid-row:1!important}.right-resource{grid-column:3!important;grid-row:1!important}
  #game-screen.perspective-ace .hand-zone .left-resource{grid-column:3!important;grid-row:1!important}#game-screen.perspective-ace .hand-zone .right-resource{grid-column:1!important;grid-row:1!important}#game-screen.perspective-ace .hand-zone .hand-center{grid-column:2!important;grid-row:1!important}
  .resource-card{height:106px!important;min-height:106px!important;padding:5px!important}.resource-card>span{font-size:.58rem!important}.resource-card>small,.resource-card>em{font-size:.52rem!important}.resource-card>strong{font-size:1.15rem!important}.mini-deck{padding:3px!important}.resource-card .mini-deck :is(span,b){font-size:.5rem!important}
  .hand-heading{position:absolute!important;top:1px!important;left:8px!important;z-index:2;font-size:.58rem!important;min-height:0!important}.discard-controls{position:absolute!important;top:0!important;right:4px!important;width:auto!important;margin:0!important;padding:0!important;display:flex!important;gap:3px!important}.discard-controls span{display:none!important}.discard-controls button{min-height:28px!important;height:28px!important;padding:2px 6px!important;font-size:.55rem!important}
  .hand{height:104px!important;min-height:104px!important;padding:15px 4px 3px!important;gap:4px!important;overflow-x:auto!important}.hand .card{flex:0 0 67px!important;width:67px!important;max-width:67px!important;height:86px!important;min-height:86px!important;padding:3px!important}.hand .card-rank{font-size:.82rem!important}.hand .card-symbol{font-size:1rem!important}.hand .card-name{font-size:.5rem!important}.hand .card-effect{font-size:.5rem!important;line-height:1.05!important}

  /* Reserve the drawer height so board controls are never hidden behind it. */
  .royal-board{padding-bottom:120px!important}
  .match-menu-overlay,.history-overlay,.resolution-overlay,.victory-overlay{z-index:100!important}
  .history-card,.resolution-card,.victory-card,.match-menu-card{max-height:calc(100dvh - 16px)!important;overflow:auto!important}
}

/* Portrait is supported, but gently tells touch users that landscape is the designed Match view. */
@media (orientation:portrait) and (max-width:760px) and (pointer:coarse){
  #game-screen.game-shell::after{content:"Best played in landscape";position:fixed;z-index:70;right:max(8px,env(safe-area-inset-right));bottom:max(8px,env(safe-area-inset-bottom));padding:7px 10px;border:1px solid #7d5a2c;border-radius:999px;background:rgba(10,5,13,.92);color:#e8c66c;font:700 .72rem/1.1 system-ui,sans-serif;letter-spacing:.03em;pointer-events:none;box-shadow:0 4px 18px rgba(0,0,0,.4)}
}

/* ================================================================
   v0.39.1 Installable Mobile / PWA Foundation
   ================================================================ */
.pwa-update-banner{
  position:fixed;
  z-index:10000;
  left:max(12px,env(safe-area-inset-left));
  right:max(12px,env(safe-area-inset-right));
  bottom:max(12px,env(safe-area-inset-bottom));
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.75rem;
  width:min(680px,calc(100% - 24px));
  margin-inline:auto;
  padding:.8rem 1rem;
  border:1px solid rgba(239,200,91,.62);
  border-radius:14px;
  background:rgba(16,6,24,.97);
  box-shadow:0 16px 48px rgba(0,0,0,.48);
}
.pwa-update-banner.hidden{display:none!important}
.pwa-update-banner>span{display:grid;gap:.12rem;min-width:0;flex:1}
.pwa-update-banner strong{font-size:clamp(1rem,2.2vw,1.12rem)}
.pwa-update-banner small{font-size:clamp(.85rem,2vw,.98rem);opacity:.86}
.pwa-update-banner button{min-height:44px;white-space:nowrap}
@media(max-width:560px){
  .pwa-update-banner{flex-wrap:wrap;justify-content:flex-end}
  .pwa-update-banner>span{flex-basis:100%}
}

/* v0.41 save recovery status */
.save-recovery-status { margin: 0 0 1rem; padding: .8rem 1rem; border: 1px solid rgba(196,153,255,.5); border-radius: .75rem; background: rgba(76,35,105,.35); font-size: clamp(.9rem,1.6vw,1rem); line-height: 1.4; }
.save-recovery-status.error { border-color: rgba(255,120,120,.65); background: rgba(100,25,35,.4); }

/* v0.45 Reconnect & Disconnect */
.connection-chip{display:inline-flex;align-items:center;min-height:32px;padding:.35rem .65rem;border:1px solid rgba(120,205,145,.45);border-radius:999px;background:rgba(34,91,52,.22);font-size:.72rem;font-weight:800;letter-spacing:.08em;white-space:nowrap}
.connection-chip[data-connection-state="reconnecting"]{border-color:rgba(220,176,94,.65);background:rgba(113,78,24,.28)}
.connection-chip[data-connection-state="disconnected"],.connection-chip[data-connection-state="left"]{border-color:rgba(222,105,99,.7);background:rgba(108,38,34,.3)}
.seat[data-connection-state="reconnecting"]{outline:1px solid rgba(220,176,94,.45)}
.seat[data-connection-state="disconnected"],.seat[data-connection-state="left"]{outline:1px solid rgba(222,105,99,.45);opacity:.82}

/* v0.46 Server Authority & Validation */
.online-security-note{display:grid;gap:.18rem;padding:.75rem .85rem;border:1px solid rgba(120,205,145,.4);border-radius:.7rem;background:rgba(34,91,52,.16)}
.online-security-note strong{font-size:.9rem;letter-spacing:.03em}
.online-security-note span{font-size:.82rem;line-height:1.35;opacity:.84}


/* v0.47 Match Records & Statistics */
.records-card{width:min(980px,94vw);max-height:90vh;overflow:auto}.records-stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.75rem;margin:1rem 0 1.25rem}.record-stat,.record-row{border:1px solid rgba(255,255,255,.16);border-radius:12px;background:rgba(0,0,0,.22);padding:.8rem}.record-stat strong{display:block;font-size:clamp(1.25rem,2vw,1.8rem)}.record-stat span,.record-meta{font-size:.9rem;opacity:.8}.records-list{display:grid;gap:.65rem}.record-row{display:grid;grid-template-columns:minmax(110px,.7fr) minmax(180px,1.5fr) minmax(90px,.6fr) minmax(90px,.6fr);gap:.75rem;align-items:center}.record-row .winner{font-weight:700}.record-row .players{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media(max-width:700px){.record-row{grid-template-columns:1fr 1fr}.record-row .players{grid-column:1/-1;white-space:normal}}

/* v0.51 Match Style framework */
.match-style-picker{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(220px,.6fr);gap:12px;align-items:end;margin:14px 0;padding:14px 16px;border:1px solid #493653;border-radius:12px;background:linear-gradient(135deg,rgba(34,20,42,.9),rgba(13,10,17,.92))}.match-style-picker>div strong{display:block;font-size:clamp(1rem,1.6vw,1.2rem);margin-top:3px}.match-style-picker label{display:grid;gap:6px;font-weight:800}.match-style-picker select{min-height:44px}.match-style-picker p{grid-column:1/-1;margin:0;color:#cdbfd2;font-size:.95rem}@media(max-width:760px){.match-style-picker{grid-template-columns:1fr}.match-style-picker p{grid-column:auto}}

/* v0.52 Quick Match matchmaking */
.quick-match-panel{margin:0 0 1rem;padding:1rem 1.15rem;border:1px solid rgba(191,155,255,.28);border-radius:14px;background:rgba(31,22,45,.72);display:grid;gap:.65rem}
.quick-match-panel p{margin:0;max-width:72ch}
.quick-match-controls{display:flex;gap:.75rem;align-items:end;flex-wrap:wrap}
.quick-match-controls label{display:grid;gap:.35rem;min-width:min(18rem,100%);flex:1}
.quick-match-controls button{min-height:44px}
.quick-match-status{font-size:clamp(.9rem,1.4vw,1rem);font-weight:700;letter-spacing:.02em;opacity:.9}
.quick-match-panel.searching{box-shadow:0 0 0 1px rgba(191,155,255,.18),0 0 24px rgba(126,76,180,.14) inset}
@media (max-width:760px){.quick-match-controls{align-items:stretch}.quick-match-controls button{width:100%}}


/* v0.52.1 Steam-style main menu flow */
.main-menu-actions{max-width:420px;margin:0 auto;width:100%;}
.play-card{max-width:860px;}
.play-choice-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:24px 0;}
.play-choice{min-height:150px;padding:22px 18px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;text-align:left;gap:9px;}
.play-choice strong{font-size:clamp(1.05rem,1.7vw,1.35rem);letter-spacing:.08em;}
.play-choice span{font-size:clamp(.92rem,1.3vw,1.02rem);line-height:1.45;opacity:.86;}
.play-choice.continue{grid-column:1/-1;min-height:86px;}
@media (max-width:760px){.play-choice-grid{grid-template-columns:1fr}.play-choice{min-height:104px}.play-choice.continue{grid-column:auto}}

/* v0.52.2 Quick Match formats + Party foundation */
.quick-format-picker{display:flex;gap:.75rem;margin:.75rem 0}.quick-format-picker button{min-width:7rem}.party-panel{margin-bottom:1rem}.party-create-row,.party-join-row,.party-launch{display:flex;gap:.75rem;align-items:end;flex-wrap:wrap;margin:.65rem 0}.party-code-line{font-size:1rem;letter-spacing:.08em;margin:.8rem 0}.party-member{display:flex;justify-content:space-between;gap:1rem;padding:.55rem .7rem;border:1px solid rgba(255,255,255,.14);border-radius:.5rem;margin:.35rem 0}.party-member span{opacity:.75;font-size:.85rem}

/* v0.54 Custom Match */
.custom-match-controls{display:grid;grid-template-columns:repeat(5,minmax(130px,1fr));gap:12px;margin-top:14px;padding:14px;border:1px solid rgba(211,180,120,.24);border-radius:14px;background:rgba(13,8,18,.42)}
.custom-match-controls label{display:flex;flex-direction:column;gap:6px;font-weight:700}.custom-match-controls select{min-height:42px}.custom-match-controls small{font-weight:500;line-height:1.3;opacity:.76}.custom-match-note{grid-column:1/-1;display:flex;gap:8px;align-items:baseline;padding-top:3px}.custom-match-note span{opacity:.82}
@media(max-width:900px){.custom-match-controls{grid-template-columns:repeat(2,minmax(140px,1fr))}}@media(max-width:560px){.custom-match-controls{grid-template-columns:1fr}}


/* v0.73 UI/UX live-playtest hotfix — game-shell menus + gameplay clarity */
/* Locked final home composition: asset copied byte-for-byte from the approved mockup. */
body:not(.game-active):not(.tutorial-active){background:#050307!important}
body:not(.game-active):not(.tutorial-active) .masthead{display:none!important}
body:not(.game-active):not(.tutorial-active) #notice{position:fixed;z-index:90;right:18px;bottom:18px;max-width:420px;min-height:0;border:1px solid #7b5a2d;border-radius:8px;background:rgba(7,4,9,.94);text-align:left}
#entry-screen{position:relative!important;width:min(100vw,calc(100vh * 1.77586));height:min(100vh,calc(100vw / 1.77586));min-height:0!important;margin:auto!important;padding:0!important;background:#050307 url('/assets/home-menu-final.png') center/100% 100% no-repeat!important;overflow:hidden!important}
#entry-screen .menu-card{position:absolute!important;inset:0!important;width:100%!important;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important}
#entry-screen .menu-brand,#entry-screen #save-recovery-status{display:none!important}
#entry-screen .main-menu-actions{position:absolute!important;inset:0!important;display:block!important;margin:0!important;pointer-events:none}
#entry-screen .main-menu-actions button{position:absolute!important;z-index:5!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;color:transparent!important;box-shadow:none!important;pointer-events:auto;opacity:.001!important}
#entry-screen .main-menu-actions button:focus-visible,#entry-screen .main-menu-actions button:hover{opacity:1!important;background:rgba(109,39,139,.20)!important;outline:2px solid rgba(224,174,255,.72)!important;color:transparent!important}
#play-button{left:1.2%!important;top:23.0%!important;width:20.5%!important;height:8.4%!important}
#home-quick-match{left:1.2%!important;top:32.7%!important;width:20.5%!important;height:8.1%!important}
#home-private-match{left:1.2%!important;top:41.2%!important;width:20.5%!important;height:8.1%!important}
#home-local-match{left:1.2%!important;top:49.9%!important;width:20.5%!important;height:8.1%!important}
#home-continue-match{left:1.2%!important;top:58.2%!important;width:20.5%!important;height:8.1%!important}
#tutorial-button{left:1.2%!important;top:68.4%!important;width:20.5%!important;height:7.2%!important}
#settings-button{left:1.2%!important;top:76.1%!important;width:20.5%!important;height:7.2%!important}
#exit-button{left:1.2%!important;top:84.0%!important;width:20.5%!important;height:7.2%!important}
#records-button{right:6.1%!important;top:2.1%!important;width:4.4%!important;height:6.3%!important}
#install-app-menu-button{display:none!important}
#entry-screen .home-disabled{cursor:not-allowed!important}

/* All follow-on menus are fixed game screens: left option bars + contained panel, never a long webpage. */
:is(#play-screen,#mode-screen,#match-setup-screen,#records-screen,#settings-screen){
  position:relative!important;width:100vw!important;max-width:none!important;height:100vh!important;min-height:100vh!important;margin:0!important;padding:24px 28px 24px 360px!important;place-items:stretch!important;overflow:hidden!important;
  background:linear-gradient(90deg,rgba(5,3,7,.98) 0 330px,rgba(5,3,7,.28) 330px 100%),radial-gradient(circle at 72% 34%,rgba(100,39,129,.22),transparent 28%),#09050c!important;
}
:is(#play-screen,#mode-screen,#match-setup-screen,#records-screen,#settings-screen)::before{content:"SEAT\A THE QUEEN\A\A A BATTLE FOR THE COURTS";white-space:pre;position:absolute;left:28px;top:28px;width:274px;color:#e1bd73;font:700 34px/1.02 Georgia,serif;letter-spacing:.035em;text-align:center;text-shadow:0 4px 18px #000;pointer-events:none}
:is(#play-screen,#mode-screen,#match-setup-screen,#records-screen,#settings-screen)::after{content:"";position:absolute;left:24px;top:190px;bottom:28px;width:286px;border:1px solid #5b3a64;border-radius:10px;background:linear-gradient(180deg,rgba(22,12,28,.94),rgba(8,6,11,.98));box-shadow:0 20px 50px #0008;pointer-events:none}
:is(#play-screen,#mode-screen,#match-setup-screen,#records-screen,#settings-screen)>*{z-index:2}
:is(#play-screen,#mode-screen,#match-setup-screen,#records-screen,#settings-screen) :is(.menu-card,.match-setup-card,.settings-card){width:100%!important;height:calc(100vh - 48px)!important;max-height:calc(100vh - 48px)!important;margin:0!important;padding:24px!important;border-color:#6d4776!important;background:linear-gradient(145deg,rgba(18,11,23,.97),rgba(7,6,10,.98))!important;overflow:auto!important;scrollbar-width:thin}
#play-screen .play-choice-grid,#mode-screen .mode-choice-grid{display:flex!important;flex-direction:column!important;gap:10px!important;width:min(420px,42%)!important;margin-top:22px!important}
#play-screen .play-choice,#mode-screen .mode-choice{min-height:82px!important;text-align:left!important;border-radius:4px!important;border-color:#5c4a61!important;background:linear-gradient(90deg,#17121c,#0c0a0f)!important}
#play-screen .play-choice:hover,#mode-screen .mode-choice:hover,#play-screen .play-choice.primary,#mode-screen .mode-choice.primary{border-color:#d2a54c!important;background:linear-gradient(90deg,#533066,#24142c)!important;box-shadow:inset 4px 0 #d9ad52,0 0 18px #772b9838!important}
#play-screen .menu-brand,#mode-screen .menu-brand{text-align:left!important}.menu-brand h2{font-size:clamp(2rem,4vw,3.4rem)!important}
#match-setup-screen .match-setup-card{display:grid!important;grid-template-rows:auto auto 1fr auto!important;gap:12px!important}
#match-setup-screen .setup-header{position:static!important;display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:16px!important}
#match-setup-screen .match-style-picker{display:grid!important;grid-template-columns:minmax(260px,1fr) minmax(260px,420px)!important;gap:12px 22px!important;margin:0!important;padding:14px 16px!important}
#match-setup-screen .setup-team-grid{display:grid!important;grid-template-columns:minmax(0,1fr) 54px minmax(0,1fr)!important;gap:14px!important;align-items:stretch!important}
#match-setup-screen .setup-team{min-height:0!important;margin:0!important;padding:14px!important}.setup-versus{align-self:center!important}
#match-setup-screen #local-setup-area,#match-setup-screen #online-setup-area{min-height:0!important;overflow:auto!important;padding-right:4px!important}
#match-setup-screen #enter-match-button{position:static!important;width:100%!important;max-width:360px!important;justify-self:end!important;margin-top:8px!important}
#match-setup-screen .online-choice-grid{display:grid!important;grid-template-columns:1fr 1fr!important;gap:16px!important}.online-choice-grid>*{min-width:0!important}

/* Gameplay fixes from live visual review. */
.initiative-chip{display:none!important}
.royal-topbar{grid-template-columns:250px 88px 1fr auto!important}
.queen-marker.hearts{background-image:url('/assets/queen-hearts.png')!important}.queen-marker.diamonds{background-image:url('/assets/queen-diamonds.png')!important}.queen-marker.clubs{background-image:url('/assets/queen-clubs.png')!important}.queen-marker.spades{background-image:url('/assets/queen-spades.png')!important}
.result-track .queen-marker.hearts{background-image:url('/assets/queen-hearts.png')!important}.result-track .queen-marker.diamonds{background-image:url('/assets/queen-diamonds.png')!important}.result-track .queen-marker.clubs{background-image:url('/assets/queen-clubs.png')!important}.result-track .queen-marker.spades{background-image:url('/assets/queen-spades.png')!important}
.edge-line-wrap{position:relative!important;padding-bottom:48px!important}.queen-copy{top:auto!important;bottom:4px!important;z-index:12!important;min-width:190px!important;max-width:46%!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;background:rgba(8,4,11,.94)!important;border:1px solid #744189!important}
.waiting-row{margin-top:14px!important}.royal-edge{min-height:174px!important}
.track-numbers{display:grid!important;grid-auto-flow:column!important;grid-auto-columns:1fr!important;align-items:center!important}.track-numbers span{text-align:center!important}
.execution-order{z-index:2!important}.queue-duel{z-index:1!important}
.resource-card.left-resource>span{color:#f1ca72!important}.resource-card.right-resource>span{color:#c9a9d4!important}

@media(max-width:900px){
  :is(#play-screen,#mode-screen,#match-setup-screen,#records-screen,#settings-screen){padding:16px!important;height:auto!important;min-height:100vh!important;overflow:auto!important}
  :is(#play-screen,#mode-screen,#match-setup-screen,#records-screen,#settings-screen)::before,:is(#play-screen,#mode-screen,#match-setup-screen,#records-screen,#settings-screen)::after{display:none!important}
  :is(#play-screen,#mode-screen,#match-setup-screen,#records-screen,#settings-screen) :is(.menu-card,.match-setup-card,.settings-card){height:auto!important;max-height:none!important}
  #match-setup-screen .setup-team-grid,#match-setup-screen .match-style-picker,#match-setup-screen .online-choice-grid{grid-template-columns:1fr!important}
  #play-screen .play-choice-grid,#mode-screen .mode-choice-grid{width:100%!important}
}

/* Live review: keep the discard action visible above the hand fan. */
.hand-center .discard-controls{
  position:absolute!important;
  top:5px!important;
  right:10px!important;
  left:auto!important;
  z-index:80!important;
  transform:none!important;
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  padding:3px 5px!important;
  border:1px solid rgba(210,170,104,.38)!important;
  border-radius:6px!important;
  background:rgba(7,4,10,.94)!important;
  box-shadow:0 4px 14px rgba(0,0,0,.55)!important;
}
.hand-center .discard-controls button{min-height:30px!important;padding:4px 9px!important;font-size:11px!important}
.hand-center .discard-controls span{font-size:10px!important}
.hand-center .hand-heading{left:10px!important;right:auto!important;text-align:left!important;padding-right:340px!important}
.hand-center .hand{top:38px!important;bottom:0!important;height:auto!important}
@media(max-width:1050px){
  .hand-center .discard-controls span{display:none!important}
  .hand-center .hand-heading{padding-right:180px!important}
}
