:root{--ink:#e0dfdb;--paper:#202a30;--pink:#c88f9d;--teal:#89b9ae;--yellow:#c2ad7e;--line:#44515a;--shadow:0 18px 46px #090f1425;color-scheme:dark;background:var(--paper);color:var(--ink)}
body{background:radial-gradient(ellipse at 70% 0,#34424a60,transparent 60%),var(--paper)}
.grain{background-image:radial-gradient(#a0b8bd09 .7px,transparent .7px)}
button{background:#35424a;color:#e6e5df;border-color:#526069}button:hover:not(:disabled){background:#40515a;box-shadow:0 7px 20px #0a141b45}input,select{background:#26353c;border-color:#51616a;color:#e2e6e4}input::placeholder{color:#99a7af}
p,.muted,.help-line,.how-strip small,.position-label{color:#adb9be}.eyebrow,.art-note{color:#b3beb4}.brand{color:#e5e0d5}.brand i{color:#a9b7b8}.hero em{color:#a9c7bb}.hero-art{background:radial-gradient(ellipse,#59636240,transparent 69%)}
.panel,.entry{background:#2b373e;border-color:#44535b}.board{background:#222e35;border-color:#43545e;padding:28px 16px 24px;overflow:visible}.board .eyebrow{color:#b9c6c5}.primary{background:#94b9ae;color:#192c2b;border-color:#94b9ae;font-weight:600}.primary:hover:not(:disabled){background:#aecbbf}.accent{background:#718f93;border-color:#859da0;color:#f5f2e9}.quiet{background:transparent}.linkbutton{color:#a9ccc0;background:transparent}.pill{color:#bdc8ca;border-color:#53616a}.how-strip{border-color:#44515a}.status-banner{background:#334a47;border-color:#526d64;color:#e0e9de}.status-banner.attention{background:#4a493e;border-color:#756f54;color:#e9dfc9}.status-banner small{color:#c3ccc3}
.seat,.result{background:#243239;border-color:#495b65}.seat.occupied{background:#33444c}.seat small,.tip{color:#b2c0c4}.score-row{border-color:#4c5b63}.score-row .muted{color:#b3c3c5}.score-row b,.player-chip .score{color:#b1d3c2}.player-chip{background:#30414a;border-color:#526670;color:#d9e5e5}.player-chip.ready{background:#354e44;border-color:#6c8a76}.result.match{background:#3a4e45;border-color:#718776}.award{background:#99bbae;color:#16342c}.round-dot.current{background:#a6c7b9;color:#16332c;border-color:#a6c7b9;box-shadow:0 0 0 4px #adcac314}.round-dot.done{background:#405b50;color:#cadacf}.team-card{background:#354b49}.message b{color:#a7cfbe}.numbers button.selected{background:#a6c7b9;color:#18312d;border-color:#aecaba}.reactions button{background:transparent}.team-card h3{margin-bottom:8px}
dialog{background:#29363e;border-color:#62717a;color:#e4e8e5}dialog p,.rules-list{color:#bbc8cd}dialog a{color:#a5cdbb}dialog::backdrop{background:#101a23bb;backdrop-filter:blur(3px)}#toast{background:#c3d7ca;color:#193c32;border:1px solid #d5e5da}footer{border-color:#415159;color:#a1b1b7}
.layout{grid-template-columns:minmax(0,1fr) 250px;gap:22px}.panel.table{padding:24px}.picker{grid-template-columns:minmax(0,1fr) 175px;align-items:start;gap:25px}.choice-preview{position:sticky;top:24px}.choice-preview .card{width:150px;margin-bottom:20px}.choice-preview small{font-size:12px;color:#bfc9ca;line-height:1.6}.choice-preview button{padding:15px 12px}.patterns{display:block}.color-group{margin:0 0 25px}.color-label{display:flex;align-items:center;gap:8px;text-transform:uppercase;letter-spacing:1.8px;font-size:10px;font-family:Arial;font-weight:600;color:#becacb;margin-bottom:13px}.color-label:before{content:'';width:9px;height:9px;flex-shrink:0;border-radius:50%;background:#80b5af}.color-label.red:before{background:#c68d9c}.color-label.yellow:before{background:#c9b281}.color-hand{display:flex;justify-content:center;gap:0;padding:4px 9px 0}.hand-slot{width:clamp(95px,32%,130px);position:relative;margin-right:-5px;transform:rotate(var(--fan));transition:transform .25s}.hand-slot:nth-child(2){transform:translateY(-4px) rotate(var(--fan))}.hand-slot:last-child{margin-right:0}.hand-slot:hover{z-index:5}.patterns .card{max-width:none;width:100%;border-radius:12px}.animal-label{display:block;text-align:center;font-size:10px;letter-spacing:1px;text-transform:uppercase;color:#b5c4c8;padding-top:14px;pointer-events:none}
.card{--rx:0deg;--ry:0deg;--foil-x:50%;--foil-y:50%;--near-x:0px;--near-y:0px;background-image:none;background-color:#e9e6f1;border:2px solid #c0bccb;box-shadow:0 4px 0 #727780,0 10px 22px #09151e45;isolation:isolate;transition:transform .23s cubic-bezier(.2,.8,.25,1),box-shadow .23s,border-color .23s;transform-style:preserve-3d;will-change:auto;color:#182e67}
.card-print,.card-animal,.card-foil{position:absolute;inset:0;pointer-events:none;border-radius:inherit}.card-print,.card-animal{background-image:url('/assets/cards.png');background-size:1000% 500%;background-position:var(--cx) var(--cy)}.card-print{clip-path:inset(0 0 78% 0);z-index:1}.card-animal{clip-path:inset(21% 0 0 0);transform-origin:50% 94%;animation:animal-breathe var(--life-duration,8s) ease-in-out infinite;animation-delay:var(--life-delay,0s);z-index:1}.animal-dog .card-animal{animation-name:dog-curiosity}.animal-cat .card-animal{animation-name:cat-breathe}.animal-bird .card-animal{animation-name:bird-tilt}
.card-foil{z-index:3;opacity:.06;background:radial-gradient(ellipse at var(--foil-x) var(--foil-y),#ffffffb8 0%,#fff3 20%,transparent 56%),linear-gradient(115deg,transparent 8%,#a3ddca77 24%,#c5bbef66 40%,#f0d5ae55 57%,#a6d7e066 73%,transparent 90%);mix-blend-mode:soft-light;background-size:100% 100%,210% 210%;background-position:center,var(--foil-x) var(--foil-y);transition:opacity .25s}.card:not(.question):after{content:'';position:absolute;inset:0;border-radius:inherit;z-index:4;pointer-events:none;border:1px solid #e4f5e92a;box-shadow:inset 0 1px 0 #fff8}
.card.pointer-hover,.card:not(:disabled):focus-visible{transform:perspective(850px) translate3d(var(--near-x),calc(var(--near-y) - 9px),0) rotateX(var(--rx)) rotateY(var(--ry)) scale(1.045);box-shadow:0 5px 0 #747c87,0 22px 32px #08131b60;border-color:#d5d6d0;z-index:5}.card.pointer-hover .card-foil,.card:focus-visible .card-foil{opacity:.32}.patterns [aria-pressed="true"]{border:3px solid #7db6a4;box-shadow:0 0 0 3px #8abb9d25,0 16px 27px #10242060;transform:translateY(-5px) scale(1.025)}.patterns [aria-pressed="true"].pointer-hover{transform:perspective(850px) translateY(-12px) rotateX(var(--rx)) rotateY(var(--ry)) scale(1.07)}
.card.near-card{transform:translate3d(var(--near-x),var(--near-y),0);transition:transform .18s ease-out}.patterns .card:disabled{opacity:.55;filter:grayscale(.5);cursor:not-allowed}.card:disabled .card-animal{animation-play-state:paused}.patterns .card:disabled:after{content:'ON TABLE';inset:auto 2px 9px;height:auto;padding:4px 2px;background:#26364de8;border:0;color:#e5e8ef;font-size:8px;letter-spacing:.5px;text-align:center;box-shadow:none;border-radius:5px}.card.question{color:#b7c5c4;background:#31434a;border-color:#687d82;box-shadow:0 4px 0 #17252e;font-size:clamp(48px,6vw,85px)}.card.question:after{color:#b0c2c6}.card.question.drop-near{border-color:#8ab9a2;background:#3d5751;box-shadow:0 0 0 5px #89b49a15,0 8px 24px #0b1b24}.card.question.drop-ready{background:#4c695b;border-color:#b1d2ae;box-shadow:0 0 0 7px #99b98e22,0 12px 28px #102d1e50;transform:scale(1.04)}
.sequence{gap:14px}.sequence .card:hover{filter:none}.sequence button:hover{transform:translateY(-6px) scale(1.035)}.sequence .card.pointer-hover{transform:perspective(850px) translateY(-8px) rotateX(var(--rx)) rotateY(var(--ry)) scale(1.045)}.result .card{max-width:135px}.result{padding:20px 14px}.results{gap:18px}.team-card .card{width:115px}.modal-card{max-width:265px}.history-entry .mini-reveals .card{width:85px}.hero-art .card{width:190px}.hero-art .card.pointer-hover{animation-play-state:paused}
.collection-cards{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.collection-group{margin:26px 0}.collection-group h3{font-size:12px}.collection-cards .card{min-width:0}.collection-cards .card:disabled{opacity:.45;cursor:not-allowed}#modal:has(.collection-group){width:min(850px,94vw)}.drag-card{position:fixed;left:0;top:0;margin:0!important;z-index:1000;pointer-events:none;transition:none!important;animation:none!important;transform-origin:center center;box-shadow:0 4px 0 #7d8090,0 27px 40px #06121965,0 60px 75px #07101840;will-change:transform}.drag-card .card-foil{opacity:.4}.patterns .picked-up{opacity:.2!important;filter:none!important;transform:scale(.96)!important}.card-dragging{cursor:grabbing;user-select:none}.drop-impact{animation:drop-impact .55s ease-out!important}.selection-impact .card{animation:card-settle .45s ease-out!important}
@keyframes animal-breathe{50%{transform:scale(1.006)}}@keyframes dog-curiosity{0%,42%,100%{transform:rotate(0) translateY(0)}48%,58%{transform:rotate(.7deg) translateY(-.35px)}75%{transform:scale(1.005)}}@keyframes cat-breathe{0%,100%{transform:scale(1) translateY(0)}50%{transform:scale(1.008,1.004) translateY(-.5px)}}@keyframes bird-tilt{0%,60%,100%{transform:rotate(0)}66%,78%{transform:rotate(-.6deg)}88%{transform:translateY(-.45px)}}@keyframes drop-impact{0%{transform:scale(1.04);box-shadow:0 0 0 4px #a8cdaa50}35%{transform:scale(.975);box-shadow:0 0 0 12px #a8cdaa25}65%{transform:scale(1.015)}100%{transform:scale(1);box-shadow:0 0 0 20px #a8cdaa00}}@keyframes card-settle{0%{transform:translateY(-12px) scale(1.03)}45%{transform:translateY(3px) scale(.985)}75%{transform:translateY(-2px)}100%{transform:none}}
@media(max-width:1150px){.layout{grid-template-columns:minmax(0,1fr) 220px}.picker{grid-template-columns:minmax(0,1fr) 145px;gap:16px}.choice-preview{display:block}.choice-preview .card{width:135px;margin:0 auto 15px}.choice-preview button{width:100%}.hand-slot{width:32%;max-width:115px}.hero-art .card{width:170px}.side .panel{padding:18px}.color-hand{padding-left:0;padding-right:0}}
@media(max-width:900px){.layout{grid-template-columns:1fr}.side{display:grid;grid-template-columns:1fr 1fr;gap:18px}.chat{margin-top:0}.picker{grid-template-columns:minmax(0,1fr) 175px}.choice-preview .card{width:155px}.hand-slot{max-width:135px}.side .tip{display:none}.sequence .card{border-radius:12px}.board{overflow:hidden}}
@media(max-width:600px){main{padding:24px 14px}.panel.table{padding:20px 15px}.picker{grid-template-columns:minmax(0,1fr)}.choice-preview{position:static;display:flex;gap:22px;align-items:center;justify-content:center;padding-top:10px}.choice-preview .card{width:125px;flex-shrink:0;margin:0}.choice-preview>div{max-width:180px}.sequence{grid-template-columns:repeat(3,minmax(0,1fr));gap:17px 12px;max-width:390px}.sequence .card{max-width:120px;margin:auto}.sequence .position-label{margin-top:9px}.card.question:after{font-size:9px;bottom:15px}.board{padding:20px 15px}.color-hand{max-width:420px;margin:auto}.hand-slot{width:33%;max-width:125px}.color-group{margin-bottom:25px}.color-label{justify-content:center}.picker h3{font-size:25px}.picker p{font-size:12px}.patterns{margin-top:22px}.side{grid-template-columns:1fr}.result .card{max-width:125px}.results{gap:12px}.results .result{padding:16px 10px}.room-top h2{font-size:26px}.hero-art .card{width:140px}.collection-cards{gap:9px}.collection-cards .card{border-radius:7px}.collection-cards .card:after{font-size:6px}.collection-group h3{justify-content:start}.team-card .card{width:110px}header{padding:18px 15px}.brand i{letter-spacing:1.8px}.modal-card{max-width:240px}.history-entry .sequence{grid-template-columns:repeat(3,minmax(0,1fr))}.hero .entry{margin-top:10px}}
@media(prefers-reduced-motion:reduce){.card-animal,.drop-impact,.selection-impact .card{animation:none!important}.card.pointer-hover,.patterns [aria-pressed="true"],.patterns [aria-pressed="true"].pointer-hover{transform:none!important}.card-foil{transition:none}.card-foil,.card.pointer-hover .card-foil{opacity:.10}.drag-card{will-change:auto}.hand-slot{transition:none}}
.card-animal{animation-play-state:paused}.card.in-view .card-animal{animation-play-state:running}.page-idle .card-animal,.card.picked-up .card-animal,.card:disabled .card-animal{animation-play-state:paused}
.drag-handle{position:absolute;bottom:7px;right:7px;z-index:7;font-size:18px;line-height:25px;width:25px;height:25px;text-align:center;color:#30426f;background:#eeebf3c9;border-radius:6px;opacity:0;touch-action:none;cursor:grab}.card:hover .drag-handle,.card:focus-visible .drag-handle{opacity:.7}@media(pointer:coarse){.drag-handle{opacity:.7}}.drag-card .drag-handle{opacity:0}
.reactions button{min-width:0;padding:7px 0;font-size:18px}.score-row>span{min-width:0;overflow-wrap:anywhere}.message{color:#d0d9dc}.collection-cards .card:hover:not(:disabled){z-index:5}

/* A compact table: the gap is the private preview, with company in a drawer. */
.in-room header{padding:10px 24px}.in-room .brand{font-size:28px}.in-room .brand>span{font-size:24px}.in-room .brand i{display:none}.in-room main{padding:12px 24px;min-height:0}.in-room footer{display:none}.in-room .room-top{margin-bottom:10px;gap:10px}.in-room .room-top .eyebrow{display:none}.in-room .room-top h2{font-size:24px}.in-room .room-top>div:first-child{display:flex;align-items:center;gap:18px}.in-room .rounds{margin:0;gap:5px}.in-room .round-dot{width:25px;height:25px}.in-room .pill{padding:5px 9px}.in-room .layout{display:block}.in-room .panel.table{padding:14px 18px}.in-room .side{display:none;position:fixed;right:18px;top:112px;bottom:18px;width:300px;overflow:auto;z-index:30;background:#202a30;padding:10px;border:1px solid #62717a;border-radius:18px;box-shadow:0 15px 60px #0009}.company-open .side{display:block}.in-room .status-banner{padding:9px 14px;margin-bottom:10px}.in-room .status-banner b{font-size:18px}.in-room .status-icon{font-size:24px}.in-room .board{padding:12px 18px 9px;margin-bottom:12px;overflow:visible}.in-room .board .eyebrow{margin-bottom:10px}.in-room .sequence{max-width:870px;gap:16px}.in-room .sequence .card{max-width:125px;margin:auto}.in-room .position-label{margin-top:8px}.your-slot .card{border-color:#a4d2ad;box-shadow:0 0 0 3px #a4d2ad35,0 8px 20px #0b1b24}.your-slot .position-label{color:#c1e3c1;font-weight:bold;font-size:10px}.in-room .picker{display:block;margin-top:0;position:relative}.in-room .picker h3{font-size:20px;margin-bottom:4px}.in-room .picker p{margin-bottom:8px;font-size:12px}.in-room .numbers{margin:8px 0 14px;justify-content:flex-start;gap:7px}.in-room .numbers button{padding:7px 15px}.in-room .patterns{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:0}.in-room .color-group{margin-bottom:0}.in-room .color-label{margin-bottom:7px;justify-content:center}.in-room .color-hand{padding:2px 4px 0}.in-room .hand-slot{width:33%;max-width:125px}.in-room .animal-label{padding-top:9px}.in-room .picker .help-line{font-size:10px;margin:10px 0 0}.in-room #full-deck{padding:6px 0;font-size:11px}.in-room .picker .choice-preview{position:absolute;right:0;top:0;display:flex;gap:12px;align-items:center;text-align:right;padding:0}.in-room .choice-preview>.card{display:none}.in-room .choice-preview button{padding:10px 18px;width:auto}.in-room .choice-preview small{font-size:11px;display:block}.in-room .choice-preview .help-line{display:none}.in-room .players{margin-top:8px;gap:6px}.in-room .player-chip{padding:6px 10px;font-size:11px}.in-room .result .card{max-width:90px}.in-room .result{padding:10px}.in-room .results{margin:12px 0;gap:10px}.in-room .team-card{margin:10px 0;padding:10px}.in-room .team-card .card{width:65px}.in-room .team-card h3{font-size:18px}
.card[data-gap].drop-ready{border-color:#c4e7bd;box-shadow:0 0 0 7px #99b98e44,0 12px 28px #102d1e50}.card[data-gap].drop-near{box-shadow:0 0 0 5px #89b49a35}
.in-room .status-banner{margin-top:0}.in-room .picker{padding-top:0}.in-room .numbers button{min-width:36px;min-height:34px}.in-room .sequence .card{max-width:min(125px,calc((100dvh - 490px)*.644))}.in-room .board .sequence{min-height:0}
.in-room .status-banner small{margin-top:3px}.in-room .position-label{line-height:1.2}.in-room .picker .choice-preview button{margin-top:6px}.in-room .picker .choice-preview>div{margin:0}.in-room .numbers{margin-bottom:8px}
@media(min-width:701px) and (max-height:900px){.in-room .sequence .card{max-width:105px}.in-room .board .eyebrow{margin-bottom:6px}.in-room .board{padding-top:8px}}
@media(min-width:701px) and (max-height:780px){.in-room .sequence .card{max-width:90px}.in-room .status-banner{padding:6px 12px}.in-room .hand-slot{max-width:100px}.in-room .picker h3{margin-bottom:0}}
@keyframes dog-curiosity{0%,30%,100%{transform:rotate(0) scale(1)}40%,53%{transform:rotate(2deg) translateY(-1px) scale(1.012)}62%{transform:rotate(-1.2deg) scale(1.018)}80%{transform:rotate(0) scale(1.012)}}
@keyframes cat-breathe{0%,100%{transform:scale(1) rotate(0)}38%{transform:scale(1.025,1.018) translateY(-1px)}48%,54%{transform:scale(1.02) rotate(-1.6deg)}51%{transform:scale(1.02) rotate(.8deg)}76%{transform:scale(1.012) rotate(.7deg)}}
@keyframes bird-tilt{0%,25%,100%{transform:rotate(0) translateY(0)}35%,45%{transform:rotate(-2deg) translateY(-1.4px)}52%{transform:rotate(1.5deg) translateY(0)}60%{transform:rotate(-.8deg) translateY(-1px)}80%{transform:scale(1.018)}}
@media(min-width:701px) and (max-height:780px){.in-room .sequence .card{max-width:105px}.in-room .hand-slot{max-width:105px}.in-room .board{padding-top:8px}.in-room .picker p{display:none}.in-room .status-banner small{font-size:11px}.in-room .room-top h2{font-size:21px}.in-room .room-top .rounds .muted{display:none}}
@media(max-width:700px){.in-room header{padding:8px 10px}.in-room main{padding:8px 10px}.in-room .room-top{flex-wrap:wrap;gap:3px}.in-room .room-top>div:first-child{gap:8px}.in-room .room-top h2{font-size:20px}.in-room .rounds .muted{display:none}.in-room .panel.table{padding:10px}.in-room .sequence{grid-template-columns:repeat(6,minmax(0,1fr));gap:5px}.in-room .sequence .card{border-radius:6px}.in-room .board{padding:10px 4px}.in-room .board .eyebrow{font-size:8px;letter-spacing:1px}.in-room .your-slot .position-label{font-size:8px}.in-room .patterns{gap:10px}.in-room .color-hand{flex-direction:column;align-items:center;gap:7px}.in-room .hand-slot{width:100%;max-width:90px;transform:none!important;margin:0}.in-room .animal-label{display:none}.in-room .color-label{font-size:8px;letter-spacing:.5px;gap:4px}.in-room .picker h3,.in-room .picker p{display:none}.in-room .picker .choice-preview{top:0}.in-room .choice-preview small{display:none}.in-room .choice-preview button{font-size:11px;padding:9px}.in-room .numbers{padding-top:2px;gap:4px}.in-room .numbers button{padding:8px 10px}.in-room .players{display:none}.in-room .status-banner{padding:8px}.in-room .status-banner b{font-size:16px}.in-room .status-banner small{font-size:10px}.in-room .side{width:min(320px,calc(100vw - 20px));right:10px;top:110px}.in-room .picker .help-line{display:none}.in-room .hand-slot .card{max-height:calc((100dvh - 285px)/3);width:auto;max-width:100%;margin:auto;display:block}.in-room .room-top .quiet{padding:5px;font-size:10px}}
@media(min-width:701px) and (max-height:780px){.in-room .sequence .card{max-width:90px}}
@media(max-width:700px){.in-room .hand-slot .card{width:min(90px,calc((100dvh - 360px)*.644 / 3));max-height:none}.in-room .card.question:after{font-size:6px;letter-spacing:0}.in-room .status-banner small{line-height:1.4}}
@keyframes dog-curiosity{0%,35%,100%{transform:none}45%,56%{transform:rotate(.55deg) translateY(-.25px) scale(1.004)}68%{transform:rotate(-.3deg) scale(1.006)}} @keyframes cat-breathe{0%,100%{transform:none}40%{transform:scale(1.007,1.005) translateY(-.25px)}50%,56%{transform:scale(1.005) rotate(-.4deg)}53%{transform:scale(1.005) rotate(.2deg)}} @keyframes bird-tilt{0%,30%,100%{transform:none}42%,52%{transform:rotate(-.55deg) translateY(-.35px)}62%{transform:rotate(.35deg)}80%{transform:scale(1.005)}}
.card-print{clip-path:inset(0 0 64% 0)}.card-animal{clip-path:inset(35% 0 0 0);transform-origin:50% 85%}
@media(max-width:700px){.in-room .hand-slot .card{width:min(82px,calc((100dvh - 500px)*.644 / 3));min-width:0}.in-room .patterns .card{padding:0}}
@media(max-width:700px){.in-room .board .eyebrow{display:none}.in-room .board{padding-top:6px;padding-bottom:6px}.in-room .numbers{margin-top:4px;margin-bottom:6px}}
.music-volume{display:flex;align-items:center;gap:6px;font-size:10px;font-weight:normal;margin:0;color:#bccacb}.music-volume input{width:80px;min-width:0;height:22px;padding:0;border:0;accent-color:#a6c7b9;cursor:pointer}.music-volume output{min-width:27px;font-variant-numeric:tabular-nums}@media(max-width:700px){.music-volume span{display:none}.music-volume input{width:60px}nav{max-width:260px}.in-room header{gap:5px}}
