:root{color-scheme:dark;--bg:#222421;--panel:#2c2e29;--ink:#eee9db;--muted:#aaa99d;--gold:#c9ac70;--light:#ecd8b3;--dark:#ae825f}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:15px system-ui,sans-serif}header{max-width:1160px;margin:auto;padding:25px 30px;border-bottom:1px solid #ffffff14;display:flex;justify-content:space-between;align-items:center}header a{color:var(--gold);text-decoration:none;font:12px Georgia,serif;letter-spacing:3px}.brand{display:flex;align-items:center;gap:12px}.mark{border:1px solid #c9ac7060;border-radius:50%;width:32px;height:32px;display:grid;place-items:center;font:21px Georgia;color:var(--gold)}header span{color:var(--muted);font-size:12px}.intro{max-width:1100px;margin:26px auto 23px;display:flex;align-items:end;justify-content:space-between;padding:0 0}h1{font:normal 36px Georgia,serif;margin:4px 0 7px}.eyebrow{font-size:10px;letter-spacing:2.5px;color:var(--gold);text-transform:uppercase}.intro p{margin:0;color:var(--muted);font-size:13px}.free{font-size:11px;color:var(--gold);border:1px solid #c9ac7040;padding:7px 11px;border-radius:20px}.layout{max-width:1100px;margin:auto;display:grid;grid-template-columns:minmax(0,672px) minmax(260px,1fr);gap:30px}.player{display:flex;align-items:center;gap:10px;min-height:48px}.avatar{height:32px;width:32px;display:grid;place-items:center;background:#ffffff0a;border:1px solid #ffffff15;border-radius:5px;font-size:23px}.player strong{font-size:13px;font-weight:550}.player small{display:block;font-size:10px;color:var(--muted);margin-top:3px}.player .side{margin-left:auto;color:var(--muted);font-size:11px}.board{display:grid;grid-template-columns:repeat(8,1fr);aspect-ratio:1;border-radius:3px;overflow:hidden;box-shadow:0 15px 45px #0003}.sq{aspect-ratio:1;border:0;padding:0;position:relative;display:grid;place-items:center;background:var(--light);cursor:pointer;border-radius:0;touch-action:manipulation}.sq.dark{background:var(--dark)}.sq.last{background:#c6b65f}.sq.dark.last{background:#a89d46}.sq.selected{background:#d5c354;box-shadow:inset 0 0 0 3px #f4df76}.sq.check{background:#be6751}.sq:focus-visible{outline:3px solid white;outline-offset:-4px;z-index:2}.piece{display:block;width:100%;height:100%;pointer-events:none;overflow:visible}.piece text{font-family:'DejaVu Sans','Segoe UI Symbol','Arial Unicode MS',serif;font-size:100px;paint-order:stroke fill;stroke-linejoin:round}.white-piece text{fill:#fff8e9;stroke:#26251f;stroke-width:2.3}.black-piece text{fill:#24251f;stroke:#e5dbc4;stroke-width:.65}.rank,.file{position:absolute;font-size:11px;font-weight:650;color:#765239;pointer-events:none}.rank{top:4px;left:5px}.file{bottom:3px;right:5px}.dark .rank,.dark .file{color:#f4e3c7}.dot{position:absolute;width:24%;height:24%;border-radius:50%;background:#292b2540;pointer-events:none}.capture{position:absolute;inset:3%;border:5px solid #292b2540;border-radius:50%;pointer-events:none}.panel{background:var(--panel);border:1px solid #ffffff0b;border-radius:7px;margin-top:48px;align-self:start;overflow:hidden}.panel-head{padding:24px;border-bottom:1px solid #ffffff10}.panel h2{font:normal 24px Georgia;margin:10px 0 8px}.panel p{color:var(--muted);line-height:1.7;font-size:13px;margin:0}.status-row{display:flex;align-items:center;gap:7px;color:var(--gold);font-size:11px}.light{width:6px;height:6px;background:var(--gold);border-radius:50%}.instruction{padding:20px 24px}.new{background:var(--gold);color:#23251f;border:0;border-radius:4px;padding:13px 18px;font-weight:700;font-size:13px;width:100%;cursor:pointer}.new:hover{background:#dbbd80}.new:focus-visible{outline:2px solid white;outline-offset:3px}.ad-wrap{padding:22px 24px 24px;border-top:1px solid #ffffff10}.ad-label{text-align:center;font-size:9px;text-transform:uppercase;letter-spacing:2px;color:#97988b;margin:0 0 10px}.advert{height:250px;max-width:300px;margin:auto;border:1px dashed #ffffff20;display:flex;align-items:center;justify-content:center;flex-direction:column;color:#878a7e;gap:9px;background:#23251f60}.advert span{font:normal 25px Georgia;color:#a79b7c}.advert small{font-size:11px}footer{max-width:1100px;margin:18px auto 25px;padding-top:15px;border-top:1px solid #ffffff10;display:flex;justify-content:space-between;color:#929589;font-size:11px}dialog{background:var(--panel);color:var(--ink);border:1px solid var(--gold);border-radius:8px;padding:24px;text-align:center}dialog::backdrop{background:#0009}.promotions{display:flex;gap:8px}.promotions button{font-size:40px;width:64px;background:var(--light);color:#222;border:0;border-radius:4px;cursor:pointer}@media(max-width:1160px){.intro,.layout,footer{margin-left:25px;margin-right:25px}.layout{grid-template-columns:minmax(0,1fr) 310px;gap:22px}}@media(max-width:800px){header{padding:18px 18px}header span{display:none}.intro,.layout,footer{margin-left:14px;margin-right:14px}.intro{margin-top:22px}.layout{display:block;max-width:630px;margin-left:auto;margin-right:auto;padding:0 14px}.panel{margin-top:20px}.panel-head{padding:20px}.instruction{padding:16px 20px}.ad-wrap{padding:20px}.advert{width:100%}footer{line-height:1.6;gap:20px}h1{font-size:31px}.free{font-size:10px}.rank,.file{font-size:9px}}

.board-wrap{position:relative}.game-over{position:absolute;inset:0;background:#141711b8;z-index:5;display:grid;place-items:center;padding:20px;backdrop-filter:blur(2px)}.game-over[hidden]{display:none}.result-card{background:#2c2e29;border:1px solid #c9ac7080;box-shadow:0 15px 50px #0008;border-radius:8px;text-align:center;padding:30px;max-width:360px;width:100%}.result-card h2{font:normal 34px Georgia;margin:12px 0}.result-card p{color:var(--muted);line-height:1.6}.result-card .new{margin-top:10px}.view-board{background:transparent;border:0;color:var(--gold);padding:14px;cursor:pointer}.clock{margin-left:auto;font-variant-numeric:tabular-nums;font-size:24px;font-weight:650;color:var(--ink);background:#ffffff08;padding:4px 10px;border-radius:4px}.clock[hidden]{display:none}.clock.active{background:var(--light);color:#292b25}.clock.low{color:#e06855}.mode-switch{display:flex;gap:8px;margin-bottom:14px}.mode-switch button{flex:1;background:transparent;border:1px solid #ffffff25;color:var(--muted);padding:10px 5px;border-radius:4px;cursor:pointer;font:inherit;font-size:12px}.mode-switch button[aria-pressed=true]{border-color:var(--gold);color:var(--gold);background:#c9ac7010}.mode-switch button:focus-visible{outline:2px solid white}.player .side{margin-left:10px}#account-stats{font-size:12px;color:var(--gold);margin-top:15px;line-height:1.6}@media(prefers-reduced-motion:reduce){.piece{animation:none!important}}

/* Quatermain's Egyptian stone board: separate inset tiles, not a flat printed grid. */
.board{gap:2px;padding:5px;border:9px solid #80643c;border-radius:5px;background:#24231c;box-shadow:0 0 0 1px #c4a46680,0 0 0 4px #383b30,0 16px 45px #0006,inset 0 0 16px #0009;overflow:hidden}
.sq{background-color:#fff0cb;background-image:url('./assets/egyptian-limestone.png');background-size:350% 350%;background-position:var(--stone-x,0%) var(--stone-y,0%);background-blend-mode:multiply;border-radius:2px;box-shadow:inset 0 1px 1px #fff9,inset 1px 0 1px #fff5,inset 0 -2px 2px #51391b55,inset -1px 0 1px #51391b44}
.sq.dark{background-color:#b18b5e;background-image:url('./assets/egyptian-limestone.png');box-shadow:inset 0 1px 1px #e4c48b55,inset 1px 0 1px #e4c48b33,inset 0 -2px 2px #241a1166,inset -1px 0 1px #241a1155}
.sq::before{content:"";position:absolute;inset:2px;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20100%20100%22%20fill%3D%22none%22%20stroke%3D%22%23513d24%22%20stroke-width%3D%221.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M8%2023V8h15M77%208h15v15M8%2077v15h15M77%2092h15V77%22%2F%3E%3Cpath%20d%3D%22M79%2016c-4-6%204-9%204-3%200%203-4%203-4%203m0%200v11m-4-7h8%22%2F%3E%3Cpath%20d%3D%22M15%2084h15m-12-3%204-6%204%206m-10%206h13%22%2F%3E%3C%2Fsvg%3E");background-size:100% 100%;opacity:.23}
.sq.dark::before{opacity:.3}
.sq.last{background-color:#d9d194;background-image:url('./assets/egyptian-limestone.png');box-shadow:inset 0 0 0 2px #788d69b0,inset 0 2px 2px #fff5,inset 0 -2px 2px #4d392b55}
.sq.dark.last{background-color:#b5b276;background-image:url('./assets/egyptian-limestone.png')}
.sq.selected,.sq.dark.selected{background-color:#dbbd6c;background-image:url('./assets/egyptian-limestone.png');box-shadow:inset 0 0 0 3px #f5d078,inset 0 0 18px #ffd77766}
.sq.check,.sq.dark.check{background-color:#ce7968;background-image:url('./assets/egyptian-limestone.png');box-shadow:inset 0 0 0 3px #8b332b}
.sq .piece{position:relative;z-index:1;filter:drop-shadow(0 2px 1px #34261555)}
.rank,.file{z-index:2;color:#57432a;text-shadow:0 1px #fff4}
.dark .rank,.dark .file{color:#fff0c9;text-shadow:0 1px #49351f}
.dot{z-index:2;background:#253f37a6;box-shadow:0 0 0 2px #d8d3ac88}
.capture{z-index:2;border-color:#284b40ad}
.board-caption{display:flex;justify-content:center;align-items:center;gap:12px;color:#bda276;font-size:9px;letter-spacing:2.5px;text-transform:uppercase;margin:14px 0 0}
.board-caption::before,.board-caption::after{content:"";width:30px;height:1px;background:#c9ac7040}
.board-wrap{margin-top:5px}
@media(max-width:500px){.board{border-width:6px;padding:3px;gap:1px}.sq::before{inset:1px}.board-caption{font-size:8px;letter-spacing:2px}.rank{top:3px;left:3px}.file{bottom:2px;right:3px}}


.sq .carved-piece{width:100%;height:100%;filter:drop-shadow(0 2px 1px #251a1260)}

/* Captured pieces sit on their captor's side of the table. */
.layout>section{min-width:0}.captures{display:flex;align-items:center;gap:0;min-height:29px;padding:1px 5px;flex-wrap:wrap;max-width:100%;border-radius:3px;background:#171b162b}.captured-piece{display:block;width:26px;height:27px;flex:0 0 26px}.captured-piece svg{width:100%;height:100%;display:block}.board{grid-template-columns:repeat(8,minmax(0,1fr));grid-template-rows:repeat(8,minmax(0,1fr));width:100%;max-width:100%}.sq{min-width:0;min-height:0}.player .side{margin-left:auto}.player .clock:not([hidden])+.side{margin-left:10px}.panel{margin-top:82px}
@media(max-width:800px){
 header{padding:10px 12px}.brand{gap:8px}header a{font-size:10px;letter-spacing:1.8px}.mark{width:25px;height:25px;font-size:18px}
 .intro{margin:12px 12px 10px;align-items:center}.intro h1{font-size:26px;margin:1px 0 0}.intro .eyebrow{font-size:8px;letter-spacing:1.8px}.intro p{display:none}.free{font-size:9px;padding:5px 8px}
 .layout{width:100%;max-width:590px;padding:0 10px;margin:0 auto}.layout>section{width:100%}.player{min-height:34px;gap:7px}.player strong{font-size:12px}.player small{font-size:9px;margin-top:0}.avatar{width:25px;height:25px;font-size:19px}.clock{font-size:21px;padding:2px 8px}.player .side{font-size:9px}
 .board-wrap{width:min(100%,calc(100svh - 230px));margin:4px auto}.board{aspect-ratio:1}.captures{min-height:25px;max-width:min(100%,calc(100svh - 230px));margin:auto;padding:0 3px}.captured-piece{width:clamp(16px,5.3vw,25px);height:24px;flex-basis:clamp(16px,5.3vw,25px)}
 .board-caption{display:none}.panel{margin-top:12px}.panel-head{padding:14px 16px}.panel h2{font-size:22px;margin:7px 0}.panel p{font-size:12px}.instruction{padding:14px 16px}.advert{max-width:100%}.promotions button{width:52px;font-size:34px}.result-card{padding:18px}.result-card h2{font-size:27px}.result-card p{font-size:12px}.game-over{padding:12px}footer{margin:16px 12px;font-size:9px;flex-wrap:wrap;gap:6px}.rank,.file{font-size:8px}
}
@media(max-width:360px){header a{font-size:9px;letter-spacing:1.3px}.layout{padding:0 8px}.free{display:none}.result-card h2{font-size:23px}.result-card{padding:12px}.result-card .new{padding:10px}.view-board{padding:10px}.promotions{gap:5px}.promotions button{width:45px}}

/* The Egyptian Pyramid table. */
.layout>section{min-width:0}.panel{margin-top:48px}.table-heading{display:flex;align-items:center;justify-content:space-between;min-height:43px;color:var(--muted);font-size:11px}.table-heading strong{font:normal 17px Georgia;color:var(--gold)}.table-heading span:last-child{font-variant-numeric:tabular-nums}.pyramid-table{position:relative;container-type:inline-size;padding:17px 12px 12px;background:linear-gradient(#263126ef,#1c281fec),url('./assets/egyptian-limestone.png') center/cover;border:8px solid #80643c;border-radius:5px;box-shadow:0 0 0 1px #c4a46680,0 0 0 4px #383b30,0 16px 45px #0005,inset 0 0 25px #0005}.pyramid{position:relative;width:100%;aspect-ratio:1.43}.slot{position:absolute;left:calc(var(--x)*100%/7 + 2px);top:calc(var(--row)*10.9%);width:calc(100%/7 - 4px);aspect-ratio:5/7;border:1px solid #c1a26517;border-radius:4px}.slot .card{position:absolute;inset:-1px;width:calc(100% + 2px);height:calc(100% + 2px)}.card{padding:0;border:1px solid #9b7b45;border-radius:4px;background:#f8edcf;box-shadow:0 2px 4px #0005;cursor:pointer;text-align:left;font:normal clamp(10px,2cqw,14px) Georgia,serif;touch-action:manipulation;transition:box-shadow .15s,transform .15s}.card-face{position:absolute;inset:0;border:2px solid #fbf2d6;border-radius:3px;background:linear-gradient(#fff6e5d9,#edddbac9),url('./assets/egyptian-limestone.png') center/250%;overflow:hidden;display:block}.card-face::after{content:"";position:absolute;inset:4px;border:1px solid #a9864b38;border-radius:1px;pointer-events:none}.card-face.red{color:#a23c32}.card-face.black{color:#233b30}.corner{position:absolute;display:flex;flex-direction:column;align-items:center;z-index:2;line-height:1}.corner b{font-weight:700;font-size:1.24em;letter-spacing:-.7px}.corner i{font-style:normal;font-size:.95em;line-height:1.05}.corner.top{top:3px;left:4px}.corner.bottom{bottom:3px;right:4px;transform:rotate(180deg)}.pips{position:absolute;inset:20% 20%;display:block}.pip{position:absolute;transform:translate(-50%,-50%);font-size:clamp(8px,2.25cqw,17px);line-height:1}.ace .pip{font-size:clamp(20px,5.7cqw,40px)}.royal-emblem{position:absolute;inset:0;top:7%;height:86%;width:100%;fill:none;stroke:currentColor;stroke-width:2.1;stroke-linejoin:round}.royal-emblem circle:first-child{stroke:#ab8b50;stroke-width:.8}.royal-suit{position:absolute;left:50%;top:78%;transform:translate(-50%,-50%);font-size:1.1em}.card.covered{cursor:default;filter:brightness(.94)}.card.exposed:hover,.card.selectable:hover{box-shadow:0 0 0 2px #c9ac70,0 4px 9px #0006}.card:focus-visible,.stock-button:focus-visible{outline:3px solid #efd589;outline-offset:2px}.card.selected{box-shadow:0 0 0 3px #efcf7c,0 5px 12px #0007;transform:translateY(-3px)}.slot:has(.selected){z-index:20!important}.slot.cleared{border-color:#a68c4930}.slot.just-cleared{animation:sand-glow .65s ease-out}@keyframes sand-glow{from{background:#e9d08555;box-shadow:0 0 14px #e9d08566}to{background:transparent;box-shadow:none}}.stock-row{display:flex;align-items:start;justify-content:center;gap:clamp(18px,6cqw,43px);padding-top:15px;border-top:1px solid #c9ac7030}.pile{width:clamp(47px,14cqw,88px);text-align:center}.stock-button,.waste-space{display:block;position:relative;width:100%;aspect-ratio:5/7;border-radius:4px}.stock-button{padding:0;background:transparent;border:1px solid #ad9258;cursor:pointer;box-shadow:2px 2px 0 #99875e,3px 3px 0 #ddd0a4}.stock-button:disabled{cursor:default;box-shadow:none;opacity:.5}.waste-space{border:1px dashed #b99f664f}.waste-space .card{position:absolute;inset:0;width:100%;height:100%}.card-back{position:absolute;inset:0;background:linear-gradient(135deg,#2e493a,#14251d);border:3px solid #e2cea3;border-radius:3px;display:block}.card-back svg{position:absolute;width:100%;height:100%;inset:0;fill:none;stroke:#c6a664;stroke-width:1.1}.card-back b{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font:normal clamp(10px,2.6cqw,19px) Georgia;color:#cfb371;background:#23392b;padding:1px}.redeal-symbol,.empty-symbol{position:absolute;inset:0;display:grid;place-items:center;font-size:clamp(25px,7cqw,45px);color:var(--gold);background:#223326}.pile-label{font-size:10px;line-height:1.5;color:#c6b590;margin-top:8px;min-height:30px}.pile-label strong{display:block;color:#e7d5aa;font-size:11px;font-weight:500}.discard-seal{width:100%;aspect-ratio:5/7;display:flex;align-items:center;justify-content:center;flex-direction:column;color:var(--gold);gap:7px}.discard-seal strong{border:1px solid #b99d5c88;width:clamp(32px,8cqw,54px);height:clamp(32px,8cqw,54px);border-radius:50%;display:grid;place-items:center;font:normal clamp(16px,4cqw,27px) Georgia;box-shadow:inset 0 0 0 3px #263125,inset 0 0 0 4px #b99d5c55}.discard-seal small{font-size:9px;letter-spacing:1px}.value-key{text-align:center;color:#bba87d;font-size:10px;margin:9px 0 0;letter-spacing:.4px}.game-buttons{display:flex;gap:8px}.game-buttons .new{flex:1}.rules-button{flex:1;background:transparent;border:1px solid #c9ac7055;color:var(--gold);border-radius:4px;padding:10px 9px;font-size:12px;cursor:pointer}.rules-button:hover{background:#c9ac7010}.undo{width:100%;margin-top:12px;color:#d4c59f;background:#ffffff05;border:1px solid #ffffff20;border-radius:4px;padding:10px;cursor:pointer}.undo:disabled{opacity:.35;cursor:default}.progress-label{display:flex;justify-content:space-between;color:var(--muted);font-size:11px;margin:20px 0 8px}.progress{width:100%;height:5px;border:0;border-radius:3px;overflow:hidden;accent-color:var(--gold);background:#151e17}.progress::-webkit-progress-bar{background:#151e17}.progress::-webkit-progress-value{background:var(--gold)}.progress::-moz-progress-bar{background:var(--gold)}.stock-note{margin-top:13px!important;font-size:11px!important;text-align:center}.rules-dialog{max-width:540px;width:calc(100% - 28px);max-height:calc(100svh - 40px);overflow:auto;text-align:left;padding:25px}.rules-dialog h2{font:normal 28px Georgia;margin:9px 0 18px}.rules-dialog p,.rules-dialog li{font-size:14px;color:var(--muted);line-height:1.65}.rules-dialog ol{padding-left:22px}.rules-dialog li{margin:10px 0}.rules-dialog strong{color:var(--ink)}.rules-dialog .new{margin-top:12px}.pair-guide{display:flex;flex-wrap:wrap;justify-content:center;gap:7px;margin:18px 0}.pair-guide span{border:1px solid #c9ac7040;color:var(--gold);border-radius:3px;padding:6px 8px;font:14px Georgia}.game-over{z-index:40}.result-card{padding:25px}.result-card h2{font-size:30px}.small-note{font-size:11px!important;color:var(--muted)}
@media(max-width:800px){.layout{max-width:630px}.panel{margin-top:16px}.table-heading{min-height:31px;font-size:10px}.table-heading strong{font-size:15px}.pyramid-table{padding:12px 7px 8px;border-width:6px}.slot{width:calc(100%/7 - 3px);left:calc(var(--x)*100%/7 + 1.5px)}.stock-row{padding-top:11px}.pile-label{font-size:9px;margin-top:6px}.pile-label strong{font-size:10px}.card-face{border-width:1px}.corner.top{top:2px;left:3px}.corner.bottom{bottom:2px;right:3px}.corner b{font-size:1.12em}.corner i{font-size:.8em}.card-face::after{inset:3px}.card{border-radius:3px}.value-key{font-size:9px}.rules-dialog{padding:20px}.rules-dialog p,.rules-dialog li{font-size:13px}.intro h1{font-size:28px}.intro{gap:10px}.free{white-space:nowrap}.discard-seal small{font-size:8px}.result-card{padding:18px}.result-card h2{font-size:25px}}
@media(max-width:390px){.intro h1{font-size:25px}.free{display:none}.corner b{font-size:1.05em}.corner i{font-size:.75em}.pips{inset:22% 21%}.pip{font-size:8px}.pyramid-table{border-width:5px;padding-left:5px;padding-right:5px}.rules-button{font-size:11px}.result-card p{font-size:12px}}
@media(prefers-reduced-motion:reduce){.card{transition:none}.slot.just-cleared{animation:none}}

/* Removed-card slots are decorative: clicks must reach exposed cards above them. */
.pyramid .slot{pointer-events:none}
.pyramid .slot .card{pointer-events:auto}
/* Cribbage table */
.crib-table{padding:16px;background:linear-gradient(#263126ed,#1c281ff0),url('./assets/egyptian-limestone.png') center/cover;border:8px solid #80643c;border-radius:5px;box-shadow:0 0 0 1px #c4a46680,0 0 0 4px #383b30;container-type:inline-size}.panel{margin-top:43px}.scorebar{display:flex;justify-content:space-between;align-items:center;min-height:43px;gap:8px}.scorebar strong{font:normal 16px Georgia;color:var(--gold)}.scorebar span{font-size:12px;color:var(--muted)}.scorebar b{color:var(--ink);font-size:20px}.pegboard svg{display:block;width:100%}.hand-title{display:flex;justify-content:space-between;color:var(--gold);font-size:11px;margin:14px 0 8px}.hand{display:flex;justify-content:center;gap:7px;min-height:88px}.hand .card,.played-card,.starter-card{position:relative;width:clamp(40px,12cqw,75px);aspect-ratio:5/7;flex:0 0 auto}.hand .card:disabled{cursor:default}.hand .card.selected{transform:translateY(-5px)}.hand .card.unplayable{opacity:.5}.hand .card.face-down{cursor:default}.crib-middle{display:flex;align-items:center;gap:16px;border-top:1px solid #c9ac702b;border-bottom:1px solid #c9ac702b;padding:14px 0;margin:14px 0}.starter{flex:0 0 75px;text-align:center}.starter-card{display:block;width:100%;border:1px dashed #c9ac7055;border-radius:4px}.starter small{color:var(--muted);display:block;font-size:10px;margin-top:5px}.play-area{flex:1;min-width:0}.count-value{color:var(--gold);font:30px Georgia;text-align:center}.count-value small{font:11px system-ui;color:var(--muted);margin-left:5px}.pegged{display:flex;flex-wrap:wrap;justify-content:center;gap:4px;min-height:75px;margin-top:8px}.pegged .played-card{width:clamp(30px,8cqw,48px)}.played-card.you-played{box-shadow:0 2px #ead9a7}.played-card.bot-played{box-shadow:0 2px #7d9e85}.action{width:100%;margin-top:13px}.action:disabled{opacity:.4;cursor:default}.card-face{pointer-events:none}.hand-note{font-size:11px;color:var(--muted);text-align:center;margin:10px 0 0;line-height:1.5}.count-report{margin:12px 0;color:var(--muted);font-size:13px}.count-report p{margin:6px 0}.count-report strong{color:var(--gold)}.crib-log{max-height:130px;overflow:auto;border-top:1px solid #ffffff15;padding:12px 0 0;margin:16px 0 0;list-style:none;color:var(--muted);font-size:11px;line-height:1.7}.crib-log li:last-child{color:var(--gold)}.rules-button{width:100%;margin-top:10px}.crib-table .corner b{font-size:1.1em}.crib-table .corner i{font-size:.85em}.crib-table .pip{font-size:clamp(8px,2.1cqw,15px)}.crib-table .ace .pip{font-size:clamp(20px,5cqw,35px)}.rules-dialog{max-width:570px}.result-card{max-width:330px}.table-shell{position:relative}.crib-dealer{font-size:10px;color:var(--muted);margin-bottom:6px;text-align:center}.peek-label{font-size:10px;color:var(--gold)}
@media(max-width:800px){.panel{margin-top:16px}.crib-table{padding:10px 8px;border-width:6px}.hand{gap:4px;min-height:58px}.hand .card{width:calc((100% - 20px)/6);max-width:70px}.hand.four .card{width:clamp(43px,15cqw,70px)}.starter{flex-basis:52px}.crib-middle{gap:10px;padding:10px 0;margin:10px 0}.hand-title{margin-top:10px}.count-value{font-size:25px}.pegged{min-height:55px;gap:3px}.pegged .played-card{width:clamp(27px,8cqw,40px)}.crib-table .corner.top{left:2px;top:2px}.crib-table .corner.bottom{right:2px;bottom:2px}.crib-table .card{font-size:10px}.scorebar strong{font-size:13px}.scorebar span{font-size:10px}.scorebar b{font-size:18px}.intro h1{font-size:28px}.hand-note{font-size:10px}.crib-log{max-height:100px}}