@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');

:root{--ink:#e9efeb;--muted:#94a49b;--soft:#75877d;--deep:#091411;--panel:#101d18;--panel-2:#15251e;--line:rgba(221,238,226,.1);--green:#1a4535;--felt:#144833;--felt-light:#1b6244;--pink:#eeb7c9;--pink-dark:#cf8fa7;--gold:#e7c886;--sans:'DM Sans',system-ui,sans-serif;--display:'Manrope',system-ui,sans-serif;--mono:'DM Mono',monospace;--rack-color:#f2ceda;--shadow:0 24px 70px rgba(0,0,0,.34)}
*{box-sizing:border-box}html{color-scheme:dark;scroll-behavior:smooth}body{margin:0;background:radial-gradient(ellipse at 72% 4%,rgba(39,95,68,.17),transparent 36%),var(--deep);color:var(--ink);font-family:var(--sans);min-height:100vh}button,input{font:inherit}button{color:inherit;cursor:pointer}.app-frame{max-width:1512px;margin:0 auto;padding:0 54px}.topbar{height:94px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:11px;color:inherit;text-decoration:none}.brand-mark{width:42px;height:42px;display:grid;place-items:center;border:1px solid rgba(238,183,201,.43);border-radius:13px;color:var(--pink);font-family:var(--display);font-weight:800;font-size:14px;letter-spacing:-1px;box-shadow:inset 0 0 16px rgba(238,183,201,.07)}.brand-copy{display:grid;gap:3px}.brand-copy strong{font-family:var(--display);font-size:13px;letter-spacing:1.4px}.brand-copy small{font-family:var(--mono);font-size:8px;letter-spacing:1.2px;color:var(--soft)}.topbar-right{display:flex;align-items:center;gap:12px}.online-indicator{font-size:11px;color:var(--muted);margin-right:14px}.online-indicator i,.capacity-dot,.turn-chip i{display:inline-block;width:7px;height:7px;background:#8fd4a4;border-radius:50%;box-shadow:0 0 12px rgba(143,212,164,.55);margin-right:8px}.button{border:0;display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:12px 18px;border-radius:10px;font-weight:700;font-size:12px;transition:transform .2s,background .2s,border-color .2s,box-shadow .2s;text-decoration:none}.button:hover{transform:translateY(-1px)}.button-small{padding:10px 14px;font-size:11px}.button-primary{background:linear-gradient(135deg,#f1c8d5,#dc9fb5);color:#24131a;box-shadow:0 8px 24px rgba(225,167,187,.13)}.button-primary:hover{box-shadow:0 10px 30px rgba(225,167,187,.25)}.button-pink{background:rgba(238,183,201,.12);color:var(--pink);border:1px solid rgba(238,183,201,.2)}.button-outline{background:rgba(255,255,255,.025);border:1px solid rgba(230,240,232,.17);color:var(--ink)}.button-outline:hover{background:rgba(255,255,255,.07);border-color:rgba(230,240,232,.3)}.button-quiet{background:transparent;color:#bdcac1}.button-wide{width:100%;height:49px;justify-content:space-between;padding:0 17px}.auth-screen{min-height:calc(100vh - 165px);display:grid;grid-template-columns:minmax(440px,1.15fr) minmax(360px,.85fr);align-items:center;gap:clamp(48px,9vw,148px);padding:64px 7.5% 72px}.hero-copy{max-width:650px;position:relative}.eyebrow,.card-kicker{display:flex;align-items:center;gap:10px;font:500 9px var(--mono);letter-spacing:1.45px;color:var(--pink);text-transform:uppercase}.eyebrow-line{display:inline-block;width:22px;height:1px;background:var(--pink-dark)}.hero-copy h1{font:700 clamp(47px,6.1vw,85px)/.98 var(--display);letter-spacing:-5px;margin:25px 0 23px;color:#f0f4f0}.hero-copy h1 em{font-style:normal;color:var(--pink);font-weight:500}.hero-description{font-size:14px;line-height:1.8;max-width:410px;color:#a4b2aa;margin:0}.hero-details{display:flex;align-items:center;gap:13px;margin:31px 0 0;color:#dfe7e1}.detail-icon{width:32px;height:32px;border-radius:10px;background:rgba(238,183,201,.12);color:var(--pink);display:grid;place-items:center;font-size:16px}.hero-details strong,.hero-details small{display:block}.hero-details strong{font-size:10px}.hero-details small{font-size:9px;color:var(--soft);margin-top:4px}.detail-separator{width:1px;height:27px;background:var(--line);margin:0 5px 0 13px}.hero-table-preview{position:relative;margin:48px 0 0 28px;width:min(92%,475px);height:190px;border:1px solid rgba(196,229,205,.16);border-radius:100px;background:radial-gradient(ellipse,#1a5b3d 0%,#144530 55%,#103625 100%);box-shadow:inset 0 0 0 10px rgba(5,25,16,.21),inset 0 0 38px rgba(0,0,0,.31),0 20px 48px rgba(0,0,0,.22);transform:rotate(-3deg)}.hero-table-preview:after{content:"";position:absolute;inset:15px 22px;border:1px solid rgba(228,241,227,.09);border-radius:100px;pointer-events:none}.preview-glow{position:absolute;width:135px;height:90px;left:40%;top:43px;background:rgba(239,191,207,.08);filter:blur(30px);border-radius:50%}.preview-seat{position:absolute;z-index:1;display:flex;align-items:center;gap:7px;font-size:9px}.preview-seat-top{left:45%;top:-13px;flex-direction:column;gap:4px}.preview-seat-left{left:8px;top:45%;transform:translateY(-50%)}.preview-seat-right{right:8px;top:45%;transform:translateY(-50%)}.preview-seat-bottom{left:50%;bottom:-22px;transform:translateX(-50%);flex-direction:column;gap:0}.seat-avatar{width:27px;height:27px;flex:0 0 27px;border-radius:9px;display:grid;place-items:center;font-size:10px;font-weight:800;color:#26332b;border:1px solid rgba(255,255,255,.28);box-shadow:0 3px 10px rgba(0,0,0,.25)}.avatar-sage{background:#c2d9bd}.avatar-lilac{background:#d6caec}.avatar-blue{background:#bfd8e6}.avatar-pink{background:var(--pink)}.seat-name{font-size:8px;color:#d6e1d9}.hidden-rack{display:flex;gap:1px}.hidden-rack b,.rack-back i,.rack-side i{width:10px;height:18px;border-radius:3px;background:linear-gradient(135deg,#edc4d2,#cf91a7);border:1px solid rgba(255,255,255,.35);box-shadow:0 2px 5px rgba(0,0,0,.2)}.preview-center{position:absolute;inset:54px 0 0;display:grid;place-items:center;align-content:center;gap:7px}.discard-stack{display:flex;transform:rotate(2deg)}.tile{width:27px;height:38px;flex:0 0 27px;background:linear-gradient(155deg,#fcfbf5,#e7e5dc);border:1px solid rgba(40,48,42,.2);border-radius:5px;box-shadow:0 4px 7px rgba(0,0,0,.23);display:inline-flex;align-items:center;justify-content:center;position:relative;color:#26302a;line-height:1;transition:transform .22s,box-shadow .22s;user-select:none}.tile b{font:700 17px var(--display);letter-spacing:-1px}.tile small{position:absolute;bottom:2px;right:3px;font-size:4px;color:currentColor}.tile-red{color:#c54d60}.tile-blue{color:#3475a5}.tile-yellow{color:#b28731}.tile-black{color:#303b3a}.tile-joker{color:#6a5792}.table-caption{font:400 7px var(--mono);letter-spacing:1.2px;color:rgba(236,244,237,.52)}.my-rack{display:flex;align-items:end;justify-content:center;gap:2px}.preview-seat-bottom .my-rack{margin-top:3px}.preview-seat-bottom .tile{width:24px;height:32px;flex-basis:24px}.preview-seat-bottom .tile b{font-size:14px}.auth-card{width:100%;max-width:420px;justify-self:center;padding:31px 33px 22px;border:1px solid rgba(223,237,225,.11);border-radius:19px;background:linear-gradient(145deg,rgba(20,34,27,.97),rgba(12,23,18,.98));box-shadow:var(--shadow)}.auth-card-top{display:flex;justify-content:space-between;align-items:center}.lock-mark{color:#b9c6bc;font-size:18px}.auth-tabs{display:grid;grid-template-columns:1fr 1fr;gap:3px;background:rgba(0,0,0,.19);padding:4px;border-radius:10px;margin:23px 0 25px}.auth-tab{border:0;background:transparent;color:#829287;border-radius:7px;padding:10px;font-size:11px;font-weight:600}.auth-tab.is-active{background:#20332a;color:#f0f5f1;box-shadow:0 2px 8px rgba(0,0,0,.18)}.auth-card h2,.modal-heading h2{font:700 23px var(--display);letter-spacing:-.75px;margin:0}.auth-subtitle,.modal-heading p{font-size:11px;color:#91a096;margin:7px 0 22px}.field-label{display:block;font-size:10px;font-weight:700;color:#c9d4cc;margin-bottom:8px}.field-label-password{margin-top:17px}.input-wrap{height:45px;display:flex;align-items:center;gap:9px;padding:0 12px;border:1px solid rgba(226,239,227,.12);border-radius:9px;background:rgba(4,12,9,.3);transition:border-color .2s,box-shadow .2s}.input-wrap:focus-within{border-color:rgba(238,183,201,.61);box-shadow:0 0 0 3px rgba(238,183,201,.08)}.input-icon{color:#82948a;font-size:16px}.input-wrap input,.plain-input{min-width:0;width:100%;border:0;outline:0;background:transparent;color:#eef4ef;font-size:11px}.input-wrap input::placeholder,.plain-input::placeholder{color:#64766b}.password-toggle{border:0;background:transparent;color:#a6b3aa;font-size:9px}.form-message{font-size:10px;line-height:1.5;color:var(--pink);min-height:18px;margin:10px 0 4px}.auth-divider{display:flex;align-items:center;gap:10px;margin:19px 0 13px}.auth-divider span{height:1px;flex:1;background:var(--line)}.auth-divider small{font:400 8px var(--mono);color:#728177}.auth-footnote{text-align:center;color:#88988e;font-size:10px;margin:0 0 18px}.text-button{border:0;padding:0;background:none;color:var(--pink);font-size:10px;font-weight:700}.prototype-note{border-top:1px solid var(--line);padding-top:14px;display:flex;align-items:center;gap:8px;font-size:9px;line-height:1.5;color:#798a7e}.note-dot{width:6px;height:6px;flex:0 0 6px;border-radius:50%;background:var(--gold)}.page-footer{height:70px;display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);font:400 8px var(--mono);letter-spacing:1px;color:#6e7d73}.is-hidden{display:none!important}

/* Lobby workspace */
.workspace{min-height:calc(100vh - 165px);display:grid;grid-template-columns:220px 1fr;gap:56px;padding:46px 3.5% 55px}.sidebar{display:flex;flex-direction:column;min-height:620px;border-right:1px solid var(--line);padding-right:22px}.sidebar-section-label{font:500 8px var(--mono);letter-spacing:1.4px;color:#718177;margin:4px 0 16px 9px}.side-link{height:42px;width:100%;border:0;border-radius:8px;background:transparent;color:#99a89e;text-align:left;padding:0 10px;display:flex;align-items:center;gap:11px;font-size:11px;margin-bottom:5px}.side-link.is-active{background:rgba(238,183,201,.1);color:#f0ced9}.side-icon{font-size:15px;width:17px;text-align:center}.side-count{margin-left:auto;font:10px var(--mono);color:#9aaba0}.sidebar-bottom{margin-top:auto}.privacy-card{padding:16px;border-radius:12px;background:linear-gradient(145deg,rgba(27,74,52,.46),rgba(18,38,29,.46));border:1px solid rgba(181,224,187,.1)}.privacy-icon{width:24px;height:24px;display:grid;place-items:center;border-radius:7px;background:rgba(177,223,183,.1);color:#b2dcbc;margin-bottom:11px}.privacy-card strong{display:block;font-size:10px}.privacy-card p{font-size:9px;line-height:1.55;color:#85978b;margin:7px 0 0}.user-chip{display:flex;align-items:center;gap:9px;padding:17px 3px 0}.user-chip-copy{display:grid;gap:3px;min-width:0}.user-chip-copy strong{font-size:10px;max-width:110px;overflow:hidden;text-overflow:ellipsis}.user-chip-copy small{font:8px var(--mono);color:#728278;letter-spacing:.8px}.icon-button{width:31px;height:31px;border:1px solid rgba(232,243,233,.1);border-radius:8px;background:rgba(255,255,255,.025);display:grid;place-items:center;color:#a8b7ac;transition:background .2s,color .2s}.icon-button:hover{background:rgba(255,255,255,.08);color:white}.user-chip .icon-button{margin-left:auto}.main-panel{max-width:1050px;width:100%;margin:0 auto}.panel-heading{display:flex;align-items:end;justify-content:space-between;margin:6px 0 28px}.panel-heading h1{font:700 33px var(--display);letter-spacing:-1.5px;margin:14px 0 4px}.panel-heading p,.section-heading p{font-size:11px;color:#91a096;margin:0}.lobby-actions{display:grid;grid-template-columns:1.3fr .7fr;gap:12px}.join-card,.quick-card{min-height:103px;padding:17px;border-radius:12px;border:1px solid var(--line);background:linear-gradient(145deg,rgba(20,33,26,.9),rgba(15,27,21,.85))}.join-card-copy,.quick-card{display:flex;align-items:center;gap:12px}.join-card-copy{margin-bottom:14px}.action-icon{width:31px;height:31px;border-radius:9px;display:grid;place-items:center;flex:0 0 31px;font-size:15px}.action-icon-soft{background:rgba(190,211,198,.1);color:#c5d6cb}.action-icon-gold{background:rgba(231,200,134,.12);color:var(--gold)}.join-card-copy strong,.quick-card strong,.join-card-copy small,.quick-card small{display:block}.join-card-copy strong,.quick-card strong{font-size:10px}.join-card-copy small,.quick-card small{font-size:9px;color:#839287;margin-top:4px}.join-controls{display:flex;gap:8px}.join-controls input{flex:1;min-width:0;height:34px;border-radius:7px;border:1px solid rgba(226,239,227,.1);background:rgba(0,0,0,.16);padding:0 10px;outline:0;color:#edf5ef;font:10px var(--mono);letter-spacing:1.3px;text-transform:uppercase}.join-controls input:focus,.plain-input:focus{border-color:rgba(238,183,201,.55)}.quick-card{min-height:103px;padding:16px}.quick-card>span:nth-child(2){min-width:0}.quick-card .icon-plus{margin-left:auto;color:var(--gold);border-color:rgba(231,200,134,.22)}.section-heading{display:flex;align-items:end;justify-content:space-between;margin:38px 0 15px}.section-heading h2{font:700 16px var(--display);margin:0 0 5px}.capacity-note{font:9px var(--mono);color:#83948a}.capacity-dot{width:6px;height:6px;margin-right:5px}.lobby-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.lobby-card{border:1px solid rgba(223,239,225,.1);border-radius:13px;background:linear-gradient(135deg,rgba(21,38,29,.94),rgba(13,25,19,.94));padding:17px;animation:fadeUp .42s both;transition:transform .2s,border-color .2s}.lobby-card:hover{transform:translateY(-2px);border-color:rgba(238,183,201,.3)}.lobby-card-top{display:flex;justify-content:space-between;align-items:center}.lobby-title{font:700 12px var(--display)}.lobby-status{font:8px var(--mono);color:#a9d8b0;background:rgba(102,174,113,.1);padding:6px 8px;border-radius:20px}.lobby-code{font:500 12px var(--mono);letter-spacing:2px;color:var(--pink);margin:19px 0 4px}.lobby-code-label{font:8px var(--mono);letter-spacing:.8px;color:#6e7e73}.lobby-rule-row{display:flex;gap:6px;margin-top:15px}.rule-chip{padding:6px 8px;border:1px solid rgba(229,238,229,.11);border-radius:6px;font:8px var(--mono);letter-spacing:.5px;color:#b7c5ba}.lobby-seats{display:flex;gap:7px;margin:17px 0 16px}.seat-slot{width:30px;height:30px;border:1px dashed rgba(215,233,218,.18);border-radius:9px;display:grid;place-items:center;color:#65776c;font-size:11px}.seat-slot.filled{border-style:solid;background:rgba(238,183,201,.1);border-color:rgba(238,183,201,.27);color:var(--pink)}.lobby-card-actions{display:flex;gap:8px}.lobby-card-actions .button{flex:1}.empty-state{text-align:center;padding:54px 20px 41px;border:1px dashed rgba(221,238,226,.13);border-radius:13px;margin-top:13px}.empty-state h3{font:600 15px var(--display);margin:17px 0 6px}.empty-state p{font-size:10px;color:#87968c;max-width:310px;line-height:1.6;margin:0 auto 18px}.empty-tiles{display:flex;justify-content:center}.empty-tiles .tile{margin:0 -2px;width:31px;height:43px;flex-basis:31px}.prototype-banner{display:flex;align-items:center;gap:9px;margin-top:23px;padding:11px 12px;border-radius:8px;background:rgba(231,200,134,.055);border:1px solid rgba(231,200,134,.1);color:#a99c7f;font-size:9px;line-height:1.5}.banner-symbol{width:15px;height:15px;flex:0 0 15px;border:1px solid currentColor;border-radius:50%;display:grid;place-items:center;font:9px var(--mono)}

/* Create lobby modal */
.modal-layer{position:fixed;z-index:10;inset:0;display:grid;place-items:center;padding:20px}.modal-backdrop{position:absolute;inset:0;background:rgba(2,8,5,.76);backdrop-filter:blur(8px);animation:fadeIn .18s both}.modal-card{position:relative;width:min(100%,475px);max-height:min(94vh,780px);overflow:auto;border-radius:17px;background:linear-gradient(145deg,#17251d,#101a15);border:1px solid rgba(224,239,226,.14);box-shadow:0 25px 90px rgba(0,0,0,.56);padding:26px;animation:modalIn .25s cubic-bezier(.2,.9,.2,1) both}.modal-heading{display:flex;justify-content:space-between;align-items:start;margin-bottom:21px}.modal-heading h2{font-size:25px;margin-top:12px}.modal-heading p{margin:7px 0 0}.modal-close{font-size:18px}.plain-input{height:42px;padding:0 12px;border:1px solid rgba(226,239,227,.11);border-radius:8px;background:rgba(2,10,6,.24)}.optional-label{font-size:8px;color:#708076;font-weight:400;margin-left:5px}.modal-field{margin-top:18px}.segmented-control{display:grid;grid-template-columns:1fr 1fr;gap:8px}.segmented-control label{position:relative;cursor:pointer}.segmented-control input{position:absolute;opacity:0;pointer-events:none}.segmented-control label span{min-height:55px;border:1px solid rgba(225,239,225,.11);border-radius:9px;padding:10px 11px;display:flex;flex-direction:column;gap:5px;font-size:10px;font-weight:700;color:#acbbb0;transition:background .2s,border-color .2s,color .2s}.segmented-control label small{font-weight:400;font-size:8px;color:#788a7d}.segmented-control input:checked+span{border-color:rgba(238,183,201,.47);background:rgba(238,183,201,.09);color:#f5d8e1}.segmented-control input:checked+span small{color:#caabb5}.switch-row{display:flex;align-items:center;justify-content:space-between;border:1px solid rgba(225,239,225,.1);border-radius:9px;padding:11px;margin-top:18px;position:relative;cursor:pointer}.switch-row span strong,.switch-row span small{display:block}.switch-row span strong{font-size:10px}.switch-row span small{font-size:8px;color:#7f9084;margin-top:4px}.switch-row input{position:absolute;opacity:0;right:14px}.switch-ui{width:33px;height:19px;border-radius:12px;background:#34443a;position:relative;transition:background .2s}.switch-ui:after{content:"";position:absolute;left:3px;top:3px;width:13px;height:13px;border-radius:50%;background:#bac6bc;transition:transform .2s,background .2s}.switch-row input:checked+.switch-ui{background:#a9677f}.switch-row input:checked+.switch-ui:after{transform:translateX(14px);background:#fff2f6}.room-note{display:flex;align-items:center;gap:9px;background:rgba(222,236,223,.035);border-radius:8px;padding:10px;margin:14px 0 17px}.room-note span{color:var(--gold)}.room-note p{font-size:8px;color:#8c9c90;margin:0}.modal-card .button-wide{margin-top:1px}

/* Okey table preview */
.game-screen{min-height:calc(100vh - 164px);padding:20px 0 30px}.game-header{display:flex;align-items:center;justify-content:space-between;padding:3px 0 16px;border-bottom:1px solid var(--line)}.game-brand{display:flex;align-items:center;gap:9px;font:500 9px var(--mono);letter-spacing:1.1px;color:#a9b6ac}.brand-mark-small{width:31px;height:31px;border-radius:9px;font-size:11px}.game-header-right{display:flex;align-items:center;gap:8px}.room-code-chip{border:1px solid rgba(238,183,201,.2);border-radius:7px;padding:8px 10px;font:8px var(--mono);letter-spacing:.7px;color:#84958a}.room-code-chip b{color:var(--pink);margin-left:5px;letter-spacing:1.4px}.game-toolbar{display:flex;align-items:center;justify-content:space-between;padding:15px 4px}.turn-chip{font-size:10px;color:#bcc8bf}.turn-chip i{width:6px;height:6px}.game-toolbar-right{display:flex;align-items:center;gap:7px}.game-toolbar-right .rule-chip{font-size:8px}.felt-table{height:min(66vh,600px);min-height:480px;border-radius:45%;position:relative;overflow:hidden;background:radial-gradient(ellipse at 50% 47%,#1e6648 0,#18583d 48%,#12462f 76%,#0d3725 100%);border:12px solid #352c24;box-shadow:inset 0 0 0 2px rgba(224,193,151,.18),inset 0 0 80px rgba(0,0,0,.4),0 18px 45px rgba(0,0,0,.31);isolation:isolate}.felt-table:before{content:"";position:absolute;inset:12px;border:1px solid rgba(238,247,236,.13);border-radius:45%;pointer-events:none}.felt-texture{position:absolute;inset:0;opacity:.12;background-image:radial-gradient(rgba(240,255,238,.28) .6px,transparent .9px);background-size:8px 8px;mask-image:radial-gradient(ellipse,black,transparent 80%)}.seat{position:absolute;z-index:1;display:grid;justify-items:center;gap:8px}.seat-top{top:19px;left:50%;transform:translateX(-50%)}.seat-left{left:17px;top:48%;transform:translateY(-50%)}.seat-right{right:17px;top:48%;transform:translateY(-50%)}.seat-bottom{bottom:8px;left:50%;transform:translateX(-50%);width:min(76%,760px)}.player-head{display:flex;align-items:center;gap:7px;min-width:145px;padding:5px 8px;background:rgba(3,19,11,.42);border:1px solid rgba(225,244,228,.12);border-radius:10px;backdrop-filter:blur(7px)}.player-label{font:500 8px var(--mono);letter-spacing:.7px;color:#e1eee3}.player-label small{display:block;margin-top:3px;font:400 6px var(--mono);letter-spacing:.4px;color:#9bb1a0}.player-points{margin-left:auto;color:#f0d9a4;font:500 10px var(--mono);white-space:nowrap}.player-points small{display:block;text-align:right;color:#a4b5a7;font-size:6px;margin-top:2px}.opponent-rack{display:flex;gap:2px}.rack-back i{width:16px;height:23px;border-radius:4px;background:linear-gradient(140deg,#f0c9d5,#bd7e96);border-color:rgba(255,255,255,.35)}.rack-side{height:26px}.rack-side i{width:13px;height:23px}.rack-side i:nth-child(even){transform:translateY(-2px)}.table-center{position:absolute;left:50%;top:47%;transform:translate(-50%,-50%);width:min(55%,440px);height:220px;display:grid;grid-template-columns:54px 1fr 48px;align-items:center;gap:17px}.deck-stack{width:42px;height:55px;position:relative;display:grid;place-items:center}.deck-stack span{position:absolute;inset:0;border-radius:5px;border:1px solid rgba(255,255,255,.35);background:linear-gradient(135deg,#e9d9ba,#9d865e);box-shadow:0 4px 10px rgba(0,0,0,.22)}.deck-stack span:nth-child(2){transform:translate(-3px,-3px)}.deck-stack span:nth-child(3){transform:translate(-6px,-6px)}.deck-stack b{z-index:2;position:relative;font:7px var(--mono);letter-spacing:.5px;color:#332b20}.public-melds{display:grid;gap:14px;justify-items:center}.meld{display:flex;padding:5px 7px;border-radius:8px;background:rgba(7,28,17,.27);box-shadow:0 4px 10px rgba(0,0,0,.12)}.meld .tile{width:35px;height:48px;flex-basis:35px;margin-left:-1px}.meld .tile b{font-size:20px}.discard-pile{display:grid;justify-items:center;gap:5px}.discard-pile .tile{width:33px;height:46px;flex-basis:33px}.discard-pile>small{font:6px var(--mono);letter-spacing:.6px;color:rgba(238,245,237,.58)}.my-player-head{width:100%;max-width:680px;margin-bottom:2px}.rack-color-button{margin-left:auto;border:0;background:transparent;color:#f4d8e1;font:7px var(--mono);letter-spacing:.7px}.rack-color-button span{color:var(--pink);margin-left:5px}.my-rack{width:100%;display:flex;justify-content:center;align-items:end;gap:3px;min-height:73px;padding:8px 13px 4px;border-radius:11px 11px 5px 5px;background:linear-gradient(180deg,#efd0db,#d8a6b7 54%,#c98da2);border:1px solid rgba(255,255,255,.4);box-shadow:0 8px 20px rgba(0,0,0,.25),inset 0 1px rgba(255,255,255,.6);transition:background .35s}.my-rack .tile{width:38px;height:55px;flex:1 1 35px;max-width:49px;border-radius:6px;margin:0 -1px;animation:tileDeal .48s both;cursor:pointer}.my-rack .tile:nth-child(2n){animation-delay:.025s}.my-rack .tile b{font-size:23px}.my-rack .tile:hover{transform:translateY(-8px) rotate(-1deg);box-shadow:0 12px 15px rgba(0,0,0,.3);z-index:2}.my-rack .tile.is-selected{transform:translateY(-12px);box-shadow:0 0 0 2px rgba(255,255,255,.82),0 11px 15px rgba(0,0,0,.3);z-index:2}.rack-actions{width:100%;display:flex;align-items:center;justify-content:space-between;margin-top:8px}.rack-actions .button{min-width:94px}.rack-hint{font-size:8px;color:#c3d5c7}.game-footer{display:flex;justify-content:space-between;align-items:center;padding:13px 7px;font:8px var(--mono);letter-spacing:.5px;color:#839488}.game-footer button{border:0;background:none;color:var(--pink);font:inherit}.toast{position:fixed;z-index:20;right:24px;bottom:25px;max-width:min(380px,calc(100% - 48px));padding:13px 16px;border:1px solid rgba(238,183,201,.24);border-radius:10px;background:#17271f;color:#ead7dd;font-size:11px;box-shadow:0 12px 30px rgba(0,0,0,.35);animation:fadeUp .25s both}.toast.is-error{border-color:rgba(231,134,134,.35);color:#f4c7c7}.toast.is-success{border-color:rgba(143,212,164,.3);color:#cdebd2}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes fadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes modalIn{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes tileDeal{from{opacity:0;transform:translateY(-12px) rotate(4deg)}to{opacity:1;transform:translateY(0) rotate(0)}}
@media(max-width:1100px){.app-frame{padding:0 30px}.auth-screen{padding-left:3%;padding-right:3%;gap:50px}.hero-copy h1{font-size:66px}.workspace{gap:28px;padding-left:1%;padding-right:1%}.table-center{width:57%;gap:10px}}
@media(max-width:790px){.app-frame{padding:0 20px}.topbar{height:74px}.online-indicator{display:none}.auth-screen{min-height:auto;grid-template-columns:1fr;gap:39px;padding:54px 0 52px}.hero-copy{max-width:600px}.hero-copy h1{font-size:60px}.hero-table-preview{margin-top:37px;height:165px}.auth-card{max-width:500px}.workspace{grid-template-columns:1fr;gap:21px;padding:28px 0 45px}.sidebar{min-height:0;border-right:0;border-bottom:1px solid var(--line);padding:0 0 13px;display:flex;flex-direction:row;align-items:center;gap:6px}.sidebar-section-label,.sidebar-bottom{display:none}.side-link{width:auto;padding:0 12px;margin:0}.main-panel{width:100%}.felt-table{height:620px;min-height:560px;border-radius:34%}.felt-table:before{border-radius:34%}.seat-left{left:8px}.seat-right{right:8px}.seat-left .player-head,.seat-right .player-head{min-width:0;padding:4px}.seat-left .player-label,.seat-right .player-label{display:none}.table-center{width:64%;grid-template-columns:40px 1fr 40px;gap:7px}.my-rack{gap:2px;padding:7px 8px 4px}.my-rack .tile{height:48px}.my-rack .tile b{font-size:19px}.seat-bottom{width:88%}.game-footer{font-size:7px}}
@media(max-width:520px){.app-frame{padding:0 14px}.topbar{height:68px}.brand-mark{width:36px;height:36px}.brand-copy strong{font-size:11px}.brand-copy small{font-size:7px}.topbar-right{gap:4px}.topbar-right .button{padding:9px 10px;font-size:9px}.hero-copy h1{font-size:49px;letter-spacing:-3px}.hero-description{font-size:12px}.hero-details{flex-wrap:wrap;gap:9px}.hero-details strong{font-size:9px}.hero-details small{font-size:8px}.detail-separator{margin:0 2px;height:22px}.hero-table-preview{width:96%;margin-left:8px;height:140px}.preview-seat-left{left:4px}.preview-seat-right{right:4px}.preview-seat-bottom .tile{width:20px;height:27px;flex-basis:20px}.preview-seat-bottom .tile b{font-size:11px}.auth-card{padding:24px 20px 18px}.page-footer{font-size:6px}.panel-heading{align-items:center}.panel-heading h1{font-size:27px}.panel-heading p{font-size:9px;max-width:220px;line-height:1.5}.panel-heading>.button{padding:11px 12px;font-size:10px}.lobby-actions{grid-template-columns:1fr}.quick-card{min-height:72px}.section-heading{margin-top:27px}.capacity-note{font-size:7px}.lobby-grid{grid-template-columns:1fr}.felt-table{height:570px;min-height:550px;border-width:8px;border-radius:29%}.felt-table:before{border-radius:29%;inset:8px}.seat-top{top:14px}.seat-top .player-head{min-width:130px}.seat-bottom{width:96%;bottom:6px}.my-player-head{max-width:100%;gap:5px}.rack-color-button{font-size:6px;letter-spacing:0}.my-rack{min-height:61px;gap:1px;padding:6px 4px 3px}.my-rack .tile{height:42px;min-width:16px;padding:0}.my-rack .tile b{font-size:15px}.my-rack .tile small{font-size:3px}.my-rack .tile-joker small{display:none}.player-label{font-size:7px}.player-points{font-size:8px}.rack-actions .button{min-width:0;padding:9px 8px;font-size:9px}.rack-hint{display:none}.table-center{top:47%;width:70%;grid-template-columns:31px 1fr 33px;gap:4px}.deck-stack{transform:scale(.8)}.meld .tile{width:29px;height:41px;flex-basis:29px}.meld .tile b{font-size:16px}.discard-pile .tile{width:28px;height:40px;flex-basis:28px}.game-header-right .button{display:none}.game-brand{font-size:7px}.game-header>.button{padding:8px;font-size:9px}.game-toolbar{padding:10px 1px}.game-toolbar-right{gap:4px}.game-toolbar-right .rule-chip{font-size:6px;padding:5px}.game-footer{font-size:6px;padding:10px 2px}.game-footer span:nth-child(2){display:none}.modal-card{padding:21px 17px}.prototype-banner{font-size:8px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* Local table-preview controls and the saved house-rule notes. */
.deck-stack{appearance:none;border:0;padding:0;color:inherit;cursor:pointer;background:transparent}
.deck-stack:focus-visible,.tile:focus-visible{outline:2px solid #f4d8e1;outline-offset:4px}
.my-rack .tile{min-width:0}
.rack-actions button:disabled{opacity:.42;cursor:not-allowed;transform:none;box-shadow:none}
.tile-drawn{animation:tileDraw .36s cubic-bezier(.2,.8,.25,1) both!important}
.score-card{width:min(100%,560px)}
.score-rules{list-style:none;padding:0;margin:0 0 22px;display:grid;gap:9px}
.score-rules li{padding:12px 13px;border:1px solid rgba(223,237,225,.09);border-radius:10px;background:rgba(4,12,9,.2)}
.score-rules strong,.score-rules span{display:block}
.score-rules strong{font-size:11px;color:#f0d9a4;margin-bottom:5px}
.score-rules span{font-size:10px;line-height:1.55;color:#aebdb2}
@keyframes tileDraw{from{opacity:.55;transform:translateY(-16px) scale(.92)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(max-width:520px){.score-rules li{padding:10px}.score-rules span{font-size:9px}}

/* Gifts, spectators, chat and small-screen table controls. */
.credit-chip{padding:7px 9px;border:1px solid rgba(238,183,201,.24);border-radius:999px;color:#f4d8e1;background:rgba(238,183,201,.08);font:600 8px var(--mono);white-space:nowrap}
.game-screen.is-spectator .seat-bottom .my-rack,.game-screen.is-spectator .seat-bottom .rack-actions,.game-screen.is-spectator .seat-bottom .player-points,.game-screen.is-spectator .rack-color-button{display:none}
.spectator-note{margin:9px auto 0;padding:9px 13px;width:max-content;max-width:100%;border:1px solid rgba(238,183,201,.24);border-radius:999px;background:rgba(8,31,19,.55);color:#f4d8e1;font-size:10px;text-align:center}
.gift-card{width:min(100%,490px)}
.gift-card .plain-input{margin-bottom:16px}
.gift-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.gift-option{min-height:92px;padding:12px;border:1px solid rgba(223,237,225,.12);border-radius:12px;background:rgba(4,12,9,.27);display:grid;grid-template-columns:38px 1fr;grid-template-rows:auto auto;align-items:center;text-align:left;transition:transform .18s,border-color .18s,background .18s}
.gift-option:hover,.gift-option:focus-visible{transform:translateY(-2px);border-color:rgba(238,183,201,.4);background:rgba(238,183,201,.07)}
.gift-emoji{grid-row:1/3;font-size:25px;text-align:center}
.gift-option strong{font-size:11px}
.gift-option small{font:8px var(--mono);color:var(--pink)}
.gift-credit-note{margin:14px 0;color:#aebdb2;font-size:9px}
.gift-credit-note strong{color:#f4d8e1;font:600 10px var(--mono)}
.gift-floats{position:fixed;z-index:16;inset:0;pointer-events:none;display:grid;place-items:center}
.gift-float{position:absolute;top:42%;display:flex;align-items:center;gap:10px;padding:11px 16px;border:1px solid rgba(238,183,201,.42);border-radius:999px;background:rgba(13,34,24,.95);color:#f6e9ed;box-shadow:0 12px 40px rgba(0,0,0,.3);font-size:11px;animation:giftFly 2.5s cubic-bezier(.18,.72,.2,1) both}
.gift-float span:first-child{font-size:25px}
.chat-launcher{position:fixed;z-index:25;right:24px;bottom:22px;min-height:46px;padding:0 17px;border:1px solid rgba(238,183,201,.35);border-radius:999px;background:linear-gradient(135deg,#f1c8d5,#dc9fb5);color:#24131a;font-weight:800;font-size:11px;box-shadow:0 9px 24px rgba(0,0,0,.34)}
.chat-launcher i{margin-left:7px;font:normal 8px var(--mono)}
.chat-panel{position:fixed;z-index:26;right:22px;bottom:78px;width:min(355px,calc(100vw - 28px));height:min(480px,calc(100dvh - 110px));min-height:280px;display:flex;flex-direction:column;border:1px solid rgba(223,237,225,.15);border-radius:16px;background:#101d18;box-shadow:0 22px 70px rgba(0,0,0,.5);overflow:hidden}
.chat-header{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-bottom:1px solid var(--line)}
.chat-header strong,.chat-header small{display:block}.chat-header strong{font-size:12px}.chat-header small{margin-top:4px;color:var(--muted);font-size:9px}
.chat-messages{flex:1;min-height:0;overflow:auto;padding:12px;display:flex;flex-direction:column;gap:9px}
.chat-empty{margin:auto;color:var(--muted);font-size:10px;text-align:center}
.chat-message{max-width:88%;padding:9px 10px;border:1px solid rgba(223,237,225,.09);border-radius:10px;background:#17271f;align-self:flex-start;overflow-wrap:anywhere}
.chat-message.is-own{align-self:flex-end;border-color:rgba(238,183,201,.18);background:#2b2026}
.chat-message-heading{display:flex;justify-content:space-between;gap:16px;color:var(--pink);font-size:9px}
.chat-message-heading time{color:var(--soft);font:8px var(--mono)}
.chat-message p{margin:5px 0 0;color:#e8eee9;font-size:10px;line-height:1.5;white-space:pre-wrap}
.chat-compose{display:flex;gap:7px;padding:10px;border-top:1px solid var(--line)}
.chat-compose input{flex:1;min-width:0;height:40px;padding:0 11px;border:1px solid rgba(223,237,225,.13);border-radius:9px;background:#091411;color:var(--ink);font-size:11px}
.chat-compose button{width:42px;min-height:40px;border:0;border-radius:9px;background:var(--pink);color:#24131a;font-size:18px;font-weight:800}
.chat-preview-note{padding:0 12px 9px;color:var(--soft);font:7px var(--mono);text-align:center}
.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}
@keyframes giftFly{0%{opacity:0;transform:translateY(30px) scale(.8)}18%{opacity:1;transform:translateY(0) scale(1.05)}35%{transform:translateY(-5px) scale(1)}78%{opacity:1}100%{opacity:0;transform:translateY(-28px) scale(.96)}}
@media(max-width:790px){.game-toolbar{align-items:flex-start;gap:9px}.game-toolbar-right{flex-wrap:wrap;justify-content:flex-end;gap:5px}.game-toolbar-right .button{padding:8px 9px;font-size:9px}.lobby-card-actions{display:flex;flex-wrap:wrap;gap:6px}.lobby-card-actions .button{flex:1 1 auto}}
@media(max-width:520px){.credit-chip{font-size:7px;padding:6px 7px}.game-toolbar{flex-wrap:wrap}.game-toolbar-right{width:100%;justify-content:space-between}.game-toolbar-right .button{font-size:8px;padding:7px}.spectator-note{font-size:8px;padding:8px}.chat-launcher{right:12px;bottom:12px;min-height:48px}.chat-panel{right:10px;bottom:68px;width:calc(100vw - 20px);height:min(62dvh,460px);min-height:270px}.gift-card{padding:20px 16px}.gift-option{min-height:78px;padding:9px}.gift-emoji{font-size:22px}}

/* Phone touch targets, safe areas, and a horizontally scrollable 22-tile rack. */
#gift-modal{z-index:30}
.game-screen.is-spectator .opponent-rack,.game-screen.is-spectator .deck-stack{visibility:hidden}
.chat-launcher,.chat-panel{bottom:calc(22px + env(safe-area-inset-bottom,0px))}
.chat-panel{bottom:calc(78px + env(safe-area-inset-bottom,0px))}
.modal-card{max-height:min(94vh,780px);max-height:min(94dvh,780px)}
@media(max-width:520px){
  .game-screen{padding-bottom:calc(82px + env(safe-area-inset-bottom,0px))}
  .my-rack{justify-content:flex-start;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:rgba(61,50,55,.55) transparent;touch-action:pan-x}
  .my-rack .tile{flex:0 0 22px;width:22px;max-width:none;height:42px;border-radius:5px}
  .my-rack .tile b{font-size:13px}
  .my-rack .tile.is-selected{transform:translateY(-8px)}
  .rack-actions .button{min-height:42px;padding:9px 7px}
  .game-toolbar-right .button{min-height:40px}
  .game-header>.button,.game-header-right .button{min-height:40px}
  .modal-layer{padding:12px;padding-bottom:calc(12px + env(safe-area-inset-bottom,0px));overflow-y:auto}
  .modal-card{width:100%;max-height:calc(100dvh - 24px);padding:18px 15px}
  .gift-option{min-height:76px}
  .chat-launcher{right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));min-height:48px}
  .chat-panel{right:10px;bottom:calc(68px + env(safe-area-inset-bottom,0px));height:min(62dvh,460px);min-height:min(270px,50dvh)}
}
@media(max-width:900px) and (max-height:520px){
  .game-screen{padding-top:8px}
  .felt-table{height:min(82dvh,440px);min-height:400px;border-radius:100px}
  .felt-table:before{border-radius:100px}
  .game-toolbar{padding:8px 2px}
}

/* Selectable rack finishes; dusty pink remains the default and a permanent option. */
:root{--rack-tone-top:#efd0db;--rack-tone-mid:#d8a6b7;--rack-tone-bottom:#c98da2}
.my-rack{background:linear-gradient(180deg,var(--rack-tone-top),var(--rack-tone-mid) 54%,var(--rack-tone-bottom))}
#rack-color-modal{z-index:31}
.rack-color-card{width:min(100%,500px)}
.rack-color-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.rack-color-option{min-height:82px;display:grid;grid-template-columns:48px 1fr;grid-template-rows:auto auto;align-items:center;gap:3px 10px;padding:10px 12px;border:1px solid rgba(223,237,225,.12);border-radius:11px;background:rgba(4,12,9,.27);text-align:left;transition:border-color .18s,background .18s,transform .18s}
.rack-color-option:hover,.rack-color-option:focus-visible{transform:translateY(-1px);border-color:rgba(238,183,201,.4)}
.rack-color-option.is-selected{border-color:rgba(238,183,201,.58);background:rgba(238,183,201,.09)}
.rack-color-swatch{grid-row:1/3;width:46px;height:38px;border:1px solid rgba(255,255,255,.55);border-radius:8px;box-shadow:0 3px 8px rgba(0,0,0,.2),inset 0 1px rgba(255,255,255,.5)}
.swatch-dusty-pink{background:linear-gradient(180deg,#efd0db,#d8a6b7 54%,#c98da2)}
.swatch-sage{background:linear-gradient(180deg,#d5e1d2,#a9c4aa 54%,#7fa786)}
.swatch-ocean{background:linear-gradient(180deg,#d4e2ef,#a2bdd4 54%,#7298b5)}
.swatch-lavender{background:linear-gradient(180deg,#e4dcef,#c2b2d9 54%,#9c88bd)}
.swatch-sand{background:linear-gradient(180deg,#eee1c9,#d3bd98 54%,#b2966b)}
.rack-color-option strong{font-size:11px}
.rack-color-option small{font-size:9px;color:var(--muted)}
@media(max-width:520px){.rack-color-option{min-height:74px;padding:8px}.rack-color-option strong{font-size:10px}.rack-color-swatch{width:40px;height:34px}.rack-color-button{min-height:44px;min-width:44px;padding:5px 2px}}

/* Low-contrast rack patterns stay under the tile faces. */
.my-rack{position:relative;isolation:isolate}
.my-rack::before{content:"";position:absolute;z-index:0;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .2s,background-image .2s}
.my-rack>.tile{z-index:1}
.my-rack.pattern-ottoman::before{opacity:.25;background-image:repeating-linear-gradient(45deg,transparent 0 8px,rgba(248,224,173,.8) 8px 9px,transparent 9px 17px),repeating-linear-gradient(-45deg,transparent 0 8px,rgba(248,224,173,.65) 8px 9px,transparent 9px 17px);background-size:28px 28px}
.my-rack.pattern-tulip::before{opacity:.28;background-image:radial-gradient(ellipse at 50% 25%,transparent 4px,rgba(255,239,195,.85) 4.5px 5px,transparent 5.5px),linear-gradient(90deg,transparent 48%,rgba(255,239,195,.65) 49% 51%,transparent 52%);background-size:30px 36px}
.my-rack.pattern-tilework::before{opacity:.25;background-image:repeating-linear-gradient(0deg,transparent 0 12px,rgba(255,244,220,.82) 12px 13px),repeating-linear-gradient(90deg,transparent 0 20px,rgba(255,244,220,.82) 20px 21px),repeating-linear-gradient(45deg,transparent 0 14px,rgba(255,244,220,.45) 14px 15px);background-size:28px 28px}
.my-rack.pattern-manifest::before{opacity:1;background-image:linear-gradient(rgba(18,13,22,.24),rgba(18,13,22,.24)),var(--rack-photo-images,url("assets/manifest-group.jpg"));background-size:var(--rack-photo-sizes,100% 100%,cover);background-position:var(--rack-photo-positions,center,center 22%);background-repeat:var(--rack-photo-repeats,no-repeat)}
.my-rack.pattern-zoktay::before{opacity:1;background-image:linear-gradient(rgba(18,13,22,.26),rgba(18,13,22,.26)),url("assets/zoktay.jpg");background-size:100% 100%,cover;background-position:center,center 35%;background-repeat:no-repeat}
.my-rack.pattern-sueda::before{opacity:1;background-image:linear-gradient(rgba(18,24,16,.3),rgba(18,24,16,.3)),url("assets/sueda.jpg");background-size:100% 100%,cover;background-position:center,center 42%;background-repeat:no-repeat}
.rack-customize-section{margin-top:22px}
.rack-customize-heading{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:9px}
.rack-customize-heading strong{font-size:11px}
.rack-customize-heading small{font-size:8px;color:var(--muted)}
.rack-pattern-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.rack-pattern-option{min-height:70px;display:flex;align-items:center;gap:9px;padding:8px;border:1px solid rgba(223,237,225,.12);border-radius:10px;background:rgba(4,12,9,.25);text-align:left;transition:border-color .18s,background .18s}
.rack-pattern-option.is-selected{border-color:rgba(238,183,201,.58);background:rgba(238,183,201,.08)}
.rack-pattern-option strong{font-size:9px}
.rack-pattern-sample{width:42px;height:34px;flex:0 0 42px;border:1px solid rgba(255,255,255,.28);border-radius:7px;box-shadow:inset 0 0 9px rgba(0,0,0,.15)}
.pattern-sample-plain{background:linear-gradient(180deg,#efd0db,#c98da2)}
.pattern-sample-ottoman{background-color:#b88b62;background-image:repeating-linear-gradient(45deg,transparent 0 5px,#f2dcae 5px 6px,transparent 6px 11px),repeating-linear-gradient(-45deg,transparent 0 5px,#f2dcae 5px 6px,transparent 6px 11px);background-size:18px 18px}
.pattern-sample-tulip{background-color:#a86e83;background-image:radial-gradient(ellipse at 50% 25%,transparent 3px,#f4d9bd 3.5px 4px,transparent 4.5px),linear-gradient(90deg,transparent 48%,#f4d9bd 49% 51%,transparent 52%);background-size:21px 26px}
.pattern-sample-tilework{background-color:#557f88;background-image:repeating-linear-gradient(0deg,transparent 0 8px,#f0dfbb 8px 9px),repeating-linear-gradient(90deg,transparent 0 12px,#f0dfbb 12px 13px);background-size:18px 18px}
.pattern-sample-manifest{background-image:linear-gradient(rgba(18,13,22,.12),rgba(18,13,22,.12)),url("assets/manifest-group.jpg");background-size:cover;background-position:center}
.pattern-sample-zoktay{background-image:linear-gradient(rgba(18,13,22,.08),rgba(18,13,22,.08)),url("assets/zoktay.jpg");background-size:cover;background-position:center 35%}
.pattern-sample-sueda{background-image:linear-gradient(rgba(18,24,16,.1),rgba(18,24,16,.1)),url("assets/sueda.jpg");background-size:cover;background-position:center 42%}
.rack-photo-picker{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:12px;padding:11px;border:1px dashed rgba(238,183,201,.3);border-radius:10px;background:rgba(238,183,201,.035)}
.rack-photo-picker strong,.rack-photo-picker small{display:block}.rack-photo-picker strong{font-size:9px}.rack-photo-picker small{margin-top:4px;font-size:8px;color:var(--muted)}
.rack-photo-picker input{max-width:45%;font-size:8px;color:var(--muted)}
.rack-photo-status{min-height:14px;margin-top:7px;color:var(--soft);font-size:8px;line-height:1.5}
.rack-photo-preview{display:flex;gap:6px;overflow-x:auto;margin-top:8px;padding:2px}
.rack-photo-preview img{width:46px;height:38px;flex:0 0 46px;object-fit:cover;border:1px solid rgba(255,255,255,.28);border-radius:6px}
.rack-clear-photos{margin-top:6px}
.rack-customize-done{margin-top:16px}
@media(max-width:520px){.rack-pattern-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.rack-pattern-option{min-height:62px}.rack-photo-picker{align-items:flex-start;flex-direction:column}.rack-photo-picker input{max-width:100%;width:100%}.rack-customize-heading small{font-size:7px}}
.meld-builder-help{font-size:10px;line-height:1.6;color:#9aaba0;margin:15px 0}.draft-group-list{display:grid;gap:7px;margin:12px 0}.draft-group-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 10px;border:1px solid rgba(225,239,225,.1);border-radius:8px;background:rgba(2,10,6,.18);font-size:9px;color:#d2ded5}.draft-group-row span{min-width:0;line-height:1.5}.draft-group-row .button{flex:0 0 auto;min-width:auto;padding:7px 9px}.meld-builder-card .button-wide{margin-top:9px}.rack-actions{flex-wrap:wrap;gap:6px}.rack-actions .rack-hint{flex:1 1 100%;order:3}.rack-actions [data-action="preview-discard"]{margin-left:auto}@media(max-width:520px){.rack-actions{justify-content:center;gap:5px}.rack-actions .button{flex:1 1 auto;min-height:39px}.rack-actions [data-action="preview-discard"]{margin-left:0}.rack-actions [data-action="preview-draw"]{order:0}.rack-actions [data-action="sort-rack"]{order:1}.rack-actions [data-action="open-meld-builder"],.rack-actions [data-action="add-selected"]{order:2}.rack-actions [data-action="preview-discard"]{order:3}}
.builder-hand{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:5px;max-height:min(32vh,250px);overflow:auto;padding:4px}.builder-hand .tile{width:100%;height:46px;max-width:none;flex:initial;margin:0;cursor:pointer}.builder-hand .tile.is-selected{transform:translateY(-4px);box-shadow:0 0 0 2px rgba(255,255,255,.82),0 6px 11px rgba(0,0,0,.28)}.builder-hand .tile b{font-size:19px}.builder-hand .tile small{font-size:5px}@media(max-width:520px){.builder-hand{grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;max-height:27vh}.builder-hand .tile{height:42px}.builder-hand .tile b{font-size:16px}.meld-builder-card{padding:18px 14px}}
.live-scoreboard{padding:11px 12px;margin:-4px 0 18px;border:1px solid rgba(238,183,201,.18);border-radius:9px;background:rgba(2,10,6,.18);font-size:10px;color:#e4eee6}.live-scoreboard>strong{display:block;color:#f1cdd9;margin-bottom:8px}.live-score-list{display:grid;gap:5px}.live-score-row{display:flex;justify-content:space-between;gap:12px;color:#9caea1}.live-score-row b{color:#f0d9a4;font:600 10px var(--mono)}
.game-screen.is-spectator .seat .opponent-rack{display:none}.game-screen.is-spectator .deck-stack{visibility:hidden}
.assist-hint-list{display:grid;gap:7px;max-height:min(58vh,480px);overflow:auto}.assist-hint-option{width:100%;padding:11px 12px;border:1px solid rgba(225,239,225,.11);border-radius:8px;background:rgba(2,10,6,.22);color:#d9e5dc;text-align:left;font-size:10px;line-height:1.5;cursor:pointer;transition:background .18s,border-color .18s}.assist-hint-option:hover,.assist-hint-option:focus-visible{background:rgba(238,183,201,.09);border-color:rgba(238,183,201,.4)}.assist-empty{font-size:10px;line-height:1.6;color:#aab9ae}.assist-card{max-width:510px}