:root{color-scheme:dark;--ink:#f4ead6;--muted:#b9b8a9;--gold:#e9ba70;--line:#ffffff22}*{box-sizing:border-box}body{margin:0;background:#101e1c;color:var(--ink);font:16px/1.5 system-ui,Segoe UI,sans-serif;background-image:radial-gradient(ellipse at 25% 20%,#28453c66,transparent 65%)}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button,nav a{border:1px solid var(--line);border-radius:7px;color:var(--ink);background:#ffffff08;padding:10px 16px;cursor:pointer;min-height:44px;text-decoration:none}button:hover,nav a:hover{border-color:var(--gold);background:#ffffff12}button:disabled{opacity:.45;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #ffe09a;outline-offset:3px}header{display:flex;align-items:center;justify-content:space-between;gap:20px;max-width:1400px;margin:auto;padding:25px 32px;border-bottom:1px solid var(--line)}.brand{text-decoration:none;color:var(--ink)}.brand small{display:block;font-size:10px;letter-spacing:2.4px;color:var(--gold)}.brand strong{font:34px Georgia,serif}nav{display:flex;gap:8px;flex-wrap:wrap}main{max-width:1280px;margin:auto;padding:24px}#welcome{display:grid;grid-template-columns:1.1fr 1fr;gap:70px;align-items:center;min-height:72vh}.eyebrow{font-size:10px;letter-spacing:2px;color:var(--gold);font-weight:650}h1{font:clamp(45px,6vw,82px)/1.06 Georgia,serif;letter-spacing:-2px;margin:22px 0}h2{font:28px Georgia,serif;margin:8px 0 20px}.intro p{color:var(--muted);max-width:360px}.panel{background:#172c27;border:1px solid #a9b6a32c;border-radius:14px;padding:28px;box-shadow:0 18px 60px #0002}label{display:block;font-size:13px;color:var(--muted);margin:8px 0}input,select{display:block;width:100%;padding:11px;border:1px solid #ffffff30;border-radius:5px;background:#0e211d;color:var(--ink);margin-top:5px;min-height:46px}input[type=color]{width:64px;padding:5px}.formrow{display:flex;gap:15px}.formrow label:first-child{flex:1}.formrow label{flex:1}.formrow label:has(input[type=color]){flex:0}.primary{background:var(--gold);color:#242719;font-weight:700;border-color:var(--gold)}.primary:hover{background:#f8ce8e}.primary span{float:right}#setup>button{width:100%;margin-top:12px}.scorebar{display:flex;justify-content:space-between;gap:12px;margin:0 4px 12px}.score{display:flex;align-items:center;gap:12px}.score strong{font:38px Georgia}.score small{display:block;color:var(--muted);font-size:11px}.dot{height:12px;width:12px;border-radius:50%;box-shadow:inset 0 2px 2px #fff7,0 2px 4px #000}.score.active{color:var(--gold)}#board{background:repeating-linear-gradient(2deg,#72482f22 0 2px,#1e100822 3px 4px),linear-gradient(110deg,#b7804c,#ca9b61 45%,#946234);border:6px solid #66402c;border-radius:44px;box-shadow:inset 0 1px 4px #f9dba2aa,0 8px 20px #0007;margin-bottom:18px;padding:4px 10px}#board svg{width:100%;display:block;max-height:184px}.hole{fill:#3f2b20;stroke:#e2b980;stroke-width:.6}.peg{stroke:#fff8;stroke-width:1;filter:drop-shadow(1px 3px 1px #0008)}.boardlabel{font:9px system-ui;fill:#34281c;font-weight:bold}.felt{position:relative;border:1px solid #71917b44;border-radius:18px;background:radial-gradient(ellipse at top,#31534877,transparent 80%),repeating-linear-gradient(0deg,transparent 0 2px,#00000008 3px 4px),#18372e;box-shadow:inset 0 0 55px #0004;padding:20px 26px}.tabletop{display:flex;justify-content:space-between;gap:15px;align-items:start}.starter,.crib{text-align:center}.cards{display:flex;align-items:center;gap:8px;min-height:70px}.card{position:relative;flex-shrink:0;border:1px solid #cfcbba;border-radius:8px;width:70px;height:98px;min-height:0;background:linear-gradient(140deg,#fffef3,#e9e3d4);box-shadow:0 4px 8px #0004;color:#1c302d;font:26px Georgia;padding:6px;text-align:left;line-height:1;transform:translateY(0);transition:transform .2s,box-shadow .2s}.card.red{color:#ac3036}.card .pip{display:block;font:36px Georgia;text-align:center;line-height:1.4}.card .corner{position:absolute;right:5px;bottom:5px;font-size:14px;transform:rotate(180deg)}.card:hover{background:linear-gradient(140deg,#fffef3,#e9e3d4)}button.card:hover{transform:translateY(-6px)}.card.selected,.card.highlight{transform:translateY(-12px);box-shadow:0 0 0 3px var(--gold),0 8px 14px #0006}.card.unplayable{opacity:.5}.card.playable{border-bottom:4px solid var(--gold)}.back{background:repeating-linear-gradient(45deg,#476568 0 2px,#233f40 2px 6px);border:4px solid #d6cfb8;box-shadow:inset 0 0 0 2px #bba77b,0 3px 6px #0005}.backs{gap:0;margin-top:8px}.backs .card{width:40px;height:56px;margin-left:-18px}.backs .card:first-child{margin-left:0}.pegzone{display:flex;align-items:center;gap:22px;min-height:123px;border-bottom:1px solid #ffffff15;margin:10px 0}.total{width:90px;flex-shrink:0;text-align:center}.total small{font-size:8px;letter-spacing:1px;display:block;color:var(--gold)}.total strong{font:48px Georgia;display:block;line-height:1.1}.total>span{font-size:11px;color:var(--muted)}#played{flex-wrap:wrap;gap:4px}#played .card{width:49px;height:69px;font-size:19px}#played .pip{font-size:24px}#played .corner{font-size:10px}#status{font-size:17px;font-weight:600;min-height:27px}#handLabel{margin:9px 0 15px}.hand{justify-content:center;min-height:112px}.actions{display:flex;justify-content:center;gap:8px;margin-top:14px;flex-wrap:wrap}#feedback{min-height:20px;text-align:center;font-size:13px;color:var(--gold);margin:8px 0 0}.connection{display:flex;justify-content:space-between;align-items:center;margin:10px 0;font-size:13px}.history{margin:18px 4px}.history summary{cursor:pointer;color:var(--muted);padding:10px 0}.history li{font-size:13px;padding:4px 0}.history select{width:auto}#countPanel{margin-top:16px}#countCards{margin-top:18px}#breakdown{display:flex;flex-wrap:wrap;gap:7px;margin-top:18px}#breakdown button{font-size:13px}#practiceArea{display:flex;gap:12px;align-items:end;flex-wrap:wrap}#guess{max-width:100px}dialog{max-width:620px;width:calc(100% - 28px);background:#18372e;color:var(--ink);border:1px solid #a58d62;border-radius:16px;padding:30px;box-shadow:0 20px 80px #0009;max-height:90vh}dialog::backdrop{background:#07130fea;backdrop-filter:blur(8px)}.close{float:right;font-size:22px}dialog h3{color:var(--gold)}dialog a{color:#ffd490}#privacy{text-align:center}footer{max-width:1280px;padding:18px 28px;margin:0 auto;font-size:9px;letter-spacing:2px;color:#879c90;display:flex;justify-content:space-between;gap:20px}[hidden]{display:none!important}.enter{animation:deal .35s both}.victory{animation:glow 1s alternate 4}@keyframes deal{from{opacity:0;transform:translate(25px,-15px) rotate(6deg)}to{opacity:1;transform:none}}@keyframes glow{to{box-shadow:0 0 45px #e9ba7066}}body.no-motion *,body.no-motion *::before{animation:none!important;transition:none!important}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}@media(max-width:700px){header{padding:15px;align-items:start;gap:8px}.brand small{font-size:7px;letter-spacing:1px}.brand strong{font-size:28px}nav{justify-content:flex-end;gap:5px;max-width:235px}nav button,nav a{font-size:11px;padding:6px 9px;min-height:36px}main{padding:12px}#welcome{grid-template-columns:1fr;gap:20px;min-height:0}.intro{padding:10px}.intro h1{font-size:43px;margin:14px 0}.intro h1 br{display:none}.intro p{margin:8px 0}.panel{padding:20px}.felt{padding:13px 10px;border-radius:12px}#board{border-width:4px;padding:3px 0;margin-bottom:12px;border-radius:20px}.score strong{font-size:29px}.score{gap:7px;font-size:13px}.scorebar{margin-bottom:8px}.score small{font-size:9px}.card{width:52px;height:78px;font-size:21px;border-radius:6px;padding:4px}.card .pip{font-size:28px}.card .corner{font-size:11px}.hand{gap:5px;min-height:90px}#status{font-size:14px}.eyebrow{font-size:8px;letter-spacing:1px}.backs .card{width:29px;height:42px;margin-left:-16px}.pegzone{min-height:98px;margin:4px 0;gap:8px}.total{width:66px}.total strong{font-size:37px}#played .card{width:35px;height:50px;font-size:14px;padding:3px}#played .pip{font-size:18px}#played .corner{font-size:8px}#played{gap:2px;min-height:55px}.tabletop .starter .card{width:42px;height:60px;font-size:17px}.tabletop .starter .pip{font-size:22px}.cards{min-height:48px}.actions{margin-top:8px}.actions button{font-size:13px;padding:8px 13px}.total small{font-size:7px}#feedback{margin-top:6px}footer span{display:none}.connection{font-size:11px}#countCards{gap:5px}#countPanel{padding:15px}.history{margin-top:8px}.boardlabel{font-size:10px}}@media(max-width:365px){.hand{gap:3px}.hand .card{width:45px;height:72px}main{padding:8px}}@media(max-height:550px) and (min-width:700px){header{padding:8px 24px}main{padding-top:12px}#board svg{max-height:100px}.felt{padding:12px 18px}.tabletop{float:right;width:40%}.pegzone{width:57%;margin-top:0}.hand{min-height:85px}.hand .card{height:78px;width:58px}#status{clear:both}}

.turn-card{animation:turn-card .45s ease both}.shuffle{animation:shuffle .45s ease both}@keyframes turn-card{from{transform:rotateY(90deg)}to{transform:rotateY(0)}}@keyframes shuffle{0%,100%{transform:translateX(0) rotate(0)}35%{transform:translateX(-10px) rotate(-7deg)}70%{transform:translateX(6px) rotate(5deg)}}