:root{
  --page:#030713;
  --ink:#fff8df;
  --muted:#b9d9ee;
  --line:rgba(172,230,255,.24);
  --line-strong:rgba(255,229,139,.34);
  --panel:rgba(9,30,62,.78);
  --panel-2:rgba(18,55,96,.82);
  --panel-3:rgba(8,20,42,.92);
  --navy:#07152c;
  --blue:#126cd0;
  --blue-2:#21c7ff;
  --green:#28c948;
  --green-2:#78f36a;
  --gold:#ffd86e;
  --gold-2:#f39922;
  --red:#e03342;
  --purple:#9d5cff;
  --tile-red:#db293c;
  --tile-blue:#1774df;
  --tile-black:#1e2a37;
  --tile-orange:#e98d20;
  --radius-sm:10px;
  --radius-md:14px;
  --radius-lg:20px;
  --radius-xl:28px;
  --shadow-sm:0 8px 18px rgba(0,0,0,.22);
  --shadow-md:0 16px 36px rgba(0,0,0,.34);
  --shadow-lg:0 32px 90px rgba(0,0,0,.55);
  --font:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  --display:Impact,"Arial Narrow",var(--font);
}
*{box-sizing:border-box;min-width:0}
html,body{width:100%;height:100%;margin:0;overflow:hidden;background:var(--page);color:var(--ink);font-family:var(--font);-webkit-font-smoothing:antialiased;text-rendering:geometricPrecision}
body{touch-action:manipulation;user-select:none}
button{font:inherit;color:inherit;border:0;background:none;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
button:focus-visible{outline:2px solid rgba(113,232,255,.9);outline-offset:2px}
button:disabled{cursor:not-allowed;filter:saturate(.55) brightness(.75);opacity:.72}

.landing{position:relative;isolation:isolate;width:100vw;height:100dvh;display:grid;grid-template-columns:minmax(296px,.66fr) minmax(560px,1.34fr);gap:clamp(20px,3.2vw,54px);align-items:center;padding:clamp(18px,3vw,42px);background:radial-gradient(circle at 78% 18%,rgba(36,143,189,.76),transparent 34%),radial-gradient(circle at 18% 82%,rgba(255,216,110,.16),transparent 30%),linear-gradient(145deg,#081a36 0%,#040817 58%,#02040a 100%)}
.landing:before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,rgba(255,255,255,.07),transparent 32%,rgba(107,219,255,.05) 66%,transparent),repeating-linear-gradient(90deg,rgba(255,255,255,.025) 0 1px,transparent 1px 56px);pointer-events:none;z-index:-1}
.pitch{max-width:600px;align-self:center}
.brandMark{display:inline-flex;align-items:center;gap:14px;padding:10px 14px 11px;border:1px solid var(--line-strong);border-radius:22px;background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(0,0,0,.26));box-shadow:var(--shadow-md),inset 0 1px rgba(255,255,255,.22);margin-bottom:20px}
.brand101{font-family:var(--display);font-size:clamp(38px,4.8vw,70px);line-height:.72;letter-spacing:.01em;color:#f5dfb8;-webkit-text-stroke:1px #4b2d18;text-shadow:0 4px 0 #8d613c,0 10px 22px rgba(0,0,0,.45)}
.brandName{text-transform:uppercase;font-weight:1000;font-size:clamp(13px,1.5vw,19px);line-height:.88;letter-spacing:.13em;color:#ff4958;text-shadow:0 1px 0 #fff2cc,0 3px 10px rgba(0,0,0,.5)}
.pitch h1{margin:0 0 14px;font-size:clamp(34px,4.8vw,70px);line-height:.92;letter-spacing:-.055em;text-wrap:balance}
.pitch p{margin:0;color:#d6efff;font-size:clamp(14px,1.24vw,18px);line-height:1.5;max-width:55ch}
.pitchChips{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0}
.pitchChips span{height:34px;display:inline-flex;align-items:center;padding:0 12px;border:1px solid rgba(113,232,255,.22);border-radius:999px;background:rgba(255,255,255,.075);font-size:12px;font-weight:850;color:#e7f8ff;white-space:nowrap}
.heroLaunch{min-width:44px;min-height:52px;max-width:100%;display:inline-flex;align-items:center;justify-content:center;padding:0 20px;border-radius:18px;background:linear-gradient(#82f774,#2ebd33 54%,#15701a);box-shadow:inset 0 2px rgba(255,255,255,.45),inset 0 -4px rgba(0,0,0,.22),0 18px 36px rgba(40,201,72,.25);font-weight:1000;letter-spacing:.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:transform .14s ease,filter .14s ease}
.heroLaunch:active{transform:scale(.97)}
.stage{min-height:0;display:grid;place-items:center;position:relative}
.phone{--bezel:clamp(10px,1.18vw,16px);position:relative;width:min(100%,calc((100dvh - clamp(56px,7vw,92px))*1.7777));aspect-ratio:16/9;padding:var(--bezel);border-radius:clamp(32px,3.2vw,54px);background:linear-gradient(135deg,#242830,#06070c 28%,#666a73 47%,#030305 72%,#2c3038);box-shadow:var(--shadow-lg),inset 0 0 0 2px rgba(255,255,255,.13),inset 0 0 0 7px rgba(0,0,0,.72)}
.phone:after{content:"";position:absolute;inset:5px;border-radius:inherit;border:1px solid rgba(255,255,255,.14);pointer-events:none}
.phoneSpeaker{position:absolute;left:2.45%;top:38%;width:2.1%;height:24%;border-radius:999px;background:#05070b;z-index:6;box-shadow:inset -1px 0 5px rgba(255,255,255,.12)}
.phoneCamera{position:absolute;left:3.1%;top:49%;width:8px;height:8px;border-radius:50%;background:radial-gradient(circle,#67d6ff 0,#123451 48%,#020407 70%);z-index:7}
.game{container-type:size;position:relative;overflow:hidden;width:100%;height:100%;border-radius:calc(clamp(32px,3.2vw,54px) - var(--bezel));background:#0c4261;font-size:clamp(8.5px,1.08cqw,15px);font-family:var(--font);box-shadow:inset 0 0 0 1px rgba(164,237,255,.25),inset 0 0 84px rgba(0,0,0,.46)}

.screen{position:absolute;inset:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:.8em;padding:max(.8em,env(safe-area-inset-top)) max(1em,env(safe-area-inset-right)) max(.85em,env(safe-area-inset-bottom)) max(1em,env(safe-area-inset-left));overflow:hidden;background-color:#0c4261;background-image:radial-gradient(circle at 48% 26%,rgba(102,230,255,.28),transparent 30%),radial-gradient(circle at 25% 70%,rgba(255,216,110,.11),transparent 28%),repeating-radial-gradient(circle at 0 0,rgba(1,47,72,.48) 0 2px,transparent 3px 42px),linear-gradient(180deg,#147995,#0e4768 50%,#092b48);isolation:isolate}
.screen:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.28),transparent 13%,transparent 87%,rgba(0,0,0,.28));z-index:-1;pointer-events:none}
.screen.enter{animation:screenIn .23s cubic-bezier(.2,.8,.2,1) both}
@keyframes screenIn{from{opacity:.42;transform:translate3d(.8em,0,0) scale(.994)}to{opacity:1;transform:none}}
.safe{min-height:0;width:100%;height:100%;position:relative;z-index:1}

.uiBtn{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:.42em;padding:0 .9em;border-radius:14px;border:1px solid rgba(255,255,255,.24);font-weight:1000;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 1px 1px rgba(0,0,0,.55);box-shadow:inset 0 2px rgba(255,255,255,.34),inset 0 -4px rgba(0,0,0,.24),0 7px 14px rgba(0,0,0,.24);transition:transform .12s cubic-bezier(.2,.8,.2,1),filter .12s ease,box-shadow .12s ease}
.uiBtn:active{transform:translateY(1px) scale(.974);filter:brightness(1.08)}
.uiBtn.primary{background:linear-gradient(#72f264,#2fbc35 54%,#14741b)}
.uiBtn.secondary{background:linear-gradient(#2dccff,#0b6ac8 53%,#083e80)}
.uiBtn.gold{background:linear-gradient(#ffe479,#f5a224 53%,#b86612);color:#fff7d7}
.uiBtn.danger{background:linear-gradient(#ff5d68,#ca1d30 53%,#760f1a)}
.uiBtn.dark{background:linear-gradient(#697894,#2b3853 53%,#151d2e)}
.uiBtn.purple{background:linear-gradient(#cf68ff,#7b20c6 53%,#420a78)}
.uiBtn.ghost{background:linear-gradient(180deg,rgba(79,128,174,.68),rgba(9,28,56,.72));border-color:rgba(172,230,255,.28)}
.iconBtn,.backBtn,.closeBtn{width:44px;height:44px;min-width:44px;min-height:44px;padding:0;border-radius:14px;display:grid;place-items:center;font-size:1.35em;background:linear-gradient(180deg,rgba(56,106,150,.9),rgba(9,26,50,.94));border:1px solid rgba(172,230,255,.32);box-shadow:inset 0 1px rgba(255,255,255,.24),0 7px 14px rgba(0,0,0,.24);transition:transform .12s ease,filter .12s ease}
.backBtn{font-size:1.65em;color:#e7fbff}.closeBtn{font-size:1.25em;color:#fff4dc;background:linear-gradient(#ff5d68,#c91b2e 53%,#790f1b)}
.iconBtn:active,.backBtn:active,.closeBtn:active{transform:scale(.95)}
.badge{height:22px;display:inline-flex;align-items:center;justify-content:center;padding:0 .55em;border-radius:999px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.1);font-size:.82em;font-weight:950;white-space:nowrap}
.badge.vip{color:#251805;background:linear-gradient(#fff1a4,#e5a73d);border-color:#fff6b5;text-shadow:none}
.badge.locked{color:#e9f5ff;background:rgba(255,255,255,.08)}

.topBar{display:grid;grid-template-columns:44px minmax(9em,14em) minmax(6.2em,8.5em) minmax(5.8em,7.6em) 1fr minmax(6em,8em) 44px 44px;gap:.55em;align-items:center;min-height:44px;z-index:5}
.topBar.compact{grid-template-columns:44px minmax(8em,13em) minmax(5.7em,7.8em) minmax(5.4em,7.2em) 1fr 44px 44px}
.profileMini,.counter,.vipPill{height:44px;border-radius:14px;border:1px solid rgba(172,230,255,.3);background:linear-gradient(180deg,rgba(42,88,135,.88),rgba(10,27,56,.9));box-shadow:inset 0 1px rgba(255,255,255,.2),0 6px 12px rgba(0,0,0,.2);display:flex;align-items:center;justify-content:center;gap:.42em;overflow:hidden;padding:0 .62em}
.profileMini{justify-content:flex-start}.profileMini .avatar{width:34px;height:34px;flex:0 0 34px}.profileMiniText{display:grid;gap:2px;line-height:1}.profileMini b,.counter b,.vipPill b{font-size:.98em;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.profileMini small,.counter small,.vipPill small{font-size:.72em;color:#cdeeff;font-weight:850;line-height:1;white-space:nowrap}.counterIcon{font-size:1.08em;filter:drop-shadow(0 2px 2px rgba(0,0,0,.4))}.centerLogo{display:grid;place-items:center;pointer-events:none;align-self:stretch}.miniLogo{height:44px;min-width:92px;display:grid;place-items:center}.miniLogo strong{font-family:var(--display);font-size:2.9em;line-height:.7;color:#efdcc0;-webkit-text-stroke:.04em #462a17;text-shadow:0 .06em #8e623c}.miniLogo span{margin-top:-.45em;padding:.02em .72em .08em;border-radius:.18em;background:linear-gradient(#ff525e,#a91124);border:1px solid #431017;font-size:.9em;font-weight:1000;letter-spacing:.08em;color:#fff3d9;transform:rotate(-2deg)}
.avatar{position:relative;border-radius:50%;background:radial-gradient(circle at 52% 28%,#f4fbff,#80c2d0 47%,#23435f 48%,#102745 100%);border:2px solid #aeeaff;box-shadow:inset 0 -3px 0 rgba(0,0,0,.22),0 2px 0 #16375e}.avatar:after{content:"";position:absolute;left:25%;right:25%;bottom:17%;height:19%;border-radius:50% 50% 40% 40%;background:#18365c}.avatar:before{content:"";position:absolute;left:30%;right:30%;top:24%;height:24%;border-radius:50%;background:#173258}

.login{place-items:center;text-align:center}
.loginBody{align-self:center;display:grid;place-items:center;gap:1.05em;width:min(66em,88cqw)}
.logoLarge{display:grid;place-items:center;filter:drop-shadow(0 .55em .45em rgba(0,0,0,.45))}
.logoLarge strong{font-family:var(--display);font-size:clamp(4.8em,12cqw,8.4em);line-height:.7;color:#ead8bd;-webkit-text-stroke:.045em #402817;text-shadow:0 .055em #8d623d}
.logoLarge span{margin-top:-.48em;padding:.06em .74em .1em;border-radius:.18em;background:linear-gradient(#ff5661,#a81325);border:.08em solid #441018;box-shadow:inset 0 .08em rgba(255,255,255,.33),0 .08em #f6d7a8;font-size:clamp(1.4em,3.6cqw,2.4em);font-weight:1000;letter-spacing:.08em;color:#fff4de;transform:rotate(-2deg)}
.loginSubtitle{max-width:54em;color:#d7f2ff;font-size:1.02em;line-height:1.35;font-weight:750;margin-top:-.35em}
.loginGrid{width:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.9em}.loginGrid .uiBtn{height:4.3em;font-size:1.12em}.loginFoot{position:absolute;left:50%;bottom:1.05em;transform:translateX(-50%);font-size:.86em;color:#d2f2ff;font-weight:850;opacity:.88;white-space:nowrap}.helpBtn{position:absolute;right:1.1em;top:1.1em;z-index:4}

.lobbyMain{display:grid;grid-template-columns:minmax(9.2em,13.8em) minmax(0,1fr);gap:.85em;min-height:0}.sideStack{display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:.68em}.missionCard{min-height:0;padding:.78em;border-radius:18px;border:1px solid rgba(172,230,255,.24);background:linear-gradient(180deg,rgba(37,101,153,.88),rgba(8,34,68,.86));box-shadow:var(--shadow-sm);display:grid;align-content:space-between;gap:.45em;overflow:hidden}.missionCard h3{margin:0;font-size:1.03em;line-height:1.05}.missionCard p{margin:0;color:#d8f3ff;font-size:.82em;line-height:1.22}.progressBar{height:.72em;border-radius:999px;background:rgba(3,15,35,.62);overflow:hidden;border:1px solid rgba(255,255,255,.12)}.progressBar span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#37d04b,#ffe16e);box-shadow:0 0 12px rgba(255,225,110,.42)}
.lobbyCore{min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr);gap:.75em}.heroCta{display:grid;grid-template-columns:1fr auto;align-items:center;gap:.8em;min-height:5.15em;padding:.75em .9em;border-radius:22px;border:1px solid rgba(255,229,139,.38);background:linear-gradient(120deg,rgba(255,216,110,.24),rgba(20,114,151,.72) 45%,rgba(10,28,63,.84));box-shadow:var(--shadow-md),inset 0 1px rgba(255,255,255,.16);overflow:hidden}.heroCta h2{margin:0;font-size:1.68em;line-height:1;letter-spacing:-.02em}.heroCta p{margin:.25em 0 0;color:#ddf5ff;font-size:.9em;font-weight:780;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.heroCta .uiBtn{height:3.2em;font-size:1.15em;padding-inline:1.2em;border-radius:16px}
.modeGrid{min-height:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:minmax(0,1fr);gap:.72em}.modeCard{position:relative;min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto;align-content:space-between;gap:.45em;padding:.75em;border-radius:20px;border:1px solid rgba(172,230,255,.27);background:linear-gradient(180deg,rgba(38,92,145,.9),rgba(7,29,61,.92));box-shadow:var(--shadow-sm),inset 0 1px rgba(255,255,255,.14);overflow:hidden;isolation:isolate;text-align:left}.modeCard:before{content:"";position:absolute;inset:-35% -20% auto auto;width:7.2em;height:7.2em;border-radius:50%;background:rgba(113,232,255,.15);z-index:-1}.modeCard.featured{border-color:rgba(255,229,139,.45);background:linear-gradient(180deg,rgba(38,112,151,.95),rgba(11,34,72,.94))}.modeCard.locked{filter:saturate(.82);background:linear-gradient(180deg,rgba(65,73,92,.72),rgba(13,22,41,.92))}.modeCard h3{margin:0;font-size:1.15em;line-height:1.03;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.modeCard p{margin:0;color:#d3f0ff;font-size:.8em;line-height:1.22;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.modeMeta{display:flex;align-items:center;justify-content:space-between;gap:.4em}.modeFee{font-size:.85em;font-weight:950;color:#fff7ce;white-space:nowrap}.modeBadge{position:absolute;right:.65em;top:.55em}.lobbyBottom{display:grid;grid-template-columns:repeat(6,44px) 1fr minmax(9em,13.5em);gap:.55em;align-items:center;min-height:44px}.lobbyBottom .uiBtn{height:44px}.quickNav{display:flex;gap:.5em;min-width:0}

.tabbar{display:grid;grid-template-columns:44px repeat(4,minmax(0,1fr));gap:.55em;align-items:center;min-height:44px}.tabbar.three{grid-template-columns:44px repeat(3,minmax(0,1fr))}.tabbar .uiBtn{height:44px}.panelBody{min-height:0;display:grid;align-items:stretch}.screenTitle{height:44px;display:flex;align-items:center;gap:.6em;min-width:0}.screenTitle h2{margin:0;font-size:1.4em;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.caption{height:2.45em;display:flex;align-items:center;justify-content:center;color:#d6efff;font-size:.86em;font-weight:850;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.shopGrid{min-height:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:minmax(0,1fr);gap:.75em}.productCard{position:relative;min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto auto;gap:.36em;place-items:center;text-align:center;padding:.68em;border-radius:20px;border:1px solid rgba(172,230,255,.27);background:linear-gradient(180deg,rgba(45,93,150,.94),rgba(8,30,62,.94));box-shadow:var(--shadow-sm),inset 0 1px rgba(255,255,255,.14);overflow:hidden}.productCard.best{border-color:rgba(255,229,139,.5);background:linear-gradient(180deg,rgba(76,99,151,.96),rgba(21,38,76,.95))}.productCard h3{margin:0;font-size:1.08em;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.productIcon{width:3.25em;height:3.25em;border-radius:50%;display:grid;place-items:center;font-size:1.55em;background:radial-gradient(circle at 36% 26%,#fff2ad,#f3a01f 55%,#7b3a08);box-shadow:inset 0 2px rgba(255,255,255,.32),0 6px 14px rgba(0,0,0,.22)}.productIcon.ticket{background:radial-gradient(circle at 36% 26%,#f0e6ff,#9a5cff 56%,#3e0c78)}.productCard small{color:#d1edff;font-size:.76em;font-weight:850;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.priceTag{width:100%;height:2.5em;display:grid;place-items:center;border-radius:12px;background:linear-gradient(#77f568,#2eb935 54%,#15731a);font-weight:1000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:0 .45em}.cornerRibbon{position:absolute;top:.55em;left:.55em;height:1.75em;padding:0 .55em;display:flex;align-items:center;border-radius:999px;background:linear-gradient(#fff0a8,#e5a23a);color:#281704;font-size:.72em;font-weight:1000;text-shadow:none;white-space:nowrap}
.socialBox,.settingsBox,.messagesShell,.friendsShell,.profileShell,.rewardShell,.modeShell{min-height:0;border-radius:22px;border:1px solid rgba(172,230,255,.25);background:linear-gradient(180deg,rgba(16,58,103,.86),rgba(6,22,49,.88));box-shadow:var(--shadow-md),inset 0 1px rgba(255,255,255,.12);padding:.9em;overflow:hidden}.socialBox{display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:.8em}.socialBox h2,.settingsBox h2,.modeShell h2{margin:0;font-size:1.55em;line-height:1}.socialCols{min-height:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.7em}.socialPerk{min-height:0;border-radius:18px;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.07);padding:.7em;text-align:center;display:grid;gap:.35em;align-content:center;overflow:hidden}.socialPerk i{font-style:normal;font-size:2.2em}.socialPerk h3{margin:0;font-size:.95em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.socialPerk p{margin:0;color:#d4eefc;font-size:.75em;line-height:1.18}.socialActions{display:flex;gap:.6em;justify-content:center}.socialActions .uiBtn{min-width:11em}
.rewardShell{display:grid;grid-template-rows:auto minmax(0,1fr);gap:.8em}.rewardHeader{display:flex;align-items:center;justify-content:space-between;gap:.8em}.rewardHeader h2{margin:0;font-size:1.45em}.rewardTrack{min-height:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.7em}.rewardCard{min-height:0;padding:.72em;border-radius:20px;border:1px solid rgba(172,230,255,.22);background:linear-gradient(180deg,rgba(45,91,144,.92),rgba(8,29,61,.94));display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:.45em;place-items:center;text-align:center;overflow:hidden}.rewardCard h3{margin:0;font-size:1em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.rewardCard i{font-style:normal;font-size:2.8em;filter:drop-shadow(0 5px 6px rgba(0,0,0,.3))}.rewardCard .uiBtn{width:100%;height:2.65em;min-height:44px;font-size:.86em;padding:0 .45em}
.messagesShell{display:grid;grid-template-columns:minmax(12em,18em) minmax(0,1fr);gap:.8em}.threadList{display:grid;gap:.58em;min-height:0;overflow:hidden}.threadItem{height:4.4em;border-radius:16px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.07);display:grid;align-content:center;padding:.58em .7em;text-align:left;overflow:hidden}.threadItem.active{border-color:rgba(255,229,139,.42);background:rgba(255,216,110,.14)}.threadItem b,.messageView h3{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.threadItem small{color:#cdeeff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.messageView{min-height:0;border-radius:18px;background:rgba(1,12,31,.32);border:1px solid rgba(255,255,255,.12);padding:.82em;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:.55em}.messageView h3{margin:0;font-size:1.22em}.messageBubble{align-self:start;background:rgba(255,255,255,.08);border-radius:16px;padding:.8em;color:#e7f8ff;font-size:.95em;line-height:1.35}.messageView .uiBtn{justify-self:start}
.friendsShell{display:grid;grid-template-columns:1fr 1fr;gap:.8em}.friendPanel{min-height:0;border-radius:18px;border:1px solid rgba(255,255,255,.13);background:rgba(255,255,255,.07);padding:.75em;overflow:hidden;display:grid;grid-template-rows:auto minmax(0,1fr);gap:.55em}.friendPanel h3{margin:0;font-size:1.1em}.friendList{display:grid;gap:.45em;min-height:0;overflow:hidden}.friendRow{height:3.65em;display:grid;grid-template-columns:36px minmax(0,1fr) auto;gap:.55em;align-items:center;padding:.4em;border-radius:14px;background:rgba(1,12,31,.28);border:1px solid rgba(255,255,255,.09)}.friendRow .avatar{width:36px;height:36px}.friendRow b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.friendRow small{color:#cdeeff}.friendRow .uiBtn{height:2.5em;min-height:38px;font-size:.82em;padding:0 .55em}
.profileShell{display:grid;grid-template-columns:minmax(11em,15em) minmax(0,1fr) minmax(9em,14em);gap:.85em}.profileHero{border-radius:20px;background:linear-gradient(180deg,rgba(255,216,110,.16),rgba(255,255,255,.06));border:1px solid rgba(255,229,139,.25);display:grid;place-items:center;align-content:center;gap:.7em;padding:.8em;overflow:hidden}.bigAvatar{width:6.8em;height:6.8em;border-radius:50%;background:radial-gradient(circle at 50% 25%,#ffffff,#8dcadb 46%,#1b3e65 47%,#0c223f 100%);border:.25em solid #aeeaff;box-shadow:inset 0 -.5em 0 rgba(0,0,0,.18),0 .4em 1em rgba(0,0,0,.3)}.playerName{margin:0;font-size:1.24em;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.statGrid{min-height:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.65em}.stat{min-height:0;border-radius:16px;padding:.65em;background:rgba(255,255,255,.075);border:1px solid rgba(255,255,255,.12);display:grid;align-content:center;gap:.2em;overflow:hidden}.stat small{color:#cdeeff;font-size:.72em;font-weight:850;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stat b{font-size:1.14em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.profileActions{display:grid;grid-template-columns:1fr;gap:.48em;align-content:stretch}.profileActions .uiBtn{height:auto;min-height:44px}
.settingsBox{display:grid;grid-template-columns:minmax(14em,20em) minmax(0,1fr);gap:.9em}.settingsList{display:grid;gap:.55em;align-content:start}.settingRow{min-height:3.6em;border-radius:16px;border:1px solid rgba(255,255,255,.13);background:rgba(255,255,255,.07);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.7em;align-items:center;padding:.55em .65em}.settingRow b,.settingRow small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.settingRow small{color:#cdeeff;font-size:.78em}.settingPreview{min-height:0;border-radius:20px;background:radial-gradient(circle at 42% 40%,rgba(113,232,255,.16),transparent 30%),rgba(1,12,31,.27);border:1px solid rgba(255,255,255,.11);display:grid;place-items:center;text-align:center;padding:1em}.settingPreview h3{margin:0 0 .4em;font-size:1.5em}.settingPreview p{margin:0;color:#d7f2ff;line-height:1.35;max-width:42ch}
.modeShell{display:grid;grid-template-rows:auto minmax(0,1fr);gap:.7em}.allModesGrid{min-height:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:minmax(0,1fr);gap:.7em}

.tableMain{display:grid;place-items:stretch;min-height:0}.waitingLayout{position:relative;min-height:0;border-radius:26px;border:1px solid rgba(172,230,255,.25);background:radial-gradient(ellipse at center,rgba(40,160,102,.35),rgba(7,42,46,.82) 54%,rgba(4,18,35,.92) 78%);box-shadow:var(--shadow-md),inset 0 0 0 2px rgba(255,255,255,.06);overflow:hidden;display:grid;grid-template-columns:10em minmax(0,1fr) 10em;grid-template-rows:4.5em minmax(0,1fr) 4.6em;gap:.65em;padding:.75em}.seat{min-width:44px;min-height:44px;border-radius:18px;border:1px solid rgba(172,230,255,.28);background:linear-gradient(180deg,rgba(47,91,137,.88),rgba(10,29,60,.9));display:grid;place-items:center;text-align:center;align-content:center;gap:.2em;box-shadow:var(--shadow-sm);overflow:hidden}.seat b{font-size:1.6em;line-height:1}.seat span{font-size:.8em;font-weight:950;color:#e4f7ff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.seat.top{grid-column:2;grid-row:1}.seat.left{grid-column:1;grid-row:2}.seat.right{grid-column:3;grid-row:2}.tableInfo{grid-column:2;grid-row:2;border-radius:28px;background:radial-gradient(ellipse at center,#1c8f5a 0%,#0b5d46 52%,#07392f 78%);border:.55em solid rgba(117,76,38,.96);box-shadow:inset 0 0 0 1px rgba(255,235,180,.26),inset 0 0 3.2em rgba(0,0,0,.34),0 .7em 1.5em rgba(0,0,0,.28);display:grid;place-items:center;text-align:center;padding:.7em;overflow:hidden}.tableInfo h2{margin:0;font-size:1.65em;line-height:1}.tableInfo p{margin:.28em 0;color:#d8f3ff;font-size:.9em;font-weight:850}.feeOptions{display:flex;flex-wrap:wrap;gap:.35em;justify-content:center;margin-top:.45em}.feeOptions .uiBtn{min-height:34px;height:2.35em;min-width:4.8em;font-size:.78em;padding:0 .55em;border-radius:11px}.tableActions{grid-column:2;grid-row:3;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.55em}.tableActions .uiBtn{height:44px}.leaveBtn{grid-column:1;grid-row:3;align-self:end}.startBtn{grid-column:3;grid-row:3;align-self:end}.roomName{grid-column:1 / 4;grid-row:1;align-self:start;justify-self:center;height:2.5em;display:flex;align-items:center;gap:.5em;padding:0 .9em;border-radius:999px;background:rgba(1,12,31,.52);border:1px solid rgba(255,255,255,.12);font-weight:1000;color:#fff6d6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:60%}

.gameplayMain{position:relative;min-height:0;border-radius:24px;border:1px solid rgba(172,230,255,.2);background:radial-gradient(ellipse at center,rgba(33,145,87,.7),rgba(8,82,62,.88) 48%,rgba(6,27,50,.9) 80%);overflow:hidden;box-shadow:var(--shadow-md),inset 0 0 0 2px rgba(255,255,255,.05)}
.tableFelt{position:absolute;left:50%;top:45%;width:min(46em,70%);height:16.6em;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(ellipse at center,#1f9c66,#0a6048 62%,#06382f 100%);border:.7em solid rgba(116,73,35,.98);box-shadow:inset 0 0 0 1px rgba(255,238,177,.25),inset 0 0 3em rgba(0,0,0,.35),0 .8em 1.7em rgba(0,0,0,.25)}
.playerSlot{position:absolute;min-width:8.2em;height:3.6em;border-radius:16px;border:1px solid rgba(172,230,255,.25);background:linear-gradient(180deg,rgba(33,72,119,.9),rgba(8,24,52,.92));box-shadow:var(--shadow-sm);display:grid;grid-template-columns:32px minmax(0,1fr);gap:.45em;align-items:center;padding:.35em .55em;overflow:hidden}.playerSlot .avatar{width:32px;height:32px}.playerSlot b,.playerSlot small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.playerSlot small{color:#cdeeff;font-size:.75em}.playerSlot.top{left:50%;top:.65em;transform:translateX(-50%)}.playerSlot.bottom{left:50%;bottom:7.2em;transform:translateX(-50%)}
.playerSlot.left{left:.65em;top:42%;transform:translateY(-50%)}.playerSlot.right{right:.65em;top:42%;transform:translateY(-50%)}.turnRing{box-shadow:0 0 0 3px rgba(255,216,110,.32),var(--shadow-sm)}
.deck,.discardPile{position:absolute;top:42%;width:5em;height:6.2em;border-radius:13px;display:grid;place-items:center;transform:translateY(-50%);box-shadow:var(--shadow-sm)}.deck{left:calc(50% - 5.6em);background:linear-gradient(135deg,#225b98,#061a38);border:2px solid rgba(255,255,255,.18);font-size:1.8em}.deck:active{transform:translateY(-50%) scale(.96)}.discardPile{right:calc(50% - 5.6em);background:rgba(255,255,255,.08);border:1px dashed rgba(255,255,255,.24)}.meldArea{position:absolute;left:50%;top:30%;transform:translateX(-50%);display:flex;gap:.22em;padding:.28em;border-radius:12px;background:rgba(1,12,31,.24);border:1px solid rgba(255,255,255,.12)}.statusBubble{position:absolute;left:50%;top:56%;transform:translateX(-50%);height:2.35em;display:flex;align-items:center;padding:0 .9em;border-radius:999px;background:rgba(2,16,34,.68);border:1px solid rgba(255,255,255,.14);font-weight:950;color:#fff4cf;white-space:nowrap}.rackWrap{position:absolute;left:.8em;right:.8em;bottom:.72em;display:grid;grid-template-rows:auto auto;gap:.45em}.rack{height:6.25em;border-radius:20px;padding:.4em;background:linear-gradient(180deg,rgba(116,72,36,.94),rgba(55,31,18,.96));border:1px solid rgba(255,226,167,.22);box-shadow:inset 0 .35em .9em rgba(0,0,0,.28),0 .6em 1.3em rgba(0,0,0,.24);display:grid;grid-template-columns:repeat(20,minmax(0,1fr));gap:.2em;align-items:end;overflow:hidden}.gameActions{height:44px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.55em}.gameActions .uiBtn{height:44px;font-size:.88em;padding:0 .5em}
.tile{position:relative;min-width:44px!important;width:100%;height:clamp(44px,4.75em,68px);min-height:44px!important;border-radius:.58em;background:linear-gradient(180deg,#fff9e9,#eedeb9);border:1px solid #c7a977;box-shadow:inset 0 .12em rgba(255,255,255,.85),inset 0 -.16em rgba(114,75,33,.14),0 .18em .35em rgba(0,0,0,.24);display:grid;place-items:center;color:var(--tile-black);font-family:Georgia,serif;transition:transform .14s cubic-bezier(.2,.8,.2,1),filter .14s ease}.tile b{font-size:1.33em;line-height:1}.tile.red{color:var(--tile-red)}.tile.blue{color:var(--tile-blue)}.tile.orange{color:var(--tile-orange)}.tile.black{color:var(--tile-black)}.tile.sel{transform:translateY(-.68em);filter:brightness(1.08);box-shadow:0 0 0 2px rgba(255,216,110,.75),0 .42em .72em rgba(0,0,0,.32)}
.discardPile .tile,.meldArea .tile{width:3.1em;min-width:44px!important;height:clamp(44px,4.55em,62px)}
.tile.fly{animation:tileFly .28s ease both}@keyframes tileFly{to{transform:translate3d(0,-5em,0) scale(.7);opacity:0}}

.modalLayer{position:absolute;inset:0;z-index:20;display:grid;place-items:center;padding:1em;background:rgba(1,6,18,.58);backdrop-filter:blur(6px);animation:fadeIn .16s ease both}.modalCard{width:min(34em,86cqw);max-height:84cqh;border-radius:24px;border:1px solid rgba(255,229,139,.28);background:linear-gradient(180deg,rgba(25,63,107,.96),rgba(6,19,43,.98));box-shadow:var(--shadow-lg),inset 0 1px rgba(255,255,255,.16);padding:.9em;display:grid;gap:.75em;overflow:auto}.modalTop{display:grid;grid-template-columns:minmax(0,1fr) 44px;align-items:center;gap:.6em}.modalTop h2{margin:0;font-size:1.38em;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.modalCard p{margin:0;color:#dcf4ff;line-height:1.35;font-size:.96em}.modalActions{display:flex;gap:.55em;justify-content:flex-end;flex-wrap:wrap}.toast{position:absolute;left:50%;bottom:1.2em;z-index:35;transform:translateX(-50%);min-height:44px;max-width:min(34em,86%);display:flex;align-items:center;justify-content:center;padding:.75em 1em;border-radius:999px;border:1px solid rgba(255,229,139,.35);background:linear-gradient(180deg,rgba(35,53,76,.96),rgba(7,16,34,.98));box-shadow:var(--shadow-md);font-weight:950;color:#fff6d6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;animation:toastIn .18s ease both}@keyframes toastIn{from{opacity:0;transform:translate(-50%,.7em) scale(.98)}to{opacity:1;transform:translate(-50%,0) scale(1)}}@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.rotateHint{position:fixed;inset:0;z-index:100;display:none;place-items:center;padding:20px;background:radial-gradient(circle at 50% 28%,rgba(22,126,171,.72),rgba(3,7,19,.96) 62%)}.rotateHint.show{display:grid}.rotateCard{width:min(360px,92vw);padding:22px;border-radius:26px;border:1px solid rgba(255,229,139,.3);background:linear-gradient(180deg,rgba(20,55,96,.96),rgba(6,18,42,.98));box-shadow:var(--shadow-lg);display:grid;gap:12px;place-items:center;text-align:center}.rotateIcon{width:68px;height:68px;border-radius:22px;display:grid;place-items:center;background:linear-gradient(#ffe37a,#f39d24);color:#2a1903;font-size:42px;font-weight:1000;text-shadow:none}.rotateCard strong{font-size:22px}.rotateCard span{color:#d7f2ff;line-height:1.35}.rotateCard .uiBtn{width:100%;height:48px}

@media (max-width:1180px){
  .landing{grid-template-columns:minmax(260px,.58fr) minmax(520px,1.42fr);gap:22px}.pitch h1{font-size:clamp(30px,4.1vw,54px)}.pitch p{font-size:14px}.pitchChips span:nth-child(3){display:none}.topBar{grid-template-columns:44px minmax(8em,12em) minmax(5.6em,7.3em) minmax(5.2em,6.8em) 1fr minmax(5.8em,7em) 44px 44px}.shopGrid{gap:.58em}.productIcon{width:2.95em;height:2.95em}.modeGrid{gap:.58em}
}
@media (max-width:900px) and (orientation:landscape){
  .landing{display:block;padding:0}.pitch{display:none}.stage{width:100vw;height:100dvh}.phone{width:100vw;height:100dvh;aspect-ratio:auto;padding:0;border-radius:0;box-shadow:none;background:#000}.phone:after,.phoneSpeaker,.phoneCamera{display:none}.game{border-radius:0;font-size:clamp(8px,1.15vw,11px)}.screen{padding:max(.62em,env(safe-area-inset-top)) max(.72em,env(safe-area-inset-right)) max(.62em,env(safe-area-inset-bottom)) max(.72em,env(safe-area-inset-left));gap:.55em}.topBar,.topBar.compact{gap:.42em}.modeGrid,.shopGrid{gap:.48em}.lobbyMain{gap:.52em}.heroCta{min-height:4.6em}.loginGrid .uiBtn{height:3.8em}.tableFelt{height:14.6em}.rack{height:6.4em}.tile{height:clamp(44px,4.8em,62px)}.gameActions{gap:.4em}.gameActions .uiBtn{font-size:.82em}.lobbyBottom{gap:.38em}.caption{height:2em}
}
@media (max-width:900px) and (orientation:portrait){
  .landing{display:grid;grid-template-columns:1fr;place-items:center;padding:14px}.pitch{display:none}.stage{width:100%;max-width:100%}.phone{width:min(96vw,calc(72vh * 1.777));max-height:72vh}.game{font-size:clamp(7px,1.2cqw,10px)}
}
@media (max-width:720px) and (orientation:landscape){
  .topBar{grid-template-columns:44px minmax(7em,10em) minmax(5em,6.5em) minmax(4.8em,6.2em) 1fr 44px 44px}.topBar .vipPill{display:none}.centerLogo{display:none}.lobbyMain{grid-template-columns:8.7em minmax(0,1fr)}.modeCard p{display:none}.shopGrid{grid-template-columns:repeat(4,minmax(0,1fr))}.productCard small{display:none}.socialPerk p{display:none}.profileShell{grid-template-columns:10em minmax(0,1fr) 10em}.messagesShell{grid-template-columns:13em minmax(0,1fr)}.allModesGrid{grid-template-columns:repeat(4,minmax(0,1fr))}.rack{gap:.15em;padding:.28em}.gameActions{grid-template-columns:repeat(5,minmax(0,1fr))}.statusBubble{top:58%}
}

/* QA refinements: keep all interactive controls at or above 44px in tested viewports. */
.friendRow{height:4.1em;min-height:44px}
.friendRow .uiBtn{height:44px;min-height:44px;min-width:44px}
.threadItem{height:clamp(44px,4.4em,66px);min-height:44px}
.feeOptions .uiBtn{height:44px;min-height:44px;min-width:44px}
.profileShell,.profileActions,.settingsBox,.settingsList{min-height:0;overflow:hidden}
.profileActions{grid-template-rows:repeat(6,minmax(44px,1fr))}
.profileActions .uiBtn{min-height:44px;height:100%}
.settingsList{grid-template-rows:auto repeat(4,minmax(44px,1fr))}
.settingRow{min-height:44px;height:auto}
@media (max-width:900px) and (orientation:landscape){
  .profileActions{gap:.34em}
  .settingsList{gap:.38em}
  .settingRow{padding:.38em .54em}
  .friendPanel{padding:.58em;gap:.42em}
  .friendList{gap:.32em}
}
.modeCard h3{padding-right:4.8em}
.profileActions{grid-template-columns:repeat(2,minmax(44px,1fr));grid-template-rows:repeat(3,minmax(44px,1fr));gap:.42em}
@container (max-width: 940px){
  .topBar:not(.compact) .centerLogo{display:none}
  .modeCard h3{padding-right:4.2em}
}
@container (max-width: 940px){
  .topBar:not(.compact) .vipPill{display:none}
}
.topBar{grid-template-columns:44px minmax(9em,14em) minmax(6.2em,8.5em) minmax(5.8em,7.6em) 1fr 44px 44px}
.topBar.compact{grid-template-columns:44px minmax(8em,13em) minmax(5.7em,7.8em) minmax(5.4em,7.2em) 1fr 44px 44px}
@media (max-width:1180px){.topBar{grid-template-columns:44px minmax(8em,12em) minmax(5.6em,7.3em) minmax(5.2em,6.8em) 1fr 44px 44px}}
@media (max-width:720px) and (orientation:landscape){.topBar{grid-template-columns:44px minmax(7em,10em) minmax(5em,6.5em) minmax(4.8em,6.2em) 1fr 44px 44px}}
.modeHead{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.35em;align-items:center;min-width:0}
.modeCard h3{padding-right:0!important}
.modeBadge{position:static!important;right:auto!important;top:auto!important}

/* Revision v3: compact shop icons, playable 101 table, desktop-only gate */
.productCard{grid-template-rows:auto minmax(2.2em,1fr) auto auto;gap:.3em}
.productIcon{width:2.38em;height:2.38em;font-size:1.08em;box-shadow:inset 0 2px rgba(255,255,255,.32),0 4px 10px rgba(0,0,0,.18)}
.productIcon.ticket{width:2.65em;height:2.65em;font-size:1.2em}
.productCard h3{font-size:1.02em}.priceTag{height:2.38em}
@media (max-width:1180px){.productIcon{width:2.12em;height:2.12em;font-size:.98em}.productIcon.ticket{width:2.36em;height:2.36em}}

.mobileBlock{position:fixed;inset:0;z-index:300;display:none;place-items:center;padding:24px;background:radial-gradient(circle at 50% 26%,rgba(33,153,199,.68),rgba(3,7,19,.98) 64%);color:var(--ink)}
.mobileBlockCard{width:min(380px,92vw);display:grid;gap:13px;place-items:center;text-align:center;padding:24px;border-radius:28px;border:1px solid rgba(255,229,139,.32);background:linear-gradient(180deg,rgba(18,56,99,.97),rgba(5,16,38,.99));box-shadow:var(--shadow-lg),inset 0 1px rgba(255,255,255,.18)}
.mobileBlockIcon{width:72px;height:72px;border-radius:24px;display:grid;place-items:center;background:linear-gradient(#ffe57f,#f3a01f);color:#281704;font-size:42px;font-weight:1000;text-shadow:none;box-shadow:inset 0 2px rgba(255,255,255,.45),0 12px 26px rgba(0,0,0,.28)}
.mobileBlockCard strong{font-size:23px;letter-spacing:-.02em}.mobileBlockCard span{color:#dff6ff;line-height:1.38;font-weight:760}
body.mobileBlocked .landing,body.mobileBlocked .rotateHint{display:none!important}body.mobileBlocked .mobileBlock{display:grid}

.gameplayMain{display:block;border-radius:22px;background:radial-gradient(ellipse at 50% 43%,rgba(35,149,91,.72),rgba(7,90,69,.92) 47%,rgba(5,24,47,.96) 82%)}
.tableFelt{top:43%;width:min(38em,58%);height:13.1em;border-width:.52em;opacity:.95}
.playerSlot{min-width:7.4em;height:3.25em;border-radius:14px;grid-template-columns:29px minmax(0,1fr);padding:.28em .45em}.playerSlot .avatar{width:29px;height:29px}.playerSlot.top{top:.38em}.playerSlot.left{left:.42em;top:39%}.playerSlot.right{right:.42em;top:39%}.playerSlot.bottom{bottom:7.9em}
.okeyTray{position:absolute;left:50%;top:.55em;transform:translateX(-50%);z-index:3;width:15.8em;min-height:4.65em;padding:.42em .52em;border-radius:16px;border:1px solid rgba(255,229,139,.3);background:linear-gradient(180deg,rgba(17,51,88,.9),rgba(5,20,45,.92));box-shadow:var(--shadow-sm);display:grid;gap:.28em;text-align:center;pointer-events:none}.okeyTray strong{font-size:.82em;text-transform:uppercase;letter-spacing:.08em;color:#fff2b8}.okeyTiles{display:flex;justify-content:center;gap:.5em}.okeyTiles span{display:grid;gap:.12em;place-items:center}.okeyTiles small{font-size:.66em;color:#d5f4ff;font-weight:900}.okeyTray em{font-style:normal;font-size:.66em;color:#ffe7a3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.deck,.discardPile{top:39%;width:4.1em;height:5.25em;border-radius:12px;z-index:4}.deck{left:calc(50% - 4.8em);font-size:1em;display:grid;gap:.1em;place-items:center}.deck b{font-size:1.4em}.deck small,.discardPile>small{font-size:.7em;font-weight:1000;color:#dff6ff}.discardPile{right:calc(50% - 4.8em);padding:.22em;grid-template-rows:auto minmax(0,1fr)}
.meldBoard{position:absolute;left:50%;top:52%;transform:translate(-50%,-50%);z-index:2;width:min(28.5em,48%);min-height:5.8em;max-height:7.8em;padding:.48em;border-radius:16px;border:1px solid rgba(172,230,255,.2);background:rgba(1,12,29,.34);box-shadow:inset 0 0 1.2em rgba(0,0,0,.18);display:grid;grid-template-rows:auto minmax(0,1fr);gap:.35em;overflow:hidden}.meldBoard header{display:grid;grid-template-columns:1fr auto auto;gap:.32em}.rulePill{height:2em;display:grid;align-content:center;padding:0 .5em;border-radius:11px;background:rgba(7,28,55,.72);border:1px solid rgba(255,255,255,.12);overflow:hidden}.rulePill b,.rulePill small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rulePill b{font-size:.63em;text-transform:uppercase;color:#bdefff}.rulePill small{font-size:.76em;font-weight:1000;color:#fff2bd}.openMelds{min-height:0;overflow:hidden;display:grid;gap:.28em}.openMelds p{margin:0;color:#d8f2ff;font-size:.85em;line-height:1.22;text-align:center;align-self:center}.openMeld{display:flex;align-items:center;gap:.18em;min-height:2.8em;padding:.2em;border-radius:11px;background:rgba(255,255,255,.055);overflow:hidden}.openMeld em{font-style:normal;min-width:1.35em;text-align:center;color:#ffe88d;font-weight:1000}.openMeld .tile{width:2.2em!important;min-width:2.2em!important;height:2.65em!important;min-height:2.65em!important;border-radius:.42em}.openMeld .tile b{font-size:1em}.openMeld .tile small{display:none}
.statusBubble{top:auto;bottom:12.7em;z-index:6;height:2.05em;max-width:70%;font-size:.9em;overflow:hidden;text-overflow:ellipsis}.rackWrap{left:.62em;right:.62em;bottom:.52em;gap:.32em}.rackMeta{height:1.65em;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.35em}.rackMeta span{display:flex;align-items:center;justify-content:center;border-radius:999px;background:rgba(3,17,39,.6);border:1px solid rgba(255,255,255,.1);font-size:.72em;font-weight:950;color:#dff7ff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rack{height:5.55em;border-radius:17px;padding:.32em;grid-template-columns:repeat(22,minmax(0,1fr));gap:.14em}.gameActions{height:auto;display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:.35em}.gameActions .uiBtn{height:44px;min-height:44px;font-size:.74em;padding:0 .32em;border-radius:12px}
.tile{min-width:0!important;height:4.6em;min-height:44px!important;border-radius:.5em}.tile b{font-size:1.12em}.tile small{position:absolute;left:50%;bottom:.2em;transform:translateX(-50%);font-size:.46em;font-family:var(--font);font-weight:1000;letter-spacing:.02em;color:#82510e}.tile.joker,.tile.okey{background:linear-gradient(180deg,#fff4ca,#f7c348 58%,#b96e17);color:#7d160a}.tile.okey{box-shadow:0 0 0 2px rgba(255,216,110,.52),0 .2em .5em rgba(0,0,0,.25)}.tile.sel{transform:translateY(-.52em);filter:brightness(1.1);box-shadow:0 0 0 2px rgba(255,216,110,.82),0 .42em .72em rgba(0,0,0,.32)}.discardPile .tile,.okeyTray .tile{width:2.45em!important;min-width:2.45em!important;height:3em!important;min-height:3em!important}.discardPile .tile b,.okeyTray .tile b{font-size:1em}.discardPile .tile small,.okeyTray .tile small{font-size:.42em}

@media (max-width:1180px){.tableFelt{height:12.5em}.meldBoard{width:min(27em,50%)}.okeyTray{width:14.5em}.gameActions .uiBtn{font-size:.68em}.rack{height:5.35em}.statusBubble{bottom:12.2em}.productCard{padding:.6em}}
@media (max-width:900px){body:not(.mobileBlocked) .mobileBlock{display:none}}

/* Revision v4: %20 daha kompakt genel ölçek, çalışan modal close handler, referans görsele yakın botlu 101 masa düzeni */
.game{font-size:clamp(6.9px,.86cqw,12px)}
.screen{gap:.56em;padding:max(.58em,env(safe-area-inset-top)) max(.72em,env(safe-area-inset-right)) max(.58em,env(safe-area-inset-bottom)) max(.72em,env(safe-area-inset-left))}
.caption{height:2.05em;font-size:.74em}.topBar{gap:.38em}.profileMini,.counter,.vipPill{height:44px;border-radius:12px;padding:0 .48em}.uiBtn{border-radius:11px;padding:0 .62em}.iconBtn,.backBtn,.closeBtn{border-radius:12px}.modalLayer{z-index:80}.modalCard{width:min(30em,82cqw);border-radius:20px;padding:.72em;gap:.58em}.modalTop h2{font-size:1.18em}.modalActions .uiBtn{min-width:5.6em}.uiBtn.light{background:linear-gradient(#fffef7,#d5dce3 54%,#97a8b4);color:#12213a;text-shadow:0 1px rgba(255,255,255,.7);border-color:rgba(255,255,255,.82);box-shadow:inset 0 2px rgba(255,255,255,.82),inset 0 -3px rgba(0,0,0,.15),0 5px 10px rgba(0,0,0,.25)}
.productIcon{width:1.9em;height:1.9em;font-size:.9em}.productIcon.ticket{width:2.05em;height:2.05em;font-size:.96em}.productCard{padding:.54em;gap:.24em}.productCard h3{font-size:.92em}.priceTag{height:2.12em}.shopGrid,.modeGrid,.allModesGrid{gap:.48em}.modeCard,.productCard,.rewardCard,.friendPanel,.settingsBox,.profileHero,.statCard{border-radius:16px}
.mobileBlockCard strong:after{content:" · Webte kontrol edin";display:block;font-size:.58em;color:#ffe694;margin-top:.35em;letter-spacing:0}.mobileBlockCard span{max-width:30ch}

.gameScreen{grid-template-rows:44px minmax(0,1fr) 1.72em;padding:.42em .52em .28em;background:#0c6b86;background-image:radial-gradient(circle at 50% 30%,rgba(84,227,255,.2),transparent 33%),repeating-radial-gradient(circle at 0 0,rgba(3,65,94,.72) 0 2px,transparent 3px 32px),linear-gradient(180deg,#127d98,#0c617c 54%,#0a4264)}
.gameHud{height:44px;display:grid;grid-template-columns:8.1em 8.1em minmax(10em,1fr) auto 44px 44px;gap:.42em;align-items:center;z-index:20}.hudChip,.inviteCenter,.buyGreen,.smallHud{height:44px;border-radius:10px;border:1px solid rgba(158,225,255,.25);background:linear-gradient(#273d5a,#111b2d 58%,#070b14);box-shadow:inset 0 1px rgba(255,255,255,.22),0 5px 10px rgba(0,0,0,.32);display:flex;align-items:center;justify-content:center;gap:.4em;font-weight:1000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hudChip span{font-size:1.75em;filter:drop-shadow(0 3px 3px rgba(0,0,0,.34))}.hudChip.coin span{color:#ffd15b}.hudChip.ticket span{color:#d89540}.inviteCenter{justify-self:center;width:min(20em,92%);text-transform:uppercase;letter-spacing:.05em}.inviteCenter b{width:2.1em;height:2.1em;display:grid;place-items:center;border-radius:.45em;background:#05080f;font-size:1.25em}.buyGreen{padding:0 1.05em;background:linear-gradient(#b7ff74,#43ca36 55%,#148019);color:#fff6df}.smallHud{width:44px;font-size:1.32em}.real101Main{position:relative;overflow:hidden;border-radius:14px;border:1px solid rgba(172,230,255,.2);background:transparent;box-shadow:inset 0 0 0 1px rgba(255,255,255,.05)}
.timerLine{position:absolute;left:7.8em;right:13.2em;top:.55em;height:.55em;border-radius:999px;background:rgba(2,10,23,.72);border:1px solid rgba(255,255,255,.18);z-index:9;overflow:hidden}.timerLine:before{content:"◷";position:absolute;left:-1.6em;top:-.5em;font-size:1.35em;color:#ccecf2}.timerLine i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#a5f15a,#e5ff68);box-shadow:0 0 10px rgba(229,255,104,.7)}
.tableGrid{position:absolute;left:17.2%;right:22.4%;top:2.55em;height:20.6em;border-radius:.55em;background-color:rgba(4,30,53,.88);background-image:linear-gradient(rgba(255,255,255,.075) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.075) 1px,transparent 1px);background-size:2.2em 2.2em;border:1px solid rgba(113,232,255,.13);box-shadow:inset 0 0 0 .1em rgba(255,255,255,.03),inset 0 0 3em rgba(0,0,0,.25)}.tableGrid:before{content:"";position:absolute;left:50%;top:0;bottom:0;width:1px;background:rgba(235,250,255,.55)}.tableGrid span:first-child,.tableGrid span:last-child{position:absolute;inset:0 50% 0 0;display:grid;place-items:center;color:rgba(158,221,240,.09);font-family:var(--display);font-size:5.4em;letter-spacing:.02em}.tableGrid span:first-child:after,.tableGrid span:last-child:after{content:"101\A PLUS";white-space:pre;text-align:center;line-height:.72}.tableGrid span:last-child{inset:0 0 0 50%}
.openBoard{position:absolute;left:18%;right:36%;top:4.9em;height:16.4em;z-index:2;padding:.55em .62em;overflow:hidden}.boardLogo{position:absolute;left:50%;top:45%;transform:translate(-50%,-50%);font-family:var(--display);font-size:5.1em;line-height:.74;color:rgba(185,232,248,.09);text-align:center;pointer-events:none}.openSlots{position:relative;z-index:2;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.34em}.openSlots p{grid-column:1/-1;align-self:center;justify-self:center;margin:5.7em 0 0;color:rgba(222,248,255,.7);font-weight:900}.miniMeld{height:3.35em;display:flex;align-items:center;gap:.1em;padding:.15em .22em;border-radius:.42em;background:rgba(255,255,255,.06);overflow:hidden}.miniMeld small{width:4.4em;flex:0 0 auto;color:#dff8ff;font-size:.68em;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.miniMeld .tile{width:1.9em!important;min-width:1.9em!important;height:2.42em!important;min-height:0!important;border-radius:.32em}.miniMeld .tile b{font-size:.92em}.miniMeld .tile small{display:none}
.okeyColumn{position:absolute;left:68.4%;top:2.55em;width:6.6em;height:20.6em;z-index:8;display:grid;grid-template-rows:auto 4.8em 4.8em minmax(4.8em,1fr);gap:.35em}.ruleStack{display:grid;gap:.25em}.ruleStack span{height:1.95em;border-radius:.42em;background:linear-gradient(#1c5a79,#103650);border:1px solid rgba(172,230,255,.2);display:grid;place-items:center;font-family:var(--display);font-size:1.12em;color:#e2f9ff;text-shadow:0 2px #071428}.ruleStack span:nth-child(2){background:linear-gradient(#34ad68,#11652d)}.okeyTileBox,.deck101,.discard101{border-radius:.68em;background:linear-gradient(#1f5d7d,#0c314b);border:1px solid rgba(172,230,255,.24);box-shadow:var(--shadow-sm);display:grid;place-items:center;padding:.22em;overflow:hidden}.okeyTileBox small,.deck101 small,.discard101 small{font-size:.68em;color:#d8f7ff;font-weight:1000;line-height:1}.deck101 b{font-size:1.45em;color:#fff3be}.discard101{grid-template-rows:auto minmax(0,1fr)}.discard101 i{font-style:normal;color:#c9e7f3;font-size:.8em}.okeyTileBox .tile,.discard101 .tile{width:3.05em!important;min-width:3.05em!important;height:3.95em!important;min-height:0!important;border-radius:.42em}.okeyTileBox .tile b,.discard101 .tile b{font-size:1.2em}.okeyTileBox .tile small,.discard101 .tile small{font-size:.4em}
.rightActionRail{position:absolute;right:3.9em;top:8.35em;width:7.15em;display:grid;gap:.44em;z-index:12}.rightActionRail .uiBtn{height:44px;min-height:44px;font-family:var(--display);font-size:1.02em;letter-spacing:.02em;padding:0 .22em}.sortSide{position:absolute;bottom:4.05em;width:5.3em;height:8.65em;border-radius:.86em;background:linear-gradient(#324d85,#142045 62%,#0b1025);border:1px solid rgba(172,230,255,.28);box-shadow:inset 0 1px rgba(255,255,255,.25),0 7px 14px rgba(0,0,0,.3);display:grid;place-items:center;grid-template-rows:2.1em 1fr;z-index:15}.sortSide em{font-style:normal;background:#fff;border-radius:.32em;color:#ce2639;padding:.14em .34em;font-weight:1000;font-family:Georgia,serif}.sortSide b{font-family:var(--display);font-size:1.95em;line-height:.9;color:white;text-shadow:0 2px #071428}.leftSort{left:4.15em}.rightSort{right:1em}.leaveRound{position:absolute;left:16.6%;top:7.6em;width:6.8em;height:6.8em;border-radius:50%;z-index:18;background:radial-gradient(circle at 40% 28%,#ff5b5b,#c20e1a 58%,#5f050d);border:.35em solid #15213f;box-shadow:0 0 0 .18em rgba(119,209,255,.35),0 .75em 1.2em rgba(0,0,0,.42),inset 0 .2em rgba(255,255,255,.38);font-family:var(--display);font-size:1.05em;line-height:.95;text-shadow:0 2px #340108}.sideInvite{position:absolute;top:8em;width:3.55em;height:12em;border-radius:.44em;background:linear-gradient(#1f2937,#0d1320);border:1px solid rgba(172,230,255,.2);box-shadow:var(--shadow-sm);display:grid;grid-template-rows:2.3em 1fr;z-index:8;overflow:hidden}.sideInvite b{background:#05070c;font-size:1.8em}.sideInvite span{writing-mode:vertical-rl;text-orientation:mixed;font-weight:1000;letter-spacing:.08em;align-self:center;justify-self:center}.leftInvite{left:1.2em}.rightInvite{right:1.1em;display:none}
.tablePlayer{position:absolute;z-index:14;height:3.25em;min-width:10.4em;border-radius:.45em;background:linear-gradient(#293c5a,#0f1726);border:1px solid rgba(172,230,255,.22);display:grid;grid-template-columns:2.5em minmax(0,1fr);gap:.34em;align-items:center;padding:.24em .45em;box-shadow:var(--shadow-sm);overflow:hidden}.tablePlayer .avatar{width:2.26em;height:2.26em}.tablePlayer b,.tablePlayer small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tablePlayer b{font-size:.92em}.tablePlayer small{font-size:.68em;color:#d9f6ff}.tablePlayer i{position:absolute;inset:-1px;border-radius:inherit;box-shadow:0 0 0 .18em rgba(145,255,92,.72) inset;pointer-events:none}.tablePlayer.top{left:50%;top:.18em;transform:translateX(-50%)}.tablePlayer.bottom{left:50%;bottom:9.92em;transform:translateX(-50%);min-width:13em}.tablePlayer.left,.tablePlayer.right{width:3.6em;height:14.3em;min-width:0;grid-template-columns:1fr;grid-template-rows:2.8em 1fr;padding:.26em}.tablePlayer.left{left:1.25em;top:17.3em}.tablePlayer.right{right:1.2em;top:8.9em}.tablePlayer.left span,.tablePlayer.right span{writing-mode:vertical-rl;text-orientation:mixed;justify-self:center;display:block}.tablePlayer.left .avatar,.tablePlayer.right .avatar{justify-self:center}.tablePlayer.left small,.tablePlayer.right small{display:none}.compactStatus{top:auto!important;bottom:10.15em!important;max-width:58%;height:2.08em;font-size:.82em;z-index:22;background:rgba(5,13,27,.72)}
.woodRack{position:absolute;left:8.05em;right:8.05em;bottom:.25em;height:9.75em;border-radius:.7em .7em .35em .35em;background:linear-gradient(180deg,#f2b51e 0%,#bf7104 43%,#a85c02 50%,#e0930c 100%);border:.18em solid rgba(255,233,165,.65);box-shadow:inset 0 .35em rgba(255,255,255,.25),inset 0 -.6em rgba(83,33,0,.22),0 -.2em 1em rgba(0,0,0,.28);z-index:16;display:grid;grid-template-rows:1.25em 1.45em minmax(0,1fr) 44px;gap:.16em;padding:.34em .52em .42em}.rackBrand{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;font-family:var(--display);font-size:2.2em;color:rgba(86,41,0,.17);text-shadow:0 1px rgba(255,255,255,.12)}.woodRack .rackMeta{position:relative;z-index:2;height:1.36em;grid-template-columns:6em minmax(0,1fr) 7.2em;gap:.25em}.woodRack .rackMeta span{font-size:.64em;background:rgba(70,31,0,.38);border-color:rgba(255,238,190,.2);color:#fff2c3}.rack101{position:relative;z-index:2;height:auto!important;min-height:0;border-radius:.48em;padding:.18em;background:rgba(75,39,4,.22);border-color:rgba(255,238,190,.18);box-shadow:inset 0 .22em .45em rgba(0,0,0,.14);grid-template-columns:repeat(22,minmax(0,1fr));gap:.1em;align-items:end}.real101Main .tile{min-width:0!important;width:100%;height:4.42em;min-height:0!important;border-radius:.36em;border-color:#b99a6b}.real101Main .tile b{font-size:1.26em}.real101Main .tile small{font-size:.35em;bottom:.12em}.real101Main .tile.sel{transform:translateY(-.42em)}.compactActions{position:relative;z-index:3;height:44px!important;grid-template-columns:repeat(8,minmax(0,1fr))!important;gap:.24em!important}.compactActions .uiBtn{height:44px;min-height:44px;font-size:.69em!important;border-radius:.55em;padding:0 .12em!important}
@media (max-width:1180px){.game{font-size:clamp(6.4px,.82cqw,10.6px)}.rightActionRail{right:3.4em;width:6.5em}.rightActionRail .uiBtn{font-size:.92em}.woodRack{left:7.5em;right:7.5em}.tableGrid{left:17.4%;right:22.8%}.openBoard{right:36.6%}.leaveRound{width:6.25em;height:6.25em}.sortSide{width:4.9em;height:8.2em}.sortSide b{font-size:1.7em}}
@media (max-width:900px){body:not(.mobileBlocked) .game{font-size:clamp(6px,.82cqw,9px)}}