:root { color-scheme: dark; font-family: "PingFang SC", "Noto Sans SC", system-ui, sans-serif; --felt:#0b5b39; --felt-dark:#063b29; --gold:#d5a94e; --cream:#fff8e8; --ink:#152018; }
* { box-sizing: border-box; }
body { margin:0; min-height:100dvh; overflow:hidden; background:#071a13; color:white; }
button { font:inherit; touch-action:manipulation; }
button:focus-visible { outline:3px solid #ffd36a; outline-offset:3px; }
.game-shell { --table-center:#137a4c; --table-edge:#063b29; position:relative; isolation:isolate; height:100dvh; display:grid; grid-template-rows:64px minmax(0,1fr) 156px; background-color:#173d2c; background-image:linear-gradient(180deg,rgba(4,20,15,.08),rgba(3,18,12,.42)),url("/game/src/assets/backgrounds/panzhou-cultural-game-bg.jpg"); background-position:center; background-size:cover; transition:background .3s ease; }
.game-shell.theme-red { --table-center:#c73532; --table-edge:#681918; }
.game-shell.theme-sky { --table-center:#52aee1; --table-edge:#1e5f94; }
.game-shell.theme-ginkgo { --table-center:#e2b63f; --table-edge:#8b6415; }
header { display:flex; align-items:center; justify-content:space-between; padding:max(10px,env(safe-area-inset-top)) max(22px,env(safe-area-inset-right)) 10px max(22px,env(safe-area-inset-left)); background:rgba(4,24,17,.82); border-bottom:1px solid rgba(213,169,78,.35); z-index:5; }
.brand,.player-meta,.opponent { display:flex; align-items:center; gap:10px; }
.brand-mark { display:grid; place-items:center; align-content:center; width:46px; height:46px; border:1px solid var(--gold); border-radius:50% 50% 46% 54%; color:var(--gold); font:700 22px serif; box-shadow:inset 0 0 0 3px rgba(213,169,78,.08); transform:rotate(-3deg) }
.brand-mark small { font:700 7px/1 sans-serif; letter-spacing:.18em; margin-left:.18em; }
.brand strong { display:block; letter-spacing:.12em; }.brand small,.player-meta small,.opponent small { display:block; color:#b9cdbf; font-size:12px; margin-top:2px; }
.region-tag { display:flex; align-items:center; gap:8px; padding:7px 12px; border:1px solid rgba(213,169,78,.22); border-radius:99px; color:#e2ca8e; background:rgba(213,169,78,.06); font-size:12px; letter-spacing:.08em; }
.ginkgo-mini { width:15px; height:13px; display:inline-block; border-radius:80% 5% 80% 5%; background:#d5a94e; transform:rotate(32deg); box-shadow:6px -3px 0 -2px #8d702f; }
.header-actions { display:flex; align-items:center; gap:8px; }.icon-button { min-width:56px; min-height:44px; border:1px solid rgba(255,255,255,.18); border-radius:12px; background:rgba(255,255,255,.07); color:white; cursor:pointer; transition:background .2s ease,transform .2s ease; }.icon-button:active{background:rgba(255,255,255,.18);transform:scale(.97)}
.shape-picker { display:flex; align-items:center; gap:3px; min-height:50px; padding:2px; border:1px solid rgba(255,255,255,.14); border-radius:12px; background:rgba(1,15,10,.32); }
.arm-picker { display:flex; align-items:center; gap:3px; min-height:50px; padding:2px; border:1px solid rgba(255,255,255,.14); border-radius:12px; background:rgba(1,15,10,.32); }
.arm-option { min-width:48px; min-height:44px; padding:0 8px; border:1px solid transparent; border-radius:9px; background:transparent; color:#b9cdbf; cursor:pointer; font-size:11px; font-weight:750; }
.arm-option.selected { border-color:rgba(226,191,210,.58); background:linear-gradient(180deg,rgba(239,205,221,.22),rgba(213,169,78,.08)); color:#ffe5f2; }
.shape-option { min-height:44px; padding:0 9px; display:flex; align-items:center; gap:6px; border:1px solid transparent; border-radius:9px; background:transparent; color:#b9cdbf; cursor:pointer; font-size:11px; font-weight:700; transition:background .2s ease,color .2s ease,border-color .2s ease; }
.shape-option.selected { border-color:rgba(213,169,78,.48); background:linear-gradient(180deg,rgba(213,169,78,.22),rgba(213,169,78,.09)); color:#f4d98d; }
.shape-icon { display:block; width:17px; height:11px; border:2px solid currentColor; border-radius:3px; box-shadow:inset 0 -2px rgba(0,0,0,.25); }.square-icon{width:13px;height:13px}
.chatter-toggle { min-width:68px; color:#b9cdbf; }.chatter-toggle.on { border-color:rgba(213,169,78,.48); color:#f2d786; background:rgba(213,169,78,.11); }
.theme-picker { display:flex; align-items:center; gap:7px; min-height:44px; padding:5px 9px; border:1px solid rgba(255,255,255,.13); border-radius:99px; background:rgba(255,255,255,.05); }
.theme-swatch { width:28px; height:28px; padding:0; border:2px solid rgba(255,255,255,.35); border-radius:50%; cursor:pointer; box-shadow:inset 0 1px 3px rgba(255,255,255,.35); transition:transform .2s ease,box-shadow .2s ease; }
.theme-swatch:hover { transform:scale(1.08); }.theme-swatch.selected { box-shadow:0 0 0 3px #f7d77b,inset 0 1px 3px rgba(255,255,255,.35); }
.swatch-green{background:#137a4c}.swatch-red{background:#c73532}.swatch-sky{background:#52aee1}.swatch-ginkgo{background:#e2b63f}
.gift-trigger { position:absolute!important; z-index:3!important; right:3px; bottom:-22px; min-width:52px; min-height:44px; padding:8px 10px 2px; border:1px solid rgba(255,217,114,.74); border-radius:99px; background:linear-gradient(180deg,#a93625,#6e1e17); color:#ffeab1; box-shadow:0 4px 10px rgba(0,0,0,.32); font-size:10px; font-weight:800; cursor:pointer; }
.gift-trigger:hover { filter:brightness(1.16); transform:translateY(-1px); }
.gift-menu { position:absolute; z-index:16; left:50%; top:52%; width:min(520px,72%); padding:18px; transform:translate(-50%,-50%); border:2px solid #e2b653; border-radius:22px; background:linear-gradient(155deg,rgba(65,23,17,.97),rgba(16,54,39,.98)); box-shadow:0 24px 70px rgba(0,0,0,.68),inset 0 1px rgba(255,255,255,.14); }
.gift-menu>div:first-child { display:grid; gap:2px; margin:0 42px 13px 2px; }.gift-menu>div>small{color:#e4bd6c;font-size:11px}.gift-menu>div>strong{font-size:18px;color:#fff3cf}
.gift-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.gift-grid button { min-height:72px; padding:7px; display:grid; grid-template-columns:36px 1fr; grid-template-rows:1fr 1fr; align-items:center; border:1px solid rgba(255,225,151,.24); border-radius:13px; background:rgba(255,255,255,.07); color:#fff3cf; text-align:left; cursor:pointer; transition:transform .18s ease,background .18s ease; }
.gift-grid button:hover { transform:translateY(-2px); background:rgba(213,169,78,.18); }.gift-grid button span{grid-row:1/3;font-size:28px}.gift-grid button b{font-size:12px}.gift-grid button small{color:#c9d9ca;font-size:9px}
.gift-close { position:absolute; right:12px; top:12px; width:34px; height:34px; border:1px solid rgba(255,255,255,.2); border-radius:50%; background:rgba(0,0,0,.22); color:#fff0c8; font-size:22px; cursor:pointer; }
.food-gift-flight { --gift-from-x:0px; --gift-from-y:38vh; --gift-end-x:0px; --gift-end-y:-32vh; position:absolute; z-index:15; left:50%; top:52%; display:grid; justify-items:center; color:#fff1bc; filter:drop-shadow(0 12px 12px rgba(0,0,0,.5)); animation:food-gift-fly 1.9s cubic-bezier(.16,.84,.2,1) both; pointer-events:none; }
.food-gift-flight span { position:relative; z-index:2; display:grid; place-items:center; width:76px; height:76px; border:3px solid #ffd976; border-radius:50%; background:radial-gradient(circle at 32% 25%,#fff6c8,#b43122 62%,#56160f); box-shadow:0 0 0 8px rgba(255,207,83,.13),0 0 34px rgba(255,208,74,.5); font-size:40px; animation:gift-icon-pop 1.9s cubic-bezier(.16,.84,.2,1) both; }
.food-gift-flight::before,.food-gift-flight::after { content:""; position:absolute; z-index:1; left:50%; top:38px; width:82px; height:82px; border:4px solid #ffe08a; border-radius:50%; transform:translate(-50%,-50%) scale(.25); opacity:0; animation:gift-arrival-ring .72s ease-out 1.08s both; }
.food-gift-flight::after { border-color:rgba(255,255,255,.86); animation-delay:1.24s; }
.food-gift-flight b{z-index:2;margin-top:7px;padding:5px 12px;border:1px solid rgba(255,223,138,.7);border-radius:99px;background:rgba(69,20,14,.92);box-shadow:0 5px 15px rgba(0,0,0,.36);font-size:13px;white-space:nowrap;animation:gift-label-pop 1.9s ease both}
.gift-from-0{--gift-from-x:0px;--gift-from-y:38vh}.gift-from-1{--gift-from-x:-39vw;--gift-from-y:0px}.gift-from-2{--gift-from-x:0px;--gift-from-y:-32vh}.gift-from-3{--gift-from-x:39vw;--gift-from-y:0px}
.gift-to-0{--gift-end-x:0px;--gift-end-y:38vh}.gift-to-1{--gift-end-x:-39vw;--gift-end-y:0px}.gift-to-2{--gift-end-x:0px;--gift-end-y:-32vh}.gift-to-3{--gift-end-x:39vw;--gift-end-y:0px}
@keyframes food-gift-fly{0%{opacity:0;transform:translate(calc(-50% + var(--gift-from-x)),var(--gift-from-y)) scale(.28) rotate(-14deg)}18%{opacity:1}66%{opacity:1;transform:translate(calc(-50% + var(--gift-end-x)),var(--gift-end-y)) scale(1.28) rotate(8deg)}78%{transform:translate(calc(-50% + var(--gift-end-x)),var(--gift-end-y)) scale(1.65) rotate(-3deg)}88%{opacity:1;transform:translate(calc(-50% + var(--gift-end-x)),var(--gift-end-y)) scale(1.42) rotate(0)}100%{opacity:0;transform:translate(calc(-50% + var(--gift-end-x)),var(--gift-end-y)) scale(1.55)}}
@keyframes gift-icon-pop{0%,55%{transform:scale(.78)}70%{transform:scale(1.2)}80%{transform:scale(.92)}89%{transform:scale(1.05)}100%{transform:scale(1)}}
@keyframes gift-arrival-ring{0%{opacity:0;transform:translate(-50%,-50%) scale(.2)}22%{opacity:1}100%{opacity:0;transform:translate(-50%,-50%) scale(2.7)}}
@keyframes gift-label-pop{0%,48%{opacity:0;transform:translateY(8px) scale(.75)}68%,90%{opacity:1;transform:translateY(0) scale(1)}100%{opacity:0;transform:translateY(-4px) scale(.96)}}
.table-food-gifts { position:absolute; z-index:3; inset:0; pointer-events:none; }
.table-food-gift { position:absolute; display:grid; justify-items:center; width:74px; color:#fff0bd; filter:drop-shadow(0 7px 7px rgba(0,0,0,.46)); animation:table-food-land .62s cubic-bezier(.18,.9,.28,1.3) 1.08s both; }
.table-food-gift span { position:relative; display:grid; place-items:center; width:53px; height:35px; border:2px solid #f2d486; border-radius:50%; background:radial-gradient(ellipse,#fff8dc 0 45%,#cab26e 47% 53%,#6b4325 56% 100%); box-shadow:inset 0 2px rgba(255,255,255,.8),0 5px 0 rgba(39,22,10,.48); font-size:25px; transform:perspective(90px) rotateX(16deg); }
.table-food-gift small { margin-top:6px; padding:2px 7px; border-radius:99px; background:rgba(43,22,13,.78); font-size:9px; font-weight:750; white-space:nowrap; }
.table-food-gift-0 { left:50%; bottom:12%; transform:translateX(-50%); }.table-food-gift-0.gift-slot-1{margin-left:68px}
.table-food-gift-1 { left:23%; top:56%; }.table-food-gift-1.gift-slot-1{margin-top:48px}
.table-food-gift-2 { left:50%; top:27%; transform:translateX(-50%); }.table-food-gift-2.gift-slot-1{margin-left:68px}
.table-food-gift-3 { right:23%; top:56%; }.table-food-gift-3.gift-slot-1{margin-top:48px}
@keyframes table-food-land{0%{opacity:0;scale:.35;translate:0 -34px}62%{opacity:1;scale:1.18;translate:0 4px}100%{opacity:1;scale:1;translate:0 0}}
.casino-seats { position:absolute; z-index:0; inset:64px 0 156px; overflow:hidden; pointer-events:none; }
.casino-seat { position:absolute; width:118px; height:158px; border:9px solid #11181a; border-radius:42px 42px 26px 26px; background:radial-gradient(circle at 38% 24%,rgba(255,255,255,.14),transparent 28%),repeating-radial-gradient(circle at 50% 28%,#263033 0 5px,#13191b 6px 15px); box-shadow:inset 0 0 0 3px #3b4648,inset 0 -18px 24px rgba(0,0,0,.72),0 18px 30px rgba(0,0,0,.62); }
.casino-seat::before { content:""; position:absolute; left:18px; right:18px; bottom:-48px; height:70px; border-radius:18px; background:linear-gradient(90deg,#111719,#354043 50%,#101617); box-shadow:0 14px 18px rgba(0,0,0,.5); }
.seat-left{left:-52px;top:40%;transform:translateY(-50%) rotate(90deg)}.seat-top{left:50%;top:-91px;transform:translateX(-50%) rotate(180deg)}.seat-right{right:-52px;top:40%;transform:translateY(-50%) rotate(-90deg)}.seat-bottom{left:50%;bottom:-98px;transform:translateX(-50%)}
.table { position:relative; z-index:1; isolation:isolate; margin:12px clamp(34px,7vw,112px) 10px; border:11px solid #70431f; border-top-color:#a86b31; border-bottom-color:#342015; border-radius:34px; background:var(--table-edge); box-shadow:inset 0 0 0 3px rgba(255,219,125,.7),inset 0 0 0 10px rgba(30,17,9,.48),inset 0 0 90px rgba(0,0,0,.3),0 7px 0 #7d4c23,0 13px 0 #2b1b12,0 20px 0 #111718,0 30px 54px rgba(0,0,0,.62); overflow:hidden; transition:width .28s ease,height .28s ease,border-radius .28s ease,margin .28s ease; }
.shape-rectangle .table { border-radius:42px; }
.shape-square .table { height:calc(100% - 22px); width:auto; aspect-ratio:1; justify-self:center; margin:12px 0 10px; border-radius:28px; }
.shape-square .opponent { grid-template-columns:48px minmax(82px,auto) 50px; transform:scale(.88); }.shape-square .opponent-1{left:-2%;top:42%}.shape-square .opponent-2{left:50%;top:3%;transform:translateX(-50%) scale(.88)}.shape-square .opponent-3{right:-2%;top:42%}.shape-square .opponent-info{min-width:82px}.shape-square .character-backdrop{width:50px;height:62px}.shape-square .score-chips{bottom:3%}
.table::before { content:""; position:absolute; z-index:-1; inset:0; background:url("/game/src/assets/backgrounds/tuole-ginkgo-felt.jpg") center/cover no-repeat; opacity:.96; transition:filter .3s ease,opacity .3s ease; }
.table::after { content:""; position:absolute; inset:8px; border:2px solid rgba(255,232,170,.26); border-bottom-color:rgba(0,0,0,.32); border-radius:28px; box-shadow:inset 0 3px 8px rgba(255,255,255,.12),inset 0 -7px 15px rgba(0,0,0,.22); pointer-events:none; }
.shape-square .table::after { border-radius:18px; }
.table-hardware { position:absolute; z-index:1; inset:0; pointer-events:none; }
.cup-holder { position:absolute; width:34px; height:25px; border:3px solid #efc34d; border-radius:50%; background:radial-gradient(ellipse at 50% 38%,#fff3a3 0 10%,#d79e19 14% 31%,#4b280c 36% 58%,#110d09 62%); box-shadow:inset 0 2px 3px rgba(255,255,255,.7),0 3px 0 #3b220d,0 7px 12px rgba(0,0,0,.5); }
.cup-left-top{left:15%;top:4%}.cup-right-top{right:15%;top:4%}.cup-left-bottom{left:15%;bottom:4%}.cup-right-bottom{right:15%;bottom:4%}
.theme-red .table::before { filter:hue-rotate(300deg) saturate(1.45) brightness(.92); }
.theme-sky .table::before { filter:hue-rotate(125deg) saturate(.95) brightness(1.08); }
.theme-ginkgo .table::before { filter:sepia(.7) saturate(1.2) hue-rotate(350deg) brightness(1.13); }
.theme-sky .table::after,.theme-ginkgo .table::after { border-color:rgba(24,51,40,.18); }
.theme-ginkgo .mountains { opacity:.3; }.theme-sky .mountains { opacity:.28; }
.shape-baxian .table { height:calc(100% - 22px); width:auto; aspect-ratio:1; justify-self:center; margin:12px 0 10px; border:5px solid #28170e; border-radius:18px; box-shadow:inset 0 0 0 2px rgba(255,220,127,.42),0 7px 0 #5e351a,0 14px 0 #21140d,0 22px 0 #101617,0 30px 52px rgba(0,0,0,.65); }
.shape-baxian .table::before { background:url("/game/src/assets/backgrounds/guizhou-baxian-table.jpg") center/cover no-repeat; opacity:1; filter:none!important; }
.shape-baxian .table::after { inset:2.8%; border-color:rgba(237,202,111,.3); border-radius:8px; box-shadow:inset 0 0 26px rgba(0,0,0,.2); }
.shape-baxian .opponent { grid-template-columns:48px minmax(82px,auto) 50px; transform:scale(.88); }.shape-baxian .opponent-1{left:-2%;top:42%}.shape-baxian .opponent-2{left:50%;top:3%;transform:translateX(-50%) scale(.88)}.shape-baxian .opponent-3{right:-2%;top:42%}.shape-baxian .opponent-info{min-width:82px}.shape-baxian .character-backdrop{width:50px;height:62px}.shape-baxian .score-chips{bottom:3%}
.shape-baxian .table-hardware,.shape-baxian .mountains,.shape-baxian .ginkgo-field,.shape-baxian .panzhou-seal { display:none; }
.game-shell.room-beginner { overflow:hidden; background-color:#151711; background-image:none; }
.game-shell.room-beginner::before { content:""; position:absolute; z-index:-1; inset:-14px; background-image:linear-gradient(180deg,rgba(2,20,17,.28),rgba(2,12,9,.58)),linear-gradient(90deg,rgba(5,37,28,.36),rgba(5,20,15,.08) 45% 55%,rgba(5,37,28,.36)),url("/game/src/assets/concepts/beginner-guizhou-bbq-round-table-final.png"); background-position:center 56%; background-size:cover; background-repeat:no-repeat; filter:blur(7px) saturate(.5) brightness(.62); transform:scale(1.035); }
.game-shell.room-intermediate,.game-shell.room-advanced,.game-shell.room-master { overflow:hidden; background-color:#171812; background-image:none; }
.game-shell.room-intermediate::before,.game-shell.room-advanced::before,.game-shell.room-master::before { content:""; position:absolute; z-index:-1; inset:-14px; background-image:linear-gradient(180deg,rgba(2,18,14,.2),rgba(2,12,9,.5)),url("/game/src/assets/concepts/four-room-levels-round-plastic-v3.png"); background-repeat:no-repeat; background-size:cover,200% 200%; filter:blur(5px) saturate(.68) brightness(.7); transform:scale(1.035); }
.game-shell.room-intermediate::before { background-position:center,100% 0%; }
.game-shell.room-advanced::before { background-position:center,0% 100%; filter:blur(4px) saturate(.72) brightness(.74); }
.game-shell.room-master::before { background-position:center,100% 100%; filter:blur(3px) saturate(.8) brightness(.76); }
.room-intermediate .table { border-color:#5d2d17; border-top-color:#b46c39; border-bottom-color:#2b160d; }
.room-advanced .table { border-color:#8a6326; border-top-color:#e4c36f; border-bottom-color:#3f2b12; }
.room-master .table { border-color:#17493d; border-top-color:#b4923f; border-bottom-color:#09251f; }
.room-beginner .casino-seats,.room-beginner .theme-picker,.room-beginner .baxian-table-option { display:none; }
.room-beginner .shape-picker { display:flex; }
.room-beginner .table { align-self:center; justify-self:center; width:min(82vw,1600px); height:84%; max-width:none; aspect-ratio:auto; margin:1% 0; border:9px solid #533b29; border-top-color:#9b7451; border-bottom-color:#2b211a; border-radius:38px; background:#145e3d; box-shadow:inset 0 0 0 3px rgba(240,216,164,.42),inset 0 0 0 10px rgba(37,24,15,.3),inset 0 0 70px rgba(0,0,0,.25),0 7px 0 #34271f,0 14px 0 #171311,0 25px 48px rgba(0,0,0,.58); }
.room-beginner .table::before { background:radial-gradient(ellipse at 36% 25%,rgba(255,255,255,.22),transparent 24%),radial-gradient(ellipse at 50% 48%,#23835a 0,#126342 56%,#0a452e 100%); opacity:.94; filter:none!important; border-radius:30px; }
.room-beginner .table::after { inset:7px; border:2px solid rgba(255,255,255,.38); border-radius:27px; background:linear-gradient(112deg,transparent 9%,rgba(255,255,255,.13) 22%,transparent 31%),repeating-linear-gradient(102deg,transparent 0 34px,rgba(255,255,255,.035) 35px 37px,transparent 38px 73px); box-shadow:inset 0 4px 9px rgba(255,255,255,.22),inset 0 -10px 18px rgba(0,0,0,.18); }
.room-beginner.shape-square .table { height:84%; width:auto; max-width:76vw; aspect-ratio:1; border-radius:28px; }
.room-beginner.shape-square .table::before { border-radius:20px; }
.room-beginner.shape-square .table::after { border-radius:17px; }
.room-beginner .table-hardware,.room-beginner .mountains,.room-beginner .ginkgo-field,.room-beginner .panzhou-seal { display:none; }
.room-beginner .opponent-1{left:1.5%;top:43%}.room-beginner .opponent-2{top:2%}.room-beginner .opponent-3{right:1.5%;top:43%}
.bbq-room-depth{display:none}
.game-shell.room-beginner::before{inset:-2px;background-image:linear-gradient(180deg,rgba(10,13,8,.03),rgba(8,12,8,.09) 54%,rgba(4,8,6,.54)),linear-gradient(90deg,rgba(18,8,3,.18),transparent 24% 76%,rgba(18,8,3,.18)),url("/game/src/assets/concepts/beginner-guizhou-bbq-room-food-display.png");background-position:center 54%;filter:saturate(.96) contrast(1.04) brightness(.84);transform:scale(1.006)}
.room-beginner .bbq-room-depth{position:absolute;z-index:0;inset:64px 0 156px;display:block;overflow:hidden;pointer-events:none;perspective:1000px}.bbq-pendant{position:absolute;top:-18px;width:3px;height:88px;background:linear-gradient(#15110c,#6e573d);opacity:.68}.bbq-pendant::after{content:"";position:absolute;left:50%;bottom:-13px;width:70px;height:30px;transform:translateX(-50%);border-radius:50% 50% 14% 14%;background:radial-gradient(ellipse at 50% 85%,#fff3bd 0 8%,#d5a23d 28%,#392616 68%);box-shadow:0 12px 40px rgba(255,191,71,.34)}.pendant-left{left:24%}.pendant-center{left:50%;height:67px}.pendant-right{right:24%}.bbq-floor-glow{position:absolute;left:8%;right:8%;bottom:-15%;height:55%;border-radius:50%;background:radial-gradient(ellipse,rgba(216,148,64,.24),rgba(60,31,12,.08) 48%,transparent 72%);transform:rotateX(64deg);filter:blur(6px)}.bbq-foreground-edge{position:absolute;left:-5%;right:-5%;bottom:-43px;height:92px;border-radius:50% 50% 0 0;background:linear-gradient(180deg,rgba(64,39,22,.5),rgba(10,9,7,.96));box-shadow:0 -16px 40px rgba(0,0,0,.42)}
.room-beginner .table{width:min(74vw,1320px);height:70%;margin:7.5% 0 0;transform:perspective(1050px) rotateX(11deg) translateY(-2px);transform-origin:center bottom;border-width:9px 15px 24px;border-radius:34px 34px 28px 28px;box-shadow:inset 0 0 0 3px rgba(240,216,164,.48),inset 0 0 0 11px rgba(37,24,15,.34),inset 0 18px 32px rgba(255,255,255,.08),inset 0 -30px 48px rgba(0,0,0,.28),0 12px 0 #523a29,0 25px 0 #2b211a,0 38px 0 #12100e,0 54px 74px rgba(0,0,0,.78);animation:bbq-table-depth 6s ease-in-out infinite}
.room-beginner .table::before{border-radius:22px}.room-beginner .table::after{border-radius:19px}
.room-beginner .opponent-1{left:1%;top:39%}.room-beginner .opponent-2{top:0}.room-beginner .opponent-3{right:1%;top:39%}
.room-beginner.shape-square .table{height:88%;max-width:84vw;margin-top:0;transform:perspective(1050px) rotateX(11deg) translateY(-2px)}
.room-beginner.shape-square .opponent{grid-template-columns:48px minmax(108px,auto);transform:scale(.96)}
.room-beginner.shape-square .opponent-2{transform:translateX(-50%) scale(.96)}
.room-beginner.shape-square .opponent-1{left:-4%}
.room-beginner.shape-square .opponent-3{right:-4%}
.room-beginner.shape-square .character-backdrop{display:none}
@keyframes bbq-table-depth{0%,100%{transform:perspective(1050px) rotateX(11deg) translateY(-2px);filter:drop-shadow(0 0 0 rgba(231,181,84,0))}50%{transform:perspective(1050px) rotateX(10.3deg) translateY(1px);filter:drop-shadow(0 7px 9px rgba(231,181,84,.09))}}
@media (max-height:700px){.room-beginner .table{height:73%;margin-top:6%}.room-beginner .bbq-room-depth{inset:56px 0 136px}.bbq-pendant{opacity:.48}}
@media (prefers-reduced-motion:reduce){.room-beginner .table{transition:none;animation:none}}
.urge-menu-open.room-beginner .table{animation:none;transform:perspective(1050px) rotateX(11deg) translateX(-28vw) translateY(-2px);transition:transform .24s ease,box-shadow .24s ease}
.urge-menu-open.room-beginner.shape-square .table{transform:perspective(1050px) rotateX(11deg) translateX(-28vw) translateY(-2px)}
@media (max-width:940px){.urge-phrase-panel{right:8px;width:min(300px,35vw);padding:14px}.urge-phrase-list button{min-height:54px;padding:7px 9px}.urge-phrase-list b{font-size:11px}}
@media (prefers-reduced-motion:reduce){.urge-menu-open.room-beginner .table{transition:none}}
.table-entry-sequence{position:fixed;z-index:100;inset:0;overflow:hidden;background:#120e09;color:#fff6d8}.entry-room-camera{position:absolute;inset:-4%;background-image:linear-gradient(180deg,rgba(9,7,4,.05),rgba(10,7,4,.12) 55%,rgba(7,5,3,.46)),url("/game/src/assets/concepts/beginner-guizhou-bbq-room-food-display.png");background-position:center 52%;background-size:cover;filter:saturate(.98) contrast(1.05) brightness(.88);animation:entry-camera-push 3.2s cubic-bezier(.2,.68,.24,1) both}.entry-light-lanes{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(0,0,0,.32),transparent 25% 75%,rgba(0,0,0,.32))}.entry-light-lanes i{position:absolute;top:0;width:2px;height:42%;background:linear-gradient(rgba(55,40,25,.9),rgba(175,129,61,.3))}.entry-light-lanes i::after{content:"";position:absolute;left:50%;bottom:-15px;width:78px;height:32px;transform:translateX(-50%);border-radius:50% 50% 14% 14%;background:radial-gradient(ellipse at center bottom,#fff4c1 0 9%,#d8a547 30%,#2b1c11 70%);box-shadow:0 16px 52px rgba(255,192,75,.38)}.entry-light-lanes i:nth-child(1){left:25%}.entry-light-lanes i:nth-child(2){left:50%;height:34%}.entry-light-lanes i:nth-child(3){right:24%}
.entry-character{position:absolute;z-index:3;left:12%;bottom:4%;width:112px;height:270px;transform-origin:center bottom;filter:drop-shadow(0 18px 18px rgba(0,0,0,.58));animation:entry-person-walk 3.05s cubic-bezier(.28,.58,.24,1) both}.entry-head{position:absolute;z-index:4;left:23px;top:0;width:66px;height:66px;border:3px solid #e2bc5c;border-radius:50%;overflow:hidden;background:#173e31;box-shadow:0 5px 12px rgba(0,0,0,.4)}.entry-head img{width:100%;height:100%;object-fit:cover}.entry-body{position:absolute;z-index:2;left:26px;top:57px;width:60px;height:116px;border:3px solid rgba(224,190,101,.65);border-radius:26px 26px 14px 14px;background:linear-gradient(90deg,#142a24,#245b45 48%,#0d221b);box-shadow:inset 8px 0 rgba(255,255,255,.04)}.entry-body::after{content:"";position:absolute;left:8px;right:8px;top:48px;height:4px;border-radius:99px;background:#c99d42}.entry-arm,.entry-leg{position:absolute;display:block;transform-origin:top center;background:linear-gradient(90deg,#0d201a,#285844,#10261e);border:2px solid rgba(220,184,91,.48);box-shadow:0 6px 9px rgba(0,0,0,.28)}.entry-arm{z-index:1;top:70px;width:22px;height:94px;border-radius:16px}.arm-left{left:12px;animation:entry-arm-left .54s ease-in-out infinite alternate}.arm-right{right:12px;animation:entry-arm-right .54s ease-in-out infinite alternate}.entry-leg{z-index:1;top:164px;width:25px;height:100px;border-radius:12px 12px 8px 8px}.leg-left{left:27px;animation:entry-leg-left .54s ease-in-out infinite alternate}.leg-right{right:27px;animation:entry-leg-right .54s ease-in-out infinite alternate}.entry-leg::after{content:"";position:absolute;left:-5px;bottom:-5px;width:35px;height:13px;border-radius:11px 14px 6px 6px;background:#171512;border:1px solid #8c6d33}
.entry-table-target{position:absolute;z-index:2;left:50%;bottom:15%;width:420px;height:150px;transform:translateX(-50%) perspective(700px) rotateX(63deg);border:5px solid rgba(228,190,92,.52);border-radius:30px;background:rgba(13,103,67,.2);box-shadow:0 0 45px rgba(232,185,76,.2),inset 0 0 50px rgba(231,190,94,.12);opacity:0;animation:entry-table-focus 3.2s ease both}.entry-table-target i{position:absolute;inset:12px;border:1px solid rgba(255,231,162,.4);border-radius:22px}
.entry-story{position:absolute;z-index:5;left:50%;bottom:5%;transform:translateX(-50%);min-width:300px;padding:13px 26px;border:1px solid rgba(245,213,126,.62);border-radius:16px;background:linear-gradient(180deg,rgba(8,67,53,.92),rgba(28,27,18,.92));box-shadow:0 15px 38px rgba(0,0,0,.48);text-align:center;animation:entry-story-rise .55s .18s ease-out both}.entry-story small,.entry-story strong{display:block}.entry-story small{color:#d6bd78;font-size:9px;letter-spacing:.15em}.entry-story strong{margin-top:4px;color:#fff0bd;font:900 18px "STKaiti","KaiTi",serif;letter-spacing:.08em}.entry-story>span{margin-top:7px;display:flex;justify-content:center;gap:6px}.entry-story>span i{width:6px;height:6px;border-radius:50%;background:#e8c469;animation:entry-dot .7s ease-in-out infinite alternate}.entry-story>span i:nth-child(2){animation-delay:.16s}.entry-story>span i:nth-child(3){animation-delay:.32s}.entry-skip{position:absolute;z-index:7;right:22px;top:22px;min-width:96px;min-height:44px;border:1px solid rgba(255,230,166,.5);border-radius:12px;background:rgba(4,35,28,.78);color:#ffedbc;font-weight:800;cursor:pointer;transition:background .2s ease,border-color .2s ease}.entry-skip:hover{border-color:#ffe09a;background:rgba(8,76,59,.92)}.entry-skip:focus-visible{outline:3px solid #f2ca65;outline-offset:3px}.entry-transition{position:absolute;z-index:6;inset:0;background:#071b14;opacity:0;pointer-events:none;animation:entry-fade-to-table 3.2s ease both}
@keyframes entry-camera-push{0%{transform:scale(1.02);filter:saturate(.9) contrast(1.02) brightness(.72)}72%{transform:scale(1.11);filter:saturate(.99) contrast(1.05) brightness(.89)}100%{transform:scale(1.14);filter:saturate(1) contrast(1.05) brightness(.82)}}@keyframes entry-person-walk{0%{transform:translate(0,0) scale(1);opacity:0}8%{opacity:1}72%{transform:translate(35vw,-7vh) scale(.53);opacity:1}91%{transform:translate(39vw,-9vh) scale(.42);opacity:1}100%{transform:translate(39vw,-9vh) scale(.42);opacity:0}}@keyframes entry-arm-left{from{transform:rotate(24deg)}to{transform:rotate(-25deg)}}@keyframes entry-arm-right{from{transform:rotate(-25deg)}to{transform:rotate(24deg)}}@keyframes entry-leg-left{from{transform:rotate(16deg)}to{transform:rotate(-14deg)}}@keyframes entry-leg-right{from{transform:rotate(-14deg)}to{transform:rotate(16deg)}}@keyframes entry-table-focus{0%,38%{opacity:0;transform:translateX(-50%) perspective(700px) rotateX(63deg) scale(.82)}68%,92%{opacity:1;transform:translateX(-50%) perspective(700px) rotateX(63deg) scale(1)}100%{opacity:0;transform:translateX(-50%) perspective(700px) rotateX(63deg) scale(1.04)}}@keyframes entry-story-rise{from{opacity:0;transform:translate(-50%,18px)}to{opacity:1;transform:translate(-50%,0)}}@keyframes entry-dot{from{opacity:.35;transform:translateY(0)}to{opacity:1;transform:translateY(-3px)}}@keyframes entry-fade-to-table{0%,88%{opacity:0}100%{opacity:1}}
@media (prefers-reduced-motion:reduce){.entry-room-camera,.entry-character,.entry-arm,.entry-leg,.entry-table-target,.entry-story,.entry-story>span i,.entry-transition{animation-duration:.01ms!important;animation-delay:0s!important}.entry-character{display:none}}
.mountains { position:absolute; inset:0; overflow:hidden; opacity:.07; }
.mountain-ridge { position:absolute; left:-4%; right:-4%; bottom:-24%; height:68%; clip-path:polygon(0 78%,8% 56%,16% 68%,26% 27%,35% 64%,45% 40%,54% 69%,65% 18%,76% 64%,87% 36%,100% 72%,100% 100%,0 100%); }
.ridge-back { background:#6ca079; opacity:.34; transform:translateY(-20px) scale(1.08); }
.ridge-front { background:#082e21; opacity:.72; }
.sun-disc { position:absolute; right:17%; top:15%; width:68px; height:68px; border-radius:50%; background:radial-gradient(circle,#e6bc5b 0 20%,rgba(230,188,91,.18) 21% 62%,transparent 63%); }
.ginkgo-field { position:absolute; inset:0; pointer-events:none; opacity:.25; }
.ginkgo-field i { position:absolute; width:22px; height:17px; border-radius:90% 8% 90% 8%; background:#e1b54b; transform:rotate(32deg); }
.ginkgo-field i:nth-child(1){left:9%;top:18%}.ginkgo-field i:nth-child(2){left:15%;bottom:17%;transform:rotate(110deg) scale(.75)}.ginkgo-field i:nth-child(3){right:10%;top:23%;transform:rotate(-25deg) scale(.8)}.ginkgo-field i:nth-child(4){right:18%;bottom:15%;transform:rotate(75deg) scale(.65)}.ginkgo-field i:nth-child(5){left:41%;top:12%;transform:rotate(145deg) scale(.55)}.ginkgo-field i:nth-child(6){right:37%;bottom:10%;transform:rotate(-65deg) scale(.7)}
.panzhou-seal { position:absolute; left:50%; top:54%; transform:translate(-50%,-50%) rotate(-5deg); width:84px; height:84px; display:grid; place-items:center; align-content:center; border:2px solid rgba(213,169,78,.18); outline:1px solid rgba(213,169,78,.12); outline-offset:5px; border-radius:9px; color:rgba(228,196,119,.2); font-family:serif; letter-spacing:.15em; pointer-events:none; }
.panzhou-seal small { font-size:9px; }.panzhou-seal b { font-size:20px; writing-mode:vertical-rl; }
.play-fx { --fx-x:0px; --fx-y:190px; position:absolute; inset:0; z-index:9; pointer-events:none; }
.play-fx.from-1{--fx-x:-360px;--fx-y:0px}.play-fx.from-2{--fx-x:0px;--fx-y:-180px}.play-fx.from-3{--fx-x:360px;--fx-y:0px}
.play-arm { position:absolute; z-index:8; width:150px; height:300px; left:calc(50% - 75px); bottom:-110px; transform-origin:50% 100%; filter:drop-shadow(0 16px 13px rgba(0,0,0,.34)); animation:arm-from-bottom .92s cubic-bezier(.2,.75,.25,1) both; }
.real-arm-sprite { display:block; width:100%; height:100%; object-fit:contain; object-position:center bottom; }
.arm-lady .play-arm { width:142px; left:calc(50% - 71px); filter:drop-shadow(0 16px 13px rgba(0,0,0,.28)); }
.from-1.arm-lady .play-arm { left:-94px; }.from-2.arm-lady .play-arm { left:calc(50% - 71px); }.from-3.arm-lady .play-arm { left:auto; right:-94px; }
.from-1 .play-arm { left:-98px; top:calc(52% - 75px); bottom:auto; transform:rotate(90deg); animation-name:arm-from-left; }
.from-2 .play-arm { left:calc(50% - 75px); top:-110px; bottom:auto; transform:rotate(180deg); animation-name:arm-from-top; }
.from-3 .play-arm { left:auto; right:-98px; top:calc(52% - 75px); bottom:auto; transform:rotate(-90deg); animation-name:arm-from-right; }
@keyframes arm-from-bottom { 0%{opacity:0;transform:translateY(120px)} 35%{opacity:1} 68%{transform:translateY(-88px)} 100%{opacity:0;transform:translateY(-72px)} }
@keyframes arm-from-left { 0%{opacity:0;transform:rotate(90deg) translateY(120px)} 35%{opacity:1} 68%{transform:rotate(90deg) translateY(-88px)} 100%{opacity:0;transform:rotate(90deg) translateY(-72px)} }
@keyframes arm-from-top { 0%{opacity:0;transform:rotate(180deg) translateY(120px)} 35%{opacity:1} 68%{transform:rotate(180deg) translateY(-88px)} 100%{opacity:0;transform:rotate(180deg) translateY(-72px)} }
@keyframes arm-from-right { 0%{opacity:0;transform:rotate(-90deg) translateY(120px)} 35%{opacity:1} 68%{transform:rotate(-90deg) translateY(-88px)} 100%{opacity:0;transform:rotate(-90deg) translateY(-72px)} }
.flying-card { position:absolute; left:50%; top:52%; animation:card-flight .88s cubic-bezier(.18,.82,.22,1) both; filter:drop-shadow(0 14px 16px rgba(0,0,0,.4)); }
.flying-card .card { transform:translate(-50%,-50%) rotate(-3deg) scale(1.08); }
.impact-ring { position:absolute; left:50%; top:52%; width:86px; height:86px; border:3px solid rgba(255,218,116,.8); border-radius:50%; transform:translate(-50%,-50%) scale(.2); animation:impact-ring .86s ease-out .38s both; }
.surprise .impact-ring { width:122px; height:122px; border-width:5px; border-color:#ffe59a; box-shadow:0 0 30px rgba(255,204,72,.55); }
.surprise-word { position:absolute; left:calc(50% + 58px); top:calc(52% - 68px); color:#fff3bf; font:900 28px/1 "PingFang SC",sans-serif; text-shadow:0 3px 0 #9b3d23,0 8px 18px rgba(0,0,0,.4); transform:rotate(8deg); animation:surprise-pop .72s cubic-bezier(.2,.9,.25,1.2) .22s both; }
.special-card-burst { --special-main:#a52d32; --special-light:#ffd2b1; position:absolute; z-index:12; left:calc(50% + 82px); top:calc(52% - 86px); width:142px; min-height:106px; display:grid; justify-items:center; align-content:center; color:#fff; filter:drop-shadow(0 12px 14px rgba(0,0,0,.42)); animation:special-burst-in 1.35s cubic-bezier(.18,.82,.24,1.12) .18s both; perspective:500px; }
.special-sheep .special-card-burst{--special-main:#18865f;--special-light:#c9ffe0}.special-transformer .special-card-burst{--special-main:#4b55c7;--special-light:#d9dcff}
.special-emblem { position:relative; z-index:2; width:68px; height:68px; display:grid; place-items:center; align-content:center; border:3px solid var(--special-light); border-radius:50%; background:radial-gradient(circle at 34% 25%,var(--special-light),var(--special-main) 34%,#27151a 100%); box-shadow:inset -8px -10px 14px rgba(0,0,0,.35),inset 5px 6px 9px rgba(255,255,255,.35),0 7px 0 color-mix(in srgb,var(--special-main),#000 55%),0 13px 22px rgba(0,0,0,.45); transform:rotateX(12deg) rotateY(-12deg); }
.special-emblem b{font:900 25px/1 "PingFang SC",sans-serif;text-shadow:0 2px 0 rgba(0,0,0,.45)}.special-emblem i{font:900 12px/1 Georgia,serif;color:var(--special-light);font-style:normal;margin-top:3px}.special-card-burst>strong{z-index:2;margin-top:10px;font-size:17px;text-shadow:0 2px 0 var(--special-main),0 5px 12px rgba(0,0,0,.5)}.special-card-burst>small{z-index:2;margin-top:3px;color:var(--special-light);font-size:9px;font-weight:750}
.special-wave { position:absolute; left:50%; top:31px; width:72px; height:72px; border:3px solid var(--special-light); border-radius:50%; transform:translate(-50%,-50%); animation:special-wave-out 1s ease-out .25s both; }.wave-two{animation-delay:.45s}
.special-pig .flying-card .card{box-shadow:0 0 0 3px #d84c50,0 0 28px rgba(216,76,80,.85)}.special-sheep .flying-card .card{box-shadow:0 0 0 3px #58d49c,0 0 28px rgba(88,212,156,.85)}.special-transformer .flying-card .card{box-shadow:0 0 0 3px #7c86ff,0 0 32px rgba(89,102,255,.9)}
@keyframes special-burst-in{0%{opacity:0;transform:translateY(18px) rotateY(-55deg) scale(.25)}45%{opacity:1;transform:translateY(-5px) rotateY(10deg) scale(1.16)}72%{transform:translateY(0) rotateY(-4deg) scale(1)}100%{opacity:0;transform:translateY(-8px) rotateY(0) scale(.96)}}
@keyframes special-wave-out{0%{opacity:0;transform:translate(-50%,-50%) scale(.35)}25%{opacity:.9}100%{opacity:0;transform:translate(-50%,-50%) scale(2.15)}}
.spark { position:absolute; left:50%; top:52%; width:5px; height:38px; border-radius:99px; background:linear-gradient(#ffe9a6,transparent); transform-origin:50% 0; opacity:0; animation:spark-out .62s ease-out .28s both; }.spark-1{transform:rotate(35deg) translateY(-70px)}.spark-2{transform:rotate(125deg) translateY(-70px)}.spark-3{transform:rotate(215deg) translateY(-70px)}.spark-4{transform:rotate(305deg) translateY(-70px)}
@keyframes card-flight { 0%{opacity:0;transform:translate(calc(-50% + var(--fx-x)),calc(-50% + var(--fx-y))) rotate(-14deg) scale(.72)} 68%{opacity:1;transform:translate(-50%,-50%) rotate(3deg) scale(1.12)} 100%{opacity:1;transform:translate(-50%,-50%) rotate(0) scale(1)} }
@keyframes impact-ring { 0%{opacity:0;transform:translate(-50%,-50%) scale(.18)} 35%{opacity:1} 100%{opacity:0;transform:translate(-50%,-50%) scale(1.5)} }
@keyframes surprise-pop { 0%{opacity:0;transform:rotate(8deg) scale(.2)} 60%{opacity:1;transform:rotate(-4deg) scale(1.2)} 100%{opacity:0;transform:rotate(2deg) scale(1)} }
@keyframes spark-out { 0%{opacity:0} 30%{opacity:1} 100%{opacity:0;filter:blur(1px)} }
.opponent { position:absolute; z-index:2; min-height:72px; padding:7px 11px; display:grid; grid-template-columns:52px minmax(112px,auto) 62px; align-items:center; column-gap:10px; border-radius:16px; background:linear-gradient(100deg,rgba(3,25,17,.92),rgba(3,25,17,.52)); border:1px solid transparent; overflow:visible; box-shadow:0 9px 24px rgba(0,0,0,.22); }
.opponent>*:not(.character-backdrop) { position:relative; z-index:1; }
.character-backdrop { position:relative; z-index:0; grid-column:3; grid-row:1; align-self:end; width:62px; height:68px; object-fit:cover; border-radius:42% 12px 12px 42%; opacity:.32; filter:saturate(.8) contrast(1.08) drop-shadow(0 8px 7px rgba(0,0,0,.25)); mask-image:linear-gradient(90deg,transparent 0 12%,#000 48% 100%); pointer-events:none; transform-origin:50% 100%; transform:perspective(420px) translateY(7px) rotateX(8deg) scale(.94); transition:transform .48s cubic-bezier(.2,.78,.24,1),opacity .32s ease,filter .32s ease; }
.opponent.active .character-backdrop { opacity:.58; filter:saturate(1.1) contrast(1.12) drop-shadow(0 15px 10px rgba(0,0,0,.38)); transform:perspective(420px) translateY(-12px) rotateX(-4deg) scale(1.08); }
.opponent.playing .character-backdrop { animation:player-stand-play-sit 1.15s cubic-bezier(.2,.75,.24,1) both; }
.opponent.active { border-color:var(--gold); box-shadow:0 0 0 3px rgba(213,169,78,.12); }.opponent-1{left:3%;top:42%}.opponent-2{left:50%;top:4%;transform:translateX(-50%)}.opponent-3{right:3%;top:42%}
.opponent.team-a { border-color:rgba(82,190,239,.76); background:linear-gradient(100deg,rgba(5,45,63,.94),rgba(4,33,39,.68)); box-shadow:inset 3px 0 rgba(103,213,255,.62),0 9px 24px rgba(0,0,0,.25); }
.opponent.team-b { border-color:rgba(233,184,67,.76); background:linear-gradient(100deg,rgba(66,42,12,.94),rgba(37,30,15,.68)); box-shadow:inset 3px 0 rgba(255,211,104,.62),0 9px 24px rgba(0,0,0,.25); }
.opponent.team-a.active { box-shadow:0 0 0 4px rgba(86,203,255,.24),0 0 24px rgba(61,186,239,.32); }
.opponent.team-b.active { box-shadow:0 0 0 4px rgba(255,204,83,.22),0 0 24px rgba(230,177,47,.3); }
.opponent.teammate { border-color:rgba(99,197,255,.78); background:linear-gradient(145deg,rgba(9,53,73,.9),rgba(3,31,24,.78)); box-shadow:0 0 0 3px rgba(75,181,242,.14),0 8px 22px rgba(0,0,0,.24); }
.opponent.teammate .avatar-frame { background:linear-gradient(145deg,#bcecff,#3ba9e9); box-shadow:0 0 0 3px rgba(94,201,255,.2),0 4px 14px rgba(0,0,0,.35); }
.player-identity { grid-column:1; grid-row:1; display:flex; flex-direction:column; align-items:center; gap:4px; width:52px; }
.opponent-info { grid-column:2; grid-row:1; min-width:112px; padding-right:0; }
.teammate-badge { display:inline-flex; align-items:center; justify-content:center; min-width:38px; padding:3px 7px; border:1px solid rgba(169,229,255,.72); border-radius:99px; background:#e1f6ff; color:#075980; box-shadow:0 2px 8px rgba(0,0,0,.2); font-size:10px; font-weight:800; line-height:1; letter-spacing:.08em; }
.team-badge { display:inline-flex; align-items:center; justify-content:center; margin-left:5px; padding:3px 7px; border-radius:99px; font-size:9px; font-weight:850; line-height:1; letter-spacing:.04em; vertical-align:middle; }
.team-a .team-badge { border:1px solid #91dcfb; background:#dff6ff; color:#08638a; }
.team-b .team-badge { border:1px solid #f2d47d; background:#fff1bd; color:#73500b; }
.player-identity .team-badge { margin-left:0; white-space:nowrap; }
.avatar-frame { position:relative; width:48px; height:48px; flex:0 0 48px; border-radius:50%; padding:2px; background:linear-gradient(145deg,rgba(255,255,255,.45),rgba(213,169,78,.5)); box-shadow:0 4px 12px rgba(0,0,0,.3); transition:box-shadow .2s ease,transform .2s ease; }
.avatar-frame.online { box-shadow:0 0 0 3px rgba(246,201,90,.2),0 4px 14px rgba(0,0,0,.35); transform:translateY(-1px); }
.avatar-image { display:block; width:100%; height:100%; border-radius:50%; object-fit:cover; background:#244c3a; }
.avatar-edit { position:absolute; z-index:3; left:-7px; top:-7px; width:25px; height:25px; padding:0; display:grid; place-items:center; border:1px solid #ffe39a; border-radius:50%; background:#183d31; color:#ffe39a; font-size:10px; font-weight:800; cursor:pointer; box-shadow:0 3px 8px rgba(0,0,0,.35); }
.avatar-edit::after { content:""; position:absolute; inset:-10px; border-radius:50%; }
.presence { position:absolute; right:0; bottom:1px; width:12px; height:12px; border:2px solid #123529; border-radius:50%; background:#7fd890; }
.avatar-frame.online .presence { background:#f6c95a; box-shadow:0 0 0 3px rgba(246,201,90,.16); }
.turn-status { position:absolute; top:19%; left:50%; transform:translateX(-50%); display:flex;align-items:center;gap:7px;padding:7px 13px;border-radius:99px;background:rgba(4,28,19,.75);font-size:13px;color:#ecdfb4; }
.pulse { width:8px;height:8px;border-radius:50%;background:#f6c95a;box-shadow:0 0 0 5px rgba(246,201,90,.12); }
.turn-countdown { display:grid; place-items:center; width:24px; height:24px; margin-left:3px; border-radius:50%; background:#d5a94e; color:#271b08; font-variant-numeric:tabular-nums; font-size:12px; }
.turn-countdown.urgent { background:#d94236; color:#fff; box-shadow:0 0 0 5px rgba(217,66,54,.16); animation:countdown-urgent .8s ease-in-out infinite alternate; }
.seat-turn-status { position:absolute!important; z-index:8!important; left:50%; top:calc(100% + 7px); min-width:116px; padding:5px 10px 5px 6px; display:flex; align-items:center; justify-content:center; gap:7px; transform:translateX(-50%); border:1px solid rgba(244,211,120,.58); border-radius:99px; background:rgba(3,26,22,.96); box-shadow:0 7px 18px rgba(0,0,0,.38); color:#f5e6ba; white-space:nowrap; }
.seat-turn-status em { font-size:10px; font-style:normal; font-weight:800; }
.seat-countdown { --remaining:30; position:relative; width:30px; height:30px; flex:0 0 30px; display:grid; place-items:center; border-radius:50%; background:conic-gradient(#f1c95f calc(var(--remaining) * 12deg),rgba(255,255,255,.14) 0); }
.seat-countdown::before { content:""; position:absolute; inset:4px; border-radius:50%; background:#17382e; }
.seat-countdown b { position:relative; z-index:1; font-size:10px; font-variant-numeric:tabular-nums; }
.seat-turn-status.urgent { border-color:#e36b4e; color:#ffd4c8; }.seat-turn-status.urgent .seat-countdown{background:conic-gradient(#ef7657 calc(var(--remaining) * 12deg),rgba(255,255,255,.12) 0)}
.seat-turn-status.critical { border-color:#ff493d; color:#fff; box-shadow:0 0 0 4px rgba(255,61,50,.15),0 7px 18px rgba(0,0,0,.38); animation:countdown-urgent .6s ease-in-out infinite alternate; }.seat-turn-status.critical .seat-countdown{background:conic-gradient(#ff493d calc(var(--remaining) * 12deg),rgba(255,255,255,.12) 0)}
.self-urge { position:absolute; z-index:6; left:50%; bottom:20%; transform:translateX(-50%); padding:9px 14px; border:1px solid rgba(213,169,78,.72); border-radius:14px; background:#fff6dc; color:#2e281c; box-shadow:0 8px 22px rgba(0,0,0,.3); font-size:13px; font-weight:750; }
@keyframes countdown-urgent { from{transform:scale(1)} to{transform:scale(1.1)} }
.taunt-bubble { position:absolute; left:50%; bottom:calc(100% + 10px); width:max-content; max-width:220px; transform:translateX(-50%); padding:9px 13px; border:1px solid rgba(213,169,78,.7); border-radius:14px 14px 14px 4px; background:#fff6dc; color:#2e281c; box-shadow:0 8px 22px rgba(0,0,0,.32); font-size:13px; font-weight:650; line-height:1.4; animation:bubble-in .22s ease-out; }
.taunt-bubble::after { content:""; position:absolute; left:50%; top:100%; border:6px solid transparent; border-top-color:#fff6dc; }
.banter-bubble { position:absolute; left:50%; bottom:calc(100% + 10px); width:max-content; max-width:230px; transform:translateX(-50%); padding:10px 14px; border:1px solid rgba(91,154,130,.65); border-radius:16px 16px 16px 5px; background:#eef9f2; color:#17382b; box-shadow:0 8px 22px rgba(0,0,0,.3); font-size:13px; font-weight:650; line-height:1.4; animation:bubble-in .22s ease-out; }
.banter-bubble::after { content:""; position:absolute; left:50%; top:100%; border:6px solid transparent; border-top-color:#eef9f2; }
.opponent-1 :is(.taunt-bubble,.banter-bubble){left:calc(100% + 12px);right:auto;top:50%;bottom:auto;transform:translateY(-50%);animation:bubble-side-in .22s ease-out}
.opponent-1 :is(.taunt-bubble,.banter-bubble)::after{left:auto;right:100%;top:50%;transform:translateY(-50%);border:7px solid transparent;border-right-color:#fff6dc}
.opponent-1 .banter-bubble::after{border-right-color:#eef9f2}
.opponent-3 :is(.taunt-bubble,.banter-bubble){left:auto;right:calc(100% + 12px);top:50%;bottom:auto;transform:translateY(-50%);animation:bubble-side-in .22s ease-out}
.opponent-3 :is(.taunt-bubble,.banter-bubble)::after{left:100%;right:auto;top:50%;transform:translateY(-50%);border:7px solid transparent;border-left-color:#fff6dc}
.opponent-3 .banter-bubble::after{border-left-color:#eef9f2}
@keyframes bubble-side-in { from { opacity:0; transform:translateY(-50%) scale(.96) } to { opacity:1; transform:translateY(-50%) scale(1) } }
.player-meta { position:relative; }.avatar-menu { position:absolute; z-index:18; left:0; bottom:calc(100% + 14px); width:150px; padding:6px; display:grid; gap:5px; border:1px solid rgba(213,169,78,.55); border-radius:14px; background:#0b2f24; box-shadow:0 12px 30px rgba(0,0,0,.45); }.avatar-menu[hidden]{display:none}.avatar-menu button{min-height:44px;border:1px solid rgba(255,255,255,.16);border-radius:9px;background:rgba(255,255,255,.07);color:#f4dfaa;cursor:pointer}.avatar-menu button:disabled{opacity:.38;cursor:not-allowed}.player-banter { position:absolute; left:36px; bottom:calc(100% + 18px); width:max-content; max-width:230px; padding:10px 14px; border:1px solid rgba(213,169,78,.65); border-radius:16px 16px 5px 16px; background:#fff6dc; color:#2e281c; box-shadow:0 8px 22px rgba(0,0,0,.3); font-size:13px; font-weight:650; animation:bubble-up .22s ease-out; z-index:12; }
@keyframes bubble-up { from { opacity:0; transform:translateY(7px) scale(.96) } to { opacity:1; transform:translateY(0) scale(1) } }
.urge-button { position:absolute; right:4%; bottom:6%; min-width:76px; min-height:44px; border:1px solid rgba(213,169,78,.6); border-radius:99px; background:rgba(6,42,29,.82); color:#f2d786; cursor:pointer; transition:background .2s ease,transform .2s ease; }
.urge-button:hover,.urge-button.open { background:rgba(213,169,78,.24); box-shadow:0 0 0 3px rgba(213,169,78,.13); }.urge-button:active { transform:scale(.96); }
.urge-phrase-panel { position:fixed; z-index:24; right:max(18px,env(safe-area-inset-right)); top:50%; width:min(400px,36vw); max-height:calc(100dvh - 110px); padding:22px; transform:translateY(-50%); overflow-x:hidden; overflow-y:auto; border:2px solid rgba(237,198,101,.8); border-radius:26px 5px 5px 26px; background:linear-gradient(155deg,#144336,#04211c); box-shadow:inset 0 1px rgba(255,255,255,.16),-16px 18px 42px rgba(0,0,0,.48); animation:urge-panel-in .2s ease-out; }
.urge-phrase-panel>div:first-child { position:relative; padding-right:44px; display:grid; grid-template-columns:auto 1fr; align-items:end; gap:5px 10px; text-align:left; }.urge-phrase-panel>div>small{grid-column:1/3;color:#c1d6c9;font-size:10px}.urge-phrase-panel>div>strong{color:#ffe39a;font-size:22px}.urge-phrase-panel>div>button{position:absolute;right:0;top:0;width:40px;height:40px;border:1px solid rgba(255,255,255,.2);border-radius:50%;background:rgba(0,0,0,.18);color:#fff0c5;font-size:22px;cursor:pointer}.urge-phrase-panel>p{margin:12px 0 10px;color:#c6d8ce;font-size:11px;text-align:left}.urge-phrase-list{display:grid;gap:9px;min-width:0}.urge-phrase-list button{min-width:0;min-height:62px;padding:8px 10px 8px 13px;display:grid;grid-template-columns:24px minmax(0,1fr) 38px;align-items:center;gap:10px;border:1px solid rgba(255,223,143,.2);border-radius:13px;background:rgba(255,255,255,.065);color:#fff5d8;text-align:left;cursor:pointer;transition:transform .16s ease,background .16s ease,border-color .16s ease}.urge-phrase-list button:hover{transform:translateX(-3px);border-color:#f1ce76;background:rgba(213,169,78,.17)}.urge-phrase-list .phrase-rank{width:auto;height:auto;display:block;border:0;border-radius:0;background:transparent;color:#d6b65f;font-size:12px;font-weight:900;text-align:center}.urge-phrase-list .phrase-play{width:36px;height:36px;display:grid;place-items:center;border:1px solid #e6c46c;border-radius:10px;background:linear-gradient(180deg,#2b876a,#14533f);color:#fff1bf;font-size:13px;font-weight:900;box-shadow:inset 0 1px rgba(255,255,255,.2)}.urge-phrase-list b{min-width:0;font-size:14px;line-height:1.45;overflow-wrap:anywhere}.urge-phrase-list button:nth-child(3) b,.urge-phrase-list button:nth-child(4) b{font-size:13px}
@keyframes urge-panel-in { from{opacity:0;transform:translate(22px,-50%) scale(.97)} to{opacity:1;transform:translate(0,-50%) scale(1)} }
@keyframes bubble-in { from { opacity:0; transform:translate(-50%,6px) scale(.96) } to { opacity:1; transform:translate(-50%,0) scale(1) } }
.trick { position:absolute; width:260px;height:150px;left:50%;top:52%;transform:translate(-50%,-50%); }
.played { position:absolute; }.played-0{left:96px;bottom:0}.played-1{left:0;top:42px}.played-2{left:96px;top:0}.played-3{right:0;top:42px}
.card,.hand-card { position:relative; overflow:hidden; background-color:#fffdf6; background-image:radial-gradient(circle at 28% 18%,rgba(255,255,255,.95),transparent 35%),repeating-linear-gradient(115deg,rgba(120,94,48,.025) 0 1px,transparent 1px 4px); color:#111a17; border:1px solid #d7c9a7; border-radius:9px; box-shadow:0 4px 10px rgba(0,0,0,.32),inset 0 0 0 2px #fff,inset 0 0 0 3px rgba(170,132,52,.3); display:block; text-align:left; font-family:Georgia,"Times New Roman",serif; font-weight:700; }
.card::after,.hand-card::after { content:""; position:absolute; inset:4px; border:1px solid rgba(159,119,37,.32); border-radius:5px; pointer-events:none; }
.card{width:56px;height:80px;font-size:16px}.red{color:#b51f2d}.black{color:#111a17}
.card-corner { position:absolute; z-index:2; left:7px; top:6px; display:flex; flex-direction:column; align-items:center; font-weight:800; line-height:.82; text-shadow:0 1px #fff; }
.card-corner b { font-size:1em; letter-spacing:-.06em; }.card-corner i { margin-top:3px; font-size:.82em; font-style:normal; }
.card-corner-bottom { inset:auto 7px 6px auto; transform:rotate(180deg); }
.pip-field { position:absolute; inset:20% 23%; display:grid; grid-template-columns:repeat(3,1fr); align-content:center; justify-items:center; gap:1px 2px; }
.pip-field i { font-size:.48em; line-height:1; font-style:normal; text-shadow:0 1px #fff; }.hand-card .pip-field i{font-size:.54em}
.pips-2,.pips-3{grid-template-columns:1fr}.pips-4,.pips-6{grid-template-columns:repeat(2,1fr)}.pips-5{grid-template-columns:repeat(2,1fr)}.pips-5 i:last-child{grid-column:1/-1}.pips-7,.pips-8,.pips-9,.pips-10{grid-template-columns:repeat(3,1fr)}
.ace-center { position:absolute; left:50%; top:50%; width:54%; aspect-ratio:1; display:grid; place-items:center; transform:translate(-50%,-50%); border:1px solid rgba(171,132,52,.4); border-radius:50%; background:radial-gradient(circle,rgba(213,169,78,.18),transparent 66%); }
.ace-center::before,.ace-center::after { content:""; position:absolute; width:74%; height:74%; border:1px solid currentColor; border-radius:42% 58% 44% 56%; opacity:.13; transform:rotate(45deg); }.ace-center::after{transform:rotate(-45deg)}.ace-center b{z-index:1;font-size:1.8em;line-height:1}.ace-center i{position:absolute;inset:3px;border-top:1px solid rgba(181,137,44,.45);border-radius:50%}
.court-center { position:absolute; inset:17% 24%; display:flex; flex-direction:column; align-items:center; justify-content:center; overflow:hidden; border:1px solid rgba(171,132,52,.56); border-radius:8px; background:linear-gradient(145deg,rgba(213,169,78,.3),rgba(255,255,255,.8) 48%,rgba(126,32,42,.15)); box-shadow:inset 0 0 0 2px rgba(255,255,255,.55); text-align:center; }
.court-center::before,.court-center::after{content:"";position:absolute;width:38px;height:38px;border:1px solid currentColor;opacity:.12;transform:rotate(45deg)}.court-center i{z-index:1;color:#b5892f;font-size:.7em;font-style:normal;line-height:.7}.court-center b{z-index:1;font-size:1.08em;line-height:.9}.court-center small{z-index:1;font-size:.24em;letter-spacing:.12em}.court-center em{z-index:1;font-size:.62em;font-style:normal;line-height:.8}
.joker-card { background-image:radial-gradient(circle at 50% 42%,rgba(213,169,78,.16),transparent 44%),repeating-linear-gradient(135deg,rgba(120,94,48,.03) 0 1px,transparent 1px 4px); }
.joker-index { position:absolute; z-index:2; left:7px; top:6px; display:flex; flex-direction:column; align-items:center; line-height:.75; }.joker-index b{font-size:.88em}.joker-index i{margin-top:4px;font-size:.58em;font-style:normal;color:#bd8c28}.joker-index-bottom{inset:auto 7px 6px auto;transform:rotate(180deg)}
.joker-art { position:absolute; inset:13% 20%; display:flex; flex-direction:column; align-items:center; justify-content:center; border:1px solid rgba(171,132,52,.45); border-radius:50% 50% 46% 46%; background:radial-gradient(circle,rgba(213,169,78,.14),transparent 68%); text-align:center; }
.joker-art::before,.joker-art::after { content:""; position:absolute; inset:4px; border-top:1px solid rgba(171,132,52,.55); border-bottom:1px solid rgba(171,132,52,.35); border-radius:50%; transform:rotate(28deg); }.joker-art::after{transform:rotate(-28deg)}
.joker-crown { z-index:1; color:#bd8c28; font-size:1.25em; font-style:normal; line-height:.85; }.joker-art b{z-index:1;font-size:.44em;letter-spacing:.12em}.joker-art small{z-index:1;margin-top:2px;font-family:"PingFang SC",sans-serif;font-size:.36em;letter-spacing:.05em}.joker-big .joker-art b,.joker-big .joker-art small{color:#b51f2d}.joker-small .joker-art b,.joker-small .joker-art small{color:#111a17}
.score-chips { position:absolute;left:50%;bottom:5%;transform:translateX(-50%);display:flex;gap:6px; }.score-chips span{padding:5px 9px;border-radius:99px;background:rgba(0,0,0,.22);color:#cfe1d4;font-size:11px}
.player-zone { position:relative; isolation:isolate; overflow:hidden; display:grid; grid-template-columns:minmax(148px,180px) minmax(0,1fr) 100px;align-items:center;gap:10px;padding:12px max(20px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));background:linear-gradient(180deg,rgba(3,22,15,.72),#06120d);border-top:3px solid #58bde8; }
.player-zone>*:not(.human-backdrop) { position:relative; z-index:1; }.human-backdrop { position:absolute; z-index:0; left:4px; bottom:-36px; width:150px; height:150px; object-fit:cover; border-radius:50%; opacity:.16; filter:saturate(.8) drop-shadow(0 10px 10px rgba(0,0,0,.3)); mask-image:linear-gradient(90deg,#000,transparent 86%); pointer-events:none; transform-origin:50% 100%; transform:perspective(520px) translateY(10px) rotateX(7deg) scale(.94); transition:transform .48s cubic-bezier(.2,.78,.24,1),opacity .32s ease; }
.player-zone.your-turn { box-shadow:inset 0 4px rgba(89,201,248,.7); }.hand { width:100%; min-width:0; max-width:100%; display:flex;justify-content:center;align-items:end;padding:18px 4px 0; overflow:visible; }
.player-meta .seat-turn-status { left:0; top:auto; bottom:calc(100% + 8px); transform:none; }
.player-zone.your-turn .human-backdrop { opacity:.27; transform:perspective(520px) translateY(-18px) rotateX(-4deg) scale(1.08); }
.player-zone.playing .human-backdrop { animation:player-stand-play-sit 1.15s cubic-bezier(.2,.75,.24,1) both; }
@keyframes player-stand-play-sit { 0%{transform:perspective(520px) translateY(7px) rotateX(8deg) scale(.94)} 30%{transform:perspective(520px) translateY(-20px) rotateX(-5deg) scale(1.1)} 58%{transform:perspective(520px) translateY(-15px) rotateX(-13deg) rotateY(-4deg) scale(1.13)} 76%{transform:perspective(520px) translateY(-18px) rotateX(-3deg) scale(1.07)} 100%{transform:perspective(520px) translateY(7px) rotateX(8deg) scale(.94)} }
.player-zone.under-trusteeship { box-shadow:inset 0 3px #55b9e9; }.trusteeship-badge{display:inline-flex;margin-left:7px;padding:3px 6px;border-radius:99px;background:#dff5ff;color:#096287;font-size:9px;vertical-align:middle;letter-spacing:.06em}.player-actions{display:grid;gap:6px}.trusteeship-button{min-height:44px;border:1px solid rgba(255,255,255,.2);border-radius:11px;background:rgba(255,255,255,.07);color:#c9ddd0;font-size:12px;font-weight:700;cursor:pointer}.trusteeship-button.active{border-color:#62c5ef;background:rgba(53,157,203,.18);color:#bcecff}
.hand-card { flex:0 1 clamp(42px,4.5vw,64px); width:clamp(42px,4.5vw,64px); height:clamp(78px,7.2vw,98px); min-width:38px; margin-left:clamp(-26px,-1.2vw,-14px); font-size:clamp(14px,1.35vw,18px); transition:transform .2s ease,filter .2s ease,box-shadow .2s ease;cursor:pointer; }.hand-card:first-child{margin-left:0}.hand-card.legal:hover,.hand-card.selected{transform:translateY(-13px)}.hand-card.selected{box-shadow:0 0 0 3px var(--gold),0 10px 22px rgba(0,0,0,.48),inset 0 0 0 2px #fff,inset 0 0 0 3px rgba(170,132,52,.3)}.hand-card.disabled{filter:brightness(.55);cursor:not-allowed}
.play-button,.primary { min-height:52px;border:1px solid #ffe194;border-radius:14px;background:linear-gradient(180deg,#29aab9,#09677b 52%,#064556);color:#fffde8;font-weight:800;cursor:pointer;box-shadow:inset 0 2px rgba(255,255,255,.28),0 5px 0 #032f3a,0 9px 18px rgba(0,0,0,.4);text-shadow:0 2px 2px rgba(0,0,0,.5);transition:filter .2s ease,transform .2s ease}.play-button:active,.primary:active{transform:translateY(3px);box-shadow:inset 0 2px rgba(255,255,255,.2),0 2px 0 #032f3a,0 4px 10px rgba(0,0,0,.35)}.play-button:disabled{filter:grayscale(1);opacity:.42;cursor:not-allowed}
.result-panel { position:fixed;z-index:20;inset:50% auto auto 50%;transform:translate(-50%,-50%);width:min(420px,80vw);padding:26px;border:1px solid var(--gold);border-radius:24px;background:linear-gradient(160deg,#113c2b,#061a12);box-shadow:0 30px 80px rgba(0,0,0,.7);text-align:center}.result-medal{margin:auto;width:60px;height:60px;display:grid;place-items:center;border-radius:50%;background:var(--gold);color:#2a1b05;font:800 30px serif}.eyebrow{color:#dfbd6d;font-size:12px;letter-spacing:.18em}.score-list{display:grid;gap:6px;margin:18px 0}.score-row{display:grid;grid-template-columns:28px 1fr 60px;padding:9px 12px;border-radius:10px;background:rgba(255,255,255,.06);text-align:left}.score-row.me{border:1px solid rgba(213,169,78,.55)}.score-row em{text-align:right;font-style:normal;color:#f2d786}.primary{width:100%}
.result-panel.champion-result{isolation:isolate;width:min(480px,88vw);padding:24px 30px 28px;overflow:hidden;border:2px solid #f3cf70;border-radius:30px;background:radial-gradient(circle at 50% 8%,rgba(255,220,116,.2),transparent 35%),linear-gradient(165deg,#17543d 0%,#082d22 52%,#031711 100%);box-shadow:0 0 0 5px rgba(7,38,29,.88),0 0 0 7px rgba(225,184,79,.38),0 38px 110px rgba(0,0,0,.78),0 0 70px rgba(235,190,76,.22)}.champion-result:before,.champion-result:after{content:"";position:absolute;z-index:-1;width:130px;height:130px;border:1px solid rgba(242,207,112,.2);transform:rotate(45deg)}.champion-result:before{left:-86px;top:38%}.champion-result:after{right:-86px;bottom:12%}.champion-rays{position:absolute;z-index:-2;left:50%;top:-120px;width:380px;height:380px;transform:translateX(-50%);border-radius:50%;opacity:.3;background:repeating-conic-gradient(from 0deg,rgba(255,219,112,.46) 0 7deg,transparent 7deg 16deg);animation:champion-rays-spin 16s linear infinite}.champion-kicker{display:flex;align-items:center;justify-content:center;gap:9px;color:#f8d982;font-size:10px;font-weight:800;letter-spacing:.24em}.champion-kicker span{width:36px;height:1px;background:linear-gradient(90deg,transparent,#edc866)}.champion-kicker span:last-child{transform:scaleX(-1)}.champion-emblem{position:relative;width:94px;height:94px;margin:12px auto 8px;display:grid;place-items:center;border:2px solid #ffdf85;border-radius:50%;background:radial-gradient(circle at 35% 28%,#ffe7a2,#d59c28 56%,#75430b);box-shadow:0 0 0 7px rgba(234,188,71,.12),0 12px 28px rgba(0,0,0,.38),inset 0 2px 3px rgba(255,255,255,.65)}.champion-emblem:before,.champion-emblem:after{content:"";position:absolute;bottom:-16px;width:24px;height:38px;background:linear-gradient(90deg,#a86b12,#f0c553);clip-path:polygon(0 0,100% 0,78% 100%,50% 78%,20% 100%)}.champion-emblem:before{left:13px;transform:rotate(14deg)}.champion-emblem:after{right:13px;transform:rotate(-14deg)}.champion-emblem i{position:absolute;top:-19px;color:#ffe69d;font:900 27px serif;text-shadow:0 3px 5px #543008}.champion-emblem b{font-size:44px;filter:drop-shadow(0 4px 2px rgba(76,40,0,.28))}.champion-result .eyebrow{margin:10px 0 2px;color:#dbbc6b;font-weight:800}.champion-result h2{margin:0;color:#fff8de;font-size:clamp(30px,5vw,42px);letter-spacing:.08em;text-shadow:0 4px 18px rgba(0,0,0,.58)}.champion-slogan{display:inline-block;margin:8px 0 10px;padding:6px 18px;border-top:1px solid rgba(245,210,116,.46);border-bottom:1px solid rgba(245,210,116,.46);color:#ffdf82;font-family:serif;font-size:16px;font-weight:900;letter-spacing:.18em}.champion-record{margin:0 auto 14px;display:flex;width:max-content;align-items:center;gap:9px;color:#d8e7df;font-size:11px}.champion-record strong{padding:5px 10px;border:1px solid #f1cb65;border-radius:99px;background:linear-gradient(180deg,#e9bd4f,#9c6811);color:#fff8da;font-size:13px;box-shadow:inset 0 1px rgba(255,255,255,.45)}.champion-result .score-list{margin:12px 0}.champion-result .score-row{background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.035)}.champion-result .score-row.me{background:linear-gradient(90deg,rgba(218,166,43,.24),rgba(255,224,128,.08));border-color:#e8bd52;box-shadow:inset 3px 0 #f6d779}.champion-result .score-row.me b{color:#ffdf78}.champion-result .result-rating{background:rgba(0,0,0,.25);border-color:rgba(239,201,101,.45)}.champion-result .primary{min-height:50px;border:1px solid #ffe095;background:linear-gradient(180deg,#dcae39,#8c5a0e);color:#fff9df;font-weight:900;letter-spacing:.12em;box-shadow:inset 0 1px rgba(255,255,255,.6),0 8px 24px rgba(0,0,0,.28)}.champion-celebration{position:fixed;z-index:35;inset:0;overflow:hidden;pointer-events:none}.champion-trophies{position:absolute;z-index:2;left:50%;top:4%;display:flex;align-items:end;gap:20px;transform:translateX(-50%);filter:drop-shadow(0 10px 16px rgba(0,0,0,.5))}.champion-trophies span{font-size:clamp(54px,8vw,108px);animation:champion-trophy-pop 5s cubic-bezier(.16,.82,.2,1) both}.champion-trophies span:nth-child(1),.champion-trophies span:nth-child(3){font-size:clamp(36px,5vw,72px);animation-delay:.14s}.champion-confetti{position:absolute;inset:0}.champion-confetti i{--color:#f4ca52;position:absolute;left:calc(var(--x) * 1%);top:-8%;width:10px;height:24px;border-radius:3px;background:var(--color);transform:rotate(calc(var(--r) * 1deg));animation:champion-confetti 5s cubic-bezier(.15,.65,.35,1) calc(var(--d) * -.12s) both}.champion-confetti i:nth-child(3n){--color:#e73f52;width:8px}.champion-confetti i:nth-child(4n){--color:#56c9ef;border-radius:50%}.champion-confetti i:nth-child(5n){--color:#fff0b0;height:14px}.result-panel.champion-shake{animation:champion-panel-shake .42s ease-in-out 12}
@keyframes champion-confetti{0%{opacity:0;transform:translateY(-16vh) translateX(0) rotate(calc(var(--r) * 1deg))}10%{opacity:1}82%{opacity:1}100%{opacity:0;transform:translateY(112vh) translateX(calc(var(--drift) * 18px)) rotate(calc((var(--r) + 720) * 1deg))}}
@keyframes champion-trophy-pop{0%{opacity:0;transform:translateY(-90px) scale(.35) rotate(-12deg)}12%,82%{opacity:1;transform:translateY(0) scale(1) rotate(0)}90%{transform:translateY(-5px) scale(1.04)}100%{opacity:0;transform:translateY(-18px) scale(.96)}}
@keyframes champion-rays-spin{to{transform:translateX(-50%) rotate(360deg)}}
@keyframes champion-panel-shake{0%,100%{transform:translate(-50%,-50%) rotate(0)}25%{transform:translate(calc(-50% - 3px),calc(-50% + 1px)) rotate(-.25deg)}75%{transform:translate(calc(-50% + 3px),calc(-50% - 1px)) rotate(.25deg)}}
@media (prefers-reduced-motion:reduce){.champion-trophies span,.champion-confetti i,.result-panel.champion-shake{animation:none}.champion-confetti{display:none}}
.champion-emblem{width:154px;height:160px;margin:7px auto 0;border:0;border-radius:0;background:none;box-shadow:none;filter:drop-shadow(0 13px 16px rgba(0,0,0,.48))}.champion-emblem:before{content:"";position:absolute;z-index:-1;inset:18px 5px 0;border-radius:50%;background:radial-gradient(circle,rgba(255,217,113,.28),transparent 68%);box-shadow:0 0 48px rgba(255,205,75,.26)}.champion-emblem:after{display:none}.champion-emblem i{z-index:2;top:-4px;left:50%;bottom:auto;width:auto;height:auto;transform:translateX(-50%);clip-path:none;background:none;color:#ffe69d;font:900 28px serif;text-shadow:0 3px 5px #543008}.champion-emblem svg{width:146px;height:154px;overflow:visible}.champion-emblem .trophy-handle,.champion-emblem .trophy-cup,.champion-emblem .trophy-stem,.champion-emblem .trophy-base{fill:url(#trophy-gold);stroke:#ffdf78;stroke-width:2}.champion-emblem .trophy-shine{fill:rgba(255,255,255,.42)}.champion-emblem .trophy-plaque{fill:#603706;stroke:#f2c558;stroke-width:1.5}.champion-emblem text{fill:#ffe7a1;font:900 10px "PingFang SC",sans-serif;text-anchor:middle;letter-spacing:2px}.champion-result .eyebrow{margin-top:0}
.champion-side-burst{position:absolute;z-index:4;bottom:5%;width:70px;height:70px}.champion-side-burst.left{left:3%}.champion-side-burst.right{right:3%;transform:scaleX(-1)}.champion-side-burst:after{content:"";position:absolute;left:2px;bottom:0;width:44px;height:54px;border:2px solid #f7d36d;border-radius:8px 8px 20px 20px;background:linear-gradient(135deg,#9f281e,#e6ad34 55%,#6f1d19);box-shadow:0 0 24px rgba(255,199,67,.7);transform:rotate(-23deg)}.champion-side-burst b{--burst-color:#ffd458;position:absolute;left:23px;bottom:46px;width:8px;height:22px;border-radius:4px;background:var(--burst-color);animation:champion-side-shot 1.25s cubic-bezier(.12,.6,.18,1) calc(var(--n) * .018s) both}.champion-side-burst b:nth-child(3n){--burst-color:#ef4454}.champion-side-burst b:nth-child(4n){--burst-color:#54cbed}.champion-side-burst b:nth-child(5n){width:10px;height:10px;border-radius:50%}@keyframes champion-side-shot{0%{opacity:0;transform:translate(0,0) rotate(0)}8%{opacity:1}70%{opacity:1;transform:translate(calc(170px + var(--n) * 8px),calc(-120px - var(--n) * 25px)) rotate(calc(var(--n) * 55deg))}100%{opacity:0;transform:translate(calc(190px + var(--n) * 9px),calc(-105px - var(--n) * 24px)) rotate(calc(var(--n) * 75deg))}}
.champion-confetti i{top:-12%;box-shadow:0 0 6px color-mix(in srgb,var(--color),transparent 42%);animation-duration:calc(5.85s + var(--speed) * .16s);animation-delay:calc(var(--d) * -.095s)}.champion-confetti i:nth-child(6n){--color:#9be5c8;width:7px;height:18px}.champion-confetti i:nth-child(7n){--color:#ffd84d;width:13px;height:13px;border-radius:50%}.champion-confetti i:nth-child(11n){width:16px;height:9px;border-radius:50% 0 50% 0}
.rules-sheet[hidden]{display:none}.rules-sheet{position:fixed;z-index:30;inset:0;background:rgba(0,0,0,.65);display:grid;place-items:center}.rules-sheet>div{position:relative;width:min(560px,80vw);padding:28px;border-radius:22px;background:#f8f0da;color:#203026}.rules-sheet button{position:absolute;right:18px;top:18px;border:0;background:transparent;color:#6c5322;cursor:pointer;min-width:44px;min-height:44px}.rules-sheet li{margin:10px 0;line-height:1.5}
.culture-note { margin:18px 0 0; padding:12px 14px; border-left:3px solid #b8842f; background:rgba(184,132,47,.1); color:#536258; font-size:13px; line-height:1.6; }
.nav-concierge{position:relative;width:30px;height:31px;border:2px solid #e7c66d;border-radius:50% 50% 43% 43%;background:linear-gradient(180deg,#f5d9ba 0 31%,#252525 32% 100%)}.nav-concierge::before{content:"";position:absolute;left:8px;top:5px;width:10px;height:10px;border-radius:50%;background:#4a2d25}.nav-concierge::after{content:"✦";position:absolute;right:-5px;top:-7px;color:#ffe28d;font-size:12px;text-shadow:0 0 8px #ffd45e}
.concierge-modal{width:min(1120px,96vw)}.concierge-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.concierge-choice{min-height:292px;padding:9px;display:grid;grid-template-rows:200px auto auto;gap:5px;border:1px solid rgba(255,255,255,.17);border-radius:16px;background:rgba(255,255,255,.06);color:#eef7f0;text-align:center;cursor:pointer;overflow:hidden}.concierge-choice:hover{background:rgba(255,224,150,.1)}.concierge-choice.selected{border-color:#ffda76;box-shadow:0 0 0 3px rgba(255,211,97,.14);background:rgba(196,134,35,.14)}.concierge-choice-image{display:block;overflow:hidden;border-radius:11px;background:linear-gradient(180deg,#173e35,#261a16)}.concierge-choice-image img{width:100%;height:100%;object-fit:cover;object-position:center 31%;transition:transform .25s ease}.concierge-choice:hover img{transform:scale(1.035)}.concierge-choice strong{align-self:end;color:#ffe5a1;font-size:13px}.concierge-choice small{color:#bad0c5;font-size:9px;line-height:1.45}.concierge-off-icon{align-self:center;justify-self:center;width:72px;height:72px;display:grid;place-items:center;border:2px solid #9bad9f;border-radius:50%;color:#cbd5ce;font-size:42px}.concierge-note{margin:10px 0 0;color:#b7c9bf;font-size:9px}.water-pipe-toggle{width:min(520px,92%);min-height:54px;margin:14px auto 0;padding:8px 12px;display:grid;grid-template-columns:42px 1fr auto;align-items:center;gap:10px;border:1px solid rgba(255,220,133,.34);border-radius:13px;background:rgba(0,0,0,.17);color:#dbe8df;text-align:left;cursor:pointer}.water-pipe-toggle.selected{border-color:#dfb85a;background:rgba(142,89,27,.2)}.water-pipe-toggle>span{width:35px;height:35px;border:3px solid #c39a50;border-radius:10px;background:linear-gradient(90deg,#5c1f16,#ac5b32,#5c1f16);box-shadow:inset 0 0 0 2px #3c1a12}.water-pipe-toggle strong,.water-pipe-toggle small{display:block}.water-pipe-toggle small{margin-top:2px;color:#aebfb5;font-size:8px}.water-pipe-toggle>b{padding:4px 8px;border-radius:99px;background:#31443b;color:#cbd9d0;font-size:9px}.water-pipe-toggle.selected>b{background:#277458;color:#e4fff3}
.pre-game-concierge{position:fixed;z-index:27;right:2.5vw;bottom:150px;width:min(350px,26vw);height:min(66vh,660px);pointer-events:none;animation:none;filter:drop-shadow(0 18px 24px rgba(0,0,0,.55))}.pre-game-concierge>.concierge-person{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center bottom;mask-image:linear-gradient(90deg,transparent 0,#000 17% 91%,transparent 100%);-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 17% 91%,transparent 100%)}.concierge-greeting{position:absolute;right:77%;bottom:14%;width:205px;padding:11px 14px;border:1px solid rgba(255,220,125,.72);border-radius:14px 14px 3px 14px;background:linear-gradient(145deg,rgba(11,65,53,.96),rgba(54,30,19,.96));box-shadow:0 11px 25px rgba(0,0,0,.42);color:#fff1c6;text-align:right}.pre-game-concierge small,.pre-game-concierge span{display:block;color:#d5c89e;font-size:9px}.pre-game-concierge strong{display:block;margin:3px 0;font:850 15px/1.35 "STKaiti","KaiTi",sans-serif}.concierge-female-gray .concierge-greeting{border-color:rgba(207,220,226,.8);background:linear-gradient(145deg,rgba(51,62,66,.96),rgba(77,28,30,.96))}.tea-pour-motion{position:absolute;z-index:2;left:48%;top:44%;width:54px;height:94px;opacity:0;animation:tea-pour 7.6s ease both}.tea-pour-motion i{position:absolute;left:17px;top:0;width:4px;height:62px;border-radius:99px;background:linear-gradient(180deg,rgba(255,229,153,.15),#d8a64b 25%,rgba(238,197,104,.35));box-shadow:0 0 7px rgba(255,208,96,.55);transform-origin:top}.tea-pour-motion b{position:absolute;left:-15px;bottom:0;width:70px;padding:4px;border-radius:99px;background:rgba(75,43,19,.9);color:#ffe4a0;text-align:center;font-size:9px}.water-pipe-motion{position:absolute!important;z-index:3;left:-55%;bottom:7%;width:145px;height:360px;opacity:0;animation:offer-water-pipe 7.6s ease both}.water-pipe-motion img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 10px 10px rgba(0,0,0,.55))}.water-pipe-motion i{position:absolute;left:50%;bottom:3%;width:75px;height:14px;border-radius:50%;background:rgba(0,0,0,.4);filter:blur(5px);transform:translateX(-50%)}@keyframes tea-pour{0%,18%{opacity:0;transform:translateY(-5px)}23%,43%{opacity:1;transform:translateY(0)}48%,100%{opacity:0;transform:translateY(5px)}}@keyframes offer-water-pipe{0%,48%{opacity:0;transform:translate(80px,15px) scale(.88)}58%,84%{opacity:1;transform:translate(0,0) scale(1)}92%,100%{opacity:0;transform:translate(-20px,0) scale(.98)}}
.pre-game-concierge:not(.concierge-service-effect) .concierge-person{animation:none!important;opacity:1!important;transform:none}
.concierge-water-pipe-person{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center bottom;opacity:0;animation:concierge-frame-water-pipe 7.6s ease both;mask-image:linear-gradient(90deg,transparent 0,#000 17% 91%,transparent 100%);-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 17% 91%,transparent 100%)}.with-water-pipe.concierge-male-muscular>.concierge-person{animation:concierge-frame-tea 7.6s ease both}@keyframes concierge-frame-tea{0%,46%{opacity:1}53%,100%{opacity:0}}@keyframes concierge-frame-water-pipe{0%,47%{opacity:0;transform:translateX(22px)}56%,88%{opacity:1;transform:translateX(0)}96%,100%{opacity:0;transform:translateX(-8px)}}
.pre-game-concierge{perspective:980px;transform-style:preserve-3d}.pre-game-concierge>.concierge-person{animation:concierge-model-approach 4s cubic-bezier(.18,.72,.22,1) both}.concierge-first-person{position:fixed;z-index:29;left:50%;bottom:5vh;width:min(560px,58vw);height:270px;transform:translateX(-50%);transform-style:preserve-3d;perspective:760px;filter:drop-shadow(0 18px 20px rgba(0,0,0,.48))}.service-arm{position:absolute;z-index:1;bottom:-85px;width:120px;height:250px;border-radius:55% 55% 28% 28%;background:linear-gradient(90deg,#111 0%,#30302d 42%,#080808 100%);box-shadow:inset 10px 0 16px rgba(255,255,255,.08);opacity:0}.service-arm:after{content:"";position:absolute;top:-30px;left:27px;width:69px;height:76px;border-radius:48% 48% 42% 42%;background:linear-gradient(145deg,#f4c7a0,#c88965 78%);box-shadow:inset -8px -8px 12px rgba(90,39,24,.18)}.service-arm.arm-left{left:13%;transform:rotate(-20deg)}.service-arm.arm-right{right:13%;transform:rotate(20deg)}.fp-teapot{position:absolute;z-index:3;left:27%;top:22px;width:116px;height:86px;border-radius:48% 48% 42% 42%;background:radial-gradient(circle at 35% 22%,#fff2b5 0 8%,#c99432 26%,#6d3c12 78%);box-shadow:inset -12px -8px 14px rgba(41,19,2,.45)}.fp-teapot:before{content:"";position:absolute;right:-55px;top:22px;width:65px;height:24px;border-radius:5px 80% 20% 5px;background:linear-gradient(180deg,#e0b859,#80501c)}.fp-teapot:after{content:"";position:absolute;left:-37px;top:16px;width:43px;height:54px;border:10px solid #8a591e;border-right:0;border-radius:34px 0 0 34px}.fp-teapot i{position:absolute;left:42px;top:-19px;width:34px;height:21px;border-radius:50%;background:#e6c56d;border:4px solid #76501c}.fp-cup{position:absolute;z-index:4;left:51%;bottom:32px;width:92px;height:68px;border-radius:8px 8px 40px 40px;background:linear-gradient(90deg,#e5d4ad,#fff6d9 47%,#b89c68);box-shadow:inset 0 8px #5e351a,0 10px 18px rgba(0,0,0,.35)}.fp-cup:after{content:"";position:absolute;right:-32px;top:13px;width:35px;height:31px;border:9px solid #ddc99f;border-left:0;border-radius:0 22px 22px 0}.fp-cup i{position:absolute;left:16px;right:16px;top:8px;height:9px;border-radius:50%;background:#7a3e17}.fp-tea-stream{position:absolute;z-index:5;left:51%;top:75px;width:6px;height:103px;border-radius:99px;background:linear-gradient(#ffe7a0,#b66c21);box-shadow:0 0 9px rgba(255,204,91,.75);transform-origin:top;opacity:0}.service-tea .fp-teapot{animation:service-offer-tea 4s ease both}.service-tea .fp-cup{animation:service-cup-near 4s ease both}.service-tea .fp-tea-stream{animation:service-tea-stream 4s ease both}.service-tea .service-arm{animation:service-hands-near 4s ease both}.fp-fruit-tray{position:absolute;z-index:3;left:50%;bottom:28px;width:285px;height:92px;border-radius:50%;background:radial-gradient(ellipse at center,#7d4a1d 0 46%,#d4a54d 48% 57%,#4b2610 60%);transform:translateX(-50%)}.fp-fruit-tray i{position:absolute;width:72px;height:61px;border-radius:50%;background:radial-gradient(circle at 33% 27%,#ffd46b,#d33c28 68%,#7b1515)}.fp-fruit-tray i:nth-child(1){left:35px;top:-22px}.fp-fruit-tray i:nth-child(2){left:95px;top:-38px;background:radial-gradient(circle at 34% 28%,#f8ee8b,#d49b18 66%,#805313)}.fp-fruit-tray i:nth-child(3){right:57px;top:-31px;background:radial-gradient(circle at 34% 25%,#b9e979,#4e9b31 65%,#25531d)}.fp-fruit-tray i:nth-child(4){right:19px;top:-8px;width:60px;height:48px}.fp-fruit-tray b{position:absolute;left:118px;top:-57px;width:62px;height:73px;border-radius:70% 35% 65% 38%;background:linear-gradient(135deg,#ffe577,#d58e13)}.service-fruit .fp-fruit-tray{animation:service-offer-fruit 4s cubic-bezier(.15,.72,.2,1) both}.service-fruit .service-arm,.service-water-pipe .service-arm{animation:service-hands-near 4s ease both}.fp-water-pipe{position:absolute;z-index:3;left:50%;bottom:-4px;width:93px;height:252px;border-radius:28px 28px 16px 16px;background:linear-gradient(90deg,#4f180f,#c46e37 22%,#652319 52%,#dc9150 73%,#4d160f);border:4px solid #d2a252;box-shadow:inset 0 0 0 5px #35120d}.fp-water-pipe:before{content:"";position:absolute;left:36px;top:-92px;width:18px;height:105px;border-radius:10px;background:linear-gradient(90deg,#572017,#d28b4e,#46150f);box-shadow:0 0 0 3px #c4974e}.fp-water-pipe:after{content:"";position:absolute;left:18px;top:-107px;width:51px;height:27px;border-radius:8px 8px 50% 50%;background:linear-gradient(90deg,#5d1d15,#d58543,#571911);border:3px solid #d2aa62}.fp-water-pipe i{position:absolute;left:13px;right:13px;bottom:16px;height:93px;border:2px solid rgba(248,205,111,.65);background:repeating-linear-gradient(45deg,transparent 0 9px,rgba(255,209,113,.36) 10px 12px)}.fp-water-pipe b{position:absolute;left:-90px;top:40px;width:92px;height:20px;border:7px solid #7c361f;border-right:0;border-radius:40px 0 0 40px}.service-water-pipe .fp-water-pipe{animation:service-offer-pipe 4s cubic-bezier(.16,.74,.18,1) both}@keyframes concierge-model-approach{0%{opacity:0;transform:translate3d(70px,18px,-170px) scale(.82)}18%,78%{opacity:1;transform:translate3d(0,0,0) scale(1)}100%{opacity:0;transform:translate3d(-5px,3px,20px) scale(1.02)}}@keyframes service-hands-near{0%,18%{opacity:0;transform:translateY(90px) scale(.72)}32%,82%{opacity:1}60%{transform:translateY(0) scale(1)}100%{opacity:0;transform:translateY(12px) scale(1.04)}}@keyframes service-offer-tea{0%,16%{opacity:0;transform:translate3d(150px,-45px,-260px) rotate(-4deg) scale(.55)}30%{opacity:1}48%,78%{opacity:1;transform:translate3d(0,0,75px) rotate(15deg) scale(1.08)}100%{opacity:0;transform:translate3d(-12px,6px,100px) rotate(10deg) scale(1.12)}}@keyframes service-cup-near{0%,20%{opacity:0;transform:translate3d(80px,80px,-220px) scale(.5)}42%,82%{opacity:1;transform:translate3d(0,0,110px) scale(1.18)}100%{opacity:0;transform:translate3d(0,8px,135px) scale(1.25)}}@keyframes service-tea-stream{0%,43%{opacity:0;transform:scaleY(.05)}48%,72%{opacity:1;transform:scaleY(1)}79%,100%{opacity:0;transform:scaleY(.1)}}@keyframes service-offer-fruit{0%,18%{opacity:0;transform:translate3d(190px,-80px,-340px) scale(.48) rotateX(20deg)}35%{opacity:1}62%,82%{opacity:1;transform:translate3d(-50%,0,125px) scale(1.18) rotateX(-7deg)}100%{opacity:0;transform:translate3d(-50%,10px,150px) scale(1.25) rotateX(-9deg)}}@keyframes service-offer-pipe{0%,18%{opacity:0;transform:translate3d(170px,-20px,-310px) rotate(10deg) scale(.48)}34%{opacity:1}62%,82%{opacity:1;transform:translate3d(-50%,0,120px) rotate(-6deg) scale(1.08)}100%{opacity:0;transform:translate3d(-50%,8px,145px) rotate(-3deg) scale(1.14)}}
.service-water-pipe img.fp-water-pipe{width:126px;height:286px;object-fit:contain;border:0;border-radius:0;background:none;box-shadow:none;filter:drop-shadow(0 16px 14px rgba(0,0,0,.48))}
.service-tea .fp-cup{transform-origin:50% 72%}.service-fruit .fp-fruit-tray,.service-water-pipe .fp-water-pipe{transform-origin:50% 84%}
@keyframes service-cup-near{0%,20%{opacity:0;transform:translate3d(80px,80px,-220px) scale(.5)}42%{opacity:1;transform:translate3d(0,0,110px) scale(1.18)}64%,84%{opacity:1;transform:translate3d(-18px,-48px,225px) scale(1.48)}100%{opacity:0;transform:translate3d(-18px,-42px,240px) scale(1.52)}}
@keyframes service-offer-fruit{0%,18%{opacity:0;transform:translate3d(190px,-80px,-340px) scale(.48) rotateX(20deg)}35%{opacity:1}62%,84%{opacity:1;transform:translate3d(-50%,-54px,225px) scale(1.42) rotateX(-10deg)}100%{opacity:0;transform:translate3d(-50%,-48px,245px) scale(1.48) rotateX(-8deg)}}
@keyframes service-offer-pipe{0%,18%{opacity:0;transform:translate3d(170px,-20px,-310px) rotate(10deg) scale(.48)}34%{opacity:1}62%,84%{opacity:1;transform:translate3d(-50%,-48px,230px) rotate(-3deg) scale(1.34)}100%{opacity:0;transform:translate3d(-50%,-43px,250px) rotate(-2deg) scale(1.4)}}
.service-water-pipe~.concierge-greeting{bottom:18%}.pre-game-concierge.service-water-pipe>.concierge-person{animation-duration:4s}.service-water-pipe .fp-water-pipe{animation-duration:4s}.real-service-hand{position:absolute;z-index:4;bottom:-205px;width:178px;height:350px;object-fit:contain;object-position:center top;opacity:0;filter:drop-shadow(0 15px 16px rgba(0,0,0,.5));animation:real-hands-offer-pipe 4s cubic-bezier(.16,.7,.2,1) both}.real-service-hand.hand-left{left:18%;transform-origin:50% 90%}.real-service-hand.hand-right{right:16%;transform-origin:50% 90%;scale:-1 1}@keyframes real-hands-offer-pipe{0%,20%{opacity:0;translate:0 95px;rotate:-9deg;scale:.72}38%{opacity:1}64%,86%{opacity:1;translate:0 -4px;rotate:0deg;scale:1}100%{opacity:0;translate:0 8px;scale:1.04}}.service-water-pipe .real-service-hand.hand-right{animation-name:real-hands-offer-pipe-right}@keyframes real-hands-offer-pipe-right{0%,20%{opacity:0;translate:0 95px;rotate:9deg;scale:-.72 .72}38%{opacity:1}64%,86%{opacity:1;translate:0 -4px;rotate:0deg;scale:-1 1}100%{opacity:0;translate:0 8px;scale:-1.04 1.04}}
@media (prefers-reduced-motion:reduce){.pre-game-concierge{animation-duration:.01ms!important;animation-delay:0s!important}}
.table-lobby-button { position:fixed; z-index:7; left:16px; top:74px; min-width:86px; min-height:44px; border:1px solid rgba(255,224,144,.6); border-radius:12px; background:linear-gradient(180deg,rgba(12,72,79,.96),rgba(5,42,48,.96)); color:#fff1c3; box-shadow:inset 0 1px rgba(255,255,255,.18),0 5px 14px rgba(0,0,0,.35); font-size:12px; font-weight:800; cursor:pointer; }
.table-lobby-button:active { transform:translateY(2px); }
.current-scene-chip { position:fixed; z-index:7; left:236px; top:75px; min-height:42px; padding:0 14px; display:flex; align-items:center; border:1px solid rgba(255,223,135,.45); border-radius:12px; background:rgba(4,39,32,.9); color:#ffe3a0; box-shadow:0 5px 14px rgba(0,0,0,.32); font-size:11px; font-weight:850; }
.table-welcome { position:fixed; z-index:28; left:50%; top:82px; min-width:min(520px,70vw); padding:11px 22px; display:flex; align-items:center; justify-content:center; gap:15px; transform:translateX(-50%); border:1px solid rgba(255,222,133,.82); border-radius:16px; background:linear-gradient(180deg,rgba(88,50,19,.96),rgba(14,64,49,.96)); box-shadow:inset 0 1px rgba(255,255,255,.2),0 12px 30px rgba(0,0,0,.48); color:#ffe6a1; text-align:center; pointer-events:none; animation:table-welcome-in 3s ease both; }.table-welcome>span{color:#f1c75d;font-size:17px;text-shadow:0 0 12px rgba(255,207,88,.7)}.table-welcome strong{display:block;font:850 17px/1.3 "STKaiti","KaiTi","PingFang SC",sans-serif;letter-spacing:.08em}.table-welcome small{display:block;margin-top:3px;color:#d9e7dd;font-size:9px;letter-spacing:.08em}
@keyframes table-welcome-in { 0%{opacity:0;transform:translate(-50%,-14px) scale(.96)} 10%,82%{opacity:1;transform:translate(-50%,0) scale(1)} 100%{opacity:0;transform:translate(-50%,-8px) scale(.98)} }
.baxian-table-option { position:fixed; z-index:7; left:112px; top:74px; min-width:112px; min-height:44px; padding:6px 10px; display:flex; align-items:center; gap:8px; border:1px solid rgba(255,224,144,.48); border-radius:12px; background:linear-gradient(180deg,rgba(68,40,22,.96),rgba(34,22,15,.96)); color:#edd7a0; box-shadow:inset 0 1px rgba(255,255,255,.14),0 5px 14px rgba(0,0,0,.35); font-size:11px; font-weight:800; cursor:pointer; }
.baxian-table-option i { width:24px; height:24px; border:3px solid #9d6733; border-radius:4px; background:#0d5a3a; box-shadow:inset 0 0 0 2px #d5ae58; }
.baxian-table-option.selected { border-color:#ffe08a; color:#fff1c1; box-shadow:0 0 0 3px rgba(244,197,80,.15),0 5px 14px rgba(0,0,0,.38); }

/* 盘州游戏大厅 */
.game-lobby { position:relative; min-height:100dvh; overflow:hidden; background:#0c3028; color:white; }
.lobby-scenery { position:absolute; inset:0; background-image:linear-gradient(180deg,rgba(5,22,20,.18),rgba(4,18,14,.72)),url("/game/src/assets/backgrounds/panzhou-cultural-game-bg.jpg"); background-position:center; background-size:cover; filter:saturate(1.08) contrast(1.04); transform:scale(1.02); }
.lobby-header { position:relative; z-index:5; height:76px; padding:max(10px,env(safe-area-inset-top)) clamp(18px,4vw,60px) 10px; display:grid; grid-template-columns:1fr auto auto; align-items:center; gap:22px; background:linear-gradient(180deg,rgba(3,29,28,.96),rgba(4,38,32,.84)); border-bottom:1px solid rgba(255,218,119,.35); box-shadow:0 8px 24px rgba(0,0,0,.24); }
.lobby-brand { min-width:230px; }.lobby-brand strong{font-size:18px}.lobby-brand small{color:#c5d9cd}
.lobby-balance { min-width:145px; min-height:52px; padding:6px 16px 6px 9px; display:flex; align-items:center; gap:10px; border:1px solid rgba(255,221,134,.45); border-radius:99px; background:rgba(1,19,16,.55); }
.lobby-balance small{display:block;color:#bdd3c6;font-size:10px}.lobby-balance strong{display:block;color:#ffe194;font-size:19px;font-variant-numeric:tabular-nums}.coin-symbol{width:35px;height:35px;border:3px solid #ffde73;border-radius:50%;background:radial-gradient(circle at 34% 30%,#fff6b6,#e7aa21 48%,#8d550d 75%);box-shadow:inset 0 0 0 3px rgba(119,65,4,.35),0 3px 8px rgba(0,0,0,.35)}.coin-symbol::after{content:"拱";display:grid;place-items:center;width:100%;height:100%;color:#70400b;font:900 13px serif}
.lobby-nav { display:flex; gap:7px; }.lobby-nav button{position:relative;min-width:98px;min-height:54px;padding:4px 10px;display:flex;align-items:center;justify-content:center;gap:7px;border:1px solid rgba(255,255,255,.16);border-radius:13px;background:rgba(255,255,255,.07);color:#f5e9c8;cursor:pointer;transition:background .2s ease,box-shadow .2s ease}.lobby-nav button:hover{background:rgba(255,214,105,.14);box-shadow:0 5px 14px rgba(0,0,0,.28)}.lobby-nav b{font-size:11px}.lobby-nav em{position:absolute;right:-4px;top:-6px;padding:2px 6px;border-radius:99px;background:#d74332;color:white;font-size:9px;font-style:normal;font-weight:800}
.nav-calendar{width:29px;height:30px;display:grid;place-items:center;border:2px solid #e8bd57;border-radius:5px;background:#8d2d22}.nav-calendar::before{content:"";position:absolute;width:21px;height:4px;margin-top:-19px;background:#f0d079;border-radius:2px}.nav-calendar i{color:#fff5cd;font-size:14px;font-style:normal;font-weight:900}.nav-relief{position:relative;width:31px;height:31px;border:2px solid #e9c25b;border-radius:50%;background:#237c68}.nav-relief::before,.nav-relief::after{content:"";position:absolute;background:#ffe6a0;border-radius:99px}.nav-relief::before{width:17px;height:7px;left:5px;top:11px}.nav-relief::after{width:7px;height:17px;left:10px;top:6px}
.nav-gift{position:relative;width:31px;height:28px;border:2px solid #f2cd72;border-radius:6px;background:#9a3127}.nav-gift::before{content:"";position:absolute;left:12px;top:-2px;width:3px;height:28px;background:#ffe298}.nav-gift::after{content:"";position:absolute;left:-2px;top:8px;width:31px;height:3px;background:#ffe298}
.nav-scene{position:relative;width:32px;height:27px;border:2px solid #e8c568;border-radius:4px;background:linear-gradient(145deg,#8b4e28,#3b2115)}.nav-scene::before{content:"";position:absolute;left:5px;right:5px;top:5px;height:11px;border:2px solid #64bca4;border-radius:50%;background:#0c5b47}.nav-scene::after{content:"";position:absolute;left:8px;right:8px;bottom:-5px;height:5px;border-radius:2px;background:#deb95b}
.lobby-stage { position:relative; z-index:2; height:calc(100dvh - 76px); display:grid; justify-items:center; align-content:center; perspective:900px; }
.lobby-title { position:absolute; z-index:3; left:5%; top:8%; max-width:410px; text-shadow:0 3px 10px rgba(0,0,0,.7); }.lobby-title p{margin:0 0 7px;color:#f3cd69;font:700 12px serif;letter-spacing:.22em}.lobby-title h1{margin:0;font:800 clamp(25px,3vw,42px)/1.12 "STKaiti","KaiTi",serif;color:#fff4cf}.lobby-title span{display:block;margin-top:10px;color:#d5e4d9;font-size:13px}
.active-room-badge { position:absolute; z-index:4; left:5%; top:31%; min-width:210px; padding:12px 16px; display:grid; gap:2px; border:1px solid rgba(255,220,126,.58); border-radius:14px; background:linear-gradient(145deg,rgba(95,32,19,.92),rgba(20,58,45,.9)); box-shadow:0 10px 26px rgba(0,0,0,.38); }.active-room-badge small{color:#e5bd67;font-size:10px}.active-room-badge strong{color:#fff1c8;font-size:15px}.active-room-badge span{color:#c8ddd0;font-size:10px}
.active-room-badge button{min-height:34px;margin-top:7px;border:1px solid rgba(255,222,134,.5);border-radius:9px;background:rgba(255,255,255,.08);color:#ffe4a3;font-size:10px;font-weight:800;cursor:pointer}
.lobby-table-preview { position:relative; width:min(650px,53vw); aspect-ratio:1.72; transform:rotateX(17deg) rotateZ(-2deg) translateY(10px); transform-style:preserve-3d; border:17px solid #68411f; border-top-color:#ac7032; border-bottom-color:#251a14; border-radius:48% 48% 42% 42%; background:#10181a; box-shadow:inset 0 0 0 5px #d5a94e,0 13px 0 #111719,0 31px 44px rgba(0,0,0,.68); }
.preview-felt { position:absolute; inset:3px; display:grid; place-items:center; overflow:hidden; border:4px solid #1d1710; border-radius:46%; background:radial-gradient(ellipse at 48% 38%,#3799c2,#116683 58%,#073e51); box-shadow:inset 0 0 65px rgba(0,0,0,.3),inset 0 4px rgba(255,255,255,.18); }.preview-felt::before{content:"";position:absolute;inset:8%;border:2px solid rgba(255,231,161,.28);border-radius:46%}.preview-seal{width:100px;height:100px;display:grid;place-items:center;align-content:center;border:2px solid rgba(255,220,123,.35);border-radius:50%;color:rgba(255,235,173,.45);font:800 20px serif;letter-spacing:.16em}.preview-seal small{font-size:9px;letter-spacing:.3em}
.preview-chair{position:absolute;z-index:-1;width:88px;height:112px;border:7px solid #101617;border-radius:28px;background:repeating-radial-gradient(circle at 50% 25%,#313b3d 0 4px,#161c1e 5px 12px);box-shadow:0 17px 22px rgba(0,0,0,.55)}.preview-chair-1{left:-56px;top:38%;transform:rotate(90deg)}.preview-chair-2{left:44%;top:-72px;transform:rotate(180deg)}.preview-chair-3{right:-56px;top:38%;transform:rotate(-90deg)}.preview-chair-4{left:44%;bottom:-74px}
.preview-player{position:absolute;z-index:4;width:62px;height:62px;transform-origin:50% 100%;animation:preview-player-sit 2.35s cubic-bezier(.2,.72,.24,1) both}.preview-player img{position:absolute;z-index:2;inset:0;width:100%;height:100%;border:3px solid #e6c66d;border-radius:50%;object-fit:cover;background:#173c35;box-shadow:0 7px 15px rgba(0,0,0,.48)}.preview-player-body{position:absolute;z-index:1;left:9px;top:46px;width:44px;height:74px;border:3px solid rgba(230,198,109,.78);border-radius:18px 18px 10px 10px;background:linear-gradient(90deg,#132922,#2c604b 50%,#10251e);box-shadow:0 12px 16px rgba(0,0,0,.42);transform-origin:50% 8%;animation:preview-body-fold 2.35s cubic-bezier(.2,.72,.24,1) both}.preview-player-0{left:45%;bottom:-46px;animation-delay:.18s}.preview-player-1{left:-38px;top:41%;animation-delay:.32s}.preview-player-2{left:45%;top:-46px;animation-delay:.05s}.preview-player-3{right:-38px;top:41%;animation-delay:.46s}
@keyframes preview-player-sit{0%{opacity:0;transform:translateY(-54px) scale(1.12)}18%{opacity:1;transform:translateY(-46px) scale(1.08)}48%{transform:translateY(-40px) scale(1.06)}72%{transform:translateY(5px) scale(.96)}86%{transform:translateY(-3px) scale(1.02)}100%{opacity:1;transform:translateY(0) scale(1)}}
@keyframes preview-body-fold{0%,48%{opacity:1;transform:scaleY(1)}70%{opacity:.88;transform:translateY(7px) scaleY(.62)}86%,100%{opacity:0;transform:translateY(18px) scaleY(.3)}}
@media (prefers-reduced-motion:reduce){.preview-player,.preview-player-body{animation:none}.preview-player-body{display:none}}
.enter-table { position:absolute; z-index:5; right:6%; top:40%; width:190px; min-height:108px; padding:15px; display:grid; place-items:center; border:2px solid #ffe49b; border-radius:26px; background:linear-gradient(180deg,#22a9b8,#087083 55%,#064755); color:white; box-shadow:inset 0 3px rgba(255,255,255,.28),0 7px 0 #032e36,0 15px 28px rgba(0,0,0,.48); cursor:pointer; text-shadow:0 2px 3px rgba(0,0,0,.55); transition:filter .2s ease,transform .2s ease}.enter-table:hover{filter:brightness(1.13);transform:translateY(-2px)}.enter-table:active{transform:translateY(5px);box-shadow:inset 0 2px rgba(255,255,255,.2),0 2px 0 #032e36,0 7px 16px rgba(0,0,0,.4)}.enter-table small{color:#d9f4f4;font-size:11px}.enter-table strong{font-size:25px;letter-spacing:.08em}.enter-table span{color:#ffe299;font-size:10px}
.lobby-feature-strip { position:absolute; left:50%; bottom:5%; transform:translateX(-50%); display:flex; gap:12px; }.lobby-feature-strip>span{min-width:150px;padding:10px 14px;display:flex;align-items:center;gap:10px;border:1px solid rgba(255,226,148,.32);border-radius:14px;background:rgba(3,30,25,.76);box-shadow:0 7px 18px rgba(0,0,0,.3)}.lobby-feature-strip b{font-size:11px;color:#e9ddba}.feature-ginkgo,.feature-card,.feature-gift{position:relative;width:27px;height:27px;display:block}.feature-ginkgo{border-radius:80% 5% 80% 5%;background:#d5a94e;transform:rotate(32deg)}.feature-card{border:2px solid #f5d77d;border-radius:4px;background:#f8f2dd;transform:rotate(-8deg)}.feature-card::after{content:"A";display:grid;place-items:center;color:#a82b2b;font:900 14px serif;width:100%;height:100%}.feature-gift{border:2px solid #f2ce70;border-radius:5px;background:#9b3026}.feature-gift::before{content:"";position:absolute;left:11px;top:-2px;width:3px;height:31px;background:#f3d47d}.feature-gift::after{content:"";position:absolute;left:-2px;top:8px;width:27px;height:3px;background:#f3d47d}
.lobby-feature-strip>button{min-width:172px;min-height:60px;padding:10px 14px;display:flex;align-items:center;gap:10px;border:1px solid rgba(255,226,148,.42);border-radius:14px;background:rgba(3,30,25,.82);box-shadow:0 7px 18px rgba(0,0,0,.3);color:inherit;cursor:pointer;transition:border-color .2s ease,background .2s ease,box-shadow .2s ease}.lobby-feature-strip>button:hover{border-color:rgba(255,220,126,.82);background:rgba(8,54,44,.92);box-shadow:0 9px 22px rgba(0,0,0,.38)}.lobby-feature-strip>button:focus-visible{outline:3px solid #f1ca67;outline-offset:3px}.lobby-feature-strip>button>span{display:grid;gap:3px;text-align:left}.lobby-feature-strip>button small{color:#aebfb4;font-size:8px}.lobby-feature-strip>span{min-height:60px}
.cosmetic-setting-modal{width:min(820px,94vw);padding:30px}.cosmetic-option-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.logo-style-options{grid-template-columns:repeat(3,minmax(0,1fr))}.cosmetic-option-grid>button{min-height:238px;padding:18px;display:grid;grid-template-rows:140px auto auto;justify-items:center;align-items:center;gap:7px;border:1px solid rgba(255,225,148,.26);border-radius:18px;background:linear-gradient(160deg,rgba(255,255,255,.08),rgba(0,0,0,.12));color:#fff1c8;box-shadow:inset 0 1px rgba(255,255,255,.08);cursor:pointer;transition:border-color .2s ease,background .2s ease,box-shadow .2s ease}.cosmetic-option-grid>button:hover{border-color:rgba(255,218,117,.72);background:linear-gradient(160deg,rgba(210,168,67,.16),rgba(0,0,0,.13))}.cosmetic-option-grid>button:focus-visible{outline:3px solid #f2ce70;outline-offset:3px}.cosmetic-option-grid>button.selected{border-color:#f2ce70;background:linear-gradient(160deg,rgba(199,151,46,.2),rgba(7,54,43,.3));box-shadow:0 0 0 3px rgba(242,206,112,.13),inset 0 1px rgba(255,255,255,.15)}.cosmetic-option-grid strong{font-size:15px}.cosmetic-option-grid small{color:#b9cdc2;font-size:10px;line-height:1.45}
.card-style-preview{position:relative;width:92px;height:124px;display:block;border-radius:9px;transform:rotate(-3deg)}.card-style-preview i,.card-style-preview b{position:absolute;font-family:Georgia,serif;font-style:normal}.card-style-preview i{right:10px;bottom:8px;font-size:31px}.card-style-preview b{left:10px;top:7px;font-size:24px}.card-preview-classic{border:4px solid #f4d376;background:#fff9e9;color:#202b28;box-shadow:0 7px 0 #7d642a,0 13px 20px rgba(0,0,0,.35),inset 0 0 0 3px white}.card-preview-gilded{border:4px solid #d7aa42;background:linear-gradient(145deg,#fff7ca 0 72%,#dcb04b);color:#a12b29;box-shadow:0 7px 0 #6d4714,0 13px 20px rgba(0,0,0,.38),inset 0 0 0 3px #fff3b2,inset 0 0 0 6px rgba(92,60,14,.22)}
.logo-preview{position:relative;width:132px;height:132px;display:grid;place-items:center;color:#e4bf62}.logo-preview-ginkgo::before{content:"";position:absolute;left:50%;top:42px;width:4px;height:67px;border-radius:99px;background:currentColor;transform:translateX(-50%)}.logo-preview-ginkgo i{position:absolute;left:50%;top:23px;width:46px;height:52px;border:4px solid currentColor;border-radius:80% 8% 80% 8%;background:linear-gradient(135deg,transparent 42%,currentColor 43% 48%,transparent 49%);transform-origin:7px 46px}.logo-preview-ginkgo i:nth-child(1){transform:translateX(-50%) rotate(-42deg)}.logo-preview-ginkgo i:nth-child(2){transform:translateX(-50%)}.logo-preview-ginkgo i:nth-child(3){transform:translateX(-50%) rotate(42deg)}
.logo-preview-ring{border:4px double currentColor;border-radius:50%}.logo-preview-ring::before{content:"";position:absolute;inset:10px;border:1px dashed currentColor;border-radius:50%}.logo-preview-ring i{position:absolute;top:23px;width:43px;height:49px;border:4px solid currentColor;border-radius:80% 8% 80% 8%;transform:rotate(42deg)}.logo-preview-ring b{margin-top:58px;font:900 13px "STKaiti","KaiTi",serif;letter-spacing:.14em}
.logo-preview-panzhou{border:5px double currentColor;border-radius:17px;transform:rotate(-3deg)}.logo-preview-panzhou::before{content:"";position:absolute;inset:10px;border:2px solid currentColor;border-radius:9px}.logo-preview-panzhou small{position:absolute;top:24px;color:currentColor;font:900 17px "STKaiti","KaiTi",serif}.logo-preview-panzhou b{margin-top:31px;font:900 27px "STKaiti","KaiTi",serif;letter-spacing:.12em}
@media (max-width:760px){.logo-style-options{grid-template-columns:1fr}.cosmetic-setting-modal{max-height:92vh;overflow:auto}.cosmetic-option-grid>button{min-height:190px;grid-template-rows:105px auto auto}.logo-preview{transform:scale(.78)}.logo-preview-panzhou{transform:rotate(-3deg) scale(.78)}}
.lobby-toast { position:fixed; z-index:30; left:50%; top:92px; transform:translateX(-50%); padding:12px 20px; border:1px solid #f4d477; border-radius:99px; background:rgba(16,55,42,.96); color:#fff2c7; box-shadow:0 10px 26px rgba(0,0,0,.45); font-size:13px; font-weight:800; animation:bubble-up .25s ease-out; }
.lobby-modal { position:fixed; z-index:40; inset:0; display:grid; place-items:center; padding:24px; background:rgba(1,12,12,.7); backdrop-filter:blur(5px); }.lobby-modal-card{position:relative;width:min(760px,92vw);padding:28px;border:2px solid #d8b45a;border-radius:26px;background:linear-gradient(155deg,#0c5360,#082f38 55%,#102b24);box-shadow:inset 0 1px rgba(255,255,255,.18),0 30px 90px rgba(0,0,0,.7);text-align:center}.lobby-modal-card h2{margin:4px 0 6px;font-size:30px}.modal-lead{margin:0 auto 22px;max-width:520px;color:#c9ddd4;font-size:13px;line-height:1.6}.lobby-modal-close{position:absolute;right:14px;top:14px;width:44px;height:44px;border:1px solid rgba(255,255,255,.25);border-radius:50%;background:rgba(0,0,0,.24);color:#fff1c6;font-size:24px;cursor:pointer}
.daily-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:8px}.daily-card{position:relative;min-height:150px;padding:13px 7px;display:grid;justify-items:center;align-content:center;gap:8px;border:1px solid rgba(255,255,255,.16);border-radius:14px;background:rgba(255,255,255,.07);color:#e9f4ed}.daily-card.today{border-color:#ffd66e;box-shadow:0 0 0 3px rgba(255,207,83,.13);background:rgba(218,161,42,.15)}.daily-card.claimed{opacity:.55}.daily-card small{font-size:10px}.daily-card b{color:#ffe09a;font-size:13px}.daily-card em{position:absolute;inset:auto 7px 7px;padding:3px;border-radius:99px;background:#26755f;color:#dffff2;font-size:9px;font-style:normal}.coin-stack{position:relative;width:48px;height:45px}.coin-stack i{position:absolute;left:7px;width:34px;height:14px;border:3px solid #ffdf71;border-radius:50%;background:#d89b1b;box-shadow:inset 0 2px rgba(255,255,255,.45)}.coin-stack i:nth-child(1){bottom:3px}.coin-stack i:nth-child(2){bottom:13px}.coin-stack i:nth-child(3){bottom:23px}
.lobby-primary{min-width:200px;min-height:52px;margin-top:22px;border:1px solid #ffeba9;border-radius:14px;background:linear-gradient(180deg,#4caa55,#187331);color:white;box-shadow:inset 0 2px rgba(255,255,255,.22),0 5px 0 #0b4820,0 10px 18px rgba(0,0,0,.36);font-size:16px;font-weight:900;cursor:pointer}.lobby-primary:disabled{filter:grayscale(1);opacity:.48;cursor:not-allowed;box-shadow:none}.relief-modal{width:min(480px,90vw)}.relief-emblem{margin:0 auto 12px;width:84px;height:84px;display:grid;place-items:center;border:4px solid #f0cd6e;border-radius:50%;background:radial-gradient(circle at 35% 28%,#82caae,#23745c 55%,#123a30);box-shadow:0 0 0 9px rgba(238,197,91,.12),0 12px 24px rgba(0,0,0,.36)}.relief-emblem i{position:relative;width:46px;height:13px;border-radius:99px;background:#ffe19a}.relief-emblem i::after{content:"";position:absolute;left:16px;top:-16px;width:13px;height:46px;border-radius:99px;background:#ffe19a}.relief-balance{margin:16px auto 0;width:210px;padding:14px;border:1px solid rgba(255,223,139,.35);border-radius:15px;background:rgba(0,0,0,.18)}.relief-balance small{display:block;color:#bad2c6;font-size:10px}.relief-balance strong{display:block;margin-top:3px;color:#ffe198;font-size:27px}
.friend-gift-modal{width:min(820px,94vw)}.friend-picker{display:flex;justify-content:center;gap:8px;margin:0 auto 16px}.friend-picker>button{min-width:126px;padding:8px;display:grid;grid-template-columns:50px 1fr;grid-template-rows:1fr 1fr;align-items:center;border:1px solid rgba(255,255,255,.18);border-radius:14px;background:rgba(255,255,255,.06);color:#eff8f1;text-align:left;cursor:pointer}.friend-picker>button.selected{border-color:#7fd8ff;background:rgba(56,157,203,.2);box-shadow:0 0 0 3px rgba(94,197,240,.12)}.friend-picker .avatar-frame{grid-row:1/3}.friend-picker b{font-size:12px}.friend-picker small{color:#bfd5ca;font-size:9px}.cosmetic-gift-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.cosmetic-gift-grid article{min-height:82px;padding:10px;display:grid;grid-template-columns:48px 1fr 92px;align-items:center;gap:10px;border:1px solid rgba(255,225,149,.23);border-radius:14px;background:rgba(255,255,255,.065);text-align:left}.cosmetic-gift-grid article>span{display:grid;place-items:center;width:45px;height:45px;border:1px solid #e5c36b;border-radius:12px;background:rgba(170,106,29,.24);font-size:25px}.cosmetic-gift-grid b{display:block;color:#fff0c7;font-size:13px}.cosmetic-gift-grid small{display:block;margin-top:4px;color:#bad2c6;font-size:9px}.cosmetic-gift-grid button{min-height:42px;border:1px solid #8ed6ec;border-radius:10px;background:#14748b;color:white;font-weight:800;cursor:pointer}.cosmetic-gift-grid button:disabled{border-color:rgba(255,255,255,.16);background:rgba(255,255,255,.08);color:#93a49a;cursor:not-allowed}.gift-compliance-note{margin:14px 0 0;padding:9px 12px;border:1px solid rgba(255,211,102,.26);border-radius:10px;background:rgba(0,0,0,.17);color:#d5dfd6;font-size:10px;line-height:1.5}
.scene-shop-modal{width:min(1040px,96vw)}.room-scene-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.room-scene-card{position:relative;padding:0 10px 12px;display:grid;grid-template-columns:1fr auto;gap:7px;border:1px solid rgba(255,255,255,.18);border-radius:16px;background:rgba(255,255,255,.065);overflow:hidden;text-align:left}.room-scene-card.selected{border-color:var(--scene-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--scene-accent),transparent 78%)}.room-scene-preview{position:relative;grid-column:1/3;height:120px;margin:0 -10px 4px;background-image:linear-gradient(180deg,transparent 45%,rgba(2,17,14,.74)),url("/game/src/assets/concepts/four-room-levels-round-plastic-v3.png");background-size:cover,200% 200%;background-repeat:no-repeat}.room-preview-beginner .room-scene-preview{background-image:linear-gradient(180deg,transparent 45%,rgba(2,17,14,.74)),url("/game/src/assets/concepts/beginner-guizhou-bbq-round-table-final.png");background-size:cover;background-position:center}.room-preview-intermediate .room-scene-preview{background-position:center,100% 0}.room-preview-advanced .room-scene-preview{background-position:center,0 100%}.room-preview-master .room-scene-preview{background-position:center,100% 100%}.room-scene-preview span{position:absolute;left:9px;bottom:8px;padding:3px 7px;border-radius:99px;background:var(--scene-accent);color:#1d1c13;font-size:9px;font-weight:900}.room-scene-preview b{position:absolute;right:8px;top:8px;padding:4px 7px;border-radius:99px;background:rgba(6,47,38,.9);color:#dcfff1;font-size:8px}.room-scene-copy{grid-column:1/3;display:grid;gap:2px}.room-scene-copy small{color:var(--scene-accent);font-size:8px}.room-scene-copy strong{color:#fff1c8;font-size:14px}.room-scene-copy span{color:#bcd2c6;font-size:9px}.room-scene-price{display:flex;align-items:center;gap:5px;color:#ffe09a}.room-scene-price b{font-size:12px}.mini-coin{width:18px;height:18px;border:2px solid #ffe07b;border-radius:50%;background:#c88b17}.room-scene-card>button{min-width:82px;min-height:38px;border:1px solid color-mix(in srgb,var(--scene-accent),#fff 25%);border-radius:9px;background:color-mix(in srgb,var(--scene-accent),#08362b 58%);color:white;font-size:10px;font-weight:850;cursor:pointer}.room-scene-card>button:disabled{filter:grayscale(.75);opacity:.48;cursor:not-allowed}.scene-shop-footer{margin-top:14px;padding:10px 12px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:6px 12px;border:1px solid rgba(255,218,123,.22);border-radius:12px;background:rgba(0,0,0,.16);text-align:left}.scene-shop-footer small{display:block;color:#b9d0c4;font-size:8px}.scene-shop-footer strong{display:block;color:#ffe198;font-size:20px}.scene-shop-footer button{min-height:42px;padding:0 18px;border:1px solid #f5d37c;border-radius:10px;background:#986326;color:white;font-weight:850;cursor:pointer}.scene-shop-footer p{grid-column:1/3;margin:0;color:#9fb4a9;font-size:8px}
@media (max-width:1100px){.lobby-title{left:3%;top:5%;max-width:300px}.lobby-title span{max-width:240px}.enter-table{right:3%;width:160px}.lobby-table-preview{width:52vw}.lobby-feature-strip>span{min-width:125px}.lobby-nav button{min-width:96px}.lobby-header{gap:10px;padding-inline:18px}}
@media (max-height:650px){.game-shell{grid-template-rows:56px 1fr 136px}.hand-card{height:82px;width:56px}.table{margin-top:6px}.opponent{transform:scale(.88)}.opponent-2{transform:translateX(-50%) scale(.88)}}
@media (max-width:900px){.region-tag{display:none}}
@media (max-width:1180px){.shape-option{width:40px;padding:0;justify-content:center;font-size:0}.shape-icon{margin:0}}
@media (max-width:1280px){.arm-option{min-width:42px;padding:0;font-size:10px}}
@media (max-width:1020px){.theme-picker{padding:4px 6px;gap:5px}.theme-swatch{width:24px;height:24px}}
@media (max-width:759px){body{display:grid;place-items:center;padding:24px}body::before{content:"请将设备横屏，以获得完整牌桌体验";max-width:260px;text-align:center;line-height:1.6;color:#f2d786}.game-shell{display:none}}
@media (prefers-reduced-motion:reduce){*{transition:none!important}.flying-card,.impact-ring,.surprise-word,.spark,.play-arm,.turn-countdown.urgent,.special-card-burst,.special-wave,.food-gift-flight,.food-gift-flight span,.food-gift-flight b,.food-gift-flight::before,.food-gift-flight::after,.table-food-gift{animation-duration:.01ms!important;animation-delay:0s!important}.spark,.play-arm,.special-wave,.food-gift-flight::before,.food-gift-flight::after{display:none}}
.water-pipe-motion{left:-68%;bottom:2%;width:180px;height:480px}
.room-beginner .theme-picker{display:flex}
.room-beginner .table{background:var(--table-edge)}
.room-beginner.theme-green .table::before{background:radial-gradient(ellipse at 36% 25%,rgba(255,255,255,.22),transparent 24%),radial-gradient(ellipse at 50% 48%,#23835a 0,#126342 56%,#0a452e 100%)}
.room-beginner.theme-red .table::before{background:radial-gradient(ellipse at 36% 25%,rgba(255,255,255,.2),transparent 24%),radial-gradient(ellipse at 50% 48%,#df5a55 0,#ae2d30 56%,#651719 100%)}
.room-beginner.theme-sky .table::before{background:radial-gradient(ellipse at 36% 25%,rgba(255,255,255,.28),transparent 24%),radial-gradient(ellipse at 50% 48%,#82cbe9 0,#398fc0 56%,#1b547b 100%)}
.room-beginner.theme-ginkgo .table::before{background:radial-gradient(ellipse at 36% 25%,rgba(255,255,255,.3),transparent 24%),radial-gradient(ellipse at 50% 48%,#f5d768 0,#d0a32e 56%,#805c13 100%)}
.theme-swatch{display:grid;place-items:center;color:#fff;font-size:9px;font-weight:900;text-shadow:0 1px 3px rgba(0,0,0,.72)}.swatch-ginkgo{color:#322307;text-shadow:0 1px rgba(255,255,255,.35)}
.ginkgo-table-watermark{position:absolute;z-index:0;left:50%;top:52%;width:166px;height:138px;transform:translate(-50%,-50%);pointer-events:none;opacity:.16;color:#efd477;filter:drop-shadow(0 2px 1px rgba(0,0,0,.2))}.ginkgo-table-watermark::before{content:"";position:absolute;left:50%;top:29px;width:5px;height:80px;border-radius:99px;background:currentColor;transform:translateX(-50%)}.ginkgo-table-watermark i{position:absolute;top:12px;left:50%;width:62px;height:70px;border:4px solid currentColor;border-radius:80% 8% 80% 8%;background:linear-gradient(135deg,transparent 42%,currentColor 43% 47%,transparent 48%);transform-origin:8px 62px}.ginkgo-table-watermark i:nth-child(1){transform:translateX(-50%) rotate(-42deg)}.ginkgo-table-watermark i:nth-child(2){transform:translateX(-50%) rotate(0deg)}.ginkgo-table-watermark i:nth-child(3){transform:translateX(-50%) rotate(42deg)}.ginkgo-table-watermark span{position:absolute;left:50%;bottom:0;transform:translateX(-50%);padding-top:4px;border-top:1px solid currentColor;color:currentColor;font:800 10px/1.2 "STKaiti","KaiTi",serif;letter-spacing:.26em;white-space:nowrap}.theme-red .ginkgo-table-watermark{color:#ffe2a0;opacity:.15}.theme-sky .ginkgo-table-watermark{color:#fff0ad;opacity:.18}.theme-ginkgo .ginkgo-table-watermark{color:#5e4314;opacity:.22}.trick{z-index:2}
.ginkgo-ring-watermark,.panzhou-table-watermark{position:absolute;z-index:0;left:50%;top:52%;transform:translate(-50%,-50%);pointer-events:none;color:#efd477;filter:drop-shadow(0 2px 1px rgba(0,0,0,.2))}
.ginkgo-ring-watermark{width:154px;height:154px;display:grid;place-items:center;border:4px double currentColor;border-radius:50%;opacity:.15}.ginkgo-ring-watermark::before,.ginkgo-ring-watermark::after{content:"";position:absolute;inset:9px;border:1px solid currentColor;border-radius:50%}.ginkgo-ring-watermark::after{inset:19px;border-style:dashed}.ginkgo-ring-watermark i{position:absolute;top:33px;width:47px;height:54px;border:4px solid currentColor;border-radius:80% 8% 80% 8%;transform:rotate(42deg);background:linear-gradient(135deg,transparent 43%,currentColor 44% 48%,transparent 49%)}.ginkgo-ring-watermark b{margin-top:38px;font:900 16px/1 "STKaiti","KaiTi",serif;letter-spacing:.16em}.ginkgo-ring-watermark small{position:absolute;bottom:23px;font:800 7px/1 sans-serif;letter-spacing:.22em}
.panzhou-table-watermark{width:146px;height:146px;display:grid;place-items:center;border:5px double currentColor;border-radius:18px;opacity:.14;transform:translate(-50%,-50%) rotate(-3deg)}.panzhou-table-watermark::before{content:"";position:absolute;inset:10px;border:2px solid currentColor;border-radius:10px}.panzhou-table-watermark small{position:absolute;top:26px;font:900 19px/1 "STKaiti","KaiTi",serif}.panzhou-table-watermark b{margin-top:30px;font:900 31px/1 "STKaiti","KaiTi",serif;letter-spacing:.13em}
.theme-red .ginkgo-ring-watermark,.theme-red .panzhou-table-watermark{color:#ffe2a0}.theme-sky .ginkgo-ring-watermark,.theme-sky .panzhou-table-watermark{color:#fff0ad;opacity:.17}.theme-ginkgo .ginkgo-ring-watermark,.theme-ginkgo .panzhou-table-watermark{color:#5e4314;opacity:.21}
.card-style-gilded .casino-card{border-color:#e1b957;background:linear-gradient(145deg,#fff8d8 0 72%,#e7c36a);box-shadow:0 4px 0 #765015,0 8px 14px rgba(0,0,0,.4),inset 0 0 0 2px #fff7ce,inset 0 0 0 4px rgba(157,102,23,.28)}.card-style-gilded .casino-card::before{border-color:rgba(126,82,18,.58)}
.assistant-greeting-modal{position:fixed;z-index:48;inset:0;display:grid;place-items:center;padding:24px;background:rgba(1,12,10,.72);backdrop-filter:blur(7px)}.assistant-greeting-card{position:relative;width:min(760px,92vw);min-height:430px;display:grid;grid-template-columns:44% 1fr;align-items:center;overflow:hidden;border:2px solid #dfbd67;border-radius:28px;background:linear-gradient(145deg,#0c4f43,#15281f 55%,#4f2c1e);box-shadow:inset 0 1px rgba(255,255,255,.2),0 30px 90px rgba(0,0,0,.72)}.assistant-greeting-card>img{align-self:end;width:100%;height:430px;object-fit:cover;object-position:center 24%;mask-image:linear-gradient(90deg,#000 65%,transparent 100%);-webkit-mask-image:linear-gradient(90deg,#000 65%,transparent 100%)}.assistant-greeting-card>div{padding:32px 32px 32px 10px}.assistant-greeting-card small{color:#e3bd64;font-size:10px;letter-spacing:.14em}.assistant-greeting-card h2{margin:10px 0 8px;color:#fff0c6;font:850 28px/1.25 "STKaiti","KaiTi",sans-serif}.assistant-greeting-card p{margin:0;color:#c8d9ce;font-size:12px;line-height:1.7}.assistant-greeting-card button{min-width:190px;min-height:50px;margin-top:24px;border:1px solid #ffe398;border-radius:13px;background:linear-gradient(180deg,#2b9b77,#11684d);color:white;box-shadow:inset 0 2px rgba(255,255,255,.2),0 5px 0 #094430;font-weight:850;cursor:pointer}.assistant-greeting-card button:active{transform:translateY(3px);box-shadow:inset 0 1px rgba(255,255,255,.2),0 2px 0 #094430}.assistant-brand-mark{justify-self:center;width:132px;height:132px;display:grid;place-items:center;border:4px solid #e4bf62;border-radius:50%;color:#f4d77f;font:900 68px serif;box-shadow:0 0 0 12px rgba(228,191,98,.1)}
.concierge-service-rule{width:min(520px,92%);min-height:54px;margin:14px auto 0;padding:8px 12px;display:grid;grid-template-columns:42px 1fr auto;align-items:center;gap:10px;border:1px solid rgba(255,220,133,.34);border-radius:13px;background:rgba(0,0,0,.17);color:#dbe8df;text-align:left}.concierge-service-rule>span{font-size:26px}.concierge-service-rule strong,.concierge-service-rule small{display:block}.concierge-service-rule small{margin-top:2px;color:#aebfb5;font-size:8px}.concierge-service-rule>b{padding:4px 8px;border-radius:99px;background:#277458;color:#e4fff3;font-size:9px}
.concierge-service-person{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center bottom;opacity:0;animation:concierge-frame-water-pipe 7.6s ease both;mask-image:linear-gradient(90deg,transparent 0,#000 17% 91%,transparent 100%);-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 17% 91%,transparent 100%)}.with-second-service>.concierge-person{animation:concierge-frame-tea 7.6s ease both}
@media (prefers-reduced-motion:reduce){.concierge-service-person{animation-duration:.01ms!important}.with-second-service>.concierge-person{animation-duration:.01ms!important}}
.service-water-pipe .real-service-hand.hand-right{display:none!important}
.experience-choice-modal{width:min(820px,94vw);padding:34px}.experience-choice-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.experience-choice-grid button{min-height:220px;padding:24px 18px;display:grid;place-items:center;align-content:center;gap:10px;border:1px solid rgba(255,220,125,.38);border-radius:20px;background:linear-gradient(155deg,rgba(255,255,255,.1),rgba(5,35,29,.35));color:#fff1c6;cursor:pointer}.experience-choice-grid button:hover,.experience-choice-grid button:focus-visible{border-color:#ffe18a;background:linear-gradient(155deg,rgba(215,172,65,.22),rgba(5,54,42,.44));outline:none;box-shadow:0 0 0 3px rgba(255,225,138,.16)}.experience-choice-grid span{font-size:48px}.experience-choice-grid strong{font-size:22px}.experience-choice-grid small{color:#bfd3c9;font-size:11px;line-height:1.55}@media(max-width:700px){.experience-choice-grid{grid-template-columns:1fr}.experience-choice-grid button{min-height:112px;grid-template-columns:58px 1fr;text-align:left}.experience-choice-grid span{grid-row:1/3;font-size:38px}.experience-choice-grid strong,.experience-choice-grid small{justify-self:start}}
.return-lobby-confirm{z-index:90}.return-lobby-card{width:min(480px,92vw);padding:34px}.return-lobby-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px}.return-lobby-actions button{min-height:50px;border:1px solid rgba(255,226,147,.42);border-radius:13px;background:rgba(255,255,255,.08);color:#fff0c7;font-weight:850;cursor:pointer}.return-lobby-actions #confirm-back-lobby{border-color:#ffb48d;background:linear-gradient(180deg,#a84431,#76271d);color:#fff}
.table-concierge-service-button{position:fixed;z-index:18;right:max(18px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));min-width:104px;min-height:44px;border:1px solid #e4c46c;border-radius:99px;background:linear-gradient(180deg,#287b62,#12513f);color:#fff0c4;box-shadow:0 8px 20px rgba(0,0,0,.38);font-weight:850;cursor:pointer}.table-concierge-service-button:disabled{opacity:.58;cursor:default}
.concierge-service-summary{width:min(520px,92%);min-height:54px;margin:14px auto 0;padding:8px 12px;display:grid;grid-template-columns:42px 1fr auto;align-items:center;gap:10px;border:1px solid rgba(255,220,133,.44);border-radius:13px;background:rgba(0,0,0,.17);color:#dbe8df;text-align:left;cursor:pointer}.concierge-service-summary:hover{background:rgba(213,169,78,.13)}.concierge-service-summary strong,.concierge-service-summary small{display:block}.concierge-service-summary small{margin-top:2px;color:#aebfb5;font-size:8px}.concierge-service-summary>b{padding:5px 9px;border-radius:99px;background:#277458;color:#e4fff3;font-size:9px}.service-summary-icon{position:relative;width:36px;height:30px;display:block;border:2px solid #dfbd67;border-radius:7px}.service-summary-icon::before,.service-summary-icon::after{content:"";position:absolute;background:#dfbd67}.service-summary-icon::before{left:8px;top:7px;width:16px;height:3px;box-shadow:0 6px #dfbd67}.service-summary-icon::after{right:-5px;top:7px;width:8px;height:12px;border-radius:0 7px 7px 0;background:transparent;border:2px solid #dfbd67;border-left:0}
.concierge-service-dialog{position:absolute;z-index:5;inset:0;display:grid;place-items:center;padding:24px;border-radius:24px;background:rgba(1,13,11,.82);backdrop-filter:blur(7px)}.concierge-service-dialog>div{width:min(560px,90%);padding:26px;border:2px solid #d9b55c;border-radius:22px;background:linear-gradient(150deg,#0b4f43,#172b22 60%,#4b2a1c);box-shadow:0 24px 70px rgba(0,0,0,.65)}.concierge-service-dialog small{color:#d9bd75;font-size:9px}.concierge-service-dialog h3{margin:6px 0 5px;color:#fff0c6;font-size:25px}.concierge-service-dialog p{margin:0 0 16px;color:#bfd2c7;font-size:11px;line-height:1.55}.service-choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.service-choice-grid button{min-height:145px;padding:15px;display:grid;justify-items:center;align-content:center;gap:5px;border:1px solid rgba(255,224,147,.35);border-radius:16px;background:rgba(255,255,255,.07);color:#fff0c9;cursor:pointer}.service-choice-grid button:hover{border-color:#ffdc7c;background:rgba(212,164,60,.15)}.service-choice-grid strong{font-size:16px}.service-choice-grid small{color:#bcd0c5}.service-choice-cancel{min-height:44px;margin-top:15px;padding:0 18px;border:1px solid rgba(255,255,255,.2);border-radius:10px;background:transparent;color:#c9d8cf;cursor:pointer}.service-tea-icon,.service-pipe-icon,.service-fruit-icon{position:relative;width:52px;height:52px;display:block}.service-tea-icon{border:3px solid #e1bd6b;border-radius:8px 8px 18px 18px}.service-tea-icon::before{content:"";position:absolute;right:-15px;top:9px;width:15px;height:22px;border:3px solid #e1bd6b;border-left:0;border-radius:0 13px 13px 0}.service-tea-icon::after{content:"";position:absolute;left:8px;right:8px;top:-8px;height:3px;background:#e1bd6b;box-shadow:7px -7px 0 -1px #e1bd6b}.service-pipe-icon{width:24px;border:3px solid #d0a055;border-radius:6px;background:linear-gradient(90deg,#69251b,#b25e37,#69251b);box-shadow:inset 0 0 0 2px #35140f}.service-pipe-icon::before,.service-pipe-icon::after{content:"";position:absolute;left:-5px;width:28px;height:5px;border-radius:2px;background:#d8c5a0}.service-pipe-icon::before{top:7px}.service-pipe-icon::after{bottom:7px}.service-fruit-icon{border:3px solid #dfbd67;border-radius:7px 7px 22px 22px;background:radial-gradient(circle at 18px 18px,#e9443b 0 6px,transparent 7px),radial-gradient(circle at 31px 14px,#f1bd3d 0 7px,transparent 8px),radial-gradient(circle at 35px 27px,#55a956 0 7px,transparent 8px),linear-gradient(180deg,transparent 30%,rgba(223,189,103,.16) 31%)}.service-fruit-icon::before{content:"";position:absolute;left:8px;right:8px;bottom:5px;height:15px;border:3px solid #dfbd67;border-top:0;border-radius:0 0 18px 18px}.service-fruit-icon::after{content:"";position:absolute;left:13px;top:8px;width:8px;height:5px;border-radius:8px 0 8px 0;background:#7bc067;transform:rotate(-22deg)}

/* v1.0 onboarding + competitive leaderboard */
.lobby-nav button small{position:absolute;right:6px;bottom:3px;color:#ffe49a;font-size:8px;font-weight:850}
.nav-rank{position:relative;width:32px;height:31px;display:block}
.nav-rank::before,.nav-rank::after,.nav-rank i{content:"";position:absolute;bottom:1px;border:2px solid #f0cd72;border-radius:4px 4px 2px 2px;background:linear-gradient(180deg,#d64a39,#8b281e)}
.nav-rank::before{left:1px;width:8px;height:15px}.nav-rank i{left:11px;width:8px;height:25px;background:linear-gradient(180deg,#e4bd45,#956016)}.nav-rank::after{right:1px;width:8px;height:20px;background:linear-gradient(180deg,#3b9b81,#1d5f51)}
.tutorial-replay{position:absolute;z-index:4;right:4.5%;bottom:21%;min-width:150px;min-height:54px;padding:7px 13px;display:grid;grid-template-columns:38px 1fr;grid-template-rows:1fr 1fr;align-items:center;border:1px solid rgba(255,221,136,.55);border-radius:15px;background:rgba(4,45,38,.9);color:#fff0c3;box-shadow:0 9px 24px rgba(0,0,0,.36);text-align:left;cursor:pointer;transition:background .2s ease,box-shadow .2s ease}
.tutorial-replay:hover,.tutorial-replay:focus-visible{background:#125f4c;box-shadow:0 11px 28px rgba(0,0,0,.44),0 0 0 3px rgba(255,218,112,.18)}.tutorial-replay .tutorial-help-icon{grid-row:1/3;width:34px;height:34px;display:grid;place-items:center;border:2px solid #f1cd6d;border-radius:50%;color:#ffe49a;font:900 19px serif}.tutorial-replay b{align-self:end;font-size:12px}.tutorial-replay small{align-self:start;color:#b9d3c7;font-size:8px}
.leaderboard-modal{width:min(760px,94vw);padding:26px 30px}.leaderboard-summary{margin:18px 0;display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.leaderboard-summary>div{padding:12px;border:1px solid rgba(255,222,137,.25);border-radius:14px;background:rgba(0,0,0,.16)}.leaderboard-summary small,.leaderboard-summary strong{display:block}.leaderboard-summary small{color:#b8cfc3;font-size:9px}.leaderboard-summary strong{margin-top:4px;color:#ffe08e;font-size:20px}
.leaderboard-tabs{width:min(380px,100%);margin:0 auto 14px;padding:4px;display:grid;grid-template-columns:1fr 1fr;border:1px solid rgba(255,255,255,.14);border-radius:12px;background:rgba(0,0,0,.18)}.leaderboard-tabs button{min-height:42px;border:0;border-radius:9px;background:transparent;color:#bcd0c6;font-weight:850;cursor:pointer;transition:background .2s ease,color .2s ease}.leaderboard-tabs button.selected{background:#22765f;color:#fff3ca;box-shadow:inset 0 1px rgba(255,255,255,.18)}
.leaderboard-list{display:grid;gap:5px;text-align:left}.leaderboard-head,.leaderboard-row{display:grid;grid-template-columns:56px minmax(0,1fr) 70px 92px;align-items:center}.leaderboard-head{padding:0 12px 5px;color:#9eb9ac;font-size:9px}.leaderboard-head span:nth-child(n+3){text-align:right}.leaderboard-row{min-height:54px;padding:6px 12px;border:1px solid rgba(255,255,255,.1);border-radius:12px;background:rgba(255,255,255,.055);color:#eaf4ed}.leaderboard-row.me{border-color:#e4bd60;background:linear-gradient(90deg,rgba(214,165,55,.19),rgba(40,131,102,.17));box-shadow:0 0 0 2px rgba(229,190,94,.08)}.leaderboard-row>span{display:flex;align-items:center;gap:9px}.leaderboard-row>em,.leaderboard-row>b:last-child{text-align:right;font-style:normal}.leaderboard-row>b:last-child{color:#ffe195;font-size:15px}.rank-number{font-size:15px;color:#adc3b7}.rank-number.rank-1{color:#ffd257}.rank-number.rank-2{color:#d9e1e3}.rank-number.rank-3{color:#df9b5b}
.rank-avatar{width:34px;height:34px;display:grid;place-items:center;border:1px solid rgba(255,227,151,.4);border-radius:50%;background:linear-gradient(150deg,#277e67,#153d34);color:#ffebae;font-style:normal;font-weight:900}.leaderboard-row strong{font-size:12px}.leaderboard-row strong small{margin-left:6px;padding:2px 6px;border-radius:99px;background:#e2bd61;color:#203529;font-size:8px}.leaderboard-policy{margin:12px 0 0;padding:8px;border-radius:9px;background:rgba(0,0,0,.17);color:#a9beb4;font-size:9px;line-height:1.5}
.tutorial-overlay{z-index:60;background:rgba(1,10,8,.82);backdrop-filter:blur(9px)}.tutorial-modal{width:min(820px,94vw);min-height:450px;padding:0;display:grid;grid-template-columns:45% 55%;overflow:hidden;background:linear-gradient(145deg,#0e5a49,#0a3530 52%,#261e17);text-align:left}.tutorial-skip{position:absolute;z-index:3;right:18px;top:16px;min-width:94px;min-height:44px;border:1px solid rgba(255,255,255,.2);border-radius:10px;background:rgba(0,0,0,.16);color:#c5d7ce;cursor:pointer}.tutorial-progress{position:absolute;z-index:3;left:calc(45% + 34px);right:134px;top:27px;display:grid;grid-template-columns:repeat(5,1fr);gap:6px}.tutorial-progress i{height:4px;border-radius:99px;background:rgba(255,255,255,.16)}.tutorial-progress i.active{background:#e7bd5a;box-shadow:0 0 8px rgba(235,193,91,.35)}
.tutorial-visual{position:relative;display:grid;place-items:center;overflow:hidden;background:radial-gradient(circle at 50% 42%,rgba(90,201,158,.35),transparent 38%),linear-gradient(155deg,#163f35,#091e1a)}.tutorial-visual::before{content:"";position:absolute;width:270px;height:270px;border:1px solid rgba(238,204,111,.18);border-radius:50%;box-shadow:0 0 0 26px rgba(239,204,112,.035),0 0 0 54px rgba(239,204,112,.025)}.tutorial-ginkgo{position:absolute;left:34px;bottom:34px;width:70px;height:62px;border-radius:90% 5% 90% 5%;background:#d8ad45;opacity:.28;transform:rotate(28deg)}.tutorial-ginkgo::after{content:"";position:absolute;left:6px;bottom:-33px;width:4px;height:48px;border-radius:99px;background:#d8ad45;transform:rotate(-31deg)}.tutorial-symbol{position:relative;z-index:1;width:190px;height:190px;display:grid;place-items:center}.tutorial-symbol i,.tutorial-symbol b,.tutorial-symbol em{position:absolute;display:block}
.tutorial-team .tutorial-symbol i,.tutorial-team .tutorial-symbol b{top:42px;width:58px;height:72px;border:4px solid #75d2f5;border-radius:30px 30px 18px 18px;background:linear-gradient(#f4c39d 0 43%,#267b67 44%)}.tutorial-team .tutorial-symbol i{left:20px}.tutorial-team .tutorial-symbol b{right:20px}.tutorial-team .tutorial-symbol em{left:76px;bottom:25px;width:38px;height:38px;border:8px solid #e5bd58;border-left-color:transparent;border-radius:50%;transform:rotate(-42deg)}
.tutorial-cards .tutorial-symbol i,.tutorial-cards .tutorial-symbol b,.tutorial-special .tutorial-symbol i,.tutorial-special .tutorial-symbol b,.tutorial-special .tutorial-symbol em{width:78px;height:112px;border:5px solid #fff7df;border-radius:10px;background:#e8ddc3;box-shadow:0 9px 15px rgba(0,0,0,.4)}.tutorial-cards .tutorial-symbol i{left:34px;transform:rotate(-10deg)}.tutorial-cards .tutorial-symbol b{right:34px;transform:rotate(10deg)}.tutorial-cards .tutorial-symbol::after{content:"出";z-index:2;display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:#d99f26;color:#3e2a09;font:900 28px serif;box-shadow:0 0 0 8px rgba(218,162,42,.18)}
.tutorial-special .tutorial-symbol i{left:5px;transform:rotate(-12deg)}.tutorial-special .tutorial-symbol b{left:57px}.tutorial-special .tutorial-symbol em{right:5px;transform:rotate(12deg)}.tutorial-special .tutorial-symbol::after{content:"猪  羊  变";z-index:2;color:#8f241d;font:900 23px serif;letter-spacing:.31em;white-space:nowrap;text-shadow:0 1px #fff}
.tutorial-clock .tutorial-symbol::before{content:"30";display:grid;place-items:center;width:130px;height:130px;border:12px solid #e7bd59;border-right-color:#398e73;border-radius:50%;color:#fff0bd;font:900 48px/1 sans-serif;box-shadow:0 0 0 8px rgba(230,188,89,.12)}.tutorial-clock .tutorial-symbol::after{content:"秒";position:absolute;bottom:18px;color:#b9d3c6;font-size:13px}.tutorial-rank .tutorial-symbol::before{content:"1";display:grid;place-items:center;width:110px;height:110px;border:8px solid #f0ce70;border-radius:50%;background:linear-gradient(145deg,#d7a330,#7b5011);color:#fff5c9;font:900 58px serif;box-shadow:0 0 0 14px rgba(233,193,91,.12),0 15px 28px rgba(0,0,0,.4)}.tutorial-rank .tutorial-symbol::after{content:"积分榜";position:absolute;bottom:12px;padding:5px 13px;border-radius:99px;background:#1f735d;color:#fff0bd;font-size:12px;font-weight:900}
.tutorial-copy{align-self:center;padding:72px 40px 34px}.tutorial-copy>small{color:#dfba61;font-size:10px;font-weight:850;letter-spacing:.12em}.tutorial-copy h2{margin:11px 0 10px;color:#fff0c8;font-size:29px}.tutorial-copy p{min-height:76px;margin:0;color:#c4d8ce;font-size:13px;line-height:1.75}.tutorial-actions{margin-top:30px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:10px}.tutorial-actions button{min-height:48px;padding:0 20px;border-radius:12px;font-weight:850;cursor:pointer}.tutorial-back{border:1px solid rgba(255,255,255,.22);background:transparent;color:#c7d8cf}.tutorial-next{min-width:190px;border:1px solid #ffe499;background:linear-gradient(180deg,#3b9e7c,#176249);color:#fff;box-shadow:0 5px 0 #0b4231}
.result-rating{margin:-4px 0 15px;padding:10px 12px;display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:10px;border:1px solid rgba(229,190,94,.3);border-radius:10px;background:rgba(0,0,0,.18);text-align:left}.result-rating span{color:#c8d9d0;font-size:11px}.result-rating strong{color:#ffe095}.result-rating em{padding:3px 7px;border-radius:99px;font-style:normal;font-weight:900}.result-rating em.up{background:#1f7458;color:#dfffee}.result-rating em.down{background:#7c3029;color:#ffe0dc}
@media (max-width:1180px){.lobby-nav button{min-width:84px}.lobby-nav b{font-size:10px}.tutorial-replay{right:3%;bottom:18%}}
@media (max-height:700px){.tutorial-modal{min-height:400px}.tutorial-symbol{transform:scale(.86)}.tutorial-copy{padding-top:62px}}
@media (prefers-reduced-motion:reduce){.tutorial-replay,.leaderboard-tabs button{transition:none}}

/* Avatar profile center */
.avatar-profile-entry{position:absolute;z-index:4;left:4.5%;bottom:21%;min-width:174px;min-height:58px;padding:7px 13px;display:grid;grid-template-columns:42px 1fr;grid-template-rows:1fr 1fr;align-items:center;gap:0 10px;border:1px solid rgba(255,221,136,.55);border-radius:15px;background:rgba(4,45,38,.92);color:#fff0c3;box-shadow:0 9px 24px rgba(0,0,0,.36);text-align:left;cursor:pointer;transition:background .2s ease,box-shadow .2s ease}
.avatar-profile-entry:hover,.avatar-profile-entry:focus-visible{background:#125f4c;box-shadow:0 11px 28px rgba(0,0,0,.44),0 0 0 3px rgba(255,218,112,.18)}
.avatar-profile-entry img{grid-row:1/3;width:42px;height:42px;border:2px solid #e7c668;border-radius:50%;object-fit:cover;background:#244c3a}
.avatar-profile-entry b{align-self:end;font-size:12px}.avatar-profile-entry small{align-self:start;color:#b9d3c7;font-size:8px}
.avatar-profile-overlay{z-index:70;background:rgba(1,10,8,.84);backdrop-filter:blur(9px)}
.avatar-profile-modal{width:min(920px,95vw);max-height:92vh;padding:28px 30px;overflow:auto;text-align:left;background:linear-gradient(145deg,#0c5344,#092f2a 58%,#282016)}
.avatar-profile-heading{display:flex;align-items:center;gap:16px;padding:0 48px 20px 0;border-bottom:1px solid rgba(255,224,148,.18)}
.avatar-profile-heading>img{width:78px;height:78px;flex:0 0 78px;border:4px solid #e1be61;border-radius:50%;object-fit:cover;background:#244c3a;box-shadow:0 8px 24px rgba(0,0,0,.4)}
.avatar-profile-heading .eyebrow{margin:0;color:#dfbd67}.avatar-profile-heading h2{margin:4px 0;color:#fff1c8;font-size:26px}.avatar-profile-heading span{color:#bcd1c6;font-size:11px}
.player-name-editor{margin:16px 0 20px;padding:14px 16px;border:1px solid rgba(255,224,148,.22);border-radius:15px;background:rgba(0,0,0,.14);text-align:left}.player-name-editor label{display:block;margin-bottom:7px;color:#f0d58e;font-size:11px;font-weight:850}.player-name-editor>div{display:grid;grid-template-columns:minmax(0,1fr) 112px;gap:9px}.player-name-editor input{min-height:48px;padding:0 14px;border:1px solid rgba(255,229,161,.35);border-radius:11px;outline:none;background:rgba(255,255,255,.08);color:#fff5d6;font-size:16px;font-weight:800;letter-spacing:.06em;transition:border-color .2s ease,box-shadow .2s ease}.player-name-editor input:focus{border-color:#f0ca68;box-shadow:0 0 0 3px rgba(240,202,104,.16)}.player-name-editor input[aria-invalid="true"]{border-color:#ff8d78;box-shadow:0 0 0 3px rgba(255,91,70,.12)}.player-name-editor button{min-height:48px;border:1px solid #f2d07b;border-radius:11px;background:linear-gradient(180deg,#318f70,#15664e);color:white;font-weight:850;cursor:pointer;transition:filter .2s ease,box-shadow .2s ease}.player-name-editor button:hover{filter:brightness(1.08);box-shadow:0 6px 15px rgba(0,0,0,.25)}.player-name-editor button:focus-visible{outline:3px solid #f2ca65;outline-offset:3px}.player-name-editor small{display:block;margin-top:7px;color:#aebfb6;font-size:9px}.player-name-editor small.error{color:#ffab9c}
.player-name-guidance{grid-template-columns:1fr auto!important;align-items:center;margin-top:7px}.player-name-guidance small{margin-top:0}.player-name-guidance span{color:#e7c66f;font-size:10px;font-weight:800;font-variant-numeric:tabular-nums}
.avatar-library,.avatar-uploads{margin-top:20px}.avatar-section-title{display:flex;align-items:end;justify-content:space-between;gap:18px;margin-bottom:11px}.avatar-section-title h3{margin:0;color:#fff0c7;font-size:17px}.avatar-section-title p{margin:4px 0 0;color:#a9c1b5;font-size:10px}.avatar-section-title>span{padding:4px 9px;border:1px solid rgba(230,193,96,.3);border-radius:99px;color:#dfc271;font-size:9px;white-space:nowrap}
.avatar-choice-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.avatar-choice{min-height:116px;padding:10px;display:grid;grid-template-columns:62px 1fr;grid-template-rows:1fr 1fr;align-items:center;gap:0 10px;border:1px solid rgba(255,255,255,.14);border-radius:15px;background:rgba(255,255,255,.055);color:#eef7f0;text-align:left;cursor:pointer;transition:transform .18s ease,border-color .18s ease,background .18s ease}.avatar-choice:hover,.avatar-choice:focus-visible{transform:translateY(-2px);border-color:#8bd8c1;background:rgba(62,154,125,.14)}.avatar-choice.selected{border-color:#e4bd5d;background:linear-gradient(140deg,rgba(218,170,55,.2),rgba(42,132,104,.16));box-shadow:0 0 0 3px rgba(228,189,93,.1)}.avatar-choice img{grid-row:1/3;width:62px;height:62px;border:3px solid rgba(255,226,146,.56);border-radius:50%;object-fit:cover;background:#244c3a}.avatar-choice strong{align-self:end;font-size:12px}.avatar-choice small{align-self:start;color:#9fb9ad;font-size:9px}.avatar-choice.selected small{color:#ffe099;font-weight:850}
.uploaded-avatar-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.uploaded-avatar-grid article{min-height:90px;padding:8px;display:grid;grid-template-columns:1fr auto;gap:8px;border:1px solid rgba(255,255,255,.13);border-radius:15px;background:rgba(255,255,255,.05)}.uploaded-avatar-grid article.selected{border-color:#e2bd61;background:rgba(207,160,49,.13)}.uploaded-avatar-select{min-height:70px;padding:5px;display:flex;align-items:center;gap:10px;border:0;border-radius:10px;background:transparent;color:#eff7f2;cursor:pointer;text-align:left}.uploaded-avatar-select img{width:58px;height:58px;border:2px solid #e2c16c;border-radius:50%;object-fit:cover}.uploaded-avatar-select span{font-size:11px;font-weight:850}.delete-uploaded-avatar{align-self:center;min-width:52px;min-height:44px;border:1px solid rgba(255,166,151,.32);border-radius:10px;background:rgba(139,48,37,.18);color:#ffc1b8;cursor:pointer}.upload-avatar-tile{min-height:90px;padding:8px;display:grid;grid-template-columns:48px 1fr;grid-template-rows:1fr 1fr;align-items:center;gap:0 10px;border:1px dashed rgba(134,219,190,.5);border-radius:15px;background:rgba(46,143,112,.08);color:#dff9ee;text-align:left;cursor:pointer}.upload-avatar-tile>span{grid-row:1/3;width:44px;height:44px;display:grid;place-items:center;border:1px solid #79ccb1;border-radius:50%;font-size:25px}.upload-avatar-tile strong{align-self:end;font-size:12px}.upload-avatar-tile small{align-self:start;color:#9db8ad;font-size:8px}.upload-avatar-tile:disabled{opacity:.46;cursor:not-allowed}.avatar-privacy-note{margin:12px 0 0;padding:10px 12px;border-radius:10px;background:rgba(0,0,0,.18);color:#acc2b7;font-size:9px;line-height:1.55}
.rank-avatar-image{display:block;object-fit:cover}
@media (max-width:760px){.avatar-profile-entry{left:3%;bottom:17%;min-width:152px}.avatar-choice-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.uploaded-avatar-grid{grid-template-columns:1fr}.avatar-profile-modal{padding:22px 18px}.avatar-profile-heading>img{width:64px;height:64px;flex-basis:64px}.player-name-editor>div{grid-template-columns:1fr}.player-name-editor button{width:100%}}
@media (prefers-reduced-motion:reduce){.avatar-profile-entry,.avatar-choice{transition:none}}

/* V1.2: keep the urging library fully visible in short landscape viewports. */
.urge-phrase-panel{max-height:calc(100dvh - 40px);overflow:hidden}
.urge-phrase-panel>div>button{right:2px;top:2px;width:34px;height:34px;border:0;border-radius:8px;background:rgba(255,255,255,.08)}
@media (max-height:560px){
  .urge-phrase-panel{top:12px;bottom:12px;max-height:none;padding:12px 14px;transform:none;animation:none}
  .urge-phrase-panel>div:first-child{padding-right:38px}
  .urge-phrase-panel>div>small{font-size:8px}
  .urge-phrase-panel>div>strong{font-size:17px}
  .urge-phrase-panel>div>button{width:32px;height:32px;right:0;top:0}
  .urge-phrase-panel>p{margin:5px 0 6px;font-size:9px}
  .urge-phrase-list{gap:5px}
  .urge-phrase-list button{min-height:44px;padding:4px 7px 4px 10px;grid-template-columns:20px minmax(0,1fr) 32px;gap:7px}
  .urge-phrase-list b,.urge-phrase-list button:nth-child(3) b,.urge-phrase-list button:nth-child(4) b{font-size:10px;line-height:1.25}
  .urge-phrase-list .phrase-rank{font-size:10px}
  .urge-phrase-list .phrase-play{width:30px;height:30px;border-radius:8px;font-size:11px}
}