@import"https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;1,400&family=Source+Sans+3:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&display=swap";:root{--bg: #1a1714;--bg-warm: #1e1b17;--surface: #252220;--surface-alt: #2a2724;--surface-hover: #322f2b;--primary: #ede8e0;--primary-light: #c8c2b8;--accent: #d4a44a;--accent-hover: #e0b45c;--accent-light: rgba(212, 164, 74, .1);--accent-subtle: rgba(212, 164, 74, .05);--secondary: #8b7355;--secondary-hover: #a08560;--secondary-light: rgba(139, 115, 85, .12);--text: #ede8e0;--text-secondary: #9b9488;--text-muted: #6b6560;--text-inverse: #1a1714;--danger: #c45a4a;--danger-light: rgba(196, 90, 74, .12);--success: #5a9e6a;--success-light: rgba(90, 158, 106, .12);--warning: #d4a44a;--border: rgba(255, 255, 255, .08);--border-light: rgba(255, 255, 255, .05);--border-focus: var(--accent);--font-body: "Source Sans 3", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-display: "Playfair Display", Georgia, serif;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 2rem;--text-4xl: 2.5rem;--text-5xl: 3.5rem;--weight-normal: 400;--weight-medium: 500;--weight-semibold: 600;--weight-bold: 700;--weight-extrabold: 700;--leading-tight: 1.15;--leading-normal: 1.5;--leading-relaxed: 1.6;--tracking-tight: -.02em;--tracking-normal: 0;--tracking-wide: .02em;--tracking-wider: .08em;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--space-16: 4rem;--space-20: 5rem;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 14px;--radius-xl: 20px;--radius-full: 9999px;--shadow-xs: 0 1px 2px rgba(0, 0, 0, .2);--shadow-sm: 0 1px 3px rgba(0, 0, 0, .25), 0 1px 2px rgba(0, 0, 0, .15);--shadow-md: 0 4px 12px rgba(0, 0, 0, .3);--shadow-lg: 0 10px 30px rgba(0, 0, 0, .35), 0 4px 10px rgba(0, 0, 0, .2);--shadow-xl: 0 20px 50px rgba(0, 0, 0, .45);--transition-fast: .15s ease;--transition-base: .25s ease;--transition-slow: .4s ease;--max-width-sm: 24rem;--max-width-md: 32rem;--max-width-lg: 48rem;--max-width-content: 56rem;--board-border: rgba(58, 72, 88, .6);--board-shadow: rgba(0, 0, 0, .6)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html,body{height:100%;overscroll-behavior:none}body{font-family:var(--font-body);font-size:var(--text-base);font-weight:var(--weight-normal);line-height:var(--leading-normal);color:var(--text);background:var(--bg);letter-spacing:var(--tracking-normal);position:relative}body:after{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:9999;opacity:.03;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-repeat:repeat;background-size:256px 256px}#root{height:100svh;width:100vw;overflow:hidden;position:relative}h1,h2,h3,h4,h5,h6{font-family:var(--font-display);font-weight:var(--weight-normal);line-height:var(--leading-tight);letter-spacing:var(--tracking-tight);color:var(--primary)}a{color:var(--accent);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--accent-hover)}button{font-family:inherit;cursor:pointer;border:none;background:none;font-size:inherit}input{font-family:inherit;font-size:inherit}ul,ol{list-style:none}img{max-width:100%;display:block}canvas{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;touch-action:none}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-3) var(--space-6);font-weight:var(--weight-semibold);font-size:var(--text-sm);line-height:1;border-radius:var(--radius-md);transition:all var(--transition-fast);white-space:nowrap;letter-spacing:var(--tracking-wide)}.btn:active{transform:scale(.97)}.btn-primary{background:linear-gradient(180deg,#ddb05a 0%,#c49538 100%);color:var(--text-inverse);box-shadow:var(--shadow-sm),inset 0 1px #ffffff26}.btn-primary:hover{background:linear-gradient(180deg,#e4bc68 0%,#d4a44a 100%);box-shadow:var(--shadow-md),inset 0 1px #fff3,0 0 20px #d4a44a26}.btn-outline{background-color:transparent;color:var(--accent);border:1.5px solid rgba(212,164,74,.25)}.btn-outline:hover{border-color:var(--accent);background-color:var(--accent-light)}.btn-secondary{background-color:var(--surface-alt);color:var(--text);border:1px solid var(--border)}.btn-secondary:hover{background-color:var(--surface-hover);border-color:#ffffff1f}.btn-danger{background-color:var(--danger-light);color:var(--danger);border:1px solid transparent}.btn-danger:hover{background-color:var(--danger);color:var(--text)}.btn-icon{width:40px;height:40px;padding:0;border-radius:var(--radius-full);display:inline-flex;align-items:center;justify-content:center}.btn-lg{padding:var(--space-4) var(--space-8);font-size:var(--text-base);border-radius:var(--radius-lg)}.btn-sm{padding:var(--space-2) var(--space-4);font-size:var(--text-xs)}.btn img,.btn svg{width:18px;height:18px}.btn-lg img,.btn-lg svg{width:20px;height:20px}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);overflow:hidden}.card-body{padding:var(--space-6)}.input{width:100%;padding:var(--space-3) var(--space-4);background:var(--bg-warm);border:1.5px solid var(--border);border-radius:var(--radius-md);color:var(--text);font-size:var(--text-base);transition:border-color var(--transition-fast),box-shadow var(--transition-fast);outline:none}.input::placeholder{color:var(--text-muted)}.input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-light)}.input-error{border-color:var(--danger)}.input-error:focus{box-shadow:0 0 0 3px var(--danger-light)}.error-text{font-size:var(--text-xs);color:var(--danger);margin-top:var(--space-1)}.top-banner{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;justify-content:center;height:40px;background:var(--surface);border-bottom:1px solid var(--border);cursor:pointer;transition:background var(--transition-fast)}.top-banner:hover{background:var(--surface-alt)}.top-banner__back{display:inline-flex;align-items:center;color:var(--accent);margin-right:var(--space-2)}.top-banner__back svg{display:block}.top-banner__text{font-family:var(--font-display);font-size:var(--text-sm);color:var(--text-muted);letter-spacing:var(--tracking-wide)}.avatar{display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-full);font-weight:var(--weight-semibold);font-size:var(--text-sm);color:var(--text-inverse);flex-shrink:0}.badge{display:inline-block;padding:var(--space-1) var(--space-3);font-size:var(--text-xs);font-weight:var(--weight-semibold);border-radius:var(--radius-full);letter-spacing:var(--tracking-wide)}.badge-success{background:var(--success-light);color:var(--success)}.badge-danger{background:var(--danger-light);color:var(--danger)}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:200;background:rgba(10,8,6,.6);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;animation:fadeIn var(--transition-fast) ease}.modal{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);box-shadow:var(--shadow-xl);padding:var(--space-8);max-width:var(--max-width-sm);width:calc(100% - var(--space-8));text-align:center;display:flex;flex-direction:column;gap:var(--space-4)}.modal h2{font-size:var(--text-xl)}.toast{position:fixed;right:var(--space-4);bottom:var(--space-4);background:var(--surface-alt);border:1px solid rgba(212,164,74,.2);border-radius:var(--radius-md);padding:var(--space-3) var(--space-5);box-shadow:var(--shadow-lg);font-size:var(--text-sm);color:var(--accent);font-weight:var(--weight-medium);animation:toastIn var(--transition-base) ease,toastOut var(--transition-base) ease 2.5s forwards;z-index:300}.center-layout{display:flex;align-items:center;justify-content:center;height:100%;padding:var(--space-4)}.center-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);padding:var(--space-8);max-width:var(--max-width-sm);width:100%;text-align:center;display:flex;flex-direction:column;align-items:center;gap:var(--space-4)}.center-card h2{font-size:var(--text-xl)}.page-enter{animation:pageEnter var(--transition-base) ease}@keyframes pageEnter{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.trial-badge{display:inline-block;padding:var(--space-2) var(--space-4);font-size:var(--text-xs);font-weight:var(--weight-semibold);color:var(--accent);background:var(--accent-light);border:1px solid rgba(212,164,74,.25);border-radius:var(--radius-full);letter-spacing:var(--tracking-wide);text-align:center;margin-bottom:var(--space-2)}.paywall-inline{display:flex;flex-direction:column;align-items:stretch;gap:var(--space-3);width:100%}.paywall-card{background:var(--surface);border:1px solid rgba(212,164,74,.2);border-radius:var(--radius-lg);padding:var(--space-6);display:flex;flex-direction:column;align-items:center;gap:var(--space-3)}.paywall-card h3{font-family:var(--font-display);font-size:var(--text-lg);color:var(--text)}.paywall-card p{font-size:var(--text-sm);color:var(--text-secondary)}.paywall-note{font-size:var(--text-xs);color:var(--text-muted);font-style:italic}.dev-panel{position:fixed;bottom:var(--space-4);right:var(--space-4);background:var(--surface);border:1.5px solid var(--accent);border-radius:var(--radius-lg);padding:var(--space-4);box-shadow:var(--shadow-lg);z-index:500;min-width:200px}.dev-panel__title{font-size:var(--text-xs);font-weight:var(--weight-bold);color:var(--accent);margin-bottom:var(--space-3);letter-spacing:var(--tracking-wide);text-transform:uppercase}.dev-panel__buttons{display:flex;gap:var(--space-2);margin-bottom:var(--space-3)}.dev-panel__status{font-size:var(--text-xs);color:var(--text-muted);font-family:monospace}.btn:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.landing{display:flex;flex-direction:column;align-items:center;height:100%;padding-top:52px;padding-bottom:0;position:relative;overflow:hidden}.landing__bg{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:radial-gradient(ellipse at 50% 15%,rgba(212,164,74,.08) 0%,transparent 55%),radial-gradient(ellipse at 30% 80%,rgba(139,115,85,.06) 0%,transparent 50%)}.landing__spacer-top{flex:1;min-height:var(--space-4)}.landing__header{text-align:center;z-index:1;flex-shrink:0}.landing__spacer-mid{flex:1.2;min-height:var(--space-4);max-height:var(--space-10)}.landing__subtitle{font-family:var(--font-body);font-size:var(--text-xs);font-weight:var(--weight-semibold);color:var(--text-muted);letter-spacing:var(--tracking-wider);text-transform:uppercase;margin-bottom:var(--space-2)}.landing__title{font-family:var(--font-display);font-size:var(--text-5xl);font-weight:var(--weight-normal);color:var(--primary);letter-spacing:var(--tracking-tight);line-height:1}.landing__rink{display:flex;justify-content:center;margin-top:var(--space-6);margin-bottom:var(--space-4);opacity:0;animation:rinkReveal 1s ease .6s forwards}@keyframes rinkReveal{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.landing__tagline{font-family:var(--font-body);font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--text-secondary);letter-spacing:var(--tracking-wider);text-transform:uppercase}.landing__actions{display:flex;flex-direction:column;align-items:center;gap:var(--space-2);z-index:1;flex-shrink:0}#game-buttons,.paywall-inline{display:flex;flex-direction:column;align-items:center;gap:var(--space-2);width:100%}.landing__actions .btn{width:260px}.landing__spacer-bottom{flex:1;min-height:var(--space-2)}.landing__footer{flex-shrink:0;z-index:1;display:flex;flex-direction:column;align-items:center;gap:6px;padding-bottom:var(--space-4);animation:fadeIn var(--transition-slow) ease backwards;animation-delay:.8s}.landing__footer-dash{width:20px;height:1px;background:var(--border)}.landing__footer-text{font-family:var(--font-body);font-size:10px;font-weight:var(--weight-medium);color:var(--text-muted);letter-spacing:var(--tracking-wider);text-transform:uppercase}.landing__actions .btn:nth-child(1){animation:slideUp .35s cubic-bezier(.22,1,.36,1) backwards;animation-delay:.1s}.landing__actions .btn:nth-child(2){animation:slideUp .35s cubic-bezier(.22,1,.36,1) backwards;animation-delay:.15s}.landing__actions .btn:nth-child(3){animation:slideUp .35s cubic-bezier(.22,1,.36,1) backwards;animation-delay:.2s}.landing__actions .btn:nth-child(4){animation:slideUp .35s cubic-bezier(.22,1,.36,1) backwards;animation-delay:.25s}.landing__actions .btn:nth-child(5){animation:slideUp .35s cubic-bezier(.22,1,.36,1) backwards;animation-delay:.3s}.landing__clear{position:fixed;top:var(--space-2);left:var(--space-2);font-size:var(--text-xs);color:var(--text-muted);z-index:10;opacity:.4;transition:opacity var(--transition-fast)}.landing__clear:hover{opacity:1;color:var(--accent)}.choose-name{display:flex;align-items:center;justify-content:center;height:100%;padding:var(--space-4)}.choose-name__card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);padding:var(--space-8);max-width:var(--max-width-sm);width:100%;display:flex;flex-direction:column;gap:var(--space-5)}.choose-name__title{font-size:var(--text-2xl);text-align:center}.choose-name__form{display:flex;flex-direction:column;gap:var(--space-3)}.games-layout{height:100%;display:flex;flex-direction:column}.games-layout--fullscreen{padding-top:0}.games-layout__content{flex:1;overflow-y:auto}.available-games{max-width:var(--max-width-lg);margin:0 auto;padding:var(--space-4);height:100%;display:flex;flex-direction:column}.available-games__header{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-4) 0 var(--space-4)}.available-games__title{flex:1;font-size:var(--text-3xl)}.available-games__list{display:flex;flex-direction:column;gap:var(--space-2)}.game-row{display:flex;align-items:center;justify-content:space-between;padding:var(--space-3) var(--space-4);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);transition:all var(--transition-fast)}.game-row:hover{border-color:#ffffff1f;box-shadow:var(--shadow-sm)}.game-row--full{opacity:.6}.game-row--full:hover{opacity:.75;box-shadow:none;border-color:var(--border)}.game-row__info{display:flex;align-items:center;gap:var(--space-3)}.game-row__avatar{width:36px;height:36px;border-radius:var(--radius-full);background:var(--accent);display:flex;align-items:center;justify-content:center;font-weight:var(--weight-bold);font-size:var(--text-sm);color:var(--text-inverse);flex-shrink:0}.game-row__avatar--busy{background:var(--secondary)}.game-row__details{display:flex;flex-direction:column;gap:2px}.game-row__name{font-weight:var(--weight-semibold);font-size:var(--text-sm);color:var(--text)}.game-row__status{font-size:var(--text-xs);color:var(--text-muted)}.game-row__status--open{color:var(--success)}.game-row__status--busy{color:var(--secondary)}.empty-state{text-align:center;padding:var(--space-12) var(--space-8);display:flex;flex-direction:column;align-items:center;gap:var(--space-4);color:var(--text-secondary)}.empty-state p{color:var(--text-muted);font-size:var(--text-sm)}.lobby{max-width:var(--max-width-lg);margin:0 auto;padding:var(--space-4);height:100%;display:flex;flex-direction:column;gap:var(--space-3)}.lobby__header{text-align:center;padding:var(--space-3) 0 0;display:flex;flex-direction:column;align-items:center;gap:var(--space-1)}.lobby__kicker{font-family:var(--font-body);font-size:var(--text-xs);font-weight:var(--weight-semibold);color:var(--text-muted);letter-spacing:var(--tracking-wider);text-transform:uppercase}.lobby__title{font-family:var(--font-display);font-size:var(--text-2xl);font-weight:var(--weight-normal);color:var(--primary);letter-spacing:var(--tracking-tight);line-height:var(--leading-tight)}.lobby__status{display:flex;align-items:center;justify-content:center;margin-top:var(--space-1)}.lobby__header-rule{width:40px;height:1px;background:var(--border);margin-top:var(--space-2)}.lobby__warning{background:var(--danger-light);color:var(--danger);border:1px solid rgba(196,90,74,.3);border-radius:var(--radius-md);padding:var(--space-2) var(--space-3);font-size:var(--text-sm);font-weight:var(--weight-medium);text-align:center}.lobby__toolbar{display:flex;align-items:center;justify-content:space-between}.lobby__toolbar-right{display:flex;align-items:center;gap:var(--space-2)}.lobby__latency{position:relative;display:inline-flex;align-items:center;gap:6px;cursor:pointer;padding:3px 10px 3px 8px;border-radius:var(--radius-full);background:var(--surface-alt);border:1px solid var(--border);transition:border-color var(--transition-fast),background var(--transition-fast);-webkit-tap-highlight-color:transparent}.lobby__latency:hover{border-color:#ffffff1f;background:var(--surface)}.lobby__latency-lamp{display:block;width:8px;height:8px;border-radius:var(--radius-full);flex-shrink:0;transition:background-color .4s ease,box-shadow .4s ease}.lobby__latency-lamp--good{background-color:#5aa86a;box-shadow:0 0 6px #5aa86a80}.lobby__latency-lamp--fair{background-color:#d4a44a;box-shadow:0 0 6px #d4a44a80}.lobby__latency-lamp--poor{background-color:#c45a4a;box-shadow:0 0 6px #c45a4a80}.lobby__latency-lamp--unknown{background-color:var(--text-muted);box-shadow:none}.lobby__latency-label{font-size:11px;font-weight:var(--weight-medium);color:var(--text-secondary);letter-spacing:var(--tracking-wide);line-height:1;transition:color var(--transition-fast)}.lobby__latency-popup{position:absolute;top:calc(100% + 6px);left:50%;transform:translate(-50%) translateY(-2px);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--space-1) var(--space-3);font-size:var(--text-xs);font-weight:var(--weight-medium);color:var(--text-secondary);white-space:nowrap;box-shadow:var(--shadow-md);opacity:0;visibility:hidden;transition:opacity var(--transition-fast),transform var(--transition-fast),visibility var(--transition-fast);pointer-events:none;z-index:50}.lobby__latency-popup.is-visible{opacity:1;visibility:visible;transform:translate(-50%) translateY(0)}.lobby__transport-badge{font-size:9px;font-weight:var(--weight-semibold);color:var(--text-muted);letter-spacing:var(--tracking-wider);text-transform:uppercase;padding:2px 6px;border-radius:var(--radius-sm);background:var(--surface-alt);border:1px solid var(--border);opacity:0;transition:opacity var(--transition-fast)}.lobby__transport-badge.is-visible{opacity:1}.lobby__players{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--space-2) var(--space-4)}.lobby__player-name{font-size:var(--text-xs);font-weight:var(--weight-medium);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--text-secondary)}.lobby__player-name.is-ready{color:var(--success)}.lobby__chat{flex:1;display:flex;flex-direction:column-reverse;overflow-y:auto;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--space-3);gap:var(--space-1)}.chat-message{display:flex;gap:var(--space-2);font-size:var(--text-sm);line-height:var(--leading-relaxed)}.chat-message__time{color:var(--text-muted);font-size:var(--text-xs);flex-shrink:0}.chat-message__user{font-weight:var(--weight-semibold);color:var(--accent);flex-shrink:0}.chat-message__user--me{color:var(--accent)}.chat-message__user--other{color:var(--secondary)}.chat-message__text{color:var(--text)}.lobby__input-row{display:flex;align-items:center;gap:var(--space-2)}.lobby__input-row .input{flex:1}.action-menu{position:relative}.action-menu__trigger{width:36px;height:36px;border-radius:var(--radius-md);background:var(--surface);border:1px solid var(--border);color:var(--text-secondary);display:flex;align-items:center;justify-content:center;transition:all var(--transition-fast);cursor:pointer}.action-menu__trigger:hover{border-color:#d4a44a4d;color:var(--accent);background:var(--accent-light)}.action-menu__dropdown{position:absolute;right:0;top:calc(100% + 4px);min-width:160px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);padding:var(--space-1);opacity:0;visibility:hidden;transform:translateY(-4px);transition:all var(--transition-fast);z-index:50}.action-menu__dropdown.is-open{opacity:1;visibility:visible;transform:translateY(0)}.action-menu__item{width:100%;display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);font-size:var(--text-sm);color:var(--text);border-radius:var(--radius-sm);transition:all var(--transition-fast);cursor:pointer;background:none;border:none;font-family:inherit;text-align:left}.action-menu__item:hover{background:var(--surface-alt);color:var(--accent)}.action-menu__item--danger:hover{background:var(--danger-light);color:var(--danger)}.game-view{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;overflow:hidden}.score-banner{display:flex;align-items:center;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);height:28px;margin-bottom:var(--space-1);position:relative;box-shadow:var(--shadow-xs)}.score-banner__exit{display:flex;align-items:center;justify-content:center;width:28px;height:100%;flex-shrink:0;color:var(--text-muted);cursor:pointer;border:none;background:none;border-right:1px solid var(--border);transition:color var(--transition-fast),background var(--transition-fast);border-radius:var(--radius-sm) 0 0 var(--radius-sm)}.score-banner__exit:hover{color:var(--danger);background:var(--danger-light)}.score-banner__exit svg{width:12px;height:12px}.score-banner__player{display:flex;align-items:center;gap:var(--space-1);padding:0 var(--space-2);font-size:11px;font-weight:var(--weight-medium);min-width:0;flex:1}.score-banner__player:last-child{flex-direction:row-reverse}.score-banner__player-name{color:var(--text-secondary);white-space:nowrap;overflow:hidden;min-width:0;flex:1;-webkit-mask-image:linear-gradient(to right,white calc(100% - 16px),transparent);mask-image:linear-gradient(to right,white calc(100% - 16px),transparent)}.score-banner__player:last-child .score-banner__player-name{text-align:right;-webkit-mask-image:linear-gradient(to left,white calc(100% - 16px),transparent);mask-image:linear-gradient(to left,white calc(100% - 16px),transparent)}.score-banner__player-score{font-family:var(--font-display);font-size:var(--text-base);color:var(--accent);flex-shrink:0}.score-banner__timer{flex-shrink:0;padding:0 var(--space-2);font-family:var(--font-display);font-size:var(--text-base);color:var(--primary);text-align:center;min-width:32px}.game-canvas{border-radius:var(--radius-lg);border:2px solid var(--board-border);box-shadow:0 4px 24px var(--board-shadow)}.goal-flash{position:absolute;top:0;left:50%;transform:translate(-50%);pointer-events:none;background:radial-gradient(ellipse at center,rgba(255,255,255,.6) 0%,rgba(255,255,255,.2) 40%,rgba(255,255,255,0) 70%);animation:goalFlash .3s ease-out forwards;z-index:10}@keyframes goalFlash{0%{opacity:1}to{opacity:0}}.game-view--shake{animation:screenShake .3s ease-out}@keyframes screenShake{0%{transform:translate(0)}15%{transform:translate(-3px,2px)}30%{transform:translate(2px,-3px)}45%{transform:translate(-2px,1px)}60%{transform:translate(2px,-1px)}75%{transform:translate(-1px,2px)}to{transform:translate(0)}}.score-banner__timer--warning{color:#e8a040}.score-banner__timer--critical{color:#f44;animation:timerPulse 1s ease-in-out infinite}@keyframes timerPulse{0%,to{opacity:1}50%{opacity:.5}}.online-users{max-width:var(--max-width-lg);margin:0 auto;padding:var(--space-4)}.online-users__header{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-4) 0 var(--space-4)}.online-users__header-center{flex:1;text-align:center;padding-right:60px}.online-users__title{font-size:var(--text-3xl)}.online-users__count{font-size:var(--text-sm);color:var(--text-muted);margin-top:var(--space-1)}.online-users__list{display:flex;flex-direction:column;gap:var(--space-2)}.online-users__item{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);transition:all var(--transition-fast);animation:slideUp .3s ease backwards}.online-users__item:hover{border-color:#ffffff1f;box-shadow:var(--shadow-sm)}.online-users__status{width:8px;height:8px;border-radius:var(--radius-full);background:var(--success);flex-shrink:0}.online-users__avatar{width:36px;height:36px;border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;font-weight:var(--weight-bold);font-size:var(--text-sm);color:var(--text-inverse);flex-shrink:0}.online-users__item-name{font-weight:var(--weight-medium);font-size:var(--text-sm)}.error-page{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:var(--space-4);text-align:center;padding:var(--space-4)}.error-page h1{font-size:var(--text-3xl)}.error-page p{color:var(--text-secondary);max-width:360px}.status-screen{display:flex;align-items:center;justify-content:center;height:100%}.status-screen__text{font-weight:var(--weight-medium);font-size:var(--text-lg);color:var(--text-secondary)}.login{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-8);height:100%;position:relative;overflow:hidden}.login__bg{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:radial-gradient(ellipse at 50% 25%,rgba(212,164,74,.1) 0%,transparent 55%),radial-gradient(ellipse at 70% 85%,rgba(139,115,85,.06) 0%,transparent 45%)}.login__header{text-align:center;z-index:1}.login__subtitle{font-family:var(--font-body);font-size:var(--text-xs);font-weight:var(--weight-semibold);color:var(--text-muted);letter-spacing:var(--tracking-wider);text-transform:uppercase;margin-bottom:var(--space-2)}.login__title{font-family:var(--font-display);font-size:var(--text-5xl);font-weight:var(--weight-normal);color:var(--primary);letter-spacing:var(--tracking-tight);line-height:1}.login__rink{display:flex;justify-content:center;margin-top:var(--space-6);margin-bottom:var(--space-2);opacity:0;animation:rinkReveal 1s ease .6s forwards}.login__tagline{font-family:var(--font-body);font-size:var(--text-sm);color:var(--text-muted);letter-spacing:var(--tracking-wide);animation:fadeIn 1s ease 1s backwards}.login__card{background:var(--surface);border:1px solid rgba(212,164,74,.12);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg),0 0 60px #d4a44a0a;padding:var(--space-8);max-width:var(--max-width-sm);width:calc(100% - var(--space-8));text-align:center;display:flex;flex-direction:column;align-items:center;gap:var(--space-4);z-index:1;animation:slideUp .5s ease backwards;animation-delay:.2s}.login__card-title{font-size:var(--text-xl)}.login__card-subtitle{font-size:var(--text-sm);color:var(--text-secondary)}.login__divider{width:100%;display:flex;align-items:center;gap:var(--space-3)}.login__divider-line{flex:1;height:1px;background:var(--border)}.login__google-btn{display:flex;justify-content:center;min-height:44px}.login__error{font-size:var(--text-sm);color:var(--danger)}.login__footer{font-size:var(--text-sm);color:var(--text-secondary);z-index:1;animation:slideUp .5s ease backwards;animation-delay:.4s;font-weight:var(--weight-medium);letter-spacing:var(--tracking-wide)}.landing__user-bar{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;justify-content:space-between;height:52px;padding:0 var(--space-4);background:var(--surface);border-bottom:1px solid var(--border)}.landing__user-info{display:flex;align-items:center;gap:var(--space-2)}.landing__user-avatar{width:30px;height:30px;border-radius:var(--radius-full);background:var(--accent);color:var(--text-inverse);display:flex;align-items:center;justify-content:center;font-size:var(--text-xs);font-weight:var(--weight-bold)}.landing__user-name{font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--text-secondary)}.server-starting{display:flex;align-items:center;justify-content:center;height:100%;position:relative;overflow:hidden;background:radial-gradient(ellipse at 50% 40%,rgba(212,164,74,.06) 0%,transparent 60%)}.server-starting__content{display:flex;flex-direction:column;align-items:center;gap:var(--space-4);text-align:center;padding:var(--space-8);animation:slideUp .5s ease backwards}.server-starting__puck-container{position:relative;width:80px;height:80px;margin-bottom:var(--space-4)}.server-starting__puck{width:80px;height:80px;border-radius:var(--radius-full);background:linear-gradient(135deg,#d4a44a 0%,#b8862e 100%);animation:puckFloat 2s ease-in-out infinite;box-shadow:0 8px 32px #d4a44a4d,inset 0 -4px 12px #0003,inset 0 4px 12px #ffffff26}.server-starting__glow{position:absolute;bottom:-8px;left:50%;transform:translate(-50%);width:60px;height:16px;border-radius:var(--radius-full);background:rgba(212,164,74,.2);filter:blur(8px);animation:serverGlowPulse 2s ease-in-out infinite}@keyframes puckFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-16px)}}@keyframes serverGlowPulse{0%,to{opacity:.6;transform:translate(-50%) scale(1)}50%{opacity:.3;transform:translate(-50%) scale(.8)}}.server-starting__title{font-family:var(--font-display);font-size:var(--text-2xl);color:var(--primary)}.server-starting__subtitle{font-size:var(--text-base);color:var(--text-secondary);font-weight:var(--weight-medium)}.server-starting__progress{width:200px;height:4px;background:var(--surface-alt);border-radius:var(--radius-full);overflow:hidden;margin-top:var(--space-2)}.server-starting__progress-bar{height:100%;width:0;background:var(--accent);border-radius:var(--radius-full);transition:width .1s linear}.server-starting__hint{font-size:var(--text-xs);color:var(--text-muted);margin-top:var(--space-2)}.find-match{display:flex;align-items:center;justify-content:center;height:100%;position:relative;overflow:hidden}.find-match__bg{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:radial-gradient(ellipse at 50% 40%,rgba(212,164,74,.08) 0%,transparent 60%)}.find-match__content{display:flex;flex-direction:column;align-items:center;gap:var(--space-4);text-align:center;padding:var(--space-8);z-index:1;animation:slideUp .5s ease backwards}.find-match__puck-container{position:relative;width:80px;height:80px;margin-bottom:var(--space-4)}.find-match__puck{width:80px;height:80px;border-radius:var(--radius-full);background:linear-gradient(135deg,#d4a44a 0%,#b8862e 100%);animation:puckFloat 2s ease-in-out infinite;box-shadow:0 8px 32px #d4a44a4d,inset 0 -4px 12px #0003,inset 0 4px 12px #ffffff26;position:relative;z-index:2}.find-match__radar-ring{position:absolute;top:-20px;right:-20px;bottom:-20px;left:-20px;border-radius:var(--radius-full);border:2px solid var(--accent);opacity:0;animation:radarSweep 2.4s ease-out infinite}.find-match__radar-ring--delayed{animation-delay:1.2s}.find-match__title{font-family:var(--font-display);font-size:var(--text-2xl);color:var(--primary)}.find-match__subtitle{font-size:var(--text-base);color:var(--text-secondary);font-weight:var(--weight-medium)}.find-match__timer{font-family:var(--font-display);color:var(--accent)}.find-match__timeout-actions{display:flex;flex-direction:column;align-items:center;gap:var(--space-3);margin-top:var(--space-4)}.find-match__timeout-actions .btn{width:220px}.find-match__check{animation:checkPop .4s cubic-bezier(.34,1.56,.64,1)}@keyframes checkPop{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}.btn-link{background:none;border:none;color:var(--text-muted);font-size:var(--text-sm);cursor:pointer;padding:var(--space-1) var(--space-2);font-family:inherit;transition:color var(--transition-fast)}.btn-link:hover{color:var(--text-secondary)}.landing__actions .btn:nth-child(6){animation:slideUp .35s cubic-bezier(.22,1,.36,1) backwards;animation-delay:.35s}.landing__actions .btn:nth-child(7){animation:slideUp .35s cubic-bezier(.22,1,.36,1) backwards;animation-delay:.4s}.leaderboard{max-width:var(--max-width-lg);margin:0 auto;padding:var(--space-4);height:100%;display:flex;flex-direction:column}.leaderboard__header{padding:var(--space-4) 0 var(--space-6);display:flex;align-items:center;gap:var(--space-3)}.leaderboard__header .btn{flex-shrink:0}.leaderboard__header-center{flex:1;text-align:center;padding-right:60px}.leaderboard__title{font-family:var(--font-display);font-size:var(--text-3xl);color:var(--primary)}.leaderboard__subtitle{font-size:var(--text-sm);color:var(--text-muted);margin-top:var(--space-1)}.leaderboard__list{display:flex;flex-direction:column;gap:var(--space-2);overflow-y:auto;flex:1}.leaderboard__loading{text-align:center;color:var(--text-muted);padding:var(--space-12)}.leaderboard__row{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);transition:all var(--transition-fast);cursor:pointer;animation:slideUp .3s ease backwards}.leaderboard__row:hover{border-color:#ffffff1f;box-shadow:var(--shadow-sm)}.leaderboard__row--me{border-color:#d4a44a40;background:var(--accent-light)}.leaderboard__rank{width:32px;text-align:center;font-weight:var(--weight-bold);font-size:var(--text-lg);flex-shrink:0}.leaderboard__rank-num{color:var(--text-muted);font-size:var(--text-sm)}.leaderboard__avatar{width:36px;height:36px;border-radius:var(--radius-full);background:var(--accent);color:var(--text-inverse);display:flex;align-items:center;justify-content:center;font-weight:var(--weight-bold);font-size:var(--text-sm);flex-shrink:0}.leaderboard__name{flex:1;font-weight:var(--weight-medium);font-size:var(--text-sm)}.leaderboard__elo{font-family:var(--font-display);font-size:var(--text-lg);color:var(--accent);font-weight:var(--weight-bold)}.profile{max-width:var(--max-width-lg);margin:0 auto;padding:var(--space-4);height:100%;display:flex;flex-direction:column;overflow-y:auto}.profile__header{padding:var(--space-4) 0}.profile__content{display:flex;flex-direction:column;gap:var(--space-6)}.profile__loading{text-align:center;color:var(--text-muted);padding:var(--space-12)}.profile__card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);padding:var(--space-8);display:flex;flex-direction:column;align-items:center;gap:var(--space-4);animation:slideUp .5s ease backwards}.profile__avatar-lg{width:64px;height:64px;border-radius:var(--radius-full);background:var(--accent);color:var(--text-inverse);display:flex;align-items:center;justify-content:center;font-weight:var(--weight-bold);font-size:var(--text-2xl)}.profile__name{font-family:var(--font-display);font-size:var(--text-2xl);color:var(--primary)}.profile__you{font-family:var(--font-body);font-size:var(--text-sm);color:var(--text-muted);font-weight:var(--weight-normal)}.profile__elo-badge{display:flex;flex-direction:column;align-items:center;gap:var(--space-1);padding:var(--space-3) var(--space-6);background:var(--accent-light);border:1px solid rgba(212,164,74,.25);border-radius:var(--radius-lg)}.profile__elo-label{font-size:var(--text-xs);color:var(--text-muted);text-transform:uppercase;letter-spacing:var(--tracking-wider)}.profile__elo-value{font-family:var(--font-display);font-size:var(--text-3xl);color:var(--accent);font-weight:var(--weight-bold)}.profile__stats{display:flex;gap:var(--space-6)}.profile__stat{display:flex;flex-direction:column;align-items:center;gap:var(--space-1)}.profile__stat-value{font-family:var(--font-display);font-size:var(--text-xl);font-weight:var(--weight-bold)}.profile__stat-value--win{color:var(--success)}.profile__stat-value--loss{color:var(--danger)}.profile__stat-label{font-size:var(--text-xs);color:var(--text-muted);text-transform:uppercase;letter-spacing:var(--tracking-wider)}.profile__matches{animation:slideUp .5s ease .15s backwards}.profile__matches-title{font-size:var(--text-lg);margin-bottom:var(--space-3)}.profile__matches-list{display:flex;flex-direction:column;gap:var(--space-2)}.profile__match{display:flex;align-items:center;justify-content:space-between;padding:var(--space-3) var(--space-4);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);border-left:3px solid var(--border)}.profile__match--win{border-left-color:var(--success)}.profile__match--loss{border-left-color:var(--danger)}.profile__match--draw{border-left-color:var(--warning)}.profile__match-result{font-weight:var(--weight-semibold);font-size:var(--text-sm);width:48px}.profile__match--win .profile__match-result{color:var(--success)}.profile__match--loss .profile__match-result{color:var(--danger)}.profile__match--draw .profile__match-result{color:var(--warning)}.profile__match-score{font-family:var(--font-display);font-size:var(--text-lg);color:var(--primary)}.profile__match-date{font-size:var(--text-xs);color:var(--text-muted)}@media (max-width: 640px){.landing__title{font-size:var(--text-4xl)}.landing__actions{gap:var(--space-1)}.landing__actions .btn{width:220px}.landing__rink{margin-top:var(--space-3);margin-bottom:var(--space-2)}.landing__subtitle{margin-bottom:var(--space-1)}.login__title{font-size:var(--text-4xl)}.login__card{padding:var(--space-6)}.profile__stats{gap:var(--space-4)}.profile__card{padding:var(--space-6)}}.result-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:200;display:flex;align-items:center;justify-content:center;background:rgba(10,8,6,.75);animation:fadeIn var(--transition-base) ease}.result-modal{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);box-shadow:0 24px 48px #0000004d,0 8px 16px #00000026,0 0 80px #d4a44a0f;padding:var(--space-10) var(--space-8) var(--space-8);max-width:380px;width:calc(100% - var(--space-8));text-align:center;display:flex;flex-direction:column;align-items:center;gap:var(--space-4);animation:resultModalEnter .5s cubic-bezier(.16,1,.3,1) forwards}@keyframes resultModalEnter{0%{opacity:0;transform:translateY(20px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}.result-modal__emoji{font-size:3.5rem;line-height:1;animation:emojiBounce .6s cubic-bezier(.34,1.56,.64,1) .2s both}@keyframes emojiBounce{0%{opacity:0;transform:scale(.3) rotate(-8deg)}60%{transform:scale(1.15) rotate(2deg)}to{opacity:1;transform:scale(1) rotate(0)}}.result-modal__headline{font-family:var(--font-display);font-size:var(--text-3xl);font-weight:var(--weight-normal);color:var(--primary);letter-spacing:var(--tracking-tight);line-height:var(--leading-tight);animation:resultFadeUp .5s ease .3s both}.result-modal__subtitle{font-size:var(--text-sm);color:var(--text-secondary);margin:calc(-1 * var(--space-2)) 0 0;animation:resultFadeUp .5s ease .4s both}@keyframes resultFadeUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.result-modal__scoreboard{display:flex;align-items:stretch;gap:var(--space-3);width:100%;animation:resultFadeUp .5s ease .5s both}.result-modal__vs{display:flex;align-items:center;font-size:var(--text-xs);font-weight:var(--weight-bold);color:var(--text-muted);letter-spacing:var(--tracking-wider);text-transform:uppercase;flex-shrink:0}.result-card{flex:1;display:flex;flex-direction:column;align-items:center;gap:var(--space-2);padding:var(--space-4) var(--space-3);border-radius:var(--radius-lg);background:var(--surface-alt);border:1.5px solid var(--border);transition:all var(--transition-fast)}.result-card--winner{background:rgba(212,164,74,.08);border-color:#d4a44a4d;box-shadow:0 0 24px #d4a44a14}.result-card--loser{opacity:.7}.result-card__name{font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.result-card__score{font-family:var(--font-display);font-size:var(--text-4xl);line-height:1;color:var(--primary)}.result-card--winner .result-card__score{color:var(--accent)}.result-card__badge{display:inline-block;padding:2px var(--space-3);font-size:10px;font-weight:var(--weight-bold);letter-spacing:var(--tracking-wider);text-transform:uppercase;border-radius:var(--radius-full)}.result-card__badge--win{background:rgba(212,164,74,.15);color:var(--accent)}.result-card__badge--loss{background:var(--danger-light);color:var(--danger)}.result-card__badge--draw{background:var(--secondary-light);color:var(--secondary)}.result-modal .btn{animation:resultFadeUp .5s ease .65s both;width:100%}.ripple{animation:titleReveal .8s ease-out}@keyframes titleReveal{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes fabSpin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes toastIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes toastOut{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(8px)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.35}}.is-loading{animation:pulse 1.8s ease-in-out infinite}@keyframes slideUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.btn-exit{animation:btnExit .35s cubic-bezier(.4,0,1,1) forwards;pointer-events:none}@keyframes btnExit{0%{opacity:1;transform:scale(1);filter:blur(0)}to{opacity:0;transform:scale(.7);filter:blur(4px)}}@keyframes radarSweep{0%{transform:scale(.8);opacity:.6}to{transform:scale(2.2);opacity:0}}@keyframes glowPulse{0%,to{box-shadow:var(--shadow-sm),inset 0 1px #ffffff26,0 0 #d4a44a00}50%{box-shadow:var(--shadow-sm),inset 0 1px #ffffff26,0 0 24px #d4a44a1f}}@keyframes titleShimmer{0%{background-position:-200% center}to{background-position:200% center}}.title-shimmer{background:linear-gradient(90deg,var(--primary) 0%,var(--primary) 40%,var(--accent) 50%,var(--primary) 60%,var(--primary) 100%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:titleShimmer 6s ease-in-out infinite}