:root{color-scheme:light;--ink:#173d35;--cream:#f4f0e5;--gold:#e8c77b;--muted:#6d766d}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font:15px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}button,select{font:inherit}button{cursor:pointer;border:1px solid #bcbfae;border-radius:8px;padding:9px 15px;background:#fffdf5;color:var(--ink);transition:transform .12s,background .12s}button:hover:enabled{background:#e9dec2;transform:translateY(-2px)}button:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid #c89e42;outline-offset:3px}button:disabled{cursor:default;opacity:.42}header{max-width:1320px;padding:22px 34px;margin:auto;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #d8d7c8}.brand{display:flex;gap:12px;align-items:center;text-decoration:none;color:var(--ink);font-size:29px}.brand span{font-size:13px;font-weight:750;letter-spacing:2px}.brand small{display:block;font-size:10px;font-weight:400;letter-spacing:.6px}main{max-width:1320px;padding:26px 34px;margin:auto}.intro{display:flex;justify-content:space-between;gap:25px;align-items:center;margin-bottom:25px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:2px;margin:0 0 7px}h1{font:46px/1.1 Georgia,serif;margin:0}h1 em{font-weight:400;color:#97713b}.intro p:last-child{margin:10px 0;color:var(--muted)}.setup{display:flex;align-items:end;gap:10px}.setup label{font-size:11px;color:var(--muted)}select{display:block;border:1px solid #c9caba;background:#fffdf6;padding:10px;border-radius:8px;color:var(--ink);max-width:220px}.setup button,#ready{background:var(--ink);color:var(--cream);border-color:var(--ink)}.layout{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:24px}.table{position:relative;border-radius:24px;background:radial-gradient(ellipse at 50% 30%,#316455,#153c33 90%);box-shadow:inset 0 0 0 6px #28493b,inset 0 0 0 8px #a79153,0 15px 40px #173d3525;padding:28px 30px 18px;color:#f3edda;overflow:hidden}.table:before{content:"";position:absolute;inset:14px;border:1px solid #d7bd7045;border-radius:15px;pointer-events:none}.opponent,.you{display:flex;align-items:center;justify-content:space-between;position:relative;z-index:1}h2{font:25px/1.1 Georgia,serif;margin:0}h2 small{font:11px/1.4 -apple-system,sans-serif;color:#dcc691;margin-left:7px}.table .eyebrow{color:#b1c7b7}.score{display:flex;align-items:center;gap:9px}.score b{font:30px Georgia,serif;color:var(--gold)}.score span{font-size:10px;width:33px;line-height:1.3}.card{position:relative;display:inline-flex;flex-direction:column;align-items:center;justify-content:center;background:#fffaf0;border:1px solid #e2d7bb;border-radius:9px;width:104px;height:148px;box-shadow:0 5px 10px #0003;color:#264936;vertical-align:middle;padding:9px 7px}.card img{width:86%;height:78%;object-fit:contain;mix-blend-mode:multiply;pointer-events:none}.card .rank{position:absolute;top:4px;left:8px;font:bold 21px Georgia,serif}.card .point{position:absolute;bottom:5px;right:7px;font-size:10px;color:#6f6d55}.card .suit{font-size:9px;position:absolute;bottom:5px;left:7px}.card.red{color:#a7343f}.card.gold{color:#9c7027}.back{width:44px;height:62px;border:2px solid #dfc684;border-radius:5px;box-shadow:0 3px 6px #0002;background:repeating-linear-gradient(45deg,#28493b 0px,#28493b 4px,#3b5f4d 4px,#3b5f4d 6px);display:inline-block;margin-left:-8px}.back:after{content:"♧";display:block;color:#d6bd75;text-align:center;line-height:55px;font-size:30px}#backs{text-align:center;height:70px;margin:10px 0 0}.middle{display:flex;align-items:center;justify-content:center;min-height:169px;gap:40px}.stock{width:85px;text-align:center}.stock .card{width:66px;height:93px}.stock .rank{font-size:16px}.stock .point,.stock .suit{font-size:7px}.stock small{display:block;font-size:10px;line-height:1.3;margin-top:6px;color:#c2cdbd}#trick{display:flex;gap:15px;align-items:center;justify-content:center;min-width:235px;min-height:158px}.slot{width:104px;height:148px;border:1px dashed #c1cdae55;border-radius:9px;display:grid;place-items:center;color:#bed0be;font-size:11px}.trick-card{text-align:center}.trick-card>small{display:block;font-size:9px;color:#b9c9b6;margin-bottom:3px}#notice{border-top:1px solid #a1bb9d30;padding:12px 2px 5px;min-height:53px;text-align:center;font-size:14px;color:#f3e9c9}#actions{display:flex;flex-wrap:wrap;gap:7px;justify-content:center;min-height:45px;margin-bottom:10px}#actions button{background:#274c3d;color:#ecdfb7;border:1px solid #b9b4796b;padding:6px 11px;font-size:12px}#actions .primary{background:#e5c77d;color:#263d2e;border-color:#e5c77d}.you{margin-bottom:12px}#hand{display:flex;justify-content:center;gap:10px;min-height:148px}#hand .card{flex-shrink:1;min-width:0;animation:deal .2s ease-out}#hand .card:enabled{box-shadow:0 0 0 2px #e5c77d,0 6px 12px #0003}#hand .card:disabled{opacity:.55}#hand .card:hover:enabled{transform:translateY(-9px);background:#fffaf0}.key{position:absolute;top:-11px;right:6px;width:20px;height:20px;font-size:11px;line-height:18px;border-radius:20px;background:#dfc684;color:#203c2e;border:1px solid #ffe3a1}.table-foot{font-size:9px;color:#b7c7b2;display:flex;justify-content:space-between;margin-top:18px;gap:8px}.under{display:flex;gap:8px;padding:16px 0;align-items:center}.under button{font-size:12px}.under span{font-size:10px;margin-left:auto;color:var(--muted)}.aside-card{border:1px solid #d5d5c4;border-radius:14px;padding:19px;margin-bottom:16px;background:#faf7ef}.aside-card p{font-size:12px;color:#606f61}.aside-card h3{font:22px/1.1 Georgia,serif;margin:10px 0 15px}.match-row{display:flex;justify-content:space-between;font-family:Georgia,serif;font-size:22px}.match-row b{font-weight:400;color:#97713b}.match p:last-child{margin-bottom:0}#journal{padding-left:17px;margin:10px 0 0;font-size:11px;color:#647363}#journal li{margin-bottom:7px}footer{text-align:center;color:var(--muted);font-size:10px;padding:20px}a{color:inherit}dialog{background:#fffaf0;color:var(--ink);border:1px solid #c7b485;border-radius:18px;padding:32px;max-width:600px;width:calc(100% - 32px);max-height:85dvh}dialog::backdrop{background:#102e27b5;backdrop-filter:blur(3px)}dialog p{font-size:14px}.close{float:right;font-size:22px;padding:0 9px}@keyframes deal{from{transform:translateY(6px);opacity:.6}}@media(max-width:1000px){main,header{padding-left:20px;padding-right:20px}.layout{grid-template-columns:minmax(0,1fr) 225px}.table{padding:25px 22px 17px}h1{font-size:38px}.setup{display:block}.setup button{margin-top:7px}#hand{gap:7px}.card{width:91px;height:133px}.middle{gap:25px}}@media(max-width:760px){header{padding:14px 16px}.brand small{font-size:9px}main{padding:20px 12px}.intro{align-items:start;gap:12px}h1{font-size:34px}.intro p:last-child{font-size:12px;max-width:240px}.setup{width:155px;flex-shrink:0}select{width:100%;font-size:11px;padding:8px}.setup button{font-size:11px;padding:8px;width:100%}.layout{display:block}.table{padding:23px 18px 17px;border-radius:18px}.middle{min-height:160px;gap:20px}#hand{gap:7px}.card{width:96px;height:136px}aside{display:grid;grid-template-columns:1fr 1fr;gap:10px}aside .aside-card{margin:0}aside .aside-card:nth-child(2){grid-row:span 2}h2{font-size:22px}.under span{max-width:98px;line-height:1.3}footer{padding:22px 5px}#trick{min-width:210px}}@media(max-width:420px){h1{font-size:29px}.intro .eyebrow{font-size:8px}.setup{width:138px}.card{width:61px;height:96px;padding:5px}.card .rank{font-size:17px;left:5px}.card .point{font-size:7px;bottom:4px;right:4px}.card .suit{font-size:7px;left:4px;bottom:4px}.card img{width:90%;height:72%}#hand{min-height:96px;gap:5px}.slot{width:77px;height:112px}#trick .card{width:77px;height:112px}.middle{gap:15px;min-height:155px}#trick{min-width:173px;gap:9px}.table{padding:22px 17px 16px}.score b{font-size:26px}.score span{font-size:9px}.table-foot{font-size:8px}.you .eyebrow{font-size:9px}#notice{font-size:12px}.under button{padding:8px 9px}aside .aside-card{padding:14px}.aside-card h3{font-size:20px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}