@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800&family=DM+Sans:wght@400;500;600;700&display=swap');
:root{--bg:#101313;--panel:#191d1d;--panel2:#202525;--line:#303838;--muted:#8b9692;--text:#e9e6db;--gold:#d7a45b;--gold2:#f2c477;--green:#79a58b;--red:#c8775d;--display:'Barlow Condensed',Impact,sans-serif;--body:'DM Sans',sans-serif}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 52% 8%,#222827 0%,#141818 45%,#0e1111 100%);color:var(--text);font-family:var(--body);min-height:100vh}.app-shell{max-width:1680px;margin:auto;padding:0 42px;min-height:100vh;display:flex;flex-direction:column}.topbar{height:84px;display:flex;align-items:center;border-bottom:1px solid #ffffff12;gap:24px}.brand-mark{display:flex;align-items:center;gap:12px}.brand-glyph{width:34px;height:34px;border:1px solid #bd8d4e;color:var(--gold);display:grid;place-items:center;font-size:19px;transform:rotate(45deg);border-radius:7px}.brand-glyph::first-letter{transform:rotate(-45deg)}.brand-name{font-family:var(--display);letter-spacing:.16em;font-size:21px;font-weight:700}.brand-sub{font-size:8px;letter-spacing:.22em;color:#8f9890;margin-top:2px}.status-pill{margin-left:auto;display:flex;align-items:center;gap:9px;border:1px solid #465149;padding:9px 13px;color:#b7c2b8;font-size:9px;letter-spacing:.13em}.live-dot{width:6px;height:6px;border-radius:50%;background:#8db896;box-shadow:0 0 8px #8db896}.icon-button{width:34px;height:34px;background:transparent;border:1px solid #ffffff22;color:#aab2ad;font-size:18px}main{flex:1}.setup-screen{padding:42px 0 30px}.intro-copy{margin-bottom:30px}.eyebrow{color:var(--gold);font-size:10px;letter-spacing:.24em;display:flex;align-items:center;gap:10px}.eyebrow-line{display:inline-block;width:22px;height:1px;background:var(--gold)}h1,h2,p{margin:0}.intro-copy h1,.game-heading h1{font:600 clamp(36px,4vw,53px)/.92 var(--display);letter-spacing:.01em;margin:13px 0 12px}.intro-copy h1 em,.game-heading h1 em{color:var(--gold);font-style:normal}.intro-copy p{font-size:13px;color:#a3aaa4;max-width:520px;line-height:1.6}.setup-grid{display:grid;grid-template-columns:minmax(430px,1.05fr) minmax(380px,.95fr);gap:18px}.setup-card,.preview-card,.board-panel,.command-panel{border:1px solid #424745;background:linear-gradient(145deg,#202525f5,#171b1bfa);box-shadow:0 20px 50px #0005}.setup-card{padding:24px 28px}.card-heading{display:flex;gap:14px;align-items:center;margin-bottom:24px}.step-number{font:600 23px var(--display);color:var(--gold);border-right:1px solid #50534c;padding-right:14px}.card-heading h2,.preview-top h2{font:600 21px var(--display);letter-spacing:.03em}.card-heading p{font-size:10px;color:var(--muted);margin-top:3px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px 14px}.field{display:flex;flex-direction:column;gap:8px;font-size:9px;letter-spacing:.16em;color:#9aa39d}.field select{appearance:none;background:#111515;border:1px solid #414947;color:#e7e4d9;padding:12px 35px 12px 12px;font-family:var(--body);font-size:12px;letter-spacing:0;background-image:linear-gradient(45deg,transparent 50%,#b5a47f 50%),linear-gradient(135deg,#b5a47f 50%,transparent 50%);background-position:calc(100% - 16px) 17px,calc(100% - 11px) 17px;background-size:5px 5px,5px 5px;background-repeat:no-repeat}.field select:focus,input:focus{outline:1px solid var(--gold)}.field-wide{grid-column:1/-1}.field b{float:right;color:var(--gold);font-size:8px;font-weight:500}.field input[type=range]{width:100%;accent-color:var(--gold);margin:4px 0}.range-labels{display:flex;justify-content:space-between;color:#707975}.range-labels small{font-size:8px;letter-spacing:.12em}.theme-strip{margin:24px 0 18px;border-top:1px solid #ffffff12;padding-top:17px}.theme-strip>span,.preview-kicker{font-size:9px;letter-spacing:.18em;color:#939c96}.theme-choice{margin-top:9px;border:1px solid #826b48;background:#252821;padding:11px;display:flex;align-items:center;gap:11px}.theme-swatch{width:35px;height:34px;background:linear-gradient(140deg,#7a653f,#384347 55%,#d19447);border:1px solid #b99b63}.theme-choice strong{display:block;font-size:11px;font-weight:600}.theme-choice small{display:block;color:#98a19b;font-size:9px;margin-top:3px}.checkmark{margin-left:auto;color:var(--gold);font-size:13px}.setup-actions{display:flex;gap:10px}.button{border:1px solid #525a56;padding:13px 14px;font-family:var(--body);font-size:10px;font-weight:600;letter-spacing:.04em;cursor:pointer}.button-secondary{background:#202626;color:#e0e3db;flex:1}.button-primary{background:linear-gradient(140deg,#d9ae6e,#b78142);border-color:#dfb876;color:#141615;min-width:150px}.button:disabled{opacity:.42;cursor:not-allowed}.button span:last-child{font-size:15px;margin-left:8px}.refresh-icon{font-size:16px;color:var(--gold);margin-right:5px}.map-count{text-align:right;color:#707975;font-size:8px;letter-spacing:.1em;margin-top:10px;height:10px}.preview-card{padding:20px 22px;display:flex;flex-direction:column;min-height:370px;background:linear-gradient(140deg,#242a29,#171b1a)}.preview-top{display:flex;justify-content:space-between;align-items:center}.preview-top h2{margin-top:5px;font-size:18px}.preview-index{font:600 31px var(--display);color:#bdc2b5;opacity:.4}.mini-map-wrap{position:relative;flex:1;min-height:215px;margin:16px 0 14px;border:1px solid #3a4440;background:radial-gradient(ellipse at center,#262c28,#151918);overflow:hidden}.mini-map-wrap canvas{width:100%;height:100%;position:absolute;inset:0}.mini-map-empty{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:#79827c}.mini-map-empty span{font-size:28px;color:#b88c51}.mini-map-empty small{font-size:8px;letter-spacing:.18em}.preview-meta{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #ffffff14;padding-top:12px}.preview-meta div{display:flex;flex-direction:column;gap:4px;border-right:1px solid #ffffff12;padding-left:14px}.preview-meta div:first-child{padding-left:0}.preview-meta div:last-child{border:0}.preview-meta small{font-size:8px;letter-spacing:.15em;color:#89938d}.preview-meta strong{font:600 18px var(--display);color:#e3dfd3}.preview-foot{display:flex;align-items:center;gap:8px;padding-top:14px;color:#838d86;font-size:8px;letter-spacing:.13em}.preview-foot #seedDisplay{margin-left:auto;color:#6e7771}.signal-bars{color:var(--gold);font-size:14px;letter-spacing:-2px}.join-row{display:flex;align-items:center;gap:12px;margin-top:21px;padding:14px 17px;border-top:1px solid #ffffff13;color:#8e9991;font-size:10px}.join-row input{background:#151a19;border:1px solid #3e4743;padding:9px 10px;width:145px;color:var(--text);letter-spacing:.12em;font:600 10px var(--body)}.join-row button{border:0;background:transparent;color:var(--gold);font:600 10px var(--body);cursor:pointer}.join-row button span{font-size:16px;margin-left:6px}.join-message{color:#d2a363;font-size:9px}.game-screen{padding:30px 0}.hidden{display:none!important}.game-heading{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:19px}.game-heading h1{font-size:38px;margin-bottom:0}.game-meta{display:flex;gap:13px;align-items:center;color:#94a099;font-size:9px;letter-spacing:.13em}.game-meta b{color:var(--gold);font-size:14px}.divider{height:18px;width:1px;background:#47504b}.game-layout{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:16px}.board-panel{min-width:0;padding:15px 18px 12px}.board-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.board-label{display:block;font-size:8px;letter-spacing:.2em;color:#939e96}.board-top strong{display:block;font:600 16px var(--display);letter-spacing:.04em;margin-top:3px}.board-tools{display:flex;gap:5px}.board-tools button{width:29px;height:27px;background:#212725;border:1px solid #454d49;color:#d7ddd4;cursor:pointer}.board-stage{height:min(63vh,620px);min-height:360px;position:relative;overflow:hidden;background:radial-gradient(ellipse at center,#252b27 0%,#151918 72%);border:1px solid #343d39}.board-stage canvas{width:100%;height:100%;display:block;touch-action:none}.board-hint{position:absolute;left:15px;bottom:13px;background:#111716cf;border:1px solid #4a524c;padding:8px 11px;color:#c3c8be;font-size:9px;letter-spacing:.04em;pointer-events:none}.board-legend{height:31px;display:flex;align-items:end;gap:18px;color:#8e9891;font-size:8px;letter-spacing:.12em}.legend-dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:5px}.legend-dot.own{background:#c29b59}.legend-dot.enemy{background:#b96e58}.legend-line{display:inline-block;width:14px;border-top:1px solid #777e71;margin:0 4px 2px 0}.board-seed{margin-left:auto;color:#67716c}.command-panel{padding:14px;display:flex;flex-direction:column}.turn-card{border:1px solid #56523c;background:linear-gradient(120deg,#2d2d24,#202421);padding:12px 13px}.turn-card-top,.selected-header{display:flex;justify-content:space-between;align-items:center;color:#afa57e;font-size:8px;letter-spacing:.16em}.turn-light{width:6px;height:6px;border-radius:50%;background:#d8b16f;box-shadow:0 0 7px #d8b16f}.turn-card>strong{display:block;font:600 23px var(--display);margin-top:7px}.turn-card>small{display:block;color:#9da39b;font-size:9px;margin-top:2px}.selected-card{padding:14px 1px;border-bottom:1px solid #ffffff13}.selected-header{color:#8d9890}.selected-header span:last-child{color:var(--gold)}.selected-empty{font-size:10px;color:#737e77;line-height:1.5;padding:13px 4px 1px}.selected-info{display:flex;align-items:center;gap:10px;padding-top:12px}.figure-badge{width:31px;height:31px;border-radius:50%;display:grid;place-items:center;border:1px solid #a5834c;color:#d6af6c;font-size:13px;background:#28271f}.selected-info strong{font:600 16px var(--display);display:block}.selected-info small{font-size:8px;color:#97a19a}.action-list{display:flex;flex-direction:column;gap:7px;margin:13px 0}.action-button{display:flex;align-items:center;gap:9px;text-align:left;padding:9px;background:#202625;border:1px solid #404846;color:#e4e4dc;cursor:pointer}.action-button:disabled{opacity:.42;cursor:not-allowed}.action-icon{width:27px;height:27px;display:grid;place-items:center;background:#2c3027;color:#d9aa62;font-size:16px}.action-button strong{font-size:10px;display:block}.action-button small{font-size:8px;display:block;color:#949e97;margin-top:3px}.action-button kbd{margin-left:auto;font-size:8px;color:#707b73}.end-turn{border:1px solid #bf9252;background:#bb8b49;color:#151615;padding:12px;font:700 9px var(--body);letter-spacing:.17em;cursor:pointer}.end-turn span{float:right;font-size:15px;line-height:10px}.log-panel{margin-top:16px;border-top:1px solid #ffffff16;padding-top:12px;flex:1;min-height:100px}.log-heading{display:flex;justify-content:space-between;font-size:8px;color:#919b94;letter-spacing:.16em}.log-live{color:#8aaf93}.log-list{display:flex;flex-direction:column;gap:8px;margin-top:12px}.log-item{display:flex;gap:9px;align-items:flex-start;font-size:9px;line-height:1.4;color:#b6bdb5}.log-item i{color:#c69b5d;font-style:normal}.connection-foot{border-top:1px solid #ffffff13;margin-top:12px;padding-top:11px;display:flex;align-items:center;gap:7px;color:#78847c;font-size:8px;letter-spacing:.11em}footer{height:43px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid #ffffff13;color:#65716a;font-size:8px;letter-spacing:.15em}footer b{color:var(--gold);padding:0 4px}.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:linear-gradient(135deg,#30362f,#1e2420);border:1px solid #d4aa62;border-radius:7px;padding:14px 20px;color:#fff1d0;font-size:13px;font-weight:700;line-height:1.45;text-align:center;width:max-content;max-width:min(88vw,560px);box-shadow:0 8px 30px #000b,0 0 18px #d3a95833;transition:.2s;z-index:30}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:980px){.app-shell{padding:0 22px}.setup-grid{grid-template-columns:1fr 1fr}.setup-card{padding:20px}.game-layout{grid-template-columns:minmax(0,1fr) 260px}.board-stage{height:55vh}}
@media(max-width:720px){.app-shell{padding:0 14px}.topbar{height:66px}.status-pill{font-size:7px;padding:8px}.setup-screen{padding:30px 0}.setup-grid{grid-template-columns:1fr}.preview-card{min-height:350px}.setup-card{padding:19px}.join-row{flex-wrap:wrap;padding-inline:4px}.game-heading{align-items:flex-start;gap:10px;flex-direction:column}.game-heading h1{font-size:32px}.game-layout{grid-template-columns:1fr}.board-stage{height:58vh;min-height:340px}.command-panel{display:grid;grid-template-columns:1fr 1fr;gap:10px}.turn-card,.selected-card{min-width:0}.selected-card{border:1px solid #303837;padding:12px}.action-list{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;margin:0}.end-turn{grid-column:1/-1}.log-panel{grid-column:1/-1}.connection-foot{grid-column:1/-1}.board-legend{gap:9px;font-size:7px}footer span:last-child{display:none}}

.entry-screen,.lobby-screen{max-width:1240px;margin:0 auto;width:100%}.entry-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.entry-card{display:flex;gap:16px;align-items:flex-start;min-height:190px}.entry-card h2,.lobby-player strong{font:600 23px var(--display)}.entry-card p{color:#a3aaa4;font-size:12px;line-height:1.55;margin:8px 0 18px;max-width:390px}.entry-card .button{min-width:190px}.entry-join{display:flex;gap:8px;max-width:420px}.entry-join input{flex:1;min-width:0;background:#111515;border:1px solid #414947;color:#e7e4d9;padding:12px;font:600 12px var(--body);letter-spacing:.14em;text-transform:uppercase}.join-message{display:block;color:#d6b475;font-size:10px;margin-top:9px}.setup-lobby-row{display:flex;align-items:center;justify-content:space-between;margin-top:14px;padding:13px 3px;border-top:1px solid #ffffff18;color:#a3aaa4;font-size:11px}.lobby-screen{padding:42px 0 30px}.lobby-heading{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:26px}.lobby-heading h1{font:600 clamp(36px,4vw,53px)/.92 var(--display);margin:13px 0 12px}.lobby-heading h1 em{color:var(--gold);font-style:normal}.lobby-heading p{color:#a3aaa4;font-size:12px}.lobby-code-card{min-width:265px;padding:17px 20px;border:1px solid #665438;background:linear-gradient(135deg,#27271f,#191d1b);display:flex;flex-direction:column;gap:7px}.lobby-code-card small,.lobby-map-code{font-size:8px;letter-spacing:.15em;color:#d3aa6b}.lobby-code-card strong{font:700 32px var(--display);letter-spacing:.18em;color:#f1d49e}.lobby-code-card span{font-size:9px;color:#98a199}.lobby-grid{display:grid;grid-template-columns:minmax(320px,.78fr) minmax(0,1.22fr);gap:18px}.lobby-players-card{display:flex;flex-direction:column}.lobby-players-card .card-heading{margin-bottom:18px}.lobby-players{display:flex;flex-direction:column;gap:8px;min-height:100px}.lobby-player{display:flex;align-items:center;gap:12px;padding:11px;background:#151a18;border:1px solid #39423d}.lobby-player.waiting{border-style:dashed;opacity:.72}.lobby-player-index{font:600 17px var(--display);color:#d0a867}.lobby-player strong{font-size:16px;display:block}.lobby-player small{display:block;color:#909b93;font-size:9px;margin-top:3px}.lobby-player i{font-style:normal;font-size:7px;letter-spacing:.14em;color:#91b699;margin-left:auto}.lobby-player.waiting i{color:#9b8a65}.lobby-actions{display:flex;gap:8px;margin-top:auto;padding-top:20px}.lobby-actions .button{flex:1}.lobby-map-card{min-height:430px}.lobby-map-card .mini-map-wrap{height:310px;min-height:260px}.lobby-map-card canvas{width:100%;height:100%;display:block}.lobby-map-card .preview-top{align-items:center}.lobby-map-code{border:1px solid #5c4c35;padding:8px}.lobby-map-card .preview-meta{margin-top:0}
@media(max-width:720px){.entry-grid,.lobby-grid{grid-template-columns:1fr}.entry-card{min-height:0}.entry-card h2{font-size:21px}.lobby-heading{align-items:flex-start;flex-direction:column}.lobby-code-card{width:100%;min-width:0}.lobby-screen{padding-top:30px}.lobby-map-card{min-height:350px}.lobby-map-card .mini-map-wrap{height:240px;min-height:220px}.lobby-actions{flex-direction:column}.setup-lobby-row{gap:10px;align-items:flex-start;flex-direction:column}}
.player-name-field{display:grid;grid-template-columns:minmax(130px,200px) minmax(220px,360px);align-items:center;gap:10px;margin:-8px 0 22px;color:#d2b176;font-size:8px;letter-spacing:.16em}.player-name-field input,.lobby-design-field select{width:100%;background:#111615;border:1px solid #414947;color:#e7e4d9;padding:12px;font:500 12px var(--body);letter-spacing:0}.player-name-field input::placeholder{color:#707b74}.lobby-design-field{display:flex;flex-direction:column;gap:7px;margin-top:20px;padding:14px;background:#151a18;border:1px solid #39423d}.lobby-design-field>span{font-size:8px;letter-spacing:.15em;color:#d2b176}.lobby-design-field select{font-size:11px}.lobby-design-field small{color:#8e9991;font-size:9px}.lobby-players-card .lobby-actions{margin-top:20px}
@media(max-width:720px){.player-name-field{grid-template-columns:1fr;gap:7px;margin:0 0 18px}}
@media(max-width:420px){.status-pill{display:none}.setup-actions{flex-direction:column}.button-primary{min-height:42px}.form-grid{gap:13px 9px}.field select{font-size:11px;padding-left:9px}.command-panel{grid-template-columns:1fr}.action-list{grid-column:auto}.end-turn,.log-panel,.connection-foot{grid-column:auto}.game-meta{font-size:8px}}
.share-code{color:#d1ae72;border:1px solid #69573b;padding:4px 7px}.share-code b{font-weight:700;letter-spacing:.18em}
.preview-tools{display:flex;align-items:center;gap:5px}.preview-tools button{width:27px;height:25px;background:#212725;border:1px solid #454d49;color:#d7ddd4;cursor:pointer}.preview-tools .preview-index{margin-left:7px}.mini-map-wrap canvas{touch-action:none;cursor:grab}.mini-map-wrap canvas:active{cursor:grabbing}
.rule-settings{border:1px solid #343d39;margin:0 0 17px;background:#151a19}.rule-settings summary{cursor:pointer;list-style:none;padding:12px 13px;color:#d6d8cf;font-size:10px;letter-spacing:.07em}.rule-settings summary::-webkit-details-marker{display:none}.rule-settings summary::after{content:'＋';float:right;color:var(--gold)}.rule-settings[open] summary::after{content:'−'}.rule-settings summary span{float:right;margin-right:12px;color:#858f87;font-size:8px;letter-spacing:.13em}.rule-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px 14px;border-top:1px solid #ffffff12;padding:12px}.rule-item{display:flex;align-items:center;gap:8px;min-height:22px;color:#aeb7ae;font-size:9px;line-height:1.35}.rule-item input[type=checkbox]{appearance:none;width:13px;height:13px;flex:0 0 13px;margin:0;border:1px solid #657069;background:#131716;position:relative}.rule-item input[type=checkbox]:checked{background:#9e7948;border-color:#d1a763}.rule-item input[type=checkbox]:checked::after{content:'✓';position:absolute;inset:-2px 0 0;text-align:center;color:#161816;font-size:11px;font-weight:700}.rule-item select,.rule-item input[type=number]{min-width:0;width:100%;background:#111515;border:1px solid #414947;color:#e7e4d9;padding:7px;font:10px var(--body)}.rule-item:has(select),.rule-item:has(input[type=number]){align-items:flex-start;flex-direction:column;gap:5px}.rule-item.custom-limit{grid-column:1/-1}
.card-composition{border-top:1px solid #ffffff12}.card-composition>summary{cursor:pointer;list-style:none;padding:11px 12px;color:#d6d8cf;font-size:9px;letter-spacing:.07em}.card-composition>summary::-webkit-details-marker{display:none}.card-composition>summary span{float:right;color:#c5a36e;font-size:8px;letter-spacing:.1em}.card-composition>p{margin:0 12px 10px;color:#909b92;font-size:9px;line-height:1.45}.card-counts-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:0 12px 11px}.card-counts-grid label{display:flex;align-items:center;justify-content:space-between;gap:6px;min-width:0;padding:6px 7px;background:#1b211e;border:1px solid #313a35;color:#b7c0b7;font-size:8px;line-height:1.2}.card-counts-grid input{width:38px;min-width:38px;padding:5px 3px;background:#101413;border:1px solid #414a44;color:#eee6d3;font:600 10px var(--body);text-align:center}.card-count-total{display:flex;align-items:center;gap:7px;padding:0 12px 12px;color:#a4afa5;font-size:9px}.card-count-total b{color:#e0bd7d;font-size:11px}.card-count-total span{margin-left:auto;color:#91a78d;font-size:8px}.card-count-total span.invalid{color:#e58a70}
.game-dialog{width:min(460px,calc(100vw - 32px));padding:0;border:1px solid #a88652;background:linear-gradient(145deg,#252a28,#151918);color:var(--text);box-shadow:0 25px 90px #000b}.game-dialog::backdrop{background:#050707c9;backdrop-filter:blur(4px)}.game-dialog form{padding:26px}.dialog-kicker{font-size:9px;letter-spacing:.2em;color:var(--gold)}.game-dialog h2{font:600 28px var(--display);margin:9px 0}.game-dialog p{font-size:12px;line-height:1.5;color:#aeb8b0;margin-bottom:18px}.dialog-choices{display:grid;gap:8px}.dialog-choice,.dialog-submit{width:100%;padding:13px;text-align:left;border:1px solid #6d624d;background:#282b25;color:#eee8d8;font:600 12px var(--body);cursor:pointer}.dialog-choice span{float:right;color:var(--gold)}.dialog-submit{margin-top:12px;background:linear-gradient(140deg,#d9ae6e,#b78142);color:#141615;text-align:center;letter-spacing:.12em}.dialog-submit:disabled{opacity:.4;cursor:not-allowed}.dialog-cancel{margin-top:12px;padding:9px 12px;border:0;background:transparent;color:#9da69e;font:10px var(--body);cursor:pointer}.allocation-list{display:grid;gap:7px}.allocation-list label{display:grid;grid-template-columns:1fr auto 64px;gap:10px;align-items:center;padding:8px 10px;border:1px solid #39413d;background:#191e1c;font-size:11px}.allocation-list small{color:#9ba59d;font-size:9px}.allocation-list input{width:64px;padding:8px;background:#101413;border:1px solid #56605a;color:#f1e9d7;font:600 14px var(--body);text-align:center}.allocation-total{margin-top:12px;color:#aeb8b0;font-size:11px;text-align:right}.allocation-total b{color:var(--gold);font-size:14px}
.deployment-panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,.9fr);gap:20px;margin:0 0 16px;padding:20px 22px;border:1px solid #716044;background:linear-gradient(135deg,#242720f5,#171b1bfa);box-shadow:0 16px 38px #0004}.deployment-copy h2{font:600 25px var(--display);margin:8px 0}.deployment-copy p{font-size:11px;color:#a3aaa4;line-height:1.5}.deployment-squads{display:flex;flex-wrap:wrap;gap:7px;margin-top:14px}.deployment-chip{border:1px solid #444c47;background:#1a201e;padding:7px 9px;color:#a5afa7;font-size:9px}.deployment-chip.own{border-color:#8a7047;color:#e4c28a}.deployment-controls{display:flex;flex-direction:column;gap:11px}.deployment-roster{display:grid;grid-template-columns:1fr 1fr;gap:6px;max-height:180px;overflow:auto}.deployment-figure{display:flex;align-items:center;gap:8px;text-align:left;padding:8px;background:#1a201f;border:1px solid #3b4540;color:#dedfd7;cursor:pointer;min-width:0}.deployment-figure:hover,.deployment-figure.selected{border-color:#c39b5e;background:#29291f}.deployment-figure.placed:not(.selected){border-color:#52604f}.deployment-figure .figure-badge{flex:none;width:27px;height:27px}.deployment-figure>span:last-child{min-width:0}.deployment-figure strong,.deployment-figure small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.deployment-figure strong{font-size:10px}.deployment-figure small{font-size:8px;color:#98a199;margin-top:3px}.deployment-figure:disabled{cursor:default;opacity:.65}.deployment-controls .button{width:100%}
@media(max-width:720px){.deployment-panel{grid-template-columns:1fr;padding:16px}.deployment-roster{grid-template-columns:1fr 1fr;max-height:230px}.deployment-figure{padding:7px 6px;gap:6px}.deployment-figure .figure-badge{width:24px;height:24px}}
@media(max-width:420px){.card-counts-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.card-counts-grid label{font-size:8px}}
.build-version{border:1px solid #465149;background:#171c1a;color:#9ca89d;padding:7px 9px;font:600 8px var(--body);letter-spacing:.12em;white-space:nowrap;cursor:default}.build-version[data-state="current"]{border-color:#526d57;color:#a6c1a4}.build-version[data-state="stale"]{border-color:#b27b4d;color:#efbd78;cursor:pointer}.build-version[data-state="unknown"]{border-color:#765d4a;color:#c8a47f}@media(max-width:420px){.build-version{font-size:7px;padding:7px 6px;letter-spacing:.06em}}
/* Modular map editor */
.map-editor-screen{padding:34px 0 28px}.editor-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:22px}.editor-heading h1{font:600 clamp(34px,4vw,49px)/.95 var(--display);margin:12px 0 9px}.editor-heading h1 em{color:var(--gold);font-style:normal}.editor-heading p{max-width:720px;color:#a3aaa4;font-size:12px;line-height:1.55}.editor-heading>.button{flex:none}.editor-layout{display:grid;grid-template-columns:minmax(270px,340px) minmax(0,1fr);gap:16px}.editor-palette{padding:18px;display:flex;flex-direction:column;gap:10px}.editor-palette .card-heading{margin-bottom:5px}.editor-pieces{display:grid;grid-template-columns:1fr 1fr;gap:7px}.editor-piece{display:flex;align-items:center;gap:8px;min-height:52px;padding:7px;background:#171d1b;border:1px solid #3b4540;color:#dce0d8;text-align:left;cursor:grab}.editor-piece:hover,.editor-piece.selected{border-color:#c39a5b;background:#28291f}.editor-piece:active{cursor:grabbing}.editor-piece span:last-child{font-size:9px;line-height:1.3}.piece-icon{width:32px;height:32px;flex:none;display:grid;place-items:center;background:#303936;border:1px solid #697169;color:#e0b66d;font-size:15px}.editor-tools{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:6px}.editor-tools .button{min-width:0;padding:10px 7px;font-size:9px}.editor-tools #editorClear{grid-column:1/-1}.editor-status{min-height:43px;padding:10px;background:#141918;border-left:2px solid #9a7947;color:#aab4aa;font-size:9px;line-height:1.45}.editor-code{margin-top:5px;border-top:1px solid #ffffff17;padding-top:12px}.editor-code label{display:block;margin-bottom:7px;color:#a4aea6;font-size:8px;letter-spacing:.15em}.editor-code>div{display:flex;gap:6px}.editor-code input{min-width:0;flex:1;background:#111615;border:1px solid #414b46;color:#efe8d8;padding:10px;font:600 11px var(--body);letter-spacing:.15em;text-transform:uppercase}.editor-code .button{min-width:75px;padding:8px;font-size:9px}.editor-code>#editorSaveCode{width:100%;margin-top:7px}.editor-code small{display:block;color:#77827a;font-size:8px;line-height:1.4;margin-top:8px}.editor-use{width:100%;margin-top:auto}.editor-board-panel{padding:17px;min-width:0;display:flex;flex-direction:column}.editor-board-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.editor-board-top strong{display:block;font:600 17px var(--display);margin-top:3px}.editor-canvas-wrap{height:min(68vh,700px);min-height:420px;position:relative;overflow:hidden;border:1px solid #39433f;background:radial-gradient(ellipse at center,#222a27,#101514);touch-action:none}.editor-canvas-wrap canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab}.editor-canvas-wrap canvas:active{cursor:grabbing}.editor-empty{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:9px;color:#6f7972;pointer-events:none}.editor-empty span{font-size:30px;color:#b98c4d}.editor-empty small{font-size:8px;letter-spacing:.17em}.editor-board-foot{display:flex;justify-content:space-between;gap:10px;padding-top:10px;color:#78837c;font-size:8px;letter-spacing:.12em}.editor-board-foot span:last-child{color:#d1ad70}.editor-piece[draggable="true"]{touch-action:none}
@media(max-width:900px){.editor-layout{grid-template-columns:280px minmax(0,1fr)}.editor-palette{padding:14px}.editor-canvas-wrap{height:58vh;min-height:360px}}
@media(max-width:680px){.editor-heading{flex-direction:column}.editor-heading>.button{width:100%}.editor-layout{grid-template-columns:1fr}.editor-pieces{grid-template-columns:repeat(2,minmax(0,1fr))}.editor-palette{order:2}.editor-board-panel{order:1}.editor-canvas-wrap{height:52vh;min-height:330px}.editor-use{margin-top:10px}}
.editor-room-group{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:7px}.editor-room-toggle{grid-column:1/-1;cursor:pointer}.editor-room-toggle small{display:block;color:#a9b0a8;font-size:8px;margin-top:3px}.editor-room-toggle>b{margin-left:auto;color:#e0b66d}.editor-room-menu{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:7px;padding:7px;background:#101514;border:1px solid #4a554e}.editor-room-menu.hidden{display:none}.editor-room-menu .editor-piece{min-height:42px;padding:5px}

.editor-piece{-webkit-user-select:none;user-select:none;touch-action:none}

/* In-game controls stay out of the way; the board and the illustrated hand lead. */
.game-layout{grid-template-columns:minmax(0,1fr) 78px;gap:10px}
.board-stage{height:min(68vh,760px);min-height:410px}
.command-panel{padding:9px 7px;align-items:center;gap:9px}
.command-panel .turn-card{display:block;border:0;background:transparent;box-shadow:none;padding:2px;text-align:center;width:100%}
.command-panel .turn-card-top{justify-content:center;font-size:6px;letter-spacing:.1em}
.command-panel .turn-light,.command-panel .turn-card>small{display:none}
.command-panel .turn-card>strong{font:600 10px var(--display);margin-top:3px;line-height:1.1;overflow-wrap:anywhere}
.command-panel .selected-card{display:block;border:0;padding:3px 0;text-align:center;width:100%}
.command-panel .selected-header{display:flex;flex-direction:column;gap:3px;font-size:6px;letter-spacing:.08em}
.command-panel .selected-header span:first-child{display:none}
.command-panel .selected-header span:last-child{font-size:10px}
.command-panel .selected-empty{display:none}
.command-panel .log-panel,.command-panel .connection-foot{display:none}
.action-rail{display:flex;flex-direction:column;gap:8px;width:100%;align-items:center}
.icon-action{width:48px;height:48px;display:grid;place-items:center;border:1px solid #5a5a4a;background:linear-gradient(145deg,#282d29,#171c1a);color:#e0bd7b;font:600 22px var(--display);cursor:pointer;box-shadow:0 5px 15px #0005}
.icon-action:hover:not(:disabled),.icon-action[aria-expanded=true]{border-color:#e0b76f;box-shadow:0 0 16px #d5a64a66}
.icon-action:disabled{opacity:.38;cursor:not-allowed}
.other-actions-menu{position:absolute;z-index:4;right:84px;top:52px;width:min(260px,calc(100% - 30px));padding:8px;border:1px solid #776343;background:#171d1bdc;backdrop-filter:blur(9px);box-shadow:0 14px 40px #0009;display:grid;gap:6px}
.other-actions-menu .action-button{width:100%;margin:0;padding:8px}
.end-turn{width:48px;height:48px;padding:0;border:1px solid #ba9257;font-size:0;display:grid;place-items:center}
.end-turn::before{content:'⏭';font-size:20px}
.finish-activation{width:48px;height:38px;padding:0;justify-content:center;font-size:19px}
.board-stage{position:relative}
.event-area-tools{position:absolute;z-index:3;left:50%;bottom:12px;transform:translateX(-50%);display:flex;align-items:center;gap:9px;white-space:nowrap;padding:7px;background:#121816e8;border:1px solid #c8a264;box-shadow:0 6px 24px #0009}
.event-area-tools span{font-size:10px;color:#f0d9a8;padding:0 5px}
.event-area-tools button{min-height:32px;padding:5px 10px;border:1px solid #bd9553;background:#c59a59;color:#181916;font:700 9px var(--body);letter-spacing:.08em;cursor:pointer}
.event-area-tools button:first-of-type{font-size:19px;min-width:32px;padding:0;background:#30251d;color:#f0bb83}
.event-area-tools button:disabled{opacity:.4;cursor:not-allowed}
.game-hand-panel{margin:12px 86px 4px 0;padding:9px 12px 11px;border:1px solid #3a433f;background:linear-gradient(135deg,#202623,#121716);overflow:hidden}
.hand-heading{display:flex;justify-content:space-between;align-items:center;color:#a4ada5;font-size:8px;letter-spacing:.16em;margin-bottom:8px}
.hand-heading b{color:#d3b475;font-weight:600}
.hand-list{display:flex;gap:9px;overflow-x:auto;overflow-y:hidden;padding:3px 2px 8px;scrollbar-color:#806944 #141917;scrollbar-width:thin}
.hand-card{position:relative;flex:0 0 112px;height:128px;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:8px 7px 9px;border:1px solid #a88753;background:radial-gradient(circle at 50% 45%,#5b5240,#202722 70%);color:#f0e3c4;text-align:center;cursor:grab;touch-action:pan-x;box-shadow:0 4px 12px #0008}
.hand-card::before{content:'';position:absolute;inset:4px;border:1px solid #d6bd8a66;pointer-events:none}
.hand-card::after{content:'';position:absolute;inset:auto -12px 20px;height:1px;background:#d4b57388;transform:rotate(-24deg);pointer-events:none}
.hand-card:hover,.hand-card.selected{transform:translateY(-4px);border-color:#ffe09b;box-shadow:0 0 17px #ddb26377,0 8px 18px #0009}
.hand-card-top{z-index:1;width:100%;display:flex;justify-content:space-between;font-size:7px;letter-spacing:.14em;color:#d5b879}
.hand-card-top i{font-style:normal}
.hand-card-illustration{z-index:1;width:56px;height:57px;display:grid;place-items:center;border-radius:50%;border:1px solid #dfc07899;background:radial-gradient(circle,#d6ad614a,#11181666);color:#ffda8c;font-size:31px;text-shadow:0 0 13px #e4a54e}
.hand-card strong{z-index:1;font:600 11px var(--display);line-height:1.08;max-width:95px}
.hand-card-swipe{position:absolute;right:9px;bottom:7px;color:#fff0c2;font-size:11px;opacity:.75}
.hand-card.art-vortex .hand-card-illustration{color:#ffa564;border-color:#e77f43;background:radial-gradient(circle,#f970334d,#24120d)}
.hand-card.art-frag .hand-card-illustration,.hand-card.art-melta .hand-card-illustration,.hand-card.art-krak .hand-card-illustration{color:#ffd274;background:radial-gradient(circle,#fa7e3e55,#25140e)}
.hand-card.art-stasis .hand-card-illustration,.hand-card.art-blind .hand-card-illustration{color:#a9e2ec;border-color:#83bdca;background:radial-gradient(circle,#4fbdcf55,#102329)}
.hand-card.art-genestealer .hand-card-illustration{color:#b7d78a;border-color:#8da66b;background:radial-gradient(circle,#75a05c55,#1a2118)}
.hand-card.star{border-color:#d5a65c}
.hand-empty{padding:14px;color:#7e8981;font-size:10px}
.entry-join{position:relative}.editor-code>div{position:relative}.recent-code-menu{position:absolute;z-index:30;top:calc(100% + 4px);left:0;right:0;max-height:250px;overflow:auto;padding:5px;border:1px solid #8e754d;background:#141a18;box-shadow:0 12px 28px #000b}.recent-code-option{width:100%;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 10px;border:0;border-bottom:1px solid #ffffff12;background:transparent;color:#e7e2d6;text-align:left;cursor:pointer}.recent-code-option:hover,.recent-code-option:focus{background:#292c24;outline:1px solid #b99155}.recent-code-option strong{font-size:10px;font-weight:600;letter-spacing:.04em}.recent-code-option small,.recent-code-empty{color:#9c9e91;font-size:8px;white-space:nowrap}.recent-code-empty{display:block;padding:10px}
.virtual-hitbox-panel{margin:14px 0;padding:12px;border:1px solid #65543a;background:linear-gradient(145deg,#1d2420,#111614)}.virtual-hitbox-heading{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:9px}.virtual-hitbox-heading strong{font:600 15px var(--display);color:#eddaae}.virtual-hitbox-heading small,.virtual-hitbox-foot{color:#9fa79d;font-size:9px}.virtual-hitbox-grid{width:min(100%,330px);aspect-ratio:1;display:grid;grid-template-columns:repeat(3,1fr);gap:3px;margin:auto}.virtual-hitbox-cell{position:relative;display:flex;align-items:center;justify-content:center;gap:3px;min-width:0;min-height:0;border:1px solid #ffffff1c}.virtual-hitbox-cell>small{position:absolute;top:5px;left:5px;font-size:7px;letter-spacing:.1em;color:#d5d7c9aa}.virtual-hitbox-cell.box-hit{background:#518a6940;border-color:#71b68b88}.virtual-hitbox-cell.box-miss{background:#8c55413b;border-color:#c8775d66}.virtual-hitbox-cell.box-disabled{background:#58605b30;border-color:#a0aaa255}.virtual-box-die{z-index:1;width:28px;height:28px;display:grid;place-items:center;border:1px solid #e8cf99;border-radius:6px;background:linear-gradient(145deg,#f1e1b7,#bda878);color:#1b211e;font:700 14px var(--display);box-shadow:0 2px 7px #0009;animation:box-die-drop .38s cubic-bezier(.18,.85,.25,1.25) both}.virtual-box-die.box-die-hit{outline:2px solid #79d49a}.virtual-box-die.box-die-miss{outline:2px solid #ed876d}.virtual-hitbox-foot{text-align:center;margin-top:8px;font-size:8px;letter-spacing:.08em}@keyframes box-die-drop{from{opacity:0;transform:translateY(-28px) rotate(-40deg) scale(.7)}to{opacity:1;transform:translateY(0) rotate(0) scale(1)}}
@media(max-width:720px){.app-shell{padding:0 10px}.game-layout{grid-template-columns:1fr;gap:8px}.board-panel{padding:10px}.board-stage{height:55vh;min-height:320px}.command-panel{display:flex;flex-direction:row;justify-content:center;min-height:64px;padding:7px}.command-panel .turn-card,.command-panel .selected-card{width:auto;min-width:52px}.command-panel .turn-card>strong{max-width:74px}.action-rail{flex-direction:row;justify-content:center;width:auto}.icon-action{width:44px;height:44px}.end-turn{width:44px;height:44px}.finish-activation{width:44px;height:38px}.other-actions-menu{right:8px;top:auto;bottom:72px}.game-hand-panel{margin:8px 0;padding:8px}.hand-card{flex-basis:92px;height:112px}.hand-card-illustration{width:46px;height:46px;font-size:25px}.game-heading{margin-bottom:10px}.event-area-tools{max-width:calc(100% - 12px);gap:5px}.event-area-tools span{font-size:9px}.event-area-tools button{font-size:8px;padding:4px 7px}}

/* Gameplay UI: editor-like board first, quick squad selection and illustrated hand. */
.game-layout{grid-template-columns:minmax(0,1fr) 204px;gap:12px;align-items:stretch}
.board-stage{height:min(70vh,780px);min-height:420px;background:#121615;border-color:#404845}
.command-panel{padding:10px;align-items:stretch;gap:9px;min-width:0}
.command-panel .turn-card{display:block;width:100%;padding:10px 11px;border:1px solid #4a514a;background:#1a201d;box-shadow:none;text-align:left}
.command-panel .turn-card.is-local-turn{border-color:#d3a75e;background:linear-gradient(135deg,#302b20,#1c211e);box-shadow:0 0 18px #d1a04b38,inset 0 0 0 1px #e8c27b25}
.command-panel .turn-card-top{justify-content:space-between;font-size:7px;letter-spacing:.12em}
.command-panel .turn-card>strong{font:600 18px var(--display);margin-top:4px;line-height:1.05;overflow-wrap:anywhere}
.command-panel .turn-card>small{display:block;font-size:8px;margin-top:4px}
.command-panel .selected-card{display:block;width:100%;padding:8px 2px;border:0;border-bottom:1px solid #ffffff16;text-align:left}
.command-panel .selected-header{font-size:7px;letter-spacing:.12em}
.command-panel .selected-header span:first-child{display:inline}
.command-panel .selected-header span:last-child{font-size:8px}
.command-panel .selected-empty{display:block;padding:8px 1px 0;font-size:9px}
.command-panel .selected-info{gap:8px;padding-top:8px}
.command-panel .selected-info strong{font-size:14px}
.command-panel .selected-info small{font-size:7px}
.in-game-roster{display:flex;flex-direction:column;gap:5px;overflow-y:auto;min-height:0;max-height:min(46vh,440px);padding:1px 3px 1px 1px;scrollbar-width:thin;scrollbar-color:#756344 #171b19}
.roster-unit{display:grid;grid-template-columns:27px minmax(0,1fr) 18px;align-items:center;gap:7px;width:100%;min-height:37px;padding:4px 6px;border:1px solid #3a433e;background:linear-gradient(115deg,#202624,#171c1a);color:#e3e2d9;text-align:left;cursor:pointer;transition:border-color .12s,box-shadow .12s,background .12s}
.roster-unit:hover{border-color:#8b7854;background:#252a25}
.roster-unit.selected{border-color:#f0c574;background:linear-gradient(110deg,#3a3020,#202522);box-shadow:0 0 12px #edbd5d55,inset 0 0 0 1px #f5d99535}
.roster-unit-badge{width:25px;height:25px;display:grid;place-items:center;border:1px solid #736044;border-radius:50%;background:#2b2a22;color:#e3bf78;font:700 10px var(--display)}
.roster-unit-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:600 11px var(--display)}
.roster-unit-actions{display:grid;place-items:center;min-width:18px;height:18px;border:1px solid #4f5952;color:#bfc8bd;font-size:8px}
.roster-unit.wounded .roster-unit-badge,.roster-unit.wounded .roster-unit-actions{border-color:#c57962;color:#ec9c7e}
.roster-unit.destroyed{opacity:.32;filter:grayscale(1)}
.command-panel .finish-activation,.command-panel .end-turn{width:100%;height:auto;min-height:34px;padding:8px 7px;display:flex;align-items:center;justify-content:center;border:1px solid #555d56;background:#202725;color:#d9ddd4;font:600 9px var(--body);letter-spacing:.03em;cursor:pointer}
.command-panel .finish-activation:disabled,.command-panel .end-turn:disabled{opacity:.38;cursor:not-allowed}
.command-panel .end-turn{border-color:#b88a4b;background:linear-gradient(135deg,#d2a35d,#b78345);color:#171815;font-weight:700}
.command-panel .end-turn::before{content:none}
.command-panel .log-panel,.command-panel .connection-foot{display:none}
.game-hand-panel{margin:12px 216px 4px 0;padding:9px 12px 8px;min-height:150px;border:1px solid #3a433f;background:linear-gradient(135deg,#202623,#121716);}
.game-hand-panel .hand-heading{justify-content:center;gap:18px}
.game-hand-panel .hand-list{justify-content:center;min-height:118px}
.hand-card{flex-basis:108px;height:118px}
@media(max-width:980px){.game-layout{grid-template-columns:minmax(0,1fr) 190px}.board-stage{height:64vh;min-height:390px}.game-hand-panel{margin-right:202px}}
@media(max-width:720px){.game-layout{grid-template-columns:1fr;gap:8px}.board-stage{height:56vh;min-height:330px}.command-panel{display:flex;flex-direction:column;align-items:stretch;min-height:0;padding:8px}.command-panel .turn-card{width:100%}.command-panel .turn-card>strong{max-width:none}.command-panel .selected-card{width:100%;min-width:0;border:0;border-bottom:1px solid #ffffff16;padding:7px 2px}.in-game-roster{flex-direction:row;max-height:none;overflow-x:auto;overflow-y:hidden;padding:2px 1px 5px}.roster-unit{flex:0 0 128px;min-height:40px}.game-hand-panel{margin:8px 0;padding:8px}.game-hand-panel .hand-heading{justify-content:space-between}.game-hand-panel .hand-list{justify-content:flex-start;min-height:0}.hand-card{flex-basis:92px;height:112px}.command-panel .finish-activation,.command-panel .end-turn{width:auto;min-height:34px;padding:8px 12px}.game-heading{margin-bottom:10px}}
.game-exit{display:inline-flex;align-items:center;gap:6px;margin-left:5px;padding:7px 9px;border:1px solid #4c554f;background:#1c2220;color:#d5d9d0;font:600 8px var(--body);letter-spacing:.08em;cursor:pointer;white-space:nowrap}
.game-exit:hover{border-color:#d2a35d;color:#f2d59d}
@media(max-width:520px){.game-exit{padding:7px 8px;font-size:15px}.game-exit span{display:none}.game-meta{gap:7px}}

/* Clear, touch-friendly combat and door-roll presentation. */
.roll-action-dialog{width:min(940px,calc(100vw - 32px));max-width:none;max-height:min(96vh,1100px);overflow:auto;padding:0;border:1px solid #b18d55;border-radius:12px;background:linear-gradient(145deg,#292e2b,#111615);color:#eee9dc;box-shadow:0 24px 100px #000d}
.roll-action-dialog::backdrop{background:#030505d9;backdrop-filter:blur(5px)}
.roll-dialog-shell{padding:clamp(22px,4.5vw,42px)}
.roll-dialog-shell>.dialog-kicker{display:block;text-align:center}
.roll-dialog-shell h2{margin:10px 0 26px;text-align:center;font:600 clamp(27px,4.4vw,40px) var(--display)}
.roll-duel{display:grid;grid-template-columns:minmax(0,1fr) 56px minmax(0,1fr);align-items:stretch;gap:14px}
.roll-combatant{min-width:0;display:flex;flex-direction:column;align-items:center;text-align:center;padding:20px 16px 16px;border:1px solid #555b50;border-radius:8px;background:linear-gradient(160deg,#262c28,#171c1a)}
.roll-combatant.attacker{border-color:#aa844c}
.roll-combatant.defender{border-color:#657d77}
.roll-role{color:#b6a176;font-size:9px;font-weight:700;letter-spacing:.17em}
.roll-portrait{width:clamp(112px,20vw,168px);height:clamp(132px,24vw,190px);margin:12px 0 9px;display:grid;place-items:center;overflow:hidden;border:1px solid #ffffff1b;border-radius:6px;background:radial-gradient(ellipse at 50% 72%,#79613c55,#111615 70%)}
.roll-portrait img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 6px 9px #000b)}
.roll-portrait{position:relative}
.roll-combatant.is-destroyed .roll-portrait{animation:unitBlastFrame 1.45s ease-out both}
.roll-combatant.is-destroyed .roll-portrait img{animation:unitBlastFade 1.25s .12s ease-in both}
.roll-combatant.is-destroyed .roll-portrait::after{content:'✹';position:absolute;inset:-14%;display:grid;place-items:center;color:#fff4bc;font:900 clamp(90px,17vw,170px)/1 sans-serif;text-shadow:0 0 12px #fff4a8,0 0 32px #ff9c36,0 0 60px #f34f24;pointer-events:none;animation:blastBurst 1.15s ease-out both}
@keyframes blastBurst{0%{opacity:0;transform:scale(.08) rotate(-35deg)}24%{opacity:1;transform:scale(.8) rotate(12deg)}52%{opacity:.96;transform:scale(1.18) rotate(-8deg)}100%{opacity:0;transform:scale(1.9) rotate(18deg)}}
@keyframes unitBlastFrame{0%,20%{filter:brightness(1)}36%{filter:brightness(2.8) saturate(.3)}100%{filter:brightness(.45) saturate(.6)}}
@keyframes unitBlastFade{0%,30%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(.72) rotate(8deg)}}
.roll-combatant>strong{font:600 20px var(--display);line-height:1.1}
.roll-combatant>small{margin-top:7px;color:#a8b0a6;font-size:12px}
.roll-versus{align-self:center;color:#d3ae6c;font:700 15px var(--display);text-align:center}
.roll-result-dice{min-height:62px;width:100%;margin-top:auto;padding-top:12px}
.dice-caption{display:block;margin-bottom:7px;color:#818c83;font-size:8px;font-weight:700;letter-spacing:.13em;text-transform:uppercase}
.dice-row{min-height:38px;display:flex;justify-content:center;flex-wrap:wrap;gap:6px}
.roll-die{width:46px;height:46px;display:grid;place-items:center;border:1px solid #d6c49a;border-radius:8px;background:linear-gradient(145deg,#f0e5c8,#c6b78f);color:#18201b;font:800 25px var(--display);box-shadow:0 4px 9px #0008;animation:diceTumble .72s cubic-bezier(.15,.8,.25,1) both}
.roll-die.hit{border-color:#a9e3b6;background:linear-gradient(145deg,#d5f1d7,#7db78a);color:#102718;box-shadow:0 0 14px #7dcc8b66,0 4px 9px #0008}
.roll-die.miss{border-color:#9d7770;background:linear-gradient(145deg,#ddd3c9,#9c8983);color:#342321}
@keyframes diceTumble{0%{opacity:0;transform:translateY(-54px) rotate(220deg) scale(.55)}65%{opacity:1;transform:translateY(7px) rotate(-18deg) scale(1.08)}100%{opacity:1;transform:translateY(0) rotate(0) scale(1)}}
.roll-door-visual{width:clamp(84px,18vw,132px);height:clamp(100px,22vw,150px);margin:9px 0 6px;position:relative;display:grid;place-items:center;border:1px solid #ffffff1b;border-radius:6px;background:radial-gradient(ellipse,#6b513533,#111615 70%)}
.roll-door-visual span{width:68%;height:16%;border:2px solid #f0be69;background:linear-gradient(90deg,#303735,#93958a,#303735);box-shadow:0 0 12px #dfaa4d88}
.roll-door-visual.closed span:before{content:'';display:block;width:8px;height:8px;margin:calc(4% - 1px) auto;background:#ffe5a3;box-shadow:0 0 8px #ffd36c}
.roll-door-visual.open span{height:68%;width:16%;border-color:#85d5a3;background:#173329;box-shadow:0 0 16px #76d7a1aa}
.roll-door-visual.open span:after{content:'';display:block;width:38px;height:6px;position:absolute;left:28%;top:29%;transform:rotate(-55deg);transform-origin:left center;background:#dbc58d;border-radius:3px}
.roll-mine-visual{width:clamp(84px,18vw,132px);height:clamp(100px,22vw,150px);margin:9px 0 6px;position:relative;display:grid;place-items:center;overflow:hidden;border:1px solid #ffffff1b;border-radius:6px;background:radial-gradient(ellipse,#6a4d2c55,#111615 70%)}
.roll-mine-visual:before{content:'';position:absolute;width:48%;height:48%;border:2px solid #e1a952;border-radius:50%;background:radial-gradient(circle at 35% 30%,#68716b,#252b28 70%);box-shadow:0 0 13px #e3a44a88,inset 0 0 8px #000b}
.roll-mine-visual span{z-index:1;width:14%;height:14%;border-radius:50%;background:#f4c45f;box-shadow:0 0 12px #ffc755,0 0 24px #ed8d38}
.roll-mine-visual i{position:absolute;width:70%;height:5px;border-radius:4px;background:#a5a697;box-shadow:0 0 2px #080a09}
.roll-mine-visual i:after{content:'';position:absolute;inset:0;transform:rotate(60deg);border-radius:inherit;background:inherit}
.roll-combatant.mine-detonated .roll-mine-visual{animation:mineBlastFrame .85s ease-out both}
.roll-combatant.mine-detonated .roll-mine-visual:after{content:'✹';position:absolute;inset:-14%;z-index:2;display:grid;place-items:center;color:#fff2b0;font:900 clamp(82px,15vw,150px)/1 sans-serif;text-shadow:0 0 12px #fff4a8,0 0 32px #ff9c36,0 0 60px #f34f24;pointer-events:none;animation:blastBurst 1.1s ease-out both}
@keyframes mineBlastFrame{0%{filter:brightness(1);transform:scale(1)}22%{filter:brightness(3) saturate(.3);transform:scale(1.06)}52%{filter:brightness(1.5) sepia(.65);transform:scale(.92)}100%{filter:brightness(.45);transform:scale(.7);opacity:.35}}
.roll-summary{margin-top:15px;padding:12px 14px;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:5px 12px;border:1px solid #ffffff18;border-radius:7px;background:#111715}
.roll-summary>strong{color:#e9c27c;font:700 14px var(--display);white-space:nowrap}
.roll-summary>span{color:#aab3aa;font-size:10px;line-height:1.4}
.roll-preview{grid-column:1/-1;min-height:34px;display:flex;justify-content:center;gap:8px;padding-top:5px}
.roll-preview i{width:29px;height:29px;display:grid;place-items:center;border:1px solid #8b8067;border-radius:5px;background:#34372f;color:#e4d5b2;font-style:normal;font-weight:700}
.roll-preview.is-rolling i{animation:dicePreviewRoll .55s ease-in-out infinite alternate}
.roll-preview.is-rolling i:nth-child(2n){animation-delay:.12s}
@keyframes dicePreviewRoll{to{transform:translateY(-8px) rotate(18deg);background:#a5834c}}
.roll-dialog-status{min-height:52px;padding:16px 12px 8px;color:#e3c17d;text-align:center;font-size:16px;font-weight:700;line-height:1.45}
.roll-dialog-actions{display:flex;justify-content:center;gap:10px;margin-top:9px}
.roll-dialog-actions button{min-width:145px;padding:13px 18px;border-radius:5px;font:700 11px var(--body);letter-spacing:.08em;cursor:pointer}
.roll-confirm{border:1px solid #e0b56c;background:linear-gradient(140deg,#dfb675,#aa7840);color:#161915}
.roll-confirm:disabled{opacity:.55;cursor:wait}
.roll-cancel{border:1px solid #59625c;background:#202724;color:#d8ddd5}
.roll-cancel.hidden{display:none}
.roll-repeat{border:1px solid #91bc85;background:linear-gradient(140deg,#304d37,#1e3225);color:#d6f0ce;box-shadow:0 0 14px #92d58622}
.roll-repeat.hidden{display:none}
@media(max-width:560px){.roll-action-dialog{width:calc(100vw - 16px);max-height:96dvh}.roll-dialog-shell{padding:16px}.roll-dialog-shell h2{margin:8px 0 16px;font-size:26px}.roll-duel{grid-template-columns:minmax(0,1fr) 24px minmax(0,1fr);gap:5px}.roll-combatant{padding:12px 6px}.roll-portrait{width:clamp(82px,27vw,128px);height:clamp(96px,32vw,148px);margin:8px 0 6px}.roll-combatant>strong{font-size:15px}.roll-combatant>small{font-size:9px}.roll-role{font-size:7px}.roll-die{width:40px;height:40px;font-size:22px}.roll-dialog-status{font-size:14px}.roll-dialog-actions{flex-direction:column}.roll-dialog-actions button{width:100%}.roll-summary{grid-template-columns:1fr;text-align:center}.roll-summary>strong{white-space:normal}}
.heal-now{width:100%;margin-top:10px;padding:10px 12px;display:flex;align-items:center;justify-content:center;gap:8px;border:1px solid #7f9e81;border-radius:5px;background:linear-gradient(120deg,#26372d,#1a2520);color:#c2e1be;font:700 10px var(--body);letter-spacing:.05em;cursor:pointer;box-shadow:0 0 12px #83c18a22}
.heal-now span{font-size:10px}
.heal-now small{color:#aebca7;font-size:8px;font-weight:500}
.heal-now:disabled{opacity:.45;cursor:not-allowed}
.roll-heal-visual{width:clamp(84px,18vw,132px);height:clamp(100px,22vw,150px);margin:9px 0 6px;display:grid;place-items:center;border:1px solid #91be91;border-radius:6px;background:radial-gradient(ellipse,#5d995044,#111615 70%);color:#b9e4ac;font:600 64px var(--display);text-shadow:0 0 18px #91d184;box-shadow:inset 0 0 20px #76bd7040}
.roll-combatant.is-wounded .roll-portrait{animation:woundImpact .92s ease-out both}
.roll-combatant.is-wounded .roll-portrait img{animation:woundFigure .92s ease-out both}
.roll-combatant.is-wounded .roll-portrait::after{content:'✦';position:absolute;inset:-10%;display:grid;place-items:center;color:#ffe4b1;font:900 clamp(72px,13vw,132px)/1 sans-serif;text-shadow:0 0 10px #fff0c2,0 0 24px #ffb45f,0 0 42px #d95343;pointer-events:none;animation:woundFlash .86s ease-out both}
@keyframes woundImpact{0%{filter:brightness(1)}18%{filter:brightness(2.15) sepia(.5)}38%{filter:brightness(.78)}58%{filter:brightness(1.45) sepia(.35)}100%{filter:brightness(1)}}
@keyframes woundFigure{0%,18%{transform:translateX(0)}28%{transform:translateX(-5px) rotate(-2deg)}38%{transform:translateX(5px) rotate(2deg)}50%{transform:translateX(-3px)}64%,100%{transform:translateX(0)}}
@keyframes woundFlash{0%{opacity:0;transform:scale(.1) rotate(-24deg)}26%{opacity:1;transform:scale(.9) rotate(8deg)}55%{opacity:.8;transform:scale(1.16) rotate(-5deg)}100%{opacity:0;transform:scale(1.7) rotate(16deg)}}
.hand-card-info{position:absolute;right:7px;top:7px;width:22px;height:22px;display:grid;place-items:center;border:1px solid #f0d39888;border-radius:50%;background:#111715dd;color:#f4d18e;font:700 13px/1 sans-serif;cursor:help;z-index:2}
.hand-card-info:focus-visible{outline:2px solid #ffe0a0;outline-offset:2px}
.event-combat-dialog{width:min(760px,94vw);max-width:none;max-height:min(86vh,820px);padding:0;border:1px solid #cba96c;background:#1d2420;color:#eee4cf;box-shadow:0 24px 90px #000c}
.event-combat-dialog::backdrop{background:#090d0bd9;backdrop-filter:blur(5px)}
.event-combat-shell{padding:clamp(18px,4vw,32px)}
.event-combat-shell h2{margin:7px 0 18px;color:#f3d59c;font:700 clamp(25px,4vw,36px) var(--display)}
.event-combat-results{display:grid;gap:10px;max-height:55vh;overflow:auto}
.event-combat-row{display:grid;grid-template-columns:minmax(130px,1fr) 1.2fr;align-items:center;gap:18px;padding:12px;border:1px solid #ffffff1c;border-radius:8px;background:linear-gradient(110deg,#262d28,#141a17)}
.event-combat-unit{display:grid;grid-template-columns:58px 1fr;grid-template-rows:auto auto;align-items:center;gap:2px 10px}
.event-combat-portrait{grid-row:span 2;width:58px;height:68px;position:relative;overflow:hidden;display:grid;place-items:center;border:1px solid #ffffff20;border-radius:5px;background:radial-gradient(ellipse,#7e644238,#111615 75%)}
.event-combat-portrait img{width:100%;height:100%;object-fit:contain}
.event-combat-unit strong{font-size:14px}.event-combat-unit small{color:#b6b09f;font-size:11px}
.event-combat-dice{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:7px}
.event-combat-die{width:42px;height:42px;display:grid;place-items:center;border:1px solid #9d7770;border-radius:8px;background:linear-gradient(145deg,#ddd3c9,#9c8983);color:#342321;font:800 23px var(--display);font-style:normal;box-shadow:0 4px 9px #0008;animation:diceTumble .72s cubic-bezier(.15,.8,.25,1) both}
.event-combat-die.hit{border-color:#a9e3b6;background:linear-gradient(145deg,#d5f1d7,#7db78a);color:#102718}
.event-combat-die.miss{border-color:#9d7770}
.event-combat-die.box-miss{border-color:#777f83;background:linear-gradient(145deg,#90989a,#596166);color:#20282a;opacity:.68;text-decoration:line-through}
.event-combat-row.is-wounded .event-combat-portrait img{animation:woundFigure .92s ease-out both;filter:brightness(1.6) sepia(.35)}
.event-combat-row.is-destroyed .event-combat-portrait img{animation:unitBlastFade 1.25s .12s ease-in both}
.event-combat-close{width:100%;margin-top:18px;padding:12px;border:1px solid #d2ae6e;background:linear-gradient(110deg,#9c7540,#d3a35a);color:#171b17;font-weight:800;cursor:pointer}
@media(max-width:520px){.event-combat-row{grid-template-columns:1fr;gap:10px}.event-combat-dice{justify-content:flex-start}.event-combat-dialog{width:96vw}}

.event-roll-dialog{width:min(520px,92vw);max-width:none;padding:0;border:1px solid #d0a75f;background:radial-gradient(ellipse at 50% 0%,#51402a 0,#202722 58%);color:#f1e8d3;box-shadow:0 24px 100px #000d}
.event-roll-dialog::backdrop{background:#070b09d9;backdrop-filter:blur(6px)}
.event-roll-shell{padding:clamp(24px,5vw,42px);text-align:center}
.event-roll-shell h2{margin:8px 0 12px;color:#f2d397;font:700 clamp(25px,5vw,38px) var(--display)}
.event-roll-shell>p{margin:0 auto;max-width:38ch;color:#c9c2b2;line-height:1.55}
.event-roll-die{width:clamp(112px,25vw,156px);height:clamp(112px,25vw,156px);margin:24px auto 18px;display:grid;place-items:center;border:2px solid #d3b270;border-radius:22px;background:linear-gradient(145deg,#f0e5cc,#a18a62);color:#28251e;font:800 clamp(48px,12vw,76px)/1 var(--display);text-shadow:0 2px #fff8;box-shadow:inset 0 0 0 7px #3e35244c,0 12px 32px #0008}
.event-roll-die.is-rolling{animation:eventDieRoll .82s cubic-bezier(.2,.75,.25,1) infinite alternate}
.event-roll-die.is-success{border-color:#b2dfa1;background:linear-gradient(145deg,#d5ebbc,#7ca56c);box-shadow:inset 0 0 0 7px #253c234c,0 0 32px #82c96a77}
.event-roll-outcome{min-height:2.8em!important;margin:0 auto 18px!important;color:#e4d7b8!important;font-weight:650}
.event-roll-submit{width:100%;min-height:52px;border:1px solid #e2bd78;background:linear-gradient(105deg,#9b7135,#d4a75e);color:#1d211b;font:800 15px var(--body);letter-spacing:.035em;cursor:pointer}
.event-roll-submit:disabled{opacity:.68;cursor:wait}
@keyframes eventDieRoll{0%{transform:rotate(-9deg) translateY(-3px);filter:brightness(.94)}50%{transform:rotate(7deg) translateY(2px);filter:brightness(1.18)}100%{transform:rotate(-4deg) translateY(-1px);filter:brightness(1)}}

.undo-game-action{width:100%;margin-top:7px;padding:9px 10px;border:1px solid #555044;background:#272821;color:#d3c29f;font:600 10px var(--body);cursor:pointer}.undo-game-action:disabled{opacity:.38;cursor:not-allowed}.undo-game-action span{margin-left:5px}

.game-session-controls{display:grid;gap:6px;margin-top:10px;padding-top:9px;border-top:1px solid #ffffff18}.game-session-controls button{width:100%;padding:8px 9px;background:#202624;border:1px solid #48514b;color:#aeb8b0;text-align:left;font:500 9px var(--body);cursor:pointer}.game-session-controls button:hover{border-color:#c09a5e;color:#edddbc}#resumeSavedGameButton{margin-top:9px}
.lobby-remove-player{width:30px;height:30px;margin-left:8px;flex:0 0 auto;border:1px solid #a94d40;background:#422521;color:#ff8b75;border-radius:50%;font:700 22px/1 var(--body);cursor:pointer}.lobby-remove-player:hover{background:#713429;color:#fff1e8;box-shadow:0 0 14px #d25b4055}
.lobby-slot-toggle{flex:0 0 auto;margin-left:8px;padding:7px 9px;border:1px solid #67573d;background:#292820;color:#dfc58f;font:600 8px var(--body);letter-spacing:.04em;cursor:pointer}.lobby-slot-toggle:hover{border-color:#d0a867;background:#3a3325;color:#fff0cf}.lobby-slot-toggle.is-open{border-color:#425d4c;background:#1e2b23;color:#a8d1ad}.lobby-slot-toggle.is-open:hover{border-color:#74a982;background:#26382d;color:#e4f8e6}.lobby-player.closed{border-color:#3f4541;background:#111514;opacity:.58}.lobby-player.closed i{color:#849089}

.voice-controls{display:flex;align-items:center;gap:5px}.voice-icon-button{width:34px;height:34px;border:1px solid #5a604f;background:#1b211e;color:#e5d4a9;font-size:16px;cursor:pointer}.voice-icon-button:hover,.voice-icon-button.voice-active{border-color:#d3ac6c;box-shadow:0 0 12px #d3ac6c55}.voice-icon-button:disabled{opacity:.4;cursor:not-allowed}.voice-icon-button.voice-leave{font-size:19px;color:#e59a82;border-color:#775b4d}.voice-status{min-width:24px;color:#939f94;font-size:7px;letter-spacing:.08em;white-space:nowrap}
@media(max-width:720px){.voice-status{display:none}.voice-icon-button{width:30px;height:30px}}

/* Event hand slides in from the left edge, keeping area-confirm controls clear. */
.hand-edge-trigger{position:absolute;z-index:22;left:5px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;min-width:30px;min-height:118px;padding:10px 6px;border:1px solid #747c7f;background:#14191ddf;color:#d6dbe0;font:600 8px var(--body);letter-spacing:.13em;white-space:nowrap;cursor:pointer;backdrop-filter:blur(8px);box-shadow:3px 0 14px #0009;touch-action:manipulation}
.hand-edge-trigger .hand-trigger-arrow{color:#f0c67c;font-size:16px;line-height:1}.hand-edge-trigger .hand-trigger-label{writing-mode:vertical-rl;text-orientation:mixed}.hand-edge-trigger b{display:grid;place-items:center;min-width:17px;height:17px;border-radius:50%;background:#bd8e4e;color:#17191a;font-size:9px}
.game-hand-panel.hand-overlay{position:absolute;z-index:20;left:42px;top:50%;bottom:auto;width:min(680px,calc(100% - 50px));max-height:148px;margin:0;padding:8px 10px 5px;border:1px solid #737b7e;background:#11161bea;box-shadow:10px 0 30px #000b;backdrop-filter:blur(12px);opacity:0;visibility:hidden;pointer-events:none;transform:translate(-12px,-50%);transition:opacity .16s ease,transform .16s ease,visibility .16s ease}
.game-hand-panel.hand-overlay.is-open{opacity:1;visibility:visible;pointer-events:auto;transform:translate(0,-50%)}
.game-hand-panel.hand-overlay .hand-heading{justify-content:space-between;margin-bottom:5px;font-size:7px}
.game-hand-panel.hand-overlay .hand-list{flex-wrap:nowrap;justify-content:flex-start;min-height:0;max-height:120px;gap:7px;padding:2px 2px 6px;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain}
.game-hand-panel.hand-overlay .hand-card{flex:0 0 92px;height:102px;padding:6px 5px 7px}
.game-hand-panel.hand-overlay .hand-card-illustration{width:42px;height:42px;font-size:23px}
@media(max-width:720px){.game-hand-panel.hand-overlay{left:38px;top:50%;width:calc(100% - 44px);max-height:136px;padding:7px 7px 4px}.game-hand-panel.hand-overlay .hand-list{max-height:108px}.game-hand-panel.hand-overlay .hand-card{flex-basis:82px;height:94px}.game-hand-panel.hand-overlay .hand-card-illustration{width:38px;height:38px;font-size:21px}.hand-edge-trigger{left:4px;min-width:27px;min-height:108px;padding:8px 5px}}

/* Account gate, open lobby browser, and account administration. */
.account-controls{display:flex;align-items:center;gap:7px}.account-controls>span{max-width:145px;overflow:hidden;text-overflow:ellipsis;color:#d1b77d;font-size:9px;letter-spacing:.06em}.account-button{padding:7px 9px;border:1px solid #4b554e;background:#1a201d;color:#d9dfd7;font:600 8px var(--body);cursor:pointer}.account-button:hover{border-color:#c8a263;color:#f2d7a4}
.auth-screen{min-height:calc(100vh - 100px);display:grid;place-items:center;padding:30px 16px}.auth-screen.hidden{display:none}.auth-card{width:min(100%,460px);padding:clamp(22px,5vw,42px);border:1px solid #4a514b;background:linear-gradient(145deg,#1c221f,#121615);box-shadow:0 22px 70px #0008}.auth-card h1,.admin-heading h1{font:600 clamp(37px,6vw,57px)/.94 var(--display);margin:15px 0;color:#eeece3}.auth-card h1 em,.admin-heading h1 em{color:var(--gold);font-style:normal}.auth-card>p,.admin-heading p{color:#a4ada5;font-size:12px;line-height:1.55}.auth-form,.admin-create-form{display:grid;gap:14px;margin-top:24px}.auth-form .field,.admin-create-form .field{display:grid;gap:7px}.auth-form .field>span,.admin-create-form .field>span{font-size:8px;letter-spacing:.16em;color:#d2b176}.auth-form input,.admin-create-form input,.admin-create-form select{width:100%;box-sizing:border-box;background:#101514;border:1px solid #424c46;color:#eee8d9;padding:12px;font:500 13px var(--body)}.auth-form .button{width:100%;margin-top:3px}.auth-message{min-height:18px;color:#e4ae78;font-size:10px;line-height:1.5}.auth-bootstrap{margin-top:20px;padding:13px;border:1px solid #765c3d;background:#28231c;color:#ded2b8}.auth-bootstrap strong{font:600 13px var(--display)}.auth-bootstrap p{font-size:10px;line-height:1.5;color:#c2b79d}.auth-bootstrap code{display:block;white-space:normal;overflow-wrap:anywhere;padding:9px;background:#121412;color:#ebc57e;font-size:9px}
.open-lobbies{margin:0 0 22px;padding:16px 18px;border:1px solid #343d39;background:#151a19}.open-lobbies-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:11px}.open-lobbies-heading h2{font:600 20px var(--display);margin:5px 0 0;color:#eee9db}.open-lobby-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:8px}.lobby-list-empty{color:#89938c;font-size:10px;padding:10px 3px}.open-lobby-item{display:grid;grid-template-columns:1fr auto;gap:5px 10px;padding:12px;border:1px solid #3a463f;background:#111615}.open-lobby-item strong{font:600 14px var(--display);color:#e8e4d8}.open-lobby-item small{color:#929c94;font-size:8px;line-height:1.4}.open-lobby-item .button{grid-column:2;grid-row:1/3;align-self:center;padding:8px 10px;font-size:8px}.open-lobby-item .lobby-slots{color:#d3ad70}
.admin-screen{max-width:1240px;width:100%;margin:0 auto;padding:42px 0 30px}.admin-screen.hidden{display:none}.admin-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:22px}.admin-heading p{margin-top:10px}.admin-grid{display:grid;grid-template-columns:minmax(270px,.65fr) minmax(0,1.35fr);gap:14px}.admin-create-form{margin-top:16px}.admin-create-form .button{width:100%}.admin-user-list{display:grid;gap:8px}.admin-user-row{display:grid;grid-template-columns:minmax(100px,1fr) minmax(125px,.8fr) auto auto;align-items:center;gap:8px;padding:10px;border:1px solid #38413b;background:#131816}.admin-user-row strong{font-size:11px;color:#e9e6dc;overflow-wrap:anywhere}.admin-user-row small{display:block;color:#879289;font-size:8px;margin-top:3px}.admin-user-row select,.admin-user-row input{min-width:0;width:100%;box-sizing:border-box;background:#101514;border:1px solid #424c46;color:#e8e3d8;padding:8px;font:9px var(--body)}.admin-user-row button{border:1px solid #565c50;background:#202621;color:#e5d5b7;padding:8px;font:600 8px var(--body);cursor:pointer}.admin-user-row button.danger{color:#edaa93;border-color:#705247}.admin-user-row .user-lock{display:flex;align-items:center;gap:5px;color:#adb5ac;font-size:8px;white-space:nowrap}.admin-user-row .user-actions{display:flex;gap:5px}
/* Cards fan vertically from the left so they cover less of the tactical board. */
.game-hand-panel.hand-overlay{left:42px;top:12px;bottom:12px;width:min(168px,calc(100% - 50px));max-height:none;display:flex;flex-direction:column;transform:translateX(-12px)}
.game-hand-panel.hand-overlay.is-open{transform:translateX(0)}
.game-hand-panel.hand-overlay .hand-heading{flex:0 0 auto;display:grid;gap:4px;justify-content:start;padding:2px 3px 8px;border-bottom:1px solid #ffffff19}
.game-hand-panel.hand-overlay .hand-list{flex:1 1 auto;min-height:0;max-height:none;display:flex;flex-direction:column;flex-wrap:nowrap;justify-content:flex-start;overflow-x:hidden;overflow-y:auto;overscroll-behavior-y:contain;padding:7px 3px;gap:7px}
.game-hand-panel.hand-overlay .hand-card{flex:0 0 96px;width:100%;height:96px;box-sizing:border-box}
@media(max-width:720px){.account-controls>span{display:none}.account-button{padding:6px}.admin-screen{padding:28px 0}.admin-heading{align-items:flex-start;flex-direction:column}.admin-grid{grid-template-columns:1fr}.admin-user-row{grid-template-columns:1fr 1fr}.admin-user-row .user-actions{grid-column:1/-1}.game-hand-panel.hand-overlay{left:38px;top:10px;bottom:10px;width:min(158px,calc(100% - 46px));max-height:none;padding:7px}.game-hand-panel.hand-overlay .hand-list{max-height:none}.game-hand-panel.hand-overlay .hand-card{flex-basis:94px;height:94px}.open-lobbies{padding:12px}.open-lobbies-heading .button{padding:7px;font-size:8px}}