/*! tailwindcss v4.1.18 | MIT License | https://tailwindcss.com */@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-border-style:solid;--tw-font-weight:initial;--tw-tracking:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-duration:initial;--tw-ease:initial;--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scale-z:1}}}@layer theme{:root,:host{--font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-red-400:oklch(70.4% .191 22.216);--color-amber-500:oklch(76.9% .188 70.08);--color-indigo-500:oklch(58.5% .233 277.117);--color-black:#000;--color-white:#fff;--spacing:.25rem;--text-sm:.875rem;--text-sm--line-height:calc(1.25/.875);--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--tracking-wide:.025em;--radius-sm: calc(.5rem - 4px) ;--radius-md: calc(.5rem - 2px) ;--radius-lg:.5rem;--ease-out:cubic-bezier(0,0,.2,1);--animate-spin:spin 1s linear infinite;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono);--color-foreground:#f2f2f2;--color-accent:#d4a84b}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){-webkit-appearance:button;-moz-appearance:button;appearance:button}::file-selector-button{-webkit-appearance:button;-moz-appearance:button;appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.pointer-events-none{pointer-events:none}.visible{visibility:visible}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.inset-0{inset:calc(var(--spacing)*0)}.-top-1{top:calc(var(--spacing)*-1)}.-right-1{right:calc(var(--spacing)*-1)}.right-0{right:calc(var(--spacing)*0)}.bottom-0{bottom:calc(var(--spacing)*0)}.left-0{left:calc(var(--spacing)*0)}.isolate{isolation:isolate}.z-10{z-index:10}.row-1{grid-row:1}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.box-border{box-sizing:border-box}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.inline-flex{display:inline-flex}.table{display:table}.h-5{height:calc(var(--spacing)*5)}.h-6{height:calc(var(--spacing)*6)}.h-\[18px\]{height:18px}.h-\[clamp\(16px\,4vw\,22px\)\]{height:clamp(16px,4vw,22px)}.h-\[clamp\(18px\,3\.5vw\,22px\)\]{height:clamp(18px,3.5vw,22px)}.h-\[clamp\(22px\,4\.5vw\,30px\)\]{height:clamp(22px,4.5vw,30px)}.h-full{height:100%}.w-5{width:calc(var(--spacing)*5)}.w-6{width:calc(var(--spacing)*6)}.w-\[clamp\(16px\,4vw\,22px\)\]{width:clamp(16px,4vw,22px)}.w-\[clamp\(18px\,3\.5vw\,22px\)\]{width:clamp(18px,3.5vw,22px)}.w-\[clamp\(22px\,4\.5vw\,30px\)\]{width:clamp(22px,4.5vw,30px)}.w-full{width:100%}.min-w-\[18px\]{min-width:18px}.transform{transform:var(--tw-rotate-x,)var(--tw-rotate-y,)var(--tw-rotate-z,)var(--tw-skew-x,)var(--tw-skew-y,)}.animate-spin{animation:var(--animate-spin)}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.touch-none{touch-action:none}.resize{resize:both}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.gap-2{gap:calc(var(--spacing)*2)}.rounded{border-radius:.25rem}.rounded-\[14px\]{border-radius:14px}.rounded-full{border-radius:3.40282e38px}.rounded-md{border-radius:var(--radius-md)}.border{border-style:var(--tw-border-style);border-width:1px}.bg-amber-500{background-color:var(--color-amber-500)}.bg-black\/30{background-color:#0000004d}@supports (color:color-mix(in lab,red,red)){.bg-black\/30{background-color:color-mix(in oklab,var(--color-black)30%,transparent)}}.bg-black\/40{background-color:#0006}@supports (color:color-mix(in lab,red,red)){.bg-black\/40{background-color:color-mix(in oklab,var(--color-black)40%,transparent)}}.bg-indigo-500\/30{background-color:#625fff4d}@supports (color:color-mix(in lab,red,red)){.bg-indigo-500\/30{background-color:color-mix(in oklab,var(--color-indigo-500)30%,transparent)}}.fill-current{fill:currentColor}.px-1{padding-inline:calc(var(--spacing)*1)}.px-3{padding-inline:calc(var(--spacing)*3)}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-\[10px\]{font-size:10px}.text-\[clamp\(14px\,3\.5vw\,20px\)\]{font-size:clamp(14px,3.5vw,20px)}.text-\[clamp\(16px\,4vw\,24px\)\]{font-size:clamp(16px,4vw,24px)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.text-red-400{color:var(--color-red-400)}.text-white{color:var(--color-white)}.text-white\/70{color:#ffffffb3}@supports (color:color-mix(in lab,red,red)){.text-white\/70{color:color-mix(in oklab,var(--color-white)70%,transparent)}}.uppercase{text-transform:uppercase}.opacity-25{opacity:.25}.opacity-75{opacity:.75}.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-\[inset_0_0_8px_rgba\(99\,102\,241\,0\.5\)\]{--tw-shadow:inset 0 0 8px var(--tw-shadow-color,#6366f180);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ring{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(1px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.filter{filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-100{--tw-duration:.1s;transition-duration:.1s}.duration-150{--tw-duration:.15s;transition-duration:.15s}.ease-out{--tw-ease:var(--ease-out);transition-timing-function:var(--ease-out)}.select-none{-webkit-user-select:none;user-select:none}@media (hover:hover){.hover\:text-white\/90:hover{color:#ffffffe6}@supports (color:color-mix(in lab,red,red)){.hover\:text-white\/90:hover{color:color-mix(in oklab,var(--color-white)90%,transparent)}}}.active\:translate-y-\[2px\]:active{--tw-translate-y:2px;translate:var(--tw-translate-x)var(--tw-translate-y)}.active\:scale-95:active{--tw-scale-x:95%;--tw-scale-y:95%;--tw-scale-z:95%;scale:var(--tw-scale-x)var(--tw-scale-y)}.active\:shadow-\[0_1px_0_rgba\(0\,0\,0\,0\.3\)\]:active{--tw-shadow:0 1px 0 var(--tw-shadow-color,#0000004d);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-30:disabled{opacity:.3}.disabled\:active\:translate-y-0:disabled:active{--tw-translate-y:calc(var(--spacing)*0);translate:var(--tw-translate-x)var(--tw-translate-y)}.disabled\:active\:scale-100:disabled:active{--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x)var(--tw-scale-y)}}:root{color-scheme:dark;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--won-purple:#5b21b6;--won-purple-dark:#1e1b4b;--won-purple-night:#050316;--won-lavender:#f5f3ff;--won-gold:#d4a84b;--won-gold-light:#e0c068;--won-gold-dark:#b8923a;--won-board-base:#121726;--won-board-edge:#0b0d14;--won-timer-normal:#fbbf24;--won-timer-warning:#f59e0b;--won-timer-critical:#dc2626;--won-text-primary:#fffffff2;--won-text-secondary:#ffffffbf;--won-text-muted:#ffffff73;--won-shadow-tile:0 2px 4px #00000059;--won-shadow-tile-hover:0 4px 10px #00000080;--won-shadow-tile-placed:0 1px 2px #00000073;--won-shadow-tile-dragging:0 8px 20px #0009;--won-shadow-board:0 14px 36px #0000008c;--won-glow-gold:0 0 12px #fbbf2440;--won-glow-purple:0 0 16px #5b21b633;--won-space-1:4px;--won-space-2:8px;--won-space-3:12px;--won-space-4:16px;--won-space-6:24px;--won-space-8:32px;--won-space-12:48px;--won-duration-fast:.12s;--won-duration-normal:.18s;--won-duration-slow:.24s;--won-duration-slower:.32s;--won-ease:cubic-bezier(.32,.72,0,1);--color-bg-primary:#0b0d14;--color-bg-secondary:#111522;--color-bg-card:#ffffff08;--color-border:#ffffff14;--color-accent:#b8923a;--color-accent-hover:#d4a84b;--color-accent-dark:#8b6914;--color-gold:#d4a84b;--color-gold-dark:#8b6914;--color-success:#3b7f5a;--color-warning:#f59e0b;--color-error:#ef4444;--color-text-primary:#ffffffe6;--color-text-secondary:#fff9;--radius-sm:6px;--radius-md:10px;--radius-lg:14px;font-family:Inter,Prompt,system-ui,-apple-system,sans-serif;font-weight:400;line-height:1.5}body{color:var(--color-foreground);background:#150c14 url(/wood-background.png) 50%/cover no-repeat fixed;position:relative}body:before{content:"";pointer-events:none;z-index:0;background:radial-gradient(circle at 50% 15%,#ffffff14,#0000 55%),radial-gradient(circle at 50% 85%,#0009,#000000d9);position:fixed;top:0;right:0;bottom:0;left:0}*{box-sizing:border-box;-webkit-user-select:none;user-select:none;margin:0;padding:0}img{-webkit-user-drag:none;user-drag:none}html,body{overscroll-behavior:none;touch-action:manipulation;width:100%;min-width:320px;height:100dvh;margin:0;overflow:hidden}#root{z-index:1;height:100%;position:relative;overflow:hidden}.modal-overlay{z-index:1000;background-color:#0009;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;top:0;right:0;bottom:0;left:0}.modal-content{border-radius:var(--radius-lg);background:linear-gradient(#1e1e32fa,#141428fc);border:1px solid #ffffff1a;max-width:90vw;padding:24px;box-shadow:0 20px 60px #00000080,0 0 40px #d4a84b2e}.btn{border-radius:var(--radius-sm);cursor:pointer;border:none;padding:10px 20px;font-weight:500;transition:all .15s}.btn-secondary{color:var(--color-text-primary);background:#ffffff1a}.btn-secondary:hover{background:#ffffff26}.btn-primary{background:var(--color-accent);color:#fff}.btn-primary:hover{background:var(--color-accent-hover);transform:translateY(-1px)}.submit-btn{transition:transform .1s cubic-bezier(.32,.72,0,1),box-shadow .1s cubic-bezier(.32,.72,0,1);transform:translateY(0)}.submit-btn:active:not(:disabled){transform:translateY(1px)}.submit-btn.shake{animation:.12s ease-out submit-shake}@keyframes submit-shake{0%,to{transform:translate(0)}25%{transform:translate(-2px)}50%{transform:translate(2px)}75%{transform:translate(-1px)}}:focus{outline:none}:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}button:focus-visible,.btn:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px;box-shadow:0 0 0 4px #d4a84b40}.mode-card:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px;background:#d4a84b1f}.quick-play-btn:focus-visible{outline-offset:3px;box-shadow:0 4px 0 var(--color-accent-dark),0 8px 24px #d4a84b73;outline:2px solid #fff}.difficulty-pill:focus-visible,.timer-pill:focus-visible,.theme-card:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.header-icon-btn:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px;border-radius:8px}.toggle-switch input:focus-visible+.toggle-slider{outline:2px solid var(--color-accent);outline-offset:2px}.loading-fade-pulse{animation:1.5s ease-in-out infinite fade-pulse}@keyframes fade-pulse{0%,to{opacity:.4}50%{opacity:.7}}.skeleton{background:linear-gradient(90deg,#ffffff0d,#ffffff1a,#ffffff0d) 0 0/200% 100%;border-radius:4px;animation:1.5s ease-in-out infinite skeleton-shimmer}@keyframes skeleton-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-scale-x{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-y{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-z{syntax:"*";inherits:false;initial-value:1}:root{--tile-selection-rgb: 184, 146, 58;--tile-selection-color: rgba(var(--tile-selection-rgb), .75);--tile-selection-glow: rgba(var(--tile-selection-rgb), .35);--tile-selection-color-intense: rgba(var(--tile-selection-rgb), .95);--tile-selection-glow-intense: rgba(var(--tile-selection-rgb), .55);--tile-bg: #e2caa4;--tile-bg-gradient: linear-gradient( 165deg, #ecd6b1 0%, #d8b789 55%, #b7884f 100% );--tile-border: rgba(156, 104, 56, .8);--tile-border-top: rgba(255, 255, 255, .3);--tile-border-left: rgba(255, 255, 255, .22);--tile-text: #3e234a;--tile-text-shadow: 0 1px 0 rgba(255, 255, 255, .2), 0 1px 2px rgba(0, 0, 0, .35);--tile-points: rgba(60, 50, 80, .72);--tile-edge-color: rgba(176, 122, 70, .7);--tile-edge-dark: rgba(120, 78, 42, .72);--tile-edge-side: rgba(155, 106, 64, .68);--tile-shadow-color: rgba(0, 0, 0, .48);--tile-inset-light: rgba(255, 255, 255, .4);--tile-inset-dark: rgba(0, 0, 0, .2);--tile-committed-bg: linear-gradient(160deg, #4b3760 0%, #382850 100%);--tile-committed-border: rgba(180, 130, 50, .38);--tile-committed-text: #f7f2ff;--tile-committed-text-shadow: 0 1px 2px #0b0614;--tile-committed-points: rgba(247, 242, 255, .85);--tile-committed-glow: 0 0 6px rgba(200, 170, 100, .1);--last-move-marker-color: 220, 180, 60;--last-move-marker-opacity: .75;--tile-rack-bg-gradient: linear-gradient( 165deg, #e0d0a8 0%, #ccab7a 55%, #a87a45 100% );--tile-border-radius: 16%;--tile-box-shadow: 0 8px 0 rgba(165, 112, 70, .9), 0 12px 16px rgba(0, 0, 0, .38), inset 0 1px 0 rgba(255, 255, 255, .5), inset 0 -2px 3px rgba(0, 0, 0, .16);--tile-box-shadow-hover: 0 8px 0 rgba(165, 112, 70, .9), 0 16px 20px rgba(0, 0, 0, .42), inset 0 1px 0 rgba(255, 255, 255, .55), inset 0 -2px 3px rgba(0, 0, 0, .2);--tile-box-shadow-active: 0 4px 0 rgba(140, 95, 55, .88), 0 6px 8px rgba(0, 0, 0, .32), inset 0 1px 0 rgba(255, 255, 255, .38);--tile-box-shadow-committed: inset 0 1px 0 rgba(255, 255, 255, .08), 0 1px 2px rgba(0, 0, 0, .45)}.tile{display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:var(--tile-border-radius);cursor:grab;-webkit-user-select:none;user-select:none;touch-action:none;position:relative;z-index:0;overflow:hidden;font-family:Inter,system-ui,-apple-system,sans-serif;font-weight:700;transition:transform .15s ease-out,box-shadow .15s ease-out;background:var(--tile-bg-gradient);border:1px solid var(--tile-border);box-shadow:var(--tile-box-shadow);transform:translateZ(0);-webkit-transform:translateZ(0)}.tile:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;background:linear-gradient(180deg,#ffffff38,#fff0 55%);opacity:.35;pointer-events:none}@media (hover: hover){.tile:hover{transform:translateY(-2px) scale(1.02);box-shadow:var(--tile-box-shadow-hover)}}.tile:active{transform:translateY(1px) scale(.98);box-shadow:var(--tile-box-shadow-active)}.tile.dragging{cursor:grabbing;z-index:1000;transform:translateY(-4px) scale(1.03) rotate(.4deg);box-shadow:0 10px 20px #00000073,inset 0 1px #ffffff73;transition:none}.tile.drag-overlay{transition:none!important;will-change:transform}.tile.special-tile,.tile.modal-tile{animation:none!important}.tile.modal-tile{pointer-events:none;cursor:default}.tile.clickable{cursor:pointer}@media (hover: hover){.tile.clickable:hover{box-shadow:var(--tile-box-shadow-hover)}}.tile-mini{width:clamp(28px,8vw,44px);height:clamp(28px,8vw,44px);font-size:clamp(14px,4vw,22px);border-radius:clamp(5px,1.5vw,8px);box-shadow:none;border:none}.tile-mini:before,.tile-mini:after{display:none}.tile-mini .tile-value{font-weight:900;letter-spacing:-.5px}.tile-mini .tile-points{font-size:clamp(6px,1.8vw,9px);font-weight:700;bottom:clamp(1px,.5vw,2px);right:clamp(2px,.7vw,3px)}@media (hover: hover){.tile-mini:hover{transform:none}}.tile-small{--tile-size: var(--cell-size, 24px);--tile-overlap: max(0px, calc(var(--cell-gap, 0px) * 2));width:calc(100% + var(--tile-overlap));height:calc(100% + var(--tile-overlap));margin:calc(var(--tile-overlap) * -.5);font-size:calc(var(--tile-size) * .55);box-sizing:border-box;border-radius:calc(var(--tile-size) * .12);border:1px solid var(--tile-border);z-index:1;box-shadow:inset 0 1px #fff6,0 2px 4px #0006,0 3px 6px #0003}.tile-small:before,.tile-small:after{display:none}.tile-small .tile-value{font-weight:900;letter-spacing:-1px}.tile-small .tile-points{font-size:calc(var(--tile-size) * .18);bottom:calc(var(--tile-size) * .05);right:calc(var(--tile-size) * .09)}@media (hover: hover){.tile-small:hover{transform:translateY(-2px) scale(1.015);box-shadow:0 calc(var(--tile-size) * .12) calc(var(--tile-size) * .28) #00000059,inset 0 1px #ffffff8c}}.tile.cell-outline-double-piece,.tile.cell-outline-triple-piece,.tile.cell-outline-double-equation,.tile.cell-outline-triple-equation,.tile.cell-outline-center{position:relative;z-index:6;background:var(--tile-bg-gradient);box-shadow:none}.tile.cell-outline-double-piece,.tile.cell-outline-triple-piece,.tile.cell-outline-double-equation,.tile.cell-outline-triple-equation,.tile.cell-outline-center{background-image:linear-gradient(135deg,var(--cell-accent) 0 25%,transparent 25%),var(--tile-bg-gradient);background-size:70% 70%,100% 100%;background-position:top left,center;background-repeat:no-repeat}.tile.cell-outline-double-piece{--cell-accent: rgba(180, 95, 40, .95)}.tile.cell-outline-triple-piece{--cell-accent: rgba(125, 100, 165, .95)}.tile.cell-outline-double-equation{--cell-accent: rgba(190, 145, 50, .95)}.tile.cell-outline-triple-equation{--cell-accent: rgba(110, 45, 60, .95)}.tile.cell-outline-center{--cell-accent: rgba(200, 150, 60, .95)}.tile-cell-sash{position:absolute;top:13%;left:2%;font-size:.25em;line-height:1;font-weight:800;letter-spacing:.02em;color:#fff8e6f2;text-transform:uppercase;text-shadow:0 1px 1px rgba(0,0,0,.55);transform:rotate(-45deg) translate(-10%,-15%);transform-origin:top left;pointer-events:none;z-index:3}.tile-small.committed{background:var(--tile-committed-bg);box-sizing:border-box;width:calc(100% + var(--tile-overlap));height:calc(100% + var(--tile-overlap));margin:calc(var(--tile-overlap) * -.5);border-radius:calc(var(--tile-size) * .12);border:1px solid var(--tile-committed-border);box-shadow:inset 1px 1px #ffffff26,inset -1px -1px #00000040,var(--tile-committed-glow),0 2px 4px #00000080,0 4px 8px #00000040}.tile-small.committed .tile-value{color:var(--tile-committed-text);font-weight:900;text-shadow:var(--tile-committed-text-shadow);letter-spacing:-1px}.tile-small.committed .tile-points{color:var(--tile-committed-points);font-weight:700;text-shadow:0 1px 1px rgba(0,0,0,.5)}@media (hover: hover){.tile-small.committed:hover{transform:none;box-shadow:none}}.tile-small.last-committed{background:linear-gradient(160deg,#6e5490,#574070);border-color:#dcb43ccc;box-shadow:inset 1px 1px #ffffff38,inset -1px -1px #0003,0 0 10px #dcb43c66,0 2px 4px #00000080,0 4px 8px #00000040}.tile-small.last-committed:before{content:"";position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;border-radius:inherit;border:2px solid rgba(var(--last-move-marker-color),var(--last-move-marker-opacity));pointer-events:none;z-index:10}.board-container.is-dragging .tile-small.last-committed:before{display:none}.tile-assigned:not(.committed):not(.last-committed) .tile-value{color:#0e7490!important}.tile-assigned.committed .tile-value,.tile-assigned.last-committed .tile-value{color:#22d3ee!important}.tile-small.bingo-glow{background:linear-gradient(155deg,#f5e6c8,#e8d4a8 15%,#d4b87a,#c9a55a 65%,#b8923a);border:1px solid rgba(184,146,58,.9);box-shadow:inset 0 1px 2px #ffffffb3,inset 0 -1px 2px #78551e66,0 2px 4px #0000004d,0 0 8px #d4b87a80,0 0 16px #b8923a4d;position:relative}.tile-small.bingo-glow:after{content:"";position:absolute;top:-4px;right:-4px;bottom:-4px;left:-4px;border-radius:inherit;background:transparent;box-shadow:0 0 12px #d4b87a99,0 0 24px #b8923a59;opacity:0;animation:bingo-glow-pulse 2.5s ease-in-out infinite;pointer-events:none;z-index:-1}@keyframes bingo-glow-pulse{0%,to{opacity:0}50%{opacity:1}}.tile-small.bingo-glow .tile-value{color:#5a4020;text-shadow:0 1px 0 rgba(255,255,255,.5);font-weight:900}.tile-small.bingo-glow .tile-points{color:#6a4828;text-shadow:0 1px 0 rgba(255,255,255,.4)}.tile-small.bingo-glow .tile-value .selected-op,.tile-small.bingo-glow .tile-value .op-separator,.tile-small.bingo-glow .tile-value span:not(.selected-op):not(.unselected-op):not(.op-separator){color:#4a3520}.tile-small.bingo-glow .tile-value .unselected-op{color:#4a352066;font-size:.55em;vertical-align:middle}.tile-small.bingo-glow.cell-outline-double-piece,.tile-small.bingo-glow.cell-outline-triple-piece,.tile-small.bingo-glow.cell-outline-double-equation,.tile-small.bingo-glow.cell-outline-triple-equation,.tile-small.bingo-glow.cell-outline-center{background-image:linear-gradient(135deg,var(--cell-accent) 0 25%,transparent 25%),linear-gradient(155deg,#f5e6c8,#e8d4a8 15%,#d4b87a,#c9a55a 65%,#b8923a);background-size:70% 70%,100% 100%;background-position:top left,center;background-repeat:no-repeat}.tile-medium{--rack-size: var(--rack-tile-size, 160px);--edge-size: calc(var(--rack-size) * .06);width:calc(var(--rack-size) - 2px);height:calc(var(--rack-size) - 2px);font-size:calc(var(--rack-size) * .52);border-radius:calc(var(--rack-size) * .15);border:1px solid var(--tile-border);background:var(--tile-rack-bg-gradient);box-shadow:0 var(--edge-size) 0 #9b6941e0,0 calc(var(--edge-size) * 2.5) calc(var(--edge-size) * 3) #0000006b,inset 0 1px #ffffff80,inset 0 -1px 2px #0003}@media (hover: hover){.tile-medium:hover{transform:translateY(-2px) scale(1.02);box-shadow:0 calc(var(--edge-size) * 1.3) 0 #af784be6,0 calc(var(--edge-size) * 3) calc(var(--edge-size) * 3.5) #00000073,inset 0 1px #ffffffa6}}.tile-medium:active{transform:translateY(1px) scale(.98);box-shadow:0 calc(var(--edge-size) * .5) 0 #96643ce6,0 calc(var(--edge-size) * 1.5) calc(var(--edge-size) * 2) #00000059}.tile-medium .tile-value{font-weight:900;letter-spacing:-1.5px}.tile-medium .tile-points{font-size:calc(var(--rack-size) * .2);font-weight:700;bottom:calc(var(--rack-size) * .04);right:calc(var(--rack-size) * .08)}.tile-value{color:var(--tile-text);font-weight:800;letter-spacing:-.3px;opacity:1;text-shadow:var(--tile-text-shadow);line-height:1;position:relative;z-index:1}.tile-points{position:absolute;bottom:clamp(1px,.3vw,3px);right:clamp(2px,.5vw,5px);font-size:9px;font-weight:600;color:var(--tile-points);text-shadow:0 1px 1px rgba(255,255,255,.25);z-index:1}.tile-value .selected-op{color:var(--tile-text);font-weight:700}.tile.committed .tile-value .selected-op,.tile.last-committed .tile-value .selected-op{color:var(--tile-committed-text)}.tile-value .unselected-op{color:#5a466e59;font-size:.75em;vertical-align:middle}.tile-value .op-separator.unselected-op{color:#5a466e4d}.tile.committed .tile-value .unselected-op{color:#4c3c6ca6;font-size:.55em;vertical-align:middle}.tile.committed .tile-value .op-separator{color:#4c3c6c80}.tile-value span:not(.selected-op):not(.unselected-op):not(.op-separator){color:var(--tile-text);font-weight:700}.tile-value .op-separator{color:var(--tile-text);font-size:.7em;margin:0 1px}.tile.modal-tile .tile-value span:not(.selected-op):not(.unselected-op):not(.op-separator){color:var(--tile-text)}.tile.modal-tile .tile-value .op-separator{color:#2a241d59}.tile.selecting-value{z-index:1002;transform:translateY(-4px) scale(1.08)}.tile.tap-selected{z-index:30;transition:transform .08s ease-out,box-shadow .08s ease-out;box-shadow:0 0 0 3px rgba(var(--tile-selection-rgb),.9),0 0 6px rgba(var(--tile-selection-rgb),.25),0 4px 8px #0000004d;transform:translateY(-2px) scale(1.03)}.tile-small.tap-selected{z-index:30;transition:transform .08s ease-out,box-shadow .08s ease-out;box-shadow:0 0 0 2px rgba(var(--tile-selection-rgb),.9),0 0 4px rgba(var(--tile-selection-rgb),.22),0 3px 6px #0000004d;transform:scale(1.04)}.tile.board-selected{box-shadow:0 0 0 2px rgba(var(--tile-selection-rgb),.75),0 2px 4px #0006;transform:scale(1.02)}.tile-medium.exchange-selected{box-shadow:0 0 0 3px rgba(var(--tile-selection-rgb),.85),0 0 8px rgba(var(--tile-selection-rgb),.25),0 3px 6px #0006;transform:translateY(-2px) scale(1.02)}.tile--operator .tile-value{font-weight:800;transform:scale(1.07);text-shadow:0 1px 0 rgba(255,255,255,.18),0 -.5px 0 rgba(0,0,0,.15),.5px 0 0 rgba(0,0,0,.08),-.5px 0 0 rgba(0,0,0,.08),0 1px 2px rgba(0,0,0,.3)}.tile--operator.committed .tile-value,.tile--operator.last-committed .tile-value{font-weight:900;text-shadow:0 1px 0 rgba(255,255,255,.1),0 1px 2px rgba(0,0,0,.5)}.tile--operator.bingo-glow .tile-value{font-weight:900;text-shadow:0 1px 0 rgba(255,255,255,.4),0 .5px 1px rgba(0,0,0,.2)}.tile-small.tile-error{animation:tile-error-flash .4s ease-out}@keyframes tile-error-flash{0%{background:linear-gradient(160deg,#dc4545,#b83030);box-shadow:inset 0 1px #ffffff40,0 0 12px #dc3c3c99,0 2px 4px #0006}50%{background:linear-gradient(160deg,#e55555,#c84040);box-shadow:inset 0 1px #ffffff4d,0 0 16px #e65050b3,0 2px 4px #0006}to{background:var(--tile-bg-gradient);box-shadow:inset 0 1px #fff6,0 2px 4px #0006,0 3px 6px #0003}}.tile-small.tile-error .tile-value{animation:tile-error-text .4s ease-out}@keyframes tile-error-text{0%,50%{color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.5)}to{color:var(--tile-text);text-shadow:var(--tile-text-shadow)}}.board-container{--selection-color: 184, 146, 58;--drop-hover-outline-width: 2px;--drop-hover-outline-opacity: .85;--drop-hover-glow-opacity: .3;--drop-hover-inner-glow-opacity: .15;--cell-text-muted: rgba(232, 224, 208, .82);--cell-size: calc(var(--board-size, 300px) * .89 / 15);--cell-gap: calc(var(--cell-size) * .028);--cell-radius: calc(var(--cell-size) * .18);--grid-size: calc(15 * (var(--cell-size) + (var(--cell-gap) * 2)));--board-radius: calc(var(--board-size, 300px) * .06);--board-inner-radius: calc(var(--board-radius) * .82);--cell-surface: linear-gradient( 160deg, rgba(58, 48, 75, .96) 0%, rgba(48, 38, 62, .98) 100% );--cell-surface-dark: linear-gradient( 160deg, rgba(58, 48, 75, .96) 0%, rgba(48, 38, 62, .98) 100% );--grid-shadow: transparent;--grid-border-opacity: 0;--grid-ring-strength: 0;--bonus-rim-opacity: .32;--bonus-glow-opacity: .25;--cell-inset-highlight: rgba(255, 255, 255, .04);--cell-inset-carved: rgba(0, 0, 0, .28);--cell-inset-depth: rgba(0, 0, 0, .72);--cell-inset-bottom-light: rgba(255, 255, 255, .09);--cell-grid-ring: none;--tile-pop-shadow-opacity: .45;--tile-pop-rim-opacity: .18;display:flex;justify-content:center;align-items:center;width:var(--board-size, 300px);height:var(--board-size, 300px);background:url(/board-frame.png) center/100% 100% no-repeat;border-radius:var(--board-radius);box-shadow:0 16px 30px #0009,0 0 0 1px #ffd6961a;position:relative;touch-action:manipulation}.board-container:before{content:"";position:absolute;inset:calc((var(--board-size, 300px) - var(--grid-size)) / 2);border-radius:var(--board-inner-radius);background:radial-gradient(circle at 50% 50%,rgba(255,255,255,.04) 0%,rgba(255,255,255,.02) 30%,transparent 50%,rgba(0,0,0,.06) 80%,rgba(0,0,0,.1) 100%),radial-gradient(circle at 50% 35%,#785a961a,#1a122647 60%),linear-gradient(180deg,#22183233,#120c1a47);box-shadow:inset 0 2px 3px #ffffff0f,inset 0 -8px 12px #00000038;pointer-events:none;z-index:0}.board-container.selecting-value{position:relative;z-index:1001;pointer-events:none}.board{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;z-index:1}.board-inner{inset:calc((var(--board-size, 300px) - var(--grid-size)) / 2);display:flex;flex-direction:column;justify-content:center;align-items:center;position:absolute;border-radius:var(--board-inner-radius);background:radial-gradient(circle at 50% 50%,transparent 40%,rgba(0,0,0,.18) 100%),linear-gradient(180deg,#1e162afa,#161020fc);box-shadow:inset 0 1px 2px #ffffff1f,inset 0 -4px 8px #00000040}.board-row{display:flex}.board-row .cell{box-shadow:inset 0 2px 4px var(--cell-inset-depth),inset 1px 0 3px #0006,inset 0 -1px 1px var(--cell-inset-bottom-light)}.cell{position:relative;z-index:0;isolation:isolate;width:var(--cell-size);height:var(--cell-size);display:flex;align-items:center;justify-content:center;margin:var(--cell-gap);border-radius:var(--cell-radius);font-size:calc(var(--cell-size) * .28);font-weight:700;color:var(--cell-text-muted);text-shadow:0 1px 2px rgba(0,0,0,.65);background:var(--cell-surface);border:none;box-shadow:inset 0 2px 4px var(--cell-inset-depth),inset 1px 0 3px #0006,inset 0 -1px 1px var(--cell-inset-bottom-light);transition:transform .15s ease,box-shadow .15s ease,background .15s ease;transform:translateZ(0);-webkit-transform:translateZ(0)}.cell.has-tile{z-index:3}.cell.cell-outline{z-index:8}.cell.normal{background:var(--cell-surface-dark)}.cell.double-piece{--bonus-color: 215, 120, 55;background:linear-gradient(160deg,rgba(var(--bonus-color),.92),#af5828f0);color:#fff5e69e;box-shadow:inset 0 2px 5px #0000007a,inset 1px 0 3px #00000059,inset 0 -1px 1px #ffc8a029}.cell.triple-piece{--bonus-color: 155, 130, 200;background:linear-gradient(160deg,rgba(var(--bonus-color),.94),#7d64aaf5);color:#f0ebffa3;box-shadow:inset 0 2px 5px #0000007a,inset 1px 0 3px #00000059,inset 0 -1px 1px #c8b4f02e}.cell.double-equation{--bonus-color: 225, 180, 70;background:linear-gradient(160deg,rgba(var(--bonus-color),.92),#b99134f0);color:#fffaeb9e;box-shadow:inset 0 2px 5px #0000007a,inset 1px 0 3px #00000059,inset 0 -1px 1px #ffe6aa29}.cell.triple-equation{--bonus-color: 145, 62, 78;background:linear-gradient(160deg,rgba(var(--bonus-color),.95),#692d3af7);color:#ffe1e6ad;box-shadow:inset 0 2px 5px #00000085,inset 1px 0 3px #0006,inset 0 -1px 1px #ffb4be29}.cell.triple-equation.corner-tl{border-top-left-radius:calc(var(--cell-radius) * 1.8)}.cell.triple-equation.corner-tr{border-top-right-radius:calc(var(--cell-radius) * 1.8)}.cell.triple-equation.corner-bl{border-bottom-left-radius:calc(var(--cell-radius) * 1.8)}.cell.triple-equation.corner-br{border-bottom-right-radius:calc(var(--cell-radius) * 1.8)}.cell.center{position:relative;z-index:2;background:radial-gradient(circle at 50% 35%,#d2b078b3,#785228d9 65%,#4c3218f2);color:#ffeecce6;box-shadow:inset 0 2px 6px #000000a6,inset 2px 0 4px #0006,inset 0 -1px 2px #ffc87826,inset 0 0 14px #d4a84b4d,0 0 10px #d4a84b47,0 0 18px #d4a84b29;animation:center-cell-pulse 3s ease-in-out infinite}@keyframes center-cell-pulse{0%,to{box-shadow:inset 0 2px 6px #000000a6,inset 2px 0 4px #0006,inset 0 -1px 2px #ffc87826,inset 0 0 14px #d4a84b4d,0 0 10px #d4a84b47,0 0 18px #d4a84b29}50%{box-shadow:inset 0 2px 6px #000000a6,inset 2px 0 4px #0006,inset 0 -1px 2px #ffc87826,inset 0 0 18px #d4a84b66,0 0 14px #d4a84b59,0 0 24px #d4a84b38}}.cell.center.has-tile{background:radial-gradient(circle at 50% 35%,#ba98608c,#624422cc 65%,#402c16eb);box-shadow:inset 0 2px 6px #000000ad,inset 2px 0 4px #0006,inset 0 -1px 2px #ffc87814;animation:none}.cell.center .cell-label{font-family:Cinzel,Times New Roman,serif;font-size:calc(var(--cell-size) * .62);font-weight:800;color:#fff4d6fa;text-shadow:0 1px 2px rgba(0,0,0,.65),0 0 8px rgba(255,212,128,.6)}.cell-center-icon{width:calc(var(--cell-size) * .58);height:calc(var(--cell-size) * .58);color:#ffebb6fa;filter:drop-shadow(0 1px 2px rgba(0,0,0,.6)) drop-shadow(0 0 10px rgba(255,210,130,.65))}.cell.drag-over{outline:var(--drop-hover-outline-width) solid rgba(var(--selection-color),var(--drop-hover-outline-opacity));outline-offset:calc(var(--drop-hover-outline-width) * -1);box-shadow:inset 0 2px 4px var(--cell-inset-depth),inset 2px 0 3px #0006,inset 0 -1px 1px var(--cell-inset-bottom-light),0 0 8px rgba(224,192,104,var(--drop-hover-glow-opacity))}.cell.drag-over:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;background:radial-gradient(circle at 50% 50%,rgba(224,192,104,var(--drop-hover-inner-glow-opacity)),transparent 70%);box-shadow:inset 0 0 6px rgba(224,192,104,calc(var(--drop-hover-inner-glow-opacity) * .8));pointer-events:none;z-index:1}.cell.selected{position:relative;outline:3px solid rgba(var(--selection-color),.95);outline-offset:-3px;box-shadow:0 0 12px rgba(var(--selection-color),.35),inset 0 1px 2px #ffffff1a}.cell.selecting-value{z-index:1002;position:relative}.cell.has-tap-selected{z-index:10}.cell-label{position:relative;z-index:2;font-size:calc(var(--cell-size) * .3);font-weight:800;letter-spacing:.4px;text-transform:uppercase}.board-container.is-crowded{--grid-ring-strength: .9;--bonus-glow-opacity: .1;--tile-pop-shadow-opacity: .35;--cell-text-muted: rgba(232, 224, 208, .82);--cell-inset-depth: rgba(0, 0, 0, .38)}.board-container.is-crowded:before{opacity:.65}.equation-outlines{position:absolute;top:0;left:0;right:0;bottom:0;pointer-events:none}.equation-outline{position:absolute;--cell-margin: var(--cell-gap);--cell-total: calc(var(--cell-size) + var(--cell-margin) * 2);--board-padding: calc((var(--board-size) - var(--cell-total) * 15) / 2);--outline-width: calc(var(--cell-margin) * 5);--tile-overlap: max(0px, calc(var(--cell-gap, 0px) + 5px));top:calc(var(--board-padding) + var(--start-row) * var(--cell-total) - var(--tile-overlap) * .5);left:calc(var(--board-padding) + var(--start-col) * var(--cell-total) - var(--tile-overlap) * .5);width:calc(var(--span-cols) * var(--cell-total) + var(--tile-overlap));height:calc(var(--span-rows) * var(--cell-total) + var(--tile-overlap));border-radius:calc(var(--cell-size) * .15);box-shadow:inset 0 0 0 var(--outline-width) rgb(var(--outline-color, 236, 72, 153))}.total-score-badge{position:absolute;z-index:20;--cell-margin: var(--cell-gap);--cell-total: calc(var(--cell-size) + var(--cell-margin) * 2);--board-padding: calc((var(--board-size) - var(--cell-total) * 15) / 2);--tile-overlap: max(0px, calc(var(--cell-gap, 0px) + 5px));top:calc(var(--board-padding) + var(--badge-row) * var(--cell-total) - var(--tile-overlap) * .5);left:calc(var(--board-padding) + (var(--badge-col) + 1) * var(--cell-total) + var(--tile-overlap) * .5);--clamp-x: 0px;--clamp-y: 0px;transform:translate(calc(-50% + var(--clamp-x)),calc(-50% + var(--clamp-y)));background:rgb(var(--outline-color, 236, 72, 153));color:#fff;font-size:clamp(9px,calc(var(--cell-size) * .24),14px);font-weight:700;padding:clamp(2px,calc(var(--cell-size) * .07),4px) clamp(5px,calc(var(--cell-size) * .18),10px);border-radius:999px;white-space:nowrap;box-shadow:0 2px 4px #0000004d}.total-score-badge.bingo{background:linear-gradient(135deg,#f0e0c0,#d4b87a,#c9a55a 60%,#b8923a);color:#3a2818;font-weight:800;text-transform:uppercase;letter-spacing:.5px;border:1px solid rgba(184,146,58,.7);box-shadow:0 2px 4px #00000059,0 0 8px #d4b87a80,0 0 16px #b8923a4d}.total-score-badge.bingo:after{content:"";position:absolute;top:-3px;right:-3px;bottom:-3px;left:-3px;border-radius:inherit;background:transparent;box-shadow:0 0 10px #f0e0c0b3,0 0 20px #d4b87a80;opacity:0;animation:badge-glow-pulse 2s ease-in-out infinite;pointer-events:none;z-index:-1}@keyframes badge-glow-pulse{0%,to{opacity:0}50%{opacity:1}}.board-zoom-wrapper{width:100%;height:100%;overflow:hidden;touch-action:none;position:relative}.board-zoom-wrapper:not(.ready) .board-zoom-content{opacity:0}.board-zoom-wrapper.ready .board-zoom-content{animation:board-fade-in .25s ease-out forwards}@keyframes board-fade-in{0%{opacity:0}to{opacity:1}}.board-zoom-content{will-change:transform}.rack-tray{background:radial-gradient(ellipse at 50% 18%,rgba(255,222,166,.18),transparent 62%),linear-gradient(180deg,#46261652,#1a0e0a9e),url(/wood-background.png) center/200% 200% no-repeat;border-radius:20px;border:none;outline:1px solid rgba(212,168,75,.18);outline-offset:0;box-shadow:0 8px 16px #00000080,inset 0 1px 1px #ffffff1f,inset 0 -2px 4px #0000004d;padding:0 8px;position:relative;isolation:isolate}.rack-tray>*{position:relative;z-index:1}.rack-face-down{width:calc(var(--rack-tile-size) - 2px);height:calc(var(--rack-tile-size) - 2px);border-radius:calc(var(--rack-tile-size) * .15);position:relative;overflow:hidden;background:linear-gradient(165deg,#372d48f5,#282037fa);border:1px solid rgba(255,255,255,.15);box-shadow:inset 1px 1px #ffffff14,inset -1px -1px 2px #00000059,inset 0 2px 4px #00000080,0 2px 4px #00000059;display:flex;align-items:center;justify-content:center}.rack-face-down-logo{font-family:Cinzel,Times New Roman,serif;font-size:calc(var(--rack-tile-size) * .34);font-weight:800;color:#e8e0d08c;text-shadow:0 1px 2px rgba(0,0,0,.5);-webkit-user-select:none;user-select:none}.rack-face-down:before{content:"";position:absolute;top:6%;right:6%;bottom:6%;left:6%;border-radius:calc(var(--rack-tile-size) * .14);border:1px solid rgba(255,255,255,.08);box-shadow:inset 0 1px 1px #ffffff1a;opacity:.5;pointer-events:none}.rack-face-down:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;background:linear-gradient(180deg,#ffffff26,#fff0 50%);opacity:.45;pointer-events:none}.rack-thinking-flex .rack-face-down:nth-child(1){animation:opponent-tile-shuffle-2 1s ease-in-out infinite}.rack-thinking-flex .rack-face-down:nth-child(2){animation:opponent-tile-shuffle-1 1s ease-in-out infinite .12s}.rack-thinking-flex .rack-face-down:nth-child(3){animation:opponent-tile-shuffle-3 1s ease-in-out infinite .06s}.rack-thinking-flex .rack-face-down:nth-child(4){animation:opponent-tile-shuffle-1 1s ease-in-out infinite .18s}.rack-thinking-flex .rack-face-down:nth-child(5){animation:opponent-tile-shuffle-2 1s ease-in-out infinite .1s}.rack-thinking-flex .rack-face-down:nth-child(6){animation:opponent-tile-shuffle-3 1s ease-in-out infinite .15s}.rack-thinking-flex .rack-face-down:nth-child(7){animation:opponent-tile-shuffle-1 1s ease-in-out infinite .04s}.rack-thinking-flex .rack-face-down:nth-child(8){animation:opponent-tile-shuffle-2 1s ease-in-out infinite .22s}.rack-tray.rack-exchange-mode{box-shadow:0 10px 20px #0009,0 0 0 2px #d4a84b99}.game-footer-shelf{background:radial-gradient(ellipse at 50% 10%,rgba(255,255,255,.12),transparent 62%),radial-gradient(ellipse at 50% 115%,rgba(0,0,0,.35),transparent 65%),linear-gradient(180deg,#2e203edb,#140c20e6);border-radius:18px 18px 0 0;border-top:1px solid rgba(212,168,75,.25);box-shadow:inset 0 1px 1px #ffffff14,0 -4px 12px #00000059}.rack-icon-btn{display:grid;place-items:center;width:clamp(44px,10vw,48px);height:clamp(44px,10vw,48px);font-size:clamp(18px,4.5vw,22px);justify-self:center;align-self:center;background:transparent;border:none;box-shadow:none;color:#ffffffbf}@media (hover: hover){.rack-icon-btn:hover:not(:disabled){color:#fffffff2}}.submit-btn{--btn-edge: calc(var(--rack-tile-size, 60px) * .07);text-shadow:0 1px 2px rgba(0,0,0,.4)}.submit-variant-primary{background:linear-gradient(180deg,#5f2db6,#35156f);border:1px solid rgba(255,255,255,.2);box-shadow:0 var(--btn-edge) 0 #2d0f60,0 calc(var(--btn-edge) * 3) calc(var(--btn-edge) * 4) #00000073}.submit-variant-pass{background:linear-gradient(180deg,#be733f,#8f4f26);border:1px solid rgba(233,198,164,.32);box-shadow:0 var(--btn-edge) 0 #7b3d1c,0 calc(var(--btn-edge) * 3) calc(var(--btn-edge) * 4) #00000073}.submit-variant-success{background:linear-gradient(180deg,#33a160,#1a6e43);border:1px solid rgba(200,255,220,.3);box-shadow:0 var(--btn-edge) 0 #105b34,0 calc(var(--btn-edge) * 3) calc(var(--btn-edge) * 4) #00000073}.submit-variant-go{background:linear-gradient(180deg,#d4a84b,#a67c30);border:1px solid rgba(255,230,180,.4);box-shadow:0 var(--btn-edge) 0 #7a5820,0 calc(var(--btn-edge) * 3) calc(var(--btn-edge) * 4) #00000073,0 0 12px #d4a84b40}.submit-variant-waiting{background:linear-gradient(180deg,#4b535f,#2a2f38);border:1px solid rgba(255,255,255,.18);box-shadow:0 var(--btn-edge) 0 #1f232b,0 calc(var(--btn-edge) * 3) calc(var(--btn-edge) * 4) #0006}.submit-btn:disabled{opacity:.5;cursor:not-allowed;filter:grayscale(.3);box-shadow:0 calc(var(--btn-edge) * .5) 0 #0000004d,0 var(--btn-edge) calc(var(--btn-edge) * 2) #00000040}.submit-btn:disabled:active{transform:none}@keyframes tile-jump-2{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-18px) rotate(4deg)}}@keyframes tile-jump-3{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-10px) rotate(-2deg)}}.rack-shuffle [data-rack-slot="0"]{animation:tile-jump-2 .25s ease-out}.rack-shuffle [data-rack-slot="1"]{animation:tile-jump-1 .25s ease-out 20ms}.rack-shuffle [data-rack-slot="2"]{animation:tile-jump-3 .25s ease-out}.rack-shuffle [data-rack-slot="3"]{animation:tile-jump-1 .25s ease-out 30ms}.rack-shuffle [data-rack-slot="4"]{animation:tile-jump-2 .25s ease-out 10ms}.rack-shuffle [data-rack-slot="5"]{animation:tile-jump-3 .25s ease-out 25ms}.rack-shuffle [data-rack-slot="6"]{animation:tile-jump-1 .25s ease-out}.rack-shuffle [data-rack-slot="7"]{animation:tile-jump-2 .25s ease-out 15ms}@media (hover: hover){.submit-btn:hover:not(:disabled){transform:translateY(-2px);filter:brightness(1.05)}}@keyframes tile-pop{0%{transform:scale(.7);opacity:.5}50%{transform:scale(1.1)}to{transform:scale(1);opacity:1}}.tile-new{animation:tile-pop .3s ease-out}.rack-tray .tile-new{box-shadow:0 0 8px 2px #ffdc6499,0 0 4px 1px #ffdc64cc}.opponent-rack{height:calc(var(--rack-height) * .9);width:calc(8 * (var(--rack-tile-size) - 2px) + 7 * 1px + 16px);max-width:100%;margin:0 auto;display:inline-flex;justify-content:center;align-items:center;gap:1px;padding:0 8px;border-radius:20px;outline:1px solid rgba(212,168,75,.18);outline-offset:0;background:radial-gradient(ellipse at 50% 18%,rgba(255,222,166,.16),transparent 62%),linear-gradient(180deg,#46261652,#1a0e0a9e),url(/wood-background.png) center/200% 200% no-repeat;box-shadow:inset 0 1px 1px #ffffff1f,inset 0 -2px 4px #0000004d;position:relative}.opponent-rack .tile-medium{--edge-size: 0px;box-shadow:inset 0 1px #fff6,0 2px 4px #0006,0 3px 6px #0003;pointer-events:none;cursor:default}.opponent-rack.game-over .tile-medium{transform:translateY(-3px)}.opponent-rack .tile-new{animation:tile-pop .3s ease-out}.opponent-rack .tile-new .tile-medium{box-shadow:inset 0 1px #fff6,0 2px 4px #0006,0 3px 6px #0003,0 0 8px 2px #ffdc6499,0 0 4px 1px #ffdc64cc}@keyframes tile-pop{0%{transform:scale(.8);opacity:0}50%{transform:scale(1.05)}to{transform:scale(1);opacity:1}}.opponent-tile{width:calc(var(--rack-tile-size) - 2px);height:calc(var(--rack-tile-size) - 2px);border-radius:calc(var(--rack-tile-size) * .15);position:relative;overflow:hidden;background:linear-gradient(165deg,#372d48f5,#282037fa);border:1px solid rgba(255,255,255,.15);box-shadow:inset 0 1px 1px #ffffff14,inset 0 -2px 3px #00000073;display:flex;align-items:center;justify-content:center}.opponent-tile-logo{font-family:Cinzel,Times New Roman,serif;font-size:calc(var(--rack-tile-size) * .34);font-weight:800;color:#e8e0d08c;text-shadow:0 1px 2px rgba(0,0,0,.5);-webkit-user-select:none;user-select:none}.opponent-tile:before{content:"";position:absolute;top:6%;right:6%;bottom:6%;left:6%;border-radius:calc(var(--rack-tile-size) * .14);border:1px solid rgba(255,255,255,.08);box-shadow:inset 0 1px 1px #ffffff1a;opacity:.5;pointer-events:none}.opponent-tile:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;background:linear-gradient(180deg,#ffffff26,#fff0 50%);opacity:.45;pointer-events:none}@keyframes opponent-tile-shuffle-1{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-4px) rotate(-1.5deg)}}@keyframes opponent-tile-shuffle-2{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-6px) rotate(2deg)}}@keyframes opponent-tile-shuffle-3{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-3px) rotate(-.5deg)}}.opponent-rack.thinking .opponent-tile:nth-child(1){animation:opponent-tile-shuffle-2 1s ease-in-out infinite}.opponent-rack.thinking .opponent-tile:nth-child(2){animation:opponent-tile-shuffle-1 1s ease-in-out infinite .12s}.opponent-rack.thinking .opponent-tile:nth-child(3){animation:opponent-tile-shuffle-3 1s ease-in-out infinite .06s}.opponent-rack.thinking .opponent-tile:nth-child(4){animation:opponent-tile-shuffle-1 1s ease-in-out infinite .18s}.opponent-rack.thinking .opponent-tile:nth-child(5){animation:opponent-tile-shuffle-2 1s ease-in-out infinite .1s}.opponent-rack.thinking .opponent-tile:nth-child(6){animation:opponent-tile-shuffle-3 1s ease-in-out infinite .15s}.opponent-rack.thinking .opponent-tile:nth-child(7){animation:opponent-tile-shuffle-1 1s ease-in-out infinite .04s}.opponent-rack.thinking .opponent-tile:nth-child(8){animation:opponent-tile-shuffle-2 1s ease-in-out infinite .22s}.thinking-fallback{position:absolute;bottom:-18px;left:50%;transform:translate(-50%);font-size:11px;font-weight:500;color:#ffffff73;white-space:nowrap;animation:thinking-fade-in .28s cubic-bezier(.32,.72,0,1)}@keyframes thinking-fade-in{0%{opacity:0}to{opacity:1}}.debug-panel-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:10000;animation:debug-fade-in .15s ease-out}@keyframes debug-fade-in{0%{opacity:0}to{opacity:1}}.debug-panel{background:linear-gradient(180deg,#1e1e32fa,#141428fc);border:1px solid rgba(255,255,255,.15);border-radius:16px;padding:20px;min-width:240px;box-shadow:0 20px 60px #00000080;animation:debug-scale-in .15s ease-out}@keyframes debug-scale-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.debug-panel-title{font-size:16px;font-weight:600;color:#ffffffe6;margin-bottom:16px;text-align:center}.debug-option{display:flex;align-items:center;gap:10px;color:#ffffffd9;font-size:14px;margin-bottom:12px;cursor:pointer;-webkit-user-select:none;user-select:none}.debug-option input[type=checkbox]{width:18px;height:18px;accent-color:var(--won-gold, #d4a84b);cursor:pointer}.debug-select{width:calc(100% - 28px);margin-left:28px;margin-bottom:16px;padding:8px 12px;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:8px;color:#fff;font-size:14px;cursor:pointer}.debug-buttons{display:flex;gap:10px;margin-top:16px}.debug-cancel-btn{flex:1;padding:10px;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:8px;color:#ffffffb3;font-weight:600;cursor:pointer;transition:background .15s ease}.debug-confirm-btn{flex:1;padding:10px;background:#d4a84b33;border:1px solid rgba(212,168,75,.4);border-radius:8px;color:var(--won-gold, #d4a84b);font-weight:600;cursor:pointer;transition:background .15s ease,opacity .15s ease}.debug-confirm-btn:disabled{opacity:.4;cursor:not-allowed}@media (hover: hover){.debug-cancel-btn:hover{background:#ffffff26}.debug-confirm-btn:hover:not(:disabled){background:#d4a84b4d}}.game-over-overlay{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#000000d9;z-index:1000;animation:overlay-fade-in .3s ease-out}@keyframes overlay-fade-in{0%{opacity:0}to{opacity:1}}.game-over-content{position:relative;display:flex;flex-direction:column;align-items:center;gap:clamp(12px,3vw,20px);padding:clamp(20px,5vw,32px);background:linear-gradient(180deg,#2c2242f5,#181226fa);border:1px solid rgba(212,168,75,.22);border-radius:clamp(12px,3vw,20px);box-shadow:0 25px 50px #00000080,0 0 30px #d4a84b1f;min-width:clamp(200px,60vw,280px);animation:content-scale-in .35s cubic-bezier(.34,1.56,.64,1)}@keyframes content-scale-in{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.game-over-close{position:absolute;top:8px;right:8px;display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:none;border-radius:50%;background:#d4a84b26;color:#e9d296d9;cursor:pointer;transition:all .15s ease}@media (hover: hover){.game-over-close:hover{background:#d4a84b4d;color:#fff8e6f2}}.game-over-logo-wrap{position:relative;display:flex;align-items:center;justify-content:center}.game-over-logo-wrap.winner:before{content:"";position:absolute;width:140%;height:140%;border-radius:50%;background:radial-gradient(circle,rgba(212,168,75,.25) 0%,transparent 65%);pointer-events:none}.game-over-logo{position:relative;width:clamp(88px,28vw,120px);height:auto;object-fit:contain;filter:drop-shadow(0 4px 12px rgba(0,0,0,.4))}.game-over-logo.loser{filter:drop-shadow(0 4px 12px rgba(0,0,0,.4)) brightness(.7) saturate(.5)}.game-over-logo.draw{filter:drop-shadow(0 4px 12px rgba(0,0,0,.4)) drop-shadow(0 0 16px rgba(167,139,250,.3))}.game-over-title{font-size:clamp(20px,5vw,28px);font-weight:700;color:#fff;margin:0;text-align:center}.game-over-body{display:flex;flex-direction:column;align-items:stretch;gap:clamp(12px,3vw,20px)}.game-over-scores{display:flex;gap:clamp(12px,3vw,20px)}.score-card{display:flex;flex-direction:column;align-items:center;gap:clamp(4px,1vw,6px);padding:clamp(10px,2.5vw,16px) clamp(16px,4vw,24px);background:#523e7624;border:1px solid rgba(212,168,75,.18);border-radius:clamp(8px,2vw,12px);flex:1;min-width:0}.score-card.winner{background:linear-gradient(180deg,#d4a84b1f,#b8923a14);border-color:#d4a84b59}.score-card.loser{background:#5050641a;border-color:#64647833;opacity:.85}.score-card.timed-out{background:linear-gradient(180deg,#f8717126,#ef44441a);border-color:#f8717166}.score-card.timed-out .score-icon{color:#f87171}.score-card.timed-out .score-value{color:#fca5a5}.score-icon{width:clamp(16px,4vw,20px);height:clamp(16px,4vw,20px);color:#dccdf0bf}.score-avatar{width:clamp(32px,8vw,40px);height:clamp(32px,8vw,40px);border-radius:22%;object-fit:cover;border:1.5px solid rgba(255,255,255,.2);box-shadow:0 2px 6px #0000004d}.score-card.winner .score-icon{color:var(--won-gold, #d4a84b)}.score-card.loser .score-icon{color:#9696aa99}.score-label{font-size:clamp(10px,2.5vw,12px);font-weight:500;color:#dccdf0bf;text-transform:uppercase;letter-spacing:.5px}.score-value{font-size:clamp(24px,6vw,32px);font-weight:700;color:#fff;font-variant-numeric:tabular-nums}.score-card.winner .score-value{color:var(--won-gold-light, #e0c068)}.score-card.loser .score-value{color:#b4b4c8b3}.score-breakdown{display:flex;flex-direction:column;align-items:center;gap:2px}.score-calc{font-size:clamp(11px,2.8vw,13px);color:#dccdf099;font-weight:500}.penalty-deduct{color:#f87171}.bonus-add,.opponent-ref{color:#4ade80}.timeout-penalty{font-size:clamp(12px,3vw,14px);font-weight:600;color:#f87171;background:#f8717126;padding:2px 6px;border-radius:4px}.timeout-badge{font-size:clamp(10px,2.5vw,12px);font-weight:600;color:#f87171;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap}.game-over-buttons{display:flex;flex-direction:column;gap:clamp(8px,2vw,12px);width:100%}.play-again-btn{display:flex;align-items:center;justify-content:center;gap:clamp(6px,1.5vw,10px);width:100%;padding:clamp(10px,2.5vw,14px) clamp(24px,6vw,36px);background:linear-gradient(180deg,#22c55ef2,#16a34afa);border:1px solid rgba(134,239,172,.3);border-radius:clamp(8px,2vw,12px);color:#fff;font-size:clamp(14px,3.5vw,16px);font-weight:600;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 15px #22c55e4d;outline:1px solid rgba(212,168,75,.2);outline-offset:0}@media (hover: hover){.play-again-btn:hover{background:linear-gradient(180deg,#4ade80fa,#22c55e);transform:translateY(-2px);box-shadow:0 6px 20px #22c55e66}}.play-again-btn:active{transform:translateY(0)}.home-btn{display:flex;align-items:center;justify-content:center;gap:clamp(6px,1.5vw,10px);padding:clamp(10px,2.5vw,14px) clamp(24px,6vw,36px);background:#d4a84b1f;border:1px solid rgba(212,168,75,.25);border-radius:clamp(8px,2vw,12px);color:#e9d296f2;font-size:clamp(14px,3.5vw,16px);font-weight:600;cursor:pointer;transition:all .2s ease}@media (hover: hover){.home-btn:hover{background:#d4a84b38;color:#fff8e6fa}}.home-btn:active{transform:scale(.98)}.game-over-buttons-row{display:flex;align-items:stretch;gap:clamp(8px,2vw,12px);width:100%}.game-over-buttons-row .home-btn,.game-over-buttons-row .share-btn{flex:1}.game-over-buttons-row .share-btn{display:flex;align-items:center;justify-content:center;gap:clamp(6px,1.5vw,10px);width:auto;height:auto;padding:clamp(10px,2.5vw,14px) clamp(24px,6vw,36px);background:#8b5cf61f;border:1px solid rgba(139,92,246,.5);border-radius:clamp(8px,2vw,12px);color:#c4b5fdf2;font-size:clamp(14px,3.5vw,16px);font-weight:600;cursor:pointer;transition:all .2s ease}@media (hover: hover){.game-over-buttons-row .share-btn:hover{background:#8b5cf640;color:#ddd6fefa}}.game-over-buttons-row .share-btn:active{transform:scale(.98)}.game-header{width:100%;display:flex;flex-direction:column;background:transparent;padding:clamp(4px,1vw,8px) clamp(6px,1.5vw,12px) 0}.header-row.header-nav{height:var(--header-height, 44px);padding:0 clamp(4px,1vw,8px);display:flex;align-items:center;justify-content:space-between;gap:clamp(8px,2vw,12px);width:100%}.header-row.header-nav>.header-icon-btn:first-child{padding-left:0}.header-row.header-nav>.header-icon-btn:last-child{padding-right:0}.header-icon-btn{display:flex;align-items:center;justify-content:center;flex-shrink:0;height:100%;aspect-ratio:1;background:transparent;border:none;color:#ffffffeb;border-radius:999px;cursor:pointer;transition:all .15s ease;box-shadow:none}@media (hover: hover){.header-icon-btn:hover{color:#fffffffa}}.header-icon-btn:active{transform:scale(.95)}.header-icon-btn svg{width:clamp(20px,5vw,28px);height:clamp(20px,5vw,28px)}.turn-indicator{flex:1;display:flex;align-items:center;justify-content:center;height:70%;padding:0 clamp(10px,2.5vw,16px);background:linear-gradient(180deg,#462c6acc,#1a0e2edb);border-radius:999px;border:1px solid rgba(212,168,75,.24);box-shadow:inset 0 1px 1px #ffffff14,0 3px 8px #0006;color:#ffffffeb;font-family:Cinzel,Times New Roman,serif;font-size:clamp(12px,3vw,15px);font-weight:600;text-shadow:0 1px 2px rgba(0,0,0,.6);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:all var(--won-duration-normal, .18s) var(--won-ease, ease)}.turn-indicator-text{display:flex;align-items:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.turn-indicator-icon{width:.95em;height:.95em;margin-left:5px;color:#ffe6a6f2;filter:drop-shadow(0 1px 2px rgba(0,0,0,.6))}.turn-indicator-player{background:linear-gradient(180deg,rgba(var(--indicator-rgb),.22),#201236eb);color:#fffffff5;border:1px solid rgba(var(--indicator-rgb),.3);box-shadow:inset 0 1px 1px #ffffff1f,0 0 8px rgba(var(--indicator-rgb),.12)}.turn-indicator-opponent{background:linear-gradient(180deg,rgba(var(--indicator-rgb),.2),#1c1030e6);color:#ffffffe6;border:1px solid rgba(var(--indicator-rgb),.28);box-shadow:inset 0 1px 1px #ffffff1f,0 0 6px rgba(var(--indicator-rgb),.1)}.turn-indicator-disconnect{background:linear-gradient(180deg,#ef444433,#1c1030e6);color:#ef4444;border:1px solid rgba(239,68,68,.35);box-shadow:inset 0 1px 1px #ffffff14,0 0 6px #ef444426;animation:disconnect-pulse 2s ease-in-out infinite}@keyframes disconnect-pulse{0%,to{opacity:1}50%{opacity:.75}}.turn-indicator-neutral{color:#e0d9c9b3}.thinking-dots{display:inline-flex;margin-left:2px}.thinking-dots span{opacity:.3;animation:dot-fade 1.4s ease-in-out infinite}.thinking-dots span:nth-child(1){animation-delay:0s}.thinking-dots span:nth-child(2){animation-delay:.2s}.thinking-dots span:nth-child(3){animation-delay:.4s}@keyframes dot-fade{0%,80%,to{opacity:.3}40%{opacity:1}}.header-tile-bag{display:flex;align-items:center;justify-content:center;gap:clamp(2px,.5vw,4px);height:70%;padding:0 clamp(8px,2vw,12px);background:linear-gradient(180deg,#e6c173f2,#b17e36f2);border:1px solid rgba(255,243,214,.45);border-radius:999px;color:#281810f2;box-shadow:0 4px #8b5d21b3,0 10px 16px #00000059}.tile-bag-icon{width:clamp(14px,3vw,18px);height:clamp(14px,3vw,18px);opacity:.8}.tile-bag-count{font-size:clamp(13px,3vw,16px);font-weight:800;font-variant-numeric:tabular-nums}.tile-bag-label{font-size:clamp(8px,1.8vw,10px);font-weight:600;color:#50371ab3;text-transform:uppercase;letter-spacing:.5px}@media (max-width: 360px){.tile-bag-label{display:none}}.emote-picker-overlay{position:absolute;left:0;bottom:100%;margin-bottom:8px;z-index:100}.emote-picker{background:#1e1e23f2;border-radius:clamp(12px,3vw,16px);padding:clamp(8px,2vw,12px);box-shadow:0 8px 32px #0006;border:1px solid rgba(255,255,255,.1);animation:emote-picker-in .2s ease-out}@keyframes emote-picker-in{0%{opacity:0;transform:scale(.9) translateY(10px)}to{opacity:1;transform:scale(1) translateY(0)}}.emote-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(6px,1.5vw,8px)}.emote-btn{width:clamp(44px,11vw,56px);height:clamp(44px,11vw,56px);display:flex;align-items:center;justify-content:center;background:#ffffff14;border:none;border-radius:clamp(8px,2vw,12px);cursor:pointer;transition:transform .1s,background .15s;-webkit-tap-highlight-color:transparent}.emote-btn:active:not(.disabled){transform:scale(.92);background:#ffffff26}@media (hover: hover){.emote-btn:hover:not(.disabled){background:#ffffff1f}}.emote-btn.disabled{opacity:.4;cursor:not-allowed}.emote-emoji{font-size:clamp(22px,5.5vw,28px);line-height:1}.emote-cooldown{margin-top:8px;height:4px;background:#ffffff1a;border-radius:2px;overflow:hidden}.emote-cooldown-bar{height:100%;background:#ffc86499;border-radius:2px;transition:width .1s linear}.emote-anchor{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.emote-display{position:fixed;z-index:9999;pointer-events:none}.emote-display-player{animation:emote-pop-in-player .3s cubic-bezier(.34,1.56,.64,1)}.emote-display-opponent{animation:emote-pop-in-opponent .3s cubic-bezier(.34,1.56,.64,1)}.emote-bubble{position:relative;width:clamp(44px,11vw,56px);height:clamp(44px,11vw,56px);animation:emote-float 2.5s ease-in-out forwards}.emote-bubble-circle{position:absolute;top:0;right:0;bottom:0;left:0;background:#4b4b4b;border-radius:50%;box-shadow:0 2px 8px #0000004d}.emote-bubble-tail{position:absolute;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent}.emote-display-player .emote-bubble-tail{bottom:-4px;left:6px;border-top:16px solid #4B4B4B;transform:rotate(-40deg)}.emote-display-opponent .emote-bubble-tail{top:-4px;left:6px;border-bottom:16px solid #4B4B4B;transform:rotate(40deg)}.emote-bubble-content{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center}@keyframes emote-pop-in-player{0%{opacity:0;transform:scale(.3)}70%{transform:scale(1.1)}to{opacity:1;transform:scale(1)}}@keyframes emote-pop-in-opponent{0%{opacity:0;transform:scale(.3)}70%{transform:scale(1.1)}to{opacity:1;transform:scale(1)}}@keyframes emote-float{0%,70%{opacity:1}to{opacity:0}}.emote-display-lottie{width:clamp(28px,7vw,36px);height:clamp(28px,7vw,36px)}.emote-display-static{font-size:clamp(20px,5vw,26px);line-height:1}.player-panel{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:0 clamp(6px,1.5vw,10px);align-items:center;width:100%;height:var(--panel-height, 44px);padding:0 clamp(8px,2vw,12px);background:linear-gradient(180deg,#120d1aeb,#09070ef5);border-radius:clamp(12px,3vw,16px);box-shadow:0 8px 18px #00000073,inset 0 1px 1px #ffffff0d;border:1px solid rgba(255,255,255,.08);opacity:.9;transition:all .18s cubic-bezier(.32,.72,0,1)}.player-panel.active{opacity:1;border-color:#d4a84b8c;box-shadow:0 0 0 1px #d4a84b59,0 10px 22px #00000080,inset 0 1px 2px #ffffff14;background:linear-gradient(180deg,#181222fa,#0c0914fa)}.player-panel.winner{opacity:1;border-color:#d4a84bbf;box-shadow:0 8px 18px #00000073,0 0 0 2px #d4a84b99,0 0 28px #d4a84b40,inset 0 1px 1px #ffffff1f;animation:winner-reveal .5s cubic-bezier(.32,.72,0,1) forwards}@keyframes winner-reveal{0%{box-shadow:0 4px 16px #0006,0 0 0 1px #d4a84b4d,0 0 #d4a84b00,inset 0 1px #ffffff1a}50%{box-shadow:0 6px 20px #00000073,0 0 0 2px #d4a84bb3,0 0 35px #d4a84b59,inset 0 1px #ffffff1f}to{box-shadow:0 8px 18px #00000073,0 0 0 2px #d4a84b99,0 0 28px #d4a84b40,inset 0 1px #ffffff1f}}.player-panel.loser{opacity:.75}.player-panel.low-time{animation:panel-low-time-pulse 2s ease-in-out infinite}@keyframes panel-low-time-pulse{0%,to{border-color:#fbbf2480;box-shadow:0 4px 12px #00000080,0 0 8px #fbbf2426,inset 0 1px #ffffff1a}50%{border-color:#fbbf24b3;box-shadow:0 4px 12px #00000080,0 0 12px #fbbf2440,inset 0 1px #ffffff1a}}.panel-identity{display:flex;align-items:center;gap:clamp(4px,1vw,8px);min-width:0;overflow:hidden}.panel-avatar-wrapper{position:relative;flex-shrink:0;width:clamp(32px,8vw,38px);display:flex;align-items:center;justify-content:center;z-index:1}.panel-icon{width:clamp(16px,4vw,20px);height:clamp(16px,4vw,20px);color:#ffffffa6;flex-shrink:0}.panel-avatar{width:clamp(32px,8vw,38px);height:clamp(32px,8vw,38px);border-radius:22%;object-fit:cover;flex-shrink:0;border:1.5px solid rgba(255,255,255,.2);box-shadow:0 2px 4px #0000004d;transition:all .18s cubic-bezier(.32,.72,0,1)}.panel-status-dot{position:absolute;bottom:-1px;right:-1px;width:8px;height:8px;border-radius:50%;border:1.5px solid rgba(18,13,26,.95);z-index:1}.panel-status-dot.online{background:#22c55e;box-shadow:0 0 4px #22c55e80}.panel-status-dot.offline{background:#ef4444;box-shadow:0 0 4px #ef444480;animation:panel-dot-pulse 1.5s ease-in-out infinite}@keyframes panel-dot-pulse{0%,to{opacity:1}50%{opacity:.5}}.panel-avatar-wrapper:has(.panel-status-dot.offline) .panel-avatar,.panel-avatar-wrapper:has(.panel-status-dot.offline) .panel-icon{opacity:.5;filter:grayscale(30%)}.player-panel.active .panel-icon{color:#fffc}.player-panel.active .panel-avatar{border-color:#d4a84b80;box-shadow:0 2px 6px #0006,0 0 8px #d4a84b33}.player-panel.winner .panel-icon{color:#d4a84be6}.player-panel.loser .panel-icon{color:#ffffff80}.player-panel.winner .panel-avatar{border-color:#d4a84bbf;box-shadow:0 2px 8px #00000080,0 0 12px #d4a84b4d}.player-panel.loser .panel-avatar{opacity:.75;border-color:#ffffff26}.panel-name-row{display:flex;align-items:center;gap:clamp(3px,.8vw,5px);min-width:0;overflow:hidden}.panel-label{font-family:Inter,system-ui,sans-serif;font-size:clamp(11px,2.8vw,14px);font-weight:600;color:#ffffffbf;letter-spacing:.3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.panel-title-badge{font-size:clamp(8px,2vw,10px);font-weight:600;color:#d4a84bd9;background:#d4a84b1f;border:1px solid rgba(212,168,75,.2);padding:1px clamp(4px,1vw,6px);border-radius:4px;white-space:nowrap;flex-shrink:0;max-width:70px;overflow:hidden;text-overflow:ellipsis}.panel-title-badge.rarity-common{color:#b4bed2d9;background:#b4bed21f;border-color:#b4bed233}.panel-title-badge.rarity-uncommon{color:#64c882d9;background:#64c8821f;border-color:#64c88233}.panel-title-badge.rarity-rare{color:#64a0ffd9;background:#64a0ff1f;border-color:#64a0ff33}.panel-title-badge.rarity-epic{color:#b482dcd9;background:#b482dc1f;border-color:#b482dc33}.panel-title-badge.rarity-legendary{color:#d4a84bd9;background:#d4a84b1f;border-color:#d4a84b33}.panel-title-badge.rarity-hidden{color:#d4a84bf2;background:#d4a84b26;border-color:#d4a84b4d;box-shadow:0 0 8px #d4a84b4d}.player-panel.active .panel-label{color:#ffffffe6}.player-panel.winner .panel-label{color:#d4a84be6}.player-panel.loser .panel-label{color:#ffffff80}.panel-score{position:relative;display:flex;align-items:center;justify-content:center;justify-self:center}.score-value{font-family:Inter,system-ui,sans-serif;font-size:clamp(22px,5.6vw,30px);font-weight:800;color:#ffffffe6;line-height:1;font-variant-numeric:tabular-nums;transition:transform .24s cubic-bezier(.32,.72,0,1)}.score-value.score-pulse{animation:score-pulse .24s cubic-bezier(.32,.72,0,1) forwards}@keyframes score-pulse{0%{transform:scale(1);opacity:1}40%{transform:scale(1.04);opacity:.92}to{transform:scale(1);opacity:1}}.player-panel.active .score-value{color:#fffffffa;text-shadow:0 0 16px rgba(212,168,75,.25)}.player-panel.winner .score-value{color:#e4b95e;text-shadow:0 0 20px rgba(212,168,75,.4)}.player-panel.loser .score-value{color:#fff9}.score-change-anim{position:absolute;top:0;left:50%;transform:translate(-50%);font-size:clamp(14px,3.5vw,18px);font-weight:700;color:#d4a84bf2;text-shadow:0 2px 4px rgba(0,0,0,.8);animation:float-up-score 1.5s ease-out forwards;pointer-events:none;z-index:10}.score-penalty{font-family:Inter,system-ui,sans-serif;font-size:clamp(11px,2.8vw,14px);font-weight:600;color:#ef4444;margin-left:4px;opacity:.9}.action-anim{position:absolute;bottom:-4px;left:50%;transform:translate(-50%);font-size:clamp(10px,2.5vw,13px);font-weight:700;color:#f59e0b;text-shadow:0 2px 4px rgba(0,0,0,.8);animation:float-down 1.5s ease-out forwards;pointer-events:none;z-index:10}.panel-timer{position:relative;display:flex;align-items:center;justify-content:flex-end;min-width:clamp(44px,10vw,66px);justify-self:end}.timer-value{font-family:Inter,system-ui,sans-serif;font-size:clamp(13px,3.2vw,16px);font-weight:600;color:#ffffffb3;font-variant-numeric:tabular-nums}.player-panel.active .timer-value{color:#d4a84bf2}.panel-timer.low .timer-value{color:#f59e0bbf}.player-panel.active .panel-timer.low .timer-value{color:#f59e0b;animation:timer-pulse-soft 1.8s ease-in-out infinite}.panel-timer.overtime .timer-value{color:#dc5050e6}.player-panel.active .panel-timer.overtime .timer-value{color:#ef4444;animation:timer-pulse-soft 1.4s ease-in-out infinite}.panel-timer.critical .timer-value{color:#dc2626;animation:timer-pulse-critical 1s ease-in-out infinite}@keyframes timer-pulse-soft{0%,to{opacity:1}50%{opacity:.7}}@keyframes timer-pulse-critical{0%,to{opacity:1}50%{opacity:.5}}.time-increment-anim{position:absolute;top:-12px;right:0;font-size:clamp(10px,2.5vw,12px);font-weight:700;color:#4ade80;text-shadow:0 1px 2px rgba(0,0,0,.5);animation:float-up 1.5s ease-out forwards;pointer-events:none;white-space:nowrap;z-index:10}@keyframes float-up{0%{opacity:1;transform:translateY(0)}70%{opacity:1}to{opacity:0;transform:translateY(-16px)}}@keyframes float-up-score{0%{opacity:1;transform:translate(-50%) translateY(0)}70%{opacity:1}to{opacity:0;transform:translate(-50%) translateY(-24px)}}@keyframes float-down{0%{opacity:1;transform:translate(-50%) translateY(0)}70%{opacity:1}to{opacity:0;transform:translate(-50%) translateY(12px)}}.player-panel-opponent.active{border-color:#7e5eaa8c;box-shadow:0 0 0 1px #7e5eaa59,0 10px 22px #00000080,inset 0 1px 2px #ffffff14}.player-panel-opponent.active .timer-value{color:#a78bfaf2}.player-panel-opponent.active .score-value{text-shadow:0 0 16px rgba(126,94,170,.25)}.player-panel-opponent.active .panel-avatar{border-color:#7e5eaa80;box-shadow:0 2px 6px #0006,0 0 8px #7e5eaa33}.panel-avatar-wrapper.clickable{cursor:pointer;-webkit-tap-highlight-color:transparent;transition:transform .1s ease}.panel-avatar-wrapper.clickable:active{transform:scale(.92)}@media (hover: hover){.panel-avatar-wrapper.clickable:hover{opacity:.9}}.panel-chat-hint{position:absolute;top:-4px;right:-4px;z-index:2;animation:chat-hint-pulse 2s ease-in-out 3}.panel-chat-hint svg{width:18px;height:18px;fill:#fff;stroke:#fff;filter:drop-shadow(0 1px 2px rgba(0,0,0,.5))}.panel-chat-hint svg circle{fill:#333}@keyframes chat-hint-pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.1);opacity:.8}}.timer-progress-bar{position:absolute;bottom:0;left:8px;right:8px;height:clamp(2px,.8vw,2px);background:transparent;border-radius:1px;overflow:hidden;z-index:0}.timer-progress-bar:after{content:"";position:absolute;top:0;right:0;height:100%;width:var(--progress, 100%);background:#4ade8099;border-radius:1px;transition:width 1s linear,background-color .3s ease}.timer-progress-bar.low:after{background:#fbbf24b3}.timer-progress-bar.overtime:after{background:#f87171cc}.tile-selector-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#0000;z-index:1000;transition:background-color .3s ease}.tile-selector-overlay.visible{background-color:#00000080}.tile-selector-sheet{position:fixed;bottom:0;left:0;right:0;background:linear-gradient(0deg,#191e32fc,#23283cfa);border-radius:20px 20px 0 0;padding:12px 16px calc(16px + env(safe-area-inset-bottom,0px));transform:translateY(100%);transition:transform .3s cubic-bezier(.32,.72,0,1);box-shadow:0 -10px 40px #0006;border-top:1px solid rgba(255,255,255,.1);display:flex;flex-direction:column}.tile-selector-sheet.visible{transform:translateY(0)}.tile-selector-handle{display:flex;justify-content:center;padding:10px 0;cursor:pointer}.tile-selector-handle .handle-bar{width:40px;height:4px;background-color:#ffffff4d;border-radius:2px;transition:background-color .15s ease}@media (hover: hover){.tile-selector-handle:hover .handle-bar{background-color:#ffffff80}}.tile-selector-content{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center}.tile-selector-grid{display:flex;flex-direction:column;gap:8px;width:100%}.tile-selector-row{display:grid;grid-template-columns:repeat(10,1fr);gap:4px}.tile-selector-btn{background:none;border:none;padding:0;cursor:pointer;transition:transform .1s ease;display:flex;align-items:center;justify-content:center}@media (hover: hover){.tile-selector-btn:hover{transform:scale(1.08)}}.tile-selector-btn:active{transform:scale(.95)}.tile-selector-dual{display:flex;align-items:center;justify-content:center;gap:24px;padding:10px 0}.tile-selector-btn.dual{transition:transform .15s ease}@media (hover: hover){.tile-selector-btn.dual:hover{transform:scale(1.1)}}@media (min-width: 600px){.tile-selector-sheet{left:50%;right:auto;transform:translate(-50%) translateY(100%);width:100%;max-width:600px;border-radius:20px 20px 0 0}.tile-selector-sheet.visible{transform:translate(-50%) translateY(0)}}.tile-selector-sheet.visible.shake{animation:selector-shake .4s ease-in-out}@keyframes selector-shake{0%,to{margin-left:0}20%{margin-left:-8px}40%{margin-left:8px}60%{margin-left:-6px}80%{margin-left:6px}}.confirm-modal{text-align:center;max-width:min(400px,calc(100vw - 32px));min-width:min(300px,calc(100vw - 32px));padding:26px 22px;background:radial-gradient(circle at 50% 0%,rgba(255,255,255,.06),transparent 55%),linear-gradient(180deg,#241832f2,#120c1cfa);border:1px solid rgba(212,168,75,.2);box-shadow:0 20px 60px #0000008c,0 0 32px #d4a84b2e}.confirm-icon{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 14px}.confirm-icon--warning{background:#d4a84b2e;color:#d4a84b}.confirm-icon--danger{background:#b048482e;color:#e07a7a}.confirm-icon--default{background:#7e5eaa33;color:#cbb3ff}.confirm-title{font-size:16px;font-weight:600;margin-bottom:10px;color:var(--color-text-primary)}.confirm-message{font-size:13px;color:var(--color-text-secondary);line-height:1.5;white-space:pre-line;margin-bottom:24px}.confirm-buttons{display:flex;gap:12px;justify-content:center}.confirm-btn{flex:1;padding:10px 14px;border-radius:var(--radius-md);font-weight:500;font-size:13px;cursor:pointer;transition:all .15s ease;border:none;white-space:nowrap}.confirm-btn--cancel{background:#ffffff0f;color:#ffffffe6;border:1px solid rgba(255,255,255,.08)}@media (hover: hover){.confirm-btn--cancel:hover{background:#ffffff1a}}.confirm-btn--warning{background:linear-gradient(135deg,#c9803f,#9a5b2f);color:#fff;box-shadow:0 2px 8px #c9803f4d}@media (hover: hover){.confirm-btn--warning:hover{background:linear-gradient(135deg,#d39253,#b06936);transform:translateY(-1px);box-shadow:0 4px 12px #c9803f66}}.confirm-btn--danger{background:linear-gradient(135deg,#c84a4a,#8f2f2f);color:#fff;box-shadow:0 2px 8px #c84a4a4d}@media (hover: hover){.confirm-btn--danger:hover{background:linear-gradient(135deg,#d66a6a,#b03d3d);transform:translateY(-1px);box-shadow:0 4px 12px #c84a4a66}}.confirm-btn--default{background:linear-gradient(135deg,#5f2db6,#35156f);color:#fff;box-shadow:0 2px 8px #5f2db64d}@media (hover: hover){.confirm-btn--default:hover{background:linear-gradient(135deg,#7240c9,#4a1f8c);transform:translateY(-1px);box-shadow:0 4px 12px #5f2db666}}.confirm-modal--warning{box-shadow:0 20px 60px #0000008c,0 0 36px #c9803f1f}.confirm-modal--danger{box-shadow:0 20px 60px #0000008c,0 0 36px #c84a4a1f}.confirm-modal--default{box-shadow:0 20px 60px #0000008c,0 0 36px #5f2db61f}@media (max-width: 400px){.confirm-modal{max-width:min(300px,calc(100vw - 24px));padding:22px 16px}.confirm-icon{width:42px;height:42px;margin-bottom:12px}.confirm-title{font-size:14px}.confirm-message{font-size:12px;margin-bottom:20px}.confirm-btn{padding:10px 14px;font-size:12px}}.tile-bag-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#0000;z-index:1000;transition:background-color .3s ease}.tile-bag-overlay.visible{background-color:#0a071099}.tile-bag-sheet{position:fixed;bottom:0;left:0;right:0;background:radial-gradient(circle at 50% 0%,rgba(255,255,255,.06),transparent 55%),linear-gradient(180deg,#241832f2,#120c1cfa);border-radius:20px 20px 0 0;padding:8px 16px calc(16px + env(safe-area-inset-bottom,0px));transform:translateY(100%);transition:transform .3s cubic-bezier(.32,.72,0,1);box-shadow:0 -12px 36px #0000008c;border-top:1px solid rgba(212,168,75,.25);display:flex;flex-direction:column}.tile-bag-sheet.visible{transform:translateY(0)}.tile-bag-handle{display:flex;justify-content:center;padding:10px 0;cursor:pointer}.tile-bag-handle .handle-bar{width:40px;height:4px;background-color:#ffffff40;border-radius:2px;transition:background-color .15s ease}.tile-bag-handle:hover .handle-bar{background-color:#ffffff73}.tile-bag-header{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px;flex-wrap:wrap}.tile-bag-title{display:flex;align-items:center;gap:8px}.tile-bag-header h2{font-size:clamp(14px,4vw,16px);font-weight:600;color:#ffffffeb;margin:0}.tile-set-badge{font-size:clamp(9px,2.5vw,11px);font-weight:600;color:#ffffffb3;background:#d4a84b29;padding:2px 8px;border-radius:8px;text-transform:uppercase;letter-spacing:.5px}.tile-total{font-size:clamp(12px,3vw,14px);font-weight:500;color:#f2e8d6e6;background:#ffffff0f;padding:4px 12px;border-radius:12px;white-space:nowrap}.tile-opponent{font-size:clamp(10px,2.5vw,12px);font-weight:400;color:#f2e8d680}.tile-bag-content{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center}.tile-bag-grid{--mini-tile-size: 28px;display:flex;flex-direction:column;gap:12px;width:100%}.tile-bag-row{display:grid;grid-template-columns:repeat(10,1fr);gap:6px}.tile-bag-item{display:flex;flex-direction:column;align-items:center;gap:2px}.tile-bag-item.depleted{opacity:.25}.tile-water-container{position:relative;overflow:hidden;border-radius:3px}.tile-water-level{position:absolute;top:0;left:0;right:0;height:calc(100% - var(--water-percent, 100%));background:#00000040;pointer-events:none;transition:height .3s ease}.tile-bag-item .tile-count{font-size:12px;font-weight:700;color:#f2e8d6b3;min-width:18px;text-align:center}.tile-bag-item.depleted .tile-count{color:#ffffff4d}.empty-bag-message{text-align:center;color:var(--color-text-secondary);padding:20px;font-size:14px}@media (max-width: 400px){.tile-bag-sheet{padding:8px 12px 12px}.tile-bag-row{gap:2px}.tile-bag-item .tile-count{font-size:10px;min-width:14px}.tile-set-badge{padding:2px 6px}.tile-total{padding:3px 8px}}@media (min-width: 600px){.tile-bag-sheet{left:50%;right:auto;transform:translate(-50%) translateY(100%);width:100%;max-width:600px;border-radius:20px 20px 0 0}.tile-bag-sheet.visible{transform:translate(-50%) translateY(0)}}.history-sheet-overlay{--unit: calc((100dvh - env(safe-area-inset-bottom, 0px)) / 15.5 * .92);position:fixed;top:0;left:0;right:0;bottom:0;background-color:#0000;z-index:1000;transition:background-color .3s ease}.history-sheet-overlay.visible{background-color:#0a071099}.history-sheet{position:fixed;bottom:0;left:0;right:0;background:radial-gradient(circle at 50% 0%,rgba(255,255,255,.06),transparent 55%),linear-gradient(180deg,#241832f2,#120c1cfa);border-radius:calc(var(--unit) * .25) calc(var(--unit) * .25) 0 0;padding:calc(var(--unit) * .1) calc(var(--unit) * .2) calc(calc(var(--unit) * .2) + env(safe-area-inset-bottom,0px));max-height:45dvh;overflow:hidden;transform:translateY(100%);transition:transform .3s cubic-bezier(.32,.72,0,1),height .3s cubic-bezier(.32,.72,0,1),max-height .3s cubic-bezier(.32,.72,0,1);box-shadow:0 -12px 36px #0000008c;border-top:1px solid rgba(212,168,75,.25)}.history-sheet.visible{transform:translateY(0)}.history-sheet.expanded{height:auto;max-height:calc(100dvh - var(--unit) * 2.5 - env(safe-area-inset-top,0px));overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none;padding-top:0}.history-sheet.expanded::-webkit-scrollbar{display:none}@media (hover: hover){.history-sheet.expanded{cursor:grab}}.history-sheet-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:calc(var(--unit) * .25)}.history-sheet-header h2{font-size:16px;font-weight:600;color:#ffffffeb;margin:0}@media (max-width: 400px){.history-sheet-header h2{font-size:14px}}.history-total{font-size:14px;font-weight:500;color:#f2e8d6cc;background:#ffffff0f;padding:3px 10px;border-radius:12px}.history-sheet-content{display:flex;flex-direction:column;gap:calc(var(--unit) * .15)}.history-list{display:flex;flex-direction:column;gap:calc(var(--unit) * .1)}.history-row{display:flex;align-items:center;gap:calc(var(--unit) * .12)}.history-row.player{justify-content:flex-start;padding-right:calc(var(--unit) * .5)}.history-row.opponent{justify-content:flex-end;padding-left:calc(var(--unit) * .5)}.history-turn-number{font-size:max(13px,calc(var(--unit) * .18));font-weight:600;color:var(--color-text-secondary);min-width:calc(var(--unit) * .35);text-align:center}.history-item{display:flex;align-items:center;gap:calc(var(--unit) * .18);padding:calc(var(--unit) * .15) calc(var(--unit) * .18);border-radius:calc(var(--unit) * .12);background:#ffffff0a;transition:all .15s ease}.history-item.player{border-left:calc(var(--unit) * .05) solid rgb(var(--accent-rgb))}.history-item.opponent{border-right:calc(var(--unit) * .05) solid rgb(var(--accent-rgb))}.history-details{display:flex;align-items:center;gap:calc(var(--unit) * .1);flex-wrap:wrap}.history-item.player .history-details{justify-content:flex-start}.history-item.opponent .history-details{justify-content:flex-end}.history-tiles{display:flex;flex-wrap:wrap;gap:calc(var(--unit) * .05);align-items:center}.history-mini-tile{position:relative;display:flex;align-items:center;justify-content:center;width:calc(var(--unit) * .38);height:calc(var(--unit) * .38);background:linear-gradient(165deg,#e0d0a8,#ccab7a 55%,#a87a45);border-radius:calc(var(--unit) * .05);box-shadow:0 1px 2px #00000059;overflow:hidden}.history-mini-tile:before{content:"";position:absolute;top:0;left:0;width:0;height:0;border-style:solid;border-width:calc(var(--unit) * .15) calc(var(--unit) * .15) 0 0;border-color:transparent}.history-mini-tile.bonus-dp:before{border-color:rgba(215,120,55,.95) transparent transparent transparent}.history-mini-tile.bonus-tp:before{border-color:rgba(155,130,200,.95) transparent transparent transparent}.history-mini-tile.bonus-de:before{border-color:rgba(225,180,70,.95) transparent transparent transparent}.history-mini-tile.bonus-te:before{border-color:rgba(145,62,78,.95) transparent transparent transparent}.history-mini-tile.bonus-center:before{border-color:rgba(155,130,200,.95) transparent transparent transparent}.history-mini-tile .mini-tile-value{font-size:max(13px,calc(var(--unit) * .18));font-weight:700;color:#3e234a;text-shadow:0 1px 0 rgba(255,255,255,.2)}.history-mini-tile .mini-tile-value.dual-op{display:flex;font-size:max(10px,calc(var(--unit) * .12))}.history-mini-tile .mini-tile-value.dual-op>.selected-op{color:#3e234a}.history-mini-tile .mini-tile-value.dual-op>.unselected-op{color:#3e234a4d}.history-mini-tile.blank-assigned .mini-tile-value{color:#0891b2}.history-score{font-size:max(18px,calc(var(--unit) * .28));font-weight:700;display:flex;align-items:center;gap:calc(var(--unit) * .08);flex-shrink:0}.history-turn-score{color:rgb(var(--accent-rgb));font-weight:800}.history-acc-score{font-size:max(13px,calc(var(--unit) * .18));font-weight:500;color:var(--color-text-secondary)}.history-multiplier{font-size:max(13px,calc(var(--unit) * .18));font-weight:600}.history-multiplier.multiplier-de{color:#e1b446}.history-multiplier.multiplier-te{color:#b45064}.history-pass-row{display:flex;align-items:center;gap:calc(var(--unit) * .15)}.history-passed{font-size:max(14px,calc(var(--unit) * .2));color:var(--color-text-secondary);font-style:italic}.history-timeout{font-size:max(14px,calc(var(--unit) * .2));color:#f87171;font-weight:600}.history-acc-score.passed{font-weight:600}.history-bingo{font-size:max(11px,calc(var(--unit) * .15));background:linear-gradient(135deg,#f3c86d,#d9903a);color:#2b1f2f;padding:calc(var(--unit) * .04) calc(var(--unit) * .12);border-radius:calc(var(--unit) * .05);font-weight:700}.empty-history-message{text-align:center;color:var(--color-text-secondary);font-size:13px;padding:calc(var(--unit) * .25);margin:0}@media (max-width: 400px){.history-total{font-size:12px;padding:3px 8px}.empty-history-message{font-size:12px}}.history-item.game-end{border-top:2px solid rgba(212,168,75,.3);background:#ffffff0f}.history-item.clickable{cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .15s ease,transform .15s ease}@media (hover: hover){.history-item.clickable:hover{background:#ffffff14}}.history-item.clickable:active{background:#d4a84b26;transform:scale(.98)}.history-item.current-turn{background:#d4a84b33;box-shadow:inset 0 0 0 2px #d4a84b80}.history-row.initial-state{justify-content:center;padding-left:calc(var(--unit) * .5);padding-right:calc(var(--unit) * .5)}.history-item.initial{background:#ffffff0a;border:1px dashed rgba(212,168,75,.25);padding:calc(var(--unit) * .15) calc(var(--unit) * .35);border-radius:calc(var(--unit) * .12)}.history-item.initial.clickable:active{background:#d4a84b26}.history-initial-text{font-size:max(13px,calc(var(--unit) * .18));color:#f2e8d699;font-weight:500}.history-row.initial-state.current-turn .history-item.initial{background:#d4a84b33;box-shadow:inset 0 0 0 2px #d4a84b80}.final-score-section{display:flex;flex-direction:column;gap:calc(var(--unit) * .12);padding:calc(var(--unit) * .15);margin-bottom:calc(var(--unit) * .15);background:linear-gradient(180deg,#785a962e,#785a960f);border:1px solid rgba(212,168,75,.18);border-radius:calc(var(--unit) * .12)}.final-score-header{font-size:max(13px,calc(var(--unit) * .18));font-weight:600;color:#f2e8d6d9;text-transform:uppercase;letter-spacing:.5px}.final-score-cards{display:grid;grid-template-columns:1fr 1fr;gap:calc(var(--unit) * .15);align-items:start}.final-score-card{display:grid;grid-template-rows:subgrid;grid-row:span 3;gap:calc(var(--unit) * .08);padding:calc(var(--unit) * .12);background:#ffffff0d;border-radius:calc(var(--unit) * .08);border-left:3px solid rgb(var(--card-rgb))}.final-score-card.opponent{border-left:none;border-right:3px solid rgb(var(--card-rgb));justify-items:end}.final-score-card.opponent .final-net-score,.final-score-card.opponent .final-time{flex-direction:row-reverse}.final-score-card.winner{background:#4ade8014;box-shadow:0 0 12px #4ade8026}.final-net-score{display:flex;align-items:center;gap:calc(var(--unit) * .1)}.final-breakdown{display:inline;font-size:max(12px,calc(var(--unit) * .16));color:#d8c8e699;margin-left:calc(var(--unit) * .08)}.final-before{color:#d8c8e6b3}.final-bonus,.final-opponent-ref{color:#4ade80}.final-deduct{color:#f87171}.final-after{font-size:max(18px,calc(var(--unit) * .28));font-weight:700;color:#fff}.final-after.winner{color:#4ade80}.final-after.loser{color:#f87171}.final-timeout-badge{font-size:max(10px,calc(var(--unit) * .12));font-weight:600;color:#f87171;background:#f8717126;padding:calc(var(--unit) * .02) calc(var(--unit) * .06);border-radius:calc(var(--unit) * .04)}.final-tiles{display:flex;flex-wrap:nowrap;gap:calc(var(--unit) * .04);overflow:hidden;min-height:calc(var(--unit) * .32)}.final-score-card.opponent .final-tiles{justify-self:end}.final-time{display:flex;align-items:center;gap:calc(var(--unit) * .08);font-size:max(12px,calc(var(--unit) * .16));font-weight:500;color:#d8c8e699;font-variant-numeric:tabular-nums}.final-time.overtime{color:#f87171}.penalty-mini-tile{position:relative;display:flex;align-items:center;justify-content:center;width:calc(var(--unit) * .32);min-width:calc(var(--unit) * .22);height:calc(var(--unit) * .32);flex-shrink:1;background:linear-gradient(165deg,#e0d0a8,#ccab7a 55%,#a87a45);border-radius:calc(var(--unit) * .05);box-shadow:0 1px 2px #00000059}.penalty-mini-tile .mini-tile-value{font-size:max(11px,calc(var(--unit) * .15));font-weight:700;color:#3e234a;text-shadow:0 1px 0 rgba(255,255,255,.2)}.penalty-mini-tile .mini-tile-value.dual-op{display:flex;font-size:max(9px,calc(var(--unit) * .1))}.penalty-mini-tile .mini-tile-value.dual-op .op-separator{color:#3e234a4d;font-size:.8em}.penalty-mini-tile .mini-tile-points{display:none}.history-sheet-handle{display:flex;justify-content:center;padding:calc(var(--unit) * .15) 0}.history-sheet-handle .handle-bar{width:calc(var(--unit) * .5);height:calc(var(--unit) * .05);background-color:#ffffff4d;border-radius:calc(var(--unit) * .025)}.history-sheet.expanded .history-sheet-sticky-header{position:sticky;top:0;z-index:1;background:radial-gradient(circle at 50% 0%,rgba(255,255,255,.04),transparent 55%),linear-gradient(180deg,#241832fa,#120c1cfa);margin:0 calc(var(--unit) * -.2) calc(var(--unit) * .1);padding:calc(var(--unit) * .1) calc(var(--unit) * .2) calc(var(--unit) * .15);border-bottom:1px solid rgba(212,168,75,.2)}.history-sheet.expanded .history-sheet-handle{padding:calc(var(--unit) * .05) 0}.history-sheet.expanded .history-sheet-header{margin-bottom:0}@media (min-width: 600px){.history-sheet{left:50%;right:auto;transform:translate(-50%) translateY(100%);width:100%;max-width:min(600px,calc(var(--unit) * 8));border-radius:calc(var(--unit) * .25) calc(var(--unit) * .25) 0 0}.history-sheet.visible{transform:translate(-50%) translateY(0)}.history-sheet.expanded{height:auto;max-height:calc(100dvh - var(--unit) * 2.5 - env(safe-area-inset-top,0px))}}.settings-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#0000;z-index:1000;transition:background-color .3s ease}.settings-overlay.visible{background-color:#0a071099}.settings-sheet{position:fixed;top:0;left:0;right:0;background:radial-gradient(circle at 50% 0%,rgba(255,255,255,.06),transparent 55%),linear-gradient(180deg,#241832f2,#120c1cfa);border-radius:0 0 20px 20px;padding:12px 12px 0;transform:translateY(-100%);transition:transform .3s cubic-bezier(.32,.72,0,1);box-shadow:0 12px 36px #0000008c;border-bottom:1px solid rgba(212,168,75,.25)}.settings-sheet.visible{transform:translateY(0)}.settings-handle{display:flex;justify-content:center;padding:8px 0;cursor:pointer}.settings-handle .handle-bar{width:36px;height:4px;background-color:#ffffff40;border-radius:2px;transition:background-color .15s ease}@media (hover: hover){.settings-handle:hover .handle-bar{background-color:#ffffff73}}.settings-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}.settings-header h2{font-size:16px;font-weight:600;color:#ffffffeb;margin:0}.settings-content{display:flex;flex-direction:column;gap:10px}.settings-section{display:flex;flex-direction:column;gap:8px}.settings-section+.settings-section{padding-top:8px;border-top:1px solid rgba(255,255,255,.06)}.settings-toggles{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding-top:4px}.settings-toggles.has-emote{grid-template-columns:repeat(3,1fr)}@media (max-width: 359px){.settings-toggles.has-emote{grid-template-columns:1fr 1fr}}.settings-toggles .settings-option{min-height:40px}.section-title{font-size:11px;font-weight:600;color:#f2e8d699;text-transform:uppercase;letter-spacing:.8px;margin:0 0 2px}.theme-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:4px}.theme-card{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;padding:4px;background:#ffffff08;border:1px solid rgba(255,255,255,.08);border-radius:8px;cursor:pointer;transition:all .2s ease}@media (hover: hover){.theme-card:hover{background:#ffffff0f;border-color:#ffffff26;transform:translateY(-2px)}}.theme-card.selected{border-color:#d4a84bcc;box-shadow:0 0 0 1px #d4a84bcc,0 0 12px #d4a84b40}.theme-preview{width:100%;aspect-ratio:1;border-radius:6px;overflow:hidden}.preview-board{width:100%;height:100%;padding:3px;display:flex;align-items:center;justify-content:center;border-radius:8px}.preview-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:2px;width:100%;height:100%}.preview-cell{aspect-ratio:1;border-radius:2px;border:1px solid;display:flex;align-items:center;justify-content:center}.preview-cell.center{font-size:8px}.theme-info{display:flex;flex-direction:column;align-items:center;gap:0}.theme-icon{font-size:12px;line-height:1}.theme-name{font-size:9px;font-weight:500;color:#fffc;text-align:center;line-height:1.1;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.selected-badge{position:absolute;top:2px;right:2px;width:14px;height:14px;background:var(--color-accent);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff}@media (min-width: 600px){.settings-sheet{left:50%;right:auto;transform:translate(-50%) translateY(-100%);width:100%;max-width:600px;border-radius:0 0 20px 20px}.settings-sheet.visible{transform:translate(-50%) translateY(0)}.theme-grid{grid-template-columns:repeat(4,1fr);gap:16px}.theme-card{padding:12px;gap:10px}.theme-name{font-size:12px}}.settings-option{display:flex;align-items:center;justify-content:space-between;padding:8px 10px;background:#ffffff0a;border:1px solid rgba(255,255,255,.07);border-radius:10px}.settings-option.compact{padding:6px 8px;margin-top:4px;background:#ffffff08}.settings-option.compact .option-label{font-size:11px;color:#ffffffb3}.toggle-switch.small{width:32px;height:18px}.toggle-switch.small .toggle-slider:before{height:12px;width:12px;left:3px;bottom:3px}.toggle-switch.small input:checked+.toggle-slider:before{transform:translate(14px)}.option-info{display:flex;flex-direction:column;gap:2px}.option-label{font-size:12px;font-weight:500;color:#ffffffe6;display:flex;align-items:center}.option-desc{font-size:10px;color:#ffffff80}.toggle-switch{position:relative;display:inline-block;width:40px;height:22px;flex-shrink:0}.toggle-switch input{opacity:0;width:0;height:0}.toggle-slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#ffffff1f;transition:.2s;border-radius:22px}.toggle-slider:before{position:absolute;content:"";height:16px;width:16px;left:3px;bottom:3px;background-color:#fff;transition:.2s;border-radius:50%;box-shadow:0 2px 4px #00000040}.toggle-switch input:checked+.toggle-slider{background-color:var(--color-accent)}.toggle-switch input:checked+.toggle-slider:before{transform:translate(18px)}.tile-style-preview{display:flex;align-items:center;justify-content:center;width:100%;aspect-ratio:1}.tile-style-grid{grid-template-columns:repeat(6,1fr);gap:4px}.tile-style-grid .theme-card{padding:4px 2px;gap:2px}.preview-tile{width:28px;height:28px;border-radius:4px;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative}.preview-tile-value{font-size:14px;font-weight:900;font-family:Inter,Segoe UI,sans-serif;line-height:1}.preview-tile-points{position:absolute;bottom:1px;right:2px;font-size:6px;font-weight:700}.tile-style-grid .theme-name{font-size:8px}.tile-style-grid .selected-badge{width:12px;height:12px;top:2px;right:2px}.section-description{font-size:11px;color:#ffffff73;margin:-4px 0 4px}.tile-set-options{display:flex;gap:8px}.tile-set-option{position:relative;flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:12px 8px;background:#ffffff08;border:1px solid rgba(255,255,255,.08);border-radius:10px;cursor:pointer;transition:all .2s ease}@media (hover: hover){.tile-set-option:hover{background:#ffffff0f;border-color:#ffffff26}}.tile-set-option.selected{border-color:#d4a84bcc;box-shadow:0 0 0 1px #d4a84bcc,0 0 12px #d4a84b40}.tile-set-name{font-size:14px;font-weight:600;color:#ffffffe6}.tile-set-count{font-size:11px;color:#ffffff80}.tile-set-option .selected-badge{top:6px;right:6px}@media (max-width: 400px){.settings-header h2{font-size:14px}}.game{--safe-area-bottom: env(safe-area-inset-bottom, 0px);--unit: calc((100dvh - var(--safe-area-bottom)) / 15.5);--header-height: calc(var(--unit) * .8);--scoreboard-height: calc(var(--unit) * 1.7);--rack-height: calc(var(--unit) * 1.3);--footer-height: calc(var(--unit) * 1.2);--board-size: min(calc(var(--unit) * 10.5 - var(--rack-height)), 100vw);--rack-tile-from-height: calc(var(--rack-height) * .75);--rack-tile-from-width: calc(var(--rack-max-width) / 8.2);--rack-tile-size: min( var(--rack-tile-from-height), var(--rack-tile-from-width) );--max-width: min(calc(var(--unit) * 10.5), 100vw);--rack-max-width: calc(var(--unit) * 9);width:100%;max-width:var(--max-width);height:100dvh;overflow:hidden;display:flex;flex-direction:column;background:transparent;color:#fff;margin:0 auto;padding-bottom:var(--safe-area-bottom);padding-top:clamp(4px,1vw,8px)}.game-layout{flex:1;display:flex;flex-direction:column;min-height:0;animation:game-enter .32s cubic-bezier(.32,.72,0,1) forwards}@keyframes game-enter{0%{opacity:0}to{opacity:1}}.game-main{flex:1;display:flex;flex-direction:column;align-items:center;min-height:0}.opponent-section{position:relative;width:100%;max-width:var(--board-size);display:flex;flex-direction:column;gap:clamp(4px,1vw,6px);padding:0 clamp(4px,1vw,8px);z-index:10}.opponent-section .player-panel{--panel-height: clamp(36px, 8vw, 44px)}.opponent-panel-wrapper{position:relative}.player-section{position:relative;width:100%;max-width:var(--board-size);padding:clamp(6px,1.5vw,10px) clamp(4px,1vw,8px);z-index:10}.player-section .player-panel{--panel-height: clamp(40px, 9vw, 50px)}.board-area{flex:1;width:100%;display:flex;justify-content:center;align-items:center;min-height:0}.board-area:before{content:"";position:absolute;left:50%;width:min(var(--board-size),92%);height:min(calc(var(--board-size) * .18),140px);transform:translate(-50%);opacity:0;filter:blur(14px);pointer-events:none;transition:opacity .2s ease;z-index:0}.board-area.turn-player:before{bottom:-6%;opacity:.85;background:radial-gradient(ellipse at center,rgba(212,168,75,.6) 0%,rgba(212,168,75,.2) 45%,transparent 70%)}.board-area.turn-opponent:before{top:-6%;opacity:.8;background:radial-gradient(ellipse at center,rgba(126,94,170,.55) 0%,rgba(126,94,170,.2) 45%,transparent 70%)}.board-area .board,.board-area .board-container{position:relative;z-index:1}@keyframes bingo-pulse{0%,to{box-shadow:0 var(--btn-edge) 0 #8a6525,0 calc(var(--btn-edge) * 1.5) calc(var(--btn-edge) * 3) #0000004d}50%{box-shadow:0 var(--btn-edge) 0 #8a6525,0 calc(var(--btn-edge) * 1.5) calc(var(--btn-edge) * 3) #0000004d,0 0 calc(var(--btn-edge) * 2.5) #b8923a40}}.submit-btn.bingo-btn{background:linear-gradient(180deg,#d4b87a,#b8923a);border:1px solid rgba(232,212,168,.4);box-shadow:0 var(--btn-edge) 0 #8a6525,0 calc(var(--btn-edge) * 3) calc(var(--btn-edge) * 4) #00000073;animation:bingo-pulse 3.2s ease-in-out infinite}.submit-btn.bingo-btn.shake{animation:submit-shake .4s ease-in-out,bingo-pulse 2s ease-in-out infinite}.home-page{--safe-area-bottom: env(safe-area-inset-bottom, 0px);--unit: calc((100dvh - var(--safe-area-bottom)) / 15.5);--max-width: min(calc(var(--unit) * 10.5), 100vw);--content-max-width: calc(var(--unit) * 9);--spacing-xs: calc(var(--unit) * .08);--spacing-sm: calc(var(--unit) * .12);--spacing-md: calc(var(--unit) * .18);--spacing-lg: calc(var(--unit) * .24);--spacing-xl: calc(var(--unit) * .32);--cardRadius: calc(var(--unit) * .18);--cardBorder: 1px solid rgba(255, 255, 255, .1);--cardShadow: 0 12px 26px rgba(0, 0, 0, .44), inset 0 1px 0 rgba(255, 255, 255, .06), inset 0 0 0 1px rgba(255, 255, 255, .05);--cardHighlight: linear-gradient( 180deg, rgba(255, 255, 255, .04), rgba(0, 0, 0, .1) );--iconBoxSize: clamp(38px, calc(var(--unit) * .65), 46px);--iconBoxRadius: calc(var(--unit) * .12);--iconBoxBorder: 1px solid rgba(255, 255, 255, .12);--iconBoxShadow: 0 6px 14px rgba(0, 0, 0, .36);--ctaBorder: 1px solid rgba(255, 215, 150, .34);--ctaInner: inset 0 0 0 1px rgba(255, 255, 255, .14);--ctaShadow: 0 12px 28px rgba(0, 0, 0, .42), 0 2px 0 rgba(0, 0, 0, .26);--ctaGrad: linear-gradient( 178deg, #eed38f 0%, #d4a84e 30%, #b8872d 70%, #9a6e22 100% );--topMask: linear-gradient( to bottom, rgba(10, 8, 14, .55) 0%, rgba(10, 8, 14, .35) 30%, rgba(10, 8, 14, .1) 60%, rgba(10, 8, 14, 0) 100% );--spotlight: radial-gradient( ellipse 80% 60% at 50% 0%, rgba(255, 220, 150, .14) 0%, rgba(0, 0, 0, 0) 65% );--overlayAlpha: .55;--ctaPadY: calc(var(--unit) * .07);--ctaRadius: calc(var(--cardRadius) * 1.8);--cardPad: calc(var(--unit) * .15);--cardGap: var(--spacing-md);--subOpacity: .82;--dividerOpacity: .22;--radius-card: var(--cardRadius);--radius-sm: var(--iconBoxRadius);width:100%;max-width:var(--max-width);height:100dvh;margin:0 auto;display:flex;align-items:center;justify-content:center;background:transparent;padding-top:clamp(4px,1vw,8px);padding-bottom:var(--safe-area-bottom);position:relative;overflow:hidden;box-sizing:border-box}.home-content{width:100%;height:100%;display:grid;grid-template-rows:1fr auto;justify-items:center;position:relative;z-index:2}.home-main{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--unit) * .22);padding-top:0}.home-header{text-align:center;display:flex;flex-direction:column;align-items:center;gap:calc(var(--unit) * .1);margin-bottom:0}.logo-mark{display:flex;flex-direction:column;align-items:center;gap:calc(var(--unit) * .12)}.logo-image{width:min(calc(var(--unit) * 5.5),88vw);max-width:calc(var(--unit) * 5.5);height:auto;aspect-ratio:863 / 590;display:block;filter:drop-shadow(0 8px 16px rgba(0,0,0,.4));animation:logo-fade-in .6s ease-out backwards}.tagline-row{display:flex;align-items:center;justify-content:center;gap:12px;margin:16px auto 14px;width:min(620px,84%);pointer-events:none}.tagline-plate{display:inline-flex;align-items:center;gap:8px;padding:5px 14px;border-radius:999px;position:relative;background:#0c091238;border:1px solid rgba(212,168,75,.16);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 12px 26px #00000052,inset 0 1px #ffffff0f}.tagline-plate:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:999px;pointer-events:none;background:linear-gradient(to bottom,rgba(255,255,255,.1),transparent 60%);opacity:.55}.tagline-plate:after{content:"";position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;border-radius:999px;pointer-events:none;background:linear-gradient(90deg,transparent 10%,rgba(212,168,75,.12) 50%,transparent 90%);opacity:.6;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;-webkit-mask-composite:xor;padding:1px}.tagline-text{font-family:Prompt,IBM Plex Sans Thai,system-ui,sans-serif;font-size:12px;font-weight:500;letter-spacing:.12em;line-height:1;color:#d4a84be6;text-shadow:0 2px 10px rgba(0,0,0,.62),0 0 18px rgba(212,168,75,.08);white-space:nowrap}.tagline-dot{color:#d4a84b73;font-size:10px;line-height:1;transform:translateY(-.5px);text-shadow:0 2px 10px rgba(0,0,0,.55)}.tagline-line{flex:1;height:1px;opacity:.7;background:linear-gradient(to right,transparent,rgba(212,168,75,.08),rgba(212,168,75,.35),rgba(212,168,75,.08),transparent);box-shadow:0 0 20px #d4a84b0f}@keyframes logo-fade-in{0%{opacity:0;transform:translateY(-12px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.section-header{width:100%;max-width:var(--content-max-width);display:flex;align-items:center;gap:calc(var(--unit) * .1);padding-left:0}.section-label{font-size:clamp(9px,calc(var(--unit) * .11),12px);font-weight:600;color:#d4a84bb8;letter-spacing:1.2px;text-transform:uppercase;white-space:nowrap}.section-header:after{content:"";flex:1;height:1px;background:linear-gradient(90deg,rgba(255,215,150,var(--dividerOpacity)),rgba(255,215,150,.12) 60%,transparent 100%);box-shadow:0 0 8px #ffd7961a}.quick-play-btn{width:85%;max-width:var(--content-max-width);display:flex;align-items:center;gap:var(--cardGap);padding:var(--cardPad) var(--spacing-md);background:var(--ctaGrad);border:var(--ctaBorder);border-radius:var(--cardRadius);cursor:pointer;position:relative;overflow:hidden;box-shadow:var(--ctaShadow),var(--ctaInner),inset 0 1px #ffffff1a;transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease}.quick-play-btn:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to bottom,#ffffff2e,#fff0 55%);pointer-events:none}.quick-play-btn:after{content:"";position:absolute;top:-50%;right:0;bottom:-50%;left:0;background:linear-gradient(115deg,transparent 0%,rgba(255,255,255,.12) 44%,rgba(255,255,255,.03) 56%,transparent 70%);transform:translate(-130%);animation:gold-sheen 9s ease-in-out infinite;pointer-events:none}@keyframes gold-sheen{0%,70%{transform:translate(-130%);opacity:.8}85%,to{transform:translate(120%);opacity:0}}.quick-play-icon-box{width:var(--iconBoxSize);height:var(--iconBoxSize);display:flex;align-items:center;justify-content:center;background:#fff3;border:1px solid rgba(255,255,255,.15);border-radius:var(--iconBoxRadius);flex-shrink:0;color:#181410}.quick-play-icon-box svg{width:clamp(18px,calc(var(--unit) * .28),22px);height:clamp(18px,calc(var(--unit) * .28),22px)}.quick-play-text{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding-right:calc(var(--iconBoxSize) / 2)}.quick-play-text h3{font-size:clamp(15px,calc(var(--unit) * .26),20px);font-weight:700;color:#181410;margin:0;line-height:1.15;text-shadow:0 1px 0 rgba(255,255,255,.35)}.quick-play-text p{font-size:clamp(10px,calc(var(--unit) * .14),13px);font-weight:500;color:#181410b3;margin:0;line-height:1.25;white-space:nowrap}@media (hover: hover){.quick-play-btn:hover{transform:translateY(-1px);box-shadow:0 14px 32px #0000007a,0 2px #00000042,var(--ctaInner);border-color:#ffd79666}}.quick-play-btn:active{transform:scale(.98);box-shadow:0 8px 20px #0000004d,0 1px #0000002e,inset 0 2px 6px #0000000f;background:linear-gradient(178deg,#e0c470,#c89e42 30%,#a87a28 70%,#8a6218);border-color:#c8a04647}.practice-grid{width:100%;max-width:var(--content-max-width);display:grid;grid-template-columns:repeat(2,1fr);gap:var(--spacing-sm)}.practice-card{display:flex;align-items:center;justify-content:flex-start;padding:var(--cardPad) var(--spacing-md);background:var(--cardHighlight),linear-gradient(170deg,#ffffff17,#16121ef7);border:var(--cardBorder);border-radius:var(--cardRadius);cursor:pointer;position:relative;overflow:hidden;box-shadow:var(--cardShadow);transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease}.practice-card-inner{display:flex;align-items:center;gap:var(--cardGap);width:100%}.practice-icon{width:var(--iconBoxSize);height:var(--iconBoxSize);display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,rgba(255,255,255,.06),transparent 60%),#d4a84b29;border:var(--iconBoxBorder);border-color:#d4a84b38;border-radius:var(--iconBoxRadius);color:#f8e4b2f7;flex-shrink:0;box-shadow:var(--iconBoxShadow),0 0 14px #d4a84b24}.practice-info{flex:1;min-width:0}.practice-info h3{font-size:clamp(12px,calc(var(--unit) * .19),16px);font-weight:600;color:#fffffff0;margin:0;line-height:1.15;text-align:left}.practice-info p{font-size:clamp(10px,calc(var(--unit) * .13),12px);color:rgba(200,180,150,var(--subOpacity));margin:1px 0 0;line-height:1.25;text-align:left}.practice-card-primary{background:var(--cardHighlight),linear-gradient(170deg,#a855f724,#16121ef7);border-color:#a855f72e}.practice-card-primary .practice-icon{background:linear-gradient(180deg,rgba(255,255,255,.06),transparent 60%),#a855f738;border-color:#a855f747;color:#d2b4fff7;box-shadow:var(--iconBoxShadow),0 0 14px #a855f724}.practice-card-secondary{background:var(--cardHighlight),linear-gradient(170deg,#d4a84b1f,#16121ef7)}@media (hover: hover){.practice-card:hover{border-color:#ffffff1f;transform:translateY(-1px);box-shadow:0 2px 6px #00000080,0 12px 28px #00000073}}.practice-card:active{transform:scale(.98);box-shadow:0 1px 3px #00000059}.puzzles-grid{width:100%;max-width:var(--content-max-width);display:grid;grid-template-columns:repeat(2,1fr);gap:var(--spacing-sm)}.puzzle-card{display:flex;align-items:center;justify-content:flex-start;gap:var(--spacing-md);padding:var(--spacing-md) var(--spacing-md);background:var(--cardHighlight),linear-gradient(170deg,#ffffff17,#16121ef7);border:var(--cardBorder);border-radius:var(--cardRadius);cursor:pointer;position:relative;overflow:hidden;box-shadow:var(--cardShadow);transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease}.puzzle-icon{width:var(--iconBoxSize);height:var(--iconBoxSize);display:flex;align-items:center;justify-content:center;border-radius:var(--iconBoxRadius);flex-shrink:0;box-shadow:var(--iconBoxShadow)}.puzzle-info{flex:1;min-width:0}.puzzle-info h3{font-size:clamp(12px,calc(var(--unit) * .19),16px);font-weight:600;color:#fffffff0;margin:0;text-align:left}.puzzle-info p{font-size:clamp(10px,calc(var(--unit) * .13),12px);margin:2px 0 0;text-align:left}.puzzle-daily{background:var(--cardHighlight),linear-gradient(170deg,#2dd4bf1a,#16121ef7);border-color:#2dd4bf29}.puzzle-daily .puzzle-icon{position:relative;overflow:hidden;background:linear-gradient(180deg,rgba(255,255,255,.06),transparent 60%),#2dd4bf2e;border:var(--iconBoxBorder);border-color:#2dd4bf3d;color:#b4fffff7;box-shadow:var(--iconBoxShadow),0 0 14px #2dd4bf24}.daily-new-text{font-size:clamp(10px,calc(var(--unit) * .16),13px);font-weight:800;letter-spacing:.5px;color:inherit}.puzzle-daily .puzzle-info{padding-right:28px}.puzzle-daily .puzzle-info p{color:#b4faff8c}.streak-badge{position:absolute;top:clamp(6px,calc(var(--unit) * .1),10px);right:clamp(8px,calc(var(--unit) * .12),12px);display:inline-flex;align-items:center;gap:3px;height:clamp(20px,calc(var(--unit) * .32),26px);padding:0 clamp(7px,calc(var(--unit) * .12),11px);border-radius:999px;background:linear-gradient(180deg,#14b8a62e,#0000001f);border:1px solid rgba(20,184,166,.46);box-shadow:inset 0 0 0 1px #ffffff0d,0 0 18px #14b8a624;z-index:2;pointer-events:none}.streak-icon{font-size:clamp(9px,calc(var(--unit) * .14),12px);line-height:1;transform:translateY(-.5px)}.streak-count{font-size:clamp(9px,calc(var(--unit) * .14),12px);font-weight:800;color:#ffffffeb;line-height:1;letter-spacing:.02em}.bingo-badge{background:linear-gradient(180deg,#ff6b7b2e,#0000001f);border-color:#ff6b7b75;box-shadow:inset 0 0 0 1px #ffffff0d,0 0 18px #ff5a6e24}.puzzle-bingo{background:var(--cardHighlight),linear-gradient(170deg,#a855f71a,#16121ef7);border-color:#a855f729}.puzzle-bingo .puzzle-icon{background:linear-gradient(180deg,rgba(255,255,255,.06),transparent 60%),#a855f72e;border:var(--iconBoxBorder);border-color:#a855f73d;color:#dcbefff7;box-shadow:var(--iconBoxShadow),0 0 14px #a855f724}.puzzle-bingo .puzzle-info{padding-right:28px}.puzzle-bingo .puzzle-info p{color:#c8b4e68c}.puzzle-available{animation:puzzle-glow 2.5s ease-in-out infinite}.puzzle-available .puzzle-icon:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.35) 50%,transparent 60%);border-radius:inherit;transform:translate(-150%);animation:icon-shimmer 3s ease-in-out infinite;pointer-events:none}@keyframes icon-shimmer{0%,65%{transform:translate(-150%)}85%,to{transform:translate(150%)}}@keyframes puzzle-glow{0%,to{border-color:#2dd4bf29;box-shadow:var(--cardShadow)}50%{border-color:#2dd4bf80;box-shadow:var(--cardShadow),0 0 18px #2dd4bf47}}@media (hover: hover){.puzzle-daily:hover{border-color:#2dd4bf2e;transform:translateY(-1px);box-shadow:0 2px 6px #00000080,0 12px 28px #00000073}.puzzle-bingo:hover{border-color:#a855f72e;transform:translateY(-1px);box-shadow:0 2px 6px #00000080,0 12px 28px #00000073}}.puzzle-card:active{transform:scale(.98);box-shadow:0 1px 3px #00000059}.mode-selection-wrapper{width:100%;max-width:var(--content-max-width);display:flex;flex-direction:column;align-items:center;gap:var(--spacing-md);animation:fadeSlideIn .3s ease-out}@keyframes fadeSlideIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.game-setup{width:100%;max-width:var(--content-max-width);display:flex;flex-direction:column;align-items:center;gap:clamp(12px,calc(var(--unit) * .22),20px);animation:slideIn .3s ease-out}.game-setup .quick-play-btn{width:70%}@keyframes slideIn{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}.setup-header{width:100%;display:flex;align-items:center;gap:clamp(8px,calc(var(--unit) * .16),16px)}.back-btn{padding:clamp(6px,calc(var(--unit) * .08),10px) clamp(12px,calc(var(--unit) * .16),18px);font-size:clamp(13px,calc(var(--unit) * .18),16px);font-weight:600;color:#d6c8aacc;background:linear-gradient(180deg,rgba(255,255,255,.03),transparent 60%),#16121ed9;border:1px solid rgba(255,255,255,.08);border-radius:var(--iconBoxRadius);cursor:pointer;box-shadow:0 2px 8px #00000040;transition:all .15s ease}@media (hover: hover){.back-btn:hover{background:linear-gradient(180deg,rgba(255,255,255,.05),transparent 60%),#1e182ae6;border-color:#ffffff26;color:#fff}}.setup-header h2{font-size:clamp(18px,calc(var(--unit) * .28),24px);font-weight:700;color:#fff;margin:0}.setup-section{width:100%;display:flex;flex-direction:column;gap:clamp(6px,calc(var(--unit) * .1),10px)}.setup-label{display:flex;align-items:center;gap:clamp(4px,calc(var(--unit) * .08),8px);font-size:clamp(10px,calc(var(--unit) * .14),12px);font-weight:700;color:#d6c8aa80;text-transform:uppercase;letter-spacing:1.8px}.setup-pill{flex:1;min-width:0;display:flex;align-items:center;justify-content:center;gap:calc(var(--unit) * .08);padding:clamp(8px,calc(var(--unit) * .12),14px) clamp(6px,calc(var(--unit) * .1),12px);min-height:clamp(36px,calc(var(--unit) * .5),44px);font-size:clamp(13px,calc(var(--unit) * .18),16px);font-weight:600;color:var(--color-text-secondary);background:linear-gradient(180deg,rgba(255,255,255,.03),transparent 60%),#16121ed9;border:1px solid rgba(255,255,255,.08);border-radius:var(--iconBoxRadius);cursor:pointer;box-shadow:0 2px 8px #00000040,inset 0 1px #ffffff0a;transition:all .15s ease}@media (hover: hover){.setup-pill:hover{background:linear-gradient(180deg,rgba(255,255,255,.05),transparent 60%),#1e182ae6;border-color:#d4a84b4d;color:#fff;box-shadow:0 4px 12px #00000059,inset 0 1px #ffffff0f}}.setup-pill.selected{background:linear-gradient(180deg,rgba(255,255,255,.05),transparent 50%),#d4a84b2e;border-color:#d4a84b8c;color:#f0dca8f2;box-shadow:0 4px 14px #0000004d,0 0 12px #d4a84b14,inset 0 1px #ffffff0f}.difficulty-pills{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(4px,calc(var(--unit) * .07),8px)}.difficulty-pills svg{display:none}@media (min-width: 400px){.difficulty-pills svg{display:block;flex-shrink:0}}.timer-pills{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(4px,calc(var(--unit) * .07),8px)}.timer-pill.full-width{grid-column:1 / -1}.tile-set-pills{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(4px,calc(var(--unit) * .07),8px)}.tile-set-count{font-size:clamp(10px,calc(var(--unit) * .13),12px);font-weight:500;opacity:.6;padding:2px clamp(4px,calc(var(--unit) * .06),7px);background:#ffffff1a;border-radius:4px}.setup-pill.selected .tile-set-count{background:#d4a84b40;opacity:.8}.setup-pill:disabled{opacity:.5;cursor:not-allowed}@media (min-width: 375px){.quick-play-btn{width:80%}}@media (min-width: 414px){.quick-play-btn{width:75%}}@media (min-width: 640px){.quick-play-btn{width:70%}}@media (min-width: 768px){.tagline-text{font-size:13px;letter-spacing:.14em}.tagline-row{margin:18px auto 16px}}@media (min-width: 1024px){.quick-play-btn{width:60%}}@media (min-width: 1280px){.quick-play-btn{width:55%}}.near-achievements{position:absolute;top:calc(var(--unit) * .3);left:calc(var(--unit) * .3);z-index:150;display:flex;flex-direction:column;gap:calc(var(--unit) * .1);animation:fadeSlideIn .4s ease-out .3s backwards}.near-achievement-item{position:relative;display:flex;align-items:center;gap:clamp(5px,calc(var(--unit) * .08),8px);padding:clamp(5px,calc(var(--unit) * .08),8px) clamp(8px,calc(var(--unit) * .14),12px);background:#16121ed1;border:1px solid rgba(212,168,75,.18);border-radius:clamp(8px,calc(var(--unit) * .12),12px);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transform-origin:top left;transition:border-color .2s,box-shadow .2s;box-shadow:0 4px 12px #0000004d;font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}.near-achievement-1{transform:scale(.92);opacity:.7}.near-achievement-2{transform:scale(.84);opacity:.45}.near-achievement-icon{font-size:clamp(14px,calc(var(--unit) * .24),20px);line-height:1;flex-shrink:0}.near-achievement-label{font-size:clamp(12px,calc(var(--unit) * .18),15px);font-weight:600;color:#f0dca8e0;white-space:nowrap;line-height:1}.near-achievement-remaining{font-size:clamp(10px,calc(var(--unit) * .14),12px);font-weight:500;color:#d4a84b8c;white-space:nowrap;line-height:1;margin-left:auto}.near-achievement-progress{width:clamp(32px,calc(var(--unit) * .6),48px);height:clamp(3px,calc(var(--unit) * .06),5px);background:#ffffff14;border-radius:3px;overflow:hidden;flex-shrink:0}.near-achievement-progress-fill{height:100%;background:linear-gradient(90deg,#d4a84b99,#d4a84be6);border-radius:3px;transition:width .3s ease}@media (hover: hover){.near-achievement-item:hover{border-color:#d4a84b59}}.near-achievement-item:active{border-color:#d4a84b66}.near-achievement-almost{border-color:#d4a84b66;box-shadow:0 4px 12px #0000004d,0 0 12px #d4a84b40;animation:nearGlow 2s ease-in-out infinite}.near-achievement-almost .near-achievement-remaining{color:#f0c864e6;font-weight:600}.near-achievement-almost .near-achievement-progress-fill{background:linear-gradient(90deg,#d4a84bcc,#f0c864)}@keyframes nearGlow{0%,to{box-shadow:0 4px 12px #0000004d,0 0 10px #d4a84b33}50%{box-shadow:0 4px 12px #0000004d,0 0 18px #d4a84b66}}.near-achievement-bump{position:absolute;right:-4px;top:-4px;font-size:11px;font-weight:700;color:#fff;background:#4caf50e6;padding:1px 5px;border-radius:8px;line-height:1.3;animation:bumpPop 1.4s ease-out forwards;pointer-events:none}@keyframes bumpPop{0%{opacity:0;transform:translateY(4px) scale(.6)}15%{opacity:1;transform:translateY(0) scale(1.1)}25%{transform:translateY(0) scale(1)}75%{opacity:1}to{opacity:0;transform:translateY(-6px)}}.practice-stats-modal{min-width:min(320px,calc(100vw - 32px));max-width:min(400px,calc(100vw - 32px));padding:24px 20px}.stats-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.stats-title{font-size:1.1rem;font-weight:600;color:var(--color-text-primary);margin:0}.stats-close-x{background:none;border:none;width:44px;height:44px;margin:-12px -12px -12px 0;cursor:pointer;color:var(--color-text-secondary);display:flex;align-items:center;justify-content:center;transition:color .15s ease}@media (hover: hover){.stats-close-x:hover{color:var(--color-text-primary)}}.stats-tile-selector{display:flex;background:#ffffff0d;border-radius:var(--radius-md);padding:4px;gap:4px;margin-bottom:16px}.stats-tile-btn{flex:1;padding:6px 8px;border:none;border-radius:calc(var(--radius-md) - 2px);background:transparent;color:var(--color-text-secondary);font-size:.85rem;font-weight:600;cursor:pointer;transition:all .15s ease}@media (hover: hover){.stats-tile-btn:hover{color:var(--color-text-primary)}}.stats-tile-btn.active{background:#d4a84b40;color:#fff8e6f2}.stats-list{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}.stats-row{display:flex;align-items:center;gap:8px;padding:10px 12px;background:#ffffff0d;border-radius:var(--radius-md)}.stats-row.empty{opacity:.5}.stats-preset-name{font-size:.9rem;font-weight:500;color:var(--color-text-primary);min-width:40px}.stats-avg{font-size:.9rem;font-weight:600;color:#d4a84be6;margin-left:auto}.stats-row.empty .stats-avg{color:var(--color-text-secondary)}.stats-clear-btn{padding:6px;border:none;border-radius:var(--radius-sm);background:transparent;color:var(--color-text-secondary);cursor:pointer;transition:all .15s ease;display:flex;align-items:center;justify-content:center}@media (hover: hover){.stats-clear-btn:hover:not(:disabled){background:#ef444426;color:#ef4444}}.stats-clear-btn:disabled{opacity:.3;cursor:not-allowed}.custom-preset-row .stats-preset-name{max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.stats-remove-btn{padding:6px;border:none;border-radius:var(--radius-sm);background:transparent;color:var(--color-text-secondary);cursor:pointer;transition:all .15s ease;display:flex;align-items:center;justify-content:center}@media (hover: hover){.stats-remove-btn:hover{background:#ef444426;color:#ef4444}}.stats-clear-all-btn{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;padding:10px 16px;border:none;border-radius:var(--radius-md);background:#ef44441a;color:#ef4444;font-size:.85rem;font-weight:500;cursor:pointer;transition:all .15s ease}@media (hover: hover){.stats-clear-all-btn:hover:not(:disabled){background:#ef444433}}.stats-clear-all-btn:disabled{opacity:.4;cursor:not-allowed}@media (max-width: 360px){.practice-stats-modal{padding:20px 16px}.stats-title{font-size:1rem}.stats-tile-btn{padding:6px 4px;font-size:.8rem}.stats-row{padding:8px 10px}.stats-preset-name,.stats-avg{font-size:.85rem}}.custom-preset-modal{max-width:320px;padding:16px}.custom-preset-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.custom-preset-header h2{font-size:1.125rem;font-weight:600;margin:0}.custom-preset-header h2.duplicate{color:#ef4444}.custom-preset-close{background:none;border:none;width:44px;height:44px;margin:-12px -12px -12px 0;cursor:pointer;color:var(--text-secondary);border-radius:10px;display:flex;align-items:center;justify-content:center}@media (hover: hover){.custom-preset-close:hover{background:var(--bg-hover)}}.custom-preset-section{margin-bottom:16px}.custom-preset-label{display:block;font-size:.875rem;font-weight:500;color:#ffffffb3;margin-bottom:8px}.optional-hint{font-weight:400;color:#fff6;font-size:.75rem}.custom-preset-input{width:100%;padding:12px 14px;border:2px solid rgba(255,255,255,.15);border-radius:10px;font-size:1.1rem;font-weight:500;background:#0000004d;color:var(--text-primary)}.custom-preset-input::placeholder{color:#ffffff4d}.custom-preset-input:focus{outline:none;border-color:#d4a84b99;background:#0006;box-shadow:0 0 0 3px #d4a84b33}.custom-preset-toggles{display:flex;gap:8px;flex-wrap:wrap}.custom-preset-toggle{min-height:44px;padding:10px 16px;border:2px solid rgba(255,255,255,.15);border-radius:10px;background:#ffffff0d;color:#fff9;font-size:1rem;font-weight:600;cursor:pointer;transition:all .15s ease}.custom-preset-toggle.active{background:#d4a84b40;border-color:#d4a84b99;color:#fff8e6f2}.custom-preset-toggle:disabled{opacity:.4;cursor:not-allowed}@media (hover: hover){.custom-preset-toggle:hover:not(:disabled):not(.active){background:#ffffff1a;border-color:#ffffff40;color:#fffc}}.custom-preset-checkbox{display:flex;align-items:center;gap:10px;min-height:44px;margin-top:8px;cursor:pointer;font-size:.875rem;color:#ffffffb3}.custom-preset-checkbox input[type=checkbox]{width:22px;height:22px;accent-color:#D4A84B;cursor:pointer}.custom-preset-checkbox.disabled{opacity:.4;cursor:not-allowed}.custom-preset-checkbox.disabled input[type=checkbox]{cursor:not-allowed}.custom-preset-actions{display:flex;gap:12px;margin-top:20px}.custom-preset-cancel,.custom-preset-save{flex:1;min-height:44px;padding:12px;border-radius:10px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .15s ease}.custom-preset-cancel{background:var(--bg-secondary);border:1px solid var(--border-color);color:var(--text-primary)}.custom-preset-save{background:var(--primary-color);border:none;color:#fff}.custom-preset-save:disabled{opacity:.5;cursor:not-allowed}.custom-preset-delete{flex:1;min-height:44px;padding:12px;border-radius:10px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .15s ease;background:#ef444426;border:1px solid rgba(239,68,68,.3);color:#ef4444}@media (hover: hover){.custom-preset-cancel:hover{background:var(--bg-hover)}.custom-preset-save:hover:not(:disabled){filter:brightness(1.1)}.custom-preset-delete:hover{background:#ef444440;border-color:#ef444480}}.practice{--safe-area-bottom: env(safe-area-inset-bottom, 0px);--unit: calc((100dvh - var(--safe-area-bottom)) / 15.5);--header-height: calc(var(--unit) * .8);--rack-height: calc(var(--unit) * 1.3);--footer-height: calc(var(--unit) * 1.2);--max-width: min(calc(var(--unit) * 10.5), 100vw);--rack-max-width: min(calc(var(--unit) * 10.5), 100vw);--rack-tile-from-height: calc(var(--rack-height) * .75);--rack-tile-from-width: calc(var(--rack-max-width) / 10.2);--rack-tile-size: min( var(--rack-tile-from-height), var(--rack-tile-from-width) );--rack-gap: calc(var(--rack-tile-size) * .02);position:relative;width:100%;max-width:var(--max-width);height:100dvh;overflow:hidden;display:flex;flex-direction:column;background:transparent;color:#fff;margin:0 auto;padding-bottom:var(--safe-area-bottom);padding-top:clamp(4px,1vw,8px)}.practice:before{content:"";position:absolute;top:0;left:50%;transform:translate(-50%);width:120%;height:40%;background:radial-gradient(ellipse at 50% 0%,rgba(212,168,75,.06) 0%,transparent 70%);pointer-events:none;z-index:0}.practice-header{position:relative;z-index:1;height:var(--header-height);display:flex;align-items:center;justify-content:space-between;gap:clamp(8px,2vw,12px);padding:0 12px}.practice-back-btn{display:flex;align-items:center;justify-content:center;flex-shrink:0;height:100%;aspect-ratio:1;background:transparent;border:none;color:#fff;cursor:pointer;transition:all .15s ease}.practice-back-btn:active{transform:scale(.95)}.practice-back-btn svg{width:clamp(20px,5vw,28px);height:clamp(20px,5vw,28px)}.practice-header-actions{display:flex;gap:8px}.practice-settings-btn,.practice-stats-btn{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:36px;height:36px;background:#ffffff14;border:none;border-radius:10px;color:#ffffffb3;cursor:pointer;transition:all .15s ease}@media (hover: hover){.practice-settings-btn:hover,.practice-stats-btn:hover{background:#ffffff1f;color:#fff}}.practice-settings-btn:active,.practice-stats-btn:active{transform:scale(.95)}.practice-title{flex:1;min-width:0;font-size:1.2rem;font-weight:700;color:#fff;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.practice-selectors{display:flex;flex-direction:column;align-items:center;padding:6px 0}.selector-segment{display:flex;width:min(280px,calc(100vw - 48px));flex-shrink:0;background:#ffffff0f;border-radius:8px;padding:3px}.selector-btn{flex:1 1 0;min-width:0;padding:6px 4px;border-radius:6px;background:transparent;border:none;color:#ffffff80;font-size:.85rem;font-weight:600;cursor:pointer;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:all .15s}@media (hover: hover){.selector-btn:hover{color:#ffffffb3}}.selector-btn.active{background:#d4a84b40;color:#fff8e6f2;border:1px solid rgba(212,168,75,.6);box-shadow:0 1px 3px #0003,0 0 8px #d4a84b33,inset 0 1px #ffffff1a;margin:-1px}.practice-main{position:relative;z-index:1;flex:1;display:flex;flex-direction:column;min-height:0;padding:0 16px}.practice-stats{display:flex;justify-content:center;padding:8px 0;min-height:auto}.practice-stat{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;background:#ffffff0f;border-radius:20px;border:1px solid rgba(255,255,255,.08)}.practice-stat.stat-large{flex-direction:column;gap:6px;padding:12px 24px;background:radial-gradient(ellipse at 50% 30%,rgba(212,168,75,.08) 0%,rgba(255,255,255,.03) 60%,transparent 100%);border-radius:16px;min-width:100px}.stat-value{font-size:.85rem;font-weight:600;color:#ffffffb3;font-variant-numeric:tabular-nums;line-height:1}.stat-large .stat-value{font-size:2rem;font-weight:800;color:#fff}.stat-label{font-size:.75rem;font-weight:500;color:#fff6;text-transform:lowercase}.stat-large .stat-label{font-size:.7rem;text-transform:uppercase;letter-spacing:1px}.stat-spinner{animation:spin 1s linear infinite;opacity:.5}.stat-completed{color:var(--won-gold, #D4A84B)!important}.stat-warning{color:#ef4444!important}.practice-history-section{position:relative;flex:1;display:flex;flex-direction:column;min-height:0}.history-header{display:flex;align-items:center;justify-content:space-between;padding:8px 0;min-height:28px}.history-title{font-size:.8rem;font-weight:600;color:#ffffff80;text-transform:uppercase;letter-spacing:1px}.history-clear-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:6px;background:transparent;border:none;color:#ffffff4d;cursor:pointer;transition:all .2s}@media (hover: hover){.history-clear-btn:hover{background:#ef444426;color:#f87171}}.history-clear-btn:active{transform:scale(.95)}.practice-history{flex:1;display:flex;flex-direction:column;gap:6px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.2) transparent;min-height:0;padding-right:4px;padding-bottom:16px}.history-item{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;background:linear-gradient(135deg,#ffffff0f,#ffffff05);border-radius:10px;border:1px solid rgba(255,255,255,.04);flex-shrink:0;transition:background .2s ease}.practice-history:not(.examples-list) .history-item:first-child{background:linear-gradient(135deg,#d4a84b26,#d4a84b0d);border-color:#d4a84b33;border-left:3px solid rgba(212,168,75,.7);padding-left:10px;box-shadow:0 0 12px #d4a84b1a}.history-tiles{display:flex;gap:3px;--cell-size: min(28px, calc((100vw - 130px) / 9));pointer-events:none}.history-tiles .tile-small{width:var(--cell-size);height:var(--cell-size);flex-shrink:0}.history-meta{display:flex;align-items:center;gap:6px}.history-check{color:#d4a84be6;flex-shrink:0}.history-time{font-size:.85rem;font-weight:600;color:#d4a84bd9;font-variant-numeric:tabular-nums}.practice-player-area{position:relative;width:100%;display:flex;flex-direction:column;height:calc(var(--rack-height) + var(--footer-height));max-width:var(--max-width);margin-top:16px}.practice-rack-row{position:relative;z-index:10;display:flex;justify-content:center;align-items:flex-end;height:var(--rack-height);padding:0 12px}.practice-rack-tray{display:grid;justify-content:center;justify-items:center;align-items:center;background:radial-gradient(ellipse at 50% 18%,rgba(255,222,166,.18),transparent 62%),linear-gradient(180deg,#46261652,#1a0e0a9e),url(/wood-background.png) center/200% 200% no-repeat;border-radius:12px;outline:1px solid rgba(212,168,75,.18);outline-offset:0;box-shadow:0 8px 16px #00000080,inset 0 1px 1px #ffffff1f,inset 0 -2px 4px #0000004d;padding:0 8px;padding-bottom:calc(var(--rack-height) * .05)}.practice-rack-tray.shake{animation:shake .4s ease-in-out}@keyframes tile-jump-1{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-12px) rotate(-3deg)}}@keyframes tile-jump-2{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-10px) rotate(2deg)}}@keyframes tile-jump-3{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-14px) rotate(-1deg)}}.practice-rack-tray.rack-shuffle [data-rack-slot="0"]{animation:tile-jump-2 .25s ease-out}.practice-rack-tray.rack-shuffle [data-rack-slot="1"]{animation:tile-jump-1 .25s ease-out 20ms}.practice-rack-tray.rack-shuffle [data-rack-slot="2"]{animation:tile-jump-3 .25s ease-out}.practice-rack-tray.rack-shuffle [data-rack-slot="3"]{animation:tile-jump-1 .25s ease-out 30ms}.practice-rack-tray.rack-shuffle [data-rack-slot="4"]{animation:tile-jump-2 .25s ease-out 10ms}.practice-rack-tray.rack-shuffle [data-rack-slot="5"]{animation:tile-jump-3 .25s ease-out 25ms}.practice-rack-tray.rack-shuffle [data-rack-slot="6"]{animation:tile-jump-1 .25s ease-out}.practice-rack-tray.rack-shuffle [data-rack-slot="7"]{animation:tile-jump-2 .25s ease-out 15ms}.practice-rack-tray.rack-shuffle [data-rack-slot="8"]{animation:tile-jump-3 .25s ease-out 5ms}.practice-rack-tray.rack-shuffle [data-rack-slot="9"]{animation:tile-jump-1 .25s ease-out 35ms}@keyframes tile-pop{0%{transform:scale(.7);opacity:.5}60%{transform:scale(1.08);opacity:1}to{transform:scale(1);opacity:1}}.practice-rack-tray.new-puzzle [data-rack-slot="0"]{animation:tile-pop .25s ease-out}.practice-rack-tray.new-puzzle [data-rack-slot="1"]{animation:tile-pop .25s ease-out 20ms}.practice-rack-tray.new-puzzle [data-rack-slot="2"]{animation:tile-pop .25s ease-out 40ms}.practice-rack-tray.new-puzzle [data-rack-slot="3"]{animation:tile-pop .25s ease-out 60ms}.practice-rack-tray.new-puzzle [data-rack-slot="4"]{animation:tile-pop .25s ease-out 80ms}.practice-rack-tray.new-puzzle [data-rack-slot="5"]{animation:tile-pop .25s ease-out .1s}.practice-rack-tray.new-puzzle [data-rack-slot="6"]{animation:tile-pop .25s ease-out .12s}.practice-rack-tray.new-puzzle [data-rack-slot="7"]{animation:tile-pop .25s ease-out .14s}.practice-rack-tray.new-puzzle [data-rack-slot="8"]{animation:tile-pop .25s ease-out .16s}.practice-rack-tray.new-puzzle [data-rack-slot="9"]{animation:tile-pop .25s ease-out .18s}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-8px)}40%{transform:translate(8px)}60%{transform:translate(-6px)}80%{transform:translate(6px)}}.tile-medium.tile-error{animation:bingo-tile-error-flash .4s ease-out}@keyframes bingo-tile-error-flash{0%{background:linear-gradient(160deg,#dc4545,#b83030);box-shadow:inset 0 1px #ffffff40,0 0 12px #dc3c3c99,0 2px 4px #0006}50%{background:linear-gradient(160deg,#e55555,#c84040);box-shadow:inset 0 1px #ffffff4d,0 0 16px #e65050b3,0 2px 4px #0006}to{background:var(--tile-bg-gradient);box-shadow:inset 0 1px #fff6,0 2px 4px #0006,0 3px 6px #0003}}.tile-medium.tile-error .tile-value{animation:bingo-tile-error-text .4s ease-out}@keyframes bingo-tile-error-text{0%,50%{color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.5)}to{color:var(--tile-text);text-shadow:var(--tile-text-shadow)}}.practice-shelf{position:absolute;left:0;right:0;bottom:calc(-1 * var(--safe-area-bottom));height:calc(var(--footer-height) + var(--safe-area-bottom));background:radial-gradient(ellipse at 50% 10%,rgba(255,255,255,.12),transparent 62%),radial-gradient(ellipse at 50% 115%,rgba(0,0,0,.35),transparent 65%),linear-gradient(180deg,#2e203edb,#140c20e6);border-radius:18px 18px 0 0;border-top:1px solid rgba(212,168,75,.25);box-shadow:inset 0 1px 1px #ffffff14,0 -4px 12px #00000059;pointer-events:none}.practice-player-area:has(.practice-rack-tray.success) .practice-shelf{background:radial-gradient(ellipse at 50% 10%,rgba(212,168,75,.3),transparent 62%),radial-gradient(ellipse at 50% 115%,rgba(0,0,0,.35),transparent 65%),linear-gradient(180deg,#2e203edb,#140c20e6);border-top-color:#d4a84b66}.practice-footer{position:relative;z-index:10;display:grid;align-items:center;height:var(--footer-height);padding:0 16px;grid-template-columns:1fr 1fr 3fr 1fr 1fr;gap:1rem}.practice-footer-btn{display:flex;align-items:center;justify-content:center;height:clamp(36px,8vw,44px);border-radius:12px;background:#ffffff14;border:none;color:#ffffffb3;font-size:clamp(.8rem,2.5vw,.9rem);font-weight:600;cursor:pointer;transition:all .15s ease}@media (hover: hover){.practice-footer-btn:hover{background:#ffffff1f;color:#fff}}.practice-footer-btn:active{transform:scale(.95)}.practice-footer-btn.disabled{opacity:.3;cursor:not-allowed}.practice-footer-btn.disabled:active{transform:none}.practice-timer{justify-self:end;display:flex;align-items:center;gap:8px}.practice-giveup-btn{justify-self:center;display:flex;align-items:center;justify-content:center;width:clamp(32px,7vw,40px);height:clamp(32px,7vw,40px);border-radius:8px;background:transparent;border:2px solid rgba(239,68,68,.6);color:#ef4444;cursor:pointer;transition:all .15s ease}@media (hover: hover){.practice-giveup-btn:hover:not(:disabled){background:#ef44441a;border-color:#ef4444}}.practice-giveup-btn:active:not(:disabled){transform:scale(.95)}.practice-giveup-btn:disabled{opacity:.3;cursor:not-allowed;border-color:#fff3;color:#ffffff4d}.timer-value{font-size:clamp(1.1rem,3.5vw,1.4rem);font-weight:700;color:#ffffffd9;font-variant-numeric:tabular-nums}.timer-value.timer-inactive{opacity:.3}.timer-value.timer-success{color:var(--won-gold, #D4A84B)}.timer-value.timer-revealed{color:#ef4444}.practice-rack-tray .tile{transition:none}.practice-rack-tray .tile-medium{--rack-size: var(--bingo-tile-size, var(--rack-tile-size));--edge-size: calc(var(--rack-size) * .06);width:calc(var(--rack-size) - 2px);height:calc(var(--rack-size) - 2px);font-size:calc(var(--rack-size) * .52);border-radius:calc(var(--rack-size) * .15)}.practice-rack-tray .tile-medium .tile-points{font-size:calc(var(--rack-size) * .2);bottom:calc(var(--rack-size) * .04);right:calc(var(--rack-size) * .08)}.practice-rack-tray .tile-success{box-shadow:0 0 20px #d4a84b80,0 3px 6px #0006}.practice-rack-tray .tile-revealed{box-shadow:0 0 16px #60a5fa66,0 3px 6px #0006}.practice-player-area:has(.practice-rack-tray.revealed) .practice-shelf{background:radial-gradient(ellipse at 50% 10%,rgba(96,165,250,.2),transparent 62%),radial-gradient(ellipse at 50% 115%,rgba(0,0,0,.35),transparent 65%),linear-gradient(180deg,#2e203edb,#140c20e6);border-top-color:#60a5fa4d}.practice-rack-tray.revealed{outline-color:#60a5fa4d}.practice-tile-hidden{width:calc(var(--bingo-tile-size, var(--rack-tile-size)) - 2px);height:calc(var(--bingo-tile-size, var(--rack-tile-size)) - 2px);border-radius:calc(var(--bingo-tile-size, var(--rack-tile-size)) * .15);position:relative;overflow:hidden;background:linear-gradient(165deg,#372d48f5,#282037fa);border:1px solid rgba(255,255,255,.15);box-shadow:inset 1px 1px #ffffff14,inset -1px -1px 2px #00000059,inset 0 2px 4px #00000080,0 2px 4px #00000059;display:flex;align-items:center;justify-content:center}.practice-tile-hidden:before{content:"";position:absolute;top:6%;right:6%;bottom:6%;left:6%;border-radius:calc(var(--bingo-tile-size, var(--rack-tile-size)) * .14);border:1px solid rgba(255,255,255,.08);box-shadow:inset 0 1px 1px #ffffff1a;opacity:.5;pointer-events:none}.practice-tile-hidden:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;background:linear-gradient(180deg,#ffffff26,#fff0 50%);opacity:.45;pointer-events:none}.practice-tile-logo{font-family:Cinzel,Times New Roman,serif;font-size:calc(var(--bingo-tile-size, var(--rack-tile-size)) * .34);font-weight:800;color:#e8e0d08c;text-shadow:0 1px 2px rgba(0,0,0,.5);-webkit-user-select:none;user-select:none;position:relative;z-index:1}@media (max-width: 359px){.practice-header{gap:6px;padding:0 8px}.practice-title{font-size:.9rem}.practice-stats{padding:6px 0}.stat-large .stat-value{font-size:1.5rem}.stat-large .stat-label{font-size:.6rem}.practice-main{padding:0 12px}.history-item{padding:8px 10px;min-height:36px}.history-tiles{--cell-size: min(22px, calc((100vw - 100px) / 9));gap:2px}.history-time{font-size:.75rem}.practice-footer{padding:0 12px;gap:.5rem}}@media (min-width: 360px) and (max-width: 479px){.history-tiles{--cell-size: min(26px, calc((100vw - 120px) / 9))}}@media (min-width: 480px){.practice-header{padding:0 16px}.practice-title{font-size:1.4rem}.practice-stats{padding:10px 0}.stat-large .stat-value{font-size:2.5rem}.stat-large .stat-label{font-size:.75rem}.history-item{padding:10px 16px}.history-tiles{--cell-size: min(32px, calc((100vw - 140px) / 9));gap:4px}.history-time{font-size:.9rem}}@media (min-width: 640px){.stat-large .stat-value{font-size:3rem}.history-tiles{--cell-size: 36px;gap:5px}.practice-history{gap:8px}}.selector-row{display:flex;justify-content:center;align-items:center;width:100%;gap:6px}.row-spacer{width:36px;flex-shrink:0}.selector-label{width:36px;flex-shrink:0;font-size:.65rem;font-weight:600;color:#ffffff59;text-transform:uppercase;letter-spacing:.5px;text-align:right;padding-right:2px}.presets-group{gap:6px}.custom-presets-segment{gap:4px;justify-content:flex-start;background:transparent;padding:0}.custom-preset-btn{flex:0 0 calc((280px - 8px) / 3);min-width:0;padding:6px 10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center;background:#ffffff0f;border-radius:6px}.add-preset-btn{flex:0 0 auto;width:36px;padding:6px;display:flex;align-items:center;justify-content:center;color:#fff6;border:1px dashed rgba(255,255,255,.2);background:transparent}@media (hover: hover){.add-preset-btn:hover{color:#ffffffb3;border-color:#fff6;background:#ffffff0d}}.daily-challenge{--safe-area-bottom: env(safe-area-inset-bottom, 0px);--unit: calc((100dvh - var(--safe-area-bottom)) / 15.5);--rack-max-width: min(calc(var(--unit) * 7), 80vw);--rack-height: calc(var(--unit) * 1);--gold-light: #d4a84b;--gold-mid: #b8956b;--gold-dark: #8b6e4e;--gold-glow: rgba(212, 168, 75, .4);--teal: #14b8a6;--teal-light: #5eead4;--teal-dark: #0d9488;--teal-glow: rgba(20, 184, 166, .3);position:relative;width:100%;max-width:min(calc(var(--unit) * 10.5),100vw);height:100dvh;overflow:hidden;display:flex;flex-direction:column;background:transparent;color:#fff;margin:0 auto;padding:clamp(8px,2vw,16px);padding-bottom:var(--safe-area-bottom)}.daily-header{display:flex;align-items:center;gap:12px;padding:8px 4px;flex-shrink:0}.daily-back-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:transparent;border:none;color:#fff;cursor:pointer;transition:transform .15s ease}.daily-back-btn:active{transform:scale(.95)}.daily-header-title{flex:1;font-size:1.25rem;font-weight:700;color:#fff}.daily-streak-badge{--streak-color: #fb923c;display:flex;align-items:center;gap:6px;padding:6px 14px;background:color-mix(in srgb,var(--streak-color) 15%,transparent);border:1px solid color-mix(in srgb,var(--streak-color) 30%,transparent);border-radius:20px;font-size:.9rem;font-weight:600;color:var(--streak-color)}.daily-streak-icon{font-size:1rem}.daily-body{flex:1;display:flex;align-items:center;justify-content:center;min-height:0;padding:0 16px}.daily-card{position:relative;width:100%;max-width:min(calc(var(--unit) * 7.5 + 40px),85vw);padding:3px;border-radius:20px;background:linear-gradient(180deg,var(--gold-light) 0%,var(--gold-dark) 50%,var(--gold-light) 100%)}.daily-card:before{content:"";position:absolute;top:3px;right:3px;bottom:3px;left:3px;border-radius:17px;background:linear-gradient(180deg,#2d2337fa,#1e1626);z-index:0}.daily-card:after{content:"";position:absolute;top:3px;left:15%;right:15%;height:1px;background:linear-gradient(90deg,transparent 0%,var(--gold-light) 30%,#fff8e1 50%,var(--gold-light) 70%,transparent 100%);box-shadow:0 0 20px var(--gold-glow);z-index:1}.daily-card.success{padding:2px;background:linear-gradient(180deg,#d4a84bb3,#b8956b80,#d4a84bb3);box-shadow:0 0 24px #d4a84b33,0 0 48px #d4a84b14}.daily-card.success:before{top:2px;right:2px;bottom:2px;left:2px;border-radius:18px;box-shadow:inset 0 1px #ffffff14}.daily-card.success:after{top:2px;background:linear-gradient(90deg,transparent 0%,rgba(212,168,75,.6) 30%,rgba(255,248,225,.8) 50%,rgba(212,168,75,.6) 70%,transparent 100%);box-shadow:0 0 16px #d4a84b4d}.daily-card.completed{padding:2px;background:linear-gradient(180deg,#d4a84bb3,#b8956b80,#d4a84bb3);box-shadow:0 0 24px #d4a84b33,0 0 48px #d4a84b14}.daily-card.completed:before{top:2px;right:2px;bottom:2px;left:2px;border-radius:18px;box-shadow:inset 0 1px #ffffff14}.daily-card.completed:after{top:2px;background:linear-gradient(90deg,transparent 0%,rgba(212,168,75,.6) 30%,rgba(255,248,225,.8) 50%,rgba(212,168,75,.6) 70%,transparent 100%);box-shadow:0 0 16px #d4a84b4d}.daily-card-content{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:20px;padding:28px 8px 32px}.daily-title-slot{position:relative;height:80px;display:flex;align-items:center;justify-content:center;width:100%}.daily-badge-slot{position:relative;height:40px;display:flex;align-items:center;justify-content:center;width:100%}.daily-title-section{display:flex;flex-direction:column;align-items:center;gap:4px;transition:opacity .3s ease,transform .3s ease}.daily-title-section.hidden{opacity:0;visibility:hidden;position:absolute;pointer-events:none}.daily-card-title{position:relative;display:flex;align-items:center;gap:8px;font-size:1.6rem;font-weight:800;color:var(--gold-light);margin:0;padding-bottom:10px;text-shadow:0 2px 4px rgba(0,0,0,.3)}.daily-card-title:after{content:"";position:absolute;bottom:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent 5%,var(--gold-light) 30%,var(--gold-light) 70%,transparent 95%)}.daily-title-icon{font-size:1.3rem}.daily-date{font-size:1rem;font-weight:500;color:#ffffffe6;margin-top:4px}.daily-puzzle-number{font-size:.85rem;color:#ffffff80}.daily-hud-section{display:flex;flex-direction:column;align-items:center;gap:8px;width:100%;transition:opacity .3s ease,transform .3s ease}.daily-hud-section.hidden{opacity:0;visibility:hidden;position:absolute;pointer-events:none}.daily-hud-header{display:flex;align-items:center;gap:8px;opacity:.5}.daily-hud-title{font-size:.85rem;font-weight:600;color:#fffc}.daily-hud-date{font-size:.8rem;color:#fff9}.daily-hud-date:before{content:"•";margin-right:8px}.daily-hud-timer{display:flex;flex-direction:column;align-items:center;gap:2px}.daily-timer-label{font-size:.65rem;font-weight:600;letter-spacing:1.5px;color:#fff6;text-transform:uppercase}.daily-timer{font-size:1.6rem;font-weight:700;color:var(--teal-light);font-variant-numeric:tabular-nums;text-shadow:0 0 16px var(--teal-glow)}.daily-tiles-section{width:100%;display:flex;justify-content:center;padding:8px 0;overflow:visible}.daily-rack-tray{--rack-max-width: min(calc(var(--unit) * 7), 80vw);--rack-height: calc(var(--unit) * 1);--rack-tile-from-height: calc(var(--rack-height) * .65);--rack-tile-from-width: calc(var(--rack-max-width) / 10.5);--rack-tile-size: min( var(--rack-tile-from-height), var(--rack-tile-from-width) )}@keyframes daily-tile-jump-1{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-12px) rotate(-3deg)}}@keyframes daily-tile-jump-2{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-10px) rotate(2deg)}}@keyframes daily-tile-jump-3{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-14px) rotate(-1deg)}}.daily-rack-tray.rack-shuffle [data-rack-slot="0"]{animation:daily-tile-jump-2 .25s ease-out}.daily-rack-tray.rack-shuffle [data-rack-slot="1"]{animation:daily-tile-jump-1 .25s ease-out 20ms}.daily-rack-tray.rack-shuffle [data-rack-slot="2"]{animation:daily-tile-jump-3 .25s ease-out}.daily-rack-tray.rack-shuffle [data-rack-slot="3"]{animation:daily-tile-jump-1 .25s ease-out 30ms}.daily-rack-tray.rack-shuffle [data-rack-slot="4"]{animation:daily-tile-jump-2 .25s ease-out 10ms}.daily-rack-tray.rack-shuffle [data-rack-slot="5"]{animation:daily-tile-jump-3 .25s ease-out 25ms}.daily-rack-tray.rack-shuffle [data-rack-slot="6"]{animation:daily-tile-jump-1 .25s ease-out}.daily-rack-tray.rack-shuffle [data-rack-slot="7"]{animation:daily-tile-jump-2 .25s ease-out 15ms}.daily-drag-tile{width:calc(var(--tile-size) - 2px)!important;height:calc(var(--tile-size) - 2px)!important;font-size:calc(var(--tile-size) * .52)!important;border-radius:calc(var(--tile-size) * .15)!important}.daily-difficulty-badge{display:flex;align-items:center;gap:8px;padding:8px 20px;background:#00000040;border:1px solid rgba(255,255,255,.1);border-radius:20px;font-size:.9rem;font-weight:500;color:#fffc;transition:opacity .3s ease,transform .3s ease}.daily-difficulty-badge.hidden{opacity:0;visibility:hidden;pointer-events:none}.daily-badge-icon{font-size:1rem}.daily-actions-slot{position:relative;height:56px;display:flex;align-items:center;justify-content:center;gap:12px;width:100%}.daily-main-btn{display:flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0 32px;font-size:1rem;font-weight:700;color:#fff;background:linear-gradient(180deg,var(--teal) 0%,var(--teal-dark) 100%);border:none;border-radius:12px;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 12px var(--teal-glow)}@media (hover: hover){.daily-main-btn:hover{transform:translateY(-2px);box-shadow:0 6px 16px var(--teal-glow)}}.daily-main-btn:active{transform:scale(.97)}.daily-main-btn.shaking{animation:daily-btn-shake .4s ease-in-out}.daily-side-btn{display:flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:12px;background:#ffffff14;border:1px solid rgba(255,255,255,.12);color:#ffffffb3;cursor:pointer;transition:all .15s ease}.daily-side-btn.hidden{opacity:0;visibility:hidden;width:0;padding:0;margin:0;overflow:hidden;pointer-events:none}@media (hover: hover){.daily-side-btn:hover:not(:disabled){background:#ffffff1f;border-color:#fff3;color:#fff}}.daily-side-btn:active:not(:disabled){transform:scale(.95)}.daily-side-btn:disabled{opacity:.3;cursor:not-allowed}.daily-giveup-btn{background:#ef444414;border-color:#ef444440;color:#ef4444cc}@media (hover: hover){.daily-giveup-btn:hover:not(:disabled){background:#ef44441f;border-color:#ef444466;color:#ef4444}}@keyframes daily-btn-shake{0%,to{transform:translate(0)}20%{transform:translate(-4px)}40%{transform:translate(4px)}60%{transform:translate(-3px)}80%{transform:translate(3px)}}.daily-control-btn{display:flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:12px;background:#ffffff14;border:1px solid rgba(255,255,255,.12);color:#ffffffb3;cursor:pointer;transition:all .15s ease}@media (hover: hover){.daily-control-btn:hover:not(:disabled){background:#ffffff1f;color:#fff}}.daily-control-btn:active:not(:disabled){transform:scale(.95)}.daily-control-btn:disabled{opacity:.3;cursor:not-allowed}.daily-result-icon{font-size:3rem;margin-bottom:0;animation:daily-icon-entrance .5s ease-out}.daily-card.success .daily-result-icon{filter:drop-shadow(0 0 16px rgba(212,168,75,.5)) drop-shadow(0 0 32px rgba(251,191,36,.3))}.daily-result-icon.completed-icon{display:flex;align-items:center;justify-content:center;width:64px;height:64px;background:linear-gradient(180deg,#d4a84b4d,#b8956b2e);border:2px solid rgba(212,168,75,.45);border-radius:50%;color:var(--gold-light);box-shadow:0 0 24px #d4a84b59,0 0 48px #d4a84b26,inset 0 2px #fff3,inset 0 -1px #00000026}.daily-result-icon.completed-icon svg{filter:drop-shadow(0 0 6px rgba(212,168,75,.5)) drop-shadow(0 2px 3px rgba(0,0,0,.25))}@keyframes daily-icon-entrance{0%{opacity:0;transform:scale(.5)}50%{transform:scale(1.1)}to{opacity:1;transform:scale(1)}}.daily-card.success .daily-card-title{font-size:1.6rem;font-weight:700;background:linear-gradient(180deg,#fffdf5 0%,var(--gold-light) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-shadow:none;filter:drop-shadow(0 2px 6px rgba(212,168,75,.3))}.daily-card.success .daily-card-title:after{background:linear-gradient(90deg,transparent 5%,rgba(212,168,75,.5) 30%,rgba(212,168,75,.5) 70%,transparent 95%)}.daily-result-stats{display:flex;gap:10px;font-size:.9rem;color:#fffffff2}.daily-stat-pill{display:flex;align-items:center;gap:6px;padding:8px 16px;background:linear-gradient(180deg,#ffffff14,#d4a84b0f);border:1px solid rgba(212,168,75,.3);border-radius:20px;font-weight:600;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:inset 0 1px #ffffff1f,inset 0 -1px #00000026,0 2px 6px #00000026}.daily-stat-pill svg{opacity:.85;color:var(--gold-light)}.daily-streak-visual{--streak-color: #fb923c;position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;padding:18px 32px;background:linear-gradient(180deg,color-mix(in srgb,var(--streak-color) 12%,transparent),color-mix(in srgb,var(--streak-color) 8%,transparent));border-radius:16px;border:1px solid color-mix(in srgb,var(--streak-color) 30%,transparent);box-shadow:0 0 20px color-mix(in srgb,var(--streak-color) 12%,transparent),inset 0 1px #ffffff14;animation:daily-streak-glow 2.5s ease-in-out infinite alternate}@keyframes daily-streak-glow{0%{box-shadow:0 0 16px color-mix(in srgb,var(--streak-color) 10%,transparent),inset 0 1px #ffffff14}to{box-shadow:0 0 28px color-mix(in srgb,var(--streak-color) 20%,transparent),inset 0 1px #ffffff14}}.daily-streak-visual.milestone{animation:milestone-pulse .6s ease-out,daily-streak-glow 2.5s ease-in-out .6s infinite alternate}.daily-streak-visual.milestone:before{content:"";position:absolute;top:-8px;right:-8px;bottom:-8px;left:-8px;border-radius:20px;border:2px solid var(--streak-color);animation:milestone-ring 1s ease-out forwards;pointer-events:none}@keyframes milestone-pulse{0%{transform:scale(.9);opacity:.7}50%{transform:scale(1.05)}to{transform:scale(1);opacity:1}}@keyframes milestone-ring{0%{opacity:.8;transform:scale(.95)}70%{opacity:.3;transform:scale(1.08)}to{opacity:0;transform:scale(1.12)}}.daily-milestone-text{font-size:.8rem;font-weight:700;color:var(--streak-color);text-transform:uppercase;letter-spacing:1px;animation:milestone-text-in .5s ease-out .3s both}@keyframes milestone-text-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.daily-streak-label{font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:1.5px;color:color-mix(in srgb,var(--streak-color) 70%,transparent)}.daily-streak-fires{font-size:2rem;filter:drop-shadow(0 0 6px color-mix(in srgb,var(--streak-color) 40%,transparent))}.daily-streak-count{font-size:1.1rem;font-weight:700;color:var(--gold-light)}.daily-streak-count .streak-number{font-size:1.65rem;font-weight:800;color:var(--streak-color);text-shadow:0 1px 2px rgba(0,0,0,.2)}.daily-streak-count .streak-unit{font-size:.9rem;font-weight:500;color:color-mix(in srgb,var(--streak-color) 65%,transparent)}.daily-countdown{display:flex;align-items:center;gap:6px;font-size:.8rem;color:#fff6}.daily-countdown svg{opacity:.6}.daily-countdown-chip{display:flex;align-items:center;gap:8px;padding:10px 18px;margin-top:-8px;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);border-radius:12px;font-size:.85rem;color:#ffffffb3;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}.daily-countdown-chip svg{opacity:.6;flex-shrink:0}.daily-countdown-chip strong{color:#fffffff2;font-weight:600;font-variant-numeric:tabular-nums}.daily-answer-label{font-size:.85rem;color:#ffffff80}.daily-solution-rack{padding:10px 10px 14px!important;background:linear-gradient(180deg,#d4a84b0f,#b8956b08);border:1px solid rgba(212,168,75,.15);border-radius:12px;box-shadow:inset 0 1px #ffffff0a,0 2px 6px #0000001a;height:auto!important}.daily-card.success .daily-solution-rack{border-color:#d4a84b40;box-shadow:inset 0 1px #ffffff0f,0 0 12px #d4a84b14,0 2px 6px #0000001f}.daily-solution-row{display:flex;gap:6px;padding:10px 10px 14px;background:#ffffff0d;border-radius:10px}.daily-solution-row.success{box-shadow:0 0 10px #d4a84b1a}.daily-solution-tile{width:clamp(27px,6.3vw,34px);height:clamp(27px,6.3vw,34px);border-radius:5px;background:linear-gradient(160deg,var(--gold-mid) 0%,var(--gold-dark) 100%);display:flex;align-items:center;justify-content:center;font-size:clamp(.75rem,2.2vw,.9rem);font-weight:700;color:#1a1207;box-shadow:0 2px 4px #0000004d}.daily-card-actions{display:flex;gap:12px;width:100%;max-width:280px}.daily-btn-primary{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0 20px;font-size:1rem;font-weight:600;color:#fff;background:linear-gradient(180deg,var(--teal) 0%,var(--teal-dark) 100%);border:none;border-radius:12px;cursor:pointer;transition:all .15s ease;box-shadow:0 4px 12px var(--teal-glow)}@media (hover: hover){.daily-btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 16px var(--teal-glow)}}.daily-btn-primary:active{transform:scale(.97)}.daily-card.success .daily-btn-primary,.daily-card.completed .daily-btn-primary{background:linear-gradient(180deg,var(--gold-light) 0%,#a67c30 100%);color:#1a1207;box-shadow:0 4px 12px var(--gold-glow)}@media (hover: hover){.daily-card.success .daily-btn-primary:hover,.daily-card.completed .daily-btn-primary:hover{box-shadow:0 6px 16px var(--gold-glow)}}.daily-card.completed .daily-card-title{color:var(--gold-light);background:none;-webkit-text-fill-color:unset;filter:none;text-shadow:0 2px 4px rgba(0,0,0,.3)}.daily-btn-secondary{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;height:48px;padding:0 20px;font-size:1rem;font-weight:500;color:#ffffffbf;background:#ffffff0a;border:1px solid rgba(255,255,255,.2);border-radius:12px;cursor:pointer;transition:all .15s ease}@media (hover: hover){.daily-btn-secondary:hover{color:#ffffffe6;background:#ffffff14;border-color:#ffffff40}}.daily-btn-secondary:active{transform:scale(.97)}.daily-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;color:#fff9}.daily-spinner{width:40px;height:40px;border:3px solid rgba(255,255,255,.1);border-top-color:var(--teal);border-radius:50%;animation:daily-spin 1s linear infinite}@keyframes daily-spin{to{transform:rotate(360deg)}}.daily-error{display:flex;flex-direction:column;align-items:center;gap:16px;color:#f87171}@media (max-width: 359px){.daily-header-title{font-size:1.1rem}.daily-card-title{font-size:1.2rem}.daily-start-btn{padding:12px 36px;font-size:1.05rem}}@media (min-width: 480px){.daily-card-content{padding:28px 24px 32px}.daily-card-title{font-size:1.5rem}.daily-start-btn{padding:16px 56px;font-size:1.2rem}}.waiting-page{--safe-area-bottom: env(safe-area-inset-bottom, 0px);--unit: calc((100dvh - var(--safe-area-bottom)) / 15.5);--teal: #14b8a6;--teal-light: #5eead4;--teal-dark: #0d9488;--teal-glow: rgba(20, 184, 166, .3);--gold-light: #d4a84b;--gold-mid: #b8956b;--gold-dark: #8b6e4e;--gold-glow: rgba(212, 168, 75, .4);position:relative;width:100%;max-width:min(calc(var(--unit) * 10.5),100vw);height:100dvh;overflow:hidden;display:flex;flex-direction:column;background:transparent;color:#fff;margin:0 auto;padding:clamp(8px,2vw,16px);padding-bottom:var(--safe-area-bottom)}.waiting-header{display:flex;align-items:center;gap:12px;padding:8px 4px;flex-shrink:0}.waiting-header .back-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;background:transparent;border:none;color:#fff;font-size:1.1rem;cursor:pointer;transition:transform .15s ease}.waiting-header .back-btn:active{transform:scale(.95)}.waiting-header .back-btn:disabled{opacity:.5;cursor:not-allowed}.waiting-header h2{flex:1;font-size:1.25rem;font-weight:800;color:#fff;margin:0}.waiting-online-badge{display:flex;align-items:center;gap:5px;padding:4px 10px;background:linear-gradient(135deg,#22c55e33,#16a34a26);border:1px solid rgba(34,197,94,.35);border-radius:8px;font-size:max(11px,.7rem);font-weight:600;color:#4ade80;white-space:nowrap;flex-shrink:0}.waiting-online-dot{width:6px;height:6px;border-radius:50%;background:#4ade80;animation:online-pulse-wr 2s ease-in-out infinite}@keyframes online-pulse-wr{0%,to{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(.85)}}.waiting-content{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:0;padding:0 8px 48px}.waiting-card{position:relative;width:100%;max-width:min(calc(var(--unit) * 8 + 40px),88vw);padding:2px;border-radius:26px;border:2px solid rgba(212,168,75,.78);background:radial-gradient(1100px 520px at 50% 0%,rgba(212,168,75,.12),transparent 62%),radial-gradient(900px 420px at 50% 25%,rgba(255,255,255,.07),transparent 60%),linear-gradient(180deg,#ffffff08,#0000002e),linear-gradient(180deg,#1b1426,#120c1a);box-shadow:inset 0 0 0 1px #ffffff0f,0 20px 70px #00000085;filter:drop-shadow(0 0 22px rgba(212,168,75,.18))}.waiting-card:after{content:"";position:absolute;top:3px;left:15%;right:15%;height:1px;background:linear-gradient(90deg,transparent 0%,var(--gold-light) 30%,#fff8e1 50%,var(--gold-light) 70%,transparent 100%);box-shadow:0 0 20px var(--gold-glow);z-index:1}.waiting-card-content{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;padding:clamp(20px,4vw,28px) clamp(16px,3.5vw,26px) clamp(18px,3.5vw,24px)}.waiting-card-content>*+.room-code-display{margin-top:12px}.waiting-card-content>.room-code-display+.room-settings{margin-top:14px}.waiting-card-content>.start-countdown+.room-settings{margin-top:14px}.waiting-card-content>.room-settings+.players-section{margin-top:14px}.waiting-card-content>.players-section+.start-game-btn,.waiting-card-content>.players-section+.waiting-message{margin-top:18px}.start-countdown{display:flex;align-items:center;justify-content:center;gap:6px;padding:6px 14px;font-size:.75rem;font-weight:600;color:#ffffffc7;background:linear-gradient(180deg,#ffffff12,#ffffff05);border:1px solid rgba(255,255,255,.14);border-radius:999px;box-shadow:inset 0 0 0 1px #ffffff0d,0 10px 22px #0003}.start-countdown svg{color:#14b8a6cc}.start-countdown.expiring-soon{color:#f97316;background:#f973161f;border-color:#f973164d;animation:pulse-warning 1s ease-in-out infinite}@keyframes pulse-warning{0%,to{opacity:1}50%{opacity:.7}}.room-code-display{display:flex;flex-direction:column;align-items:center;gap:6px;width:100%}.room-code-label{display:flex;align-items:center;justify-content:center;gap:5px;font-size:11px;font-weight:600;color:#ffffff94;text-transform:uppercase;letter-spacing:.2em}.room-code-label svg{opacity:.8;vertical-align:middle;margin-top:1px}.room-code-box{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;padding:16px 14px;background:linear-gradient(180deg,#ffffff0e,#ffffff03);border:1px solid rgba(212,168,75,.22);border-radius:18px;box-shadow:inset 0 0 0 1px #ffffff12,0 14px 34px #00000047,0 10px 26px #d4a84b14}.room-code-value{width:100%;text-align:center;font-size:clamp(32px,10vw,44px);font-weight:800;font-family:SF Mono,Roboto Mono,monospace;letter-spacing:.18em;color:#39e6d1;text-shadow:0 0 22px rgba(20,184,166,.22),0 0 44px rgba(20,184,166,.09)}.copy-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;border:1px solid rgba(20,184,166,.44);border-radius:12px;background:#14b8a629;color:#b4f0e6cc;cursor:pointer;transition:all .15s ease;flex-shrink:0;box-shadow:0 8px 18px #0003}@media (hover: hover){.copy-btn:hover{background:#14b8a640;border-color:#14b8a699;color:#fff}}.copy-btn:active{transform:scale(.95)}.copy-btn.copied{background:#14b8a659;border-color:var(--teal);color:#fff}.share-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;border:1px solid rgba(20,184,166,.44);border-radius:12px;background:#14b8a629;color:#b4f0e6cc;cursor:pointer;transition:all .15s ease;flex-shrink:0;box-shadow:0 8px 18px #0003}@media (hover: hover){.share-btn:hover{background:#14b8a640;border-color:#14b8a699;color:#fff}}.share-btn:active{transform:scale(.95)}.room-settings{display:flex;gap:10px;width:100%}.setting-item{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;justify-content:center;padding:12px;border-radius:14px;background:linear-gradient(180deg,#ffffff13,#ffffff05);border:1px solid rgba(255,255,255,.13);box-shadow:inset 0 0 0 1px #ffffff0d,0 10px 22px #0003}.setting-label{display:flex;align-items:center;gap:5px;font-size:11px;color:#fff9;text-transform:uppercase;letter-spacing:.2em}.setting-label svg{opacity:.6}.setting-value{font-size:.95rem;font-weight:700;color:#ffffffeb}.players-section{display:flex;flex-direction:column;gap:10px;width:100%;padding:14px;background:#00000029;border:1px solid rgba(255,255,255,.1);border-radius:20px;box-shadow:inset 0 0 0 1px #ffffff0a}.players-section h3{font-size:11px;font-weight:600;color:#ffffff94;text-transform:uppercase;letter-spacing:.2em;margin:0 0 2px 2px}.players-list{display:flex;flex-direction:column;gap:10px}.player-slot{display:flex;align-items:center;gap:12px;padding:12px 14px;background:#ffffff06;border:1.5px solid rgba(255,255,255,.06);border-radius:16px;transition:all .15s ease}.player-slot.host{border:1px solid rgba(20,184,166,.22);background:linear-gradient(180deg,#14b8a61c,#00000024);box-shadow:0 10px 22px #00000038}.player-slot.guest{border:1px solid rgba(255,255,255,.1);background:linear-gradient(180deg,#14b8a60f,#0000001f);box-shadow:0 8px 18px #0000002e}.player-slot.empty{border:1px dashed rgba(255,255,255,.14);background:#0000001a;opacity:1}.player-avatar{display:flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:22%;background:linear-gradient(135deg,#14b8a659,#5eead459);color:#b4f0e6f2;flex-shrink:0;box-shadow:0 2px 8px #14b8a626;position:relative}.player-avatar img,.player-avatar .avatar-initials{overflow:hidden}.player-avatar img{width:100%;height:100%;object-fit:cover;border-radius:22%}.player-avatar .avatar-initials{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-size:.75rem;font-weight:700;text-transform:uppercase;color:#fffffff2}.player-slot.guest .player-avatar{background:linear-gradient(135deg,#5eead459,#99f6e459)}.empty-avatar{background:#ffffff14!important;color:#ffffff4d!important;font-size:1.1rem;font-weight:600;box-shadow:none!important}.invite-target-pending{opacity:.6}.invite-pending-label{color:var(--teal)!important;font-size:.65rem!important}.status-dot{position:absolute;bottom:0;right:0;width:10px;height:10px;border-radius:50%;border:2px solid rgba(30,22,38,1);z-index:1}.status-dot.online{background:#22c55e;box-shadow:0 0 6px #22c55e80}.status-dot.offline{background:#ef4444;box-shadow:0 0 6px #ef444480;animation:pulse-offline 1.5s ease-in-out infinite}.player-avatar:has(.status-dot.offline) img,.player-avatar:has(.status-dot.offline) .avatar-initials{opacity:.5;filter:grayscale(30%)}@keyframes pulse-offline{0%,to{opacity:1}50%{opacity:.5}}.player-info{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}.player-name-row{display:flex;align-items:center;gap:5px;min-width:0}.player-name{font-size:.95rem;font-weight:600;color:#fffffff2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.player-name.empty-name{font-weight:400;color:#ffffff6b;font-style:italic}.waiting-elapsed{font-size:.7rem;color:#ffffff4d;font-style:italic}.player-title-badge{font-size:.65rem;font-weight:600;color:#d4a84bd9;background:#d4a84b1f;border:1px solid rgba(212,168,75,.2);padding:1px 6px;border-radius:4px;white-space:nowrap;flex-shrink:0;max-width:80px;overflow:hidden;text-overflow:ellipsis}.player-title-badge.rarity-common{color:#b4bed2d9;background:#b4bed21f;border-color:#b4bed233}.player-title-badge.rarity-uncommon{color:#64c882d9;background:#64c8821f;border-color:#64c88233}.player-title-badge.rarity-rare{color:#64a0ffd9;background:#64a0ff1f;border-color:#64a0ff33}.player-title-badge.rarity-epic{color:#b482dcd9;background:#b482dc1f;border-color:#b482dc33}.player-title-badge.rarity-legendary{color:#d4a84bd9;background:#d4a84b1f;border-color:#d4a84b33}.player-title-badge.rarity-hidden{color:#d4a84bf2;background:#d4a84b26;border-color:#d4a84b4d;box-shadow:0 0 8px #d4a84b4d}.player-role{font-size:.65rem;color:#fff6;text-transform:uppercase;letter-spacing:.1em}.you-badge{padding:4px 10px;border-radius:999px;background:#14b8a62e;border:1px solid rgba(20,184,166,.46);color:#ffffffeb;font-size:.6rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em;box-shadow:0 0 18px #14b8a624}.waiting-indicator{display:flex;gap:4px;margin-left:auto}.waiting-indicator .dot{width:5px;height:5px;border-radius:50%;background:var(--teal);opacity:.6;animation:bounce 1.4s ease-in-out infinite both}.waiting-indicator .dot:nth-child(1){animation-delay:-.32s}.waiting-indicator .dot:nth-child(2){animation-delay:-.16s}@keyframes bounce{0%,80%,to{transform:scale(.6);opacity:.4}40%{transform:scale(1);opacity:1}}.invite-target-info{flex:1;min-width:0}.invite-countdown-bar{width:100%;height:3px;background:#ffffff14;border-radius:2px;overflow:hidden;margin-top:4px}.invite-countdown-fill{height:100%;background:var(--teal);border-radius:2px;transition:width 1s linear}.start-game-btn{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;padding:16px 24px;font-size:1rem;font-weight:800;color:#1a1425;background:linear-gradient(180deg,#f6d27a,#c9892b);border:none;border-radius:18px;cursor:pointer;transition:all .15s ease;box-shadow:inset 0 0 0 1px #ffffff1f,0 16px 34px #d4a84b47}@media (hover: hover){.start-game-btn:not(:disabled):hover{transform:translateY(-2px);box-shadow:0 14px 30px #d4a84b59}}.start-game-btn:active:not(:disabled){transform:scale(.97)}.start-game-btn:disabled{background:linear-gradient(180deg,#f6d27a26,#c9892b0f);border:1px solid rgba(212,168,75,.2);color:#ffffff8f;box-shadow:inset 0 0 0 1px #ffffff0a,0 12px 28px #00000047;cursor:not-allowed}.start-game-btn:disabled svg{opacity:.45}.waiting-message{display:flex;align-items:center;justify-content:center;width:100%;padding:16px;border-radius:18px;background:#ffffff0a;border:1px solid rgba(255,255,255,.08);color:#ffffff8c;font-size:.9rem}.loading-spinner{width:20px;height:20px;border:2px solid rgba(26,18,7,.3);border-top-color:#1a1207;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion: reduce){.waiting-online-dot,.start-countdown.expiring-soon,.status-dot.offline,.waiting-indicator .dot,.loading-spinner{animation:none}}.error-boundary{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:var(--color-bg-primary, #0f0f1a);padding:24px;z-index:9999}.error-boundary-content{display:flex;flex-direction:column;align-items:center;gap:16px;max-width:320px;text-align:center}.error-boundary-title{font-size:18px;font-weight:600;color:var(--won-text-primary, rgba(255, 255, 255, .95));margin:0}.error-boundary-message{font-size:14px;color:var(--won-text-muted, rgba(255, 255, 255, .45));margin:0;line-height:1.5}.error-boundary-actions{display:flex;flex-direction:column;gap:10px;width:100%;margin-top:8px}.error-boundary-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:12px 20px;border:none;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;transition:all .15s cubic-bezier(.32,.72,0,1)}.error-boundary-btn-primary{background:var(--won-gold-dark, #B8923A);color:#fff}@media (hover: hover){.error-boundary-btn-primary:hover{background:var(--won-gold, #D4A84B)}}.error-boundary-btn-primary:active{transform:translateY(1px)}.error-boundary-btn-secondary{background:#ffffff14;color:var(--won-text-secondary, rgba(255, 255, 255, .75))}@media (hover: hover){.error-boundary-btn-secondary:hover{background:#ffffff1f}}.error-boundary-btn-secondary:active{transform:translateY(1px)}.error-boundary-details{width:100%;margin-top:16px;text-align:left}.error-boundary-details summary{font-size:12px;color:var(--won-text-muted, rgba(255, 255, 255, .45));cursor:pointer;padding:8px 0}.error-boundary-details pre{font-size:11px;color:#f87171cc;background:#f871711a;padding:12px;border-radius:6px;overflow-x:auto;white-space:pre-wrap;word-break:break-word;margin:8px 0}.toast{position:fixed;bottom:clamp(16px,4vw,24px);left:50%;transform:translate(-50%) translateY(20px);display:flex;align-items:center;gap:clamp(8px,2vw,10px);padding:clamp(10px,2.5vw,12px) clamp(12px,3vw,16px);background:#14141ef2;border:1px solid rgba(255,255,255,.08);border-radius:clamp(8px,2vw,10px);box-shadow:0 8px 24px #0006;z-index:2000;max-width:calc(100vw - 32px);opacity:0;transition:opacity .2s cubic-bezier(.32,.72,0,1),transform .2s cubic-bezier(.32,.72,0,1)}.toast.visible{opacity:1;transform:translate(-50%) translateY(0)}.toast-icon{flex-shrink:0}.toast-error .toast-icon{color:#f87171}.toast-info .toast-icon{color:#fff9}.toast-success .toast-icon{color:#4ade80}.toast-message{font-size:clamp(12px,3vw,14px);font-weight:500;color:#ffffffe6;line-height:1.4;white-space:nowrap}.toast-inline-icon{width:.95em;height:.95em;margin:0 4px;color:#ffdc96f2;vertical-align:-.1em}.toast-dismiss{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:clamp(32px,8vw,36px);height:clamp(32px,8vw,36px);margin-left:clamp(2px,1vw,4px);background:transparent;border:none;border-radius:4px;color:#fff6;cursor:pointer;transition:color .15s ease,background .15s ease}@media (hover: hover){.toast-dismiss:hover{color:#fffc;background:#ffffff1a}}.login-page{--safe-area-bottom: env(safe-area-inset-bottom, 0px);--safe-area-top: env(safe-area-inset-top, 0px);--unit: calc((100dvh - var(--safe-area-bottom)) / 15.5);--max-width: min(calc(var(--unit) * 10.5), 100vw);width:100%;max-width:var(--max-width);min-height:100dvh;margin:0 auto;display:flex;align-items:center;justify-content:center;background:#0f0b12 url(/wood-background.png) center/cover no-repeat;padding:calc(var(--unit) * .3);padding-top:calc(var(--safe-area-top) + var(--unit) * .3);padding-bottom:var(--safe-area-bottom);position:relative;box-sizing:border-box}.login-page:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at 50% 30%,#7858a047,#120c1ae6 65%),linear-gradient(180deg,#0e0a1499,#08060ce6);z-index:0}.login-back-btn{position:absolute;top:calc(var(--safe-area-top) + var(--unit) * .15);left:calc(var(--unit) * .1);z-index:10;display:flex;align-items:center;justify-content:center;width:calc(var(--unit) * .6);height:calc(var(--unit) * .6);background:transparent;border:none;color:#fff;cursor:pointer;transition:all .15s ease}.login-back-btn:active{transform:scale(.95)}.login-back-btn svg{width:clamp(20px,5vw,28px);height:clamp(20px,5vw,28px)}.login-content{display:flex;flex-direction:column;align-items:center;gap:calc(var(--unit) * .15);max-width:min(calc(var(--unit) * 5.5),92vw);min-width:min(300px,85vw);width:100%;text-align:center;position:relative;z-index:1}.login-card{display:flex;flex-direction:column;align-items:center;width:100%;padding:calc(var(--unit) * .4) calc(var(--unit) * .35);background:#1e182aa6;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(212,168,75,.25);border-radius:calc(var(--unit) * .25);box-shadow:0 0 30px #d4a84b14,0 20px 40px #0006,inset 0 1px #ffffff0d;animation:card-fade-in .4s ease-out}@keyframes card-fade-in{0%{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.login-card-logo{width:min(calc(var(--unit) * 3.5),70vw);height:auto;aspect-ratio:863 / 590;display:block;filter:drop-shadow(0 6px 12px rgba(0,0,0,.35));margin-bottom:calc(var(--unit) * .15)}.login-subtitle{font-size:max(14px,calc(var(--unit) * .2));color:#d6c8aad9;margin:0 0 calc(var(--unit) * .2);font-weight:400}.login-benefits{display:flex;gap:calc(var(--unit) * .12);margin-bottom:calc(var(--unit) * .3)}.benefit-chip{display:flex;align-items:center;gap:calc(var(--unit) * .06);padding:calc(var(--unit) * .08) calc(var(--unit) * .15);background:#d4a84b14;border:1px solid rgba(212,168,75,.15);border-radius:calc(var(--unit) * .5);font-size:max(11px,calc(var(--unit) * .15));font-weight:500;color:#f0dca8b3;cursor:default;-webkit-user-select:none;user-select:none}.benefit-chip svg{flex-shrink:0;opacity:.8}.google-sign-in-btn{display:flex;align-items:center;justify-content:center;gap:calc(var(--unit) * .12);width:100%;padding:calc(var(--unit) * .18) calc(var(--unit) * .3);background:#fff;border:1px solid rgba(0,0,0,.15);border-radius:calc(var(--unit) * .1);font-size:max(14px,calc(var(--unit) * .2));font-weight:500;color:#3c4043;cursor:pointer;transition:all .15s ease;box-shadow:0 2px 4px #00000026;font-family:Roboto,-apple-system,BlinkMacSystemFont,sans-serif}.google-icon-wrapper{display:flex;align-items:center;justify-content:center;flex-shrink:0}@media (hover: hover){.google-sign-in-btn:hover:not(:disabled){background:#f8f9fa;box-shadow:0 4px 8px #0003}}.google-sign-in-btn:active:not(:disabled){background:#f1f3f4;transform:scale(.99)}.google-sign-in-btn:disabled{opacity:.6;cursor:not-allowed}.guest-sign-in-btn{display:flex;align-items:center;justify-content:center;width:100%;padding:calc(var(--unit) * .16) calc(var(--unit) * .3);background:#ffffff0f;border:1px solid rgba(255,255,255,.25);border-radius:calc(var(--unit) * .1);font-size:max(14px,calc(var(--unit) * .2));font-weight:500;color:#ffffffbf;cursor:pointer;transition:all .15s ease}@media (hover: hover){.guest-sign-in-btn:hover:not(:disabled){border-color:#ffffff59;color:#ffffffbf}}.guest-sign-in-btn:active:not(:disabled){transform:scale(.99);background:#ffffff0d}.guest-sign-in-btn:disabled{opacity:.4;cursor:not-allowed}.login-divider{display:flex;align-items:center;width:100%;margin:calc(var(--unit) * .08) 0;gap:calc(var(--unit) * .12)}.login-divider:before,.login-divider:after{content:"";flex:1;height:1px;background:#ffffff1a}.login-divider span{font-size:max(11px,calc(var(--unit) * .15));color:#ffffff4d;white-space:nowrap}.login-error{color:#fca5a5;font-size:max(12px,calc(var(--unit) * .16));margin:calc(var(--unit) * .12) 0 0}.login-footer{font-size:max(10px,calc(var(--unit) * .14));color:#d6c8aa66;margin:0}.login-webview-warning{display:flex;flex-direction:column;align-items:center;gap:calc(var(--unit) * .12);width:100%;padding:calc(var(--unit) * .2) calc(var(--unit) * .22);background:#d4a84b0f;border:1px solid rgba(212,168,75,.2);border-radius:calc(var(--unit) * .15);box-shadow:0 0 20px #d4a84b0f,inset 0 1px #ffffff08}.login-webview-warning .webview-warning-icon{width:calc(var(--unit) * .42);height:calc(var(--unit) * .42);color:#fbbf24e6;filter:drop-shadow(0 0 8px rgba(251,191,36,.4))}.login-webview-warning .webview-warning-icon svg{width:100%;height:100%}.login-webview-warning h3{font-size:max(15px,calc(var(--unit) * .22));font-weight:600;color:#fff;margin:0;letter-spacing:.02em;text-align:center}.webview-platform-note{font-size:max(12px,calc(var(--unit) * .16));color:#f0e1bee6;margin:0;margin-top:calc(var(--unit) * -.04);line-height:1.4;text-align:center;word-break:keep-all;overflow-wrap:break-word}.webview-platform-note.note-dim{font-size:max(11px,calc(var(--unit) * .13));color:#d6c8aa8c;margin-top:calc(var(--unit) * .02)}.webview-steps{display:flex;flex-direction:column;gap:calc(var(--unit) * .06);width:100%;margin:calc(var(--unit) * .1) 0 calc(var(--unit) * .16)}.step-chip{display:flex;align-items:center;gap:calc(var(--unit) * .08);padding:calc(var(--unit) * .08) calc(var(--unit) * .12);background:#ffffff0d;border:1px solid rgba(212,168,75,.18);border-radius:calc(var(--unit) * .06);font-size:max(12px,calc(var(--unit) * .15));color:#d6c8aad9;text-align:left}.step-num{display:flex;align-items:center;justify-content:center;min-width:calc(var(--unit) * .22);height:calc(var(--unit) * .22);background:#d4a84b4d;border-radius:50%;font-size:max(10px,calc(var(--unit) * .12));font-weight:700;color:#ffdc64}.step-chip strong{color:#fffffff2}.menu-icon-inline{display:inline-flex;align-items:center;justify-content:center;min-width:calc(var(--unit) * .24);height:calc(var(--unit) * .18);padding:0 calc(var(--unit) * .03);margin:0 calc(var(--unit) * .02);background:#d4a84b33;border-radius:calc(var(--unit) * .04);font-size:max(11px,calc(var(--unit) * .15));font-weight:700;color:#ffdc64;letter-spacing:1px;vertical-align:middle}.btn-copy-url-primary{display:flex;align-items:center;justify-content:center;gap:calc(var(--unit) * .1);width:100%;padding:calc(var(--unit) * .18) calc(var(--unit) * .25);background:linear-gradient(120deg,#e4c06b,#c79c3b 55%,#ad7b24);border:none;border-radius:calc(var(--unit) * .12);font-size:max(14px,calc(var(--unit) * .2));font-weight:600;color:#1b1914;cursor:pointer;transition:all .15s ease;box-shadow:0 3px #7e5e1a,0 6px 16px #00000059;position:relative;overflow:hidden}.btn-copy-url-primary:after{content:"";position:absolute;top:-40%;right:0;bottom:-40%;left:0;background:linear-gradient(120deg,transparent 0%,rgba(255,255,255,.25) 45%,rgba(255,255,255,.08) 55%,transparent 75%);transform:translate(-120%);animation:gold-sheen 5s ease-in-out infinite;pointer-events:none}.btn-copy-url-primary svg{flex-shrink:0}@media (hover: hover){.btn-copy-url-primary:hover{transform:translateY(-2px);box-shadow:0 5px #7e5e1a,0 10px 24px #0006}}.btn-copy-url-primary:active{transform:translateY(2px);box-shadow:0 1px #7e5e1a,0 3px 10px #0000004d}.webview-helper{font-size:max(11px,calc(var(--unit) * .14));color:#d6c8aab3;margin:calc(var(--unit) * .1) 0 0;text-align:center;line-height:1.4}.webview-guest-btn.guest-sign-in-btn{background:linear-gradient(120deg,#e4c06b,#c79c3b 55%,#ad7b24);border:none;color:#1b1914;font-weight:600;box-shadow:0 3px #7e5e1a,0 6px 16px #00000059;position:relative;overflow:hidden}.webview-guest-btn.guest-sign-in-btn:after{content:"";position:absolute;top:-40%;right:0;bottom:-40%;left:0;background:linear-gradient(120deg,transparent 0%,rgba(255,255,255,.25) 45%,rgba(255,255,255,.08) 55%,transparent 75%);transform:translate(-120%);animation:gold-sheen 5s ease-in-out infinite;pointer-events:none}.webview-guest-btn.guest-sign-in-btn:active:not(:disabled){transform:translateY(2px);box-shadow:0 1px #7e5e1a,0 3px 10px #0000004d;background:linear-gradient(120deg,#e4c06b,#c79c3b 55%,#ad7b24)}.webview-google-hint{display:flex;flex-direction:column;align-items:center;gap:calc(var(--unit) * .1);width:100%}.webview-google-hint p{font-size:max(11px,calc(var(--unit) * .15));color:#d6c8aa8c;margin:0;text-align:center}.btn-copy-url-compact{display:flex;align-items:center;justify-content:center;gap:calc(var(--unit) * .08);padding:calc(var(--unit) * .1) calc(var(--unit) * .2);background:#ffffff0f;border:1px solid rgba(212,168,75,.2);border-radius:calc(var(--unit) * .08);font-size:max(12px,calc(var(--unit) * .16));font-weight:500;color:#f0dca8b3;cursor:pointer;transition:all .15s ease}.btn-copy-url-compact:active{transform:scale(.97);background:#ffffff14}.btn-copy-url-compact svg{width:14px;height:14px;flex-shrink:0}.landing-page{--lp-bg: #0f0b12;--lp-bg-card: rgba(30, 24, 42, .65);--lp-gold: #d4a84b;--lp-gold-light: #e4c06b;--lp-gold-dark: #b8923a;--lp-purple: #5B21B6;--lp-purple-dark: #2B1750;--lp-text: rgba(255, 255, 255, .95);--lp-text-muted: rgba(214, 200, 170, .7);--lp-border: rgba(212, 168, 75, .2);--lp-glow: rgba(212, 168, 75, .15);--lp-section-gap: clamp(60px, 10vh, 100px)}.landing-page{width:100%;min-height:100vh;background:var(--lp-bg) url(/wood-background.png) center/cover no-repeat fixed;color:var(--lp-text);overflow-x:hidden;overflow-y:auto;position:relative}.landing-page:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at 50% 20%,rgba(120,88,160,.2),transparent 60%),linear-gradient(180deg,#0e0a14b3,#08060cf2);pointer-events:none;z-index:0}.landing-page>*{position:relative;z-index:1}.landing-nav{position:fixed;top:0;left:0;right:0;z-index:100;padding:12px 20px;background:#0f0b12d9;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--lp-border)}.nav-content{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:20px}.nav-logo{height:36px;width:auto}.nav-links{display:none;gap:24px}@media (min-width: 768px){.nav-links{display:flex}}.nav-links button{background:none;border:none;color:var(--lp-text-muted);font-size:14px;font-weight:500;cursor:pointer;transition:color .2s}@media (hover: hover){.nav-links button:hover{color:var(--lp-gold)}}.nav-cta{padding:8px 20px;background:linear-gradient(120deg,var(--lp-gold-light),var(--lp-gold),var(--lp-gold-dark));border:none;border-radius:8px;font-size:14px;font-weight:600;color:#1b1914;cursor:pointer;transition:transform .15s,box-shadow .15s;box-shadow:0 2px 8px #d4a84b4d}@media (hover: hover){.nav-cta:hover{transform:translateY(-2px);box-shadow:0 4px 16px #d4a84b66}}.nav-cta:active{transform:translateY(0)}.hero-section{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:100px 20px 60px;position:relative;overflow:hidden}.hero-content{display:flex;flex-direction:column;align-items:center;text-align:center;max-width:600px;opacity:0;transform:translateY(30px);transition:opacity .8s ease-out,transform .8s ease-out}.hero-section.visible .hero-content{opacity:1;transform:translateY(0)}.hero-logo{width:min(320px,80vw);height:auto;margin-bottom:16px;filter:drop-shadow(0 8px 24px rgba(0,0,0,.4));animation:hero-float 4s ease-in-out infinite}@keyframes hero-float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.hero-tagline{font-size:clamp(20px,5vw,28px);font-weight:600;color:var(--lp-gold);margin-bottom:12px;letter-spacing:.02em}.hero-subtitle{font-size:clamp(14px,3.5vw,18px);color:var(--lp-text-muted);margin-bottom:32px;line-height:1.6;max-width:400px}.hero-cta{display:flex;align-items:center;justify-content:center;gap:12px;padding:16px 48px;background:linear-gradient(120deg,var(--lp-gold-light) 0%,var(--lp-gold) 55%,var(--lp-gold-dark) 100%);border:none;border-radius:14px;font-size:20px;font-weight:700;color:#1b1914;cursor:pointer;transition:all .2s;box-shadow:0 4px #7e5e1a,0 8px 24px #0006;position:relative;overflow:hidden}.hero-cta:after{content:"";position:absolute;top:-50%;right:0;bottom:-50%;left:0;background:linear-gradient(120deg,transparent 0%,rgba(255,255,255,.3) 45%,rgba(255,255,255,.1) 55%,transparent 75%);transform:translate(-120%);animation:gold-sheen 4s ease-in-out infinite}@keyframes gold-sheen{0%,to{transform:translate(-120%)}50%,60%{transform:translate(120%)}}@media (hover: hover){.hero-cta:hover{transform:translateY(-3px);box-shadow:0 6px #7e5e1a,0 12px 32px #d4a84b66}}.hero-cta:active{transform:translateY(2px);box-shadow:0 2px #7e5e1a,0 4px 12px #0000004d}.hero-cta:disabled{opacity:.7;cursor:not-allowed}.hero-google-btn{display:flex;align-items:center;justify-content:center;gap:10px;padding:12px 32px;margin-top:12px;background:#ffffff1a;border:1px solid rgba(255,255,255,.25);border-radius:12px;font-size:15px;font-weight:600;color:#ffffffe0;cursor:pointer;transition:all .2s}@media (hover: hover){.hero-google-btn:hover{background:#ffffff2e;border-color:#fff6;color:#fff}}.hero-google-btn:active{transform:scale(.97)}.hero-note{margin-top:20px;font-size:13px;color:var(--lp-text-muted);opacity:.8}.hero-glow{position:absolute;width:600px;height:600px;background:radial-gradient(circle,rgba(212,168,75,.1) 0%,transparent 70%);top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none;z-index:-1}.section-title{font-size:clamp(24px,5vw,36px);font-weight:700;text-align:center;margin-bottom:40px;color:#fff;position:relative}.section-title:after{content:"";position:absolute;bottom:-12px;left:50%;transform:translate(-50%);width:60px;height:3px;background:linear-gradient(90deg,transparent,var(--lp-gold),transparent);border-radius:2px}.preview-section{padding:var(--lp-section-gap) 20px}.preview-content{max-width:600px;margin:0 auto;text-align:center}.preview-video{margin-bottom:24px}.video-placeholder{position:relative;aspect-ratio:16 / 10;background:var(--lp-bg-card);border:1px solid var(--lp-border);border-radius:20px;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;box-shadow:0 8px 32px #0000004d}.placeholder-content{display:flex;flex-direction:column;align-items:center;gap:8px;color:var(--lp-gold);opacity:.8}.placeholder-content p{font-size:14px;font-weight:500}.placeholder-grid{display:flex;gap:8px}.grid-cell{width:clamp(40px,10vw,56px);height:clamp(40px,10vw,56px);display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#d4a84b26,#d4a84b0d);border:2px solid rgba(212,168,75,.3);border-radius:8px;font-size:clamp(18px,5vw,24px);font-weight:700;color:var(--lp-gold);box-shadow:0 4px 12px #0003}.preview-desc{font-size:15px;color:var(--lp-text-muted);line-height:1.6}.how-section{padding:var(--lp-section-gap) 20px;background:linear-gradient(180deg,transparent,rgba(43,23,80,.2),transparent)}.how-content{max-width:900px;margin:0 auto}.steps-container{display:grid;grid-template-columns:1fr;gap:24px}@media (min-width: 640px){.steps-container{grid-template-columns:repeat(3,1fr)}}.step-card{display:flex;flex-direction:column;align-items:center;text-align:center;padding:32px 24px;background:var(--lp-bg-card);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--lp-border);border-radius:16px;transition:transform .3s,box-shadow .3s}@media (hover: hover){.step-card:hover{transform:translateY(-4px);box-shadow:0 12px 36px #0000004d}}.step-number{width:56px;height:56px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--lp-gold),var(--lp-gold-dark));border-radius:50%;font-size:24px;font-weight:700;color:#1b1914;margin-bottom:16px;box-shadow:0 4px 12px #d4a84b4d}.step-card h3{font-size:18px;font-weight:600;margin-bottom:8px;color:#fff}.step-card p{font-size:14px;color:var(--lp-text-muted);line-height:1.5}.features-section{padding:var(--lp-section-gap) 20px}.features-content{max-width:1000px;margin:0 auto}.features-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}@media (min-width: 640px){.features-grid{grid-template-columns:repeat(3,1fr);gap:20px}}.feature-card{display:flex;flex-direction:column;align-items:center;text-align:center;padding:24px 16px;background:var(--lp-bg-card);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--lp-border);border-radius:14px;transition:transform .3s,border-color .3s}@media (hover: hover){.feature-card:hover{transform:translateY(-2px);border-color:#d4a84b66}}.feature-icon{width:56px;height:56px;display:flex;align-items:center;justify-content:center;background:#d4a84b1a;border:1px solid rgba(212,168,75,.2);border-radius:12px;margin-bottom:12px;color:var(--lp-gold)}.feature-card h3{font-size:16px;font-weight:600;margin-bottom:6px;color:#fff}.feature-card p{font-size:13px;color:var(--lp-text-muted);line-height:1.4}.install-section{padding:var(--lp-section-gap) 20px;background:linear-gradient(180deg,transparent,rgba(43,23,80,.15),transparent)}.install-content{max-width:500px;margin:0 auto;text-align:center}.install-icon{width:80px;height:80px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--lp-gold),var(--lp-gold-dark));border-radius:20px;margin:0 auto 20px;color:#1b1914;box-shadow:0 8px 24px #d4a84b4d}.install-content h2{font-size:clamp(22px,5vw,28px);font-weight:700;margin-bottom:12px}.install-content>p{font-size:15px;color:var(--lp-text-muted);margin-bottom:24px}.install-steps{display:flex;flex-direction:column;gap:12px}@media (min-width: 480px){.install-steps{flex-direction:row;justify-content:center}}.install-step{display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px 20px;background:var(--lp-bg-card);border:1px solid var(--lp-border);border-radius:12px;flex:1;max-width:200px}.step-badge{padding:4px 12px;background:#d4a84b26;border:1px solid rgba(212,168,75,.3);border-radius:20px;font-size:12px;font-weight:600;color:var(--lp-gold)}.install-step p{font-size:13px;color:var(--lp-text-muted);line-height:1.4}.social-section{padding:var(--lp-section-gap) 20px}.social-content{max-width:800px;margin:0 auto;text-align:center}.stat-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:32px}.stat-card{display:flex;flex-direction:column;align-items:center;padding:20px 12px;background:var(--lp-bg-card);border:1px solid var(--lp-border);border-radius:12px}.stat-number{font-size:clamp(24px,6vw,36px);font-weight:700;color:var(--lp-gold);line-height:1;margin-bottom:8px}.stat-label{font-size:clamp(11px,2.5vw,14px);color:var(--lp-text-muted)}.social-quote{font-size:clamp(16px,4vw,20px);font-style:italic;color:var(--lp-text-muted);position:relative;padding:0 24px}.social-quote:before,.social-quote:after{content:'"';font-size:1.5em;color:var(--lp-gold);opacity:.5}.faq-section{padding:var(--lp-section-gap) 20px;background:linear-gradient(180deg,transparent,rgba(43,23,80,.1),transparent)}.faq-content{max-width:700px;margin:0 auto}.faq-list{display:flex;flex-direction:column;gap:12px}.faq-item{background:var(--lp-bg-card);border:1px solid var(--lp-border);border-radius:12px;overflow:hidden;transition:border-color .3s}.faq-item.open{border-color:#d4a84b66}.faq-question{width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 20px;background:none;border:none;font-size:15px;font-weight:500;color:#fff;text-align:left;cursor:pointer;transition:color .2s}@media (hover: hover){.faq-question:hover{color:var(--lp-gold)}}.faq-question svg{flex-shrink:0;color:var(--lp-gold);opacity:.7}.faq-answer{max-height:0;overflow:hidden;transition:max-height .3s ease-out}.faq-item.open .faq-answer{max-height:200px}.faq-answer p{padding:0 20px 18px;font-size:14px;color:var(--lp-text-muted);line-height:1.6}.landing-footer{padding:48px 20px;border-top:1px solid var(--lp-border);background:#0f0b12cc}.footer-content{max-width:600px;margin:0 auto;text-align:center}.footer-logo{height:48px;width:auto;margin-bottom:12px;opacity:.8}.footer-tagline{font-size:14px;color:var(--lp-text-muted);margin-bottom:20px}.footer-links{display:flex;align-items:center;justify-content:center;gap:16px;margin-bottom:20px}.footer-links a,.footer-links button{background:none;border:none;font-size:14px;color:var(--lp-text-muted);cursor:pointer;transition:color .2s}@media (hover: hover){.footer-links a:hover,.footer-links button:hover{color:var(--lp-gold)}}.footer-divider{color:var(--lp-text-muted);opacity:.5}.footer-copyright{font-size:12px;color:var(--lp-text-muted);opacity:.6}.floating-cta{position:fixed;bottom:20px;left:50%;transform:translate(-50%);z-index:90;display:none}@media (max-width: 640px){.floating-cta{display:block}}.floating-cta button{display:flex;align-items:center;gap:8px;padding:14px 32px;background:linear-gradient(120deg,var(--lp-gold-light),var(--lp-gold),var(--lp-gold-dark));border:none;border-radius:50px;font-size:16px;font-weight:600;color:#1b1914;cursor:pointer;box-shadow:0 4px 20px #0006,0 0 24px #d4a84b4d;transition:transform .2s,box-shadow .2s}.floating-cta button:active{transform:scale(.96)}@media (prefers-reduced-motion: no-preference){.landing-page{scroll-behavior:smooth}}.landing-page{user-select:text;-webkit-user-select:text}.bottom-tab-bar{--safe-area-bottom: env(safe-area-inset-bottom, 0px);--unit: calc((100dvh - var(--safe-area-bottom)) / 15.5);--bar-height: max(calc(var(--unit) * 1.2), 48px);position:fixed;bottom:0;left:0;right:0;max-width:min(calc(var(--unit) * 10.5),100vw);margin:0 auto;z-index:100;display:flex;height:calc(var(--bar-height) + var(--safe-area-bottom));padding-bottom:var(--safe-area-bottom);background:radial-gradient(ellipse at 50% 10%,rgba(255,255,255,.12),transparent 62%),radial-gradient(ellipse at 50% 115%,rgba(0,0,0,.35),transparent 65%),linear-gradient(180deg,#2e203edb,#140c20e6);border-radius:18px 18px 0 0;border-top:1px solid rgba(212,168,75,.25);box-shadow:inset 0 1px 1px #ffffff14,0 -4px 12px #00000059}.tab-item{flex:1;display:flex;align-items:center;justify-content:center;background:none;border:none;color:#ffffff59;cursor:pointer;-webkit-tap-highlight-color:transparent;padding:0;height:var(--bar-height);position:relative;transition:color .2s ease}.tab-icon-wrap{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--unit) * .04);position:relative;z-index:1}.tab-icon-wrap svg{width:clamp(20px,calc(var(--unit) * .48),26px);height:clamp(20px,calc(var(--unit) * .48),26px)}.tab-item.active{color:#d4af55}.tab-item.active:before{content:"";position:absolute;top:-1px;left:20%;right:20%;height:2px;background:linear-gradient(90deg,transparent,rgba(212,175,85,.8),transparent);border-radius:0 0 2px 2px}.tab-item.active:after{content:"";position:absolute;top:0;left:10%;right:10%;bottom:0;background:radial-gradient(ellipse at 50% 30%,rgba(212,175,85,.1),transparent 70%);pointer-events:none}.tab-badge{position:absolute;top:-2px;right:-8px;min-width:16px;height:16px;padding:0 4px;border-radius:8px;color:#fff;font-size:10px;font-weight:700;line-height:16px;text-align:center;box-shadow:0 1px 4px #0006}.tab-badge--waiting{background:linear-gradient(135deg,#f87171,#dc2626)}.tab-badge--playing{background:linear-gradient(135deg,#34d399,#059669)}.tab-label{font-size:clamp(9px,calc(var(--unit) * .22),11px);font-weight:600;letter-spacing:.04em;text-transform:uppercase}.tab-item.active .tab-label{font-weight:700}@media (hover: hover){.tab-item:not(.active):hover{color:#ffffff8c}}.a2hs-banner{position:absolute;bottom:calc(max(calc((100dvh - env(safe-area-inset-bottom,0px)) / 15.5 * 1.2),48px) + env(safe-area-inset-bottom,0px));left:0;right:0;background:linear-gradient(180deg,#1a1226f2,#100a1afa);border-top:1px solid rgba(200,170,110,.15);padding:16px 20px;z-index:1000;animation:a2hs-slide-up .3s ease-out}@keyframes a2hs-slide-up{0%{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}.a2hs-banner-content{display:flex;align-items:center;gap:12px;margin-bottom:12px}.a2hs-banner-icon{width:44px;height:44px;flex-shrink:0}.a2hs-banner-icon img{width:100%;height:100%;border-radius:10px}.a2hs-banner-text{display:flex;flex-direction:column;gap:2px}.a2hs-banner-title{font-size:15px;font-weight:700;color:#fffffff2}.a2hs-banner-desc{font-size:13px;color:#fff9}.a2hs-banner-actions{display:flex;gap:10px}.a2hs-btn-secondary,.a2hs-btn-primary{flex:1;padding:12px 16px;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;transition:all .15s ease;border:none}.a2hs-btn-secondary{background:#ffffff14;border:1px solid rgba(255,255,255,.1);color:#ffffffb3}.a2hs-btn-secondary:active{background:#ffffff1f}.a2hs-btn-primary{background:linear-gradient(135deg,#d4a84b,#b8923a);color:#1b1914;box-shadow:0 3px #7e5e1a,0 6px 16px #00000059}.a2hs-btn-primary:active{transform:translateY(2px);box-shadow:0 1px #7e5e1a,0 3px 8px #0000004d}.a2hs-modal{background:linear-gradient(180deg,#1a1226fa,#100a1afc);border:1px solid rgba(200,170,110,.15);border-radius:16px;padding:24px;max-width:340px;width:100%;position:relative;box-shadow:0 20px 60px #0009,0 0 40px #d4a84b1a}.a2hs-modal-close{position:absolute;top:12px;right:12px;background:#ffffff14;border:1px solid rgba(255,255,255,.1);border-radius:50%;width:32px;height:32px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#ffffff80;transition:all .15s ease}.a2hs-modal-close:active{background:#ffffff26;color:#fffc}.a2hs-modal-title{font-size:18px;font-weight:700;color:#fff;margin-bottom:20px;text-align:center}.a2hs-steps{background:linear-gradient(180deg,#1a1226d9,#100a1af2);border:1px solid rgba(200,170,110,.12);border-radius:12px;padding:16px;margin-bottom:20px}.a2hs-step{display:flex;align-items:flex-start;gap:12px}.a2hs-step:not(:last-child){margin-bottom:14px}.a2hs-step-number{width:26px;height:26px;background:linear-gradient(135deg,#d4a84b,#b8923a);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:#1b1914;flex-shrink:0}.a2hs-step-content{padding-top:3px}.a2hs-step-content p{font-size:14px;color:#ffffffd9;line-height:1.4;display:flex;align-items:center;flex-wrap:wrap;gap:4px;margin:0}.a2hs-inline-icon{color:#f0dca8f2;vertical-align:middle}.a2hs-step-content strong{color:#f0dca8f2}.a2hs-modal-btn{width:100%;padding:14px 20px;background:linear-gradient(135deg,#d4a84b,#b8923a);color:#1b1914;border:1px solid rgba(255,226,160,.35);border-radius:12px;font-size:15px;font-weight:700;cursor:pointer;box-shadow:0 4px #7e5e1a,0 8px 22px #00000073,inset 0 1px #ffffff40;transition:transform .15s ease,box-shadow .15s ease}.a2hs-modal-btn:active{transform:translateY(2px);box-shadow:0 2px #7e5e1a,0 4px 16px #0006}.avatar-picker-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#0000;z-index:1100;transition:background-color .3s ease}.avatar-picker-overlay.visible{background-color:#0a0710b3}.avatar-picker-sheet{position:fixed;bottom:0;left:0;right:0;background:radial-gradient(circle at 50% 100%,rgba(255,255,255,.06),transparent 55%),linear-gradient(0deg,#241832f7,#120c1cfc);border-radius:20px 20px 0 0;padding:0 16px 24px;transform:translateY(100%);transition:transform .3s cubic-bezier(.32,.72,0,1);box-shadow:0 -12px 36px #0000008c;border-top:1px solid rgba(212,168,75,.25)}.avatar-picker-sheet.visible{transform:translateY(0)}.avatar-picker-handle{display:flex;justify-content:center;padding:10px 0 6px;cursor:pointer}.avatar-picker-handle .handle-bar{width:36px;height:4px;background-color:#ffffff40;border-radius:2px}.avatar-picker-header{margin-bottom:12px}.avatar-picker-header h2{font-size:16px;font-weight:600;color:#ffffffeb;margin:0}.avatar-picker-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.avatar-picker-item{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;padding:6px;background:#ffffff08;border:2px solid rgba(255,255,255,.08);border-radius:12px;cursor:pointer;transition:all .2s ease}.avatar-picker-item:disabled{opacity:.6;cursor:not-allowed}@media (hover: hover){.avatar-picker-item:hover:not(:disabled){background:#ffffff0f;border-color:#fff3;transform:translateY(-2px)}}.avatar-picker-item.selected{border-color:#d4a84be6;box-shadow:0 0 0 1px #d4a84be6,0 0 16px #d4a84b4d}.avatar-picker-img{width:100%;aspect-ratio:1;border-radius:10px;object-fit:cover}.avatar-picker-name{font-size:10px;font-weight:500;color:#ffffffbf;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.avatar-picker-badge{position:absolute;top:4px;right:4px;width:16px;height:16px;background:#d4a84b;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff}@media (min-width: 600px){.avatar-picker-sheet{left:50%;right:auto;transform:translate(-50%) translateY(100%);width:100%;max-width:400px;border-radius:20px 20px 0 0}.avatar-picker-sheet.visible{transform:translate(-50%) translateY(0)}}.achievement-toast-stack{position:fixed;top:clamp(12px,3vw,20px);left:50%;transform:translate(-50%);z-index:2100;max-width:min(90vw,360px);width:100%;pointer-events:none}.achievement-toast{position:absolute;top:0;left:0;width:100%;pointer-events:auto;cursor:pointer;transition:opacity .3s cubic-bezier(.32,.72,0,1),transform .3s cubic-bezier(.32,.72,0,1)}.achievement-toast-glow{position:absolute;top:-2px;right:-2px;bottom:-2px;left:-2px;border-radius:16px;background:linear-gradient(135deg,gold,#ff8c00,gold);opacity:.6;filter:blur(4px);animation:achievement-glow-pulse 2s ease-in-out infinite}@keyframes achievement-glow-pulse{0%,to{opacity:.4}50%{opacity:.7}}.achievement-toast-content{position:relative;display:flex;align-items:center;gap:12px;padding:12px 16px;background:linear-gradient(135deg,#281e0ff7,#19140af7);border:1px solid rgba(255,215,0,.4);border-radius:14px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.achievement-toast-icon{font-size:28px;line-height:1;flex-shrink:0}.achievement-toast-text{flex:1;min-width:0}.achievement-toast-label{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:gold;margin-bottom:1px}.achievement-toast-name{font-size:15px;font-weight:700;color:#fff;line-height:1.2}.achievement-toast-desc{font-size:11px;color:#fff9;margin-top:1px;line-height:1.3}.ach-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#0000;z-index:1000;transition:background-color .3s ease}.ach-overlay.visible{background-color:#0a071099}.ach-sheet{position:fixed;bottom:0;left:0;right:0;max-height:85vh;background:radial-gradient(circle at 50% 0%,rgba(255,255,255,.06),transparent 55%),linear-gradient(180deg,#241832f2,#120c1cfa);border-radius:20px 20px 0 0;padding:0 0 calc(16px + env(safe-area-inset-bottom,0px));transform:translateY(100%);transition:transform .3s cubic-bezier(.32,.72,0,1);box-shadow:0 -12px 36px #0000008c;border-top:1px solid rgba(212,168,75,.25);display:flex;flex-direction:column;overflow:hidden}.ach-sheet.visible{transform:translateY(0)}.ach-handle{display:flex;justify-content:center;padding:10px 0;cursor:pointer;flex-shrink:0}.ach-handle-bar{width:40px;height:4px;background-color:#ffffff40;border-radius:2px;transition:background-color .15s ease}@media (hover: hover){.ach-handle:hover .ach-handle-bar{background-color:#ffffff73}}.ach-header{display:flex;align-items:center;justify-content:space-between;padding:0 20px 12px;flex-shrink:0}.ach-title{font-size:clamp(16px,4vw,20px);font-weight:700;color:#ffffffeb;margin:0}.ach-ring-wrapper{position:relative;width:44px;height:44px;flex-shrink:0}.ach-ring{width:100%;height:100%;transform:rotate(-90deg)}.ach-ring-bg{fill:none;stroke:#ffffff14;stroke-width:3}.ach-ring-fill{fill:none;stroke:gold;stroke-width:3;stroke-linecap:round;transition:stroke-dasharray .5s ease}.ach-ring-text{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;color:gold;letter-spacing:-.3px}.ach-scroll{flex:1;overflow-y:auto;padding:0 16px 20px;-webkit-overflow-scrolling:touch}.ach-category{margin-bottom:20px}.ach-category-title{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.8px;color:#f2e8d699;margin:0 0 8px 4px}.ach-grid{display:flex;flex-direction:column;gap:8px}.ach-card{display:flex;align-items:center;gap:12px;padding:12px;border-radius:10px;background:#ffffff08;border:1px solid rgba(255,255,255,.06);transition:opacity .2s ease}.ach-card.unlocked{background:#a882c814;border-color:#a882c82e;border-left:3px solid rgba(168,130,200,.4);padding-left:10px}.ach-card.new{background:#ffd7001a;border-color:#ffd7004d;border-left:3px solid rgba(255,215,0,.7);animation:ach-new-glow 2.5s ease-in-out infinite}@keyframes ach-new-glow{0%,to{box-shadow:0 0 8px #ffd7001f}50%{box-shadow:0 0 16px #ffd7004d,inset 0 0 20px #ffd7000d}}.ach-card.locked{opacity:.5}.ach-card.hidden-ach{opacity:.35}.ach-icon{font-size:32px;line-height:1;flex-shrink:0;width:36px;text-align:center}.ach-card.locked .ach-icon{filter:grayscale(.8)}.ach-info{flex:1;min-width:0}.ach-name-row{display:flex;align-items:center;gap:8px}.ach-name{font-size:14px;font-weight:600;color:#fff;display:flex;align-items:center;gap:8px;flex-wrap:wrap;flex:1;min-width:0}.ach-tier-badge{font-size:10.5px;font-weight:600;color:gold;background:#ffd70026;padding:2px 9px;border-radius:10px;border:1px solid rgba(255,215,0,.25)}.ach-tier-badge.rarity-common{color:#b4bed2e6;background:#b4bed21f;border-color:#b4bed233}.ach-tier-badge.rarity-uncommon{color:#64c882e6;background:#64c8821f;border-color:#64c88233}.ach-tier-badge.rarity-rare{color:#64a0ffe6;background:#64a0ff1f;border-color:#64a0ff33}.ach-tier-badge.rarity-epic{color:#b482dce6;background:#b482dc1f;border-color:#b482dc33}.ach-tier-badge.rarity-legendary{color:#d4a84be6;background:#d4a84b1f;border-color:#d4a84b33}.ach-tier-badge.rarity-hidden{color:#d4a84b;background:#d4a84b26;border-color:#d4a84b4d;box-shadow:0 0 8px #d4a84b4d}.ach-progress-text{font-size:10px;color:#ffffff59;flex-shrink:0;white-space:nowrap;font-variant-numeric:tabular-nums}.ach-achieved-badge{font-size:10px;font-weight:600;color:#4ade80;flex-shrink:0;white-space:nowrap}.ach-achieved-badge.rarity-common{color:#b4bed2d9}.ach-achieved-badge.rarity-uncommon{color:#64c882e6}.ach-achieved-badge.rarity-rare{color:#64a0ffe6}.ach-achieved-badge.rarity-epic{color:#b482dce6}.ach-achieved-badge.rarity-legendary{color:#d4a84be6}.ach-achieved-badge.rarity-hidden{color:#d4a84b;text-shadow:0 0 6px rgba(212,168,75,.4)}.ach-desc{font-size:11px;color:#ffffff80;margin-top:2px;line-height:1.3}.ach-progress-row{display:flex;align-items:center;gap:8px;margin-top:6px}.ach-progress-row .ach-progress-bar{flex:1;margin-top:0}.ach-progress-bar{height:6px;background:#ffffff14;border-radius:3px;margin-top:6px;overflow:hidden}.ach-progress-fill{height:100%;background:linear-gradient(90deg,#fff3,#ffffff4d);border-radius:3px;transition:width .3s ease;min-width:0}.ach-progress-fill.rarity-common{background:linear-gradient(90deg,#b4bed299,#b4bed2cc)}.ach-progress-fill.rarity-uncommon{background:linear-gradient(90deg,#50b46e99,#64c882cc)}.ach-progress-fill.rarity-rare{background:linear-gradient(90deg,#508cebb3,#64a0ffd9)}.ach-progress-fill.rarity-epic{background:linear-gradient(90deg,#a06ec8b3,#b482dcd9)}.ach-progress-fill.rarity-legendary{background:linear-gradient(90deg,gold,#fa0)}.ach-tier-stars{display:flex;flex-direction:row-reverse;gap:1px;flex-shrink:0}.ach-tier-star{font-size:12px;line-height:1;color:#ffffff26}.ach-tier-star.filled{color:gold;text-shadow:0 0 4px rgba(255,215,0,.3)}.ach-tier-star.filled.rarity-common{color:#b4bed2cc;text-shadow:none}.ach-tier-star.filled.rarity-uncommon{color:#64c882cc;text-shadow:0 0 3px rgba(100,200,130,.25)}.ach-tier-star.filled.rarity-rare{color:#64a0ffd9;text-shadow:0 0 4px rgba(100,160,255,.3)}.ach-tier-star.filled.rarity-epic{color:#b482dcd9;text-shadow:0 0 4px rgba(180,130,220,.3)}.ach-tier-star.filled.rarity-legendary{color:#d4a84be6;text-shadow:0 0 5px rgba(212,168,75,.4)}@media (max-width: 400px){.ach-sheet{max-height:90vh}.ach-card{padding:10px;gap:10px}.ach-card.unlocked{padding-left:8px}.ach-icon{font-size:26px;width:30px}.ach-tier-star{font-size:10px}.ach-tier-badge{font-size:9.5px;padding:1px 7px}}@media (min-width: 600px){.ach-sheet{left:50%;right:auto;transform:translate(-50%) translateY(100%);width:100%;max-width:600px;border-radius:20px 20px 0 0}.ach-sheet.visible{transform:translate(-50%) translateY(0)}}.title-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#0000;z-index:1000;transition:background-color .3s ease}.title-overlay.visible{background-color:#0a071099}.title-sheet{position:fixed;bottom:0;left:0;right:0;max-height:70vh;background:radial-gradient(circle at 50% 0%,rgba(255,255,255,.06),transparent 55%),linear-gradient(180deg,#241832f2,#120c1cfa);border-radius:20px 20px 0 0;padding:0 0 calc(16px + env(safe-area-inset-bottom,0px));transform:translateY(100%);transition:transform .3s cubic-bezier(.32,.72,0,1);box-shadow:0 -12px 36px #0000008c;border-top:1px solid rgba(212,168,75,.25);display:flex;flex-direction:column;overflow:hidden}.title-sheet.visible{transform:translateY(0)}.title-handle{display:flex;justify-content:center;padding:10px 0;cursor:pointer;flex-shrink:0}.title-handle-bar{width:40px;height:4px;background-color:#ffffff40;border-radius:2px;transition:background-color .15s ease}@media (hover: hover){.title-handle:hover .title-handle-bar{background-color:#ffffff73}}.title-header{display:flex;align-items:center;justify-content:space-between;padding:0 20px 12px;flex-shrink:0}.title-header-left{display:flex;align-items:center;gap:10px;min-width:0}.title-heading{font-size:clamp(16px,4vw,20px);font-weight:700;color:#ffffffeb;margin:0;flex-shrink:0}.title-current-badge{font-size:11px;font-weight:600;padding:2px 8px;border-radius:6px;background:#ffffff14;border:1px solid rgba(255,255,255,.12);color:#ffffffb3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px}.title-current-badge.rarity-common{color:#b4bed2e6;border-color:#b4bed240}.title-current-badge.rarity-uncommon{color:#64c882f2;border-color:#64c88240}.title-current-badge.rarity-rare{color:#78aafff2;border-color:#78aaff40}.title-current-badge.rarity-epic{color:#be8ce6f2;border-color:#be8ce640}.title-current-badge.rarity-legendary{color:#e1b955f2;border-color:#e1b9554d}.title-current-badge.rarity-hidden{color:#e1b955;border-color:#d4a84b59}.title-count{font-size:12px;font-weight:600;color:#ffffff59}.title-scroll{flex:1;overflow-y:auto;padding:0 16px 20px;-webkit-overflow-scrolling:touch}.title-scroll>.title-option{margin-bottom:10px}.title-category-group{display:flex;flex-direction:column;gap:6px;margin-bottom:16px}.title-category-group:last-child{margin-bottom:0}.title-category-header{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.8px;color:#f2e8d699;margin:0 0 2px 4px}.title-option{display:flex;align-items:center;gap:12px;width:100%;padding:12px;border-radius:10px;background:#ffffff0a;border:1px solid rgba(255,255,255,.07);color:#fff;font-size:14px;text-align:left;cursor:pointer;transition:background-color .15s ease,border-color .15s ease}.title-option.selected{background:#a882c81f;border-color:#a882c84d;border-left:3px solid rgba(168,130,200,.7)}.title-option.selected.selected-common{border-left-color:#b4bed2b3}.title-option.selected.selected-uncommon{border-left-color:#64c882b3}.title-option.selected.selected-rare{border-left-color:#64a0ffbf}.title-option.selected.selected-epic{border-left-color:#b482dcbf}.title-option.selected.selected-legendary{border-left-color:#d4a84bcc}.title-option.selected.selected-hidden{border-left-color:#d4a84be6}.title-option.new{background:#ffd7001a;border-color:#ffd7004d;animation:title-new-glow 2.5s ease-in-out infinite}@keyframes title-new-glow{0%,to{box-shadow:0 0 6px #ffd7001f}50%{box-shadow:0 0 14px #ffd7004d,inset 0 0 16px #ffd7000d}}.title-option:disabled{opacity:.5;cursor:not-allowed}@media (hover: hover){.title-option:not(:disabled):hover{background:#ffffff14}.title-option.selected:not(:disabled):hover{background:#a882c81f}.title-option.new:not(:disabled):hover{background:#ffd70026}}.title-option-radio{flex-shrink:0;width:20px;text-align:center;font-size:14px;color:#fff6}.title-option.selected .title-option-radio{color:gold}.title-option-radio.rarity-common{color:#b4bed2d9}.title-option-radio.rarity-uncommon{color:#64c882e6}.title-option-radio.rarity-rare{color:#64a0ffe6}.title-option-radio.rarity-epic{color:#b482dce6}.title-option-radio.rarity-legendary{color:#d4a84bf2}.title-option-radio.rarity-hidden{color:#d4a84b}.title-option-icon{flex-shrink:0;font-size:20px;line-height:1;width:24px;text-align:center}.title-option-name{flex:1;min-width:0;font-size:14px;font-weight:600;color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.title-option-name.rarity-common{color:#b4bed2e6}.title-option-name.rarity-uncommon{color:#64c882f2}.title-option-name.rarity-rare{color:#78aafff2}.title-option-name.rarity-epic{color:#be8ce6f2}.title-option-name.rarity-legendary{color:#e1b955f2}.title-option-name.rarity-hidden{color:#e1b955;text-shadow:0 0 8px rgba(212,168,75,.5)}.title-option-origin{font-weight:400;font-size:11px;color:#ffffff40}.title-option-label{font-size:14px;color:#ffffffb3}.title-option-stars{display:flex;flex-direction:row-reverse;gap:1px;flex-shrink:0}.title-tier-star{font-size:11px;line-height:1;color:#ffffff26}.title-tier-star.filled{color:gold;text-shadow:0 0 4px rgba(255,215,0,.3)}.title-tier-star.filled.rarity-common{color:#b4bed2cc;text-shadow:none}.title-tier-star.filled.rarity-uncommon{color:#64c882cc;text-shadow:0 0 3px rgba(100,200,130,.25)}.title-tier-star.filled.rarity-rare{color:#64a0ffd9;text-shadow:0 0 4px rgba(100,160,255,.3)}.title-tier-star.filled.rarity-epic{color:#b482dcd9;text-shadow:0 0 4px rgba(180,130,220,.3)}.title-tier-star.filled.rarity-legendary{color:#d4a84be6;text-shadow:0 0 5px rgba(212,168,75,.4)}.title-empty{text-align:center;padding:24px 16px;font-size:13px;color:#fff6;line-height:1.5}@media (max-width: 400px){.title-sheet{max-height:80vh}.title-option{padding:10px;gap:10px}.title-tier-star{font-size:9px}}@media (min-width: 600px){.title-sheet{left:50%;right:auto;transform:translate(-50%) translateY(100%);width:100%;max-width:500px;border-radius:20px 20px 0 0}.title-sheet.visible{transform:translate(-50%) translateY(0)}}.profile-button-wrapper{position:absolute;top:calc(var(--unit) * .3);right:calc(var(--unit) * .3);z-index:200;display:flex;align-items:center;gap:calc(var(--unit) * .1)}.profile-online-badge{display:flex;align-items:center;gap:calc(var(--unit) * .05);padding:calc(var(--unit) * .1) calc(var(--unit) * .14);background:linear-gradient(135deg,#22c55e33,#16a34a26);border:1px solid rgba(34,197,94,.35);border-radius:calc(var(--unit) * .08);font-size:max(11px,calc(var(--unit) * .15));font-weight:600;color:#4ade80;white-space:nowrap}.profile-online-badge .online-dot{width:calc(var(--unit) * .1);height:calc(var(--unit) * .1);background:#4ade80;border-radius:50%;animation:online-pulse 2s ease-in-out infinite}@keyframes online-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(.85)}}.profile-online-badge.loading{padding:calc(var(--unit) * .08);min-width:calc(var(--unit) * .5)}.profile-online-badge .online-loading{width:calc(var(--unit) * .3);height:calc(var(--unit) * .14);background:#22c55e4d;border-radius:calc(var(--unit) * .025);animation:pulse 1.5s ease-in-out infinite}button.profile-online-badge{cursor:pointer;transition:transform .15s,border-color .15s}.online-badge-chevron{opacity:.7;margin-left:calc(var(--unit) * -.025)}@media (hover: hover){button.profile-online-badge:hover{transform:scale(1.05);border-color:#22c55e99}}.profile-menu-item.status-toggle{display:flex;align-items:center;gap:calc(var(--unit) * .1)}.status-toggle-switch{position:relative;width:calc(var(--unit) * .4);height:calc(var(--unit) * .22);border-radius:calc(var(--unit) * .11);background:#444;transition:background .2s;flex-shrink:0}.status-toggle-switch:after{content:"";position:absolute;top:calc(var(--unit) * .025);left:calc(var(--unit) * .025);width:calc(var(--unit) * .17);height:calc(var(--unit) * .17);border-radius:50%;background:#fff;transition:transform .2s}.status-toggle-switch.online{background:#4ade80}.status-toggle-switch.online:after{transform:translate(calc(var(--unit) * .18))}.status-toggle-switch.offline{background:#555}.profile-button-container{position:relative}.profile-notification-badge{position:absolute;top:0;right:0;transform:translate(40%,-35%);min-width:max(18px,calc(var(--unit) * .24));height:max(18px,calc(var(--unit) * .24));padding:0 calc(var(--unit) * .05);background:linear-gradient(135deg,#f87171,#ef4444);color:#fff;font-size:max(10px,calc(var(--unit) * .14));font-weight:700;display:flex;align-items:center;justify-content:center;border-radius:9999px;border:calc(var(--unit) * .025) solid rgba(26,18,38,.9);box-shadow:0 calc(var(--unit) * .02) calc(var(--unit) * .06) #ef444466;pointer-events:none;z-index:1}.profile-button{width:calc(var(--unit) * .75);height:calc(var(--unit) * .75);border-radius:22%;border:calc(var(--unit) * .025) solid rgba(212,168,75,.6);background:#1a1226cc;cursor:pointer;padding:0;overflow:hidden;transition:border-color .2s,transform .2s;display:flex;align-items:center;justify-content:center;box-shadow:0 0 calc(var(--unit) * .1) #d4a84b26}.profile-button.loading{cursor:default}@media (hover: hover){.profile-button:hover:not(.loading){border-color:#d4a84bb3;transform:scale(1.05)}}.profile-avatar{width:100%;height:100%;object-fit:cover;object-position:center;display:block;flex-shrink:0}.profile-avatar-fallback{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:max(15px,calc(var(--unit) * .22));font-weight:600;color:#f0dca8e6;background:linear-gradient(135deg,#d4a84b4d,#b8923a4d)}.profile-avatar-placeholder{width:100%;height:100%;background:#ffffff1a;animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,to{opacity:.4}50%{opacity:.7}}.profile-menu{position:absolute;top:calc(100% + calc(var(--unit) * .1));right:0;min-width:calc(var(--unit) * 3.5);max-width:calc(100vw - calc(var(--unit) * .6));background:linear-gradient(180deg,#20182efa,#120c1cfa);border:1px solid rgba(212,168,75,.25);border-radius:calc(var(--unit) * .15);box-shadow:0 calc(var(--unit) * .1) calc(var(--unit) * .4) #00000080;animation:menuFadeIn .15s ease-out;overflow:hidden}@keyframes menuFadeIn{0%{opacity:0;transform:translateY(calc(var(--unit) * -.1)) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.profile-menu-header{display:flex;align-items:flex-start;gap:calc(var(--unit) * .15);padding:calc(var(--unit) * .2)}.profile-menu-avatar-btn{position:relative;background:none;border:calc(var(--unit) * .025) solid rgba(212,168,75,.5);border-radius:22%;padding:0;cursor:pointer;flex-shrink:0;transition:border-color .2s ease,box-shadow .2s ease;box-shadow:0 0 calc(var(--unit) * .08) #d4a84b26}.profile-menu-avatar-btn:active{transform:scale(.96)}.avatar-edit-badge{position:absolute;bottom:calc(var(--unit) * -.02);right:calc(var(--unit) * -.02);display:flex;align-items:center;justify-content:center;width:calc(var(--unit) * .22);height:calc(var(--unit) * .22);background:#fffffff2;border-radius:50%;color:#1a1425;box-shadow:0 calc(var(--unit) * .025) calc(var(--unit) * .05) #0006}.profile-menu-avatar,.profile-menu-avatar-fallback{width:calc(var(--unit) * .6);height:calc(var(--unit) * .6);border-radius:22%;flex-shrink:0}.profile-menu-avatar{object-fit:cover}.profile-menu-avatar-fallback{display:flex;align-items:center;justify-content:center;font-size:max(14px,calc(var(--unit) * .2));font-weight:600;color:#f0dca8e6;background:linear-gradient(135deg,#d4a84b4d,#b8923a4d)}.profile-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:calc(var(--unit) * .03)}.profile-name-row{display:flex;align-items:center;gap:calc(var(--unit) * .08)}.profile-title-badge{font-size:max(10px,calc(var(--unit) * .13));font-weight:600;color:#d4a84bd9;background:#d4a84b1f;border:1px solid rgba(212,168,75,.2);padding:1px 6px;border-radius:4px;white-space:nowrap;flex-shrink:0}.profile-title-badge.rarity-common{color:#b4bed2d9;background:#b4bed21f;border-color:#b4bed233}.profile-title-badge.rarity-uncommon{color:#64c882d9;background:#64c8821f;border-color:#64c88233}.profile-title-badge.rarity-rare{color:#64a0ffd9;background:#64a0ff1f;border-color:#64a0ff33}.profile-title-badge.rarity-epic{color:#b482dcd9;background:#b482dc1f;border-color:#b482dc33}.profile-title-badge.rarity-legendary{color:#d4a84bd9;background:#d4a84b1f;border-color:#d4a84b33}.profile-title-badge.rarity-hidden{color:#d4a84bf2;background:#d4a84b26;border-color:#d4a84b4d;box-shadow:0 0 8px #d4a84b4d}.profile-name{font-size:max(14px,calc(var(--unit) * .2));font-weight:600;color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.profile-edit-btn{display:flex;align-items:center;justify-content:center;width:calc(var(--unit) * .35);height:calc(var(--unit) * .35);border:none;background:#ffffff14;border-radius:calc(var(--unit) * .08);color:var(--color-text-secondary);cursor:pointer;transition:background .15s,color .15s;flex-shrink:0}@media (hover: hover){.profile-edit-btn:hover{background:#d4a84b33;color:#f0dca8f2}}.profile-email{font-size:max(11px,calc(var(--unit) * .15));color:var(--color-text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.profile-name-edit{flex:1;display:flex;flex-direction:column;gap:calc(var(--unit) * .08)}.profile-name-input{width:100%;padding:calc(var(--unit) * .08) calc(var(--unit) * .12);font-size:max(13px,calc(var(--unit) * .18));font-weight:500;color:#fff;background:#0000004d;border:1px solid rgba(212,168,75,.4);border-radius:calc(var(--unit) * .08);outline:none}.profile-name-input:focus{border-color:#d4a84bb3}.profile-name-input:disabled{opacity:.6}.profile-name-actions{display:flex;gap:calc(var(--unit) * .08)}.profile-action-btn{display:flex;align-items:center;justify-content:center;width:calc(var(--unit) * .4);height:calc(var(--unit) * .4);border:none;border-radius:calc(var(--unit) * .08);cursor:pointer;transition:background .15s,transform .1s}.profile-action-btn.save{background:#22c55e40;color:#4ade80}.profile-action-btn.cancel{background:#ef444433;color:#f87171}@media (hover: hover){.profile-action-btn.save:hover{background:#22c55e66}.profile-action-btn.cancel:hover{background:#ef444459}}.profile-action-btn:active{transform:scale(.95)}.profile-action-btn:disabled{opacity:.5;cursor:not-allowed}.profile-error{font-size:max(11px,calc(var(--unit) * .14));color:#f87171;margin:0}.profile-menu-divider{height:1px;background:#d4a84b26;margin:0 calc(var(--unit) * .12)}.profile-menu-item{display:flex;align-items:center;gap:calc(var(--unit) * .12);width:100%;padding:calc(var(--unit) * .15) calc(var(--unit) * .2);font-size:max(13px,calc(var(--unit) * .18));font-weight:500;color:var(--color-text-secondary);background:transparent;border:none;cursor:pointer;transition:background .15s,color .15s;text-align:left;white-space:nowrap}@media (hover: hover){.profile-menu-item:hover{background:#ffffff0d;color:#fff}}.profile-menu-item.achievements{color:#fbbf24}@media (hover: hover){.profile-menu-item.achievements:hover{background:#fbbf241f;color:#fcd34d}}.achievement-badge{margin-left:auto;background:#fbbf2433;color:#fbbf24;font-size:max(10px,calc(var(--unit) * .14));font-weight:600;padding:1px 6px;border-radius:10px;min-width:20px;text-align:center}.new-badge{min-width:max(18px,calc(var(--unit) * .22));height:max(18px,calc(var(--unit) * .22));padding:0 calc(var(--unit) * .05);background:linear-gradient(135deg,#f87171,#ef4444);color:#fff;font-size:max(10px,calc(var(--unit) * .13));font-weight:700;display:inline-flex;align-items:center;justify-content:center;border-radius:9999px;box-shadow:0 1px 4px #ef44444d}.title-current-badge{margin-left:auto;background:#d4a84b26;color:#d4a84bcc;font-size:max(10px,calc(var(--unit) * .14));font-weight:500;padding:1px 8px;border-radius:10px}.title-current-badge.rarity-common{color:#b4bed2cc;background:#b4bed226}.title-current-badge.rarity-uncommon{color:#64c882cc;background:#64c88226}.title-current-badge.rarity-rare{color:#64a0ffcc;background:#64a0ff26}.title-current-badge.rarity-epic{color:#b482dccc;background:#b482dc26}.title-current-badge.rarity-legendary{color:#d4a84bcc;background:#d4a84b26}.title-current-badge.rarity-hidden{color:#d4a84be6;background:#d4a84b2e;box-shadow:0 0 6px #d4a84b40}.profile-menu-item.switch-account{color:#94a3b8}@media (hover: hover){.profile-menu-item.switch-account:hover{background:#94a3b81f;color:#cbd5e1}}.profile-menu-item.login-google{color:#60a5fa}@media (hover: hover){.profile-menu-item.login-google:hover{background:#60a5fa1f;color:#93bbfd}}.profile-login-btn{display:flex;align-items:center;gap:calc(var(--unit) * .06);padding:calc(var(--unit) * .08) calc(var(--unit) * .14);background:#ffffff1a;border:1px solid rgba(255,255,255,.25);border-radius:calc(var(--unit) * .1);font-size:max(12px,calc(var(--unit) * .16));font-weight:600;color:#ffffffe0;cursor:pointer;transition:all .15s ease}@media (hover: hover){.profile-login-btn:hover{background:#ffffff29;border-color:#ffffff59;color:#fff;box-shadow:0 0 12px #ffffff14}}.profile-login-btn:active{transform:translateY(1px) scale(.98);background:#ffffff0a;box-shadow:none}.lobby-page{--safe-area-bottom: env(safe-area-inset-bottom, 0px);--unit: calc((100dvh - var(--safe-area-bottom)) / 15.5);--max-width: min(calc(var(--unit) * 10.5), 100vw);--content-max-width: calc(var(--unit) * 9);--tab-bar-h: calc(max(var(--unit) * 1.2, 48px) + var(--safe-area-bottom));--spacing-xs: calc(var(--unit) * .08);--spacing-sm: calc(var(--unit) * .12);--spacing-md: calc(var(--unit) * .18);--spacing-lg: calc(var(--unit) * .24);--cardRadius: calc(var(--unit) * .18);--cardBorder: 1px solid rgba(255, 255, 255, .1);--cardShadow: 0 12px 26px rgba(0, 0, 0, .44), inset 0 1px 0 rgba(255, 255, 255, .06), inset 0 0 0 1px rgba(255, 255, 255, .05);--cardHighlight: linear-gradient(180deg, rgba(255, 255, 255, .04), rgba(0, 0, 0, .1));--iconBoxSize: clamp(38px, calc(var(--unit) * .65), 46px);--iconBoxRadius: calc(var(--unit) * .12);--cardGap: clamp(10px, calc(var(--unit) * .15), 16px);--cardPad: calc(var(--unit) * .15);--ctaGrad: linear-gradient(178deg, #eed38f 0%, #d4a84e 30%, #b8872d 70%, #9a6e22 100%);--ctaBorder: 1px solid rgba(255, 215, 150, .34);--ctaShadow: 0 12px 28px rgba(0, 0, 0, .42), 0 2px 0 rgba(0, 0, 0, .26);--ctaInner: inset 0 0 0 1px rgba(255, 255, 255, .14);width:100%;height:calc(100% - var(--tab-bar-h));display:flex;flex-direction:column;align-items:center;gap:var(--spacing-md);background:transparent;box-sizing:border-box}.lobby-footer{width:100%;max-width:var(--content-max-width);flex-shrink:0;display:flex;flex-direction:column;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-lg) var(--spacing-md)}.lobby-actions{width:100%;display:flex;flex-direction:column;gap:var(--spacing-sm)}.lobby-cta{width:100%;display:flex;align-items:center;justify-content:center;gap:var(--spacing-xs);padding:var(--cardPad) var(--spacing-lg);background:var(--ctaGrad);border:var(--ctaBorder);border-radius:var(--cardRadius);color:#181410;font-size:clamp(14px,calc(var(--unit) * .22),17px);font-weight:700;cursor:pointer;position:relative;overflow:hidden;box-shadow:var(--ctaShadow),var(--ctaInner),inset 0 1px #ffffff1a;transition:transform .15s ease,box-shadow .15s ease}.lobby-cta:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to bottom,#ffffff2e,#fff0 55%);pointer-events:none}.lobby-cta:after{content:"";position:absolute;top:-50%;right:0;bottom:-50%;left:0;background:linear-gradient(115deg,transparent 0%,rgba(255,255,255,.12) 44%,rgba(255,255,255,.03) 56%,transparent 70%);transform:translate(-130%);animation:lobby-gold-sheen 9s ease-in-out infinite;pointer-events:none}@keyframes lobby-gold-sheen{0%,70%{transform:translate(-130%);opacity:.8}85%,to{transform:translate(120%);opacity:0}}@media (hover: hover){.lobby-cta:hover{transform:translateY(-1px);box-shadow:0 14px 32px #0000007a,0 2px #00000042,var(--ctaInner)}}.lobby-cta:active{transform:scale(.98);box-shadow:0 8px 20px #0000004d}.lobby-join-code{display:flex;gap:var(--spacing-sm)}.lobby-code-input{flex:1;padding:var(--spacing-sm) var(--cardPad);font-size:clamp(16px,calc(var(--unit) * .2),18px);font-weight:600;font-family:SF Mono,Roboto Mono,monospace;letter-spacing:.15em;text-align:center;color:#fff;background:linear-gradient(180deg,rgba(255,255,255,.03),transparent 60%),#16121ed9;border:var(--cardBorder);border-radius:var(--iconBoxRadius);outline:none;box-shadow:0 2px 8px #00000040,inset 0 1px #ffffff0a;transition:border-color .2s,box-shadow .2s;min-height:44px}.lobby-code-input:focus{border-color:#d4a84b80;box-shadow:0 4px 14px #0000004d,0 0 12px #d4a84b14}.lobby-code-input::placeholder{color:#fff3;letter-spacing:.15em}.lobby-code-join-btn{padding:var(--spacing-sm) var(--spacing-md);background:#d4a84b26;border:1px solid rgba(212,168,75,.4);border-radius:var(--iconBoxRadius);color:#f0dca8f2;font-size:clamp(12px,calc(var(--unit) * .16),14px);font-weight:600;cursor:pointer;white-space:nowrap;transition:all .15s ease;min-height:44px}.lobby-code-join-btn:disabled{opacity:.4;cursor:not-allowed}@media (hover: hover){.lobby-code-join-btn:not(:disabled):hover{background:linear-gradient(180deg,rgba(255,255,255,.06),transparent 50%),#d4a84b40;border-color:#d4a84b99}}.lobby-code-join-btn:not(:disabled):active{transform:scale(.97)}.lobby-rooms{flex:1;width:100%;max-width:var(--content-max-width);min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:var(--spacing-md);padding:calc(var(--unit) * 1.2) var(--spacing-lg) 0}.lobby-loading{flex:1;display:flex;align-items:center;justify-content:center;gap:var(--spacing-sm);color:#ffffff80;font-size:clamp(13px,calc(var(--unit) * .18),15px)}.lobby-section{flex:1;min-height:0;display:flex;flex-direction:column;gap:var(--spacing-sm)}.lobby-section--waiting{flex:0 0 auto;max-height:50%}.lobby-section--waiting:only-child{flex:0 0 auto;max-height:50%;margin-top:auto}.lobby-section-title{display:flex;align-items:center;gap:var(--spacing-xs);font-size:clamp(10px,calc(var(--unit) * .13),13px);font-weight:600;color:#d4a84bb8;letter-spacing:1.2px;text-transform:uppercase;margin:0;flex-shrink:0}.lobby-section-title:after{content:"";flex:1;height:1px;background:linear-gradient(90deg,rgba(255,215,150,.22),rgba(255,215,150,.12) 60%,transparent 100%);box-shadow:0 0 8px #ffd7961a}.lobby-section-count{font-size:clamp(10px,calc(var(--unit) * .12),12px);font-weight:700;color:#d4a84b80;background:#d4a84b1a;padding:calc(var(--unit) * .02) var(--spacing-xs);border-radius:var(--iconBoxRadius)}.lobby-section-count--live{color:#34d399d9;background:#34d3991f;animation:lobby-live-pulse 2s ease-in-out infinite}@keyframes lobby-live-pulse{0%,to{opacity:1}50%{opacity:.4}}.lobby-room-list{flex:1 1 auto;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:var(--spacing-xs)}.lobby-empty{flex:1;display:flex;align-items:center;justify-content:center;font-size:clamp(13px,calc(var(--unit) * .17),15px);color:#ffffff4d;text-align:center;padding:var(--spacing-lg)}.lobby-page .game-setup{padding:0 var(--spacing-lg) var(--spacing-md);max-width:var(--content-max-width);margin-top:auto;flex-shrink:0;box-sizing:border-box}.lobby-settings-hint{font-size:clamp(11px,calc(var(--unit) * .14),13px);color:#ffffff59;margin:var(--spacing-xs) 0 0}.lobby-join-code--error{animation:lobby-shake .4s ease}.lobby-code-input--error{border-color:#ef444480!important}@keyframes lobby-shake{0%,to{transform:translate(0)}25%{transform:translate(-4px)}50%{transform:translate(4px)}75%{transform:translate(-2px)}}.lobby-error{padding:var(--spacing-sm) var(--cardPad);background:#ef44441f;border:1px solid rgba(239,68,68,.3);border-radius:var(--iconBoxRadius);color:#fca5a5f2;font-size:clamp(12px,calc(var(--unit) * .16),14px);text-align:center;margin:0}.room-card{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-sm) var(--cardPad);background:var(--cardHighlight),#16121ee6;border:var(--cardBorder);border-radius:var(--cardRadius);gap:var(--spacing-sm);flex-shrink:0;box-shadow:var(--cardShadow)}.room-card-info{display:flex;align-items:center;gap:var(--spacing-sm);flex:1;min-width:0}.room-card-avatar,.room-card-avatar-fallback{width:calc(var(--unit) * .48);height:calc(var(--unit) * .48);border-radius:22%;flex-shrink:0}.room-card-avatar--sm,.room-card-avatar-fallback.room-card-avatar--sm{width:calc(var(--unit) * .42);height:calc(var(--unit) * .42)}.room-card-avatar{object-fit:cover}.room-card-avatar-fallback{background:#d4a84b26;color:#f0dca8d9;display:flex;align-items:center;justify-content:center;font-size:clamp(10px,calc(var(--unit) * .13),12px);font-weight:700}.room-card-details{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.room-card-name-row{display:flex;align-items:center;gap:var(--spacing-xs);min-width:0}.room-card-name{font-size:clamp(12px,calc(var(--unit) * .16),14px);font-weight:600;color:#ffffffe6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.room-card-title-badge{font-size:clamp(8px,calc(var(--unit) * .1),10px);font-weight:600;color:#d4a84bd9;background:#d4a84b1f;border:1px solid rgba(212,168,75,.2);padding:1px var(--spacing-xs);border-radius:4px;white-space:nowrap;flex-shrink:0;max-width:calc(var(--unit) * .9);overflow:hidden;text-overflow:ellipsis}.room-card-title-badge.rarity-common{color:#b4bed2d9;background:#b4bed21f;border-color:#b4bed233}.room-card-title-badge.rarity-uncommon{color:#64c882d9;background:#64c8821f;border-color:#64c88233}.room-card-title-badge.rarity-rare{color:#64a0ffd9;background:#64a0ff1f;border-color:#64a0ff33}.room-card-title-badge.rarity-epic{color:#b482dcd9;background:#b482dc1f;border-color:#b482dc33}.room-card-title-badge.rarity-legendary{color:#d4a84bd9;background:#d4a84b1f;border-color:#d4a84b33}.room-card-title-badge.rarity-hidden{color:#d4a84bf2;background:#d4a84b26;border-color:#d4a84b4d;box-shadow:0 0 8px #d4a84b4d}.room-card-meta{display:flex;align-items:center;gap:var(--spacing-xs);font-size:clamp(9px,calc(var(--unit) * .12),11px);color:#ffffff7a}.room-card-meta svg{opacity:.6}.room-card-join-btn--pulse{animation:rc-join-pulse 2s ease-in-out infinite}@keyframes rc-join-pulse{0%,to{opacity:1}50%{opacity:.6}}.room-card-join-btn{padding:var(--spacing-xs) var(--cardPad);background:#10b9811f;color:#34d399;border:1px solid rgba(16,185,129,.25);border-radius:var(--iconBoxRadius);font-size:clamp(11px,calc(var(--unit) * .14),13px);font-weight:600;cursor:pointer;flex-shrink:0;min-width:calc(var(--unit) * .65);min-height:calc(var(--unit) * .52);transition:all .15s ease}.room-card-join-btn:disabled{opacity:.4;cursor:not-allowed}.room-card-join-btn:not(:disabled):active{background:#10b9814d;transform:scale(.96)}@media (hover: hover){.room-card-join-btn:not(:disabled):hover{background:linear-gradient(180deg,rgba(255,255,255,.05),transparent 50%),#10b98140;border-color:#10b98173}}.lobby-room-grid{flex:1 1 auto;min-height:0;overflow-y:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(max(calc(var(--unit) * 3.8),200px),100%),1fr));align-content:start;gap:var(--spacing-xs)}.room-card--playing{flex-direction:row;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--cardPad);cursor:pointer;transition:background .15s,transform .1s}.room-card--playing:active{background:var(--cardHighlight),#8b5cf614;transform:scale(.98)}@media (hover: hover){.room-card--playing:hover{background:linear-gradient(180deg,rgba(255,255,255,.03),transparent 50%),#8b5cf60f;border-color:#8b5cf640}}.room-card-matchup{display:flex;align-items:center;gap:var(--spacing-xs);flex:1;min-width:0}.rc-player-col{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}.rc-player-col--right{align-items:flex-end}.rc-player-col .room-card-name{font-size:clamp(12px,calc(var(--unit) * .16),15px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.rc-player-col .room-card-title-badge{font-size:clamp(8px,calc(var(--unit) * .1),10px);align-self:flex-start;max-width:100%}.rc-player-col--right .room-card-title-badge{align-self:flex-end}.rc-center-col{display:flex;flex-direction:column;align-items:center;gap:1px;flex-shrink:0}.rc-center-label{font-size:clamp(10px,calc(var(--unit) * .13),12px);color:#ffffff7a}.spinning{animation:lobby-spin 1s linear infinite}@keyframes lobby-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.history-page{--safe-area-bottom: env(safe-area-inset-bottom, 0px);--unit: calc((100dvh - var(--safe-area-bottom)) / 15.5);--tab-bar-h: calc(max(var(--unit) * 1.2, 48px) + var(--safe-area-bottom));--spacing-xs: calc(var(--unit) * .08);--spacing-sm: calc(var(--unit) * .12);--spacing-md: calc(var(--unit) * .18);--spacing-lg: calc(var(--unit) * .24);--cardRadius: calc(var(--unit) * .18);--cardBorder: 1px solid rgba(255, 255, 255, .1);--cardShadow: 0 12px 26px rgba(0, 0, 0, .44), inset 0 1px 0 rgba(255, 255, 255, .06), inset 0 0 0 1px rgba(255, 255, 255, .05);--cardHighlight: linear-gradient(180deg, rgba(255, 255, 255, .04), rgba(0, 0, 0, .1));--cardPad: calc(var(--unit) * .15);--content-max-width: calc(var(--unit) * 9);width:100%;height:100%;display:flex;flex-direction:column;align-items:center;padding:calc(var(--unit) * 1.2) var(--spacing-lg) var(--tab-bar-h)}.history-title{width:100%;max-width:var(--content-max-width);display:flex;align-items:center;gap:var(--spacing-xs);font-size:clamp(11px,calc(var(--unit) * .13),13px);font-weight:600;color:#d4a84bb8;letter-spacing:1.2px;text-transform:uppercase;margin:0 0 var(--spacing-sm);flex-shrink:0}.history-title>span:first-child:after{content:"";display:inline-block;vertical-align:middle;width:calc(var(--unit) * .6);height:1px;margin-left:var(--spacing-xs);background:linear-gradient(90deg,rgba(255,215,150,.22),transparent)}.history-stats{display:flex;align-items:center;gap:calc(var(--spacing-xs) * 1.2);margin-left:auto;flex-shrink:0}.history-stat{font-size:clamp(11px,calc(var(--unit) * .13),13px);font-weight:600;letter-spacing:0}.history-stat--win{color:#34d399}.history-stat--lose{color:#f87171}.history-stat--draw{color:#a78bfa}.history-stat-sep{color:#fff3;margin:0 1px}.history-stat-dot{width:2px;height:2px;border-radius:50%;background:#ffffff40}.history-stat--rate{color:#d4a84bb8;font-weight:700}.history-winbar{width:100%;max-width:var(--content-max-width);height:3px;border-radius:2px;display:flex;overflow:hidden;margin:0 0 var(--spacing-sm);flex-shrink:0;gap:1px}.history-winbar--win{background:#34d399;border-radius:2px 0 0 2px}.history-winbar--draw{background:#a78bfa}.history-winbar--lose{background:#f87171;border-radius:0 2px 2px 0}.history-list-wrap{width:100%;max-width:var(--content-max-width);overflow-y:auto;scrollbar-width:none}.history-list-wrap::-webkit-scrollbar{display:none}.history-list{display:flex;flex-direction:column;gap:var(--spacing-xs)}.match-card{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--cardPad);background:var(--cardHighlight),#16121ee6;border:var(--cardBorder);border-radius:var(--cardRadius);box-shadow:var(--cardShadow);position:relative;overflow:hidden}.match-card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px}.match-card--win:before{background:linear-gradient(180deg,#34d399,#10b981);box-shadow:0 0 8px #34d3994d}.match-card--lose:before{background:linear-gradient(180deg,#f87171,#ef4444);box-shadow:0 0 8px #f871714d}.match-card--draw:before{background:linear-gradient(180deg,#a78bfa,#8b5cf6);box-shadow:0 0 8px #a78bfa4d}.match-avatar,.match-avatar-fallback{width:calc(var(--unit) * .42);height:calc(var(--unit) * .42);border-radius:22%;flex-shrink:0}.match-avatar{object-fit:cover}.match-avatar-fallback{background:#d4a84b26;color:#f0dca8d9;display:flex;align-items:center;justify-content:center;font-size:clamp(11px,calc(var(--unit) * .11),12px);font-weight:700}.match-card--tappable{cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .15s,transform .1s}@media (hover: hover){.match-card--tappable:hover{background:var(--cardHighlight),#1e1928f2}}.match-card--tappable:active{transform:scale(.98)}.match-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.match-opponent{font-size:clamp(12px,calc(var(--unit) * .16),15px);font-weight:600;color:#ffffffe6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.match-meta{display:flex;align-items:center;gap:var(--spacing-xs);font-size:clamp(11px,calc(var(--unit) * .1),12px);color:#ffffff6b}.match-meta-dot{width:2px;height:2px;border-radius:50%;background:#ffffff40;flex-shrink:0}.match-forfeit{color:#f87171b3;font-size:clamp(10px,calc(var(--unit) * .09),11px);font-weight:500}.match-score{flex-shrink:0;text-align:right;display:flex;flex-direction:column;align-items:flex-end}.match-score-main{font-size:clamp(14px,calc(var(--unit) * .2),18px);font-weight:700;color:#ffffffe6;letter-spacing:-.5px}.match-card--win .match-score-my{color:#34d399}.match-card--lose .match-score-my{color:#f87171}.match-card--draw .match-score-my{color:#a78bfa}.match-score-sep{color:#ffffff4d;margin:0 1px}.match-score-date{font-size:clamp(10px,calc(var(--unit) * .09),11px);color:#ffffff59}.history-empty{width:100%;max-width:var(--content-max-width);flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--spacing-sm);color:#fff6;text-align:center}.history-empty-icon{font-size:calc(var(--unit) * .5);opacity:.3}.history-empty-text{font-size:clamp(12px,calc(var(--unit) * .15),14px)}.history-loading{display:flex;justify-content:center;padding:var(--spacing-md) 0;color:#ffffff59;font-size:clamp(10px,calc(var(--unit) * .12),12px)}.history-sentinel{height:1px;flex-shrink:0}.online-panel-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;z-index:1000;animation:fadeIn .2s ease}.online-panel{position:fixed;bottom:0;left:0;right:0;max-height:70dvh;background:radial-gradient(circle at 50% 0%,rgba(255,255,255,.06),transparent 55%),linear-gradient(180deg,#241832f2,#120c1cfa);border-radius:16px 16px 0 0;border-top:1px solid rgba(212,168,75,.25);box-shadow:0 -12px 36px #0000008c;z-index:1001;display:flex;flex-direction:column;animation:slideUp .25s ease;padding-bottom:env(safe-area-inset-bottom,0)}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.online-panel-header{display:flex;align-items:center;justify-content:space-between;padding:16px 16px 12px;border-bottom:1px solid rgba(255,255,255,.1)}.online-panel-header h3{margin:0;font-size:16px;font-weight:600;color:#e0e0e0}.online-panel-close{background:none;border:none;color:#888;width:44px;height:44px;display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:50%;flex-shrink:0}.online-panel-close:active{background:#ffffff14}.online-panel-back{background:none;border:none;color:#888;font-size:14px;cursor:pointer;padding:10px 12px;min-height:44px;display:flex;align-items:center}.online-panel-back:active{color:#ccc}.online-panel-list{flex:1;overflow-y:auto;padding:8px 0;-webkit-overflow-scrolling:touch}.online-panel-empty{padding:32px 16px;text-align:center;color:#666;font-size:14px}.online-panel-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:48px 16px;color:#888;font-size:14px}.online-user-row{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;gap:12px}.online-user-info{display:flex;align-items:center;gap:10px;flex:1;min-width:0}.online-user-avatar,.online-user-avatar-fallback{width:36px;height:36px;border-radius:22%;flex-shrink:0}.online-user-avatar{object-fit:cover}.online-user-avatar-fallback{background:#10b98133;color:#10b981;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:600}.online-user-details{display:flex;flex-direction:column;min-width:0}.online-user-name-row{display:flex;align-items:center;gap:5px;min-width:0}.online-user-name{font-size:14px;color:#e0e0e0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.online-user-title-badge{font-size:10px;font-weight:600;color:#d4a84bd9;background:#d4a84b1f;border:1px solid rgba(212,168,75,.2);padding:1px 6px;border-radius:4px;white-space:nowrap;flex-shrink:0;max-width:80px;overflow:hidden;text-overflow:ellipsis}.online-user-title-badge.rarity-common{color:#b4bed2d9;background:#b4bed21f;border-color:#b4bed233}.online-user-title-badge.rarity-uncommon{color:#64c882d9;background:#64c8821f;border-color:#64c88233}.online-user-title-badge.rarity-rare{color:#64a0ffd9;background:#64a0ff1f;border-color:#64a0ff33}.online-user-title-badge.rarity-epic{color:#b482dcd9;background:#b482dc1f;border-color:#b482dc33}.online-user-title-badge.rarity-legendary{color:#d4a84bd9;background:#d4a84b1f;border-color:#d4a84b33}.online-user-title-badge.rarity-hidden{color:#d4a84bf2;background:#d4a84b26;border-color:#d4a84b4d;box-shadow:0 0 8px #d4a84b4d}.online-user-you-badge{font-size:13px;font-weight:500;color:#ffffff59;flex-shrink:0;min-width:44px;min-height:40px;display:flex;align-items:center;justify-content:center}.online-user-status-badge{font-size:11px;color:#f59e0b;margin-top:2px}.online-user-status-badge.waiting{color:#a78bfa}.online-user-status-badge.activity{color:#67b8e3}.online-user-status-badge.blocked{color:#666}.online-user-settings{color:#888}.online-user-invite-btn{background:#10b98126;color:#10b981;border:1px solid rgba(16,185,129,.3);border-radius:8px;padding:4px 12px;font-size:13px;font-weight:500;cursor:pointer;flex-shrink:0;min-width:44px;min-height:40px}.online-user-invite-btn:disabled{opacity:.4;cursor:not-allowed}.online-user-invite-btn:not(:disabled):active{background:#10b9814d;transform:scale(.96)}@media (hover: hover){.online-user-invite-btn:not(:disabled):hover{background:#10b98140}}.online-user-spectate-btn{background:#8b5cf626;color:#a78bfa;border:1px solid rgba(139,92,246,.3);border-radius:8px;padding:4px 12px;font-size:13px;font-weight:500;cursor:pointer;flex-shrink:0;min-width:44px;min-height:40px}.online-user-spectate-btn:disabled{opacity:.4;cursor:not-allowed}.online-user-spectate-btn:not(:disabled):active{background:#8b5cf64d;transform:scale(.96)}@media (hover: hover){.online-user-spectate-btn:not(:disabled):hover{background:#8b5cf640}}.online-panel-settings{padding:16px;display:flex;flex-direction:column;gap:16px}.invite-target{display:flex;align-items:center;gap:10px;padding:8px 0}.invite-target-avatar,.invite-target-avatar-fallback{width:40px;height:40px;border-radius:22%;flex-shrink:0}.invite-target-avatar{object-fit:cover}.invite-target-avatar-fallback{background:#10b98133;color:#10b981;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:600}.invite-target-name{font-size:15px;color:#e0e0e0;font-weight:500}.settings-group{display:flex;flex-direction:column;gap:8px}.settings-label{display:flex;align-items:center;gap:6px;font-size:11px;color:#d6c8aa80;text-transform:uppercase;letter-spacing:1.8px;font-weight:700}.settings-pills{display:grid;grid-template-columns:repeat(2,1fr);gap:6px}.settings-pills.timer-pills{grid-template-columns:repeat(4,1fr)}.settings-pill{display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,rgba(255,255,255,.03),transparent 60%),#16121ed9;border:1px solid rgba(255,255,255,.08);color:#fff9;border-radius:10px;padding:8px 12px;font-size:14px;font-weight:600;cursor:pointer;transition:all .15s ease;min-height:40px;box-shadow:0 2px 8px #00000040,inset 0 1px #ffffff0a}.settings-pill.selected{background:linear-gradient(180deg,rgba(255,255,255,.05),transparent 50%),#d4a84b2e;border-color:#d4a84b8c;color:#f0dca8f2;box-shadow:0 4px 14px #0000004d,0 0 12px #d4a84b14,inset 0 1px #ffffff0f}.settings-pill .tile-set-count{font-size:11px;font-weight:500;opacity:.6;padding:2px 6px;background:#ffffff1a;border-radius:4px;margin-left:6px}.settings-pill.selected .tile-set-count{background:#d4a84b40;opacity:.8}.settings-pill:active{transform:scale(.95)}@media (hover: hover){.settings-pill:not(.selected):hover{background:linear-gradient(180deg,rgba(255,255,255,.05),transparent 60%),#1e182ae6;border-color:#d4a84b4d;color:#fff;box-shadow:0 4px 12px #00000059,inset 0 1px #ffffff0f}}.invite-error{color:#fca5a5f2;font-size:13px;margin:0;padding:8px 12px;background:#ef44441f;border:1px solid rgba(239,68,68,.3);border-radius:10px}.invite-send-btn{background:linear-gradient(178deg,#eed38f,#d4a84e 30%,#b8872d 70%,#9a6e22);color:#181410;border:1px solid rgba(255,215,150,.34);border-radius:10px;padding:12px;font-size:15px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;box-shadow:0 4px 14px #0000004d,inset 0 1px #ffffff24;position:relative;overflow:hidden}.invite-send-btn:not(:disabled):active{transform:scale(.97);opacity:.9}.invite-send-btn:disabled{opacity:.6;cursor:not-allowed}.spinning{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (min-width: 600px){.online-panel{left:50%;right:auto;transform:translate(-50%);width:100%;max-width:600px;animation:slideUpCentered .25s ease}@keyframes slideUpCentered{0%{transform:translate(-50%) translateY(100%)}to{transform:translate(-50%) translateY(0)}}}.invite-popup{position:fixed;top:0;left:0;right:0;z-index:2000;display:flex;justify-content:center;padding:calc(env(safe-area-inset-top,0px) + 12px) 12px 0;animation:inviteSlideDown .3s ease;pointer-events:none}@keyframes inviteSlideDown{0%{transform:translateY(-100%);opacity:0}to{transform:translateY(0);opacity:1}}.invite-popup-content{background:radial-gradient(circle at 50% 100%,rgba(16,185,129,.06),transparent 60%),linear-gradient(180deg,#241832f7,#120c1cfa);border:1px solid rgba(16,185,129,.3);border-radius:14px;padding:14px;width:100%;max-width:360px;box-shadow:0 8px 32px #00000080;pointer-events:all;position:relative;overflow:hidden}.invite-popup-sender{display:flex;align-items:center;gap:10px;margin-bottom:12px}.invite-popup-avatar,.invite-popup-avatar-fallback{width:38px;height:38px;border-radius:22%;flex-shrink:0}.invite-popup-avatar{object-fit:cover}.invite-popup-avatar-fallback{background:#10b98133;color:#10b981;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:600}.invite-popup-info{display:flex;flex-direction:column;min-width:0}.invite-popup-name{font-size:14px;font-weight:600;color:#e0e0e0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.invite-popup-detail{font-size:12px;color:#888;margin-top:2px}.invite-popup-detail strong{color:#bbb;font-weight:600}.invite-popup-actions{display:flex;gap:8px}.invite-popup-decline,.invite-popup-accept{flex:1;border:none;border-radius:8px;padding:10px;font-size:14px;font-weight:600;cursor:pointer;min-height:44px}.invite-popup-decline{background:#ffffff14;color:#aaa;border:1px solid rgba(255,255,255,.15)}.invite-popup-accept{background:linear-gradient(135deg,#10b981,#059669);color:#fff}.invite-popup-decline:not(:disabled):active{background:#ffffff24;transform:scale(.97)}.invite-popup-accept:not(:disabled):active{opacity:.85;transform:scale(.97)}.invite-popup-decline:disabled,.invite-popup-accept:disabled{opacity:.5;cursor:not-allowed}.invite-popup-countdown{position:absolute;bottom:0;left:0;right:0;height:3px;background:#ffffff0d}.invite-popup-countdown-fill{height:100%;background:#10b981;transition:width 1s linear;border-radius:0 2px 2px 0}.daily-popup{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1500;display:flex;align-items:center;justify-content:center;background:#0009;padding:16px;animation:dailyPopupFadeIn .2s ease}@keyframes dailyPopupFadeIn{0%{opacity:0}to{opacity:1}}.daily-popup-content{background:radial-gradient(circle at 50% 100%,rgba(245,158,11,.08),transparent 60%),linear-gradient(180deg,#241832f7,#120c1cfa);border:1px solid rgba(245,158,11,.3);border-radius:16px;padding:24px;width:100%;max-width:min(320px,calc(100vw - 32px));text-align:center;box-shadow:0 8px 32px #00000080;animation:dailyPopupScaleIn .25s ease}@keyframes dailyPopupScaleIn{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}.daily-popup-icon{width:56px;height:56px;margin:0 auto 16px;background:linear-gradient(135deg,#f59e0b33,#d9770626);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#f59e0b}.daily-popup-title{font-size:20px;font-weight:700;color:#f0f0f0;margin:0 0 12px}.daily-popup-streak{display:inline-flex;align-items:center;gap:6px;background:#f59e0b26;border:1px solid rgba(245,158,11,.3);border-radius:20px;padding:6px 14px;font-size:14px;font-weight:600;color:#fbbf24;margin-bottom:12px}.daily-popup-streak svg{color:#f97316}.daily-popup-countdown{display:flex;align-items:center;justify-content:center;gap:6px;font-size:13px;color:#888;margin-bottom:20px}.daily-popup-countdown svg{color:#666}.daily-popup-cta{width:100%;border:none;border-radius:10px;padding:14px;font-size:16px;font-weight:700;cursor:pointer;min-height:48px;background:linear-gradient(135deg,#f59e0b,#d97706);color:#000;margin-bottom:12px;transition:opacity .15s,transform .15s}.daily-popup-cta:active{opacity:.85;transform:scale(.97)}.daily-popup-dismiss{background:transparent;border:none;color:#777;font-size:14px;cursor:pointer;padding:8px 16px;transition:color .15s}.daily-popup-dismiss:active{color:#aaa}.daily-popup-desc{font-size:14px;color:#999;margin:0 0 12px;line-height:1.4}.daily-popup-cta-login{display:flex;align-items:center;justify-content:center;gap:8px}.spectator-connection-error{position:fixed;top:8px;right:8px;color:#ef4444;font-weight:700;font-size:16px;z-index:100}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%;height:100dvh;overflow:hidden}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;background:transparent}.app-loading{--safe-area-bottom: env(safe-area-inset-bottom, 0px);--unit: calc((100dvh - var(--safe-area-bottom)) / 15.5);--max-width: min(calc(var(--unit) * 10.5), 100vw);width:100%;max-width:var(--max-width);min-height:100vh;min-height:100dvh;margin:0 auto;display:flex;align-items:center;justify-content:center;background:#0f0b12 url(/wood-background.png) center/cover no-repeat;position:relative}.app-loading:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at 50% 30%,#7858a047,#120c1ae6 65%),linear-gradient(180deg,#0e0a1499,#08060ce6);z-index:0}.app-loading-logo{position:relative;z-index:1;width:min(calc(var(--unit) * 4),70vw);height:auto;filter:drop-shadow(0 10px 20px rgba(0,0,0,.45));animation:logo-pulse 1.5s ease-in-out infinite}@keyframes logo-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.85;transform:scale(.98)}}.tab-shell{--safe-area-bottom: env(safe-area-inset-bottom, 0px);--unit: calc((100dvh - var(--safe-area-bottom)) / 15.5);position:fixed;top:0;right:0;bottom:0;left:0;max-width:min(calc(var(--unit) * 10.5),100vw);margin:0 auto}.tab-slider-clip{position:absolute;top:0;right:0;bottom:0;left:0;overflow:clip}.tab-shared-bg{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;background:#0f0b12;pointer-events:none;overflow:hidden}.tab-shared-bg:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:url(/board-bg.jpg) center calc(0% - 4vh) / 180% auto no-repeat;mask-image:linear-gradient(to bottom,#000,#0009 30%,#0000 55%);-webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,1) 0%,rgba(0,0,0,.6) 30%,rgba(0,0,0,0) 55%);opacity:.45}.tab-shared-bg:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to bottom,#0a080e8c,#0a080e59,#0a080e1a 60%,#0a080e00),radial-gradient(ellipse 80% 60% at 50% 0%,#ffdc9624,#0000 65%),linear-gradient(to bottom,#0000 55%,#00000047),linear-gradient(180deg,#0c0a121a,#0a080e8c,#08060ce6)}.tab-slider{display:flex;width:300%;height:100%;transition:transform .3s ease-out;will-change:transform}.tab-slider.is-dragging{transition:none}.tab-slider-page{width:33.333%;height:100%;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;align-items:center;justify-content:flex-end}.tab-slider-page--top,.tab-slider-page--top-scroll{justify-content:flex-start;overflow-y:hidden}