@charset "UTF-8";
:root{--paper:#f5f2e9;--white:#fffdf7;--ink:#203a32;--muted:#65726a;--green:#173f35;--green-mid:#235446;--line:#dedfd3;--gold:#d5ad68;--coral:#b85d47;--red:#b3423d;--radius:20px;--shadow:0 12px 38px #173f350a;font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}
*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}button,input,select{border-radius:10px}a{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #bc873e;outline-offset:4px}button{min-height:44px}h1,h2,h3,p{margin:0}h1,h2,.serif{font-family:Georgia,"Times New Roman",serif;font-weight:400;letter-spacing:-.045em}h1{font-size:clamp(2.6rem,5vw,4.3rem);line-height:1.05}h2{font-size:2rem;line-height:1.15}h3{font-size:1rem;line-height:1.4}p{line-height:1.65}.muted,.hint{color:var(--muted)}.hint{font-size:.83rem;line-height:1.6}.eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:.69rem;font-weight:750}.small{font-size:.85rem}.gap{display:flex;align-items:center;gap:10px}.wrap{flex-wrap:wrap}.spread{display:flex;align-items:center;justify-content:space-between;gap:16px}.stack{display:grid;gap:18px}.hidden,[hidden]{display:none!important}.skip-link{position:fixed;top:-70px;left:16px;padding:14px;background:var(--white);z-index:20}.skip-link:focus{top:12px}.app-header{max-width:1424px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:25px 44px;border-bottom:1px solid var(--line);gap:16px}.brand{display:flex;align-items:center;gap:11px;text-decoration:none;flex-shrink:0}.brand-mark{display:grid;place-items:center;width:42px;height:42px;background:var(--green);border-radius:13px;color:var(--white);font-size:28px}.brand-name{font-family:Georgia,serif;font-size:1.6rem;letter-spacing:-.04em}.brand-caption{font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;margin-top:1px;color:var(--muted)}.header-actions{display:flex;align-items:center;gap:15px}.connection{font-size:.72rem;color:var(--muted);display:inline-flex;align-items:center;gap:7px}.status-dot{height:6px;width:6px;border-radius:50%;background:#669077;display:inline-block;flex-shrink:0}.connection.offline .status-dot,.status-dot.offline{background:#bb8050}.text-button{border:0;background:transparent;color:var(--ink);padding:6px 8px;font-size:.84rem;font-weight:600;min-height:40px}.text-button:hover{color:var(--coral)}.btn{border:1px solid transparent;background:var(--green);color:var(--white);padding:12px 19px;font-size:.85rem;font-weight:650;line-height:1.3;display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;transition:background .15s,transform .15s}.btn:hover:not(:disabled){background:#2a594a;transform:translateY(-1px)}.btn.secondary{background:transparent;border-color:var(--line);color:var(--ink)}.btn.secondary:hover:not(:disabled){background:#eceee4}.btn.gold{background:var(--gold);color:var(--green)}.btn.danger{background:#fbefea;color:#964935;border-color:#e6bba9}.btn.compact{padding:8px 13px;min-height:38px;font-size:.77rem}.badge{display:inline-flex;align-items:center;gap:6px;border-radius:30px;padding:6px 10px;font-size:.67rem;line-height:1;letter-spacing:.025em;background:#e9ede2;color:#456342;font-weight:650;white-space:nowrap}.badge.social{background:#f0e4d5;color:#846037}.badge.faint{background:#eeeee6;color:var(--muted)}.main-container{max-width:1424px;margin:auto;padding:42px 44px 64px}.page-intro{margin-bottom:34px}.page-intro p{margin-top:16px;max-width:570px}.page-intro .eyebrow{margin-bottom:15px;color:var(--coral)}.page-intro h1{max-width:700px}.panel{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:26px;box-shadow:var(--shadow)}.panel-heading{padding-bottom:20px;margin-bottom:20px;border-bottom:1px solid var(--line)}.panel-heading h2{font-size:1.65rem}.lobby-layout{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(300px,1fr);gap:26px}.lobby-layout>.stack{align-content:start}.library-card{background:var(--green);color:var(--white);min-height:295px;padding:30px;border-radius:var(--radius);overflow:hidden;position:relative}.library-card .eyebrow{color:#b5c8b5}.library-card h2{font-size:3rem;margin:28px 0 8px}.library-card p{max-width:250px;color:#d2dfd2;font-size:.86rem}.library-card .badge{margin-top:26px;background:#ffffff12;color:#e8dfc8}.decorative-hand{display:flex;position:absolute;right:9px;top:82px;transform:scale(.78) rotate(10deg);transform-origin:100% 50%;pointer-events:none}.decorative-hand .playing-card{margin-left:-57px}.decorative-hand .playing-card:first-child{transform:rotate(-17deg) translateY(4px)}.decorative-hand .playing-card:last-child{transform:rotate(17deg) translateY(4px)}.table-list{display:grid;gap:12px}.room-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:18px;border:1px solid var(--line);border-radius:13px}.room-row h3{overflow-wrap:anywhere}.room-row .hint{margin-top:5px}.room-row .badge{margin-top:10px}.empty-state{padding:34px 18px;text-align:center;border:1px dashed #cbd3c4;border-radius:13px}.empty-symbol{font-family:Georgia,serif;color:#adb9a7;font-size:2.6rem;margin-bottom:9px}.empty-state p{font-size:.86rem;max-width:340px;margin:9px auto 0}.section-note{display:flex;gap:12px;margin-top:20px;color:var(--muted);font-size:.76rem;line-height:1.6}.section-note>span:first-child{color:var(--coral)}.form-grid{display:grid;gap:16px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}label.field{display:grid;gap:7px;font-size:.78rem;font-weight:650}.field input,.field select{width:100%;padding:12px 13px;background:#fffefb;border:1px solid #d5d9cd;color:var(--ink);min-height:46px;font-size:.9rem;min-width:0}.field input::placeholder{color:#93988d}.form-footer{margin-top:4px}.form-error{background:#fae9e3;color:#8b3828;border:1px solid #efc7b9;padding:12px 14px;border-radius:10px;font-size:.85rem;line-height:1.5}.login-layout{display:grid;grid-template-columns:1.1fr .85fr;gap:9%;align-items:center;min-height:calc(100dvh - 175px);max-width:1050px;margin:auto}.login-copy h1{font-size:clamp(3.2rem,6vw,5.3rem);max-width:500px;margin:24px 0}.login-copy>p{color:var(--muted);max-width:410px}.login-copy .eyebrow{color:var(--coral)}.login-decoration{display:flex;height:145px;padding-top:26px;margin-left:16px;gap:12px}.login-decoration span{font-size:4.3rem;font-family:Georgia,serif;line-height:1.5;color:var(--green);transform:rotate(-12deg)}.login-decoration span:nth-child(2){color:var(--coral);transform:rotate(5deg)}.login-decoration span:nth-child(3){transform:rotate(15deg);color:#b48c4c}.login-panel{padding:33px}.login-panel h2{font-size:2rem}.login-panel>p{margin:10px 0 28px;font-size:.87rem}.login-panel .btn{width:100%}.login-footnote{text-align:center;font-size:.7rem;margin-top:20px;color:var(--muted)}.loading-screen{min-height:70vh;display:flex;justify-content:center;align-items:center;gap:15px;color:var(--muted)}.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:30;background:var(--green);color:var(--white);padding:15px 22px;border-radius:12px;box-shadow:0 10px 35px #0002;font-size:.85rem;max-width:min(90vw,650px);line-height:1.5}.toast.error{background:#963f31}.rules-panel{margin-bottom:28px}.rules-panel h2{font-size:2rem;margin:10px 0 20px}.rules-columns{display:grid;grid-template-columns:1fr 1fr;gap:22px 40px}.rules-columns h3{margin-bottom:6px}.rules-columns p{font-size:.83rem;color:var(--muted)}.rules-defaults{border-top:1px solid var(--line);margin-top:20px;padding-top:17px;font-size:.78rem;line-height:1.6;color:var(--muted)}.admin-panel{margin-bottom:28px}.admin-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px}.user-row{padding:12px 0;border-bottom:1px solid var(--line)}.user-row .spread{gap:8px}.user-row p{font-size:.76rem}.admin-form h3{margin-bottom:15px}.reset-form{display:flex;gap:8px;margin-top:12px}.reset-form input{border:1px solid var(--line);background:var(--white);min-width:0;width:100%;padding:10px}.table-heading{margin-bottom:22px}.table-heading h1{font-size:2.55rem;margin:8px 0 0;overflow-wrap:anywhere}.table-heading .eyebrow{color:var(--coral)}.table-heading p{font-size:.82rem;margin-top:10px}.waiting-layout{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(280px,1fr);gap:26px}.seat-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:22px 0}.waiting-seat{display:flex;align-items:center;gap:12px;padding:16px;background:#f6f6ef;border:1px solid var(--line);border-radius:13px;min-width:0}.avatar{width:38px;height:38px;background:#e4e9da;border-radius:50%;display:grid;place-items:center;color:var(--green);font-size:.8rem;font-weight:750;flex-shrink:0}.waiting-seat .seat-name{font-size:.86rem;font-weight:650;overflow-wrap:anywhere}.waiting-seat .hint{font-size:.7rem}.waiting-seat .badge{margin-left:auto}.waiting-footer{border-top:1px solid var(--line);padding-top:22px;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}.setup-list{margin-top:21px}.setup-line{display:flex;justify-content:space-between;gap:16px;padding:13px 0;border-top:1px solid var(--line);font-size:.8rem}.setup-line span:first-child{color:var(--muted)}.setup-line span:last-child{text-align:right}.table-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:23px;align-items:start}.table-main{min-width:0}.game-surface{position:relative;border-radius:24px 24px 0 0;padding:26px;background:radial-gradient(ellipse at 48% 32%,#2a5948,var(--green) 83%);border:1px solid #10352b;color:var(--white);overflow:hidden;min-height:387px}.game-surface:before{content:"";position:absolute;inset:14px;border:1px solid #adc99d16;border-radius:17px;pointer-events:none}.surface-top{position:relative;display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:22px}.surface-top .eyebrow{color:#bdcbb8;font-size:.62rem}.turn-indicator{font-size:.78rem;display:flex;gap:8px;align-items:center}.turn-indicator .status-dot{background:var(--gold)}.opponents{display:flex;justify-content:center;gap:9px;flex-wrap:wrap;position:relative;margin-bottom:24px}.player-seat{background:#ffffff07;border:1px solid #ffffff14;border-radius:12px;padding:10px 12px;min-width:86px;max-width:155px;flex:0 1 auto}.player-seat.active{background:#ffffff10;border-color:#d5ad688c}.player-seat.you{border-style:dashed}.player-seat .name{font-size:.73rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:650}.player-seat .seat-meta{font-size:.59rem;margin-top:5px;color:#b9cbbd;display:flex;align-items:center;gap:5px}.mini-cards{display:flex;height:21px;margin-top:9px;align-items:center;gap:3px}.mini-card{height:20px;width:13px;border-radius:2px;border:1px solid #d9d9b979;background:repeating-linear-gradient(45deg,#809781 0,#809781 1px,transparent 1px,transparent 4px)}.mini-card-count{font-size:.63rem;margin-left:3px;color:#c7d4c5}.piles{display:flex;align-items:flex-start;justify-content:center;gap:34px;position:relative;margin:22px 0 12px}.pile-group{display:grid;justify-items:center;gap:10px}.pile-label{text-transform:uppercase;letter-spacing:.13em;font-size:.58rem;color:#c9d6c4;font-weight:650}.pile-caption{font-size:.65rem;color:#c8d3c3;text-align:center;max-width:120px;line-height:1.45}.playing-card{height:137px;width:95px;border-radius:10px;background:#fffdf5;color:#253c33;position:relative;border:1px solid #e5e2d8;box-shadow:0 5px 10px #00000015;flex-shrink:0;user-select:none;font-family:Georgia,serif}.playing-card.red{color:var(--red)}.card-corner{position:absolute;left:8px;top:7px;display:flex;flex-direction:column;align-items:center;line-height:1;font-size:1.2rem;gap:3px}.card-corner span+span{font-size:.94rem}.card-corner.bottom{transform:rotate(180deg);left:auto;top:auto;right:8px;bottom:7px}.card-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:2.7rem}.playing-card.back{border:5px solid #e4dbbd;background-color:#839276;background-image:repeating-linear-gradient(45deg,transparent 0,transparent 7px,#ffffff19 7px,#ffffff19 8px),repeating-linear-gradient(-45deg,transparent 0,transparent 7px,#ffffff19 7px,#ffffff19 8px);box-shadow:3px 3px 0 #fffdf2,4px 4px 0 #d4d1bd,7px 7px 0 #fffdf2,8px 8px 0 #d4d1bd}.card-back-symbol{position:absolute;inset:10px;border:1px solid #e4dbbd99;border-radius:3px;display:grid;place-items:center;color:#e4dbbd;font-size:2.5rem}.playing-card.empty{background:#ffffff05;border:1px dashed #ffffff40;box-shadow:none;color:#d5dec8;display:grid;place-items:center;font-family:inherit;font-size:.75rem}.playing-card.small-card{height:91px;width:64px;border-radius:7px}.small-card .card-corner{left:5px;top:5px;font-size:.85rem;gap:2px}.small-card .card-corner span+span{font-size:.68rem}.small-card .card-corner.bottom{left:auto;top:auto;right:5px;bottom:5px}.small-card .card-center{font-size:1.8rem}.hand-area{padding:23px 27px 26px;border:1px solid var(--line);border-top:0;background:var(--white);border-radius:0 0 24px 24px}.hand-title h2{font-size:1.7rem}.hand-title .hint{font-size:.75rem}.hand-cards{display:flex;justify-content:center;gap:13px;padding:30px 4px 21px;min-height:190px;overflow-x:auto;align-items:center}.card-button{padding:0;border:none;background:none;position:relative;flex-shrink:0;border-radius:10px;transition:transform .17s;min-height:0}.card-button:hover:not(:disabled){transform:translateY(-5px)}.card-button.selected{transform:translateY(-12px)}.card-button.selected .playing-card{outline:3px solid var(--gold);outline-offset:3px}.selection-check{position:absolute;right:-9px;top:-9px;border-radius:50%;background:var(--green);color:white;width:24px;height:24px;font-family:inherit;font-size:13px;display:grid;place-items:center;border:2px solid var(--white)}.hand-cards .empty-hand{font-size:.87rem;color:var(--muted);text-align:center;max-width:310px}.move-controls{border-top:1px solid var(--line);padding-top:18px;display:grid;gap:17px}.pickup-options{display:flex;gap:8px;flex-wrap:wrap}.pickup-options button{padding:10px 12px;border:1px solid var(--line);background:transparent;color:var(--muted);min-height:41px;font-size:.76rem;flex:1 1 auto;white-space:nowrap}.pickup-options button.selected{border-color:var(--green);background:#edf1e6;color:var(--green)}.pickup-label{font-size:.74rem;font-weight:650;margin-bottom:10px}.move-actions{display:flex;justify-content:space-between;gap:14px;align-items:center}.move-actions .hint{font-size:.74rem;max-width:240px}.move-actions .gap{flex-shrink:0}.table-sidebar{display:grid;gap:18px}.table-sidebar .panel{padding:21px}.table-sidebar h2{font-size:1.45rem}.score-table{border-collapse:collapse;width:100%;font-size:.8rem;margin-top:15px}.score-table td{padding:11px 0;border-bottom:1px solid var(--line)}.score-table tr:last-child td{border:0}.score-table td:last-child{text-align:right;font-variant-numeric:tabular-nums;font-weight:650}.score-table .current td:first-child{color:var(--coral)}.score-name{overflow-wrap:anywhere;max-width:160px}.score-table .you-tag{color:var(--muted);font-size:.66rem;font-weight:400}.history-list{display:grid;gap:0;margin-top:17px;max-height:365px;overflow-y:auto}.history-item{padding:12px 0;border-top:1px solid var(--line)}.history-item:first-child{border:0;padding-top:0}.history-item p{font-size:.76rem;line-height:1.55;overflow-wrap:anywhere}.history-item .history-person{font-size:.63rem;color:var(--muted);margin-bottom:4px}.history-item.undone{opacity:.5}.history-item.undone p{text-decoration:line-through}.history-actions{display:flex;gap:4px;margin-top:5px;flex-wrap:wrap}.history-actions .text-button{padding:2px 6px 2px 0;min-height:29px;font-size:.65rem;text-decoration:underline;text-underline-offset:3px}.review-banner{padding:19px 22px;background:#fff1d7;border:1px solid #e4c185;border-radius:15px;margin-bottom:18px}.review-banner h3{font-size:.88rem;margin-bottom:5px}.review-banner p{font-size:.79rem;color:#7d602d;line-height:1.6}.review-banner .gap{margin-top:13px}.result-panel{border:1px solid #c7d7bc;background:#f0f4e8;border-radius:17px;padding:23px;margin-bottom:20px}.result-panel h2{font-size:2rem;margin:9px 0}.result-panel>p{font-size:.85rem}.result-hands{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;margin:20px 0}.result-hand{background:#ffffff8a;padding:13px;border:1px solid #d7decf;border-radius:12px}.result-hand h3{font-size:.77rem;margin-bottom:10px;overflow-wrap:anywhere}.revealed-cards{display:flex;gap:5px;overflow-x:auto}.result-hand .hint{font-size:.7rem;margin-top:11px}.result-actions{margin-top:16px}.offline-banner{padding:12px 20px;font-size:.8rem;line-height:1.5;background:#f4e1c8;color:#73532d;text-align:center}.footer-note{text-align:center;color:#899083;font-size:.65rem;letter-spacing:.07em;margin-top:32px}.confirm-line{font-size:.76rem;color:var(--muted);line-height:1.55}.rules-link{text-decoration:underline;text-underline-offset:3px;border:0;background:transparent;color:var(--muted);font-size:.78rem;min-height:32px;padding:0}
@media(min-width:1200px){.main-container.game-container{padding-top:28px}.game-surface{min-height:410px}.piles{gap:52px;margin-top:25px}.table-layout{grid-template-columns:minmax(0,1fr) 300px}.library-card{min-height:310px}.decorative-hand{transform:scale(.87) rotate(10deg)}}
@media(max-width:1050px){.app-header{padding:22px 28px}.main-container{padding:32px 28px 45px}.table-layout{grid-template-columns:minmax(0,1fr) 240px;gap:16px}.game-surface{padding:24px 21px}.piles{gap:22px}.hand-area{padding:22px}.move-actions{align-items:stretch;flex-direction:column}.move-actions>.gap{justify-content:stretch}.move-actions .btn{flex:1}.move-actions .hint{max-width:none}.decorative-hand{transform:scale(.65) rotate(10deg);right:0}.library-card p{max-width:190px}.lobby-layout{grid-template-columns:minmax(0,1.25fr) minmax(290px,1fr)}.login-layout{gap:6%}}
@media(max-width:800px){.table-layout{grid-template-columns:1fr}.table-sidebar{grid-template-columns:1fr 1fr}.table-sidebar>.hint{grid-column:1/-1}.table-sidebar .history-list{max-height:255px}.lobby-layout{grid-template-columns:1fr}.lobby-layout>.stack{grid-template-columns:1fr 1fr;align-items:start}.library-card{height:100%;min-height:340px}.waiting-layout{grid-template-columns:1fr}.waiting-layout>.panel:last-child{max-width:none}.login-layout{grid-template-columns:1fr;max-width:460px;gap:34px;min-height:0;padding:15px 0}.login-copy h1{font-size:3.8rem;margin:18px 0}.login-copy .login-decoration{display:none}.login-copy>p{font-size:.88rem}.login-copy{padding:10px 0}.admin-grid{grid-template-columns:1fr}.rules-columns{gap:22px}.move-actions{flex-direction:row;align-items:center}.move-actions .hint{max-width:260px}.hand-cards{min-height:182px}.game-surface{min-height:365px}.surface-top{margin-bottom:20px}.opponents{margin-bottom:21px}}
@media(max-width:580px){.app-header{padding:17px 18px;gap:6px}.brand-mark{height:35px;width:35px;font-size:24px;border-radius:11px}.brand-name{font-size:1.38rem}.brand-caption{font-size:.51rem;letter-spacing:.11em}.brand{gap:8px}.header-actions{gap:4px}.header-actions .text-button{font-size:.71rem;padding:5px;min-height:38px}.header-actions .connection{display:none}.main-container{padding:28px 18px 35px}.page-intro{margin-bottom:26px}.page-intro h1{font-size:2.85rem}.page-intro p{font-size:.88rem;margin-top:13px}.page-intro .eyebrow{font-size:.61rem;margin-bottom:12px}.panel{padding:21px}.panel-heading{padding-bottom:16px;margin-bottom:17px}.panel-heading h2{font-size:1.6rem}.lobby-layout{gap:20px}.lobby-layout>.stack{grid-template-columns:1fr;gap:20px}.library-card{min-height:245px;padding:25px}.library-card h2{margin-top:23px;font-size:2.7rem}.library-card p{max-width:215px}.decorative-hand{transform:scale(.65) rotate(10deg);right:13px;top:62px}.library-card .badge{margin-top:19px}.room-row{padding:15px;align-items:flex-start}.room-row h3{font-size:.9rem}.room-row .btn{font-size:.76rem;padding:10px 12px}.login-panel{padding:27px}.login-copy h1{font-size:3.65rem}.login-layout{gap:20px;padding-top:0}.login-panel>p{margin-bottom:23px}.rules-columns{grid-template-columns:1fr;gap:18px}.rules-panel{padding:22px}.rules-panel h2{font-size:1.8rem}.table-heading{align-items:flex-start;margin-bottom:20px}.table-heading h1{font-size:2.1rem}.table-heading .eyebrow{font-size:.62rem}.table-heading p{font-size:.74rem}.table-heading>.gap{gap:6px;flex-wrap:wrap;justify-content:flex-end}.table-heading .btn{font-size:.7rem;padding:8px 10px;min-height:38px}.table-heading .badge{font-size:.6rem}.seat-grid{grid-template-columns:1fr;margin:19px 0;gap:9px}.waiting-seat{padding:12px 14px}.waiting-footer>.gap{width:100%}.waiting-footer .btn{flex:1}.waiting-footer{gap:16px}.game-container{padding:25px 12px 32px}.game-container .table-heading{padding:0 6px}.game-surface{padding:20px 17px;border-radius:20px 20px 0 0;min-height:350px}.game-surface:before{inset:9px;border-radius:12px}.surface-top{margin-bottom:18px}.surface-top .eyebrow{font-size:.56rem}.turn-indicator{font-size:.65rem;gap:5px}.opponents{gap:6px;margin-bottom:21px}.player-seat{min-width:72px;max-width:125px;padding:8px 9px;border-radius:10px}.player-seat .name{font-size:.66rem}.player-seat .seat-meta{font-size:.54rem;gap:4px}.player-seat .mini-cards{margin-top:7px;height:17px;gap:2px}.mini-card{width:11px;height:16px}.piles{gap:23px;margin:20px 0 9px}.piles .playing-card{height:111px;width:77px;border-radius:8px}.piles .card-corner{font-size:1rem;top:6px;left:6px;gap:2px}.piles .card-corner span+span{font-size:.78rem}.piles .card-corner.bottom{top:auto;left:auto;bottom:6px;right:6px}.piles .card-center{font-size:2.15rem}.pile-group{gap:9px}.pile-label{font-size:.52rem;letter-spacing:.1em}.pile-caption{font-size:.56rem;max-width:80px}.hand-area{padding:20px 18px;border-radius:0 0 20px 20px}.hand-title h2{font-size:1.55rem}.hand-title .hint{font-size:.66rem}.hand-cards{gap:12px;padding-top:29px;padding-bottom:19px;min-height:180px}.hand-cards .playing-card{width:89px;height:128px}.move-actions{flex-direction:column;align-items:stretch;gap:14px}.move-actions .hint{max-width:none}.move-actions>.gap{width:100%;gap:10px}.move-actions .btn{min-height:47px;flex:1;font-size:.8rem;padding:12px}.pickup-options{gap:6px}.pickup-options button{font-size:.68rem;padding:9px 8px;min-height:42px}.pickup-label{font-size:.7rem}.table-sidebar{grid-template-columns:1fr 1fr;gap:12px}.table-sidebar .panel{padding:17px}.table-sidebar h2{font-size:1.32rem}.score-table{font-size:.72rem;margin-top:11px}.score-table td{padding:10px 0}.score-table .you-tag{display:block;font-size:.6rem}.history-item p{font-size:.7rem}.history-item .history-person{font-size:.59rem}.history-actions .text-button{font-size:.59rem}.table-sidebar .hint{font-size:.72rem}.review-banner{padding:17px}.result-panel{padding:19px}.result-panel h2{font-size:1.8rem}.result-hands{grid-template-columns:1fr 1fr;gap:9px}.result-hand{padding:10px}.result-hand .small-card{width:44px;height:65px;border-radius:4px}.result-hand .small-card .card-corner{font-size:.66rem;left:4px;top:4px;gap:1px}.result-hand .small-card .card-corner span+span{font-size:.5rem}.result-hand .small-card .card-corner.bottom{left:auto;top:auto;right:4px;bottom:4px}.result-hand .small-card .card-center{font-size:1.25rem}.revealed-cards{gap:3px}.result-hand h3{font-size:.7rem}.result-hand .hint{font-size:.63rem}.toast{bottom:16px;padding:13px 17px;font-size:.79rem}.footer-note{margin-top:26px;font-size:.59rem}.user-row .btn{font-size:.69rem;padding:7px 9px}.user-row .gap{gap:5px}.reset-form{flex-wrap:wrap}.reset-form .btn{flex:1}.empty-state{padding:27px 14px}}
@media(max-width:360px){.piles{gap:15px}.table-sidebar{grid-template-columns:1fr}.brand-caption{display:none}.header-actions{gap:0}.hand-cards .playing-card{width:80px;height:117px}.hand-cards{gap:10px}.library-card p{max-width:180px}.decorative-hand{right:0;transform:scale(.56) rotate(10deg)}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
.room-actions{display:grid;justify-items:end;flex-shrink:0;gap:3px}.close-table-button{font-size:.66rem;color:var(--muted);min-height:30px}.mobile-panel-toggle{display:none}.card-pips{position:absolute;inset:23px 24px;display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:1fr;align-items:center;justify-items:center;font-size:1.16rem;line-height:1}.card-pips.pips-2,.card-pips.pips-3{grid-template-columns:1fr;font-size:1.55rem}.card-pips.pips-5 span:last-child,.card-pips.pips-7 span:last-child,.card-pips.pips-9 span:last-child{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.card-pips.pips-7{grid-template-columns:1fr 1fr;column-gap:16px}.card-pips.pips-9{column-gap:15px}.card-pips.pips-8,.card-pips.pips-9,.card-pips.pips-10{font-size:.98rem;inset:23px 22px}.card-pips span:nth-child(n+6){transform:rotate(180deg)}.court-medallion{position:absolute;inset:25px 21px;border:1px solid currentColor;outline:1px solid #d5ad6870;outline-offset:3px;display:flex;align-items:center;justify-content:center;flex-direction:column;background:linear-gradient(135deg,#d5ad681c,transparent 50%,#d5ad681c);font-size:2.1rem;font-style:italic}.court-medallion small{font-size:1.2rem;line-height:1}.small-card .card-pips{inset:17px 16px;font-size:.76rem}.small-card .card-pips.pips-2,.small-card .card-pips.pips-3{font-size:1rem}.small-card .card-pips.pips-8,.small-card .card-pips.pips-9,.small-card .card-pips.pips-10{font-size:.6rem}.small-card .court-medallion{inset:19px 16px;font-size:1.1rem;outline-offset:2px}.small-card .court-medallion small{font-size:.75rem}.game-surface{background-image:radial-gradient(ellipse at 48% 25%,#376b535e,transparent 64%),repeating-radial-gradient(circle at 25% 30%,#ffffff04 0,#ffffff04 .7px,transparent .8px,transparent 3px),linear-gradient(150deg,#245443,var(--green));box-shadow:inset 0 0 65px #09251d33}.playing-card{background-image:linear-gradient(135deg,#ffffffb8,transparent 47%,#d8ccad16);box-shadow:0 1px 0 #ffffffe0 inset,0 4px 2px #0000000c,0 9px 15px #0000001c}.card-button{animation:card-arrive .24s ease-out both}.card-button:nth-child(2){animation-delay:.035s}.card-button:nth-child(3){animation-delay:.07s}.card-button:active:not(:disabled){scale:.97}@keyframes card-arrive{from{opacity:.65;translate:0 7px}to{opacity:1;translate:0 0}}
@media(max-width:580px){.in-game .app-header{padding:11px 16px}.in-game .brand-caption{display:none}.in-game .app-header .brand-mark{height:32px;width:32px;font-size:22px}.in-game .app-header .brand-name{font-size:1.26rem}.in-game .main-container.game-container{padding:17px 10px 25px}.active-round .main-container.game-container{padding-bottom:205px}.game-container .table-heading{margin-bottom:13px;padding:0 5px;gap:10px}.game-container .table-heading h1{font-size:1.67rem;margin-top:7px}.game-container .table-heading .eyebrow{font-size:.52rem;letter-spacing:.12em}.game-container .table-heading p{font-size:.64rem;margin-top:6px;max-width:245px;line-height:1.4}.game-container .table-heading>.gap{max-width:104px}.game-container .table-heading .btn{min-height:33px;padding:6px 8px;font-size:.62rem}.game-container .table-heading .badge{font-size:.56rem;padding:5px 8px}.game-surface{padding:15px;min-height:0;border-radius:18px 18px 0 0}.surface-top{margin-bottom:13px}.opponents{justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto;gap:6px;padding-bottom:3px;margin-bottom:11px;scrollbar-width:thin;scrollbar-color:#55745e transparent}.player-seat{flex:0 0 77px;padding:8px 9px;min-width:0;max-width:95px}.player-seat .name{font-size:.63rem}.player-seat .seat-meta{font-size:.49rem;gap:4px;margin-top:4px}.player-seat .mini-cards{display:none}.piles{gap:31px;margin:12px 0 2px}.piles .playing-card{height:102px;width:70px}.piles .card-corner{font-size:.85rem}.piles .card-corner span+span{font-size:.7rem}.piles .card-center{font-size:2rem}.piles .card-pips{inset:20px 18px;font-size:.86rem}.piles .card-pips.pips-2,.piles .card-pips.pips-3{font-size:1.1rem}.piles .card-pips.pips-8,.piles .card-pips.pips-9,.piles .card-pips.pips-10{font-size:.7rem;inset:19px 18px}.piles .court-medallion{inset:20px 18px;font-size:1.3rem;outline-offset:2px}.piles .court-medallion small{font-size:.87rem}.pile-group{gap:7px}.pile-label{font-size:.49rem;letter-spacing:.1em}.pile-caption{font-size:.5rem;line-height:1.3;max-width:84px;min-height:13px}.hand-area{padding:15px 17px 8px;border-radius:0 0 18px 18px}.hand-title h2{font-size:1.35rem}.hand-title .hint{font-size:.6rem}.hand-cards{padding:27px 3px 17px;min-height:167px;gap:15px}.hand-cards .playing-card{width:86px;height:122px}.hand-cards .card-pips{inset:23px 23px;font-size:1rem}.hand-cards .card-pips.pips-8,.hand-cards .card-pips.pips-9,.hand-cards .card-pips.pips-10{font-size:.86rem;inset:22px 21px}.hand-cards .court-medallion{inset:24px 22px;font-size:1.6rem}.move-controls{position:fixed;z-index:10;left:0;right:0;bottom:0;background:#fffdf7f5;backdrop-filter:blur(12px);padding:11px 17px max(13px,env(safe-area-inset-bottom));border-top:1px solid #d4d8c9;box-shadow:0 -8px 25px #123b2d0c;gap:10px}.move-controls .pickup-label{display:none}.move-controls .pickup-options{gap:6px}.move-controls .pickup-options button{font-size:.65rem;min-height:41px;padding:8px 7px;border-radius:9px}.move-controls .move-actions{flex-direction:column;gap:8px}.move-controls .move-actions>.hint{font-size:.65rem;line-height:1.4;align-self:flex-start;min-height:18px}.move-controls .move-actions .btn{min-height:47px;font-size:.81rem;padding:10px}.move-controls>p.hint{display:none}.table-sidebar{grid-template-columns:1fr 1fr;gap:9px}.table-sidebar .panel.collapsible{padding:0;overflow:hidden;border-radius:12px}.mobile-panel-toggle{display:flex;align-items:center;justify-content:space-between;width:100%;padding:13px 15px;border:0;border-radius:0;color:var(--ink);background:var(--white);font-size:.74rem;font-weight:650;min-height:47px;text-align:left}.collapsible-content{display:none;padding:0 15px 15px}.collapsible.is-open .collapsible-content{display:block}.collapsible.is-open{grid-column:1/-1}.collapsible .collapsible-content h2{display:none}.collapsible .collapsible-content>.spread{justify-content:flex-end}.collapsible .collapsible-content .score-table{margin-top:5px}.table-sidebar>.hint{font-size:.64rem;margin:0 6px;line-height:1.5}.table-sidebar .history-list{max-height:300px}.table-layout{gap:13px}.footer-note{font-size:.52rem;margin-top:18px}.result-hand .small-card .card-pips{inset:14px 12px;font-size:.49rem}.result-hand .small-card .card-pips.pips-2,.result-hand .small-card .card-pips.pips-3{font-size:.69rem}.result-hand .small-card .card-pips.pips-8,.result-hand .small-card .card-pips.pips-9,.result-hand .small-card .card-pips.pips-10{font-size:.41rem}.result-hand .small-card .court-medallion{inset:14px 11px;font-size:.8rem;outline-offset:1px}.result-hand .small-card .court-medallion small{font-size:.5rem}}
@media(max-width:370px){.piles{gap:22px}.move-controls{padding-left:12px;padding-right:12px}.hand-cards{gap:12px}.hand-cards .playing-card{width:80px;height:116px}}
.mobile-hand-count{display:none}.joker-tag{position:absolute;left:50%;bottom:8px;transform:translateX(-50%);background:var(--green);color:var(--white);font-size:.51rem;border-radius:4px;padding:3px 4px;white-space:nowrap;text-transform:uppercase;letter-spacing:.04em}.hand-cards{justify-content:safe center}.toast{z-index:30}
@media(max-width:580px){.mobile-hand-count{display:inline}.player-seat .seat-meta{gap:2px;font-size:.46rem;white-space:nowrap}.player-seat{flex-basis:84px}.history-actions .text-button{min-height:44px;padding-right:15px;font-size:.71rem}.history-item .history-person{font-size:.68rem}.history-item p{font-size:.79rem}.active-round .toast{bottom:180px}.game-container .table-heading .btn{min-height:38px}.mobile-panel-toggle{min-height:48px}.in-game .footer-note{margin-bottom:5px}.joker-tag{font-size:.47rem;bottom:7px}.reset-form input{font-size:16px}.field input,.field select{font-size:16px}}
.action-dialog{padding:31px;border:1px solid #e3dfd1;border-radius:23px;width:min(440px,calc(100vw - 34px));max-height:calc(100dvh - 48px);overflow-y:auto;background:var(--white);color:var(--ink);box-shadow:0 24px 100px #071f2459;overscroll-behavior:contain}.action-dialog::backdrop{background:#0d251bd1;backdrop-filter:blur(5px)}.dialog-symbol{display:grid;place-items:center;width:44px;height:44px;margin-bottom:20px;border-radius:13px;background:#e9ede1;color:var(--green);font-size:28px}.action-dialog h2{font-size:2rem;line-height:1.12;margin:0 0 14px}.action-dialog #dialog-message{font-size:.86rem;line-height:1.7;color:var(--muted)}.dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:26px}.dialog-actions .btn{min-height:46px;padding:12px 20px}.action-dialog .field{margin-top:22px;gap:9px}.optional-label{color:var(--muted);font-weight:400;display:inline}.action-dialog textarea{font:inherit;resize:vertical;min-height:92px;max-height:190px;width:100%;padding:12px;border:1px solid #cfd5c5;border-radius:10px;background:#fffefb;color:var(--ink);font-size:.9rem;font-weight:400;line-height:1.5}.action-dialog textarea:focus-visible{outline:3px solid #bc873e;outline-offset:3px}.action-dialog textarea::placeholder{color:#899383}.action-dialog .hint{font-weight:400;font-size:.7rem}.action-dialog[open]{animation:dialog-arrive .16s ease-out}@keyframes dialog-arrive{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:580px){.action-dialog{padding:25px;border-radius:20px;width:calc(100vw - 32px)}.action-dialog h2{font-size:1.85rem}.action-dialog #dialog-message{font-size:.81rem}.dialog-symbol{margin-bottom:17px;width:40px;height:40px;font-size:26px}.dialog-actions{margin-top:23px;gap:9px}.dialog-actions .btn{flex:1;min-height:48px;padding:11px 12px;font-size:.8rem}.action-dialog textarea{font-size:16px}.action-dialog .field{font-size:.75rem}}

/* The shared deck rests over the joker, as it does at a physical table. */
.physical-piles{--pile-width:95px;--pile-height:137px;gap:62px;align-items:flex-start}
.physical-piles .playing-card{width:var(--pile-width);height:var(--pile-height)}
.draw-joker-stack{position:relative;width:calc(var(--pile-width) * 1.52);height:calc(var(--pile-height) + 12px);margin:0 4px}
.joker-layer{position:absolute;top:5px;left:0;transform:rotate(-5deg);transform-origin:50% 50%;z-index:1}
.draw-layer{position:absolute;top:0;left:calc(var(--pile-width) * .5);z-index:2;transform:rotate(1deg)}
.draw-layer .playing-card{box-shadow:2px 2px 0 #fffdf2,3px 3px 0 #b5ba9f,5px 5px 0 #fffdf2,6px 6px 0 #b5ba9f,0 8px 15px #071e2259}
.playing-stack-card{height:calc(var(--pile-height) + 12px);padding-top:4px;transform:rotate(3deg)}
.physical-piles .pile-caption{max-width:165px;display:grid;gap:5px;line-height:1.3}
.physical-piles .pile-caption strong{font-weight:600;color:#e5e8d9}
.physical-piles .pile-caption span{font-size:.61rem;color:#b9cbbd}
.empty-draw-label{position:absolute;right:-2px;top:33%;width:49px;text-align:center;font-size:.6rem;line-height:1.45;color:#b9cbbd}

/* Each card retains an exposed half-width tap area when the hand is fanned. */
.hand-cards{--hand-card-width:140px;--hand-card-height:198px;display:block;min-height:0;padding:0;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scrollbar-color:#bfc9b6 transparent}
.hand-fan{display:flex;align-items:center;justify-content:center;width:max-content;margin-inline:auto;padding:38px 26px 26px;isolation:isolate}
.hand-fan[data-card-count="0"]{width:100%;min-height:230px;padding:35px 10px}
.hand-fan .card-button{width:var(--hand-card-width);min-width:var(--hand-card-width);min-height:var(--hand-card-height);margin:0;z-index:var(--fan-layer);transform:translateY(var(--fan-offset)) rotate(var(--fan-angle));transform-origin:50% 100%;transition:transform .18s ease,filter .18s ease;animation:none}
.hand-fan .card-button+.card-button{margin-left:calc(var(--hand-card-width) * -.5)}
.hand-fan .card-button .playing-card{width:var(--hand-card-width);height:var(--hand-card-height);border-radius:12px;box-shadow:0 1px 0 #ffffff inset,0 5px 5px #102e2221,0 10px 20px #102e221f}
.hand-fan .card-button.selected,.hand-fan .card-button.selected:hover:not(:disabled){transform:translateY(calc(var(--fan-offset) - 27px)) rotate(var(--fan-angle))}
.hand-fan .card-button:focus-visible{outline:none}
.hand-fan .card-button:focus-visible .playing-card{outline:3px solid #bc873e;outline-offset:4px}
.hand-fan .card-button:not(.selected):hover:not(:disabled){transform:translateY(calc(var(--fan-offset) - 5px)) rotate(var(--fan-angle))}
.hand-fan .card-button:disabled{opacity:1;cursor:default}
.hand-fan .card-corner{font-size:1.55rem;top:10px;left:11px;gap:4px}
.hand-fan .card-corner span+span{font-size:1.2rem}
.hand-fan .card-corner.bottom{left:auto;top:auto;right:11px;bottom:10px}
.hand-fan .card-center{font-size:3.7rem}
.hand-fan .card-pips{inset:35px 33px;font-size:1.7rem}
.hand-fan .card-pips.pips-2,.hand-fan .card-pips.pips-3{font-size:2.25rem}
.hand-fan .card-pips.pips-8,.hand-fan .card-pips.pips-9,.hand-fan .card-pips.pips-10{inset:34px 31px;font-size:1.45rem}
.hand-fan .court-medallion{inset:36px 30px;font-size:3.1rem;outline-offset:4px}
.hand-fan .court-medallion small{font-size:1.75rem}
.hand-fan .selection-check{left:9px;right:auto;top:-10px;width:27px;height:27px;font-size:.8rem}
.hand-fan .joker-tag{left:8px;bottom:48px;transform:none;font-size:.52rem;padding:4px 5px}
@media(max-width:580px){
  .physical-piles{--pile-width:76px;--pile-height:109px;gap:37px;margin:12px 0 2px}
  .physical-piles .pile-caption{max-width:124px;gap:4px;font-size:.56rem;min-height:29px}
  .physical-piles .pile-caption span{font-size:.5rem}
  .physical-piles .pile-label{font-size:.51rem}
  .physical-piles .pile-group{gap:7px}
  .physical-piles .card-corner{font-size:.98rem;top:6px;left:7px}
  .physical-piles .card-corner span+span{font-size:.75rem}
  .physical-piles .card-corner.bottom{top:auto;left:auto;bottom:6px;right:7px}
  .empty-draw-label{font-size:.51rem;right:-6px;width:40px}
  .hand-cards{--hand-card-width:116px;--hand-card-height:165px}
  .hand-fan{padding:34px 20px 20px}
  .hand-fan[data-card-count="0"]{min-height:202px}
  .hand-fan .card-button .playing-card{border-radius:11px}
  .hand-fan .card-corner{font-size:1.4rem;top:9px;left:9px;gap:3px}
  .hand-fan .card-corner span+span{font-size:1.05rem}
  .hand-fan .card-corner.bottom{left:auto;top:auto;right:9px;bottom:9px}
  .hand-fan .card-center{font-size:3.15rem}
  .hand-fan .card-pips{inset:29px 28px;font-size:1.45rem}
  .hand-fan .card-pips.pips-2,.hand-fan .card-pips.pips-3{font-size:1.85rem}
  .hand-fan .card-pips.pips-8,.hand-fan .card-pips.pips-9,.hand-fan .card-pips.pips-10{inset:28px 26px;font-size:1.13rem}
  .hand-fan .court-medallion{inset:31px 27px;font-size:2.5rem;outline-offset:3px}
  .hand-fan .court-medallion small{font-size:1.45rem}
  .hand-fan .card-button.selected,.hand-fan .card-button.selected:hover:not(:disabled){transform:translateY(calc(var(--fan-offset) - 24px)) rotate(var(--fan-angle))}
  .hand-fan .selection-check{left:7px;width:25px;height:25px;top:-8px}
  .hand-fan .joker-tag{left:6px;bottom:40px;font-size:.48rem;padding:3px 4px}
}
@media(max-width:370px){
  .physical-piles{--pile-width:71px;--pile-height:102px;gap:26px}
  .hand-cards{--hand-card-width:108px;--hand-card-height:154px}
  .hand-fan{padding-left:18px;padding-right:18px}
  .hand-fan .card-pips{inset:29px 27px;font-size:1.35rem}
  .hand-fan .court-medallion{inset:30px 25px;font-size:2.15rem}
}

.login-mode-picker{border:0;padding:0;margin:0 0 2px;min-width:0}
.login-mode-picker legend{font-size:.78rem;font-weight:650;margin-bottom:10px;padding:0}
.login-mode-options{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.login-mode-option{position:relative;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 13px;border:1px solid var(--line);border-radius:12px;cursor:pointer;background:#fffefb;min-height:68px}
.login-mode-option.selected{background:#eaf0e2;border-color:#547864;box-shadow:inset 0 0 0 1px #547864}
.login-mode-option input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.login-mode-option:has(input:focus-visible){outline:3px solid #bc873e;outline-offset:3px}
.login-mode-option strong{display:block;font-size:.87rem;font-weight:700}
.login-mode-option small{display:block;font-size:.65rem;color:var(--muted);margin-top:5px}
.login-mode-option .mode-symbol{font-size:1.35rem;color:var(--green);opacity:.8}
.login-mode-note{background:#f0f2e8;border-radius:10px;padding:12px 14px}
.login-panel .field .hint{font-weight:400;font-size:.72rem}

/* Audience mode presents only the public table and the hands revealed at a show. */
.audience-mode{background:#102f27;color:#f7f3e5}
.audience-mode .app-header{max-width:1920px;border-color:#bdd0b521;padding:25px 3.3%}
.audience-mode .brand-mark{background:#eee9d8;color:#173f35}
.audience-mode .brand-caption,.audience-mode .connection{color:#b8cabb}
.audience-mode .header-actions .text-button{color:#edeedb}
.audience-mode .header-actions .text-button:hover{color:var(--gold)}
.audience-mode .header-actions .text-button:disabled{color:#b9cabb}
.audience-badge{background:#ffffff10;color:#d6dfca;border:1px solid #cbd3b333}
.fullscreen-button{display:inline-flex;align-items:center;gap:9px}
.fullscreen-button span{font-size:1.2rem;line-height:1}
.audience-container{max-width:1920px;padding:31px 3.3% 45px}
.audience-heading{display:flex;justify-content:space-between;align-items:center;gap:25px;margin-bottom:29px}
.audience-heading .eyebrow{color:var(--gold);font-size:.72rem;margin-bottom:13px}
.audience-heading h1{font-size:clamp(2.7rem,3.6vw,4.6rem);overflow-wrap:anywhere}
.audience-heading>div:first-child{min-width:0}
.audience-heading p:last-child{margin-top:12px;color:#b8cabb;font-size:.93rem}
.audience-round-marker{border-left:1px solid #b7cba83b;padding:8px 0 8px 26px;flex-shrink:0;max-width:36%;display:grid;gap:10px}
.audience-round-marker>span{font-size:.74rem;color:#b8cabb;text-transform:uppercase;letter-spacing:.1em}
.audience-round-marker strong{font-family:Georgia,serif;font-weight:400;font-size:clamp(1.4rem,2.1vw,2.4rem);color:#eee4c2;overflow-wrap:anywhere}
.audience-game-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,340px);gap:26px;align-items:start}
.audience-board{min-width:0}
.audience-board .game-surface{border-radius:25px;padding:30px;min-height:510px;border-color:#a8bd8c4a;box-shadow:inset 0 0 75px #08261b40,0 16px 40px #071e2424}
.audience-board .surface-top{margin-bottom:28px}
.audience-board .surface-top .eyebrow{font-size:.77rem}
.audience-board .turn-indicator{font-size:1rem}
.audience-board .opponents{gap:10px;margin-bottom:32px}
.audience-board .player-seat{flex:1 1 125px;min-width:100px;max-width:190px;padding:13px 15px;min-height:89px;border-radius:13px}
.audience-board .player-seat .name{font-size:1rem}
.audience-board .player-seat .seat-meta{font-size:.7rem;margin-top:7px}
.audience-board .mini-cards{margin-top:11px;height:23px;gap:4px}
.audience-board .mini-card{width:14px;height:22px}
.audience-board .mini-card-count{font-size:.76rem;margin-left:8px;white-space:nowrap}
.audience-board .physical-piles{--pile-width:130px;--pile-height:185px;gap:clamp(45px,7vw,120px);margin:28px 0 10px}
.audience-board .physical-piles .pile-label{font-size:.76rem}
.audience-board .physical-piles .pile-group{gap:17px}
.audience-board .physical-piles .pile-caption{max-width:220px;gap:8px;font-size:.85rem}
.audience-board .physical-piles .pile-caption span{font-size:.75rem}
.audience-board .physical-piles .card-corner{font-size:1.55rem;top:10px;left:11px;gap:4px}
.audience-board .physical-piles .card-corner span+span{font-size:1.2rem}
.audience-board .physical-piles .card-corner.bottom{top:auto;left:auto;bottom:10px;right:11px}
.audience-board .physical-piles .card-center{font-size:3.8rem}
.audience-board .physical-piles .card-pips{inset:32px 29px;font-size:1.6rem}
.audience-board .physical-piles .card-pips.pips-2,.audience-board .physical-piles .card-pips.pips-3{font-size:2.2rem}
.audience-board .physical-piles .card-pips.pips-8,.audience-board .physical-piles .card-pips.pips-9,.audience-board .physical-piles .card-pips.pips-10{font-size:1.3rem;inset:33px 30px}
.audience-board .physical-piles .court-medallion{inset:33px 30px;font-size:2.7rem}
.audience-board .physical-piles .court-medallion small{font-size:1.5rem}
.audience-board .physical-piles .empty-draw-label{width:62px;right:-1px;font-size:.8rem}
.audience-sidebar{display:grid;gap:21px;color:var(--ink)}
.audience-sidebar .panel{padding:25px}
.audience-sidebar h2{font-size:1.85rem}
.audience-sidebar .score-table{font-size:1rem;margin-top:16px}
.audience-sidebar .score-table td{padding:12px 0}
.audience-sidebar .score-table td:last-child{font-size:1.5rem;line-height:1.25;font-weight:600}
.audience-sidebar .score-name{max-width:225px}
.audience-sidebar .history-list{max-height:250px}
.audience-sidebar .history-item p{font-size:.85rem}
.audience-sidebar .history-item .history-person{font-size:.75rem}
.audience-sidebar .collapsible-content{display:block;padding:0}
.audience-sidebar .mobile-panel-toggle{display:none}
.audience-sidebar .collapsible-content h2{display:block}
.audience-privacy-note{display:flex;justify-content:center;align-items:center;gap:10px;margin-top:21px;font-size:.78rem;color:#b9cbbd;line-height:1.6;text-align:center}
.audience-privacy-note>span{color:var(--gold);font-size:1rem;flex-shrink:0}
.audience-review{display:flex;align-items:center;gap:16px;padding:17px 22px;border:1px solid #bca5656b;background:#4d4c28;margin-bottom:22px;border-radius:13px;line-height:1.5;color:#f2e3b7}
.audience-review strong{font-size:.92rem;flex-shrink:0}
.audience-review span{font-size:.85rem}
.audience-board .result-panel{color:var(--ink);padding:30px;border-radius:22px;margin-bottom:0}
.audience-board .result-panel h2{font-size:clamp(2rem,3vw,3.4rem);margin:14px 0}
.audience-board .result-panel>p{font-size:1rem}
.audience-board .result-hands{gap:15px;margin:26px 0;grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.audience-board .result-hand{padding:17px}
.audience-board .result-hand h3{font-size:.95rem;margin-bottom:14px}
.audience-board .result-hand .hint{font-size:.77rem}
.audience-board .revealed-cards{gap:5px}
.audience-waiting-intro{text-align:center;padding:20px 0 28px}
.audience-waiting-symbol{display:block;font-size:4.4rem;color:#d1d6b4;line-height:1;margin-bottom:23px}
.audience-waiting-intro .eyebrow{color:#bdcbb8;font-size:.67rem;margin-bottom:13px}
.audience-waiting-intro h2{font-size:clamp(2rem,3vw,3rem);line-height:1.2}
.audience-waiting-intro>p:last-child{font-size:.93rem;color:#bdcbb8;margin-top:13px}
.audience-waiting-seats{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:13px;padding:5px 5px 15px}
.audience-waiting-seat{display:flex;align-items:center;gap:13px;padding:17px;background:#ffffff08;border:1px solid #d0ddbd29;border-radius:13px;min-width:0}
.audience-waiting-seat>div{min-width:0}
.audience-waiting-seat h3{font-size:1rem;overflow-wrap:anywhere}
.audience-waiting-seat p{font-size:.7rem;color:#b9cbbd;margin-top:5px}
.audience-waiting-seat .badge{margin-left:auto;font-size:.65rem}
.audience-waiting-seat .avatar{width:44px;height:44px;background:#cbd5b71c;color:#e7e8d8;font-size:1rem}
.audience-table-notes>h2{margin:15px 0}
.audience-table-notes>p:not(.eyebrow){font-size:.91rem;color:var(--muted);margin-bottom:24px}
.audience-table-notes .setup-line{font-size:.89rem;padding:17px 0}
.audience-lobby-intro{padding:30px 0 35px}
.audience-lobby-intro .eyebrow{color:var(--gold);margin-bottom:20px}
.audience-lobby-intro h1{font-size:clamp(3rem,5vw,5.6rem)}
.audience-lobby-intro>p:last-child{font-size:1.05rem;color:#bfd0be;max-width:610px;margin-top:22px}
.audience-table-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px}
.audience-table-card{background:#f4f2e7;color:var(--ink);padding:28px;border:1px solid #d3d8c4;border-radius:22px;min-width:0;display:flex;flex-direction:column;align-items:stretch;max-width:680px}
.audience-table-card h2{font-size:2.25rem;margin-top:25px;overflow-wrap:anywhere}
.audience-table-card>p{font-size:.87rem;margin-top:10px}
.audience-table-status{font-size:.7rem;color:var(--muted);display:flex;align-items:center;gap:7px}
.audience-name-list{display:flex;gap:8px;flex-wrap:wrap;margin:21px 0 27px;flex:1;align-content:flex-start}
.audience-name-list span{background:#e6ebdc;border-radius:6px;padding:6px 9px;color:#54714f;font-size:.79rem;overflow-wrap:anywhere;max-width:100%}
.audience-table-card>.btn{align-self:flex-start;min-width:155px;min-height:49px;font-size:.91rem}
.audience-empty{grid-column:1/-1;border:1px dashed #d2dfbd54;padding:55px 30px;border-radius:22px;text-align:center;color:#e7e9d9}
.audience-empty>span{font-size:3.8rem;color:#aec3a7;display:block;margin-bottom:15px}
.audience-empty h2{font-size:2.4rem}
.audience-empty p{color:#bdd0b8;margin:17px auto 0;max-width:470px;font-size:.97rem}
.audience-mode .rules-panel{color:var(--ink)}
@media(min-width:1700px){
  .audience-game-layout{grid-template-columns:minmax(0,1fr) 380px;gap:32px}
  .audience-board .game-surface{min-height:620px;padding:38px}
  .audience-board .physical-piles{--pile-width:150px;--pile-height:212px;margin-top:40px;gap:140px}
  .audience-board .player-seat{max-width:210px;flex-basis:170px;min-height:100px;padding:17px}
  .audience-board .player-seat .name{font-size:1.1rem}
  .audience-board .physical-piles .card-pips{inset:39px 35px;font-size:1.85rem}
  .audience-board .physical-piles .court-medallion{inset:38px 34px;font-size:3.2rem}
  .audience-sidebar .score-table{font-size:1.12rem}
  .audience-sidebar .score-table td:last-child{font-size:1.75rem}
}
@media(max-width:1100px){
  .audience-game-layout{grid-template-columns:minmax(0,1fr) 265px;gap:20px}
  .audience-sidebar .panel{padding:20px}
  .audience-sidebar h2{font-size:1.6rem}
  .audience-sidebar .score-table{font-size:.86rem}
  .audience-board .game-surface{padding:24px;min-height:480px}
  .audience-board .physical-piles{--pile-width:105px;--pile-height:150px;gap:45px}
  .audience-board .physical-piles .card-pips{inset:28px 26px;font-size:1.2rem}
  .audience-board .physical-piles .card-pips.pips-8,.audience-board .physical-piles .card-pips.pips-9,.audience-board .physical-piles .card-pips.pips-10{inset:27px 24px;font-size:1.05rem}
  .audience-board .physical-piles .court-medallion{inset:28px 25px;font-size:2.2rem}
  .audience-board .player-seat{flex-basis:105px;padding:12px;min-height:85px}
  .audience-board .player-seat .name{font-size:.87rem}
  .audience-board .player-seat .seat-meta{font-size:.6rem}
  .audience-board .mini-card-count{font-size:.67rem}
  .audience-heading h1{font-size:2.9rem}
  .audience-heading p:last-child{font-size:.79rem}
  .audience-heading .eyebrow{font-size:.62rem}
  .audience-round-marker strong{font-size:1.5rem}
  .audience-waiting-intro h2{font-size:2.2rem}
  .audience-waiting-seats{grid-template-columns:1fr}
}
@media(max-width:800px){
  .audience-game-layout{grid-template-columns:1fr}
  .audience-sidebar{grid-template-columns:1fr 1fr}
  .audience-board .game-surface{min-height:430px}
  .audience-board .opponents{flex-wrap:wrap}
  .audience-board .player-seat{max-width:170px}
  .audience-round-marker{padding-left:18px;gap:8px}
  .audience-round-marker strong{font-size:1.4rem}
  .audience-heading{gap:20px}
  .audience-heading h1{font-size:2.5rem}
  .audience-mode .app-header{flex-wrap:wrap}
  .audience-mode .header-actions{margin-left:auto;gap:9px}
  .audience-mode .header-actions .connection{display:none}
}
@media(max-width:580px){
  .login-mode-option{padding:12px;min-height:65px;gap:7px}
  .login-mode-option strong{font-size:.79rem}
  .login-mode-option small{font-size:.59rem}
  .audience-mode .app-header{padding:16px 18px 11px;gap:10px}
  .audience-mode .brand-name{font-size:1.4rem}
  .audience-mode .header-actions{width:100%;justify-content:flex-end;gap:14px}
  .audience-mode .header-actions .text-button{font-size:.72rem;min-height:38px;padding:5px 2px}
  .audience-mode .audience-badge{margin-right:auto;font-size:.6rem}
  .audience-mode .header-rules{display:none}
  .audience-container{padding:25px 14px 32px}
  .audience-heading{gap:14px;margin-bottom:22px;align-items:flex-start}
  .audience-heading h1{font-size:2rem}
  .audience-heading .eyebrow{font-size:.52rem;letter-spacing:.11em;margin-bottom:10px}
  .audience-heading p:last-child{font-size:.65rem;margin-top:9px;line-height:1.5}
  .audience-round-marker{padding-left:12px;max-width:37%;gap:8px}
  .audience-round-marker>span{font-size:.57rem}
  .audience-round-marker strong{font-size:1.08rem;line-height:1.25}
  .audience-board .game-surface{padding:18px 15px;min-height:0;border-radius:20px}
  .audience-board .surface-top{margin-bottom:17px}
  .audience-board .surface-top .eyebrow{font-size:.57rem}
  .audience-board .turn-indicator{font-size:.68rem}
  .audience-board .opponents{flex-wrap:nowrap;margin-bottom:17px;gap:7px}
  .audience-board .player-seat{flex:0 0 104px;min-width:0;min-height:0;padding:11px;max-width:125px}
  .audience-board .player-seat .name{font-size:.75rem}
  .audience-board .player-seat .seat-meta{font-size:.52rem;gap:3px}
  .audience-board .mini-cards{display:none}
  .audience-board .physical-piles{--pile-width:86px;--pile-height:123px;gap:37px;margin:17px 0 7px}
  .audience-board .physical-piles .pile-label{font-size:.55rem}
  .audience-board .physical-piles .pile-group{gap:11px}
  .audience-board .physical-piles .pile-caption{font-size:.62rem;max-width:132px;gap:5px}
  .audience-board .physical-piles .pile-caption span{font-size:.55rem}
  .audience-board .physical-piles .card-corner{font-size:1.07rem;top:7px;left:8px;gap:3px}
  .audience-board .physical-piles .card-corner span+span{font-size:.83rem}
  .audience-board .physical-piles .card-corner.bottom{top:auto;left:auto;bottom:7px;right:8px}
  .audience-board .physical-piles .card-center{font-size:2.65rem}
  .audience-board .physical-piles .card-pips{inset:23px 21px;font-size:1rem}
  .audience-board .physical-piles .card-pips.pips-2,.audience-board .physical-piles .card-pips.pips-3{font-size:1.4rem}
  .audience-board .physical-piles .card-pips.pips-8,.audience-board .physical-piles .card-pips.pips-9,.audience-board .physical-piles .card-pips.pips-10{inset:23px 21px;font-size:.85rem}
  .audience-board .physical-piles .court-medallion{inset:23px 21px;font-size:1.7rem}
  .audience-board .physical-piles .court-medallion small{font-size:1rem}
  .audience-board .physical-piles .empty-draw-label{font-size:.55rem;width:43px;right:-3px}
  .audience-privacy-note{font-size:.66rem;margin-top:15px;gap:8px;align-items:flex-start}
  .audience-sidebar{grid-template-columns:1fr;gap:15px}
  .audience-sidebar .panel{padding:21px;border-radius:18px}
  .audience-sidebar .collapsible-content{display:block;padding:0}
  .audience-sidebar .collapsible-content>.spread{justify-content:space-between}
  .audience-sidebar .score-table{font-size:.9rem}
  .audience-sidebar .score-table td:last-child{font-size:1.45rem}
  .audience-sidebar .history-item p{font-size:.81rem}
  .audience-sidebar .history-item .history-person{font-size:.69rem}
  .audience-board .result-panel{padding:21px;border-radius:18px}
  .audience-board .result-panel h2{font-size:1.9rem}
  .audience-board .result-panel>p{font-size:.83rem}
  .audience-board .result-hands{grid-template-columns:1fr 1fr;gap:10px;margin:21px 0}
  .audience-board .result-hand{padding:11px}
  .audience-board .result-hand h3{font-size:.73rem}
  .audience-board .result-hand .hint{font-size:.62rem}
  .audience-waiting-intro{padding:17px 0 23px}
  .audience-waiting-symbol{font-size:3.1rem;margin-bottom:20px}
  .audience-waiting-intro h2{font-size:1.9rem}
  .audience-waiting-intro>p:last-child{font-size:.75rem}
  .audience-waiting-intro .eyebrow{font-size:.56rem}
  .audience-waiting-seats{padding:0;gap:10px}
  .audience-waiting-seat{padding:13px;gap:10px}
  .audience-waiting-seat h3{font-size:.82rem}
  .audience-waiting-seat p{font-size:.61rem}
  .audience-waiting-seat .badge{font-size:.57rem}
  .audience-waiting-seat .avatar{width:36px;height:36px;font-size:.8rem}
  .audience-lobby-intro{padding:9px 0 27px}
  .audience-lobby-intro h1{font-size:2.95rem}
  .audience-lobby-intro .eyebrow{font-size:.61rem;margin-bottom:17px}
  .audience-lobby-intro>p:last-child{font-size:.84rem;margin-top:17px}
  .audience-table-list{grid-template-columns:1fr;gap:17px}
  .audience-table-card{padding:23px;border-radius:19px}
  .audience-table-card h2{font-size:1.95rem;margin-top:22px}
  .audience-table-card>p{font-size:.73rem}
  .audience-name-list{margin:18px 0 22px}
  .audience-name-list span{font-size:.71rem}
  .audience-table-card>.btn{align-self:stretch;font-size:.84rem;min-height:46px}
  .audience-table-status{font-size:.62rem}
  .audience-empty{padding:35px 22px}
  .audience-empty h2{font-size:2.1rem}
  .audience-empty p{font-size:.85rem}
  .audience-review{flex-direction:column;align-items:flex-start;gap:7px;padding:16px}
  .audience-review strong{font-size:.8rem}
  .audience-review span{font-size:.74rem}
}
@media(max-width:370px){
  .audience-mode .header-actions{gap:11px}
  .audience-mode .audience-badge{display:none}
  .audience-board .physical-piles{--pile-width:76px;--pile-height:109px;gap:24px}
  .audience-board .physical-piles .pile-caption{max-width:114px;font-size:.56rem}
  .audience-board .physical-piles .pile-caption span{font-size:.5rem}
}

.table-motion-control{display:grid;gap:5px;color:var(--muted);font-size:.58rem;letter-spacing:.06em;text-transform:uppercase}
.table-motion-control select{color:var(--ink);background:var(--white);border:1px solid var(--line);padding:8px 28px 8px 10px;min-height:37px;font-size:.77rem;font-weight:600;max-width:112px}
.table-heading>.gap:has(.table-motion-control){flex-wrap:wrap;justify-content:flex-end}
.motion-layer{position:fixed;inset:0;z-index:24;pointer-events:none!important;overflow:hidden;perspective:1100px;contain:layout style;isolation:isolate}
.motion-layer:empty{display:none}
.motion-layer *{pointer-events:none!important}
.motion-card,.motion-shuffle-card{position:absolute;left:0;top:0;will-change:transform,opacity;transform-style:preserve-3d;perspective:850px;filter:drop-shadow(0 10px 9px #09251d3b)}
.motion-card-inner{width:100%;height:100%;position:relative;transform-style:preserve-3d;will-change:transform}
.motion-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;transform-style:preserve-3d}
.motion-back{transform:rotateY(180deg)}
.motion-layer .playing-card{width:100%;height:100%;border-radius:calc(var(--motion-width) * .105);box-shadow:0 1px 1px #fff inset,0 2px 2px #102e2229}
.motion-layer .playing-card.back{border-width:4px;box-shadow:0 2px 3px #09251d40}
.motion-layer .card-back-symbol{inset:8px;font-size:calc(var(--motion-width) * .45)}
.motion-layer .card-corner{left:calc(var(--motion-width) * .08);top:calc(var(--motion-width) * .075);font-size:calc(var(--motion-width) * .2);gap:calc(var(--motion-width) * .026)}
.motion-layer .card-corner span+span{font-size:calc(var(--motion-width) * .15)}
.motion-layer .card-corner.bottom{left:auto;top:auto;right:calc(var(--motion-width) * .08);bottom:calc(var(--motion-width) * .075)}
.motion-layer .card-center{font-size:calc(var(--motion-width) * .48)}
.motion-layer .card-pips{inset:23% 25%;font-size:calc(var(--motion-width) * .16)}
.motion-layer .card-pips.pips-2,.motion-layer .card-pips.pips-3{font-size:calc(var(--motion-width) * .23)}
.motion-layer .card-pips.pips-8,.motion-layer .card-pips.pips-9,.motion-layer .card-pips.pips-10{inset:23% 24%;font-size:calc(var(--motion-width) * .135)}
.motion-layer .court-medallion{inset:24% 24%;font-size:calc(var(--motion-width) * .34);outline-offset:2px}
.motion-layer .court-medallion small{font-size:calc(var(--motion-width) * .18)}
.motion-ring{position:absolute;width:58px;height:58px;border:2px solid #d5ad68bd;border-radius:50%;box-shadow:0 0 22px #d5ad6840;will-change:transform,opacity}
.motion-notice{position:absolute;border:1px solid #d6b77975;background:#183a2eed;box-shadow:0 5px 22px #09251d33;color:#f5edd5;white-space:nowrap;max-width:calc(100vw - 28px);overflow:hidden;text-overflow:ellipsis;padding:8px 13px;border-radius:30px;letter-spacing:.035em;font-size:.72rem;line-height:1.3;font-weight:650;will-change:transform,opacity}
.motion-show-card{filter:drop-shadow(0 6px 6px #15372935)}
@media(max-width:580px){
  .game-container .table-heading>.gap:has(.table-motion-control){max-width:115px;gap:6px}
  .table-motion-control{gap:2px;font-size:.47rem;letter-spacing:.03em;order:3;width:100%;text-align:right}
  .table-motion-control select{font-size:.67rem;padding:5px 24px 5px 8px;min-height:30px;width:100%;max-width:none}
  .table-motion-control>span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .motion-notice{font-size:.6rem;padding:6px 10px}
  .motion-layer .playing-card.back{border-width:3px}
  .motion-layer .card-back-symbol{inset:6px}
}
@media(prefers-reduced-motion:reduce){.motion-layer{display:none!important}}

/* Game library and direct, compact sign-in. */
.brand{border:0;background:transparent;padding:0;color:inherit;min-height:44px}
.library-home{max-width:1240px;padding-top:32px}
.library-home>h1{font-size:1.7rem;margin-bottom:24px}
.game-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;align-items:start}
.game-tile{display:block;width:100%;padding:0;text-align:left;color:var(--ink);background:var(--white);border:1px solid #d4dbcf;border-radius:22px;overflow:hidden;box-shadow:0 8px 24px #173f3508;transition:transform .18s,border-color .18s,box-shadow .18s;position:relative}
.game-tile:hover{transform:translateY(-3px);border-color:#9aaf9c;box-shadow:0 14px 34px #173f3514}
.game-tile:active{transform:translateY(0)}
.game-tile-art{display:block;height:242px;position:relative;overflow:hidden;background:radial-gradient(ellipse at 50% 35%,#2d6050,#173f35 85%)}
.game-tile-art:before{content:"";position:absolute;inset:14px;border:1px solid #d5ddbd24;border-radius:12px;pointer-events:none}
.game-tile-art .decorative-hand{left:50%;right:auto;top:50%;transform:translate(-50%,-46%);transform-origin:center;gap:0}
.game-tile-art .playing-card{margin-left:-43px;width:100px;height:145px}
.game-tile-art .playing-card:first-child{margin-left:0}
.game-tile-info{display:grid;gap:8px;padding:23px 24px 25px;position:relative}
.game-tile-name{display:block;font-family:Georgia,serif;font-size:2rem;font-weight:400;letter-spacing:-.04em;line-height:1.1;padding-right:28px}
.game-tile-meta{display:block;color:var(--muted);font-size:.82rem;font-weight:400;line-height:1.5}
.game-tile-arrow{position:absolute;right:24px;top:25px;font-size:1.3rem;font-weight:400;color:var(--green)}
.game-tile .badge{justify-self:start;margin-top:4px}
.game-nav{display:flex;align-items:center;gap:10px;margin-bottom:22px;min-height:40px;font-size:.86rem}
.game-nav .text-button{padding-left:0;padding-right:12px}
.game-nav a{text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
.game-nav a:hover{text-decoration:underline}
.compact-login{max-width:510px;margin:0 auto;padding-top:24px}
.compact-login .login-panel{padding:28px}
.compact-login h1,.compact-login h2{font-size:2rem;margin-bottom:24px}
.compact-login .login-panel>h1{font:650 .9rem/1.4 ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;letter-spacing:0;color:var(--muted);margin:0 0 10px}
.compact-login .login-panel>p{margin:0 0 20px}
.compact-login .form-error{margin-bottom:20px}
.compact-login .form-footer{margin-top:6px}
.compact-login .form-footer .btn{min-height:48px}
.lobby-layout .panel-heading{padding-bottom:18px;margin-bottom:20px}
.audience-mode .game-nav{color:#dbe5ce}
@media(max-width:950px){
  .game-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:580px){
  .library-home{padding:24px 18px 36px}
  .library-home>h1{font-size:1.5rem;margin-bottom:20px}
  .game-grid{grid-template-columns:1fr;gap:18px}
  .game-tile{max-width:440px;border-radius:20px}
  .game-tile-art{height:220px}
  .game-tile-info{padding:20px 22px 23px}
  .game-tile-name{font-size:1.9rem}
  .game-tile-arrow{right:22px;top:22px}
  .game-nav{margin-bottom:14px;gap:8px}
  .compact-login{padding:16px 18px 32px;max-width:470px}
  .compact-login .login-panel{padding:23px 20px;border-radius:18px}
  .compact-login h1,.compact-login h2{font-size:1.8rem;margin-bottom:22px}
  .compact-login .form-grid{gap:15px}
  .compact-login .login-mode-picker{margin-bottom:0}
  .compact-login .login-mode-option{padding:11px 10px}
}

/* The table keeps its cards and current action in view. Supporting tools live in dialogs. */
.icon-toolbar{display:flex;gap:6px;align-items:center;flex-wrap:nowrap}
.icon-button{width:42px;height:42px;min-width:42px;display:grid;place-items:center;border:1px solid #bdc8b8;background:#fffdf8;border-radius:13px;color:var(--green);font-family:Arial,sans-serif;font-size:1.45rem;line-height:1;cursor:pointer;padding:0}
.icon-button:hover{background:#eaf0e1;border-color:#749178}
.icon-button:focus-visible{outline:3px solid #c68b35;outline-offset:3px}
.in-game .app-header{padding-top:13px;padding-bottom:13px}
.game-container{max-width:1020px}
.game-container .table-layout{display:block}
.game-container .table-heading,.audience-container .table-heading{display:flex;align-items:center;gap:15px;margin:0 0 17px;padding:0 4px}
.game-container .table-heading h1,.audience-container .table-heading h1{font-family:inherit;font-size:1.25rem;font-weight:650;line-height:1.35;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.round-chip{font-size:.8rem;font-weight:600;white-space:nowrap;opacity:.76}
.game-container .game-surface{padding:22px 30px 24px;min-height:0;border-radius:24px 24px 0 0}
.surface-top{justify-content:center;margin-bottom:16px}
.turn-indicator{font-size:1rem;letter-spacing:.01em;padding:8px 18px;background:#102d253d;border-radius:20px;color:#ecf0da}
.your-turn .turn-indicator{color:#193b2d;background:#e5d9a6;font-weight:750;box-shadow:0 3px 12px #102b2433}
.your-turn{box-shadow:inset 0 0 0 2px #d3bf8066,inset 0 0 70px #0a2b2233}
.opponents{margin:0 0 22px;gap:8px;justify-content:center}
.player-seat{max-width:150px;min-width:85px;padding:10px 12px;border-radius:12px}
.player-seat .name{font-size:.8rem}
.player-seat .seat-meta{font-size:.6rem;line-height:1.5}
.player-seat.active{border-color:#e8d390;background:#b6b47e26;box-shadow:0 0 0 1px #e5d39b35}
.physical-piles{--pile-width:128px;--pile-height:173px;gap:80px;margin:18px 0 0}
.physical-piles .pile-label{font-size:.76rem;letter-spacing:.04em;text-transform:none}
.physical-piles .pile-group{gap:12px}
.physical-piles .pile-caption{font-size:.77rem;min-height:19px;max-width:none}
.deck-count{display:inline-block;min-width:23px;text-align:center;margin-left:4px;background:#ffffff13;border:1px solid #ffffff17;border-radius:6px;padding:2px 5px;font-size:.67rem}
.playing-card.simple-card{container-type:inline-size;background-color:#fffcf3;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;font-family:Georgia,serif;color:#193b32;overflow:hidden}
.playing-card.simple-card.red{color:#b53f3a}
.simple-card .card-value{font-size:clamp(24px,34cqw,56px);line-height:1;font-weight:600;letter-spacing:-.065em;margin:9% 0 0 10%;font-variant-numeric:lining-nums}
.simple-card .card-suit{font-size:clamp(24px,35cqw,58px);line-height:1;margin:7% 0 0 10%}
.stack-fan{position:relative;width:var(--pile-width);height:calc(var(--pile-height) + 12px);transform:none;padding:0}
.stack-layer{position:absolute;inset:4px 0 auto;transform:translateX(calc(var(--stack-depth) * -7px)) translateY(calc(var(--stack-depth) * -2px)) rotate(calc(var(--stack-depth) * -5deg + 4deg));transform-origin:50% 82%;z-index:var(--stack-order)}
.stack-layer .playing-card{box-shadow:0 1px 1px #ffffff inset,0 2px 3px #1022184d,0 9px 15px #071d2426}
.hand-area{padding:18px 24px 20px;background:#f3f1e6;border-radius:0 0 24px 24px}
.hand-title h2{font-family:inherit;font-size:.9rem;font-weight:650}
.hand-selection-hint{font-size:.76rem;color:var(--muted)}
.hand-cards{--hand-card-width:162px;--hand-card-height:219px}
.hand-fan{padding:36px 30px 22px}
.hand-fan .card-button+.card-button{margin-left:calc(var(--hand-card-width) * -.53)}
.hand-fan .card-button{touch-action:pan-x;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.hand-fan .card-button .playing-card{border-radius:14px}
.hand-fan .card-button.selected .playing-card{outline:3px solid #ad802d;outline-offset:1px;box-shadow:0 12px 22px #163b2f2e}
.hand-fan .joker-tag{left:10%;bottom:14%;background:#d9e6c5;color:#264535;font-size:.68rem;padding:4px 6px;text-transform:none;letter-spacing:0}
.hand-fan .selection-check{top:-10px;left:10px;background:#b68a3e;color:#fffef7;box-shadow:0 2px 6px #6853202b}
.move-controls{display:block;border-top:0;padding-top:0}
.move-prompt{font-size:.84rem;font-weight:500;line-height:1.4;text-align:center;margin:0 0 12px;color:var(--muted)}
.primary-moves,.draw-choices{display:grid;grid-template-columns:minmax(86px,.6fr) minmax(0,1.4fr);gap:12px;max-width:540px;margin:auto}
.primary-moves .btn{min-height:57px;font-size:1rem;border-radius:14px;padding:13px 18px}
.throw-button{display:flex;justify-content:center;align-items:center;gap:20px}
.throw-button>span{font-size:1.45rem;line-height:1}
.draw-choices{grid-template-columns:1fr 1fr}
.draw-choice{display:flex;align-items:center;justify-content:center;gap:13px;min-height:78px;padding:12px;border-radius:15px;font-size:.93rem;line-height:1.35}
.draw-choice .choice-symbol{font-size:2.2rem;line-height:1}
.draw-choice small{display:block;font-size:.68rem;opacity:.8}
.stack-choice{background:#fffdf5;color:var(--green);border:1px solid #87987b}
.choice-card{display:grid;place-items:center;min-width:39px;height:49px;background:#fffdf5;border:1px solid #e2ddc8;border-radius:5px;color:#183c31;font-family:Georgia,serif;font-size:1.25rem;box-shadow:0 2px 2px #19372a1a}
.choice-card.red{color:#b53f3a}
.waiting-layout{grid-template-columns:1fr;max-width:820px;margin:0 auto}
.utility-dialog{border:1px solid #e0ddcd;border-radius:24px;padding:0;width:min(680px,calc(100vw - 30px));max-height:calc(100dvh - 40px);background:var(--paper);color:var(--ink);box-shadow:0 30px 100px #081d2459;overflow:hidden}
.utility-dialog::backdrop{background:#061c21bf;backdrop-filter:blur(5px)}
.utility-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 25px 17px;border-bottom:1px solid var(--line)}
.utility-heading h2{font-size:1.8rem}
.utility-heading .icon-button{background:transparent;border-color:transparent;font-size:1.8rem}
.utility-content{max-height:calc(100dvh - 145px);overflow:auto;overscroll-behavior:contain;padding:23px 25px 28px}
.utility-content .panel,.utility-content .rules-panel{border:0;padding:0;background:transparent;border-radius:0;box-shadow:none;margin:0}
.utility-content .collapsible-content{display:block;padding:0}
.utility-content .collapsible-content>h2{display:none}
.utility-content .rules-columns{grid-template-columns:1fr 1fr;gap:24px}
.utility-content .rules-columns p{font-size:.88rem;line-height:1.7}
.utility-content .rules-columns h3{font-family:inherit;font-size:.95rem;margin-bottom:7px}
.utility-content .rules-panel>.hint{margin-top:22px}
.utility-content .history-list{max-height:none;margin-top:0}
.utility-content .history-item p{font-size:.89rem;line-height:1.55}
.utility-content .history-item .history-person{font-size:.73rem}
.utility-content .history-actions .text-button{font-size:.82rem;min-height:44px;padding:8px 17px 8px 0}
.utility-content .score-table{font-size:.95rem;margin:15px 0 20px;width:100%}
.score-table th{text-align:left;font-weight:500;border-bottom:1px solid var(--line);padding:12px 0}
.utility-content .score-table td:last-child{font-size:1.4rem;font-weight:650;text-align:right}
.round-history-title{font-size:1.1rem;margin:27px 0 13px}
.round-score-scroll{overflow-x:auto;max-width:100%;border:1px solid var(--line);border-radius:12px;background:#fffdf6}
.round-score-table{width:100%;border-collapse:collapse;font-size:.85rem;white-space:nowrap}
.round-score-table th,.round-score-table td{padding:13px 15px;border-bottom:1px solid var(--line);text-align:right}
.round-score-table th:first-child{text-align:left;position:sticky;left:0;background:#f4f1e4;z-index:1}
.round-score-table thead{background:#e9eedf}
.round-score-table small{display:block;margin-top:5px;font-size:.68rem;font-weight:400;color:var(--muted);line-height:1.45}
.sound-settings{display:grid;gap:9px;margin-bottom:22px}
.setting-switch{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:59px;padding:12px 15px;border:1px solid var(--line);border-radius:13px;background:#fffdf6;color:var(--ink);text-align:left;font-size:.86rem}
.setting-switch>span{display:flex;align-items:center;gap:12px}
.setting-switch>span>span{font-size:1.35rem;width:25px;text-align:center}
.setting-switch strong{font-size:.73rem;font-weight:650;min-width:41px;text-align:center;border-radius:20px;padding:5px;background:#e9eadd;color:#697461}
.setting-switch[aria-checked=true] strong{background:#d3e2bc;color:#2b4e30}
.settings-content .table-motion-control{font-size:.75rem;text-transform:none;letter-spacing:0;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 0}
.settings-content .table-motion-control select{width:130px;min-height:44px;font-size:.88rem;max-width:none}
.settings-actions{display:grid;gap:11px;margin-top:24px}
.settings-actions .btn{min-height:48px}
.utility-content .admin-grid{grid-template-columns:1fr;gap:30px}
.utility-content .admin-panel>.panel-heading{display:none}
.utility-content .user-row .btn{min-height:42px}
.audience-container{max-width:1800px}
body.audience-mode{min-height:100dvh}
.audience-container .table-heading h1{font-size:2rem;color:#eeeadd}
.audience-container .round-chip{font-size:1.1rem;color:#dddcc8}
.audience-mode .icon-button{color:#e7e5ce;background:#183b30;border-color:#51664f}
.audience-board .game-surface{border-radius:25px;min-height:600px;padding:30px 40px}
.audience-board .physical-piles{--pile-width:174px;--pile-height:234px;gap:130px}
.audience-board .physical-piles .pile-caption{font-size:1.02rem}
.audience-board .simple-card .card-value{font-size:35cqw}
.audience-board .simple-card .card-suit{font-size:36cqw}
.audience-board .turn-indicator{font-size:1.35rem;padding:12px 25px}
.feedback-layer{position:fixed;inset:0;pointer-events:none;z-index:24;overflow:hidden}
.event-banner{position:absolute;top:22%;left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100vw - 30px);padding:17px 27px;border-radius:18px;font-size:clamp(1.1rem,3vw,1.8rem);font-weight:750;text-align:center;background:#f5ebc9;color:#173d2b;border:1px solid #cdbc82;box-shadow:0 12px 45px #09271c4d;animation:event-in .35s both}
.event-banner.turn{top:112px;font-size:1.05rem;border-radius:24px;padding:12px 25px;background:#e9d594;animation:turn-notice 1.9s both}
.event-banner.lose{background:#f4c7ae;color:#773d32;animation:funny-wobble .8s both}
.confetti-piece{position:absolute;left:var(--x);top:-20px;width:10px;height:17px;border-radius:2px;background:var(--color);animation:confetti-fall 3.7s var(--delay) cubic-bezier(.18,.65,.54,1) both}
.turn-arrival .your-turn{animation:turn-glow 1s 2}
.turn-arrival .my-move .move-prompt{color:#765117;font-weight:750}
.motion-notice{font-size:.9rem;padding:10px 17px;max-width:calc(100vw - 25px);text-align:center;white-space:normal}
@keyframes event-in{from{opacity:0;scale:.75;translate:0 25px}to{opacity:1;scale:1;translate:0 0}}
@keyframes turn-notice{0%{opacity:0;translate:0 -12px}15%,80%{opacity:1;translate:0 0}100%{opacity:0;translate:0 -8px}}
@keyframes funny-wobble{0%{opacity:0;rotate:-8deg;scale:.8}30%{opacity:1;rotate:6deg;scale:1.08}50%{rotate:-4deg}70%{rotate:2deg}100%{rotate:0;scale:1}}
@keyframes confetti-fall{0%{transform:translate(0,-20px) rotate(0);opacity:0}7%,80%{opacity:1}100%{transform:translate(var(--drift),105vh) rotate(var(--spin));opacity:0}}
@keyframes turn-glow{0%,100%{box-shadow:inset 0 0 0 2px #d3bf8066}50%{box-shadow:inset 0 0 0 3px #f4d575,0 0 24px #dbc77c52}}
@media(max-width:700px){
  .utility-content .rules-columns{grid-template-columns:1fr;gap:23px}
  .utility-content .rules-columns p{font-size:.85rem}
  .audience-board .game-surface{min-height:0;padding:22px}
  .audience-board .physical-piles{--pile-width:115px;--pile-height:155px;gap:63px}
  .audience-board .turn-indicator{font-size:.95rem}
}
@media(max-width:580px){
  .in-game .app-header,.audience-mode .app-header{padding:9px 12px;gap:8px;flex-wrap:nowrap;min-height:59px}
  .in-game .app-header .brand-mark,.audience-mode .brand-mark{display:none}
  .in-game .app-header .brand-name,.audience-mode .brand-name{font-size:1.16rem}
  .icon-toolbar,.audience-mode .header-actions{width:auto;gap:5px;margin-left:auto}
  .icon-button{width:38px;height:40px;min-width:38px;border-radius:11px;font-size:1.3rem}
  .game-container.main-container,.in-game .main-container.game-container{padding:11px 10px 22px}
  .active-round .main-container.game-container{padding-bottom:140px}
  .game-container .table-heading,.audience-container .table-heading{margin-bottom:10px;gap:10px;padding:0 4px}
  .game-container .table-heading h1,.audience-container .table-heading h1{font-size:1rem;margin:0}
  .round-chip,.audience-container .round-chip{font-size:.71rem}
  .game-container .game-surface{padding:13px 13px 15px;border-radius:20px 20px 0 0}
  .surface-top{margin-bottom:12px}
  .turn-indicator{font-size:.83rem;padding:7px 15px}
  .opponents{margin-bottom:15px;justify-content:flex-start;gap:6px;padding-bottom:4px}
  .player-seat{flex:0 0 97px;padding:8px 10px;max-width:115px}
  .player-seat .name{font-size:.74rem}
  .player-seat .seat-meta{font-size:.55rem;white-space:nowrap}
  .physical-piles{--pile-width:104px;--pile-height:141px;gap:42px;margin:12px 0 0}
  .physical-piles .pile-group{gap:8px}
  .physical-piles .pile-label{font-size:.69rem;letter-spacing:0}
  .physical-piles .pile-caption{font-size:.65rem;min-height:16px;max-width:none}
  .physical-piles .pile-caption span{font-size:.61rem}
  .deck-count{min-width:20px;font-size:.59rem;padding:1px 4px}
  .stack-layer{transform:translateX(calc(var(--stack-depth) * -5px)) translateY(calc(var(--stack-depth) * -2px)) rotate(calc(var(--stack-depth) * -4deg + 4deg))}
  .hand-area{padding:13px 13px 6px;border-radius:0 0 20px 20px}
  .hand-title h2{font-size:.83rem}
  .hand-selection-hint{font-size:.68rem}
  .hand-cards{--hand-card-width:137px;--hand-card-height:185px}
  .hand-fan{padding:30px 19px 18px}
  .hand-fan[data-card-count="0"]{min-height:210px;padding:30px 0}
  .hand-fan .card-button .playing-card{border-radius:13px}
  .hand-fan .joker-tag{font-size:.58rem;padding:3px 5px;bottom:13%}
  .hand-fan .card-button.selected,.hand-fan .card-button.selected:hover:not(:disabled){transform:translateY(calc(var(--fan-offset) - 23px)) rotate(var(--fan-angle))}
  .hand-fan .selection-check{left:10px;width:24px;height:24px;font-size:.72rem;top:-8px}
  .move-controls{padding:10px 14px max(12px,env(safe-area-inset-bottom));background:#fffdf8f5;border-top:1px solid #d8dbc9;border-radius:18px 18px 0 0;box-shadow:0 -8px 30px #163c2b15;backdrop-filter:blur(12px)}
  .move-prompt{font-size:.76rem;line-height:1.3;margin:0 0 8px;min-height:17px}
  .primary-moves,.draw-choices{gap:10px}
  .primary-moves .btn{min-height:53px;font-size:.95rem;padding:12px 15px;border-radius:13px}
  .draw-choice{min-height:68px;font-size:.81rem;gap:8px;padding:10px 9px;border-radius:13px}
  .choice-card{min-width:31px;height:42px;font-size:1.1rem}
  .draw-choice .choice-symbol{font-size:1.9rem}
  .utility-dialog{width:calc(100vw - 20px);max-height:calc(100dvh - 28px);border-radius:22px}
  .utility-heading{padding:16px 19px 12px}
  .utility-heading h2{font-size:1.55rem}
  .utility-content{padding:20px;max-height:calc(100dvh - 105px)}
  .utility-content .score-table{font-size:.86rem}
  .utility-content .history-item p{font-size:.83rem}
  .utility-content .history-item .history-person{font-size:.69rem}
  .setting-switch{font-size:.8rem;min-height:58px;padding:12px}
  .settings-content .table-motion-control{width:auto;font-size:.78rem;text-align:left;order:0}
  .settings-content .table-motion-control>span{position:static;width:auto;height:auto;clip-path:none}
  .settings-content .table-motion-control select{font-size:.86rem;width:112px}
  .active-round .toast{bottom:130px}
  .event-banner.turn{top:105px}
  .audience-container{padding:17px 11px 25px}
  .audience-board .game-surface{padding:17px 13px;border-radius:20px}
  .audience-board .physical-piles{--pile-width:106px;--pile-height:144px;gap:40px}
  .audience-board .physical-piles .pile-caption{font-size:.65rem}
  .audience-board .physical-piles .pile-label{font-size:.68rem}
  .audience-board .player-seat{flex-basis:99px;padding:9px;min-height:0}
  .audience-board .player-seat .name{font-size:.76rem}
  .audience-board .player-seat .seat-meta{font-size:.55rem}
  .audience-board .opponents{margin-bottom:17px}
  .audience-board .turn-indicator{font-size:.83rem;padding:8px 14px}
  .result-hand .small-card{width:49px;height:69px}
}
@media(max-width:370px){
  .icon-toolbar{gap:4px}
  .icon-button{width:35px;min-width:35px;height:38px}
  .in-game .app-header .brand-name{font-size:1.06rem}
  .physical-piles,.audience-board .physical-piles{--pile-width:93px;--pile-height:126px;gap:33px}
  .physical-piles .pile-caption{font-size:.61rem}
  .hand-cards{--hand-card-width:124px;--hand-card-height:168px}
  .hand-fan{padding-left:18px;padding-right:18px}
  .draw-choice{font-size:.73rem;gap:6px;padding:10px 7px}
  .choice-card{min-width:28px;height:39px;font-size:1rem}
}
@media(prefers-reduced-motion:reduce){.feedback-layer{display:none}}

.animations-off .card-button,.animations-off .action-dialog,.animations-off .utility-dialog{animation:none!important;transition:none!important}
.hand-fan .simple-card .card-value{font-size:32cqw}

/* The previous three cards expose real rank and suit corners beside the top card. */
.physical-piles{--stack-step:29px;--stack-spread:87px;gap:38px}
.draw-joker-stack{margin:0}
.playing-stack-group{width:calc(var(--pile-width) + var(--stack-spread))}
.playing-stack-group .pile-label{align-self:center}
.stack-fan{margin-left:var(--stack-spread)}
.stack-layer{transform:translateX(calc(var(--stack-depth) * var(--stack-step) * -1)) translateY(calc(var(--stack-depth) * -3px)) rotate(calc(var(--stack-depth) * -1deg + 3deg))}
.stack-layer:not(:last-child) .card-value{font-size:25px;line-height:1;margin:9px 0 0 3px;letter-spacing:-.07em}
.stack-layer:not(:last-child) .card-suit{font-size:26px;line-height:1;margin:8px 0 0 3px}
.stack-caption{align-items:center;justify-items:center;color:#f3ecd4}
.stack-caption:empty{display:none}
.audience-board .physical-piles{--stack-step:37px;--stack-spread:111px;gap:100px}
.audience-board .stack-layer:not(:last-child) .card-value{font-size:33px;margin-left:4px}
.audience-board .stack-layer:not(:last-child) .card-suit{font-size:34px;margin-left:4px}
@media(max-width:580px){
  .physical-piles,.audience-board .physical-piles{--stack-step:24px;--stack-spread:72px;gap:10px;justify-content:center}
  .draw-joker-stack{width:calc(var(--pile-width) * 1.48)}
  .stack-layer:not(:last-child) .card-value,.audience-board .stack-layer:not(:last-child) .card-value{font-size:22px;margin:8px 0 0 2px;letter-spacing:-.08em}
  .stack-layer:not(:last-child) .card-suit,.audience-board .stack-layer:not(:last-child) .card-suit{font-size:23px;margin:6px 0 0 2px}
}
@media(max-width:370px){
  .physical-piles,.audience-board .physical-piles{--pile-width:85px;--pile-height:116px;--stack-step:20px;--stack-spread:60px;gap:0}
  .draw-joker-stack{width:calc(var(--pile-width) * 1.5)}
  .draw-layer{left:calc(var(--pile-width) * .5)}
  .stack-layer:not(:last-child) .card-value,.audience-board .stack-layer:not(:last-child) .card-value{font-size:18px;margin-left:1px;letter-spacing:-.08em}
  .stack-layer:not(:last-child) .card-suit,.audience-board .stack-layer:not(:last-child) .card-suit{font-size:20px;margin-left:1px}
}

.btn.stack-choice,.btn.stack-choice:hover:not(:disabled),.btn.stack-choice:active{background:#fffdf5;color:#173d2e;border-color:#87987b}
.btn.stack-choice:hover:not(:disabled){background:#edf1df}

/* Thurupu uses the same cards and controls, with a separate team and trick table. */
.thurupu-tile .game-tile-art{background:radial-gradient(ellipse at 25% 20%,#75604455,transparent 65%),linear-gradient(145deg,#503c32,#2e4131)}
.seat-notice{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 22px;background:#e9ecde;border:1px solid #cdd4bd;border-radius:15px;margin-bottom:22px;font-size:.9rem}
.thurupu-options{padding:15px;border:1px solid var(--line);border-radius:12px}
.thurupu-options summary{font-size:.82rem;font-weight:600;cursor:pointer;min-height:27px}
.option-list{display:grid;gap:15px;margin:17px 0 3px}
.option-row{display:flex;align-items:flex-start;gap:12px;font-size:.81rem;cursor:pointer}
.option-row input{width:20px;height:20px;flex-shrink:0;margin:1px 0 0;accent-color:var(--green)}
.option-row strong{display:block;font-weight:650}
.option-row small{display:block;margin-top:4px;font-size:.7rem;color:var(--muted);line-height:1.5}
.team-seats{display:grid;grid-template-columns:1fr 1fr;gap:17px;margin:25px 0 17px}
.waiting-team{padding:18px;border:1px solid #cbd4ba;border-radius:16px;background:#f3f5e9}
.waiting-team.team-b{background:#f4eee3;border-color:#dbcdb6}
.waiting-team>h3{font-size:.84rem;margin-bottom:15px;font-weight:750}
.team-seat{display:flex;align-items:center;gap:10px;min-height:72px;min-width:0;border-top:1px solid #a3b59a40;padding:12px 0}
.team-seat>div{min-width:0;flex:1}
.team-seat strong{font-size:.85rem;overflow-wrap:anywhere;display:block}
.team-seat small{display:block;font-size:.69rem;color:var(--muted);margin-top:4px}
.team-seat .avatar{width:37px;height:37px;flex-shrink:0;font-size:.85rem}
.ready-dot{display:block;width:9px;height:9px;border-radius:50%;background:#c6cab9;flex-shrink:0}
.ready-dot.ready{background:#52884e;box-shadow:0 0 0 4px #75a36120}
.empty-seat-symbol{font-size:1.6rem;width:37px;text-align:center;color:#8a927d}
.team-seat>.empty-seat-symbol+span{font-size:.8rem;color:var(--muted)}
.thurupu-surface .thurupu-seats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;overflow:visible;padding:0}
.thurupu-seats .player-seat{min-width:0;max-width:none;width:auto;flex:none;padding:10px}
.thurupu-seats .player-seat.team-a{border-bottom:3px solid #a4c5a0}
.thurupu-seats .player-seat.team-b{border-bottom:3px solid #d9b88b}
.thurupu-seats .mobile-hand-count{display:inline}
.thurupu-score-strip{display:flex;align-items:center;justify-content:space-between;gap:16px;color:#e9ecd7;font-size:.83rem;margin:0 0 22px}
.thurupu-score-strip>span:nth-child(2){font-size:.77rem;text-align:center;line-height:1.5}
.thurupu-score-strip>span:first-child,.thurupu-score-strip>span:last-child{display:flex;align-items:center;gap:11px;padding:7px 12px;background:#0d2e2342;border:1px solid #b8ca9a26;border-radius:10px}
.thurupu-score-strip strong{font-size:1.2rem}
.thurupu-score-strip .team-a{color:#d6efc4}
.thurupu-score-strip .team-b{color:#f0d2ac}
.thurupu-center{display:grid;grid-template-columns:100px minmax(0,1fr);gap:30px;align-items:center;min-height:225px;max-width:680px;margin:auto}
.trump-zone{display:flex;flex-direction:column;align-items:center;gap:10px;min-width:0}
.trump-label{font-size:.68rem;color:#d5dcc5;white-space:nowrap}
.trump-card-slot{display:grid;place-items:center;min-height:112px}
.trump-card-slot .playing-card{width:78px;height:108px;border-radius:8px}
.trump-placeholder{display:grid;place-items:center;width:78px;height:108px;border-radius:10px;border:1px dashed #c9d3b755;font-family:Georgia,serif;font-size:2rem;color:#adbd9a55}
.trump-zone small{font-size:.58rem;line-height:1.4;text-align:center;color:#e2d39f;max-width:85px}
.trump-suit{font-size:1.45rem;color:#eef0dc;line-height:1}
.trump-suit.red{color:#f1a392}
.thurupu-public-play{min-width:0}
.trick-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;align-items:center;min-height:171px}
.trick-position{min-width:0;display:flex;flex-direction:column;align-items:center;gap:9px}
.trick-position>span{font-size:.64rem;max-width:100%;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#ccd7c3}
.trick-face{position:relative;transform:rotate(-3deg)}
.trick-position:nth-child(even) .trick-face{transform:rotate(4deg)}
.trick-face .playing-card{width:94px;height:132px}
.trick-empty{width:90px;height:128px;border:1px dashed #b8c9a333;border-radius:11px;background:#052a2214}
.trick-face.is-trump .playing-card{outline:2px solid #d0aa5d;outline-offset:2px}
.trump-play-tag{position:absolute;bottom:8px;right:7px;background:#e6ca84;color:#3b3e24;font-size:.53rem;border-radius:4px;padding:3px 5px;font-weight:650}
.trick-totals{display:flex;justify-content:center;gap:20px;font-size:.68rem;color:#bbcdb6;margin-top:20px;line-height:1.5}
.auction-board{display:flex;align-items:center;flex-direction:column;justify-content:center;min-height:210px;text-align:center}
.phase-label{font-size:.7rem;color:#c7d6bb;text-transform:uppercase;letter-spacing:.1em;margin-bottom:14px}
.contract-display{display:grid;gap:7px;justify-items:center}
.contract-display>strong{font-family:Georgia,serif;font-size:3.6rem;color:#f4e7b9;line-height:1}
.contract-display>span{font-size:.77rem;color:#d3dec8}
.auction-track{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin-top:22px}
.auction-track>span{display:grid;gap:5px;background:#ffffff08;border:1px solid #d3dbbc26;border-radius:9px;padding:8px 11px;font-size:.83rem;min-width:57px;color:#ecebd1}
.auction-track strong{font-size:.57rem;font-weight:500;max-width:70px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#bfd1b7}
.redeal-note{margin-top:13px;text-align:center;font-size:.68rem;color:#dfd19f}
.thurupu-hand .hand-cards{--hand-card-width:138px;--hand-card-height:187px}
.thurupu-hand .hand-fan{padding-top:29px;padding-bottom:18px}
.thurupu-hand .card-button+.card-button{margin-left:calc(var(--hand-card-width) * -.53)}
.thurupu-hand .unavailable-card .playing-card{filter:saturate(.45);background:#e4e4d8;box-shadow:0 1px 1px #ffffff80,0 3px 7px #193b2614}
.thurupu-hand .unavailable-card .card-value,.thurupu-hand .unavailable-card .card-suit{opacity:.55}
.thurupu-controls>.btn{display:flex;min-width:200px;min-height:53px;margin:auto}
.thurupu-controls>.btn.secondary{margin-top:8px;min-height:38px;font-size:.77rem}
.bid-controls{display:flex;justify-content:center;gap:9px;max-width:510px;margin:auto}
.bid-controls select{min-width:82px;min-height:52px;background:#fffef8;border:1px solid #adbea4;padding:10px 13px;color:var(--green);font-size:1.15rem;font-weight:650;flex:0 0 82px}
.bid-controls .btn{flex:1;min-height:52px;max-width:210px;font-size:.88rem}
.thurupu-play-actions{display:flex;justify-content:center;gap:9px;max-width:570px;margin:auto}
.thurupu-play-actions .btn{flex:1;min-height:54px;font-size:.86rem;max-width:270px}
.waiting-turn-line{height:35px;display:grid;place-items:center}
.waiting-turn-line span{display:block;width:60px;height:3px;border-radius:2px;background:#c8d1bc}
.result-team-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:23px 0}
.result-team{display:flex;align-items:center;flex-direction:column;padding:20px 16px;border:1px solid var(--line);border-radius:16px;background:#f1f3e8;text-align:center}
.result-team.winning-team{border-color:#baa364;background:#efebd7}
.result-team h3{font-size:.85rem;font-weight:750}
.result-team p{font-size:.73rem;color:var(--muted);margin:8px 0 0;line-height:1.5}
.result-team>strong{font-family:Georgia,serif;font-size:3.4rem;line-height:1.15;margin:14px 0 8px}
.result-team>span{font-size:.82rem;font-weight:600}
.result-team small{font-size:.7rem;color:var(--muted);margin-top:9px;line-height:1.5}
.last-trick{margin-bottom:25px;padding-bottom:20px;border-bottom:1px solid var(--line)}
.last-trick .trick-cards{margin:18px 0;gap:7px}
.last-trick .trick-position>span{color:var(--muted)}
.last-trick .trick-face .playing-card{width:78px;height:108px}
.last-trick .trick-empty{height:106px;width:74px}
.thurupu-history>h3{margin-bottom:14px}
.audience-board .thurupu-center{grid-template-columns:170px minmax(0,1fr);max-width:1160px;gap:60px;min-height:330px}
.audience-board .trump-card-slot .playing-card,.audience-board .trump-placeholder{width:125px;height:172px}
.audience-board .trump-label{font-size:.98rem}
.audience-board .trump-zone small{font-size:.8rem;max-width:135px}
.audience-board .trick-face .playing-card{width:145px;height:199px}
.audience-board .trick-empty{width:140px;height:195px}
.audience-board .trick-position>span{font-size:.97rem}
.audience-board .trump-play-tag{font-size:.76rem;bottom:13px;right:11px;padding:5px 7px}
.audience-board .thurupu-score-strip{font-size:1.25rem;margin-top:25px}
.audience-board .thurupu-score-strip strong{font-size:1.65rem}
.audience-board .thurupu-score-strip>span:nth-child(2){font-size:1.1rem}
.audience-board .trick-totals{font-size:1rem;margin-top:30px}
.audience-board .contract-display>strong{font-size:6rem}
.audience-board .contract-display>span{font-size:1.2rem}
.audience-board .phase-label{font-size:1rem}
.audience-board .auction-track>span{font-size:1.2rem;min-width:95px;padding:12px 18px}
.audience-board .auction-track strong{font-size:.8rem;max-width:120px}
@media(max-width:1100px){
 .audience-board .thurupu-center{grid-template-columns:120px minmax(0,1fr);gap:25px}
 .audience-board .trick-face .playing-card{width:106px;height:145px}
 .audience-board .trick-empty{width:102px;height:141px}
 .audience-board .trump-card-slot .playing-card,.audience-board .trump-placeholder{width:88px;height:120px}
}
@media(max-width:700px){
 .team-seats{gap:12px}.waiting-team{padding:14px}.team-seat .avatar{display:none}
 .thurupu-center{grid-template-columns:76px minmax(0,1fr);gap:14px}
 .trick-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;max-width:270px;margin:auto}
 .trick-face .playing-card{width:86px;height:115px}.trick-empty{width:82px;height:111px}
 .trick-position>span{font-size:.6rem}.trick-position{gap:4px}
 .last-trick .trick-cards{grid-template-columns:repeat(4,minmax(0,1fr));max-width:none}
 .last-trick .trick-face .playing-card{width:59px;height:81px}
 .last-trick .trick-empty{width:56px;height:78px}
 .audience-board .thurupu-center{grid-template-columns:80px minmax(0,1fr);gap:14px;min-height:270px}
 .audience-board .trick-cards{max-width:360px;gap:15px}
 .audience-board .trick-position>span{font-size:.73rem}
 .audience-board .trump-label{font-size:.74rem}
 .audience-board .thurupu-score-strip>span:nth-child(2){font-size:.76rem}
 .audience-board .thurupu-score-strip{font-size:.95rem}
 .audience-board .thurupu-score-strip strong{font-size:1.2rem}
 .audience-board .trick-totals{font-size:.75rem}
 .audience-board .phase-label{font-size:.78rem}
 .audience-board .contract-display>strong{font-size:4rem}
 .audience-board .contract-display>span{font-size:.84rem}
 .audience-board .auction-track>span{font-size:.9rem;min-width:62px;padding:9px}
 .audience-board .auction-track strong{font-size:.64rem;max-width:80px}
}
@media(max-width:580px){
 .thurupu-mode .game-container .game-surface{padding:12px 10px 13px}
 .thurupu-surface .thurupu-seats{gap:4px;margin-bottom:13px}
 .thurupu-seats .player-seat{padding:7px 5px;border-radius:8px}
 .thurupu-seats .player-seat .name{font-size:.62rem}
 .thurupu-seats .player-seat .seat-meta{font-size:.5rem;line-height:1.4;gap:1px}
 .thurupu-score-strip{font-size:.75rem;margin-bottom:13px;gap:6px}
 .thurupu-score-strip>span:first-child,.thurupu-score-strip>span:last-child{padding:5px 8px;gap:7px}
 .thurupu-score-strip>span:nth-child(2){font-size:.64rem}
 .thurupu-score-strip strong{font-size:.95rem}
 .thurupu-center{grid-template-columns:66px minmax(0,1fr);gap:13px;min-height:220px}
 .trump-label{font-size:.57rem}.trump-zone{gap:7px}
 .trump-card-slot{min-height:89px}
 .trump-card-slot .playing-card,.trump-placeholder{width:62px;height:87px}
 .trump-zone small{font-size:.49rem;max-width:62px}
 .trick-cards{gap:9px 8px;min-height:220px;max-width:226px}
 .trick-face .playing-card{width:74px;height:98px;border-radius:8px}
 .trick-empty{width:70px;height:94px;border-radius:8px}
 .trick-position>span{font-size:.53rem;line-height:1.3;max-width:90px}
 .trump-play-tag{font-size:.45rem;bottom:5px;right:4px;padding:2px 3px}
 .trick-totals{font-size:.59rem;margin-top:11px;gap:13px}
 .auction-board{min-height:220px}
 .contract-display>strong{font-size:3.3rem}
 .contract-display>span{font-size:.65rem;line-height:1.4}
 .phase-label{font-size:.57rem;margin-bottom:14px}
 .auction-track{gap:5px;margin-top:19px}
 .auction-track>span{font-size:.73rem;padding:6px 7px;min-width:47px}
 .auction-track strong{font-size:.49rem;max-width:57px}
 .thurupu-hand .hand-cards{--hand-card-width:115px;--hand-card-height:155px}
 .thurupu-hand .hand-fan{padding:29px 17px 15px}
 .thurupu-hand .hand-fan[data-card-count="0"]{min-height:145px}
 .thurupu-controls .move-prompt{font-size:.7rem}
 .thurupu-controls>.btn{min-height:49px;font-size:.88rem;width:100%}
 .bid-controls{gap:7px}
 .bid-controls select{font-size:1rem;min-width:70px;flex-basis:70px;padding:8px 10px;min-height:49px}
 .bid-controls .btn{min-height:49px;font-size:.83rem;padding:9px 12px}
 .thurupu-play-actions{gap:7px}
 .thurupu-play-actions .btn{font-size:.79rem;min-height:51px;padding:10px}
 .result-team-grid{gap:11px;margin:20px 0}
 .result-team{padding:15px 10px;border-radius:13px}
 .result-team p{font-size:.65rem}.result-team>strong{font-size:2.9rem}
 .result-team>span{font-size:.73rem}.result-team small{font-size:.6rem}
 .seat-notice{flex-direction:column;align-items:flex-start;font-size:.81rem;padding:17px}
 .team-seats{gap:10px;margin:20px 0 15px}.waiting-team{padding:12px}
 .team-seat strong{font-size:.73rem}.team-seat small{font-size:.59rem}
 .empty-seat-symbol{width:20px;font-size:1.4rem}
 .team-seat>.empty-seat-symbol+span{font-size:.7rem}
 .thurupu-waiting>.spread h2{font-size:1.5rem}
 .audience-board .thurupu-seats .player-seat{padding:8px 6px;flex:none}
 .audience-board .thurupu-seats .player-seat .name{font-size:.65rem}
 .audience-board .thurupu-seats .player-seat .seat-meta{font-size:.5rem}
 .audience-board .thurupu-center{grid-template-columns:74px minmax(0,1fr);gap:15px}
 .audience-board .trump-card-slot .playing-card,.audience-board .trump-placeholder{width:70px;height:98px}
 .audience-board .trick-face .playing-card{width:82px;height:112px}
 .audience-board .trick-empty{width:78px;height:108px}
 .audience-board .trump-play-tag{font-size:.5rem;bottom:7px;right:5px;padding:3px}
 .audience-board .trump-label{font-size:.59rem}
 .audience-board .thurupu-score-strip{margin-top:16px}
 .audience-board .trick-totals{margin-top:18px}
}
@media(max-width:370px){
 .thurupu-center{grid-template-columns:58px minmax(0,1fr);gap:9px}
 .trump-card-slot .playing-card,.trump-placeholder{width:55px;height:78px}
 .trick-face .playing-card{width:67px;height:90px}.trick-empty{width:64px;height:87px}
 .trick-cards{gap:8px 5px;min-height:205px}.auction-board{min-height:205px}
 .thurupu-seats .player-seat .name{font-size:.56rem}.thurupu-seats .player-seat .seat-meta{font-size:.44rem}
 .thurupu-score-strip>span:nth-child(2){font-size:.58rem}
 .thurupu-hand .hand-cards{--hand-card-width:107px;--hand-card-height:144px}
}

/* Match each hand button's hit box to its exposed card strip. */
.hand-area .hand-fan .card-button{position:relative;width:calc(var(--hand-card-width) * .47);min-width:calc(var(--hand-card-width) * .47);flex:0 0 calc(var(--hand-card-width) * .47);height:var(--hand-card-height);min-height:var(--hand-card-height);margin:0;overflow:visible;transform-origin:calc(var(--hand-card-width) / 2) 100%}
.hand-area .hand-fan .card-button:last-child{width:var(--hand-card-width);min-width:var(--hand-card-width);flex-basis:var(--hand-card-width)}
.hand-area .hand-fan .card-button+.card-button{margin-left:0}
.hand-area .hand-fan .card-button .playing-card{position:absolute;left:0;top:0;pointer-events:none}
.hand-area .hand-fan .card-button .selection-check{pointer-events:none}

.hand-area .hand-fan .card-button .joker-tag{pointer-events:none}

/* 3-patti has its own brighter table, while the physical card faces stay familiar. */
body.patti-mode{background-color:#eaf6f5;background-image:radial-gradient(ellipse at 8% 4%,#d8edff 0,transparent 49%),radial-gradient(ellipse at 98% 50%,#f6dcf37d 0,transparent 50%),radial-gradient(circle,#6eb4c322 1px,transparent 1px);background-size:auto,auto,24px 24px;background-attachment:fixed}
.patti-mode .game-surface{background-color:#087d85;background-image:radial-gradient(ellipse at 45% 12%,#47c8c0a8,transparent 68%),repeating-radial-gradient(circle at 25% 30%,#ffffff08 0,#ffffff08 .7px,transparent .8px,transparent 3px),linear-gradient(145deg,#1a9b9d,#167481 70%,#1c617e);border:1px solid #80bfb7;box-shadow:inset 0 1px 0 #d6fae861,inset 0 0 60px #05506524,0 8px 30px #17748219}
.patti-mode .game-surface.your-turn{box-shadow:inset 0 0 0 2px #f9dc77,inset 0 0 55px #05506524,0 8px 30px #17748219}
.patti-mode .player-seat{background:#003f5845;border-color:#b4e0d936}
.patti-mode .player-seat.active{background:#f7d86630;border-color:#ffe385}
.patti-mode .hand-area{background:linear-gradient(140deg,#fffdf1,#edf9f1);border:1px solid #a9d5ca;border-top:0}
.patti-mode .your-turn .turn-indicator{background:#ffe788;color:#214644}
body.patti-mode.audience-mode{background-color:#135363;background-image:radial-gradient(ellipse at 40% 5%,#2b879980,transparent 65%),radial-gradient(circle,#b8eff211 1px,transparent 1px);background-size:auto,28px 28px}
.patti-mode.audience-mode .app-header{border-color:#bfe7ee30}

/* A pickup is made on its physical source, after the throw has been saved. */
.pile-pickup{position:relative;display:block;width:var(--pile-width);height:var(--pile-height);padding:0;border:0;background:none;border-radius:12px;cursor:pointer;color:#23403b;font:inherit;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.pile-pickup>.playing-card{pointer-events:none;outline:4px solid #ffe074;outline-offset:3px;box-shadow:0 0 0 8px #ffe07420,0 12px 24px #053b5055}
.pile-pickup:focus-visible{outline:3px solid #fff;outline-offset:9px}
.pile-pickup:active:not(:disabled){transform:translateY(2px)}
.pile-pickup:disabled{cursor:wait;opacity:.72}
.pickup-target-label{position:absolute;z-index:2;left:50%;bottom:-18px;transform:translateX(-50%);display:block;white-space:nowrap;padding:8px 13px;min-width:calc(var(--pile-width) - 12px);border:1px solid #fff0a7;border-radius:9px;background:#ffe074;color:#243d36;font-size:.83rem;font-weight:800;line-height:1.15;text-align:center;box-shadow:0 4px 10px #144a4240;pointer-events:none}
.previous-card-slot{position:absolute;left:calc(var(--stack-spread) * -1);top:33px;z-index:6;transform:rotate(-5deg);width:var(--pile-width);height:var(--pile-height)}
.previous-stack-card{position:relative;width:var(--pile-width);height:var(--pile-height)}
.previous-stack-card .pickup-target-label{font-size:.7rem;background:#e9f0d6;border-color:#f8ffe2}
.picking-cards .draw-joker-stack,.picking-cards .stack-fan{height:calc(var(--pile-height) + 54px)}
.picking-cards .stack-layer.stack-front .card-value{font-size:34cqw;line-height:1;margin:9% 0 0 10%}
.picking-cards .stack-layer.stack-front .card-suit{font-size:35cqw;line-height:1;margin:7% 0 0 10%}
.pickup-instruction{display:flex;align-items:center;justify-content:center;gap:10px;border-radius:12px;background:#e1f1e6;color:#245143;min-height:43px;font-size:.9rem;font-weight:650}
.pickup-instruction>span{font-size:1.65rem;line-height:1}

/* Show results retain clear green/red labels as well as color. */
.result-status{display:flex;align-items:center;gap:8px;width:fit-content;max-width:100%;padding:9px 13px;border-radius:10px;font-size:.84rem!important;font-weight:750;line-height:1.45}
.result-status.good,.show-label.good{color:#125435;background:#d9f2d4}
.result-status.bad,.show-label.bad{color:#982c2b;background:#ffe0da}
.show-label{display:inline-block;padding:5px 8px;border-radius:6px;font-size:.69rem;font-weight:750;line-height:1.3}
.patti-result .result-hand.showing-good{border:2px solid #55a576;background:#eaf7df}
.patti-result .result-hand.showing-bad{border:2px solid #d97068;background:#fff0e9}
.round-points{font-size:1.35rem!important;font-weight:750;margin:13px 0 9px!important}
.round-points>span{font-size:.66rem;font-weight:500;color:#546353}
.result-hand.showing-good .round-points{color:#17663e}.result-hand.showing-bad .round-points{color:#a52e2b}
.round-score-table .good-show-row td,.round-score-table .good-show-row th:first-child{background:#eff8e9}
.round-score-table .bad-show-row td,.round-score-table .bad-show-row th:first-child{background:#fff0ec}
.round-score-table .show-score.good{background:#ceeabd;color:#15582f;box-shadow:inset 0 0 0 2px #74b278}
.round-score-table .show-score.bad{background:#ffcfc4;color:#942621;box-shadow:inset 0 0 0 2px #de8b7c}
.round-score-table .show-score strong{font-size:1.12rem}
.round-score-table .show-score small{color:inherit}
.round-score-table th .show-label{display:table;margin-top:7px}
.next-draw-reveal{display:flex;align-items:center;gap:20px;padding:18px 21px;border:1px dashed #b5baa1;background:#faf8e9;border-radius:15px;margin:24px 0}
.next-draw-reveal .playing-card{flex:none;width:67px;height:91px;transform:rotate(-5deg)}
.next-draw-reveal h3{font-size:.88rem;font-weight:700;margin:0 0 6px}
.next-draw-reveal p{font-size:.83rem;color:#526552;margin:0}
.empty-next-card{display:grid;place-items:center;width:67px;height:91px;border:1px dashed #b5baa1;border-radius:7px;font-size:2rem;color:#75886f}
.next-dealer-note{font-weight:650;color:#355643;font-size:.9rem}
.deal-next-button{display:flex;gap:22px;align-items:center;justify-content:center;min-height:54px}
.match-summary{padding:26px 0 8px;border-top:1px solid var(--line);margin:26px 0}
.match-summary>h3{font-family:Georgia,serif;font-size:1.65rem;margin:0 0 17px}
.stats-partial{font-size:.8rem;padding:10px 13px;border:1px solid #cfc7a7;border-radius:9px;background:#f4eed5;color:#5d593b;margin:0 0 18px}
.match-show-summary{overflow-x:auto;border:1px solid #d1dac6;border-radius:12px}
.match-show-summary table{width:100%;border-collapse:collapse;font-size:.86rem;background:#fbfdf5}
.match-show-summary caption{text-align:left;padding:13px 16px;font-weight:750;background:#ebf0df}
.match-show-summary th,.match-show-summary td{padding:11px 16px;border-top:1px solid #dbe1cd;text-align:left}
.match-show-summary td,.match-show-summary thead th:not(:first-child){text-align:center}
.good-show-text{color:#206237}.bad-show-text{color:#972f29}
.good-show-count{background:#e1f1d5;color:#1c5d31;font-weight:750}.bad-show-count{background:#ffebe4;color:#912e27;font-weight:750}
.match-awards{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin-top:18px}
.match-award{position:relative;min-width:0;padding:18px;border:1px solid #ddd4a9;border-radius:14px;background:linear-gradient(135deg,#fff9dd,#fbf5ed)}
.match-award h4{font-size:.91rem;margin:0 21px 10px 0;color:#795726}
.match-award p{font-weight:650;font-size:.9rem;margin:0 0 8px;overflow-wrap:anywhere}
.match-award strong{font-size:.71rem;font-weight:500;color:#746349}
.award-spark{position:absolute;right:13px;top:12px;font-size:1.6rem;color:#c5a45a}

/* Fixed, bounded decorations loop in CSS until the derived result disappears. */
.result-effects-layer{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:18;contain:strict}
.result-mascot{position:absolute;right:max(14px,calc((100vw - 1320px)/2));bottom:20px;width:100px;height:110px;opacity:.88;filter:drop-shadow(0 6px 6px #38466022);animation:result-face-sway 2.8s ease-in-out infinite}
.result-mascot>span{font-size:83px;line-height:1.3}.result-mascot svg{width:100%;height:100%}
.face-tear{animation:result-tear 1.35s ease-in infinite;transform-origin:center}.tear-right{animation-delay:.65s}
.result-floating-emoji{position:absolute;left:var(--left);bottom:-70px;font-size:clamp(21px,2.5vw,34px);opacity:0;animation:result-emoji-rise var(--duration) linear var(--delay) infinite;filter:drop-shadow(0 2px 2px #17364519)}
.result-confetti{position:absolute;left:var(--left);top:-25px;width:7px;height:13px;border-radius:2px;background:var(--color);opacity:0;animation:result-confetti-fall var(--duration) linear var(--delay) infinite}
.result-confetti:nth-of-type(3n){border-radius:50%;width:9px;height:9px}
@keyframes result-confetti-fall{0%{transform:translate3d(0,-2vh,0) rotate(0);opacity:0}8%{opacity:.75}90%{opacity:.7}100%{transform:translate3d(var(--drift),105vh,0) rotate(600deg);opacity:0}}
@keyframes result-emoji-rise{0%{transform:translate3d(-15px,0,0) rotate(-9deg);opacity:0}12%,80%{opacity:.5}100%{transform:translate3d(25px,-110vh,0) rotate(14deg);opacity:0}}
@keyframes result-face-sway{0%,100%{transform:rotate(-5deg) translateY(0)}50%{transform:rotate(5deg) translateY(-7px)}}
@keyframes result-tear{0%{transform:translateY(0);opacity:0}15%{opacity:1}85%{opacity:.85}100%{transform:translateY(37px);opacity:0}}
@media(max-width:580px){
 .pickup-target-label{font-size:.69rem;padding:8px 9px;bottom:-17px;min-width:calc(var(--pile-width) - 5px)}
 .previous-stack-card .pickup-target-label{font-size:.58rem}
 .previous-card-slot{top:28px}
 .picking-cards .draw-joker-stack,.picking-cards .stack-fan{height:calc(var(--pile-height) + 47px)}
 .pickup-instruction{font-size:.77rem;min-height:38px}.pending-pickup .move-prompt{margin-bottom:7px;font-size:.71rem}
 .result-status{font-size:.73rem!important;padding:8px 10px}
 .round-points{font-size:1.13rem!important}.round-points>span{font-size:.59rem}
 .next-draw-reveal{gap:16px;padding:14px 16px;margin:20px 0}.next-draw-reveal h3{font-size:.82rem}.next-draw-reveal p{font-size:.76rem}
 .next-draw-reveal .playing-card,.empty-next-card{width:61px;height:83px}
 .match-summary{margin-top:21px;padding-top:22px}.match-summary>h3{font-size:1.42rem}
 .match-awards{grid-template-columns:1fr 1fr;gap:8px}.match-award{padding:13px 11px}.match-award h4{font-size:.75rem;margin-right:13px}.match-award p{font-size:.78rem}.match-award strong{font-size:.62rem}.award-spark{right:8px;top:9px;font-size:1.25rem}
 .match-show-summary th,.match-show-summary td{padding:10px 12px;font-size:.76rem}
 .result-mascot{width:69px;height:75px;right:8px;bottom:12px;opacity:.77}.result-mascot>span{font-size:58px}
 .result-floating-emoji{font-size:23px}.result-confetti{width:6px;height:11px}
}
@media(prefers-reduced-motion:reduce){.result-effects-layer{display:none}.pile-pickup:active:not(:disabled){transform:none}}
.animations-off .result-effects-layer{display:none}

.show-summary-totals{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0 0 15px}.show-summary-totals>div{display:flex;align-items:center;gap:13px;padding:16px 18px;border-radius:12px}.show-summary-totals .good{background:#dcf0ce;color:#1d6134}.show-summary-totals .bad{background:#ffddd3;color:#992c28}.show-summary-totals strong{font-size:2rem;line-height:1}.show-summary-totals span{font-size:.86rem;font-weight:650}@media(max-width:580px){.show-summary-totals{gap:8px}.show-summary-totals>div{padding:13px 12px;gap:10px}.show-summary-totals strong{font-size:1.7rem}.show-summary-totals span{font-size:.73rem}}
/* During pickup, keep the newly thrown top readable beside the exposed old top. */
.picking-cards .stack-layer.stack-front .simple-card{align-items:flex-end}
.picking-cards .stack-layer.stack-front .card-value{margin:9% 10% 0 0}
.picking-cards .stack-layer.stack-front .card-suit{margin:7% 10% 0 0}
.patti-result .result-hand{min-width:0}.patti-result .revealed-cards{min-width:0;max-width:100%;padding:3px 2px 8px}
@media(max-width:580px){
 .patti-result .result-hands,.audience-board .patti-result .result-hands{grid-template-columns:repeat(2,minmax(0,1fr))}
 .patti-result .revealed-cards{gap:0}
 .patti-result .result-hand .small-card{width:46px;height:66px;flex:0 0 46px}
 .patti-result .result-hand .small-card+.small-card{margin-left:-19px}
 .patti-result .result-hand .small-card .card-value{font-size:22px;line-height:1;margin:5px 0 0 4px}
 .patti-result .result-hand .small-card .card-suit{font-size:22px;line-height:1;margin:5px 0 0 4px}
}
@media(max-width:370px){
 .patti-result .result-hand{padding:8px}
 .patti-result .result-hand .small-card{width:42px;height:61px;flex-basis:42px}
 .patti-result .result-hand .small-card+.small-card{margin-left:-18px}
 .patti-result .result-hand .small-card .card-value,.patti-result .result-hand .small-card .card-suit{font-size:20px;margin-left:3px}
}

/* Revealed hand totals stay separate from the good/bad Show score. */
.result-card-scores{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:13px 0 11px}
.result-card-scores dt{font-size:.73rem;line-height:1.3;font-weight:550;color:#52614e}
.result-card-scores dd,.result-card-scores .round-points{font-size:1.3rem!important;line-height:1.3;font-weight:750;margin:4px 0 0!important}
.result-card-scores .hand-total{color:#294638}
@media(max-width:580px){.result-card-scores{gap:7px;margin:11px 0 9px}.result-card-scores dt{font-size:.68rem}.result-card-scores dd,.result-card-scores .round-points{font-size:1.13rem!important}}

/* The active player's cue breathes continuously without flashing. */
.turn-arrival .your-turn{animation:none}
.turn-pulse .my-move{animation:active-turn-breathe 2.8s ease-in-out 3.5 forwards;border-radius:15px;padding:13px;border:2px solid #d9b856}
.turn-pulse .my-move .move-prompt{font-weight:800;color:#375029}
.turn-pulse .your-turn .turn-indicator{animation:active-turn-label 2.8s ease-in-out 3.5 forwards;font-weight:800;transform-origin:center}
.turn-pulse .player-seat.active{animation:active-seat-glow 2.8s ease-in-out 3.5 forwards}
@keyframes active-turn-breathe{0%,100%{background-color:#f7f3d9;box-shadow:0 0 0 0 #e4bd5d44,0 3px 16px #a8892c15;border-color:#c8ae61}50%{background-color:#ffebad;box-shadow:0 0 0 5px #e4bd5d30,0 4px 27px #a8892c34;border-color:#c59631}}
@keyframes active-turn-label{0%,100%{box-shadow:0 0 0 0 #ffe7a000;transform:scale(1)}50%{box-shadow:0 0 0 6px #ffe7a030;transform:scale(1.025)}}
@keyframes active-seat-glow{0%,100%{box-shadow:0 0 0 0 #ffe19720}50%{box-shadow:0 0 0 3px #ffe19765}}
@media(max-width:580px){.turn-pulse .my-move{border-radius:18px 18px 0 0;padding:10px 14px max(12px,env(safe-area-inset-bottom));border-width:2px 1px 0}.turn-pulse .my-move .move-prompt{font-size:.79rem}}

/* Names and Show outcomes have equal prominence and remain readable when wrapped. */
.show-result-hero{display:grid;grid-template-columns:minmax(0,1fr) 154px;gap:24px;align-items:center;margin-bottom:12px}
.patti-result .show-result-heading{display:flex;flex-wrap:wrap;gap:.18em .4em;font-family:inherit;font-size:clamp(1.85rem,3.4vw,2.7rem);font-weight:800;letter-spacing:-.035em;line-height:1.15;margin:0}
.show-player,.show-outcome{font:inherit;color:inherit;min-width:0;overflow-wrap:anywhere}
.show-outcome{white-space:nowrap}
.good-show-result .show-result-heading{color:#24603b}.bad-show-result .show-result-heading{color:#a43430}
.show-player::after{content:' ·';color:currentColor;opacity:.52}
.show-score-note{font-size:.89rem;font-weight:650;margin:14px 0 0;color:#52614d}
.match-winner-heading{font-family:Georgia,serif;font-size:clamp(1.6rem,2.8vw,2.3rem);font-weight:500;line-height:1.2;overflow-wrap:anywhere;margin:22px 0 12px;color:#214f3a}
.result-reaction-card{border-radius:20px;padding:3px 5px 10px;background:linear-gradient(145deg,#f8efc6,#f0f5dc);border:1px solid #e0d9b0;transform:rotate(3deg);box-shadow:0 5px 0 #e4dfc45c;text-align:center;overflow:hidden}
.result-reaction-card.lose{background:linear-gradient(145deg,#fce7de,#e2eff3);border-color:#e2c8b9;transform:rotate(-3deg);box-shadow:0 5px 0 #e6d8cc5c}
.result-reaction-card svg{display:block;width:100%;height:auto;overflow:visible}
.reaction-caption{display:block;font-size:.7rem;font-weight:800;line-height:1.3;color:#596044;letter-spacing:-.015em}
.lose .reaction-caption{color:#7e5b56}
.result-animations-on .reaction-body{animation:reaction-body-dance 1.4s ease-in-out infinite;transform-origin:90px 113px}
.result-animations-on .reaction-arm-left{animation:reaction-wave-left 1.15s ease-in-out infinite;transform-origin:54px 88px}
.result-animations-on .reaction-arm-right{animation:reaction-wave-right 1.15s ease-in-out -.55s infinite;transform-origin:127px 88px}
.result-animations-on .reaction-foot-left{animation:reaction-step .95s ease-in-out infinite;transform-origin:76px 136px}
.result-animations-on .reaction-foot-right{animation:reaction-step .95s ease-in-out -.475s infinite;transform-origin:108px 136px}
.result-animations-on .reaction-laugh{animation:reaction-laugh 1.35s ease-in-out infinite;transform-origin:90px 110px}
.result-animations-on .reaction-clap-left{animation:reaction-clap-left .85s ease-in-out infinite;transform-origin:44px 127px}
.result-animations-on .reaction-clap-right{animation:reaction-clap-right .85s ease-in-out infinite;transform-origin:136px 127px}
.result-animations-on .reaction-baby,.result-animations-on .reaction-wailer{animation:reaction-sob 2.3s ease-in-out infinite;transform-origin:90px 134px}
.result-animations-on .reaction-tear{animation:reaction-tear 1.65s ease-in infinite;transform-origin:center}
.result-animations-on .reaction-tear.tear-right{animation-delay:.75s}
.result-animations-on .reaction-palm{animation:reaction-facepalm 3.2s ease-in-out infinite;transform-origin:119px 128px}
@keyframes reaction-body-dance{0%,100%{transform:rotate(-7deg) translateY(0)}50%{transform:rotate(7deg) translateY(-7px)}}
@keyframes reaction-wave-left{0%,100%{transform:rotate(-12deg)}50%{transform:rotate(16deg)}}
@keyframes reaction-wave-right{0%,100%{transform:rotate(12deg)}50%{transform:rotate(-16deg)}}
@keyframes reaction-step{0%,100%{transform:rotate(-7deg) translateY(0)}50%{transform:rotate(8deg) translateY(-7px)}}
@keyframes reaction-laugh{0%,100%{transform:rotate(-4deg) translateY(0)}50%{transform:rotate(4deg) translateY(-5px)}}
@keyframes reaction-clap-left{0%,100%{transform:rotate(-8deg)}50%{transform:rotate(13deg)}}
@keyframes reaction-clap-right{0%,100%{transform:rotate(8deg)}50%{transform:rotate(-13deg)}}
@keyframes reaction-sob{0%,100%{transform:translateY(0) rotate(-3deg)}35%{transform:translateY(-4px) rotate(3deg)}65%{transform:translateY(2px) rotate(-1deg)}}
@keyframes reaction-tear{0%{transform:translateY(0);opacity:0}16%{opacity:1}80%{opacity:.8}100%{transform:translateY(35px);opacity:0}}
@keyframes reaction-facepalm{0%,100%{transform:rotate(0)}40%,65%{transform:rotate(-9deg)}}
@media(max-width:580px){
 .show-result-hero{grid-template-columns:minmax(0,1fr) 96px;gap:13px;margin:0 0 17px;align-items:center}
 .patti-result .show-result-heading,.audience-board .patti-result .show-result-heading{font-size:1.65rem;line-height:1.13;gap:.2em .25em;margin:0}
 .show-score-note{font-size:.74rem;margin-top:12px}
 .result-reaction-card{padding:1px 3px 8px;border-radius:15px}
 .reaction-caption{font-size:.54rem;line-height:1.3}
 .match-winner-heading{font-size:1.6rem;margin-top:18px}
}
@media(max-width:370px){.show-result-hero{grid-template-columns:minmax(0,1fr) 83px;gap:10px}.patti-result .show-result-heading,.audience-board .patti-result .show-result-heading{font-size:1.46rem}.reaction-caption{font-size:.51rem}}
@media(prefers-reduced-motion:reduce){.turn-pulse .my-move,.turn-pulse .your-turn .turn-indicator,.turn-pulse .player-seat.active,.result-reaction-card *{animation:none!important}}
.animations-off .my-move,.animations-off .your-turn .turn-indicator,.animations-off .player-seat.active,.animations-off .result-reaction-card *{animation:none!important}

/* The full private hand area stays conspicuous for the entire active turn. */
.turn-pulse .hand-area{background-image:none;animation:active-hand-breathe 2.8s ease-in-out 3.5 forwards}
@keyframes active-hand-breathe{0%,100%{background-color:#fffbea;box-shadow:inset 0 0 0 2px #e2ca7166,inset 0 0 25px #f3d77712}50%{background-color:#ffe9a2;box-shadow:inset 0 0 0 3px #c9a54d,inset 0 0 58px #e3b94e24}}
@media(prefers-reduced-motion:reduce){.turn-pulse .hand-area{animation:none!important}}
.animations-off .hand-area{animation:none!important}

/* Staged dealing shows empty destinations, then face-down received cards. */
.hand-reveal-tools{display:flex;align-items:center;justify-content:flex-end;gap:15px}
.reveal-all{font-size:.78rem;font-weight:750;min-height:40px;padding:6px 9px;border:1px solid #aac4aa;border-radius:9px;background:#ecf4dc;color:#315d3f}
.hand-card-placeholder{position:absolute;left:0;top:0;width:var(--hand-card-width);height:var(--hand-card-height);display:grid;place-items:center;border:2px dashed #8ca990;border-radius:14px;color:#668874;font-size:2rem;background:#eaf2df44;pointer-events:none}
.hand-fan .deal-slot-empty{opacity:.6;cursor:default;animation:none}
.hand-fan .face-down-hand:disabled{opacity:.83}
.hand-fan .face-down-hand .playing-card{border:2px solid #f5edbd;box-shadow:0 4px 12px #244a3940}
.tap-to-reveal{position:absolute;left:10px;bottom:17px;max-width:55px;color:#fff0b5;font-size:.72rem;font-weight:700;line-height:1.3;z-index:2;pointer-events:none;text-align:left;text-shadow:0 1px 3px #002c26}
.private-flip-inner{position:absolute;left:0;top:0;width:var(--hand-card-width);height:var(--hand-card-height);transform-style:preserve-3d;animation:private-hand-reveal .62s cubic-bezier(.25,.65,.2,1) both}
.private-flip-front,.private-flip-back{position:absolute;inset:0;backface-visibility:hidden;transform:rotateY(0deg)}
.private-flip-back{transform:rotateY(180deg)}
@keyframes private-hand-reveal{0%{transform:perspective(750px) rotateY(180deg)}100%{transform:perspective(750px) rotateY(0deg)}}
.setup-card-slot.playing-card{display:grid;place-items:center;border:2px dashed #d2ebd57a;background:#c5f0db15;box-shadow:none;color:#e5f0d2;font-family:inherit;font-size:.8rem;font-weight:600;text-align:center}
.joker-layer .setup-card-slot{align-items:center;justify-items:start;padding-left:9px}
.setup-picking .draw-joker-stack{height:calc(var(--pile-height) + 34px)}
.setup-pick-button{display:flex;align-items:center;justify-content:center;gap:24px;min-height:54px;width:min(100%,390px);margin:auto}
.setup-progress{display:flex;gap:8px;align-items:center;justify-content:center;min-height:27px}
.setup-progress>span{width:22px;height:8px;border:1px solid #9bac89;border-radius:5px;background:#deead2}
@media(max-width:580px){
 .hand-reveal-tools{gap:8px}.reveal-all{font-size:.7rem;min-height:35px;padding:5px 8px}
 .tap-to-reveal{left:8px;bottom:13px;font-size:.65rem;max-width:43px}
 .hand-card-placeholder{border-radius:12px;font-size:1.6rem}
 .setup-controls .move-prompt{font-size:.73rem;line-height:1.4;margin-bottom:8px}
 .setup-pick-button{min-height:48px;font-size:.86rem}
 .setup-card-slot.playing-card{font-size:.65rem}.joker-layer .setup-card-slot{padding-left:6px}
 .setup-picking .draw-joker-stack{height:calc(var(--pile-height) + 27px)}
}
@media(prefers-reduced-motion:reduce){.private-flip-inner{animation:none!important}}
.animations-off .private-flip-inner{animation:none!important}

/* Seats retain join order, rotating visually so the viewer sits at the bottom. */
.table-orbit{--seat-width:112px;--seat-height:76px;position:relative;isolation:isolate;height:560px;width:100%;margin:4px auto 0}
.table-orbit:before{content:"";position:absolute;inset:35px 42px;border:1px solid #e0edcd35;border-radius:48%;box-shadow:inset 0 0 0 8px #062f2810,inset 0 0 70px #052f2815;pointer-events:none}
.game-surface .table-orbit .seat-circle{position:absolute;inset:0;display:block;margin:0;padding:0;overflow:visible;max-width:none;min-height:0}
.table-orbit .seat-circle .player-seat{position:absolute;left:calc(var(--seat-x) * (100% - var(--seat-width)) + var(--seat-width) / 2);top:calc(var(--seat-y) * (100% - var(--seat-height)) + var(--seat-height) / 2);transform:translate(-50%,-50%);z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;flex:none;width:var(--seat-width);min-width:0;max-width:none;height:var(--seat-height);min-height:0;padding:7px 8px;border-radius:13px;text-align:center;background:#063b38e8;border:1px solid #a1d3b95c;box-shadow:0 4px 12px #052c3526}
.table-orbit .seat-circle .player-seat.you{border-style:solid;border-color:#e3f2ca;background:#174f45}
.table-orbit .seat-circle .player-seat.active{border-color:#ffe58d;background:#5c6839;box-shadow:0 0 0 2px #ffe68a4d,0 5px 15px #03383d38}
.table-orbit .seat-circle .player-seat .name{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;white-space:normal;overflow:hidden;overflow-wrap:anywhere;max-width:100%;font-size:.83rem;line-height:1.16;font-weight:750;color:#fffdf0}
.table-orbit .seat-circle .player-seat .seat-meta{display:flex;justify-content:center;align-items:center;gap:4px;margin:0;white-space:nowrap;font-size:.68rem;line-height:1.2;color:#d8e8d9}
.table-orbit .seat-hand-count{font-size:.68rem;line-height:1.2;font-variant-numeric:tabular-nums;color:#fff4cf}
.table-orbit .dealer-token{position:absolute;right:-4px;top:-6px;display:grid;place-items:center;width:19px;height:19px;border:1px solid #f7efc4;border-radius:50%;background:#f2d477;color:#293d32;font-size:10px;font-weight:850;box-shadow:0 2px 5px #003a4a35}
.table-orbit .physical-piles{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:max-content;max-width:none;margin:0;z-index:1;gap:32px;--pile-width:120px;--pile-height:164px;--stack-step:26px;--stack-spread:78px}
.table-orbit .physical-piles .pile-caption{max-width:170px}
.table-orbit .seat-circle .player-seat.team-a{border-bottom:3px solid #b7dbae}
.table-orbit .seat-circle .player-seat.team-b{border-bottom:3px solid #f3c99b}
.thurupu-orbit{height:580px}
.table-orbit .thurupu-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;grid-template-columns:90px 252px;gap:25px;width:max-content;max-width:none;min-height:0;margin:0}
.table-orbit .trick-circle{--trick-width:76px;--trick-height:108px;position:relative;display:block;width:252px;height:384px;max-width:none;min-height:0;margin:0}
.table-orbit .trick-circle .trick-position{position:absolute;left:calc(var(--seat-x) * (100% - var(--trick-width)));top:calc(var(--seat-y) * (100% - var(--trick-height) - 21px));width:var(--trick-width);gap:4px}
.table-orbit .trick-circle .playing-card,.table-orbit .trick-circle .trick-empty{width:var(--trick-width);height:var(--trick-height);border-radius:8px}
.table-orbit .trick-circle .trick-position>span{font-size:.67rem;line-height:1.15;width:100%;height:17px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}
.table-orbit .trick-circle .trump-play-tag{font-size:.53rem;bottom:7px;right:4px}
.table-orbit .auction-board{width:240px;min-height:220px}
.table-orbit .auction-track{gap:6px;margin-top:18px}
.thurupu-surface .thurupu-score-strip{margin:0 0 8px}
.audience-board .table-orbit{--seat-width:155px;--seat-height:84px;height:clamp(460px,calc(100dvh - 350px),640px)}
.audience-board .table-orbit .seat-circle .player-seat{padding:10px 12px;border-radius:16px}
.audience-board .table-orbit .seat-circle .player-seat .name{font-size:1.05rem}
.audience-board .table-orbit .seat-circle .player-seat .seat-meta,.audience-board .table-orbit .seat-hand-count{font-size:.8rem}
.audience-board .table-orbit .physical-piles{--pile-width:145px;--pile-height:198px;--stack-step:32px;--stack-spread:96px;gap:70px}
.audience-board .table-orbit .thurupu-center{grid-template-columns:115px 312px;gap:40px}
.audience-board .table-orbit .trick-circle{--trick-width:94px;--trick-height:128px;width:312px;height:350px}
.audience-board .table-orbit .trick-circle .trick-position>span{font-size:.85rem}
.audience-board .table-orbit .trump-card-slot .playing-card,.audience-board .table-orbit .trump-placeholder{width:105px;height:145px}
.audience-board .table-orbit .auction-board{width:312px;min-height:300px}
.audience-board .table-orbit .contract-display>strong{font-size:5rem}
.audience-board .table-orbit .auction-track>span{font-size:1.05rem;min-width:90px}
@media(min-width:581px) and (max-width:1050px){
 .table-orbit,.audience-board .table-orbit{--seat-width:96px;--seat-height:76px;height:560px}
 .table-orbit .physical-piles,.audience-board .table-orbit .physical-piles{--pile-width:100px;--pile-height:138px;--stack-step:22px;--stack-spread:66px;gap:15px}
 .audience-board .table-orbit .seat-circle .player-seat{padding:7px}
 .audience-board .table-orbit .seat-circle .player-seat .name{font-size:.83rem}
 .audience-board .table-orbit .seat-circle .player-seat .seat-meta,.audience-board .table-orbit .seat-hand-count{font-size:.68rem}
 .table-orbit .thurupu-center,.audience-board .table-orbit .thurupu-center{grid-template-columns:75px 220px;gap:15px}
 .table-orbit .trick-circle,.audience-board .table-orbit .trick-circle{--trick-width:66px;--trick-height:92px;width:220px;height:338px}
 .audience-board .table-orbit .trick-circle .trick-position>span{font-size:.67rem}
 .audience-board .table-orbit .trump-card-slot .playing-card,.audience-board .table-orbit .trump-placeholder{width:75px;height:104px}
 .table-orbit .auction-board,.audience-board .table-orbit .auction-board{width:220px;min-height:240px}
}
@media(max-width:580px){
 .game-container .game-surface,.audience-board .game-surface,.thurupu-mode .game-container .game-surface{padding-left:7px;padding-right:7px}
 .game-surface .surface-top{justify-content:center;margin-bottom:15px}
 .table-orbit,.audience-board .table-orbit{--seat-width:78px;--seat-height:68px;height:470px;margin-top:0}
 .table-orbit[data-seat-count="2"],.audience-board .table-orbit[data-seat-count="2"]{height:335px}
 .table-orbit[data-seat-count="3"],.table-orbit[data-seat-count="4"],.audience-board .table-orbit[data-seat-count="3"],.audience-board .table-orbit[data-seat-count="4"]{height:450px}
 .table-orbit:before{inset:29px 32px;border-radius:48%;box-shadow:inset 0 0 0 6px #062f2810}
 .table-orbit .seat-circle .player-seat,.audience-board .table-orbit .seat-circle .player-seat{padding:6px 4px;gap:3px;border-radius:11px}
 .table-orbit .seat-circle .player-seat .name,.audience-board .table-orbit .seat-circle .player-seat .name{font-size:.77rem;line-height:1.1}
 .table-orbit .seat-circle .player-seat .seat-meta,.audience-board .table-orbit .seat-circle .player-seat .seat-meta,.table-orbit .seat-hand-count,.audience-board .table-orbit .seat-hand-count{font-size:.66rem;line-height:1.14}
 .table-orbit .seat-circle .player-seat .status-dot{width:4px;height:4px}
 .table-orbit .physical-piles,.audience-board .table-orbit .physical-piles{--pile-width:68px;--pile-height:96px;--stack-step:15px;--stack-spread:45px;flex-direction:column;align-items:center;gap:10px;width:118px}
 .table-orbit .physical-piles .pile-group,.audience-board .table-orbit .physical-piles .pile-group{gap:6px}
 .table-orbit .physical-piles .pile-label,.audience-board .table-orbit .physical-piles .pile-label{font-size:.76rem;letter-spacing:0;line-height:1.2;text-align:center}
 .table-orbit .physical-piles .pile-caption,.audience-board .table-orbit .physical-piles .pile-caption{font-size:.66rem;line-height:1.25;min-height:0;max-width:132px}
 .table-orbit .physical-piles .draw-joker-stack{width:calc(var(--pile-width) * 1.5)}
 .table-orbit .physical-piles .pickup-target-label{font-size:.68rem;white-space:normal;width:calc(var(--pile-width) + 4px);min-width:0;padding:6px 5px;bottom:-22px;line-height:1.1}
 .table-orbit .physical-piles .previous-card-slot{top:32px}
 .table-orbit .physical-piles .previous-stack-card .pickup-target-label{font-size:.62rem}
 .table-orbit .physical-piles .stack-layer:not(:last-child) .card-value{font-size:18px;margin-left:1px}
 .table-orbit .physical-piles .stack-layer:not(:last-child) .card-suit{font-size:19px;margin-left:1px}
 .table-orbit[data-seat-count="2"] .physical-piles{flex-direction:row;align-items:flex-start;gap:16px;width:max-content}
 .table-orbit .thurupu-center,.audience-board .table-orbit .thurupu-center{grid-template-columns:1fr;justify-items:center;gap:15px;width:162px}
 .table-orbit .trump-zone{gap:5px;width:112px}
 .table-orbit .trump-label,.audience-board .table-orbit .trump-label{font-size:.7rem}
 .table-orbit .trump-card-slot{min-height:0}
 .table-orbit .trump-card-slot .playing-card,.table-orbit .trump-placeholder,.audience-board .table-orbit .trump-card-slot .playing-card,.audience-board .table-orbit .trump-placeholder{width:48px;height:66px;border-radius:7px}
 .table-orbit .trump-zone small,.audience-board .table-orbit .trump-zone small{font-size:.62rem;max-width:112px}
 .table-orbit .trump-suit{position:absolute;margin-left:95px;margin-top:45px;font-size:1.35rem}
 .table-orbit .trick-circle,.audience-board .table-orbit .trick-circle{--trick-width:52px;--trick-height:73px;width:162px;height:212px}
 .table-orbit .trick-circle .trick-position>span,.audience-board .table-orbit .trick-circle .trick-position>span{font-size:.64rem;line-height:1.2}
 .table-orbit .trick-circle .trump-play-tag,.audience-board .table-orbit .trick-circle .trump-play-tag{font-size:.43rem;bottom:4px;right:3px;padding:2px 3px}
 .table-orbit .auction-board,.audience-board .table-orbit .auction-board{width:156px;min-height:260px}
 .table-orbit .auction-track{gap:5px;margin-top:15px}
 .table-orbit .auction-track>span,.audience-board .table-orbit .auction-track>span{font-size:.86rem;padding:6px;min-width:62px}
 .table-orbit .auction-track strong,.audience-board .table-orbit .auction-track strong{font-size:.63rem;max-width:60px}
 .table-orbit .contract-display>strong,.audience-board .table-orbit .contract-display>strong{font-size:3.1rem}
 .table-orbit .contract-display>span,.audience-board .table-orbit .contract-display>span{font-size:.76rem;overflow-wrap:anywhere}
 .table-orbit .phase-label,.audience-board .table-orbit .phase-label{font-size:.69rem;margin-bottom:10px}
 .thurupu-surface .thurupu-score-strip,.audience-board .thurupu-surface .thurupu-score-strip{margin:0 2px 14px;font-size:.84rem;gap:8px}
 .thurupu-surface .thurupu-score-strip>span:nth-child(2),.audience-board .thurupu-surface .thurupu-score-strip>span:nth-child(2){font-size:.73rem}
 .thurupu-surface .thurupu-score-strip>span:first-child,.thurupu-surface .thurupu-score-strip>span:last-child{padding:5px 8px;gap:7px}
 .thurupu-surface .trick-totals{margin:15px 0 3px;gap:12px;font-size:.72rem}
 .thurupu-orbit[data-seat-count="4"],.audience-board .thurupu-orbit[data-seat-count="4"]{height:480px}
}
@media(max-width:370px){
 .table-orbit,.audience-board .table-orbit{--seat-width:66px;--seat-height:66px;height:480px}
 .table-orbit .seat-circle .player-seat,.audience-board .table-orbit .seat-circle .player-seat{padding:5px 3px}
 .table-orbit .seat-circle .player-seat .name,.audience-board .table-orbit .seat-circle .player-seat .name{font-size:.75rem}
 .table-orbit .seat-circle .player-seat .seat-meta,.audience-board .table-orbit .seat-circle .player-seat .seat-meta,.table-orbit .seat-hand-count,.audience-board .table-orbit .seat-hand-count{font-size:.63rem}
 .table-orbit .physical-piles,.audience-board .table-orbit .physical-piles{--pile-width:68px;--pile-height:96px;--stack-step:15px;--stack-spread:45px;width:116px;gap:10px}
 .table-orbit .physical-piles .pile-label,.audience-board .table-orbit .physical-piles .pile-label{font-size:.7rem}
 .table-orbit .physical-piles .pile-caption,.audience-board .table-orbit .physical-piles .pile-caption{font-size:.63rem;max-width:110px}
 .table-orbit .physical-piles .stack-layer:not(:last-child) .card-value{font-size:16px}
 .table-orbit .physical-piles .stack-layer:not(:last-child) .card-suit{font-size:17px}
 .table-orbit .physical-piles .pickup-target-label{font-size:.64rem}
 .table-orbit .thurupu-center,.audience-board .table-orbit .thurupu-center{width:150px}
 .table-orbit .trick-circle,.audience-board .table-orbit .trick-circle{--trick-width:48px;--trick-height:69px;width:150px;height:204px}
 .table-orbit .auction-board,.audience-board .table-orbit .auction-board{width:146px}
}

.table-orbit .trick-circle .trick-face{transform:none}
.audience-board .thurupu-orbit{height:clamp(440px,calc(100dvh - 365px),640px)}
@media(max-width:580px){
 .table-orbit.has-pickup,.audience-board .table-orbit.has-pickup{height:490px}
 .table-orbit.has-pickup[data-seat-count="2"],.audience-board .table-orbit.has-pickup[data-seat-count="2"]{height:365px}
 .table-orbit .physical-piles .picking-cards{gap:10px}
 .table-orbit .physical-piles.picking-cards .draw-joker-stack{height:calc(var(--pile-height) + 24px)}
 .table-orbit .physical-piles.picking-cards .stack-fan{height:calc(var(--pile-height) + 49px)}
 .table-orbit .physical-piles .previous-card-slot{transform:rotate(-2deg)}
 .table-orbit .physical-piles .pile-caption{font-size:.63rem}
 .table-orbit .thurupu-center,.audience-board .table-orbit .thurupu-center{gap:10px}
 .audience-board .thurupu-orbit{height:480px}
}
@media(max-width:370px){
 .table-orbit.has-pickup,.audience-board .table-orbit.has-pickup{height:500px}
 .table-orbit.has-pickup[data-seat-count="2"],.audience-board .table-orbit.has-pickup[data-seat-count="2"]{height:365px}
}
/* Four-seat tables leave a corner for trump and the center for the current trick. */
@media(max-width:580px){
 .thurupu-orbit[data-seat-count="4"],.audience-board .thurupu-orbit[data-seat-count="4"]{height:420px}
 .table-orbit .thurupu-center,.audience-board .table-orbit .thurupu-center{inset:0;transform:none;display:block;width:100%;height:100%;max-width:none}
 .table-orbit .thurupu-center .trump-zone{position:absolute;left:9px;top:27px;width:80px}
 .table-orbit .thurupu-center .trump-zone small{max-width:80px;font-size:.59rem}
 .table-orbit .thurupu-center .trump-suit{margin-left:68px}
 .table-orbit .thurupu-public-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:max-content}
}

/* Thurupu's undealt deck stays separate from the secret trump card. */
.thurupu-stock{position:absolute;z-index:3;right:8%;top:26px;display:flex;flex-direction:column;align-items:center;gap:9px;width:110px}
.thurupu-stock .playing-card{width:78px;height:108px;border-radius:8px}
.thurupu-stock.stock-empty{opacity:.45}
.stock-deal-button{position:relative;display:block;padding:0;border:0;background:none;min-width:44px;min-height:44px;color:#21463c}
.stock-deal-button>.playing-card{pointer-events:none;outline:3px solid #ffe074;outline-offset:3px}
.stock-deal-button>span{position:absolute;left:50%;bottom:-15px;transform:translateX(-50%);padding:6px 9px;background:#ffe074;color:#24463a;border-radius:7px;white-space:nowrap;font-size:.72rem;font-weight:800;pointer-events:none}
.thurupu-deal-status{width:220px;min-height:220px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:13px;text-align:center}
.thurupu-deal-status>strong{font-size:2.5rem;line-height:1.1;color:#f8e2a7}
.thurupu-deal-status>span:last-child{font-size:.85rem;line-height:1.4;color:#dae7cd;overflow-wrap:anywhere;max-width:100%}
.audience-board .thurupu-stock{right:9%;width:145px}
.audience-board .thurupu-stock .playing-card{width:105px;height:145px}
.audience-board .thurupu-deal-status{width:312px}
.audience-board .thurupu-deal-status>strong{font-size:3.3rem}
.audience-board .thurupu-deal-status>span:last-child{font-size:1.1rem}
@media(max-width:580px){
 .thurupu-stock,.audience-board .thurupu-stock{right:9px;top:27px;width:80px;gap:5px}
 .thurupu-stock .playing-card,.audience-board .thurupu-stock .playing-card{width:48px;height:66px;border-radius:7px}
 .stock-deal-button>span{font-size:.6rem;padding:5px 6px;bottom:-16px}
 .thurupu-deal-status,.audience-board .thurupu-deal-status{width:152px;min-height:200px;gap:10px}
 .thurupu-deal-status>strong,.audience-board .thurupu-deal-status>strong{font-size:2rem}
 .thurupu-deal-status>span:last-child,.audience-board .thurupu-deal-status>span:last-child{font-size:.76rem}
}

/* Short landscape screens put the private hand beside the shared table. */
@media(orientation:landscape) and (min-width:568px) and (max-height:650px){
 body.in-game{--landscape-height:calc(100dvh - 80px - env(safe-area-inset-bottom));--landscape-card-width:clamp(94px,27dvh,112px)}
 .in-game .app-header,.audience-mode .app-header{min-height:48px;padding:2px max(8px,env(safe-area-inset-right)) 2px max(8px,env(safe-area-inset-left));gap:10px;max-width:none}
 .in-game .brand-mark,.audience-mode .brand-mark{display:none}
 .in-game .brand-name,.audience-mode .brand-name{font-size:1.12rem}
 .in-game .icon-button{width:44px;height:44px;min-width:44px;border-radius:10px;font-size:1.25rem}
 .in-game .icon-toolbar{gap:5px}
 .in-game .main-container.game-container,.in-game .main-container.audience-container{max-width:none;padding:4px max(6px,env(safe-area-inset-right)) max(5px,env(safe-area-inset-bottom)) max(6px,env(safe-area-inset-left))}
 .game-container .table-heading,.audience-container .table-heading{min-height:18px;margin:0 2px 4px;padding:0;gap:10px}
 .game-container .table-heading h1,.audience-container .table-heading h1{font-size:.82rem;line-height:18px}
 .game-container .round-chip,.audience-container .round-chip{font-size:.67rem;line-height:18px}
 .game-container .table-main:has(>.game-surface){display:grid;grid-template-columns:minmax(0,1fr) minmax(190px,34%);gap:8px;align-items:start}
 .in-game .game-container .game-surface,.in-game .audience-board .game-surface:not(.audience-waiting){height:var(--landscape-height);min-height:0;padding:5px 6px;display:flex;flex-direction:column;border-radius:15px;min-width:0}
 .in-game .game-surface:before{inset:7px;border-radius:12px}
 .in-game .game-surface .surface-top{flex:0 0 auto;min-height:18px;justify-content:center;margin:0 0 4px;gap:4px}
 .in-game .game-surface .turn-indicator{font-size:.7rem;line-height:1.15;padding:3px 8px;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-height:18px}
 .in-game .game-surface .turn-indicator .status-dot{width:4px;height:4px}
 .in-game .game-surface .table-orbit{--seat-width:60px;--seat-height:44px;flex:1 1 auto;height:auto;min-height:0;width:100%;margin:0}
 .in-game .game-surface .table-orbit:before{inset:20px 27px;border-radius:48%;box-shadow:inset 0 0 0 4px #062f2810}
 .in-game .table-orbit .seat-circle .player-seat{padding:3px 4px;gap:1px;border-radius:9px}
 .in-game .table-orbit .seat-circle .player-seat .name{display:block;white-space:nowrap;text-overflow:ellipsis;font-size:.75rem;line-height:13px}
 .in-game .table-orbit .seat-circle .player-seat .seat-meta,.in-game .table-orbit .seat-hand-count{font-size:.6rem;line-height:11px}
 .in-game .table-orbit .seat-circle .player-seat .seat-meta .status-dot{display:none}
 .in-game .table-orbit .dealer-token{width:15px;height:15px;font-size:9px;right:-2px;top:-4px}
 .in-game .table-orbit .physical-piles{--pile-width:54px;--pile-height:74px;--stack-step:12px;--stack-spread:36px;flex-direction:row;align-items:flex-start;gap:14px;width:max-content;margin:0}
 .in-game .table-orbit .physical-piles .pile-group{gap:4px}
 .in-game .table-orbit .physical-piles .pile-label{font-size:.65rem;line-height:1.1;letter-spacing:0;min-height:12px}
 .in-game .table-orbit .physical-piles .pile-caption{font-size:.59rem;line-height:1.15;min-height:0;max-width:92px}
 .in-game .table-orbit .physical-piles .draw-joker-stack{width:calc(var(--pile-width) * 1.5);height:calc(var(--pile-height) + 6px)}
 .in-game .table-orbit .physical-piles .stack-fan{height:calc(var(--pile-height) + 8px)}
 .in-game .table-orbit .physical-piles.picking-cards .draw-joker-stack{height:calc(var(--pile-height) + 22px)}
 .in-game .table-orbit .physical-piles.picking-cards .stack-fan{height:calc(var(--pile-height) + 40px)}
 .in-game .table-orbit .physical-piles.setup-picking .draw-joker-stack{height:calc(var(--pile-height) + 22px)}
 .in-game .table-orbit .physical-piles .previous-card-slot{top:24px;transform:rotate(-2deg)}
 .in-game .table-orbit .physical-piles .pickup-target-label{font-size:.58rem;line-height:1.05;padding:5px 4px;bottom:-14px;min-width:0;width:calc(var(--pile-width) + 8px);white-space:normal}
 .in-game .table-orbit .physical-piles .stack-layer:not(:last-child) .card-value{font-size:13px;margin:5px 0 0 1px}
 .in-game .table-orbit .physical-piles .stack-layer:not(:last-child) .card-suit{font-size:14px;margin:4px 0 0 1px}
 .in-game .table-orbit .physical-piles .deck-count{font-size:.55rem;min-width:17px;padding:1px 3px}
 .in-game .game-container .hand-area{height:var(--landscape-height);min-height:0;min-width:0;display:flex;flex-direction:column;padding:7px 7px 5px;border:1px solid var(--line);border-radius:15px;overflow:auto;overscroll-behavior:contain}
 .in-game .hand-area .hand-title{min-height:18px;flex:0 0 auto;gap:5px}
 .in-game .hand-area .hand-title h2{font-size:.76rem;line-height:1.2;white-space:nowrap}
 .in-game .hand-area .hand-selection-hint{font-size:.62rem;line-height:1.2}
 .in-game .hand-area .hand-reveal-tools{gap:3px;flex-wrap:wrap;justify-content:flex-end}
 .in-game .hand-area .reveal-all{min-height:44px;font-size:.7rem;padding:4px 6px}
 .in-game .hand-area:has(.reveal-all) .hand-title{min-height:44px}
 .in-game .hand-area .hand-cards{--hand-card-width:var(--landscape-card-width);--hand-card-height:calc(var(--landscape-card-width) * 1.4);display:flex;flex:1 1 auto;min-height:0;overflow:auto;padding:0;margin:0;align-items:flex-start;overscroll-behavior:contain}
 .in-game .hand-area .hand-fan{padding:16px 5px 5px;min-height:calc(var(--hand-card-height) + 21px);gap:0;justify-content:center}
 .in-game .hand-area .hand-fan[data-card-count="0"]{min-height:100px;padding:18px 5px}
 .in-game .hand-area .hand-fan .card-button.selected,.in-game .hand-area .hand-fan .card-button.selected:hover:not(:disabled){transform:translateY(calc(var(--fan-offset) - 11px)) rotate(var(--fan-angle))}
 .in-game .hand-area .hand-fan .joker-tag{font-size:.49rem;padding:2px 4px;bottom:13%}
 .in-game .hand-area .hand-fan .selection-check{left:7px;top:-7px;width:20px;height:20px;font-size:.63rem}
 .in-game .hand-area .tap-to-reveal{font-size:.57rem;padding:4px 5px}
 .in-game .hand-area .move-controls,.in-game.turn-pulse .hand-area .my-move{position:static;flex:0 0 auto;inset:auto;z-index:auto;padding:7px 0 0;margin:0;border-radius:10px;border:0;box-shadow:none;backdrop-filter:none;background:transparent}
 .in-game.turn-pulse .hand-area .my-move{padding:5px;border:1px solid #d9b856}
 .in-game .hand-area .move-prompt,.in-game.turn-pulse .hand-area .my-move .move-prompt{font-size:.66rem;line-height:1.2;min-height:0;margin:0 0 5px}
 .in-game .hand-area .primary-moves,.in-game .hand-area .bid-controls,.in-game .hand-area .thurupu-play-actions{gap:5px}
 .in-game .hand-area .move-controls .btn,.in-game .hand-area .bid-controls select{min-height:44px;font-size:.75rem;padding:7px 8px;border-radius:9px}
 .in-game .hand-area .pickup-instruction{min-height:44px;font-size:.68rem;gap:5px}
 .in-game .hand-area .pickup-instruction>span{transform:rotate(-90deg);font-size:1.3rem}
 .in-game .hand-area .setup-progress{height:10px}
 .in-game .game-surface.thurupu-surface .thurupu-score-strip{position:absolute;right:8px;bottom:7px;display:block;max-width:110px;margin:0;font-size:.6rem;text-align:right}
 .in-game .game-surface.thurupu-surface .thurupu-score-strip>span:first-child,.in-game .game-surface.thurupu-surface .thurupu-score-strip>span:last-child{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
 .in-game .game-surface.thurupu-surface .thurupu-score-strip>span:nth-child(2){font-size:.61rem;line-height:1.2}
 .in-game .game-surface.thurupu-surface .trick-totals{position:absolute;left:8px;bottom:7px;display:grid;gap:1px;max-width:105px;margin:0;font-size:.59rem;line-height:1.2}
 .in-game .table-orbit .thurupu-center{inset:0;transform:none;display:block;width:100%;height:100%;max-width:none;min-height:0;margin:0}
 .in-game .table-orbit .thurupu-center .trump-zone{position:absolute;left:8px;top:9px;width:64px;gap:3px}
 .in-game .table-orbit .trump-card-slot{min-height:0}
 .in-game .table-orbit .trump-card-slot .playing-card,.in-game .table-orbit .trump-placeholder,.in-game .thurupu-stock .playing-card{width:44px;height:61px;border-radius:6px}
 .in-game .table-orbit .trump-label,.in-game .thurupu-stock .trump-label{font-size:.6rem;line-height:1.1}
 .in-game .table-orbit .trump-zone small{position:absolute;left:55px;top:22px;width:50px;max-width:none;font-size:.54rem;line-height:1.1;text-align:left}
 .in-game .table-orbit .trump-suit{position:absolute;margin-left:67px;margin-top:34px;font-size:1.05rem}
 .in-game .thurupu-stock{right:8px;top:9px;width:64px;gap:3px}
 .in-game .stock-deal-button>span{font-size:.54rem;padding:4px 5px;bottom:-13px}
 .in-game .table-orbit .thurupu-public-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:max-content}
 .in-game .table-orbit .trick-circle{--trick-width:clamp(44px,14dvh,60px);--trick-height:clamp(60px,20dvh,82px);width:calc(var(--trick-width) * 3 + 14px);height:calc(var(--trick-height) * 2 + 8px);min-height:0;margin:0}
 .in-game .table-orbit .trick-circle .trick-position{gap:0;top:calc(var(--seat-y) * (100% - var(--trick-height)))}
 .in-game .table-orbit .trick-circle .trick-position>span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
 .in-game .table-orbit .trick-circle .trump-play-tag{font-size:.43rem;padding:2px 3px;bottom:4px;right:3px}
 .in-game .table-orbit .auction-board,.in-game .thurupu-deal-status{width:160px;min-height:120px;gap:6px}
 .in-game .table-orbit .phase-label{font-size:.61rem;margin-bottom:6px}
 .in-game .table-orbit .contract-display{gap:4px}
 .in-game .table-orbit .contract-display>strong,.in-game .thurupu-deal-status>strong{font-size:2rem}
 .in-game .table-orbit .contract-display>span,.in-game .thurupu-deal-status>span:last-child{font-size:.66rem;line-height:1.2}
 .in-game .table-orbit .auction-track{gap:4px;margin-top:8px}
 .in-game .table-orbit .auction-track>span{font-size:.68rem;min-width:45px;padding:4px 5px;gap:2px}
 .in-game .table-orbit .auction-track strong{font-size:.55rem;max-width:55px}
 .in-game .audience-board .table-orbit{--seat-width:78px;--seat-height:44px}
 .in-game .audience-board .table-orbit .physical-piles{--pile-width:60px;--pile-height:83px;--stack-step:14px;--stack-spread:42px;gap:40px}
 .in-game .audience-board .thurupu-stock{right:15%}
 .in-game .audience-board .table-orbit .thurupu-center .trump-zone{left:15%}
 .in-game .review-banner{padding:9px 12px;margin-bottom:7px}
 .in-game .result-panel{padding:16px;margin-bottom:0}
 .in-game .show-result-hero{grid-template-columns:minmax(0,1fr) 100px}
 .in-game .result-hands{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
 .in-game .waiting-layout,.in-game .team-seats{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .in-game .waiting-layout>.panel{grid-column:1/-1}
 .utility-dialog{max-height:calc(100dvh - 14px);width:min(650px,calc(100vw - 24px))}
 .utility-heading{padding:10px 18px 8px}
 .utility-heading h2{font-size:1.35rem}
 .utility-content{padding:12px 18px;max-height:calc(100dvh - 78px)}
 .action-dialog{max-height:calc(100dvh - 16px);overflow:auto}
 .in-game .toast,.active-round .toast{bottom:12px;max-width:min(75vw,560px)}
 .in-game .event-banner{top:55px;font-size:.9rem;padding:9px 15px}
}
@media(orientation:landscape) and (min-width:568px) and (max-height:350px){
 .in-game .game-surface .table-orbit{--seat-width:54px;--seat-height:42px}
 .in-game .table-orbit .physical-piles{--pile-width:48px;--pile-height:66px;gap:12px}
 .in-game .table-orbit .physical-piles .previous-card-slot{top:21px}
 .in-game .table-orbit .physical-piles.picking-cards .stack-fan{height:calc(var(--pile-height) + 36px)}
 .in-game .audience-board .table-orbit{--seat-width:68px;--seat-height:42px}
 .in-game .audience-board .table-orbit .physical-piles{--pile-width:48px;--pile-height:66px;gap:30px}
 .in-game .table-orbit .trick-circle{--trick-width:44px;--trick-height:54px}
 .in-game .table-orbit .thurupu-center .trump-zone,.in-game .thurupu-stock{top:2px}
 .in-game .game-surface .patti-orbit{--seat-height:36px}
 .in-game .patti-orbit .seat-circle .seat-meta{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
}

@media(orientation:landscape) and (min-width:568px) and (min-height:551px) and (max-height:650px){
 body.in-game{--landscape-card-width:138px}
 .in-game .game-surface .table-orbit{--seat-width:96px;--seat-height:64px}
 .in-game .table-orbit .seat-circle .player-seat .name{font-size:.85rem;line-height:17px}
 .in-game .table-orbit .seat-circle .player-seat .seat-meta,.in-game .table-orbit .seat-hand-count{font-size:.7rem;line-height:14px}
 .in-game .table-orbit .physical-piles{--pile-width:84px;--pile-height:116px;--stack-step:20px;--stack-spread:60px;gap:24px}
 .in-game .table-orbit .physical-piles .pile-label{font-size:.75rem}
 .in-game .table-orbit .physical-piles .pile-caption{font-size:.69rem;max-width:130px}
 .in-game .table-orbit .physical-piles .pickup-target-label{font-size:.71rem;width:calc(var(--pile-width) + 8px)}
 .in-game .table-orbit .physical-piles .stack-layer:not(:last-child) .card-value{font-size:19px}
 .in-game .table-orbit .physical-piles .stack-layer:not(:last-child) .card-suit{font-size:20px}
 .in-game .table-orbit .trick-circle{--trick-width:68px;--trick-height:94px}
 .in-game .table-orbit .trump-card-slot .playing-card,.in-game .table-orbit .trump-placeholder,.in-game .thurupu-stock .playing-card{width:64px;height:89px}
 .in-game .hand-area .hand-cards{align-items:center}
 .in-game .hand-area .hand-title h2{font-size:.95rem}
 .in-game .hand-area .move-controls .btn,.in-game .hand-area .bid-controls select{font-size:.87rem;min-height:48px}
 .in-game .hand-area .move-prompt,.in-game.turn-pulse .hand-area .my-move .move-prompt{font-size:.8rem}
}
/* Keep short-screen status, card labels and seat names inside their own space. */
@media(orientation:landscape) and (min-width:568px) and (max-height:350px){
 .in-game .game-surface .surface-top{height:20px;min-height:20px;overflow:hidden;border-radius:10px}
 .in-game .game-surface .turn-indicator{min-height:18px;padding:2px 8px;font-size:.7rem;line-height:14px}
 .in-game.turn-pulse .your-turn .turn-indicator{animation:none;transform:none;box-shadow:none}
 .in-game .event-banner.turn{display:none}
 .in-game .table-orbit .seat-circle .player-seat{padding:2px 3px;gap:0}
 .in-game .table-orbit .seat-circle .player-seat .name{font-size:.75rem;line-height:14px;flex:0 0 auto}
 .in-game .table-orbit .seat-circle .player-seat .seat-meta,.in-game .table-orbit .seat-hand-count{font-size:.6rem;line-height:10px;flex:0 0 auto}
 .in-game .stock-deal-button>span{bottom:0;max-width:58px;padding:4px 3px;font-size:.54rem;line-height:1.05;white-space:normal;border-radius:4px}
}
/* Actions must size to the hand panel, including the narrowest landscape view. */
@media(orientation:landscape) and (min-width:568px) and (max-height:650px){
 .in-game .hand-area .move-controls .btn{min-width:0;max-width:100%;white-space:normal}
 .in-game .hand-area .thurupu-controls>.btn{width:100%;min-width:0;max-width:100%}
 .in-game .hand-area .bid-controls{flex-wrap:wrap;width:100%;max-width:100%;gap:5px}
 .in-game .hand-area .bid-controls select{flex:0 1 48px;width:48px;min-width:48px;max-width:100%;padding-left:6px;padding-right:4px}
 .in-game .hand-area .bid-controls .btn{flex:1 1 52px;min-width:44px;max-width:100%;padding-left:6px;padding-right:6px}
 .in-game .hand-area .thurupu-play-actions{flex-wrap:wrap;width:100%;max-width:100%;gap:5px}
 .in-game .hand-area .thurupu-play-actions .btn{flex:1 1 72px;min-width:44px;max-width:100%}
 .in-game .hand-area .primary-moves{width:100%;grid-template-columns:minmax(44px,.75fr) minmax(44px,1.25fr)}
 .in-game .hand-area .thurupu-controls .primary-moves{grid-template-columns:repeat(2,minmax(44px,1fr))}
 .in-game .hand-area .throw-button,.in-game .hand-area .setup-pick-button{gap:4px}
}
/* Navigation stays visible without taking another row from the playing area. */
.app-header>.game-nav{margin:0;min-height:44px;flex:0 0 auto}
.back-to-games{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;padding:9px 13px;border:1px solid #b48b41;border-radius:12px;background:#f5d487;color:#173b30;font-family:inherit;font-size:1.05rem;font-weight:750;line-height:1.2;white-space:nowrap;box-shadow:0 2px 0 #8d68292b;cursor:pointer}
.back-to-games>span:first-child{font-size:1.3em;line-height:1}
.back-to-games:hover{background:#ffe2a1;border-color:#8d6829;color:#102e25}
.back-to-games:active{box-shadow:none;transform:translateY(1px)}
.back-to-games:focus-visible,.library-settings-button:focus-visible{outline:3px solid #aa661e;outline-offset:3px}
.library-settings-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:9px 13px;border:1px solid #9daf99;border-radius:12px;background:#fffdf8;color:var(--green);font-family:inherit;font-size:1rem;font-weight:650;cursor:pointer}
.library-settings-button>span{font-size:1.3em;line-height:1}
.library-settings-button:hover{background:#eaf0e1}
.profile-form{display:grid;gap:10px;padding:0 0 22px;margin:0 0 8px;border-bottom:1px solid var(--line)}
.profile-form .field{gap:9px;font-size:1rem;font-weight:650}
.profile-form input{min-height:46px;font-size:1rem;font-weight:400}
.profile-form input:disabled{opacity:1;color:#687166;background:#eeefe8;border-color:#d5d9ce;-webkit-text-fill-color:#687166}
.profile-form .hint{font-size:.82rem;line-height:1.5;margin:0}
.profile-form>.btn{justify-self:start;min-height:44px;font-size:.94rem;padding:10px 18px}
.settings-actions>.back-to-games{width:100%;min-height:48px}
@media(max-width:580px){
 .app-header>.game-nav{gap:0}
 .back-to-games{gap:7px;padding:9px 10px;font-size:1rem;border-radius:10px}
 .profile-form>.btn{width:100%}
}

/* Header tools retain full touch targets beside the visible home control. */
.app-header .icon-toolbar .icon-button{width:44px;min-width:44px;height:44px}
@media(max-width:380px){
 .app-header,.in-game .app-header,.audience-mode .app-header{padding-left:10px;padding-right:10px;gap:4px}
 .app-header .back-to-games{padding-left:6px;padding-right:6px;gap:6px}
 .app-header .back-to-games>span:first-child{font-size:18px}
 .app-header .icon-toolbar{gap:4px}
}

/* Past results in each game lobby. */
/* Past results: a felt leaderboard and match cards in the table's own colours. */
.past-results{margin-top:22px;color:var(--ink)}
.past-title{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:18px;margin-bottom:20px;border-bottom:1px solid var(--line)}
.past-title h2{font-size:1.65rem}
.past-empty{padding:14px 2px}
.past-board{position:relative;border-radius:18px;padding:22px 22px 18px;color:#f7f1dd;overflow:hidden;background-image:radial-gradient(ellipse at 50% 0%,#3c7a62aa,transparent 62%),repeating-radial-gradient(circle at 25% 30%,#ffffff05 0,#ffffff05 .7px,transparent .8px,transparent 3px),linear-gradient(150deg,#245443,var(--green));box-shadow:inset 0 0 60px #09251d40}
.past-board:before{content:"";position:absolute;inset:9px;border:1px solid #d5ddbd26;border-radius:12px;pointer-events:none}
.past-board-head{position:relative;display:flex;align-items:baseline;justify-content:space-between;gap:4px 12px;flex-wrap:wrap}
.past-board-head h3{font-family:Georgia,serif;font-weight:400;font-size:1.45rem;letter-spacing:-.03em}
.past-board-head span{font-size:.74rem;color:#c9d8c4}
.past-podium{position:relative;list-style:none;padding:0;margin:18px auto 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:end;gap:10px;max-width:520px}
.past-podium.count-2{grid-template-columns:repeat(2,minmax(0,1fr));max-width:360px}
.past-podium.count-1{grid-template-columns:minmax(0,190px);justify-content:center}
.past-podium li{display:flex;flex-direction:column;align-items:center;text-align:center;min-width:0}
.past-podium strong{margin-top:8px;font-size:.95rem;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.past-wins{font-size:.8rem;color:#e9dfbf;margin-top:1px}
.past-wins b{font-family:Georgia,serif;font-size:1.4rem;color:#f4d68f;font-weight:400}
.past-podium small{font-size:.68rem;color:#b9cab6}
.past-step{display:grid;place-items:center;width:100%;margin-top:10px;border-radius:10px 10px 4px 4px;background:linear-gradient(#f3ead0,#dccfa8);color:#6a5424;font-family:Georgia,serif;font-size:1.3rem;box-shadow:inset 0 -3px 0 #c4b384,0 6px 16px #06201830}
.podium-1 .past-step{height:62px;background:linear-gradient(#f6dd93,#d9b560);color:#5b4210;box-shadow:inset 0 -3px 0 #b8914a,0 6px 16px #06201830}
.podium-2 .past-step{height:44px}
.podium-3 .past-step{height:32px}
.past-crown{color:#f2cf73;font-size:1.35rem;line-height:1;margin-bottom:3px;text-shadow:0 2px 6px #0006}
.past-avatar{--avatar:#235446;display:inline-grid;place-items:center;flex:0 0 auto;width:34px;height:34px;border-radius:50%;background:var(--avatar);color:#fff8e6;font-weight:750;font-size:.9rem;line-height:1;box-shadow:0 0 0 2px #fffdf7,0 2px 6px #0002}
.past-avatar.small{width:26px;height:26px;font-size:.72rem}
.past-avatar.medium{width:48px;height:48px;font-size:1.15rem;box-shadow:0 0 0 3px #e9dcb4,0 6px 14px #0004}
.past-avatar.large{width:60px;height:60px;font-size:1.45rem;box-shadow:0 0 0 3px #f2cf73,0 8px 18px #0005}
.past-ranking{position:relative;list-style:none;margin:16px auto 0;padding:12px 0 0;border-top:1px solid #d5ddbd24;display:grid;gap:8px;max-width:600px}
.past-ranking li{display:grid;grid-template-columns:20px auto minmax(0,1fr) minmax(60px,1fr) 96px;align-items:center;gap:10px;font-size:.85rem}
.past-ranking .past-rank{color:#b9cab6;font-variant-numeric:tabular-nums;text-align:right}
.past-ranking .past-avatar{box-shadow:0 0 0 2px #ffffff30}
.past-rank-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.past-bar{height:6px;border-radius:6px;background:#ffffff1c;overflow:hidden}
.past-bar span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#d5ad68,#f2cf73)}
.past-rank-count{font-size:.74rem;color:#c9d8c4;font-variant-numeric:tabular-nums;white-space:nowrap;text-align:right}
.past-history{margin-top:26px}
.past-section-title{font-family:Georgia,serif;font-weight:400;font-size:1.3rem;letter-spacing:-.03em}
.past-day{margin-top:14px}
.past-day-title{display:flex;align-items:center;gap:10px;margin:0 0 9px;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:750}
.past-day-title:after{content:"";flex:1;height:1px;background:var(--line)}
.past-matches{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:12px}
.past-match{min-width:0;border:1px solid var(--line);border-radius:16px;background:#fffefa;padding:14px 14px 8px;box-shadow:0 4px 16px #173f350a}
.past-match header{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.past-match h4{margin:0;min-width:0;font-family:Georgia,serif;font-weight:400;font-size:1.2rem;letter-spacing:-.02em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.past-match header span{font-size:.72rem;color:var(--muted);white-space:nowrap}
.past-verdict{display:inline-flex;align-items:center;gap:6px;margin:8px 0 2px;padding:4px 10px;border-radius:99px;background:#f6e7b8;color:#5b4210;font-size:.78rem;font-weight:700;line-height:1.4}
.past-verdict span{color:#b8862b}
.past-verdict.stopped{background:#eeeee6;color:var(--muted);font-weight:600}
.past-standings{list-style:none;margin:6px 0 0;padding:0}
.past-standing{display:grid;grid-template-columns:24px minmax(0,1fr) auto;align-items:center;gap:10px;padding:7px 2px;border-top:1px solid #eceee4}
.past-standing:first-child{border-top:0}
.past-standing .past-rank{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;font-size:.7rem;font-weight:750;color:var(--muted);background:#f0f1e8}
.past-rank.medal-1{background:#f2cf73;color:#5b4210}
.past-rank.medal-2{background:#dfe3dc;color:#44524a}
.past-rank.medal-3{background:#ebcaa8;color:#6e4524}
.past-name{display:flex;align-items:center;gap:9px;min-width:0;font-size:.9rem}
.past-name>span:last-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.past-name small{display:block;font-size:.68rem;color:var(--muted);font-weight:500}
.past-standing.winner .past-name{font-weight:750}
.past-avatars{display:inline-flex}
.past-avatars .past-avatar+.past-avatar{margin-left:-8px}
.past-score{font-family:Georgia,serif;font-weight:400;font-size:1.15rem;font-variant-numeric:tabular-nums}
.past-score.text{font-family:inherit;font-size:.78rem;color:var(--muted);font-weight:600}
.past-score.over{color:var(--red)}
.past-standing.winner .past-score{color:#8a6414}
.past-match.stopped{background:#fbfaf5}
.past-match.stopped .past-standings{opacity:.82}
.past-more{display:flex;margin:16px auto 0}
.audience-mode .past-results{margin:24px auto 0;max-width:1100px}
@media (max-width:580px){
  .past-board{padding:18px 14px 14px}
  .past-podium{gap:6px}
  .past-avatar.large{width:52px;height:52px;font-size:1.25rem}
  .past-avatar.medium{width:42px;height:42px}
  .past-ranking li{grid-template-columns:16px auto minmax(0,1fr) auto;gap:8px}
  .past-ranking .past-bar{display:none}
  .past-matches{grid-template-columns:1fr}
  .past-rank-count{font-size:.68rem}
  .past-matches{grid-template-columns:1fr}
}

/* 3-patti on a portrait phone: header, table, the whole hand and the Show/Throw
   bar share one screen, so play never needs a scroll. Sizes follow the
   dynamic viewport height, which excludes the browser's own toolbars. */
@media (max-width:580px) and (orientation:portrait) {
  body.patti-mode.in-game{--patti-bar:96px;--patti-top:88px;--patti-card:clamp(70px,calc(16dvh - 4px),116px)}
  body.patti-mode.in-game .app-header{padding-top:max(6px,env(safe-area-inset-top));padding-bottom:6px;min-height:0}
  body.patti-mode.in-game .back-to-games{min-height:40px;padding:6px 12px;font-size:.9rem}
  body.patti-mode.in-game .header-actions .icon-button{width:40px;height:40px;min-height:40px}
  body.patti-mode.in-game .game-container{padding-top:4px;padding-bottom:calc(var(--patti-bar) + env(safe-area-inset-bottom))}
  body.patti-mode.in-game .table-heading{margin:0 2px 4px;min-height:0}
  body.patti-mode.in-game .table-heading h1{font-size:.95rem;line-height:1.2}
  body.patti-mode.in-game .game-surface{display:flex;flex-direction:column;min-height:0;padding:6px 6px 8px;
    height:clamp(230px,calc(100dvh - var(--patti-top) - var(--patti-bar) - var(--patti-card) * 1.42 - 58px - env(safe-area-inset-bottom)),470px)}
  body.patti-mode.in-game .game-surface .surface-top{flex:0 0 auto;margin:0 0 2px;min-height:0}
  body.patti-mode.in-game .game-surface .turn-indicator{padding:3px 10px;font-size:.78rem}
  body.patti-mode.in-game .game-surface .table-orbit{flex:1 1 auto;height:auto;min-height:0;margin:0;--seat-width:78px;--seat-height:52px}
  body.patti-mode.in-game .game-surface .table-orbit:before{inset:22px 26px}
  body.patti-mode.in-game .table-orbit .seat-circle .player-seat{padding:4px 6px;border-radius:11px}
  body.patti-mode.in-game .table-orbit .seat-circle .player-seat .name{font-size:.76rem}
  body.patti-mode.in-game .table-orbit:is([data-seat-count="6"],[data-seat-count="7"],[data-seat-count="8"],[data-seat-count="9"],[data-seat-count="10"]){--seat-width:70px;--seat-height:38px}
  body.patti-mode.in-game .table-orbit:is([data-seat-count="6"],[data-seat-count="7"],[data-seat-count="8"],[data-seat-count="9"],[data-seat-count="10"]) .player-seat .seat-meta{display:none}
  body.patti-mode.in-game .table-orbit:is([data-seat-count="6"],[data-seat-count="7"],[data-seat-count="8"],[data-seat-count="9"],[data-seat-count="10"]) .player-seat{padding:3px 5px}
  body.patti-mode.in-game .table-orbit:is([data-seat-count="6"],[data-seat-count="7"],[data-seat-count="8"],[data-seat-count="9"],[data-seat-count="10"]) .player-seat .name{font-size:.72rem;-webkit-line-clamp:1}
  body.patti-mode.in-game .table-orbit .physical-piles{--pile-width:clamp(46px,calc(9dvh - 6px),66px);--pile-height:calc(var(--pile-width) * 1.43);--stack-step:calc(var(--pile-width) * .22);--stack-spread:calc(var(--pile-width) * .66);flex-direction:row;align-items:flex-start;gap:12px;width:max-content}
  body.patti-mode.in-game .physical-piles .pile-caption{font-size:.62rem;gap:2px}
  body.patti-mode.in-game .physical-piles .pile-label{font-size:.6rem}
  body.patti-mode.in-game .physical-piles .pile-caption{min-height:0}
  body.patti-mode.in-game .hand-area{padding:6px 8px 4px}
  body.patti-mode.in-game .hand-area .hand-title{min-height:0;margin:0}
  body.patti-mode.in-game .hand-cards{--hand-card-width:var(--patti-card);--hand-card-height:calc(var(--patti-card) * 1.42)}
  body.patti-mode.in-game .hand-fan{padding:20px 12px 6px}
  body.patti-mode.in-game .hand-fan .card-corner{font-size:calc(var(--patti-card) * .2);top:8%;left:9%}
  body.patti-mode.in-game .hand-fan .card-corner span+span{font-size:calc(var(--patti-card) * .16)}
  body.patti-mode.in-game .hand-fan .card-corner.bottom{top:auto;left:auto;right:9%;bottom:8%}
  body.patti-mode.in-game .hand-fan .card-center{font-size:calc(var(--patti-card) * .46)}
  body.patti-mode.in-game .move-controls{padding:8px 14px max(10px,env(safe-area-inset-bottom));gap:6px}
  body.patti-mode.in-game .move-controls .move-prompt{font-size:.78rem;margin:0 0 6px}
  body.patti-mode.in-game .move-controls .btn{min-height:46px}
}

/* Short portrait screens, such as an iPhone SE with Safari's toolbars showing:
   smaller cards, a shorter table and name-only seats keep everything on one screen. */
@media (max-width:580px) and (orientation:portrait) and (max-height:620px) {
  body.patti-mode.in-game{--patti-bar:90px;--patti-top:82px;--patti-card:clamp(60px,calc(14dvh - 4px),84px)}
  body.patti-mode.in-game .game-surface{height:clamp(186px,calc(100dvh - var(--patti-top) - var(--patti-bar) - var(--patti-card) * 1.42 - 52px - env(safe-area-inset-bottom)),470px)}
  body.patti-mode.in-game .table-orbit{--seat-width:70px;--seat-height:36px}
  body.patti-mode.in-game .table-orbit .player-seat .seat-meta{display:none}
  body.patti-mode.in-game .table-orbit .player-seat{padding:3px 5px}
  body.patti-mode.in-game .hand-fan{padding-top:14px}
  body.patti-mode.in-game .move-controls{padding-top:6px}
  body.patti-mode.in-game .move-controls .move-prompt{margin-bottom:4px}
  body.patti-mode.in-game .move-controls .btn{min-height:44px}
}
.sound-check{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:4px 2px 0}
.sound-check .btn{min-height:40px;padding:8px 14px}
.sound-check .hint{flex:1;min-width:150px}

/* Thurupu on a portrait phone: header, table, the whole hand and the bottom
   controls share one screen. Hand cards are sized so all eight fit without
   swiping; the table takes what is left, and the trick cards scale with it.
   --move-bar is the measured height of the bottom controls for this phase. */
@media (max-width:580px) and (orientation:portrait) {
  body.thurupu-mode.in-game{--thu-top:86px;--thu-bar:var(--move-bar,100px);
    --thu-card:clamp(56px,min(calc(14dvh - 6px),calc((100vw - 40px) / 4.3)),100px);
    --thu-hand:calc(var(--thu-card) * 1.35 + 44px);
    --thu-surface:clamp(236px,calc(100dvh - var(--thu-top) - var(--thu-bar) - var(--thu-hand) - env(safe-area-inset-bottom)),560px);
    --thu-seat:56px;--thu-circle:clamp(112px,calc(var(--thu-surface) - 84px - 2 * var(--thu-seat) - 6px),212px)}
  body.thurupu-mode.in-game .app-header{padding-top:max(6px,env(safe-area-inset-top));padding-bottom:6px;min-height:0}
  body.thurupu-mode.in-game .back-to-games{min-height:40px;padding:6px 12px;font-size:.9rem}
  body.thurupu-mode.in-game .header-actions .icon-button{width:40px;height:40px;min-height:40px}
  body.thurupu-mode.in-game .game-container{padding-top:4px;padding-bottom:calc(var(--thu-bar) + env(safe-area-inset-bottom))}
  body.thurupu-mode.in-game .table-heading{margin:0 2px 4px;min-height:0}
  body.thurupu-mode.in-game .table-heading h1{font-size:.95rem;line-height:1.2}
  body.thurupu-mode.in-game .game-surface.thurupu-surface{display:flex;flex-direction:column;height:var(--thu-surface);min-height:0;padding:6px 6px 4px}
  body.thurupu-mode.in-game .thurupu-surface .surface-top{position:relative;z-index:2;flex:0 0 auto;margin:0;min-height:0}
  body.thurupu-mode.in-game .thurupu-surface .turn-indicator{padding:3px 10px;font-size:.78rem}
  /* Team scores sit either side of the turn label; the contract line goes under it. */
  body.thurupu-mode.in-game .thurupu-surface .thurupu-score-strip{flex:0 0 auto;display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"a . b" "mid mid mid";grid-template-rows:30px auto;align-items:center;gap:0 6px;margin:-30px 2px 0;font-size:.72rem}
  body.thurupu-mode.in-game .thurupu-score-strip>span:first-child{grid-area:a;padding:2px 8px;gap:6px}
  body.thurupu-mode.in-game .thurupu-score-strip>span:nth-child(2){grid-area:mid;font-size:.66rem;line-height:1.3}
  body.thurupu-mode.in-game .thurupu-score-strip>span:last-child{grid-area:b;padding:2px 8px;gap:6px}
  body.thurupu-mode.in-game .thurupu-score-strip strong{font-size:.9rem}
  body.thurupu-mode.in-game .thurupu-surface .thurupu-orbit{flex:1 1 auto;height:auto;min-height:0;margin:0;--seat-width:86px;--seat-height:var(--thu-seat)}
  body.thurupu-mode.in-game .thurupu-orbit:before{inset:16px 30px}
  body.thurupu-mode.in-game .thurupu-orbit .seat-circle .player-seat{padding:4px 6px;gap:1px;border-radius:11px}
  body.thurupu-mode.in-game .thurupu-orbit .seat-circle .player-seat .name{display:block;max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:.78rem;line-height:16px;flex:0 0 auto}
  body.thurupu-mode.in-game .table-orbit .thurupu-center{gap:4px;width:auto}
  body.thurupu-mode.in-game .table-orbit .trick-circle{--trick-height:calc((var(--thu-circle) - 58px) / 2);--trick-width:calc(var(--trick-height) * .72);width:calc(var(--trick-width) * 3.15);height:var(--thu-circle)}
  body.thurupu-mode.in-game .table-orbit .trick-circle .trick-position>span{font-size:.6rem;height:14px}
  body.thurupu-mode.in-game .table-orbit .auction-board{width:150px;min-height:0;max-height:var(--thu-circle)}
  body.thurupu-mode.in-game .table-orbit .auction-board .phase-label{margin-bottom:4px}
  body.thurupu-mode.in-game .table-orbit .contract-display>strong{font-size:clamp(1.9rem,calc(var(--thu-circle) * .2),3.2rem)}
  body.thurupu-mode.in-game .table-orbit .auction-track{margin-top:8px}
  body.thurupu-mode.in-game .table-orbit .thurupu-center .trump-zone,body.thurupu-mode.in-game .thurupu-stock{top:4px}
  body.thurupu-mode.in-game .game-surface.thurupu-surface .trick-totals{bottom:5px}
  body.thurupu-mode.in-game .thurupu-hand{padding:6px 8px 4px}
  body.thurupu-mode.in-game .thurupu-hand .hand-title{min-height:0;margin:0}
  body.thurupu-mode.in-game .thurupu-hand .swipe-hint{display:none}
  body.thurupu-mode.in-game .thurupu-hand .hand-cards{--hand-card-width:var(--thu-card);--hand-card-height:calc(var(--thu-card) * 1.35);overflow:visible}
  body.thurupu-mode.in-game .thurupu-hand .hand-fan{padding:16px 6px 4px;justify-content:center;min-height:0}
  body.thurupu-mode.in-game .thurupu-hand .hand-fan .card-corner{font-size:calc(var(--thu-card) * .22);top:6%;left:8%}
  body.thurupu-mode.in-game .thurupu-hand .hand-fan .card-center{font-size:calc(var(--thu-card) * .44)}
  body.thurupu-mode.in-game .thurupu-controls{padding:8px 14px max(10px,env(safe-area-inset-bottom))}
  body.thurupu-mode.in-game .thurupu-controls .move-prompt{font-size:.76rem;margin:0 0 6px}
  body.thurupu-mode.in-game .thurupu-controls .btn{min-height:46px}
}
/* Short portrait screens: name-only seats give the trick more room. */
@media (max-width:580px) and (orientation:portrait) and (max-height:700px) {
  body.thurupu-mode.in-game{--thu-seat:40px;--thu-circle:clamp(90px,calc(var(--thu-surface) - 84px - 2 * var(--thu-seat) - 4px),212px)}
  body.thurupu-mode.in-game .thurupu-surface .thurupu-orbit{--seat-width:78px}
  body.thurupu-mode.in-game .table-orbit .trick-circle{--trick-height:calc((var(--thu-circle) - 12px) / 2)}
  body.thurupu-mode.in-game .table-orbit .trick-circle .trick-position>span{display:none}
  body.thurupu-mode.in-game .thurupu-orbit .seat-circle .player-seat .seat-meta{display:none}
  body.thurupu-mode.in-game .thurupu-orbit .seat-circle .player-seat{padding:3px 5px}
  body.thurupu-mode.in-game .table-orbit .auction-track{display:none}
  body.thurupu-mode.in-game .table-orbit .trump-card-slot .playing-card,body.thurupu-mode.in-game .table-orbit .trump-placeholder,body.thurupu-mode.in-game .thurupu-stock .playing-card{width:32px;height:45px;border-radius:5px}
  body.thurupu-mode.in-game .table-orbit .thurupu-center .trump-zone,body.thurupu-mode.in-game .thurupu-stock{top:0;gap:2px}
  body.thurupu-mode.in-game .table-orbit .trump-zone small{display:none}
}

/* Board games: the slim strip under or beside the board. In a narrow side
   panel (landscape phones, TV) its die and text stack instead of sitting side by side. */
.ludo-bar,.snakes-bar,.cb-bar{container-type:inline-size}
@container (max-width:340px){
  aside.ludo-bar .ludo-bar-main,aside.snakes-bar .snakes-bar-main,aside.cb-bar .cb-bar-main{grid-template-columns:minmax(0,1fr);justify-items:center;text-align:center}
  aside.ludo-bar .ludo-turn-prompt,aside.cb-bar .cb-turn-prompt{justify-content:center;text-align:center}
  aside.ludo-bar .ludo-bar-text,aside.snakes-bar .snakes-bar-text,aside.cb-bar .cb-bar-text{width:100%}
  aside.cb-bar .cb-throw-area{width:100%;max-width:220px}
}
/* Portrait phones: the board shrinks with the screen height so the strip stays in view. */
@media (max-width:580px) and (orientation:portrait) {
  body.chowkabara-mode.in-game .cb-board-stage{padding-top:44px;padding-bottom:44px;--cb-size:min(100%,470px,max(220px,calc(100dvh - 420px)))}
  body.ludo-mode.in-game .ludo-board{max-width:min(490px,max(240px,calc(100dvh - 250px)))}
  body.snake-ladder-mode.in-game .snakes-board{max-width:min(490px,max(240px,calc(100dvh - 260px)));margin-inline:auto}
}

/* Celebrations: confetti canvas, full-screen result moments and result cards (celebrate.js). */
.celebrate-canvas{position:fixed;inset:0;width:100vw;height:100dvh;pointer-events:none;z-index:46}
.celebrate-moment{position:fixed;inset:0;z-index:45;display:grid;place-items:center;padding:max(24px,env(safe-area-inset-top)) 20px max(24px,env(safe-area-inset-bottom));cursor:pointer;-webkit-tap-highlight-color:transparent;animation:moment-fade .3s ease-out both;overflow:hidden}
.celebrate-moment.leaving{animation:moment-leave .26s ease-in both}
.moment-backdrop{position:absolute;inset:0;background:radial-gradient(circle at 50% 38%,#2f735aee,#0d2a20f5 68%);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}
.celebrate-moment.lose .moment-backdrop{background:radial-gradient(circle at 50% 38%,#48626aeb,#16252af5 70%)}
.moment-stage{position:relative;display:grid;justify-items:center;gap:9px;width:min(380px,100%);text-align:center;color:#fff7e2}
.moment-rays{position:absolute;top:-148px;left:50%;width:560px;height:560px;margin-left:-280px;border-radius:50%;background:repeating-conic-gradient(from 0deg,#ffe3955c 0deg 8deg,transparent 8deg 22.5deg);-webkit-mask:radial-gradient(circle,#000 14%,transparent 58%);mask:radial-gradient(circle,#000 14%,transparent 58%);animation:moment-rays 22s linear infinite,moment-fade .9s .15s ease-out both;pointer-events:none}
.moment-glow{position:absolute;top:-10px;left:50%;width:220px;height:220px;margin-left:-110px;border-radius:50%;background:radial-gradient(circle,#ffe4a080,transparent 65%);animation:moment-breathe 2.4s ease-in-out infinite;pointer-events:none}
.moment-icon{position:relative;width:132px;height:132px;margin-bottom:4px;animation:moment-pop .75s cubic-bezier(.2,.9,.3,1.25) both}
.moment-icon svg{width:100%;height:100%;overflow:visible;filter:drop-shadow(0 10px 18px #0b221a66)}
.celebrate-moment.win .moment-trophy{animation:moment-float 3s 1s ease-in-out infinite}
.moment-cloud{animation:moment-sway 2.8s .8s ease-in-out infinite}
.moment-drop{animation:moment-rain 1.25s ease-in infinite;opacity:0}.moment-drop.late{animation-delay:.4s}.moment-drop.later{animation-delay:.8s}
.moment-eyebrow{font-size:.7rem;font-weight:750;letter-spacing:.2em;text-transform:uppercase;color:#f3cf7b;animation:moment-rise .5s .25s ease-out both}
.celebrate-moment.lose .moment-eyebrow{color:#bcd9de}
.moment-title{font-family:Georgia,"Times New Roman",serif;font-size:clamp(2.3rem,10vw,3.5rem);line-height:1.02;letter-spacing:-.04em;color:#fffaf0;text-shadow:0 2px 0 #0b241b55,0 0 28px #ffd77a55;animation:moment-title .6s .3s cubic-bezier(.2,.9,.3,1.2) both;overflow-wrap:anywhere}
.celebrate-moment.lose .moment-title{text-shadow:0 2px 0 #0f1d2155;font-size:clamp(2rem,8.5vw,3rem)}
.moment-subtitle{font-size:.98rem;line-height:1.5;color:#f4ecd6;opacity:.9;animation:moment-rise .5s .45s ease-out both}
.moment-people{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:6px;animation:moment-rise .5s .55s ease-out both}
.moment-person{display:inline-flex;align-items:center;gap:8px;padding:5px 14px 5px 5px;border-radius:999px;background:#ffffff1c;border:1px solid #ffffff2e;font-weight:650;font-size:.92rem;color:#fff8e6}
.moment-person-dot{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--person);color:#fff;font-size:.8rem;font-weight:800;box-shadow:0 0 0 2px #fff6e0cc}
.moment-places{list-style:none;margin:8px 0 0;padding:10px 14px;display:grid;gap:5px;min-width:210px;border-radius:14px;background:#0b231a55;border:1px solid #ffffff1f;text-align:left;font-size:.86rem;animation:moment-rise .5s .65s ease-out both}
.moment-places li{display:flex;gap:12px;align-items:baseline}.moment-place{min-width:34px;font-weight:800;color:#f3cf7b}
.moment-hint{margin-top:14px;font-size:.66rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#fff7e2;opacity:0;animation:moment-hint 2.4s 1.6s ease-in-out infinite}
.celebrate-card{position:fixed;left:50%;top:calc(env(safe-area-inset-top) + 70px);z-index:44;display:flex;align-items:center;gap:12px;width:max-content;max-width:calc(100vw - 28px);padding:11px 20px 11px 12px;border-radius:20px;background:#fff8e4f5;color:#1b3a2e;border:1px solid #e7d39b;box-shadow:0 14px 44px #0b261c45,0 2px 0 #fff inset;pointer-events:none;transform:translateX(-50%);animation:card-drop .55s cubic-bezier(.2,.9,.3,1.3) both}
.celebrate-card.leaving{animation:card-lift .26s ease-in both}
.celebrate-card.lose{background:#eef2f1f5;border-color:#c9d6d6;color:#2b4146}
.celebrate-card-icon{display:grid;place-items:center;flex:0 0 auto;width:42px;height:42px;border-radius:14px;background:linear-gradient(145deg,#f7d57f,#dca043);color:#fff;font-size:1.35rem;box-shadow:0 3px 8px #b8862e55;animation:card-icon .8s .15s ease-out both}
.celebrate-card.lose .celebrate-card-icon{background:linear-gradient(145deg,#a7c3c9,#6d8e96);box-shadow:0 3px 8px #4b6a7244}
.celebrate-card.info .celebrate-card-icon{background:linear-gradient(145deg,#8fd1c4,#3f9a88)}
.celebrate-card-text{display:grid;gap:1px;min-width:0}.celebrate-card-text strong{font-family:Georgia,serif;font-weight:400;font-size:1.3rem;letter-spacing:-.03em;line-height:1.15}.celebrate-card-text small{font-size:.76rem;color:#5d6b63;line-height:1.35}
.in-game .celebrate-card{top:calc(env(safe-area-inset-top) + 56px)}
@keyframes moment-fade{from{opacity:0}to{opacity:1}}
@keyframes moment-leave{to{opacity:0;transform:scale(1.03)}}
@keyframes moment-rays{to{transform:rotate(360deg)}}
@keyframes moment-breathe{0%,100%{transform:scale(.92);opacity:.75}50%{transform:scale(1.08);opacity:1}}
@keyframes moment-pop{0%{transform:scale(.15) rotate(-20deg);opacity:0}55%{transform:scale(1.15) rotate(6deg);opacity:1}78%{transform:scale(.95) rotate(-2deg)}100%{transform:scale(1) rotate(0)}}
@keyframes moment-float{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-7px) rotate(2deg)}}
@keyframes moment-sway{0%,100%{transform:translateX(-4px)}50%{transform:translateX(4px)}}
@keyframes moment-rain{0%{transform:translateY(-6px);opacity:0}20%{opacity:1}100%{transform:translateY(22px);opacity:0}}
@keyframes moment-rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes moment-title{0%{opacity:0;transform:translateY(18px) scale(.86)}100%{opacity:1;transform:translateY(0) scale(1)}}
@keyframes moment-hint{0%,100%{opacity:.35}50%{opacity:.8}}
@keyframes card-drop{0%{opacity:0;transform:translate(-50%,-26px) scale(.9)}100%{opacity:1;transform:translate(-50%,0) scale(1)}}
@keyframes card-lift{to{opacity:0;transform:translate(-50%,-16px) scale(.96)}}
@keyframes card-icon{0%{transform:scale(.4) rotate(-30deg)}60%{transform:scale(1.18) rotate(8deg)}100%{transform:scale(1) rotate(0)}}
@media(prefers-reduced-motion:reduce){.celebrate-canvas,.celebrate-moment,.celebrate-card{display:none}}
.animations-off .celebrate-canvas,.animations-off .celebrate-moment,.animations-off .celebrate-card{display:none}

/* App feel: no grey tap flash or page bounce, and buttons that press in. */
html{-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{overscroll-behavior-y:none}
button{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.btn,.icon-button,.text-button{transition:background .15s,transform .15s,scale .12s ease-out}
.btn:active:not(:disabled),.text-button:active:not(:disabled){scale:.96}
.icon-button:active:not(:disabled){scale:.9}
@media(hover:none){.btn:hover:not(:disabled){transform:none}}
@media(min-width:900px) and (min-height:700px){.moment-stage{width:min(560px,100%);gap:12px}.moment-icon{width:176px;height:176px}.moment-rays{top:-130px;width:720px;height:720px;margin-left:-360px}.moment-glow{top:0;width:280px;height:280px;margin-left:-140px}.moment-title{font-size:4.6rem}.moment-subtitle{font-size:1.2rem}.moment-person{font-size:1.1rem;padding:6px 18px 6px 6px}.moment-person-dot{width:34px;height:34px}.moment-places{font-size:1rem;min-width:280px}.celebrate-card-text strong{font-size:1.55rem}}
.sound-credits{font-size:.68rem;line-height:1.5;margin-top:4px}

/* The X that clears a chosen piece so another can be picked (Ludo, Chowkabara). */
.board-deselect{display:grid;place-items:center;width:28px;height:28px;min-height:0;min-width:0;padding:0;border-radius:50%;border:2px solid #fffaf0;background:#203a32;color:#fffaf0;font-size:19px;font-weight:700;line-height:1;box-shadow:0 3px 8px #0b221a59;cursor:pointer;animation:deselect-in .22s cubic-bezier(.2,.9,.3,1.4) both}
.board-deselect>span{margin-top:-2px}
.board-deselect::before{content:"";position:absolute;inset:-9px;border-radius:50%}
.board-deselect:active{scale:.9}
@keyframes deselect-in{from{opacity:0;transform:scale(.4)}to{opacity:1}}

/* End of a match: the host's Play again / Close table bar stays on screen. */
.match-end-bar{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;justify-content:center;padding:0 12px calc(12px + env(safe-area-inset-bottom));pointer-events:none;animation:end-bar-in .45s .2s cubic-bezier(.2,.9,.3,1.15) both}
.match-end-inner{pointer-events:auto;width:min(560px,100%);display:grid;gap:9px;padding:13px 14px 14px;border-radius:20px;background:linear-gradient(160deg,#2a5f4c,#173f35);color:#fff8e6;box-shadow:0 18px 44px #0b261c52,0 1px 0 #ffffff30 inset;border:1px solid #0f2d23}
.match-end-label{font-size:.78rem;font-weight:700;letter-spacing:.02em;color:#f3d892;text-align:center}
.match-end-actions{display:flex;gap:10px}
.match-end-actions .btn{flex:1;min-height:50px;font-size:1rem;border-radius:14px}
.match-end-actions .match-again{background:#f3cf7b;color:#1b3a2e;border-color:#e0b458;box-shadow:0 3px 0 #b88b36}
.match-end-actions .match-again:hover:not(:disabled){background:#f7da90}
.match-end-actions .match-close{background:transparent;color:#fff8e6;border:1.5px solid #fff8e699}
.match-end-actions .match-close:hover:not(:disabled){background:#ffffff14}
.match-end-wait{flex:1;text-align:center;font-size:.88rem;line-height:1.45;color:#fff8e6}
body.has-end-bar .main-container{padding-bottom:calc(128px + env(safe-area-inset-bottom))}
@keyframes end-bar-in{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.match-end-bar{animation:none}}

/* Seats around a card table: a name pill over a small fan of face-down cards,
   one per card held (3-patti and Thurupu). */
.table-orbit.table-orbit .seat-circle .player-seat.seat-fanned.seat-fanned{--mini-w:clamp(11px,calc((var(--seat-height) - 20px) / 1.45),24px);background:none;border:0;box-shadow:none;padding:0;gap:4px;border-radius:0;justify-content:center;overflow:visible;animation:none}
.table-orbit.table-orbit .seat-circle .player-seat.seat-fanned.seat-fanned .name{position:relative;display:inline-flex;align-items:center;gap:5px;max-width:calc(var(--seat-width) + 16px);margin:0;padding:2px 9px 2px 7px;border-radius:999px;background:#0a2f27e0;color:#fff8e6;border:1px solid #ffffff2e;box-shadow:0 2px 7px #03201a52;font-size:.74rem;line-height:1.35;font-weight:750;white-space:nowrap;-webkit-line-clamp:unset;overflow:visible;flex:0 0 auto;transition:background .2s,color .2s}
.table-orbit .seat-circle .player-seat.seat-fanned .seat-name{min-width:0;overflow:hidden;text-overflow:ellipsis}
.table-orbit .seat-circle .player-seat.seat-fanned .name .status-dot{display:inline-block;flex:0 0 auto;width:6px;height:6px}
.table-orbit .seat-circle .player-seat.seat-fanned .seat-team{display:grid;place-items:center;flex:0 0 auto;width:15px;height:15px;border-radius:50%;background:#b7dbae;color:#173f35;font-size:.58rem;font-weight:850;line-height:1}
.table-orbit .seat-circle .player-seat.seat-fanned.team-b .seat-team{background:#f3c99b}
.table-orbit.table-orbit .seat-circle .player-seat.seat-fanned.seat-fanned.you .name{background:#f6ecd0;color:#173f35;border-color:#fffaf0}
.table-orbit.table-orbit .seat-circle .player-seat.seat-fanned.seat-fanned.active .name{background:#f3cf7b;color:#1b3a2e;border-color:#fff3c4;box-shadow:0 0 0 3px #f3cf7b5c,0 3px 10px #1b3a2e45}
.table-orbit .seat-circle .player-seat.seat-fanned.away .name{opacity:.72}
.table-orbit .seat-circle .player-seat.seat-fanned.away .seat-fan{opacity:.5}
.table-orbit .seat-circle .player-seat.seat-fanned .dealer-token{right:-9px;top:-9px;width:17px;height:17px;font-size:9px}
.seat-fan{--fan-step:.55;--fan-turn:7deg;position:relative;display:block;flex:0 0 auto;width:calc(var(--mini-w) * (1 + (var(--n) - 1) * var(--fan-step)));min-width:var(--mini-w);height:calc(var(--mini-w) * 1.42);margin-top:1px}
.seat-fan[data-count="0"]{visibility:hidden}
.seat-fan:is([data-count="5"],[data-count="6"],[data-count="7"],[data-count="8"],[data-count="9"],[data-count="10"]){--fan-step:.32;--fan-turn:5deg}
.seat-fan i{position:absolute;bottom:0;left:calc(var(--i) * var(--mini-w) * var(--fan-step));width:var(--mini-w);height:calc(var(--mini-w) * 1.42);border-radius:calc(var(--mini-w) * .16);background-color:#839276;background-image:repeating-linear-gradient(45deg,transparent 0 2px,#ffffff2b 2px 3px),repeating-linear-gradient(-45deg,transparent 0 2px,#ffffff1c 2px 3px);border:1.5px solid #f3ecd4;box-shadow:0 1px 2px #0b221a66;transform-origin:50% 135%;rotate:calc((var(--i) - (var(--n) - 1) / 2) * var(--fan-turn));transition:rotate .25s ease-out,left .25s ease-out}
.patti-mode .seat-fan i{background-color:#2f6f78}
.table-orbit .seat-circle .player-seat.seat-fanned.active .seat-fan i{border-color:#fff3c4;box-shadow:0 0 0 1px #f3cf7b,0 2px 5px #0b221a66}
.turn-pulse .table-orbit .seat-circle .player-seat.seat-fanned.active .name{animation:seat-pill-glow 2.6s ease-in-out 3.5 forwards}
@keyframes seat-pill-glow{0%,100%{box-shadow:0 0 0 3px #f3cf7b40,0 3px 10px #1b3a2e45}50%{box-shadow:0 0 0 6px #f3cf7b70,0 3px 14px #1b3a2e45}}
.audience-board .table-orbit.table-orbit .seat-circle .player-seat.seat-fanned.seat-fanned .name{font-size:1rem;padding:3px 12px 3px 9px}
.audience-board .table-orbit .seat-circle .player-seat.seat-fanned .name .status-dot{width:8px;height:8px}
.audience-board .table-orbit .seat-circle .player-seat.seat-fanned .seat-team{width:19px;height:19px;font-size:.7rem}
@media(prefers-reduced-motion:reduce){.turn-pulse .table-orbit .seat-circle .player-seat.seat-fanned.active .name{animation:none}}
.table-orbit.table-orbit .seat-circle .player-seat.seat-fanned .dealer-token{position:static;flex:0 0 auto;width:15px;height:15px;margin:0 -3px 0 1px;font-size:8px;box-shadow:none;border-color:#fff8dc}
.audience-board .table-orbit.table-orbit .seat-circle .player-seat.seat-fanned .dealer-token{width:19px;height:19px;font-size:10px}
.audience-board .table-orbit.table-orbit .seat-circle .player-seat.seat-fanned.seat-fanned{--mini-w:clamp(16px,calc((var(--seat-height) - 22px) / 1.4),34px);gap:6px}
.audience-board .table-orbit.table-orbit .seat-circle .player-seat.seat-fanned.seat-fanned .name{font-size:1.15rem;padding:4px 14px 4px 10px}

/* Rearranging your hand: press and hold a card, then drag it. */
/* Cards you cannot play now stay touchable (for rearranging) but do not lift or press. */
.hand-fan .card-button[aria-disabled="true"]{cursor:default}
.hand-fan .card-button[aria-disabled="true"]:not(.selected):hover{transform:translateY(var(--fan-offset)) rotate(var(--fan-angle))}
.hand-fan .card-button[aria-disabled="true"]:active{scale:1}
.hand-fan.reordering .card-button:not(.card-lifted){translate:var(--shift-x,0px) 0;transition:translate .16s ease-out}
.hand-fan .card-button.card-lifted{translate:var(--drag-x,0px) calc(var(--drag-y,0px) - 16px);scale:1.08;z-index:40;filter:drop-shadow(0 12px 14px #0b221a59);cursor:grabbing;transition:scale .14s ease-out}
.hand-fan .card-button.card-lifted .playing-card{outline:2px solid #f3cf7b;outline-offset:1px}
/* Thurupu: one hidden trump card, the suit after the reveal, the winning card and won-trick stacks. */
.trump-single .playing-card.back{box-shadow:0 3px 7px #0b221a55}
.trump-suit-slot{display:grid;place-items:center}
.trump-suit-mark{--suit-size:62px;display:grid;place-items:center;width:var(--suit-size);height:var(--suit-size);border-radius:50%;background:#fffdf5;border:2px solid #e4dbbd;box-shadow:0 3px 9px #0b221a59;font-family:Georgia,serif;font-size:calc(var(--suit-size) * .62);line-height:1;color:#253c33}
.trump-suit-mark.red{color:var(--red)}
.table-orbit .trump-suit-mark{--suit-size:46px}
.audience-board .trump-suit-mark,.audience-board .table-orbit .trump-suit-mark{--suit-size:88px}
.trump-revealing .playing-card{outline:3px solid #f3cf7b;outline-offset:2px;box-shadow:0 0 0 7px #f3cf7b3d,0 4px 12px #0b221a66;animation:trump-reveal .45s ease-out both}
.trump-revealing .trump-label,.trump-open .trump-label{color:#f6e3ad;font-weight:700}
@keyframes trump-reveal{from{transform:rotateY(90deg) scale(.92)}to{transform:none}}
.trick-position.trick-winner .playing-card{outline:3px solid #f3cf7b;outline-offset:2px;box-shadow:0 0 0 7px #f3cf7b36,0 5px 12px #0b221a55}
.seat-hand{position:relative;display:flex;justify-content:center;flex:0 0 auto}
.seat-tricks{--t-w:calc(var(--mini-w, 20px) * .9);--t-step:calc(var(--t-w) * .3);position:absolute;left:calc(100% + 5px);bottom:0;width:calc(var(--t-w) * 1.1 + max(0, var(--n) - 1) * var(--t-step));min-width:calc(var(--t-w) * 1.1);height:calc(var(--t-w) * 1.1 + 6px);pointer-events:none;visibility:visible}
.seat-tricks[data-count="0"]{opacity:0}
.seat-tricks i{position:absolute;bottom:calc(var(--i) * 1px);left:calc(var(--i) * var(--t-step));width:calc(var(--t-w) * 1.1);height:calc(var(--t-w) * 1.1);border-radius:calc(var(--t-w) * .16);background-color:#6f8066;background-image:repeating-linear-gradient(45deg,transparent 0 2px,#ffffff26 2px 3px);border:1.5px solid #f3ecd4;box-shadow:1px 1px 0 #d9d3bb,2px 2px 0 #f3ecd4,0 2px 3px #0b221a66;rotate:-8deg}
/* The top seat's played card sits to its right, and the right seat is at the edge: their stacks go left. */
.player-seat:is([data-seat-angle="180"],[data-seat-angle="270"]) .seat-tricks{left:auto;right:calc(100% + 5px)}
.player-seat:is([data-seat-angle="180"],[data-seat-angle="270"]) .seat-tricks i{left:auto;right:calc(var(--i) * var(--t-step));rotate:8deg}
/* Top and bottom seats have room for a longer name beside the team and dealer marks. */
.thurupu-orbit.table-orbit.table-orbit .seat-circle .player-seat.seat-fanned.seat-fanned:is([data-seat-angle="0"],[data-seat-angle="180"]) .name{max-width:calc(var(--seat-width) + 64px)}
@media(prefers-reduced-motion:reduce){.trump-revealing .playing-card{animation:none}}
.simple-thurupu-tile .game-tile-art{background:radial-gradient(ellipse at 75% 20%,#8a6a3a55,transparent 62%),linear-gradient(145deg,#2f4a5c,#23372d)}
.trump-card-slot .card-back-symbol,.thurupu-stock .card-back-symbol{inset:6px;font-size:1.6rem}
.table-orbit .trump-card-slot .card-back-symbol,.table-orbit .thurupu-stock .card-back-symbol{inset:4px;font-size:1.05rem}
@media(min-width:581px){.audience-board .table-orbit .trump-card-slot .card-back-symbol,.audience-board .table-orbit .thurupu-stock .card-back-symbol{inset:8px;font-size:2rem}}
/* Player faces: cartoon caricatures drawn from each player's ID (faces.js). */
.gh-face{--face:22px;display:inline-block;flex:0 0 auto;width:var(--face);height:var(--face);vertical-align:middle;transform-origin:50% 92%;line-height:0}
.gh-face svg{display:block;width:100%;height:100%;overflow:visible}
.gh-face .m-alt{display:none}
.gh-face.mood-grin .m-grin,.gh-face.mood-pout .m-pout,.gh-face.mood-wow .m-wow,.gh-face.mood-smug .m-smug{display:inline}
.gh-face:is(.mood-grin,.mood-pout,.mood-wow,.mood-smug) .m-base{display:none}
.gh-face .face-eyes,.gh-face .face-brow{transform-box:fill-box;transform-origin:center}
.away .gh-face,.table-orbit .seat-circle .player-seat.seat-fanned.away .name .gh-face{filter:grayscale(.9);opacity:.8}
.faces-live .gh-face.blinking .face-eyes{animation:face-blink .26s ease-in-out}
.faces-live .gh-face.react-nod{animation:face-nod .75s ease-in-out}
.faces-live .gh-face.react-shake{animation:face-shake .85s ease-in-out}
.faces-live .gh-face.react-bounce{animation:face-bounce .95s cubic-bezier(.3,1.6,.5,1)}
.faces-live .gh-face.react-tilt{animation:face-tilt 1.1s ease-in-out}
.faces-live .gh-face.react-jiggle{animation:face-jiggle .7s linear}
.faces-live .gh-face.react-brow{animation:face-pop 1.2s ease-out}
.faces-live .gh-face.react-brow .face-brow,.faces-live .gh-face.mood-wow .face-brow{animation:face-brow 1.2s ease-in-out}
.faces-live .gh-face.react-brow .face-eyes{animation:face-stare 1.2s ease-in-out}
@keyframes face-blink{0%,100%{transform:none}50%{transform:scaleY(.12)}}
@keyframes face-nod{0%,100%{transform:none}25%{transform:translateY(2px) rotate(-4deg)}50%{transform:translateY(-1px)}75%{transform:translateY(2px) rotate(3deg)}}
@keyframes face-shake{0%,100%{transform:none}15%{transform:rotate(-14deg)}35%{transform:rotate(12deg)}55%{transform:rotate(-9deg)}75%{transform:rotate(6deg)}}
@keyframes face-bounce{0%,100%{transform:none}20%{transform:translateY(1px) scale(1.06,.92)}45%{transform:translateY(-7px) scale(1.12)}70%{transform:translateY(1px) scale(1.04,.96)}}
@keyframes face-tilt{0%,100%{transform:none}25%,70%{transform:rotate(16deg) translateX(1px)}}
@keyframes face-jiggle{0%,100%{transform:none}20%{transform:rotate(-6deg) scale(1.04)}40%{transform:rotate(6deg)}60%{transform:rotate(-4deg) scale(1.03)}80%{transform:rotate(3deg)}}
@keyframes face-pop{0%,100%{transform:none}20%,70%{transform:scale(1.14)}}
@keyframes face-brow{0%,100%{transform:none}18%,72%{transform:translateY(-3.2px)}}
@keyframes face-stare{0%,100%{transform:none}18%,72%{transform:scale(1.18)}}
@media(prefers-reduced-motion:reduce){.faces-live .gh-face,.faces-live .gh-face *{animation:none!important}}
.avatar.avatar-face{background:none;overflow:visible}
.avatar-face .gh-face{--face:40px}
.audience-waiting-seat .avatar-face .gh-face{--face:46px}
.table-orbit .seat-circle .player-seat.seat-fanned .name .gh-face{--face:2.5em;margin:-.62em -.08em -.6em -.62em;filter:drop-shadow(0 1px 1px #0b221a59)}
.audience-board .table-orbit .seat-circle .player-seat.seat-fanned .name .gh-face{--face:2.7em}
.table-orbit .seat-circle .player-seat.seat-fanned .name{overflow:visible}
/* With a face, the Thurupu team letter rides on the face as a small badge. */
.table-orbit .seat-circle .player-seat.seat-fanned .face-badged{position:relative;display:inline-flex;flex:0 0 auto}
.table-orbit .seat-circle .player-seat.seat-fanned .face-badged .seat-team{position:absolute;right:-.15em;bottom:-.55em;width:1.15em;height:1.15em;font-size:.68em;border:1.5px solid #0a2f27;box-shadow:0 1px 2px #0005}
.audience-board .table-orbit .seat-circle .player-seat.seat-fanned .face-badged .seat-team{width:1.25em;height:1.25em}
/* 3-patti: the center cards always sit in front of the seat names. */
.table-orbit .physical-piles,.patti-orbit .physical-piles{z-index:4}
/* Pickup choice: the stack keeps its order, so the thrown cards stay on top.
   The previous top card sits just under them, lifted so it shows above them,
   with the same glow as the deck. The stack grows downward by the lift. */
.physical-piles.picking-cards{--lift:calc(var(--pile-height) * .4)}
.physical-piles.picking-cards .stack-layer{top:calc(4px + var(--lift))}
.physical-piles.picking-cards .stack-layer.stack-previous{top:4px}
.stack-previous .pile-pickup,.stack-previous .previous-stack-card{display:block;width:var(--pile-width);height:var(--pile-height)}
.stack-previous .previous-stack-card>.playing-card{outline:3px solid #f3f7df;outline-offset:3px;box-shadow:0 0 0 7px #f3f7df26,0 10px 20px #053b5044}
/* The pickup label sits right above the lifted card, with a small pointer down to it.
   It takes the place of the "Playing stack" heading while a pickup is pending. */
.stack-fan .stack-previous .stack-pick-label{top:auto;bottom:calc(100% + 9px);left:50%;transform:translateX(-50%);z-index:40;min-width:0;padding:6px 11px;margin:0;font:inherit;font-size:.83rem;font-weight:800;line-height:1.1;cursor:pointer;pointer-events:auto}
.stack-fan .stack-previous .stack-pick-label::after{content:"";position:absolute;left:50%;top:100%;transform:translateX(-50%);border:7px solid transparent;border-top-color:#ffe074;border-bottom:0}
.stack-fan .stack-previous .stack-pick-label.previous-label{cursor:default;pointer-events:none;font-size:.7rem;background:#e9f0d6;border-color:#f8ffe2}
.stack-fan .stack-previous .stack-pick-label.previous-label::after{border-top-color:#e9f0d6}
.physical-piles.picking-cards .playing-stack-group>.pile-label{visibility:hidden}
.physical-piles.picking-cards .stack-fan,.table-orbit .physical-piles.picking-cards .stack-fan{height:calc(var(--pile-height) + var(--lift) + 8px)}
@media(max-width:580px){.stack-fan .stack-previous .stack-pick-label{font-size:.69rem;padding:5px 8px}.stack-fan .stack-previous .stack-pick-label.previous-label{font-size:.58rem}}
/* Waiting room: the host drags players by the grip to set the order of play. */
.seat-order-tools{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:12px 0 4px}
.seat-order-tools .hint{margin:0}
.seat-order-note{margin-top:8px}
/* Bot seats: the host adds them before the match and removes them with a tap. */
.bot-tools{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:12px 0 4px}
.bot-tools-label{font-size:.7rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-right:2px}
.bot-chip{display:inline-flex;align-items:center;gap:7px;min-height:38px;padding:6px 8px 6px 12px;border:1px solid var(--line);border-radius:30px;background:#f6f6ef;color:var(--ink);font-size:.77rem;font-weight:650}
.bot-chip>span{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:#e4e9da;color:var(--muted);font-size:.9rem;line-height:1}
.bot-chip:hover:not(:disabled)>span{background:#f4d9cf;color:var(--coral)}
.inline-grip{display:inline-block;width:8px;height:12px;vertical-align:-1px;color:var(--muted)}
.seat-drag{flex:0 0 auto;display:grid;place-items:center;width:30px;min-height:40px;margin:-6px -4px -6px -8px;padding:0;border:0;border-radius:8px;background:transparent;color:#8a948b;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none}
.seat-drag svg{width:11px;height:17px}
.seat-drag:hover:not(:disabled){color:var(--green);background:#e8ede1}
.seat-drag:disabled{opacity:.4;cursor:default}
[data-order-id]{transition:box-shadow .15s,outline-color .15s}
[data-order-id].seat-dragging{position:relative;z-index:20;box-shadow:0 10px 26px #10302a40;cursor:grabbing;opacity:.95}
[data-order-id].seat-dragging .seat-drag{cursor:grabbing}
[data-order-id].seat-drop-target{outline:2px dashed #c79a3d;outline-offset:3px}
.ludo-player-mark.ludo-mark-face{background:none;overflow:visible}
.ludo-mark-face .gh-face{--face:34px}
.snakes-waiting-seat .gh-face{--face:30px}
.snakes-waiting-seats .snakes-waiting-seat{gap:7px;padding:12px 10px}
.snakes-seat-face{position:relative;display:inline-flex;flex-shrink:0}
.snakes-seat-face .snakes-player-dot{position:absolute;right:-4px;bottom:-3px;width:13px;height:13px}
.cb-waiting-seat .cb-seat-face .gh-face{--face:calc(100% + 8px)}
@media(prefers-reduced-motion:reduce){[data-order-id]{transition:none}}
/* 3-patti match end: players who reached the points limit, shown large. */
.limit-out{margin:18px 0 6px;padding:18px 20px 20px;border:2px solid #d98a76;border-radius:18px;background:linear-gradient(160deg,#fde9e2,#f9dcd2)}
.limit-out-heading{display:flex;align-items:baseline;justify-content:space-between;gap:10px 16px;flex-wrap:wrap}
.limit-out-title{font-family:Georgia,serif;font-weight:500;font-size:clamp(1.5rem,2.6vw,2.1rem);letter-spacing:-.03em;line-height:1.15;color:#922c22}
.limit-out-rule{font-size:.85rem;font-weight:750;color:#9b4a3c;white-space:nowrap}
.limit-out-players{display:flex;flex-wrap:wrap;gap:12px;margin-top:14px}
.limit-out-player{display:flex;align-items:center;gap:14px;flex:1 1 220px;min-width:0;padding:12px 18px 12px 12px;border:1px solid #eab3a4;border-radius:15px;background:#fff8f4;box-shadow:0 4px 14px #922c2214}
.limit-out-face{display:grid;place-items:center;flex-shrink:0;width:60px;height:60px;border-radius:50%;background:#f6d2c6;color:#922c22;font-weight:800;font-size:1.4rem}
.limit-out-face .gh-face{--face:60px}
.limit-out-player>div{display:grid;gap:2px;min-width:0}
.limit-out-name{font-size:clamp(1.45rem,2.6vw,2.05rem);font-weight:800;letter-spacing:-.02em;line-height:1.15;color:#7a1f16;overflow-wrap:anywhere}
.limit-out-you{font-size:.55em;font-weight:650;color:#9b4a3c}
.limit-out-score{font-size:1rem;font-weight:650;color:#9b4a3c}
.limit-out-score b{font-size:1.6rem;font-weight:800;color:#922c22;margin-right:3px}
.result-hand.limit-out-hand{border:2px solid #d98a76;background:#fff3ee}
.out-label{display:inline-block;margin-top:9px;margin-left:4px;padding:5px 9px;border-radius:20px;background:#922c22;color:#fff;font-size:.72rem;font-weight:750}
.audience-mode .limit-out{padding:24px 28px}
.audience-mode .limit-out-title{font-size:clamp(2rem,3vw,2.8rem)}
.audience-mode .limit-out-name{font-size:clamp(1.9rem,2.8vw,2.6rem)}
.audience-mode .limit-out-face,.audience-mode .limit-out-face .gh-face{width:76px;height:76px;--face:76px}
@media(max-width:580px){.limit-out{padding:14px 14px 16px}.limit-out-player{padding:10px 14px 10px 10px;gap:12px}.limit-out-face{width:52px;height:52px}.limit-out-face .gh-face{--face:52px}}
.moment-places li.moment-place-out{color:#ffd9cf;font-weight:750}
.moment-out-tag{margin-left:auto;padding:2px 9px;border-radius:12px;background:#c4473a;color:#fff;font-size:.78em;font-weight:800;letter-spacing:.03em}
.audience-mode .limit-out-rule{font-size:1.05rem}
/* Platformer test tile (owner only while the game is built) */
.platformer-tile{text-decoration:none}
.platformer-tile .game-tile-art{background:linear-gradient(#8fd3ff 0 66%,#6fd16a 66% 69%,#3f9c45 69% 72%,#9b5a2e 72%)}
.platformer-art{position:absolute;inset:0}
.platformer-art i{position:absolute;bottom:28%;width:22px;height:26px;border:3px solid #1d1a2b;border-radius:9px 9px 6px 6px;background:#e5484d}
.platformer-art i:nth-child(1){left:24%}
.platformer-art i:nth-child(2){left:42%;bottom:44%;background:#3e7be6}
.platformer-art i:nth-child(3){left:60%;background:#f2b632}
.platformer-art b{position:absolute;left:38%;top:20%;width:32px;height:32px;border:3px solid #6b4210;background:#e7a53c;box-shadow:inset 0 0 0 5px #f6c86a}
/* 3-patti table options on the create form. */
.patti-options{border:1px solid var(--line);border-radius:12px;padding:12px 14px 14px;margin:0;display:grid;gap:12px;min-width:0}
.patti-options legend{font-size:.78rem;font-weight:650;padding:0 4px}
.patti-sub-option{padding-left:32px}
.patti-sub-option:has(input:disabled){opacity:.55}
/* Audience home (2026-10-04): every open table first, then stats per game. */
.audience-home .audience-lobby-intro{display:flex;align-items:baseline;gap:22px;flex-wrap:wrap;padding-bottom:28px}
.audience-count{font-size:1rem;color:#bfd0be;margin:0}
.audience-table-status.waiting .status-dot{background:#c99b45}
.audience-game-name{font-size:.72rem;font-weight:750;letter-spacing:.08em;text-transform:uppercase;color:#54714f}
.audience-name-list small{font-size:.85em;opacity:.7;margin-left:2px}
.audience-stats{margin-top:52px}
.audience-stats-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px 24px;flex-wrap:wrap;margin-bottom:20px}
.audience-stats-head h2{font-size:clamp(1.8rem,2.6vw,2.6rem);margin:0}
.audience-stats-headline{margin:0;color:#d6e2cf;font-size:.95rem}
.audience-stats-headline strong{color:#f7f3e5}
.audience-stats-headline span{color:var(--gold)}
.audience-stats-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
.audience-stat-card{position:relative;display:grid;gap:6px;align-content:start;text-align:left;padding:18px 44px 18px 20px;min-height:104px;border:1px solid #bdd0b533;border-radius:18px;background:#17392f;color:#f7f3e5;font-family:inherit}
.audience-stat-card:hover{background:#1d4537;border-color:#bdd0b566}
.audience-stat-card:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.audience-stat-game{font-size:1.15rem;font-weight:750}
.audience-stat-count{font-size:.85rem;color:#bfd0be}
.audience-stat-leader{font-size:.85rem;color:#e9dcb4}
.audience-stat-leader span{color:var(--gold)}
.audience-stat-arrow{position:absolute;right:18px;top:18px;color:#bfd0be}
.audience-stat-card.empty{opacity:.6}
.audience-owner-tiles{margin-top:36px}
.audience-mode .library-settings-button{background:#17392f;color:#f1ecd9;border-color:#bdd0b555}
.audience-mode .library-settings-button:hover{background:#1d4537}
@media(max-width:580px){.audience-home .audience-lobby-intro{gap:6px 16px;padding-bottom:20px}.audience-count{font-size:.84rem}.audience-stats{margin-top:38px}.audience-stats-grid{grid-template-columns:1fr 1fr;gap:10px}.audience-stat-card{padding:14px 30px 14px 14px;min-height:92px;border-radius:14px}.audience-stat-game{font-size:.95rem}.audience-stat-count,.audience-stat-leader{font-size:.74rem}.audience-stat-arrow{right:12px;top:14px}.audience-stats-headline{font-size:.8rem}}
/* 3-patti: the dealer picks the joker and the open card from a circular spread
   of the face-down pile (owner request, 2026-10-05). The ring is the largest
   circle in the middle of the table that clears every seat (app.js sets --R);
   cards shrink to fit and to leave each card a tappable edge. Everything else
   on the table is unchanged. */
.pick-spread-area{position:absolute;inset:0;z-index:1;display:grid;place-items:center;pointer-events:none}
.pick-ring{--R:110px;--ch:clamp(24px,calc(var(--R) * .44),128px);--cw:min(calc(var(--ch) * .7),calc(6.2832 * (var(--R) - var(--ch) * .15) / var(--n) * 1.55));position:relative;width:calc(var(--R) * 2);height:calc(var(--R) * 2);border-radius:50%;pointer-events:auto}
.pick-ring .spread-card{position:absolute;left:50%;top:50%;display:block;width:var(--cw);height:var(--ch);min-height:0;margin:0;padding:0;border:0;background:none;border-radius:calc(var(--cw) * .14);transform:translate(-50%,-50%) rotate(calc(var(--i) * 360deg / var(--n))) translateY(calc(var(--ch) / 2 - var(--R)));transition:transform .32s ease;animation:spread-out .55s cubic-bezier(.2,.8,.25,1) both;animation-delay:calc(var(--i) * 9ms)}
.pick-ring .spread-card .playing-card{width:100%;height:100%;min-width:0;min-height:0;border-radius:inherit;border-width:max(1.5px,calc(var(--cw) * .06));box-shadow:0 1px 3px #00221d55}
.pick-ring .spread-card .card-back-symbol{inset:max(2px,calc(var(--cw) * .1));font-size:calc(var(--cw) * .45)}
@keyframes spread-out{from{transform:translate(-50%,-50%) rotate(0deg) translateY(0) scale(.85);opacity:.4}}
.pick-ring.can-pick .spread-card{cursor:pointer}
.pick-ring.can-pick .spread-card:focus-visible{transform:translate(-50%,-50%) rotate(calc(var(--i) * 360deg / var(--n))) translateY(calc(var(--ch) / 2 - var(--R) - var(--ch) * .14));outline:none}
.pick-ring.can-pick .spread-card:focus-visible .playing-card{box-shadow:0 0 0 2px #ffe58d,0 4px 10px #00221d66}
@media (hover:hover){.pick-ring.can-pick .spread-card:hover{transform:translate(-50%,-50%) rotate(calc(var(--i) * 360deg / var(--n))) translateY(calc(var(--ch) / 2 - var(--R) - var(--ch) * .14))}.pick-ring.can-pick .spread-card:hover .playing-card{box-shadow:0 0 0 2px #ffe58d,0 4px 10px #00221d66}}
.pick-ring .spread-card:disabled{opacity:1;cursor:default}
.pick-ring-center{position:absolute;inset:calc(var(--ch) + 4px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:4px;border-radius:50%;text-align:center;pointer-events:none}
.pick-ring-center .spread-prompt{max-width:100%;font-size:clamp(.6rem,calc(var(--R) * .075),.95rem);line-height:1.25;font-weight:650;color:#f4f1dc}
.pick-ring.can-pick .spread-prompt{color:#ffe58d}
.pick-ring-center .spread-joker{display:block;line-height:0}
.pick-ring-center .spread-joker .playing-card{width:clamp(28px,calc(var(--R) * .26),104px);height:calc(clamp(28px,calc(var(--R) * .26),104px) * 1.43);border-radius:clamp(4px,calc(var(--R) * .03),10px)}
.pick-ring-center .spread-joker .card-corner{font-size:clamp(.55rem,calc(var(--R) * .06),1.2rem);left:clamp(3px,calc(var(--R) * .02),8px);top:clamp(3px,calc(var(--R) * .02),7px)}
.pick-ring-center .spread-joker .card-corner.bottom{left:auto;top:auto;right:clamp(3px,calc(var(--R) * .02),8px);bottom:clamp(3px,calc(var(--R) * .02),7px)}
.pick-ring-center .spread-joker .card-center{font-size:clamp(.9rem,calc(var(--R) * .12),2.7rem)}
.pick-ring-center .spread-joker-caption{font-size:clamp(.56rem,calc(var(--R) * .065),.85rem);font-weight:650;color:#e5e8d9}
@media (prefers-reduced-motion:reduce){.pick-ring .spread-card{animation:none;transition:none}}