:root{--gold: #c9a24b;--gold-bright: #e8c34a;--gold-light: #ffd873;--paper: #f6efdd;--ink: #221d15;--red-suit: #a02330;--cream: #e8dfc8;--dim: #b9c4b8;--muted: #7d8a7c;--teal: #41c9b0;--danger: #e04b3a}*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}[hidden]{display:none!important}html,body{height:100%;overflow:hidden}body{font-family:Palatino,Iowan Old Style,Palatino Linotype,Georgia,serif;background:radial-gradient(1200px 700px at 50% 30%,#17402d 0%,transparent 65%),radial-gradient(900px 600px at 50% 110%,#10301f 0%,transparent 60%),#081810;color:var(--paper);user-select:none}button{font-family:inherit;cursor:pointer}#board-canvas{position:fixed;inset:0;width:100%;height:100%;outline:none;touch-action:none}#overlay{position:fixed;inset:0;pointer-events:none}#overlay>*{pointer-events:auto}.tour-anchor{position:absolute;pointer-events:none!important}#anchor-battlefield{left:18%;right:18%;top:30%;height:40%}#anchor-your-rows{left:18%;right:18%;top:52%;height:30%}.plaque{position:absolute;left:14px;display:flex;align-items:center;gap:10px;background:#050e09d1;border:1px solid rgba(201,162,75,.45);border-radius:12px;padding:8px 14px;font-size:15px;cursor:pointer;transition:box-shadow .25s,border-color .25s}#plaque-opp{top:14px}#plaque-you{bottom:148px}.plaque.active{border-color:var(--gold);box-shadow:0 0 18px #c9a24b59}.plaque .avatar{font-size:26px;color:var(--gold)}.plaque .pname{font-weight:700;letter-spacing:.04em}.plaque .life{color:#e88;font-weight:700;font-size:17px}.plaque .counts{color:var(--dim);font-size:13px}.plaque .pool{color:var(--gold-light);font-size:13px}.plaque .pool .red{color:#ff9c8a}.plaque.hit{animation:hit .5s ease}@keyframes hit{0%{box-shadow:0 0 30px #e04b3ae6;transform:scale(1.06)}to{transform:scale(1)}}#phase-ribbon{position:absolute;top:14px;left:50%;transform:translate(-50%);display:flex;gap:8px;align-items:center;font-family:ui-monospace,Menlo,monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;background:#050e09bf;border:1px solid rgba(201,162,75,.35);padding:6px 14px;border-radius:999px;color:var(--muted)}#phase-ribbon span.on{color:var(--gold-light);font-weight:700}#phase-ribbon i{font-style:normal;opacity:.5}#turn-banner{position:absolute;top:52px;left:50%;transform:translate(-50%);font-size:14px;color:var(--dim);text-align:center}#turn-banner .gameover{font-size:22px;color:var(--gold-light)}#stack-panel{position:absolute;right:14px;top:90px;width:230px;background:#050e09e0;border:1px solid rgba(201,162,75,.5);border-radius:12px;padding:10px 12px;font-size:13.5px}#stack-panel h4{color:var(--gold);font-size:12px;letter-spacing:.1em;text-transform:uppercase;margin-bottom:8px}.stack-item{padding:7px 9px;border-radius:8px;margin-bottom:6px;border:1px solid transparent;cursor:pointer}.stack-item.mine{background:#41c9b024;border-color:#41c9b080}.stack-item.theirs{background:#e04b3a26;border-color:#e04b3a80}.stack-item:first-of-type{box-shadow:0 0 10px #ffd87340}#hand{position:absolute;bottom:-18px;left:50%;transform:translate(-50%);display:flex;align-items:flex-end;justify-content:center;height:150px;padding:0 10px}#hand.emphasize .hcard{box-shadow:0 0 16px #e8c34acc}.hcard{width:84px;height:118px;margin:0 -9px;position:relative;background:var(--paper);border-radius:10px;border:2px solid var(--ink);transition:transform .15s ease,box-shadow .15s ease;flex:none;color:#171310;text-align:center}.hcard.red{color:var(--red-suit)}.hcard .hc-rank{position:absolute;top:5px;left:7px;font-size:16px;font-weight:700;line-height:1;text-align:left}.hcard .hc-center{position:absolute;inset:0 0 16px;display:grid;place-items:center;font-size:36px}.hcard .hc-cost{position:absolute;top:4px;right:5px;background:var(--ink);color:var(--gold-light);font-size:12px;font-weight:700;border-radius:8px;padding:2px 6px;line-height:1.2}.hcard .hc-info{position:absolute;bottom:4px;left:3px;right:3px;text-align:center;font-size:12px;font-weight:700;white-space:nowrap;overflow:hidden}#hand.classic .hc-cost,#hand.classic .hc-info{display:none}#hand.classic .hc-center{inset:0;font-size:40px}.hcard.playable{box-shadow:0 0 14px #41c9b0bf;cursor:pointer}.hcard.playable:hover{transform:translateY(-26px) scale(1.12)!important;z-index:5}.hcard.dim{opacity:.85;cursor:pointer}#opp-hand{position:absolute;top:8px;right:260px;display:flex;gap:3px;max-width:40vw;flex-wrap:wrap;justify-content:flex-end;align-items:center}.opp-count{color:var(--cream);font-size:13px;font-weight:700;background:#050e09bf;border:1px solid rgba(201,162,75,.4);border-radius:999px;padding:3px 9px;margin-right:4px}.ocard{width:34px;height:46px;border-radius:5px;font-size:13px;font-weight:700;display:grid;place-items:center;background:var(--paper);border:1px solid var(--ink);color:#171310}.ocard.red{color:var(--red-suit)}.ocard.back{background:linear-gradient(145deg,#1e3d2c,#142a1e);border-color:var(--gold);color:#c9a24bd9;font-size:9px;letter-spacing:1px}#prompt-bar{position:absolute;bottom:158px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:12px;max-width:94vw;background:#050e09d1;border:1px solid rgba(201,162,75,.4);border-radius:999px;padding:8px 10px 8px 20px}#prompt-text{font-size:14px;color:var(--cream);line-height:1.35;max-width:44vw;max-height:2.8em;overflow:hidden}#prompt-text:empty{display:none}#btn-primary{background:linear-gradient(180deg,var(--gold-bright),var(--gold));color:var(--ink);font-weight:700;font-size:15px;border:none;border-radius:999px;padding:10px 22px;box-shadow:0 2px #00000080;letter-spacing:.02em}#btn-primary.attention{animation:pulseGold 1.6s ease infinite}#btn-primary:disabled{background:#45443c;color:#93917f;cursor:default;box-shadow:none;animation:none}@keyframes pulseGold{0%,to{box-shadow:0 2px #00000080}50%{box-shadow:0 2px #00000080,0 0 22px #e8c34acc}}#btn-primary:active{transform:translateY(1px)}.btn-sec{background:transparent;color:var(--cream);border:1px solid rgba(201,162,75,.5);border-radius:999px;padding:8px 14px;font-size:13px;margin-left:6px}.btn-sec:hover{background:#c9a24b26}#speed-controls{position:absolute;bottom:14px;left:14px;display:flex;align-items:center;gap:8px;background:#050e09d1;border:1px solid rgba(201,162,75,.4);border-radius:999px;padding:6px 14px}#speed-controls button{background:none;border:none;color:var(--cream);font-size:17px}#speed-controls input[type=range]{width:110px;accent-color:var(--gold)}#speed-label{font-family:ui-monospace,Menlo,monospace;font-size:12px;width:26px;color:var(--gold-light)}#corner-buttons{position:absolute;top:14px;right:14px;display:flex;gap:8px}#corner-buttons button{width:40px;height:40px;border-radius:50%;font-size:17px;background:#050e09d1;border:1px solid rgba(201,162,75,.45);color:var(--cream)}#corner-buttons button:hover{background:#c9a24b33}#log-panel,#notes-panel{position:absolute;right:14px;top:64px;bottom:80px;width:320px;background:#050e09f0;border:1px solid rgba(201,162,75,.5);border-radius:14px;padding:14px;overflow:hidden;display:flex;flex-direction:column;z-index:20}#log-panel h4,#notes-panel h4{color:var(--gold);margin-bottom:8px;font-size:14px}.log-lines{overflow-y:auto;font-size:13px;line-height:1.5;color:#cfd8cd;flex:1}#notes-panel textarea{width:100%;min-height:64px;background:#ffffff12;color:var(--paper);border:1px solid rgba(201,162,75,.4);border-radius:8px;padding:8px;font-family:inherit;font-size:13.5px;resize:vertical}.notes-actions{display:flex;gap:6px;margin:8px 0}.notes-actions button{flex:1;background:#c9a24b26;color:var(--cream);border:1px solid rgba(201,162,75,.4);border-radius:8px;padding:6px;font-size:12.5px}.notes-list{overflow-y:auto;flex:1}.note{border-top:1px solid rgba(201,162,75,.25);padding:8px 2px;font-size:13px}.note-meta{color:var(--muted);font-size:11px;font-family:ui-monospace,Menlo,monospace}.note-action{color:#9fb0a0;font-size:11px;font-family:ui-monospace,Menlo,monospace;word-break:break-all;margin:2px 0}.picker-backdrop{position:fixed;inset:0;background:#03080599;display:grid;place-items:center;z-index:40}.picker{background:var(--paper);color:var(--ink);border-radius:16px;padding:22px;width:min(430px,92vw);max-height:80vh;overflow-y:auto;box-shadow:0 20px 60px #0009}.picker h3{margin-bottom:12px;font-size:19px}.picker-list{display:flex;flex-direction:column;gap:8px}.picker-opt{text-align:left;background:#fff;border:1.5px solid rgba(34,29,21,.3);border-radius:10px;padding:11px 14px;font-size:15px;display:flex;flex-wrap:wrap;gap:6px;align-items:center}.picker-opt:hover{border-color:var(--red-suit);background:#a023300d}.po-label{font-weight:600}.po-tag{font-size:10.5px;background:var(--gold);color:var(--ink);font-weight:700;border-radius:4px;padding:2px 6px;letter-spacing:.06em}.po-sub{width:100%;font-size:12.5px;color:#6b5d3f}.picker-cancel{margin-top:12px;width:100%;background:none;border:1px solid rgba(34,29,21,.35);border-radius:10px;padding:9px;font-size:14px}.chip-card{display:inline-block;background:#fff;border:1px solid var(--ink);color:#171310;border-radius:6px;padding:2px 7px;margin:2px;font-weight:700;font-size:14px}.chip-card.red{color:var(--red-suit)}.mull-hand{margin-bottom:12px}.inspect-lines p{margin:7px 0;font-size:14.5px;line-height:1.5;color:#3a3428}.inspect-lines b{color:#171310}#toast{position:fixed;bottom:200px;left:50%;transform:translate(-50%);background:var(--gold);color:var(--ink);font-weight:600;border-radius:10px;padding:10px 20px;z-index:60;font-size:14px;box-shadow:0 10px 30px #00000080}#tour-root .tour-dim{position:fixed;inset:0;z-index:70}#tour-root .tour-spot{position:fixed;z-index:71;border-radius:14px;border:2px solid var(--gold-light);box-shadow:0 0 0 9999px #030805b8,0 0 24px #ffd87380;transition:all .35s ease;pointer-events:none}.tour-bubble{position:fixed;z-index:72;width:min(380px,92vw);background:var(--paper);color:var(--ink);border-radius:16px;padding:20px 22px;box-shadow:0 20px 60px #0000008c}.tour-bubble h3{font-size:19px;margin-bottom:8px;color:var(--red-suit)}.tour-bubble p{font-size:14.5px;line-height:1.55}.tour-dots{display:flex;gap:5px;margin:14px 0 4px}.tour-dots i{width:7px;height:7px;border-radius:50%;background:#221d1540}.tour-dots i.on{background:var(--red-suit)}.tour-buttons{display:flex;gap:8px;margin-top:10px;justify-content:flex-end}.tour-buttons button{border-radius:999px;padding:8px 18px;font-size:14px;border:1px solid rgba(34,29,21,.35);background:none}.tour-buttons .t-next{background:linear-gradient(180deg,var(--gold-bright),var(--gold));border:none;font-weight:700}.tour-buttons .t-skip{border:none;color:#6b5d3f;margin-right:auto}#menu{position:fixed;inset:0;z-index:50;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:radial-gradient(1000px 600px at 50% 20%,rgba(23,64,45,.9) 0%,transparent 65%),#081810f5}.menu-suits{font-size:22px;letter-spacing:16px;color:var(--gold);margin-left:16px}.menu-suits .r{color:#d05560}#menu h1{font-size:clamp(46px,10vw,84px);letter-spacing:.08em;text-shadow:0 3px 0 #000,0 0 50px rgba(201,162,75,.3)}.menu-sub{color:var(--dim);font-style:italic;margin-bottom:26px}.menu-buttons{display:flex;flex-direction:column;gap:12px;width:min(320px,86vw)}.menu-buttons button{font-size:18px;padding:15px;border-radius:14px;border:1px solid rgba(201,162,75,.5);background:#050e09cc;color:var(--paper);letter-spacing:.02em;transition:all .2s}.menu-buttons button:hover{background:#c9a24b2e;transform:translateY(-2px)}#menu-tutorial{border-color:var(--gold);box-shadow:0 0 24px #c9a24b40}.menu-footer{margin-top:30px;display:flex;gap:20px;align-items:center;color:var(--muted);font-size:13px}.menu-footer select{background:#0b1d14;color:var(--cream);border:1px solid rgba(201,162,75,.4);border-radius:6px;padding:4px 8px;font-family:inherit}#lobby{position:fixed;inset:0;z-index:55;display:grid;place-items:center;background:#081810f5}.lobby-box{width:min(430px,92vw);background:#050e09e6;border:1px solid rgba(201,162,75,.5);border-radius:18px;padding:28px;display:flex;flex-direction:column;gap:12px}.lobby-box h2{color:var(--paper);letter-spacing:.03em}.lobby-sub{color:var(--dim);font-size:14px}.lobby-box input{background:#ffffff14;border:1px solid rgba(201,162,75,.4);border-radius:10px;padding:12px 14px;color:var(--paper);font-family:inherit;font-size:16px}.lobby-box input:focus{outline:2px solid var(--gold)}.lobby-primary{background:linear-gradient(180deg,var(--gold-bright),var(--gold));color:var(--ink);font-weight:700;border:none;border-radius:12px;padding:13px;font-size:16px}.lobby-back{background:none;border:1px solid rgba(201,162,75,.4);color:var(--cream);border-radius:12px;padding:10px;font-size:14px}.lobby-list{display:flex;flex-direction:column;gap:8px;max-height:40vh;overflow-y:auto}.lobby-game{display:flex;align-items:center;gap:10px;background:#ffffff0d;border:1px solid rgba(201,162,75,.3);border-radius:10px;padding:10px 14px}.lg-host{color:var(--paper);font-weight:600;flex:1}.lg-age{color:var(--muted);font-size:12px}.lobby-game button{background:#c9a24b33;border:1px solid rgba(201,162,75,.5);color:var(--gold-light);border-radius:8px;padding:7px 14px;font-size:13px;font-weight:600}.lobby-empty{color:var(--muted);text-align:center;padding:18px;font-style:italic}.lobby-status{color:#d05560;font-size:13px;min-height:18px;text-align:center}.lobby-spinner{text-align:center;color:var(--gold);font-size:22px;letter-spacing:12px;animation:spinPulse 1.6s ease infinite}@keyframes spinPulse{0%,to{opacity:.4}50%{opacity:1}}@media(max-width:760px){.plaque{padding:6px 10px;font-size:13px;gap:7px;left:8px}#plaque-you{bottom:118px}.plaque .avatar{font-size:20px}.hcard{width:66px;height:94px;border-radius:8px;margin:0 -7px}.hcard .hc-center{font-size:26px}.hcard .hc-rank{font-size:12px}.hcard .hc-cost{font-size:10px;padding:1px 4px}.hcard .hc-info{font-size:10px;bottom:3px}#hand{height:118px;bottom:-12px}#prompt-bar{bottom:128px;padding:6px 8px 6px 14px;gap:8px}#prompt-text{font-size:12px;max-width:44vw}#btn-primary{font-size:13.5px;padding:9px 16px}#phase-ribbon{top:58px;font-size:9.5px;padding:5px 10px;gap:5px;left:8px;transform:none}#turn-banner{top:88px;font-size:12px;left:8px;transform:none;text-align:left}#corner-buttons{top:8px;right:8px}#opp-hand{right:8px;top:54px;max-width:55vw}.ocard{width:26px;height:36px;font-size:11px}#stack-panel{width:180px;font-size:12px;top:74px}#log-panel,#notes-panel{inset:56px 8px 130px;width:auto}#corner-buttons button{width:36px;height:36px;font-size:15px}#speed-controls{bottom:8px;left:8px;padding:5px 10px}#speed-controls input[type=range]{width:70px}}
