@charset "UTF-8";
:root{color-scheme:light;--ink:#173f3b;--muted:#627b75;--mint:#e0f3eb;--teal:#08796e;--gold:#f2cf72;--line:#cfded7;--paper:#fffefa;--shadow:0 10px 34px #164c3910;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:16px;line-height:1.5;color:var(--ink);background:#f3f9f4}
*{box-sizing:border-box}body{margin:0;min-width:280px;background:radial-gradient(ellipse at 90% 0%,#f6edcf80,transparent 60%),#f3f9f4}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:default;opacity:.48}a{color:var(--teal)}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #c99829;outline-offset:4px}h1,h2,h3,p{margin-top:0}h2{font-size:1.45rem;line-height:1.25;margin-bottom:8px}h3{font-size:1.08rem}p{margin-bottom:12px}button{color:inherit}input,select{width:100%;min-width:0;min-height:48px;padding:11px 13px;border:1px solid var(--line);border-radius:13px;color:var(--ink);background:white}label{font-weight:650;font-size:.91rem;display:grid;gap:6px}form{display:grid;gap:15px}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip{position:fixed;top:-100px;z-index:100;background:white;padding:10px}.skip:focus{top:0}.topbar{height:74px;padding:10px max(20px,env(safe-area-inset-right)) 10px max(20px,env(safe-area-inset-left));display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid #dce8df;background:#f7fbf7ee}.brand{text-decoration:none;font-size:1.55rem;letter-spacing:-1.3px;font-weight:850;color:var(--teal);white-space:nowrap}.brand span{font-size:.8rem;font-weight:650;letter-spacing:0;color:var(--muted)}.toolbar{display:flex;align-items:center;gap:10px}.connection{color:var(--muted);font-size:.72rem;padding:4px 9px;border-radius:20px;background:#e3eee8;white-space:nowrap}.connection.online{background:#cdf0d8;color:#135331}.button,.icon-button,.small-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;border-radius:13px;text-decoration:none;font-weight:750;min-height:48px;padding:11px 21px;background:var(--teal);color:white}.button.secondary{background:#e0eee6;color:var(--ink)}.button.gold{background:var(--gold);color:#3d3216}.button.danger{background:#a53434;color:white}.button.compact{padding:8px 16px;min-height:42px}.icon-button{background:transparent;color:var(--ink);padding:6px 10px;min-width:44px;font-size:.95rem}.small-button{min-height:38px;padding:6px 13px;background:#e0eee6;color:var(--ink);font-size:.8rem}.wide-label{font-size:.8rem}.text-link{font-weight:700;text-decoration:none}.eyebrow{font-size:.7rem;font-weight:800;letter-spacing:2px;color:var(--teal);margin-bottom:10px}.muted{color:var(--muted);font-size:.92rem}.home{max-width:1080px;margin:auto;padding:30px 22px}.hero{position:relative;overflow:hidden;display:grid;grid-template-columns:1.5fr 1fr;align-items:center;padding:42px;border-radius:30px;background:linear-gradient(125deg,#d4eee1,#f6f1d9);margin-bottom:25px}.hero:after{content:"";position:absolute;width:450px;height:450px;border:1px solid #08796e12;border-radius:50%;right:-90px;top:-110px;pointer-events:none}.hero h1{font-size:clamp(2.7rem,5vw,4.3rem);line-height:1.03;letter-spacing:-2px;margin-bottom:22px}.hero p:not(.eyebrow){max-width:410px;color:#47695f}.hero-actions{display:flex;align-items:center;flex-wrap:wrap;gap:20px;margin-top:24px}.hero-tiles{display:flex;align-items:center;justify-content:center;gap:8px;transform:rotate(-10deg);z-index:1}.hero-tiles .tile{width:80px;height:112px}.hero-tiles .tile:nth-child(2){transform:translateY(-20px)}.account-strip,.join-card{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px;border:1px solid var(--line);border-radius:22px;background:var(--paper);box-shadow:var(--shadow);margin-bottom:22px}.account-strip strong{display:block;font-size:1.3rem}.join-card h2{font-size:1.1rem}.join-card p{color:var(--muted);font-size:.85rem;margin:0}.join-card form{display:flex;gap:10px}.join-card input{max-width:130px;font-weight:750;text-transform:uppercase;letter-spacing:3px}.section-heading{display:flex;align-items:center;justify-content:space-between;margin-top:36px}.section-heading .eyebrow{margin-bottom:7px}.room-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:16px}.room-card{padding:22px;background:var(--paper);border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow)}.room-card h3{margin:12px 0 6px;overflow-wrap:anywhere}.room-card .room-meta{color:var(--muted);font-size:.85rem;margin-bottom:16px}.room-card .button{width:100%}.badge{display:inline-flex;font-size:.73rem;border-radius:30px;background:#e0f3eb;padding:5px 10px;font-weight:700}.badge.watching{background:#fff1cf;color:#71561e}.empty{grid-column:1/-1;border:1px dashed #bbcec5;border-radius:20px;text-align:center;padding:34px 20px;color:var(--muted);background:#ffffff70}.guide{margin:28px 0;border:1px solid var(--line);border-radius:18px;background:#fffefa;padding:18px 22px;font-size:.9rem}.guide summary{cursor:pointer;font-weight:750;min-height:28px}.guide ol{padding-left:23px}.guide li{margin-bottom:9px}.guide p{color:var(--muted)}footer{display:flex;gap:18px;flex-wrap:wrap;font-size:.77rem;color:var(--muted);padding:20px 0}footer span{margin-left:auto}.notice{max-width:1036px;margin:14px auto;padding:12px 18px;background:#fff0d4;color:#67410f;border:1px solid #e9c897;border-radius:13px;font-size:.88rem}.form-error{background:#fde9e5;color:#a13727;border-radius:12px;padding:12px;margin:15px 0 0;font-size:.85rem}
dialog{position:fixed;width:min(94vw,560px);max-height:calc(100dvh - 32px);overflow:auto;border:1px solid var(--line);border-radius:24px;padding:24px;color:var(--ink);background:var(--paper);box-shadow:0 24px 100px #00271a55;overscroll-behavior:contain}dialog::backdrop{background:#052d27b0;backdrop-filter:blur(5px)}.modal-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:15px}.modal-head h2{margin:0}.modal-head .icon-button{font-size:1.6rem}.form-tabs{display:flex;padding:4px;border-radius:12px;background:#eaf3ed;gap:4px;margin:15px 0 20px}.form-tabs button{flex:1;border:0;background:transparent;border-radius:9px;padding:10px;color:var(--muted);font-weight:750}.form-tabs .active{background:white;color:var(--teal);box-shadow:0 2px 6px #001c1210}.form-note{font-size:.82rem;color:var(--muted);line-height:1.55}.check-label{display:flex;align-items:flex-start;font-weight:450;gap:10px}.check-label input{width:20px;min-height:20px;flex:none;margin-top:3px}.modal-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}.modal-actions>*{flex:1}.choice{display:flex;width:100%;align-items:center;justify-content:space-between;border:1px solid var(--line);border-radius:14px;padding:12px;background:#fffefa;gap:12px;margin-bottom:10px}.choice .tiles{display:flex;gap:4px}.choice .tile{width:43px;height:60px}.choice strong{font-size:.85rem}.stats-list{margin:20px 0}.stats-list div{display:flex;justify-content:space-between;gap:20px;border-bottom:1px solid var(--line);padding:12px 0}.stats-list dd{margin:0;font-weight:800}.share-input{font-size:.8rem;margin:10px 0}.round-seat{padding:16px;border-radius:16px;background:#eaf3ed;margin-bottom:14px}.round-seat.winner{background:#fff0c5}.round-seat h3{margin-bottom:10px}.round-seat .tiles{display:flex;flex-wrap:wrap;gap:5px}.round-seat .tile{width:38px;height:54px}.round-seat p{font-size:.78rem;margin:12px 0 5px}
/* A real table, with the viewer at the bottom and opponents in seat order. */
body.in-game{background:#083f36}.in-game .topbar{background:#083f36;border-color:#ffffff12;height:54px}.in-game .brand,.in-game .icon-button{color:#f4edcf}.in-game .brand span{color:#afcec3}.in-game .connection{background:#15574b;color:#d4ecdd}.in-game .button.compact{background:#206556}.in-game .notice{margin:7px 12px;padding:8px 13px}.game{max-width:1400px;margin:auto;color:#ecf7e9;padding:0 max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))}.game-heading{display:flex;justify-content:space-between;align-items:center;gap:10px;height:54px}.game-heading strong{display:block;font-size:1rem}.game-heading span:not(.wide-label){font-size:.68rem;color:#a5c5b9}.game-heading .icon-button{font-size:.78rem;padding:4px 8px}.game-status{font-size:.83rem;text-align:center;background:#062e28;border-radius:12px;margin:0 0 10px;min-height:34px;padding:7px 10px;overflow-wrap:anywhere}.table{position:relative;height:clamp(330px,49vh,580px);border:2px solid #b99c54;border-radius:26px;background:radial-gradient(ellipse at center,#1e8068,#075448);box-shadow:inset 0 0 0 8px #063f3433,inset 0 0 0 10px #b99c5429;overflow:hidden}.table:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(42deg,transparent 0,transparent 19px,#ffffff03 20px,#ffffff03 21px);pointer-events:none}.opponent{position:absolute;border:1px solid #bfaa693d;border-radius:14px;background:#073f34c9;padding:6px;display:flex;align-items:center;gap:5px;max-width:100%}.opponent .seat-name{font-size:.64rem;max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.opponent.active-seat{border-color:#f4d788;box-shadow:0 0 16px #f3cf7140}.opponent .rack{display:flex;gap:2px;justify-content:center}.opponent .tile{width:22px;height:31px;min-width:0}.opponent .public-melds{display:flex;gap:3px}.opponent .public-melds .tile{width:22px;height:31px}.seat-top{top:14px;left:50%;transform:translateX(-50%);flex-direction:column;max-width:calc(100% - 110px)}.seat-left,.seat-right{top:88px;bottom:22px;flex-direction:column;width:52px}.seat-left{left:13px}.seat-right{right:13px}.seat-left .seat-name,.seat-right .seat-name{writing-mode:vertical-rl;max-height:82px;font-size:.63rem}.seat-left .rack,.seat-right .rack{flex-direction:column;gap:0;flex:1;justify-content:center}.seat-left .rack .tile,.seat-right .rack .tile{height:clamp(12px,2.4vh,21px);width:29px;border-radius:3px;box-shadow:1px 2px 0 #073d30}.seat-left .public-melds,.seat-right .public-melds{display:none}.table-middle{position:absolute;left:80px;right:80px;top:100px;bottom:17px;display:flex;flex-direction:column;align-items:center;gap:8px}.wall{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:2px;max-width:100%;min-height:28px;font-size:.7rem;color:#ead78e}.wall-stack{width:9px;height:13px;background:linear-gradient(#e6d99f 14%,#155e46 17%,#22785a 85%,#082e21);border:1px solid #b7a15a;border-radius:2px;box-shadow:1px 3px 0 #d3c698,1px 5px 0 #103e2c}.wall strong{flex-basis:100%;text-align:center;font-size:.75rem;margin-bottom:4px}.discard-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;width:100%;overflow:auto;min-height:0;flex:1;align-content:start;scrollbar-width:thin;scrollbar-color:#d5c274 transparent}.discard-pile{background:#003c3030;border-radius:8px;padding:5px}.discard-pile>span{font-size:.55rem;color:#c9dcbe;display:block;margin-bottom:3px}.discard-pile .tiles{display:flex;flex-wrap:wrap;gap:3px;justify-content:center}.discard-pile .tile{width:24px;height:33px;min-width:0}.last-discard{display:flex;align-items:center;justify-content:center;gap:9px;min-height:64px}.last-discard .tile{width:44px;height:62px}.last-discard>span{max-width:90px;font-size:.68rem;color:#fff2c9}.self-area{padding:10px 10px 12px;margin-top:10px;background:#052e28;border-radius:18px}.hand-heading{display:flex;align-items:center;gap:10px;justify-content:space-between;margin-bottom:9px;min-height:30px}.hand-heading strong{font-size:.8rem}.hand-heading span{font-size:.66rem;color:#9ab8ad}.hand-heading .small-button{background:#164d3e;color:#f4dd98;min-height:30px;padding:4px 9px;flex-shrink:0}.hand{display:grid;grid-template-columns:repeat(14,minmax(0,1fr));gap:6px;align-items:end;padding-top:7px;user-select:none;-webkit-user-select:none}.tile{display:inline-flex;position:relative;justify-content:center;align-items:center;width:46px;height:65px;padding:3px;border:1px solid #d2c497;border-radius:7px;background:linear-gradient(135deg,#fffdf1,#eee5c4);box-shadow:2px 4px 0 #8b9b76,3px 7px 0 #064a35;flex:none;vertical-align:middle;overflow:hidden;color:#173f3b}.tile-face{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}.tile-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.tile-back{background:repeating-linear-gradient(45deg,transparent 0,transparent 6px,#d5c17520 7px,#d5c17520 8px),linear-gradient(120deg,#25876a,#124d3c);border-color:#bda761}.tile-back:after{content:"◇";color:#d6c17c;font-size:1em}.hand .tile{width:100%;height:auto;aspect-ratio:.7;min-height:0;padding:4px;cursor:pointer;touch-action:pan-y;transition:transform .14s,box-shadow .14s}.hand .tile.is-selected{transform:translateY(-8px);border-color:#fff0a6;box-shadow:0 0 0 2px #e7c764,2px 6px 0 #086447}.hand .tile.is-drawn{border-color:#edc35b;box-shadow:0 0 0 2px #ddbf69,2px 6px 0 #07513c}.tile.dragging{opacity:.6;transform:translateY(-10px)}.tile.drop-target{outline:3px solid #ffdb65;outline-offset:2px}.own-melds{display:flex;gap:12px;flex-wrap:wrap}.own-melds:empty{display:none}.own-melds .meld{display:flex;gap:3px;align-items:center;margin-bottom:8px}.own-melds .meld span{font-size:.57rem;color:#a8c8b5}.own-melds .tile{width:25px;height:34px}.game-actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;align-items:center;min-height:52px;padding-top:10px}.game-actions .button{min-height:44px;padding:9px 18px;font-size:.88rem}.game-actions .turn-label{font-size:.8rem;color:#bdd5c7}.game-actions .result-title{font-weight:800;color:#f8df8b}.lobby{position:relative;border:2px solid #b99c54;border-radius:26px;min-height:320px;background:radial-gradient(ellipse,#1e8068,#075448);display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:28px}.lobby-seat{display:flex;flex-direction:column;gap:5px;align-items:center;justify-content:center;background:#084337cc;color:#e4f1da;border:1px solid #bba96d75;border-radius:18px;padding:20px 10px;min-height:116px}.lobby-seat .wind{font-size:1.8rem;color:#f4da8d}.lobby-seat strong{font-size:.9rem}.lobby-seat small{font-size:.73rem}.lobby-seat.mine{border:2px solid #efcd75;background:#18654f}.league-panel{background:#06382e;border:1px solid #b99c5455;border-radius:18px;padding:14px;margin-top:14px;font-size:.85rem}.league-panel table{width:100%;border-collapse:collapse}.league-panel td,.league-panel th{text-align:left;padding:6px;border-bottom:1px solid #ffffff15}.motion-arrange .rack{animation:arrange .55s ease}.motion-draw .rack{animation:take .5s ease}.motion-discard{animation:discard .45s ease}.win-glow{animation:victory 1s ease 2}.score-fields{display:grid;gap:12px}.score-fields label{grid-template-columns:1fr 100px;align-items:center}.in-game dialog .icon-button{color:var(--ink)}
@keyframes arrange{40%{transform:translateX(6px)}70%{transform:translateX(-3px)}}@keyframes take{40%{filter:brightness(1.5);transform:translateY(-4px)}}@keyframes discard{from{transform:translateY(-14px) scale(.7);opacity:.4}to{transform:translateY(0) scale(1);opacity:1}}@keyframes victory{50%{box-shadow:inset 0 0 80px #edd36a70}}
@media(max-width:650px){.topbar{padding-left:16px;padding-right:16px;height:65px}.brand{font-size:1.35rem}.brand span,.wide-label{display:none}.toolbar{gap:4px}.home{padding:18px 16px}.hero{padding:27px 22px;grid-template-columns:1fr;min-height:300px}.hero h1{font-size:3.1rem;max-width:220px}.hero>div:first-child{z-index:2}.hero-tiles{position:absolute;right:17px;top:40px;opacity:.85;transform:rotate(13deg)}.hero-tiles .tile{width:36px;height:52px;border-radius:5px;box-shadow:1px 3px 0 #8b9b76,2px 5px 0 #064a35}.hero-tiles .tile:nth-child(2){transform:translateY(-9px)}.hero p:not(.eyebrow){font-size:.91rem;max-width:260px}.hero-actions{gap:15px}.hero-actions .button{padding:11px 17px}.hero-actions .text-link{font-size:.84rem}.eyebrow{font-size:.62rem;letter-spacing:1.6px}.account-strip{padding:18px;gap:10px}.account-strip strong{font-size:1.05rem}.account-strip .button{font-size:.8rem;padding:10px 14px}.join-card{flex-direction:column;align-items:stretch;gap:15px;padding:20px}.join-card form input{max-width:none;flex:1}.join-card form button{flex:1}.section-heading{margin-top:30px}.section-heading h2{font-size:1.24rem}.room-card{padding:19px}.room-list{gap:12px}.connection{max-width:95px;overflow:hidden;text-overflow:ellipsis;font-size:.65rem}.hand{grid-template-columns:repeat(7,minmax(0,1fr));gap:9px 7px}.hand .tile{max-height:69px;aspect-ratio:.72}.table{height:clamp(320px,46vh,470px)}.hand-heading span{font-size:.6rem}.self-area{padding:8px}.seat-top .tile{width:17px;height:24px}.seat-top{max-width:calc(100% - 48px);top:13px}.table-middle{left:66px;right:66px;top:88px;bottom:12px}.seat-left{left:10px}.seat-right{right:10px}.seat-left,.seat-right{width:45px;top:86px;bottom:20px;padding:4px}.discard-pile .tile{width:21px;height:29px}.discard-grid{gap:5px}.wall-stack{width:7px;height:9px}.wall{gap:3px}.last-discard .tile{width:40px;height:56px}.last-discard{min-height:58px;gap:6px}.lobby{padding:16px;gap:12px}.lobby-seat{padding:12px 8px}.game-heading strong{font-size:.85rem}.game-heading .toolbar{gap:0}.game-heading .icon-button{padding:4px 7px}.game-actions .button{padding:9px 14px}.game-actions{gap:7px}.hand-heading strong{max-width:47%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}footer span{margin-left:0}dialog{padding:20px;max-height:calc(100dvh - 20px)}.choice .tile{width:38px;height:54px}}
@media(orientation:landscape) and (max-height:600px){.in-game .topbar{height:42px}.in-game .brand{font-size:1.1rem}.in-game .button.compact{min-height:32px;font-size:.75rem}.in-game .icon-button{min-height:32px}.game{display:grid;grid-template-columns:1fr;gap:0;padding-bottom:6px}.game-heading{height:34px}.game-heading>div:first-child{display:flex;align-items:center;gap:12px}.game-status{position:absolute;top:49px;left:35%;right:24%;padding:3px 10px;min-height:22px;font-size:.63rem;max-height:25px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none}.table{height:max(145px,calc(100dvh - 224px));min-height:145px;border-radius:17px}.seat-top{top:7px;flex-direction:row;max-width:70%;padding:3px 8px;gap:10px}.seat-top .tile{width:17px;height:24px}.seat-top .seat-name{font-size:.56rem;max-width:125px}.seat-left,.seat-right{top:44px;bottom:10px;width:40px;flex-direction:row;padding:3px}.seat-left .rack .tile,.seat-right .rack .tile{width:20px;height:6px;min-height:0;border-radius:2px;box-shadow:none}.seat-left .seat-name,.seat-right .seat-name{max-height:70px;font-size:.52rem}.table-middle{top:45px;left:62px;right:62px;bottom:8px;display:grid;grid-template-columns:1fr 2fr 85px;align-items:center;gap:12px}.wall{max-height:75px;overflow:hidden;align-content:center}.wall strong{font-size:.63rem;margin:0}.wall-stack{width:7px;height:7px;box-shadow:1px 2px 0 #d3c698}.discard-grid{grid-template-columns:repeat(4,1fr);max-height:100%;height:100%;gap:5px}.discard-pile{padding:3px}.discard-pile .tile{width:18px;height:25px;padding:1px;border-radius:3px;box-shadow:1px 2px 0 #466949}.discard-pile>span{font-size:.48rem}.last-discard{flex-direction:column;gap:2px;min-height:0}.last-discard .tile{width:32px;height:44px}.last-discard>span{font-size:.54rem;text-align:center;max-width:100%}.self-area{margin-top:5px;padding:5px 8px;position:relative}.hand-heading{margin:0 0 4px;min-height:20px}.hand-heading strong{font-size:.65rem;max-width:50%}.hand-heading span{font-size:.6rem}.hand-heading .small-button{min-height:21px;font-size:.62rem;padding:2px 8px}.hand{grid-template-columns:repeat(14,minmax(0,1fr));gap:5px;padding-top:2px}.hand .tile{height:clamp(39px,12vh,72px);aspect-ratio:auto;max-height:72px;padding:2px;box-shadow:1px 3px 0 #79916a,2px 4px 0 #064a35}.hand .tile.is-selected{transform:translateY(-4px)}.own-melds{position:absolute;right:100px;top:1px;gap:8px;max-width:45%;max-height:22px;overflow:hidden}.own-melds .meld{margin:0;gap:1px}.own-melds .tile{width:14px;height:20px;padding:1px;border-radius:3px;box-shadow:none}.own-melds .meld span{display:none}.game-actions{min-height:34px;padding-top:4px;gap:8px}.game-actions .button{min-height:31px;padding:4px 16px;font-size:.76rem}.game-actions .turn-label,.game-actions .result-title{font-size:.72rem}.lobby{min-height:170px;grid-template-columns:repeat(4,1fr);padding:15px}.lobby-seat{min-height:120px;padding:10px}.in-game .notice{font-size:.7rem;padding:4px 10px;margin:3px 12px}.wide-label{display:inline}dialog{max-height:calc(100dvh - 16px);padding:18px 24px}.modal-head{margin-bottom:8px}.modal-head h2{font-size:1.2rem}}
body{min-height:100dvh}.tile-preview{text-align:center;padding:20px}.tile-preview .tile{width:140px;height:196px;margin-bottom:25px}.seat-bottom{bottom:12px;left:50%;transform:translateX(-50%);flex-direction:column;max-width:calc(100% - 110px)}.spectating .table-middle{bottom:78px}.own-melds .meld .tile{display:inline-flex}.game #sync{color:#fff}
@media(max-width:650px){.hero-tiles .tile{width:28px;height:40px}.hero-tiles{gap:4px;right:15px;top:38px}.hero h1{font-size:2.85rem}.seat-left .seat-name,.seat-right .seat-name{position:absolute;top:-15px;writing-mode:horizontal-tb;font-size:.48rem;max-width:72px}.seat-left .rack,.seat-right .rack{min-height:0;overflow:hidden}}
@media(max-width:350px){.hero-tiles{top:142px;right:22px}.hero-tiles .tile{width:24px;height:34px}.hero h1{font-size:2.7rem}}
@media(orientation:landscape) and (max-height:600px){.seat-bottom{bottom:5px;flex-direction:row;padding:3px 8px}.seat-bottom .tile{width:15px;height:21px}.seat-bottom .seat-name{font-size:.56rem}.spectating .table-middle{bottom:40px}.table.spectating{height:max(190px,calc(100dvh - 170px))}}
.web-destinations{display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;margin:0 0 20px}.web-destinations a{padding:10px 14px;border:1px solid var(--line);border-radius:12px;background:#fffefa;text-decoration:none;font-weight:700;font-size:.85rem}
/* Compact landscape arena: one toolbar, a full-width hand, and readable river.
   Do not hide overflow on the document: zoom, notices and league results must
   remain reachable on small/short browser viewports. */
@media(orientation:landscape) and (max-height:600px){
  .in-game .topbar{height:48px;justify-content:flex-end;padding-right:max(12px,env(safe-area-inset-right))}
  .in-game .topbar .brand,.in-game .topbar .connection{display:none}
  .in-game .topbar .toolbar{gap:4px}
  .in-game .topbar .button.compact,.in-game .topbar .icon-button{min-height:44px}
  .in-game .topbar .wide-label{display:none}
  .game{height:calc(100dvh - 48px);min-height:300px;grid-template-rows:24px minmax(145px,1fr) auto auto;gap:4px;padding-bottom:max(6px,env(safe-area-inset-bottom));max-width:none}
  .game-heading{position:absolute;top:0;left:max(12px,env(safe-area-inset-left));right:max(162px,calc(env(safe-area-inset-right) + 150px));height:48px;min-width:0;gap:6px}
  .game-heading>div:first-child{display:block;min-width:0}
  .game-heading strong{font-size:.85rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .game-heading #game-subtitle{display:none}
  .game-heading .toolbar{gap:2px;flex:none}
  .game-heading .icon-button{min-width:40px;min-height:44px;padding:5px 8px;font-size:.8rem}
  .game-heading .wide-label{display:none}
  .game-status{position:static;min-height:24px;max-height:none;margin:0;padding:2px 12px;font-size:.72rem;line-height:20px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:auto}
  .table,.table.spectating{height:100%;min-height:145px;border-radius:18px;grid-row:2}
  .lobby{grid-row:2;min-height:145px;padding:12px;gap:12px}
  .lobby-seat{min-height:100px;padding:8px}
  .seat-top{top:6px;max-width:calc(100% - 158px);padding:3px 8px;gap:8px;border-radius:9px}
  .seat-top .tile,.seat-bottom .tile{width:23px;height:31px;border-radius:4px;box-shadow:1px 2px 0 #8b9b76,2px 3px 0 #064a35}
  .seat-top .seat-name,.seat-bottom .seat-name{font-size:.61rem;max-width:125px}
  .seat-top .rack,.seat-bottom .rack{gap:2px}
  .seat-left,.seat-right{top:9px;bottom:9px;width:54px;flex-direction:column;justify-content:center;padding:4px;gap:0;border-radius:10px}
  .seat-left{left:8px}.seat-right{right:8px}
  .seat-left .seat-name,.seat-right .seat-name{position:static;writing-mode:horizontal-tb;font-size:.57rem;max-height:none;max-width:46px;flex:none;line-height:14px}
  .seat-left .rack,.seat-right .rack{min-height:0;max-height:100%;overflow:hidden;flex:1;justify-content:center}
  .seat-left .rack .tile,.seat-right .rack .tile{width:32px;height:25px;flex-shrink:1;min-height:6px;border-radius:3px;box-shadow:1px 1px 0 #d3c698}
  .table-middle{top:46px;left:73px;right:73px;bottom:8px;grid-template-columns:minmax(0,1fr) 79px;grid-template-rows:24px minmax(0,1fr);gap:5px 10px;align-items:stretch}
  .wall{grid-column:1;grid-row:1;max-height:24px;min-height:0;overflow:hidden;flex-wrap:nowrap;justify-content:center;gap:2px}
  .wall strong{flex-basis:auto;flex:none;font-size:.62rem;margin:0 7px 0 0}
  .wall-stack{width:5px;height:7px;flex-shrink:1;min-width:2px;border-radius:1px}
  .discard-grid{grid-column:1;grid-row:2;grid-template-columns:repeat(4,minmax(0,1fr));max-height:100%;height:100%;overflow:auto;gap:5px;overscroll-behavior:contain}
  .discard-pile{padding:3px;min-width:0}
  .discard-pile>span{font-size:.55rem;line-height:13px;margin-bottom:4px}
  .discard-pile .tiles{gap:4px}
  .discard-pile .tile{width:25px;height:35px;border-radius:4px;box-shadow:1px 2px 0 #8b9b76,2px 3px 0 #064a35}
  .last-discard{grid-column:2;grid-row:1 / 3;justify-content:center;gap:5px;padding:4px;background:#022e243f;border:1px solid #d2c17b33;border-radius:12px}
  .last-discard .tile{width:52px;height:73px;border-radius:7px;padding:4px;flex:none}
  .last-discard>span{font-size:.59rem;line-height:1.2;overflow-wrap:anywhere}
  .self-area{grid-row:3;margin:0;padding:4px 7px 7px;border-radius:12px;display:grid;grid-template-columns:minmax(0,1fr);gap:2px}
  .hand-heading{min-height:20px;margin:0;gap:8px}
  .hand-heading strong{font-size:.68rem;max-width:45%}
  .hand-heading span{font-size:.61rem}
  .hand-heading .small-button{min-height:24px;padding:2px 12px;font-size:.68rem}
  .hand{grid-template-columns:repeat(14,minmax(0,1fr));gap:5px;padding-top:5px}
  .hand .tile{height:clamp(48px,14dvh,75px);max-height:75px;aspect-ratio:auto;padding:3px;border-radius:5px}
  .hand .tile.is-selected{transform:translateY(-5px)}
  .own-melds{position:static;max-width:100%;max-height:35px;overflow-x:auto;overflow-y:hidden;flex-wrap:nowrap;gap:12px;cursor:pointer;scrollbar-width:thin}
  .own-melds .meld{flex:none;gap:3px;margin:0}
  .own-melds .tile{width:22px;height:30px;padding:2px;border-radius:4px;box-shadow:1px 2px 0 #6c8561}
  .own-melds .meld .tile{display:inline-flex}
  .game-actions{grid-row:4;min-height:42px;padding:0;gap:7px}
  .game-actions .button{min-height:40px;padding:6px 15px;font-size:.8rem}
  .game-actions .turn-label,.game-actions .result-title{font-size:.73rem}
  .league-panel{grid-row:5;margin:0 0 8px}
  .is-spectator .game{grid-template-rows:24px minmax(145px,1fr) 0 auto}
  .seat-bottom{bottom:6px;max-width:calc(100% - 158px);padding:3px 8px;gap:8px;flex-direction:row;border-radius:9px}
  .spectating .table-middle{bottom:47px}
  dialog{max-height:calc(100dvh - 16px);margin:8px auto;padding:16px 22px}
}
@media(orientation:landscape) and (max-height:350px){
  .in-game .topbar{height:40px}
  .in-game .topbar .button.compact,.in-game .topbar .icon-button,.game-heading .icon-button{min-height:38px}
  .game-heading{height:40px}
  .game{height:calc(100dvh - 40px);min-height:264px;grid-template-rows:20px minmax(126px,1fr) auto auto;gap:2px;padding-bottom:4px}
  .game-status{min-height:20px;line-height:16px;font-size:.65rem}
  .table,.table.spectating{min-height:126px}
  .self-area{padding:2px 6px 5px}.hand-heading{min-height:18px}.hand-heading .small-button{min-height:20px}
  .hand .tile{height:40px}
  .game-actions{min-height:36px}.game-actions .button{min-height:36px}
  .own-melds{max-height:27px}.own-melds .tile{width:18px;height:24px}
  .seat-top .tile,.seat-bottom .tile{width:19px;height:26px}
  .table-middle{top:39px;grid-template-rows:18px minmax(0,1fr)}
  .last-discard .tile{width:43px;height:60px}
}
.game-heading .toolbar{position:relative}.reaction-control{display:flex;align-items:center}.game-heading #reactions{width:44px;min-width:44px;min-height:44px;padding:4px}.game-heading #reactions>span{font-size:18px;color:inherit}.game-heading #reactions[aria-expanded="true"]{background:#ffffff15;border-radius:50%}
.reaction-popover{position:absolute;top:calc(100% + 4px);right:0;width:min(280px,calc(100vw - 24px));max-height:calc(100dvh - 120px);overflow:auto;z-index:50;padding:0 10px 6px;border:1px solid var(--line);border-radius:15px;background:var(--paper);color:var(--ink);box-shadow:0 6px 22px #001e1a40;overscroll-behavior:contain}.reaction-popover-heading{display:flex;align-items:center;justify-content:space-between;min-height:44px}.reaction-popover h2{font-size:.85rem;margin:0;line-height:1.2}.game-heading .reaction-popover .icon-button{color:var(--ink);min-width:44px;min-height:44px;padding:4px;font-size:1.2rem}.reaction-menu{display:grid;gap:6px}.reaction-menu p{margin:0}.reaction-menu>label{gap:3px;font-size:.68rem}.reaction-menu select{height:44px;min-height:44px;padding:5px 7px;border-radius:9px;font-size:.76rem}.reaction-choices{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}.reaction-choice{display:flex;align-items:center;justify-content:center;min-width:0;min-height:44px;padding:3px;border:1px solid var(--line);border-radius:10px;background:#f3f9f4}.reaction-choice:hover{background:#e0f3eb;border-color:var(--teal)}.game-heading .reaction-popover .reaction-emoji{font-size:22px;line-height:1.2;color:inherit}.reaction-settings{display:flex;justify-content:space-between;align-items:center;gap:4px}.reaction-settings .check-label{align-items:center;gap:7px;min-height:44px}.game-heading .reaction-popover .check-label span{font-size:.71rem;color:var(--ink)}.reaction-report{min-width:44px;min-height:44px;padding:3px;font-size:18px;background:transparent;border:0;border-radius:9px;color:var(--teal)}.reaction-note{font-size:.64rem;color:var(--muted);line-height:1.3}.reaction-popover .form-note{font-size:.72rem}.reaction-popover .form-error{margin:4px 0;font-size:.72rem;padding:7px}.reaction-layer{position:fixed;inset:0;pointer-events:none;z-index:30;overflow:hidden}.reaction-projectile{position:absolute;font-size:24px;line-height:1.2;transform:translate(-50%,-50%);filter:drop-shadow(0 2px 2px #001e1a55);pointer-events:none}
.reaction-projectile.reaction-fullscreen{font-size:clamp(160px,65vmin,440px);filter:drop-shadow(0 12px 18px #001e1a66)}.reaction-fullscreen:before{content:"";position:absolute;inset:-25%;z-index:-1;border-radius:50%;background:radial-gradient(ellipse,#f2cf7240,transparent 68%);pointer-events:none}.reaction-projectile.reaction-reduced{font-size:24px}
.reaction-projectile.reaction-scene{width:1em;height:1em;filter:drop-shadow(0 8px 9px #24180c33)}.reaction-scene:before{display:none}.reaction-scene *{pointer-events:none}.reaction-flight,.reaction-impact{position:absolute;inset:0;display:block;transform-origin:50% 50%}.reaction-flight{line-height:1;text-align:center;font-size:.9em}.reaction-impact{isolation:isolate}.reaction-splat-base{position:absolute;inset:22% 9% 17%;border-radius:47% 43% 39% 49%;background:radial-gradient(ellipse at 35% 20%,#b47744,#8d512e 65%,#62371f);box-shadow:inset 0 .025em .04em #e4aa6766,inset 0 -.02em .025em #472b3166}.reaction-splat-drop{position:absolute;background:linear-gradient(145deg,#ba7c43,#8d512e);border-radius:60% 45% 50% 38%;box-shadow:inset .01em .02em #dba06066}.reaction-splat-drip{position:absolute;top:62%;width:6%;border-radius:0 0 50% 50%;background:linear-gradient(#9e6136,#85502e);transform-origin:50% 0;z-index:-1}.reaction-splat-drip:after{content:"";position:absolute;bottom:5%;left:15%;width:20%;height:45%;border-radius:50%;background:#d5955455}.reaction-poop-body{position:absolute;left:23%;top:35%;width:54%;height:38%;border-radius:48% 43% 43% 44%;background:linear-gradient(140deg,#cb8c51,#a05f32 68%,#8a4d29);box-shadow:inset 0 .025em .018em #edba7666,0 .022em .025em #5e321f33}.reaction-poop-body:before{content:"";position:absolute;width:77%;height:82%;left:12%;top:-45%;border-radius:54% 48% 36% 35%;background:linear-gradient(140deg,#d69857,#aa693b 85%);z-index:-1}.reaction-poop-body:after{content:"";position:absolute;width:43%;height:69%;left:37%;top:-85%;border-radius:75% 5% 45% 30%;background:linear-gradient(135deg,#dfab6a,#b57541);transform:rotate(-17deg);z-index:-2}.reaction-poop-eyes{position:absolute;left:19%;top:6%;width:62%;height:40%}.reaction-poop-eyes:before,.reaction-poop-eyes:after{content:"";position:absolute;top:0;width:25%;height:100%;border-radius:50%;background:radial-gradient(ellipse at 61% 58%,#46281d 0 19%,transparent 23%),#fffdf0;box-shadow:0 .007em #71462933}.reaction-poop-eyes:before{left:0;transform:rotate(12deg)}.reaction-poop-eyes:after{right:0;transform:rotate(-12deg)}.reaction-poop-smile{position:absolute;left:35%;top:46%;width:31%;height:25%;border-radius:12% 12% 60% 60%;background:linear-gradient(#fff8e8 0 25%,#642d29 29% 63%,#f48785 68%);transform:rotate(-5deg)}.reaction-stink-puff{position:absolute;top:6%;width:26%;height:22%;border-radius:49% 61% 44% 53%;background:radial-gradient(ellipse,#bdd36bc9,#aaca6b22 72%,transparent 75%);font-size:.16em;line-height:1.1;color:#698443;text-align:center;padding-top:3%}.reaction-fly{position:absolute;width:3%;height:5%;border-radius:50%;background:#49362b;transform-origin:center}.reaction-fly:before,.reaction-fly:after{content:"";position:absolute;top:-32%;width:115%;height:75%;background:#edf8dcdb;border:1px solid #75927988;border-radius:75% 75% 20% 70%}.reaction-fly:before{left:-80%;transform:rotate(-30deg)}.reaction-fly:after{right:-80%;transform:rotate(30deg)}
.reaction-act{position:absolute;inset:0;isolation:isolate}.reaction-laugh-face{position:absolute;inset:13% 8%;font-size:.65em;line-height:1;display:grid;place-items:center}.reaction-laugh-tear{position:absolute;top:40%;width:7%;height:10%;border-radius:60% 5% 60% 60%;background:linear-gradient(135deg,#bcefff,#36abf0);box-shadow:inset .006em .008em #fff9}.reaction-laugh-word{position:absolute;font:900 .075em/1 system-ui,sans-serif;color:#fff1a3;text-shadow:0 .018em .04em #785720;letter-spacing:-.04em}.reaction-clap-hand{position:absolute;left:21%;top:21%;width:58%;font-size:.60em;line-height:1;transform-origin:50% 85%;text-align:center}.reaction-clap-left{z-index:2}.reaction-clap-right{z-index:1;filter:brightness(.95)}.reaction-clap-shine{position:absolute;left:40%;top:6%;width:20%;font-size:.20em;line-height:1;color:#ffe292;text-shadow:0 0 .10em #ec9518}.reaction-clap-confetti{position:absolute;font-size:.07em;line-height:1}.reaction-heart-center{position:absolute;inset:14% 10%;display:grid;place-items:center;font-family:system-ui,sans-serif;font-size:.68em;line-height:1;color:#f26388;text-shadow:0 .025em .06em #ef376833,0 -.01em #ffc4d6}.reaction-heart-rise{position:absolute;font-family:system-ui,sans-serif;line-height:1;text-shadow:0 .025em .04em #ef376822}.reaction-clock{position:absolute;left:19%;top:17%;width:62%;height:62%;transform-origin:50% 8%}.reaction-clock-face{position:absolute;inset:0;border:.03em solid #f9c449;border-radius:50%;background:radial-gradient(circle at 35% 25%,#fffef4,#fff2c8);box-shadow:inset 0 0 0 .012em #df923d,0 .025em .035em #73501b33}.reaction-clock-tick{position:absolute;inset:7%;border-radius:50%}.reaction-clock-tick:before{content:"";position:absolute;left:48%;top:0;width:4%;height:10%;border-radius:999px;background:#b18b54}.reaction-clock-hour{position:absolute;left:47%;top:28%;width:7%;height:25%;border-radius:999px;background:#765743;transform:rotate(-50deg);transform-origin:50% 88%}.reaction-clock-sweep{position:absolute;left:48%;top:15%;width:4%;height:35%;border-radius:999px;background:#e86568;transform-origin:50% 100%}.reaction-clock-pin{position:absolute;left:44%;top:44%;width:12%;height:12%;border-radius:50%;background:#df9950;border:.007em solid #fff1bb}.reaction-clock-bell{position:absolute;top:-10%;width:31%;height:22%;border-radius:60% 60% 20% 20%;background:linear-gradient(#ffdc73,#e9a637);border:.008em solid #b47f39}.reaction-clock-bell-left{left:0;transform:rotate(-30deg)}.reaction-clock-bell-right{right:0;transform:rotate(30deg)}.reaction-hourglass{position:absolute;left:66%;top:68%;font-size:.23em;line-height:1}
.reaction-popover{padding-top:8px}.reaction-popover-heading{height:0;min-height:0}.reaction-popover-heading h2{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.reaction-popover-heading .icon-button{position:absolute;top:6px;right:5px}.reaction-menu>.reaction-target{padding-right:42px;gap:0}.reaction-menu>.form-note{padding-right:42px}
.reaction-poop-body{z-index:1}
@media(max-width:480px){.game-heading{gap:4px}.game-heading>div:first-child{min-width:0}.game-heading strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.game-heading .toolbar{gap:0;flex:none}.game-heading .wide-label{display:none}.reaction-choices{gap:8px}}
@media(orientation:landscape) and (max-height:600px){.reaction-popover{max-height:calc(100dvh - 64px)}}
.reaction-projectile[data-intensity="light"]{font-size:clamp(110px,42vmin,290px);opacity:.88}.reaction-projectile[data-intensity="lively"]{font-size:clamp(180px,78vmin,520px)}
.reaction-avatar-expression{position:absolute;font-size:27px;line-height:1;width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:#fff9df;border:2px solid #edcf77;box-shadow:0 3px 8px #001f2044;transform:translate(-50%,-50%);z-index:3}
.reaction-mosquito{position:absolute;left:31%;top:31%;font-size:.42em;line-height:1}.reaction-mosquito-buzz{position:absolute;color:#fff4ba;font:900 .09em/1 system-ui;text-shadow:0 2px 3px #263c34}.reaction-mosquito-landing{position:absolute;inset:45% 35% 25%;border:.013em solid #efd07b;border-radius:50%}
.reaction-frost-glass{position:absolute;inset:-14%;border-radius:35%;background:radial-gradient(ellipse,transparent 33%,#c2edff77 58%,#f0fbffcc 75%,transparent 80%)}.reaction-frost-flake{position:absolute;color:#e6faff;font-size:.16em;line-height:1;text-shadow:0 0 .03em #71c9f4}.reaction-frost-face{position:absolute;inset:25% 15%;font-size:.52em;line-height:1;text-align:center}
.reaction-frost-glass{inset:auto;left:calc(50% - 50vw);top:calc(50% - 50dvh);width:100vw;height:100dvh;border-radius:0;background:linear-gradient(90deg,#dff8ffe6,transparent 12%,transparent 88%,#dff8ffe6),linear-gradient(0deg,#dcf5ffcc,transparent 10%,transparent 90%,#dcf5ffcc),radial-gradient(ellipse at center,transparent 58%,#a4dff966 83%,#f3fcffee 100%)}
.reaction-kiss-face{position:absolute;inset:22% 14%;font-size:.52em;line-height:1}.reaction-kiss-mark{position:absolute;left:46%;top:38%;font-size:.35em;line-height:1;color:#ef6b8f;text-shadow:0 0 .05em #f393ad55}
.reaction-tomato{position:absolute;inset:21%;font-size:.56em;line-height:1}.reaction-tomato-splash{position:absolute;inset:20% 12%;border-radius:39% 57% 42% 61%;background:radial-gradient(ellipse at 30% 25%,#ff8969,#ef3c37 63%,#c72331);box-shadow:.11em -.07em 0 -.09em #f55245,-.10em -.08em 0 -.09em #e74335,.06em .12em 0 -.09em #ed4037,inset 0 .02em .04em #ffb38966}.reaction-tomato-leaf{position:absolute;left:37%;top:5%;color:#68a24e;font-size:.2em;line-height:1;transform:rotate(20deg)}.reaction-tomato-seed{position:absolute;left:49%;top:49%;width:2%;height:4%;border-radius:80% 10% 70% 20%;background:#ffe5a0;box-shadow:0 0 .01em #b82f1f}
.reaction-favorites{grid-template-columns:repeat(4,minmax(0,1fr))}.reaction-customize{font-size:.7rem;border-top:1px solid var(--line);padding-top:4px}.reaction-customize summary{cursor:pointer;min-height:38px;display:flex;align-items:center;font-weight:750}.reaction-customize summary:before{content:"▸";margin-right:6px}.reaction-customize[open] summary:before{content:"▾"}.reaction-customize label{font-size:.7rem;margin:5px 0}.reaction-customize input[type=range]{padding:0;accent-color:var(--teal);border:0;min-height:36px}.reaction-library{display:grid;gap:3px}.reaction-library-row{display:grid;grid-template-columns:42px 1fr 38px 38px;gap:3px;align-items:center;min-width:0}.game-heading .reaction-library-row>span{color:var(--ink);font-size:.67rem}.reaction-library-button{min-width:38px;min-height:44px;padding:0;border:0;background:transparent;font-size:19px;color:var(--teal)}.reaction-library-button[aria-pressed=true]{color:#a6770d}
.reaction-quick-reply{display:flex;align-items:center;gap:6px;max-width:360px;margin:0 0 6px auto;padding:0 4px 0 8px;border:1px solid #afcdaf66;border-radius:12px;background:#144f43;color:#fff1ce}.reaction-reply-button,.reaction-reply-close{min-height:38px;border:0;background:transparent;color:inherit;font-size:.76rem;font-weight:750;white-space:nowrap}.reaction-reply-close{min-width:38px;font-size:20px}.reaction-reply-note{font-size:.66rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:200px}
.reaction-quick-reply{position:fixed;z-index:31;top:108px;right:max(12px,env(safe-area-inset-right));max-width:min(240px,calc(100vw - 24px));box-shadow:0 3px 14px #03272044}.reaction-reply-button,.reaction-reply-close{min-height:44px}.reaction-reply-note{max-width:115px}
@media(orientation:landscape) and (max-height:600px){.reaction-quick-reply{top:48px}.reaction-reply-note{max-width:90px}}
/* The draw marker belongs to the exact UID in the viewer's own hand. Keep it
   outside the artwork, with space for both the badge and a selected tile lift.
   These rules follow compact landscape rules so their plain tile shadow cannot
   erase the draw/selection state. No repeating animation is needed. */
.hand{padding-top:26px;row-gap:25px}
.hand .tile.is-drawn{overflow:visible;border-color:#ffd15c;box-shadow:0 0 0 2px #ffd15c,0 0 0 4px #0a7661,2px 6px 0 #07513c}
.tile-drawn-marker{position:absolute;bottom:calc(100% + 5px);left:50%;transform:translateX(-50%);display:block;width:max-content;min-width:25px;padding:1px 3px;border-radius:4px;background:#ffd15c;color:#173f30;font:900 8px/12px system-ui,sans-serif;letter-spacing:.4px;white-space:nowrap;text-align:center;box-shadow:0 1px 2px #001d17aa;pointer-events:none;user-select:none}
.hand .tile.is-drawn.is-selected{border-color:#fff8d7;box-shadow:0 0 0 2px #fff5c4,0 0 0 4px #20b89b,2px 6px 0 #07513c}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* Friendly standings retain readable columns instead of squeezing on phones. */
.friendly-standings{max-width:100%;overflow-x:auto;margin:12px 0 16px;border:1px solid #bed8d2;border-radius:12px;background:#fff;overscroll-behavior-x:contain}
.friendly-standings table{border-collapse:collapse;min-width:100%;width:max-content;font-size:.9rem;font-variant-numeric:tabular-nums}
.friendly-standings th,.friendly-standings td{padding:11px 14px;text-align:right;white-space:nowrap;border-bottom:1px solid #e0ece8}
.friendly-standings th{background:#e1f3ed;color:#14554b;font-weight:800}
.friendly-standings th:nth-child(2),.friendly-standings td:nth-child(2){text-align:left;min-width:125px}
.friendly-standings tr:last-child td{border-bottom:0}
.friendly-standings tbody tr:nth-child(even){background:#f5faf8}
.friendly-standings:focus-visible{outline:3px solid #d6a127;outline-offset:2px}