:root{font-family:system-ui,sans-serif;color:#f6efda;background:#092923;--cream:#f3e4be;--red:#b23d38;--gold:#d3b66d}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 60% 10%,#214c3e,transparent 65%);min-height:100vh}header,main,footer{max-width:1320px;margin:auto}header{display:flex;justify-content:space-between;align-items:center;padding:26px 32px;border-bottom:1px solid #ffffff15}.brand{color:var(--cream);text-decoration:none;font-weight:800;font-size:25px;letter-spacing:-1px}.brand span{display:block;color:#a7bdaf;font-weight:400;letter-spacing:0;font-size:11px;margin-top:3px}main{padding:34px 32px 60px}button,input{font:inherit}button{border:1px solid #d0bc8260;background:var(--cream);color:#173d30;border-radius:8px;padding:12px 19px;font-weight:650;cursor:pointer}button:hover{filter:brightness(1.09)}button:disabled{opacity:.5;cursor:default}button.quiet{background:#ffffff07;color:var(--cream)}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--gold);outline-offset:4px}[hidden]{display:none!important}.eyebrow{font-size:11px;letter-spacing:.18em;font-weight:700;color:var(--gold)}h1,h2,h3,p{margin-top:0}h1{font-family:Georgia,serif;font-size:clamp(70px,9vw,122px);line-height:.9;letter-spacing:-5px;margin:26px 0}h1 em{font-weight:400;color:var(--gold)}.title-star{font-size:68px;color:var(--gold);padding-left:28px}.intro{font-size:19px;line-height:1.65;color:#bacdc1}.welcome{position:relative;padding:45px 0 65px;min-height:640px}.welcome-controls{max-width:390px;display:grid;gap:15px}label{font-size:12px;color:#c7d4c6}input{display:block;width:100%;margin-top:8px;border:1px solid #dfd1a43a;border-radius:8px;background:#071f1a;color:#f4ecd3;padding:13px}.welcome-controls button{display:flex;justify-content:space-between}.features{display:flex;gap:20px;flex-wrap:wrap;margin-top:30px;font-size:12px;color:#b1c3b6}.demo{position:absolute;top:110px;right:6%;width:390px;height:380px}.demo-card{position:absolute;left:0;top:0;transform:rotate(-14deg);width:176px;height:270px;background:var(--cream);color:#202825;border-radius:15px;border:8px double #20382c;padding:12px;font-size:25px;box-shadow:0 20px 45px #0007;text-align:center;font-family:Georgia,serif}.demo-card b{display:block;font-size:125px;line-height:1.25}.demo-card.red{left:165px;top:60px;transform:rotate(12deg);color:var(--red);border-color:var(--red)}.demo-caption{position:absolute;top:326px;left:40px;color:var(--gold);letter-spacing:.16em;font-size:12px;line-height:1.6}.game-heading,.hand-heading{display:flex;justify-content:space-between;align-items:center;gap:15px}.game-heading h2{font-family:Georgia,serif;font-size:38px;margin:10px 0 25px}.pill{border:1px solid #d3b66d55;padding:9px 15px;border-radius:30px;font-size:12px}.panel{padding:24px;background:#061e19a0;border:1px solid #c7d6a52a;border-radius:14px}.panel p{color:#b4c7ba;line-height:1.6}h3{font-size:17px}.actions{display:flex;gap:12px;flex-wrap:wrap;margin:24px 0 0}.seat{display:flex;align-items:center;justify-content:space-between;padding:13px 0;border-bottom:1px solid #ffffff13}.seat span{font-size:13px;color:#b6c9b8}.small{font-size:12px;overflow-wrap:anywhere}.table-top{display:flex;align-items:center;gap:25px;margin-bottom:24px}.top-card{width:80px;height:110px;background:var(--cream);color:#273529;border-radius:10px;border:5px double #354937;display:grid;place-items:center;font-family:Georgia,serif;font-weight:700;font-size:37px;flex-shrink:0}.top-card.negative{color:var(--red);border-color:var(--red)}.turn-info{flex:1}.turn-info h3{margin:0 0 8px}.turn-info p{color:#bdcdbd;margin:0;font-size:14px}.boards{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px;margin-bottom:24px}.board{background:#e4ce9f;color:#24372e;border:6px double #263b31;border-radius:6px;padding:14px;box-shadow:0 8px 18px #0003;position:relative}.board.current{outline:3px solid #daba61;outline-offset:3px}.board-name{display:flex;justify-content:space-between;gap:10px;font-size:14px;font-weight:750;margin-bottom:12px}.board-name small{font-size:10px;font-weight:500}.starts,.homes{display:flex;justify-content:space-around;align-items:center;gap:6px;min-height:45px}.track{display:grid;grid-template-columns:repeat(6,1fr);gap:7px;margin:12px 0}.cell{height:48px;border:1px solid #4c57488a;border-radius:4px 4px 14px 14px;background:#f4e7c8;display:flex;flex-direction:column;align-items:center;font-family:Georgia,serif;font-weight:700;font-size:14px;position:relative}.dot{display:grid;place-items:center;width:23px;height:23px;margin-top:2px;border-radius:50%;background:#715439;border:2px solid #f1dfbd;box-shadow:0 0 0 1px #354236;color:white;font-family:system-ui;font-size:10px}.piece{background:var(--piece,#b4403d);box-shadow:inset 0 -4px 0 #0003,0 2px 3px #0005;font-weight:bold;border:1px solid #ffffff80}.piece-button{padding:0;width:31px;height:31px;border-radius:50%;font-size:12px;display:grid;place-items:center;color:white;background:var(--piece);position:relative}.piece-button.legal{outline:3px solid #142b22;outline-offset:3px;animation:pulse 1.2s infinite}.star-slot{display:grid;place-items:center;width:36px;height:36px;font-size:28px;color:#576149}.home-number{font-family:Georgia,serif;font-weight:bold;font-size:27px}.home-slot{width:28px;height:28px;border-radius:50%;background:#71543966;display:grid;place-items:center}.destination{outline:3px solid #21674a;background:#fff6d9}.hand-panel{margin-bottom:20px}.hand-heading h3{margin-bottom:0}.hand-heading span{font-size:12px;color:#a7beaf}#instruction{font-size:14px;margin:12px 0 20px}.hand{display:flex;gap:10px;flex-wrap:wrap}.card{width:69px;height:96px;border:4px double #253c2c;border-radius:7px;padding:6px;background:var(--cream);color:#263c2d;font-family:Georgia,serif;font-size:29px;position:relative;box-shadow:0 4px 8px #0004;transition:transform .15s}.card small{display:block;font-size:9px;margin-top:8px;font-family:system-ui;letter-spacing:.12em}.card.negative{color:var(--red);border-color:var(--red)}.card.selected{outline:3px solid var(--gold);outline-offset:3px;transform:translateY(-7px)}.card:hover:not(:disabled){transform:translateY(-5px)}.bottom-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.log{font-size:13px;line-height:1.7;color:#b8cdbd}.log div{padding:5px 0;border-bottom:1px solid #ffffff0c}table{width:100%;border-collapse:collapse;font-size:12px;text-align:left}td,th{padding:10px 5px;border-bottom:1px solid #ffffff20}#scores{overflow:auto}#result{margin:16px 0 0;font-weight:bold;color:var(--gold)}#error{color:#ffb5ae;margin-top:20px}footer{border-top:1px solid #ffffff15;padding:24px 32px;font-size:11px;letter-spacing:.1em;color:#9aafa0;display:flex;justify-content:space-between}dialog{max-width:670px;width:calc(100% - 30px);max-height:90vh;background:#f3e4be;color:#253a2c;border:6px double #324634;border-radius:8px;padding:32px;line-height:1.7}dialog::backdrop{background:#001b16bb}dialog .eyebrow{color:#805e2e}dialog h2{font:36px Georgia,serif;margin:18px 0}dialog li{padding-bottom:12px}dialog button.quiet{color:#253a2c;border-color:#29473755}.close{float:right}@keyframes pulse{50%{outline-color:#b44138}}@media(max-width:900px){.demo{right:0;transform:scale(.8);transform-origin:right top}.welcome-controls{max-width:330px}}@media(max-width:700px){header{padding:18px}main{padding:24px 18px}.welcome{padding-top:18px;min-height:0}.demo{position:relative;top:auto;right:auto;transform:scale(.6);transform-origin:left top;margin:40px 0 -130px;height:380px}.welcome-controls{max-width:100%}h1{font-size:83px}.title-star{font-size:46px;padding-left:20px}.bottom-grid{grid-template-columns:1fr}.table-top{gap:15px}.table-top button{font-size:11px;padding:9px}.boards{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.card{width:58px;height:83px;font-size:24px}.hand{gap:8px}.panel{padding:18px}.features{gap:12px}.game-heading h2{font-size:30px}.pill{white-space:nowrap}footer{padding:20px 18px}}

/* Original board artwork and face-to-face seating. */
.boards{grid-template-columns:repeat(auto-fit,minmax(250px,1fr));align-items:start}
.boards.two-player{grid-template-columns:minmax(0,440px);justify-content:center;gap:28px}
.board{padding:0;border:0;background:transparent;box-shadow:none;border-radius:7px;overflow:visible}
.board-name{color:#f3e4be;padding:3px 8px;margin:0 0 9px;align-items:center;min-height:27px}
.board.current{outline:0}.board.current .board-face{outline:3px solid #daba61;outline-offset:4px}
.board-face{position:relative;width:100%;aspect-ratio:563/600;border-radius:4px;box-shadow:0 12px 30px #0006}
.board-face>img{display:block;width:100%;height:100%;border-radius:4px}
.board.north .board-face{transform:none}
.board-marker,.move-target{position:absolute;transform:translate(-50%,-50%)}
.board-marker{width:8%;aspect-ratio:1;display:grid;place-items:center;z-index:2}
.board-face .piece-button{width:100%;height:100%;border:2px solid #f8efd1;font-size:clamp(11px,1.1vw,16px);box-shadow:inset 0 -5px 0 #0004,inset 0 3px 0 #fff4,0 3px 6px #0009;opacity:1}
.board-face .piece-button:disabled{opacity:1;filter:none}
.board-face .piece-button.legal{outline:3px solid #fff4c9;outline-offset:3px}
.move-target{width:8%;aspect-ratio:1;border:4px solid #287e53;border-radius:50%;background:#b7f7b433;z-index:1;box-shadow:0 0 0 2px #fff0c5}
@media(max-width:700px){.boards.two-player{grid-template-columns:minmax(0,370px);gap:24px}.board-face .piece-button{font-size:12px}}

/* Cards in a left-hand rack, with the original mirrored printing. */
#table{display:grid;grid-template-columns:265px minmax(0,1fr);grid-template-areas:"status status" "hand boards" "bottom bottom";gap:24px;align-items:start}
.table-top{grid-area:status;margin-bottom:0}.boards{grid-area:boards;margin-bottom:0}
.hand-panel{grid-area:hand;margin-bottom:0;padding:18px;position:sticky;top:18px}
.bottom-grid{grid-area:bottom}.hand{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 9px}
.hand-heading{align-items:start;gap:8px}.hand-heading span{font-size:11px;white-space:nowrap}
.card{width:100%;height:auto;aspect-ratio:100/154;border:0;background:transparent;padding:0;border-radius:8px;box-shadow:0 3px 7px #0007;overflow:visible}
.card-art{display:block;width:100%;height:100%;border-radius:8px}.card.negative{border:0}
.card:disabled{opacity:.7}.card.selected{outline:3px solid var(--gold);outline-offset:3px}
.top-card{padding:0;border:0;width:80px;height:auto;aspect-ratio:100/154;background:transparent;border-radius:8px;box-shadow:0 4px 12px #0006}
.top-card.negative{border:0}.card-waiting{width:100%;height:100%;display:grid;place-items:center;background:#f8f3e3;border:5px double #364b3a;border-radius:8px;color:#394937}
@media(max-width:900px){#table{grid-template-columns:220px minmax(0,1fr);gap:20px}.hand-panel{padding:14px}.hand{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 7px}.hand-heading{flex-wrap:wrap}}
@media(max-width:700px){#table{grid-template-columns:145px minmax(0,1fr);gap:18px 14px}.hand-panel{padding:12px}.hand{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 7px}.hand-panel h3{font-size:14px}#instruction{font-size:12px;line-height:1.5}.bottom-grid{grid-template-columns:1fr}.boards{grid-template-columns:minmax(0,1fr)}.board-name{flex-wrap:wrap;font-size:12px;gap:3px}.board-name small{font-size:9px}.board-face .piece-button{font-size:10px;border-width:1px}.board-face .piece-button.legal{outline-width:2px;outline-offset:2px}}
@media(max-width:480px){#table{grid-template-columns:94px minmax(0,1fr);gap:18px 10px}.hand-panel{padding:10px 8px;max-height:80vh;overflow-y:auto}.hand{grid-template-columns:1fr;gap:12px}.hand-heading span{white-space:normal}.board-face .piece-button{font-size:8px}.board-name small{font-size:8px}.move-target{border-width:2px}}

/* Discard pile to the right of the playing boards. */
#table{grid-template-columns:265px minmax(0,1fr) 150px;grid-template-areas:"status status status" "hand boards discard" "bottom bottom bottom"}
.discard-panel{grid-area:discard;position:sticky;top:18px;text-align:center;padding:18px 14px}
.discard-panel h3{font-size:15px}.discard-panel .top-card{width:100px;margin:0 auto 16px;position:relative;isolation:isolate}
.discard-panel .top-card:before,.discard-panel .top-card:after{content:"";position:absolute;inset:0;border:1px solid #d5ceb9;border-radius:8px;background:#e9e2cf;z-index:-1;transform:translate(3px,3px) rotate(3deg)}
.discard-panel .top-card:before{transform:translate(6px,6px) rotate(5deg)}
.discard-panel p{margin:0;font-size:11px;line-height:1.5}
@media(max-width:1000px){#table{grid-template-columns:220px minmax(0,1fr) 120px}.discard-panel{padding:14px 10px}.discard-panel .top-card{width:85px}}
@media(max-width:700px){#table{grid-template-columns:130px minmax(0,1fr) 82px;gap:18px 10px}.discard-panel{padding:10px 7px}.discard-panel h3{font-size:12px}.discard-panel .top-card{width:62px}}
@media(max-width:480px){#table{grid-template-columns:80px minmax(0,1fr) 58px;gap:18px 8px}.discard-panel{padding:8px 4px}.discard-panel h3{font-size:10px;line-height:1.4}.discard-panel .top-card{width:44px}.discard-panel p{font-size:9px}.hand-panel{padding:10px 6px}}

/* Compact game navigation, inspired by Nancy's Solitaire. */
header.game-nav{max-width:none;background:#063d32;padding:0 22px;min-height:58px;display:flex;gap:24px;border-bottom:1px solid #b5d5bf33;position:sticky;top:0;z-index:10;flex-wrap:wrap}
.game-title{color:#f6efda;font:700 27px Georgia,serif;letter-spacing:-.7px;text-decoration:none;white-space:nowrap;padding:12px 24px 12px 0;border-right:1px solid #a7cdb653}.title-mark{color:#d95455;font-family:Georgia,serif;margin-right:5px}
.game-nav nav{display:flex;align-items:center;gap:8px;flex:1}.game-nav nav button{display:flex;align-items:center;gap:8px;border:0;padding:11px 10px;border-radius:5px;background:transparent;color:#f3eedb;font-size:14px;white-space:nowrap}.game-nav nav button:hover{background:#ffffff12}.game-nav nav button span{font-size:20px;line-height:1;color:#d5e9dc}
.nav-progress{padding:10px 0 10px 18px;border-left:1px solid #a7cdb653;font:600 16px Georgia,serif;white-space:nowrap;color:#d1e4d6}.game-heading{display:none}.hand-panel,.discard-panel{top:78px}
.stats-group{margin:25px 0;padding-top:18px;border-top:1px solid #324c3333}.stats-group h3{font:700 22px Georgia,serif}.stats-group table,.results-actions+table{font-size:14px}dialog table{font-size:14px}dialog td,dialog th{border-bottom:1px solid #24462f33;padding:10px 8px}#resultsRanking h3{margin:25px 0 8px}#resultsWinner{font-size:19px;color:#37603e;font-weight:650}.results-actions button{border-color:#30563d66}.results-actions button.quiet{color:#25492f}.results-actions{margin-top:25px}#aboutDialog a{color:#25492f}#resultsDialog{max-width:640px}
@media(max-width:900px){header.game-nav{gap:12px;padding:0 14px}.game-title{font-size:22px;padding-right:14px}.game-nav nav{gap:0}.game-nav nav button{font-size:12px;padding:10px 8px}.nav-progress{font-size:14px;padding-left:12px}}
@media(max-width:700px){header.game-nav{gap:0;justify-content:space-between;padding:0 12px}.game-title{font-size:22px;border:0;padding:12px 0}.nav-progress{order:1;font-size:14px}.game-nav nav{order:2;flex-basis:100%;justify-content:space-between;border-top:1px solid #ffffff17;padding:4px 0}.game-nav nav button{font-size:12px;gap:6px;padding:9px 5px}.game-nav nav button span{font-size:17px}.hand-panel,.discard-panel{top:115px}main{padding-top:22px}}

.nav-toast{position:fixed;right:20px;top:72px;z-index:30;background:#f3e4be;color:#24412c;padding:14px 20px;border-radius:8px;box-shadow:0 8px 25px #0006;max-width:calc(100vw - 40px);overflow-wrap:anywhere;font-size:14px}@media(max-width:700px){.nav-toast{top:116px}}

/* Turn information belongs between the boards. */
#table{grid-template-areas:"hand boards discard" "bottom bottom bottom"}
.board-turn{grid-column:1/-1;padding:17px 14px;text-align:center;background:#ffffff06;border-top:1px solid #d3b66d44;border-bottom:1px solid #d3b66d44;border-radius:6px}
.board-turn h3{margin:0 0 8px;color:#f3e4be;font:700 21px Georgia,serif}.board-turn p{margin:0;color:#c4d4c6;font-size:13px;line-height:1.5}
.seat .rename,.seat .remove{padding:7px 10px;font-size:12px}.seat span{display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
#renameBotDialog input{background:#fff9e9;color:#25412e;border-color:#789176}#renameBotDialog .quiet,#resetStatsConfirm .quiet,#resetStats{color:#25412e;border-color:#789176}
#resetStatsConfirm{margin:20px 0;padding:16px;border:1px solid #ad544a55;border-radius:8px}#confirmResetStats{background:#a34139;color:white;border-color:#a34139}
@media(max-width:700px){.board-turn{padding:12px 6px}.board-turn h3{font-size:16px}.board-turn p{font-size:11px}}

/* Use the same player-name layout at every table size. */
.board-name{flex-wrap:wrap;gap:3px 10px;align-items:baseline}
.board-player-name{font-size:14px;font-weight:750;line-height:1.4;min-width:0;overflow-wrap:anywhere}
.board-name .board-player-meta{font-size:10px;line-height:1.4;white-space:nowrap}

/* Two-player reference: local board left, opponent right. */
.boards.two-player{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start}
.boards.two-player .south{grid-column:1;grid-row:1}.boards.two-player .north{grid-column:2;grid-row:1}.boards.two-player .board-turn{grid-row:2;grid-column:1/-1}
.board-name{position:relative;padding-right:37px;min-height:40px}.opponent-pile{position:absolute;right:0;top:0;width:25px;height:36px;font-size:15px;box-shadow:3px 3px 0 #cfc7b0,5px 5px 0 #807962}
.card-back{display:grid;place-items:center;border:0;border-radius:5px;background:#f6efdd url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20200%20308%22%3E%3Cdefs%3E%3Cpattern%20id%3D%22p%22%20width%3D%2224%22%20height%3D%2218%22%20patternUnits%3D%22userSpaceOnUse%22%3E%3Cpath%20d%3D%22M4%203v8M0%207h8M14%207h8%22%20stroke%3D%22%23f6efdd%22%20stroke-width%3D%222.6%22%2F%3E%3C%2Fpattern%3E%3C%2Fdefs%3E%3Crect%20width%3D%22200%22%20height%3D%22308%22%20rx%3D%2212%22%20fill%3D%22%23f6efdd%22%2F%3E%3Crect%20x%3D%2212%22%20y%3D%2212%22%20width%3D%22176%22%20height%3D%22284%22%20rx%3D%226%22%20fill%3D%22none%22%20stroke%3D%22%23ae7560%22%20stroke-width%3D%222%22%2F%3E%3Crect%20x%3D%2224%22%20y%3D%2224%22%20width%3D%22152%22%20height%3D%22260%22%20fill%3D%22%23ae7560%22%2F%3E%3Crect%20x%3D%2229%22%20y%3D%2229%22%20width%3D%22142%22%20height%3D%22250%22%20fill%3D%22url(%23p)%22%20stroke%3D%22%23f6efdd%22%20stroke-width%3D%222%22%2F%3E%3Cpath%20d%3D%22M76%20154h48M100%20130v48%22%20stroke%3D%22%23f6efdd%22%20stroke-width%3D%228%22%2F%3E%3Cg%20id%3D%22label%22%20transform%3D%22translate(100%2072)%20rotate(-36)%22%3E%3Crect%20x%3D%22-69%22%20y%3D%22-23%22%20width%3D%22138%22%20height%3D%2246%22%20fill%3D%22%23f6efdd%22%20stroke%3D%22%23ae7560%22%20stroke-width%3D%222%22%2F%3E%3Crect%20x%3D%22-65%22%20y%3D%22-19%22%20width%3D%22130%22%20height%3D%2238%22%20fill%3D%22none%22%20stroke%3D%22%23ae7560%22%2F%3E%3Cg%20fill%3D%22%23ae7560%22%20font-family%3D%22Arial%2Csans-serif%22%20text-anchor%3D%22middle%22%3E%3Ctext%20x%3D%22-47%22%20y%3D%2213%22%20font-size%3D%2235%22%20font-weight%3D%22900%22%3EP%3C%2Ftext%3E%3Ctext%20x%3D%2247%22%20y%3D%2213%22%20font-size%3D%2235%22%20font-weight%3D%22900%22%3EM%3C%2Ftext%3E%3Ctext%20y%3D%22-5%22%20font-size%3D%2211%22%3EPLUS%20%26amp%3B%20MINUS%3C%2Ftext%3E%3Ctext%20y%3D%225%22%20font-size%3D%225%22%3ETRADE%20MARK%3C%2Ftext%3E%3Ctext%20y%3D%2215%22%20font-size%3D%2210%22%3EPLAY%20UNTIL%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3Cuse%20href%3D%22%23label%22%20transform%3D%22translate(200%20308)%20rotate(180)%22%2F%3E%3C%2Fsvg%3E") center/100% 100% no-repeat;color:transparent}.flying-card{position:fixed;z-index:50;pointer-events:none;box-shadow:0 5px 14px #0005}
#optionsDialog{max-width:470px}#optionsDialog label{display:block;color:#253a2c;font-size:15px;margin-top:22px}#optionsDialog select{display:block;width:100%;font:inherit;padding:12px;margin-top:8px;background:#fff9e9;color:#253a2c;border:1px solid #789176;border-radius:6px}#optionsDialog .sound-toggle{display:flex;align-items:center;justify-content:flex-start;gap:12px;text-align:left}#optionsDialog .sound-toggle input[type="checkbox"]{display:block;flex:0 0 20px;width:20px;height:20px;margin:0;padding:0;accent-color:#296446}#optionsDialog .sound-toggle span{flex:1;text-align:left}.volume-control{display:flex;align-items:center;gap:15px}#soundVolume{padding:0;accent-color:#296446}#volumeValue{min-width:45px;text-align:right}
.fireworks{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:5}.firework-burst{position:absolute}.firework-burst i{position:absolute;width:5px;height:5px;border-radius:50%;opacity:0;animation:firework 1.4s var(--delay) ease-out both;box-shadow:0 0 5px currentColor}@keyframes firework{0%{opacity:0;transform:translate(0,0) scale(.2)}10%{opacity:1}75%{opacity:1}100%{opacity:0;transform:translate(var(--dx),var(--dy)) scale(.3)}}
@media(max-width:700px){.boards.two-player{gap:12px}.boards.two-player .board-player-name{font-size:11px}.boards.two-player .board-player-meta{font-size:8px}.boards.two-player .board-name{padding:0 0 40px;min-height:75px}.boards.two-player .opponent-pile{top:auto;bottom:6px;right:4px}.game-nav nav button{font-size:11px;gap:4px}#table:has(.boards.two-player){grid-template-columns:80px minmax(0,1fr) 58px;gap:18px 8px}.boards.two-player .piece-button{font-size:7px}.boards.two-player .board-face{min-width:0}}
.boards.two-player.rotate-opponent .north .board-face{transform:rotate(180deg)}
.boards.two-player.rotate-opponent .north .board-name{transform:rotate(180deg)}
@media(max-width:700px){.boards.two-player{grid-template-columns:minmax(0,1fr);gap:18px}.boards.two-player .south{grid-column:1;grid-row:1}.boards.two-player .board-turn{grid-column:1;grid-row:2}.boards.two-player .north{grid-column:1;grid-row:3}}
@media(prefers-reduced-motion:reduce){.piece-button.legal{animation:none}.card{transition:none}.firework-burst i{animation:none}}


.results-top-actions{display:flex;justify-content:flex-end;gap:10px;margin-bottom:18px;flex-wrap:wrap}

.stats-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap;border-bottom:1px solid #29473744;margin-bottom:20px;padding-bottom:12px}.stats-top h2{margin:0 auto 0 0;font-size:28px}.discard-turn{margin-bottom:20px;text-align:left}.discard-turn h3{color:var(--gold)}.discard-turn p{font-size:12px;margin-bottom:8px}#botNameError{color:#9e2424;font-size:14px}#handRestart{margin-top:18px}

#statsDialog .stats-top{position:sticky;top:-32px;z-index:3;background:#f3e4be;padding-top:18px;box-shadow:0 4px 0 #f3e4be}#botNameError:not(:empty){margin-top:16px;padding:8px 12px}#renameBotDialog label{color:#253a2c}

.popup-top{position:sticky;top:-32px;z-index:3;background:#f3e4be;display:flex;align-items:center;gap:12px;padding:18px 0 12px;margin-bottom:18px;border-bottom:1px solid #29473744}.popup-top h2{font-size:27px;margin:0 auto 0 0}.popup-top button{flex-shrink:0}

@media(max-width:700px){.boards.two-player.rotate-opponent .north{grid-column:1;grid-row:1}.boards.two-player.rotate-opponent .south{grid-column:1;grid-row:2}}

.pack-reference{container-type:inline-size;margin:20px auto 0;padding:12px 5px;width:100%;max-width:240px;background:#f8f3e3;color:#24313a;border-radius:10px;text-align:center;font-family:Arial,sans-serif;box-shadow:0 4px 10px #0003}
.pack-reference h4{color:#b84a43;font-size:min(18px,10cqw);margin:0 0 8px;letter-spacing:.04em}
.pack-reference .pack-intro{color:#24313a;font-size:min(8px,5cqw);font-weight:700;margin:0 0 5px;letter-spacing:0}
.pack-reference strong{display:block;font-size:min(20px,12cqw)}
.pack-columns{display:grid;grid-template-columns:1fr 1fr;margin:8px 0;font-size:min(13px,7.5cqw);font-weight:700;line-height:1.65}
.pack-columns>div{display:flex;flex-direction:column;justify-content:space-between;padding:0 2px}
.pack-columns>div+div{border-left:1px solid #24313a}
.pack-columns span{display:block;white-space:nowrap}
.pack-reference .pack-twenty{font-size:min(16px,8cqw);margin:8px 0}
.pack-reference .pack-minus{color:#b84a43;border-top:1px solid #24313a;padding-top:8px}
.pack-reference .pack-minus span{display:block;font-size:min(13px,7cqw);font-weight:700;margin-top:6px}
.pack-reference .pack-note{color:#24313a;font-size:min(8px,5cqw);font-weight:700;margin:12px 0 0;letter-spacing:0}