*{box-sizing:border-box}body{margin:0;background:#0c1d21;color:#e9e7db;font:15px/1.5 system-ui,-apple-system,sans-serif;background-image:radial-gradient(ellipse at 20% 0%,#204448,transparent 65%)}main{max-width:1060px;padding:30px 28px 18px;margin:auto}header{display:flex;align-items:center;justify-content:space-between;gap:18px}.eyebrow{font-size:10px;letter-spacing:3px;color:#d6b77c;margin:0 0 7px}h1{font:42px/1.1 Georgia,serif;letter-spacing:-1px;margin:0}h1 span{display:block;font:13px/1.5 system-ui;letter-spacing:3px;color:#a9c1bc;text-transform:uppercase;margin-top:8px}.tools,.toolbar,.actions{display:flex;gap:8px;flex-wrap:wrap}button,select{font:inherit;color:#eee9da;border:1px solid #55716c;border-radius:7px;background:#203d3f;padding:10px 15px;min-height:44px;cursor:pointer}button:hover:not(:disabled){background:#345552;border-color:#d9bc81}button:disabled{opacity:.38;cursor:default}button:focus-visible,select:focus-visible{outline:3px solid #f6d48d;outline-offset:3px}.toolbar{margin-top:26px;align-items:end;padding-top:18px;border-top:1px solid #355053}.toolbar label{font-size:11px;color:#b5c7c2;display:grid;gap:4px;margin-right:auto}.toolbar select{min-width:245px}#new,#end,#transfer-choice{background:#d8bc83;color:#14282b;border-color:#d8bc83;font-weight:650}.stats{display:flex;flex-wrap:wrap;align-items:center;gap:24px;margin:20px 0 12px;font-size:10px;letter-spacing:1.7px;color:#9cb5b0}.stats b{font:18px Georgia;color:#f1dec0;margin-left:5px}#record{margin-left:auto;letter-spacing:.4px}.playmat{min-height:350px;background:#144044 url('birch-table.webp') center/cover;border:1px solid #93805b;border-radius:20px;padding:24px 35px;box-shadow:0 15px 45px #0004,inset 0 0 55px #0004;position:relative}.opponent{display:flex;justify-content:space-between;align-items:center;gap:20px}.seat{display:flex;align-items:center;gap:10px;text-shadow:0 2px 5px #000}.seat small{display:block;color:#b9c7b9;font-size:11px}.avatar{display:grid;place-items:center;background:#1a3230;border:1px solid #b5a379;border-radius:50%;width:38px;height:38px;font:24px Georgia;color:#ddc28b}#opponent-cards{display:flex;max-width:65%;overflow:hidden;padding:5px}.back{width:35px;height:49px;border-radius:5px;border:2px solid #c4ab75;margin-left:-12px;background:linear-gradient(45deg,#193b3d99,#182d33aa),url('birch-table.webp') center/190px;box-shadow:0 2px 4px #0006;flex:none}.back:first-child{margin-left:0}#table{display:flex;justify-content:center;align-items:center;gap:28px 18px;min-height:200px;flex-wrap:wrap;padding:28px 10px 20px}.slot{width:95px;height:135px;position:relative;cursor:pointer;border-radius:8px}.slot.selected{outline:2px dashed #f4d596;outline-offset:6px}.slot .card{position:absolute;left:0;top:0}.slot .cover{top:24px;left:16px;transform:rotate(8deg)}#table-note{text-align:center;font:italic 14px Georgia;color:#dbd7bb;min-height:22px;text-shadow:0 1px 5px #000}.card{position:relative;width:78px;height:110px;background:#f4efdf;color:#193135;border:1px solid #d4c8ab;border-radius:8px;box-shadow:0 4px 8px #0004;padding:7px;display:flex;flex-direction:column;align-items:start;justify-content:space-between;line-height:1;flex:none;min-width:0;min-height:0;font:22px Georgia}.card.red{color:#a63b38}.card .pip{position:absolute;inset:0;display:grid;place-items:center;font-size:34px;pointer-events:none}.card .bottom{align-self:end;transform:rotate(180deg)}.card .top,.card .bottom{z-index:1;font-size:17px}.card .tiny{font-size:13px;display:block}.card.trump::after{content:'◆';position:absolute;font-size:10px;color:#99713b;right:7px;top:8px}.decision{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:20px 0}#status{font-size:16px;color:#f1dfbb;max-width:540px}.your-hand{background:#152e32;border:1px solid #385051;border-radius:12px;padding:16px}.hand-label{display:flex;justify-content:space-between;gap:12px;font-size:12px;color:#b3c6be;margin-bottom:18px}.hand-label span{font-size:11px}#hand{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;padding:4px 0 8px}#hand .card{cursor:pointer;transition:transform .15s,box-shadow .15s}#hand .card:disabled{opacity:.62}#hand .card:not(:disabled){outline:2px solid #a7cfa9;outline-offset:2px}#hand .card:not(:disabled):hover{background:#fff9e9;transform:translateY(-6px)}#hand .card.suggested{outline:3px solid #f5c969;transform:translateY(-6px)}.key{position:absolute;bottom:-15px;font:10px system-ui;color:#afc1b7;left:33px}#coach{font-size:12px;color:#a8c5bb;min-height:20px;text-align:center}footer{font-size:11px;color:#789a93;display:flex;justify-content:space-between;margin-top:20px}dialog{background:#f3efdf;color:#1f3737;border:1px solid #b5a67f;border-radius:16px;max-width:620px;width:calc(100% - 36px);padding:30px;max-height:85vh;overflow:auto;box-shadow:0 25px 90px #0008}dialog::backdrop{background:#071819c9}dialog h2{font:30px Georgia;margin-top:0}dialog h3{font:20px Georgia}dialog p,dialog li{font-size:14px}dialog a{color:#2a6960}dialog button{margin:8px 4px 0 0}dialog[open]{animation:appear .15s ease}#take{border-color:#ad8173}#next{background:#d8bc83;color:#14282b}#next[hidden]{display:none}@keyframes appear{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}@media(max-width:650px){main{padding:19px 14px}h1{font-size:32px}.eyebrow{font-size:8px;letter-spacing:2px}.tools{gap:5px;max-width:116px}.tools button{font-size:11px;padding:7px 10px;width:100%}.toolbar{margin-top:20px;gap:7px}.toolbar label{width:100%}.toolbar select{width:100%}.toolbar button{font-size:12px;padding:9px 12px;flex:1}.stats{gap:15px;margin-top:16px}#record{display:none}.playmat{min-height:310px;padding:18px 16px;border-radius:14px}.seat small{font-size:10px}#table{padding:25px 0 16px;gap:22px 7px;min-height:175px}.slot{width:78px;height:112px}.card{width:62px;height:89px;padding:5px}.card .top,.card .bottom{font-size:15px}.card .tiny{font-size:10px}.card .pip{font-size:28px}.slot .cover{top:19px;left:12px}.decision{flex-direction:column;align-items:stretch;gap:10px;margin:15px 0}#status{font-size:14px}.actions{justify-content:center}.actions button{flex:1;font-size:13px}.hand-label{flex-direction:column;gap:3px;margin-bottom:14px}#hand{gap:18px 9px}.your-hand{padding:14px 10px}footer{font-size:10px;gap:10px}.key{left:27px}#table-note{font-size:12px}.opponent{gap:5px}#opponent-cards{max-width:50%}.back{width:26px;height:37px;margin-left:-15px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
