:root{--color-background:#0f172a;--color-background-soft:#172033;--color-primary:#7c3aed;--color-primary-hover:#8b5cf6;--color-primary-text:#a78bfa;--color-text:#f8fafc;--color-text-muted:#aab4c4;--color-success:#22c55e;--color-error:#ef4444}*{box-sizing:border-box;margin:0;padding:0}html{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}body{background-color:var(--color-background);min-width:320px;min-height:100vh;color:var(--color-text)}#root{min-height:100vh}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit}input{font:inherit}.visually-hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Arial,sans-serif;line-height:1.5}h1,h2,h3{letter-spacing:.03em;font-weight:800}h1{font-size:2rem}h2{font-size:1.5rem}h3{font-size:1.2rem}p{color:var(--color-text-muted)}.home{background:radial-gradient(circle at top,#7c3aed38,#0000 40%);flex-direction:column;justify-content:center;align-items:center;gap:20px;min-height:100vh;padding:24px;display:flex}.home main{display:contents}.home-footer{gap:24px;display:flex;position:fixed;bottom:16px}.home-footer a{color:var(--color-text-muted);font-size:.8rem;transition:color .2s}.home-footer a:hover{color:var(--color-primary-text)}.hero{flex-direction:column;align-items:center;gap:12px;display:flex}.hero-title{color:var(--color-primary-text);text-align:center;letter-spacing:.1em;margin:0;font-size:clamp(4rem,8vw,6rem);font-weight:800}.hero-subtitle{color:var(--color-text-muted);text-align:center;letter-spacing:.03em;margin:0;font-size:1.5rem}.hero-description{color:var(--color-text);text-align:center;letter-spacing:.08em;margin:0;font-size:1.2rem}.button{background:linear-gradient(135deg, var(--color-primary), var(--color-primary-hover));color:var(--color-text);letter-spacing:.08em;cursor:pointer;border:none;border-radius:14px;padding:16px 48px;font-size:1rem;font-weight:800;transition:transform .18s,box-shadow .18s,filter .18s;box-shadow:0 10px 30px #7c3aed59,0 0 0 1px #ffffff14}.button:hover{filter:brightness(1.08);transform:translateY(-3px);box-shadow:0 14px 38px #7c3aed80,0 0 0 1px #ffffff1f}.button:active{transform:translateY(0)scale(.98)}.button:focus-visible{outline-offset:4px;outline:3px solid #8b5cf673}.button:disabled{cursor:not-allowed;opacity:.6;transform:none}.login-link{color:var(--color-primary-text);font-weight:600;text-decoration:none;transition:color .2s}.login-link:hover{color:var(--color-primary-hover);text-decoration:underline}.play-menu-buttons{flex-direction:column;gap:16px;display:flex}.play-menu-title{text-align:center;margin:0 0 24px}@media (width<=480px){.play-menu{border-radius:14px;padding:24px 20px}.play-menu-title{font-size:1.35rem}.play-menu-buttons,.play-menu-buttons .button{width:100%}}.overlay{z-index:10;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);background-color:#0f172aa6;position:fixed;inset:0}.modal{z-index:20;background:radial-gradient(circle at top, #7c3aed38, transparent 45%), var(--color-background-soft);border-radius:16px;width:min(380px,100% - 32px);max-height:calc(100vh - 32px);padding:32px;position:fixed;top:50%;left:50%;overflow-y:auto;transform:translate(-50%,-50%);box-shadow:0 10px 30px #7c3aed59,0 0 0 1px #ffffff14}.forgot-password-link{color:var(--color-text-muted);cursor:pointer;text-align:left;background:0 0;border:none;margin-top:16px;padding:0;font-size:.85rem;transition:color .2s}.forgot-password-link:hover{color:var(--color-primary-text)}.oauth-buttons{flex-direction:column;gap:12px;margin-top:20px;display:flex}.oauth-divider{color:var(--color-text-muted);align-items:center;gap:12px;font-size:.85rem;display:flex}.oauth-divider:before,.oauth-divider:after{content:"";background:#ffffff1a;flex:1;height:1px}.oauth-button{border-radius:10px;justify-content:center;align-items:center;gap:10px;padding:12px 16px;font-size:.95rem;font-weight:600;text-decoration:none;transition:transform .2s,filter .2s;display:flex}.oauth-button:hover{filter:brightness(1.05);transform:translateY(-1px)}.oauth-button-google{color:#1f1f1f;background-color:#fff;border:1px solid #ffffff1a}.oauth-button-facebook{color:#fff;background-color:#0866c9}.register-form form{flex-direction:column;gap:16px;display:flex}.register-form input{color:var(--color-text);background-color:#ffffff0d;border:1px solid #ffffff1a;border-radius:10px;padding:12px 16px;font-size:1rem}.register-form label{color:var(--color-text-muted);font-size:.95rem;font-weight:600}.register-form-error{color:var(--color-error);font-size:.9rem}.register-form-terms{color:var(--color-text-muted);margin-top:16px;font-size:.8rem}.register-form-terms a{color:var(--color-primary-text);text-decoration:underline}.register-page{background:radial-gradient(circle at top,#7c3aed38,#0000 40%);justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex}.register-page .register-form{background:radial-gradient(circle at top, #7c3aed38, transparent 45%), var(--color-background-soft);border-radius:16px;width:min(380px,100%);padding:32px;box-shadow:0 10px 30px #7c3aed59,0 0 0 1px #ffffff14}.login-page{background:radial-gradient(circle at top,#7c3aed38,#0000 40%);justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex}.login-page .login-form{background:radial-gradient(circle at top, #7c3aed38, transparent 45%), var(--color-background-soft);border-radius:16px;width:min(380px,100%);padding:32px;box-shadow:0 10px 30px #7c3aed59,0 0 0 1px #ffffff14}.back-button{color:var(--color-text-muted);cursor:pointer;background:0 0;border:none;margin-bottom:28px;padding:0;font-size:.95rem;font-weight:600;transition:color .2s,transform .2s}.back-button:hover{color:var(--color-primary-text);transform:translate(-4px)}.login-form form{flex-direction:column;gap:16px;display:flex}.login-form input{color:var(--color-text);background-color:#ffffff0d;border:1px solid #ffffff1a;border-radius:10px;padding:12px 16px;font-size:1rem}.login-form label{color:var(--color-text-muted);font-size:.95rem;font-weight:600}.login-form-error{color:var(--color-error);font-size:.9rem}.app-layout{min-height:100vh}.app-header{background-color:var(--color-background-soft);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:24px;padding:20px 32px;display:flex;box-shadow:0 1px #ffffff0f}.app-logo{letter-spacing:.08em;color:var(--color-primary-text);font-size:1.25rem;font-weight:800}.app-nav{flex-wrap:wrap;gap:24px;display:flex}.app-nav-link{color:var(--color-text-muted);font-weight:600;transition:color .2s}.app-nav-link:hover{color:var(--color-text)}.app-nav-link.is-active{color:var(--color-primary-text)}.app-logout-button{cursor:pointer;color:var(--color-text-muted);background:0 0;border:none;font-weight:600;transition:color .2s}.app-logout-button:hover{color:var(--color-error)}.app-content{padding:32px}.app-footer{flex-wrap:wrap;justify-content:center;gap:24px;padding:20px 32px 32px;display:flex}.app-footer a{color:var(--color-text-muted);font-size:.8rem;transition:color .2s}.app-footer a:hover{color:var(--color-primary-text)}.verify-email-banner{color:var(--color-text-muted);text-align:center;background-color:#7c3aed26;border-bottom:1px solid #7c3aed59;flex-wrap:wrap;justify-content:center;align-items:center;gap:16px;padding:12px 32px;font-size:.85rem;display:flex}.verify-email-banner button{border:1px solid var(--color-primary);color:var(--color-primary-text);cursor:pointer;background:0 0;border-radius:999px;padding:4px 14px;font-size:.8rem;font-weight:600;transition:background-color .2s}.verify-email-banner button:hover{background-color:#7c3aed33}.verify-email-banner-sent{color:var(--color-primary-text);font-weight:600}.legal-page{max-width:720px;margin:0 auto;padding:24px;line-height:1.6}.legal-page h1{margin-bottom:24px}.legal-page section{margin-bottom:28px}.legal-page h2{color:var(--color-primary-text);margin-bottom:8px;font-size:1.15rem}.legal-page p{color:var(--color-text-muted);margin:0 0 8px}.legal-page a{color:var(--color-primary-text);text-decoration:underline}.legal-updated{font-size:.85rem;margin-bottom:24px!important}.legal-page ul{color:var(--color-text-muted);margin:0;padding-left:20px}.legal-page li{margin-bottom:6px}.howto-page{max-width:720px;margin:0 auto;padding:24px;line-height:1.6}.howto-page h1{margin-bottom:24px}.howto-page section{margin-bottom:28px}.howto-page h2{color:var(--color-primary-text);margin-bottom:8px;font-size:1.15rem}.howto-page p{color:var(--color-text-muted);margin:0 0 8px}.howto-page ul{color:var(--color-text-muted);margin:0;padding-left:20px}.howto-page li{margin-bottom:6px}.howto-bonus-list{flex-direction:column;gap:8px;padding:0;list-style:none;display:flex}.howto-bonus-tag{color:#fff;border-radius:6px;justify-content:center;align-items:center;min-width:34px;margin-right:8px;padding:2px 6px;font-size:.8rem;font-weight:700;display:inline-flex}.howto-bonus-dl{background-color:#4a90d9}.howto-bonus-tl{background-color:#2f6fb3}.howto-bonus-dw{background-color:#e08a8a}.howto-bonus-tw{background-color:#c0392b}.howto-letters-grid{grid-template-columns:repeat(auto-fill,minmax(44px,1fr));gap:8px;display:grid}.howto-letter-tile{aspect-ratio:1;background-color:var(--color-background-soft);color:var(--color-primary-text);border-radius:8px;justify-content:center;align-items:center;font-weight:700;display:flex;position:relative}.howto-letter-tile sub{color:var(--color-text-muted);font-size:.6rem;font-weight:600;position:absolute;bottom:3px;right:5px}.dashboard-page{flex-direction:column;gap:24px;display:flex}.dashboard-play-options{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;max-width:640px;display:grid}.dashboard-play-card{background-color:var(--color-background-soft);border-radius:14px;flex-direction:column;gap:12px;padding:24px;display:flex}.dashboard-play-card p{margin:0}.dashboard-welcome-card{background-color:var(--color-background-soft);border:1px solid var(--color-primary-text);border-radius:14px;flex-direction:column;gap:12px;max-width:640px;padding:20px 24px;display:flex;position:relative}.dashboard-welcome-card h2{margin:0}.dashboard-welcome-card p{color:var(--color-text-muted);margin:0}.dashboard-welcome-dismiss{cursor:pointer;color:var(--color-text-muted);background:0 0;border:none;font-size:1.4rem;line-height:1;position:absolute;top:10px;right:12px}.dashboard-welcome-actions{flex-wrap:wrap;align-items:center;gap:16px;display:flex}.dashboard-welcome-link{color:var(--color-primary-text);text-decoration:underline}.game-setup,.game-finished{flex-direction:column;align-items:flex-start;gap:16px;max-width:360px;display:flex}.game-setup input{width:100%;color:var(--color-text);background-color:#ffffff0d;border:1px solid #ffffff1a;border-radius:10px;padding:12px 16px;font-size:1rem}.game-final-scores{color:var(--color-text);font-weight:700}.game-status{justify-content:space-between;align-items:center;gap:16px;width:100%;max-width:520px;display:flex}.board-scroll{background-color:var(--color-background-soft);box-sizing:border-box;border-radius:12px;width:100%;max-width:560px;padding:8px}.board-grid{aspect-ratio:1;grid-template-rows:repeat(15,1fr);grid-template-columns:repeat(15,1fr);gap:2px;width:100%;display:grid}.board-cell{width:100%;min-width:0;height:100%;color:var(--color-text);text-transform:uppercase;cursor:pointer;background-color:#ffffff0a;border:none;border-radius:4px;justify-content:center;align-items:center;padding:0;font-size:clamp(.55rem,2.6vw,1.1rem);font-weight:700;display:flex}.board-cell-bonus-label{letter-spacing:.02em;color:var(--color-text-muted);text-align:center;font-size:clamp(.3rem,1.3vw,.45rem);font-weight:700;line-height:1}.board-cell-star{color:var(--color-primary-text);font-size:1rem}.board-cell.bonus-TW{background-color:#ef444440}.board-cell.bonus-DW{background-color:#7c3aed40}.board-cell.bonus-TL{background-color:#22c55e40}.board-cell.bonus-DL{background-color:#3b82f640}.board-cell.is-center{background-color:#7c3aed59}.board-cell.is-committed{color:#2b2110;background:linear-gradient(135deg,#d9c398,#c7ab74)}.board-cell.is-pending{background:linear-gradient(135deg, var(--color-primary-hover), var(--color-primary));color:var(--color-text);box-shadow:inset 0 0 0 2px #fff6}.rack{background-color:var(--color-background-soft);border-radius:12px;flex-wrap:wrap;justify-content:center;gap:8px;padding:12px;display:flex}.rack-tile{color:#2b2110;text-transform:uppercase;cursor:pointer;background:linear-gradient(135deg,#d9c398,#c7ab74);border:none;border-radius:8px;justify-content:center;align-items:center;width:44px;height:44px;font-size:1.3rem;font-weight:800;transition:transform .15s,box-shadow .15s;display:flex;position:relative}.rack-tile:hover{transform:translateY(-2px)}.rack-tile.is-selected{box-shadow:0 0 0 3px var(--color-primary);transform:translateY(-4px)}.rack-tile-value{font-size:.6rem;font-weight:700;position:absolute;bottom:2px;right:4px}.profile-page{flex-direction:column;gap:32px;max-width:640px;display:flex}.profile-header{align-items:center;gap:24px;display:flex}.profile-avatar{background-color:var(--color-background-soft);cursor:pointer;border:1px solid #ffffff1a;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:88px;height:88px;font-size:2.5rem;transition:transform .2s,border-color .2s;display:flex}.profile-avatar:hover{border-color:var(--color-primary);transform:translateY(-2px)}.profile-email,.profile-since{color:var(--color-text-muted);font-size:.95rem}.profile-stats{grid-template-columns:repeat(3,1fr);gap:16px;display:grid}.profile-stat-card{background-color:var(--color-background-soft);text-align:center;border-radius:14px;flex-direction:column;gap:4px;padding:20px;display:flex}.profile-stat-value{color:var(--color-primary-text);font-size:1.75rem;font-weight:800}.profile-stat-label{color:var(--color-text-muted);font-size:.9rem}.profile-rank{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.profile-rank-badge{background-color:var(--color-background-soft);border-radius:999px;padding:8px 16px;font-size:.9rem;font-weight:700;display:inline-block}.profile-rank-detail{color:var(--color-text-muted);font-size:.9rem}.profile-badges-link{background-color:var(--color-background-soft);color:var(--color-text);cursor:pointer;border:none;border-radius:12px;align-self:flex-start;padding:12px 20px;font-size:.95rem;font-weight:600;transition:transform .2s}.profile-badges-link:hover{transform:translateY(-2px)}@media (width<=480px){.profile-header{text-align:center;flex-direction:column}.profile-stats{grid-template-columns:1fr}}.avatar-picker-title{text-align:center;margin:0 0 24px}.avatar-picker-grid{grid-template-columns:repeat(5,1fr);gap:12px;display:grid}.avatar-picker-option{aspect-ratio:1;cursor:pointer;background-color:#ffffff0d;border:1px solid #ffffff1a;border-radius:12px;justify-content:center;align-items:center;font-size:1.75rem;transition:border-color .2s,transform .2s;display:flex}.avatar-picker-option:hover{transform:translateY(-2px)}.avatar-picker-option.is-selected{border-color:var(--color-primary);background-color:#7c3aed33}@media (width<=480px){.avatar-picker-grid{grid-template-columns:repeat(4,1fr)}}.rating-chart{background-color:var(--color-background-soft);border-radius:14px;flex-direction:column;gap:8px;padding:16px;display:flex}.rating-chart-svg{width:100%;height:120px;display:block}.rating-chart-area{fill:color-mix(in srgb, var(--color-primary) 25%, transparent);stroke:none}.rating-chart-line{fill:none;stroke:var(--color-primary);stroke-width:2px;stroke-linejoin:round;stroke-linecap:round}.rating-chart-range{color:var(--color-text-muted);text-align:center;font-size:.85rem}.rating-chart-empty{color:var(--color-text-muted);background-color:var(--color-background-soft);text-align:center;border-radius:14px;padding:16px;font-size:.9rem}.page-placeholder{flex-direction:column;gap:12px;display:flex}.settings-page{flex-direction:column;gap:24px;max-width:480px;display:flex}.settings-section{background-color:var(--color-background-soft);border:1px solid #ffffff1a;border-radius:16px;flex-direction:column;gap:12px;padding:24px;display:flex}.settings-section h2{margin:0}.settings-section-description{color:var(--color-text-muted);margin:0}.settings-notice{color:var(--color-text-muted);font-size:.9rem}.settings-error{color:var(--color-error);font-size:.9rem}.settings-hint{color:var(--color-text-muted);margin:0;font-size:.85rem}.online-lobby{flex-direction:column;gap:24px;max-width:420px;display:flex}.online-lobby-card{background-color:var(--color-background-soft);border-radius:14px;flex-direction:column;gap:12px;padding:24px;display:flex}.online-lobby-card p{margin:0}.online-lobby-card form{flex-direction:column;gap:12px;display:flex}.online-lobby-card input{color:var(--color-text);letter-spacing:.1em;text-transform:uppercase;text-align:center;background-color:#ffffff0d;border:1px solid #ffffff1a;border-radius:10px;padding:12px 16px;font-size:1.1rem}.online-lobby-error{color:var(--color-error);font-size:.9rem}.online-lobby-ranked-note{color:var(--color-primary-text);font-size:.85rem;font-weight:600}.online-lobby-difficulty{flex-wrap:wrap;gap:16px;display:flex}.online-lobby-difficulty label{color:var(--color-text-muted);cursor:pointer;align-items:center;gap:6px;font-size:.9rem;display:flex}.online-lobby-difficulty input[type=radio]{width:auto;accent-color:var(--color-primary);background:0 0;border:none;padding:0}.online-lobby-games{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.online-lobby-game-row{width:100%;color:var(--color-text);text-align:left;cursor:pointer;background-color:#ffffff0d;border:none;border-radius:10px;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;font-size:.95rem;transition:background-color .2s;display:flex}.online-lobby-game-row:hover{background-color:#ffffff1a}.online-lobby-your-turn{background-color:var(--color-primary);border-radius:999px;flex-shrink:0;padding:4px 10px;font-size:.75rem;font-weight:700}.online-game-waiting{flex-direction:column;align-items:flex-start;gap:16px;max-width:360px;display:flex}.online-game-code{letter-spacing:.2em;color:var(--color-primary-text);font-size:2rem;font-weight:800}.online-game-final-scores{color:var(--color-text);font-weight:700}.online-game-elo-change{color:var(--color-text-muted);align-items:baseline;gap:8px;display:flex}.online-game-elo-value{font-variant-numeric:tabular-nums;color:var(--color-primary-text);font-size:1.3rem;font-weight:800}.online-game-elo-delta{font-variant-numeric:tabular-nums;font-weight:700}.online-game-elo-up{color:var(--color-success)}.online-game-elo-down{color:var(--color-error)}.online-game-elo-flat{color:var(--color-text-muted)}.online-game-share-button{color:#fff;cursor:pointer;background-color:#0866c9;border:none;border-radius:10px;padding:12px 20px;font-size:.95rem;font-weight:600;transition:filter .2s}.online-game-share-button:hover{filter:brightness(1.1)}.online-game-warning{color:var(--color-error)}.online-game-reaction-bubble{z-index:40;pointer-events:none;font-size:3rem;position:fixed;top:20%;left:50%;transform:translate(-50%)}.online-game-reactions{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.online-game-reaction-button{cursor:pointer;background:0 0;border:1px solid #ffffff26;border-radius:999px;padding:8px 12px;font-size:1.2rem;transition:border-color .2s,transform .2s}.online-game-reaction-button:hover{border-color:var(--color-primary);transform:translateY(-2px)}.game-page{flex-direction:column;align-items:center;gap:16px;display:flex}.game-status{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px 16px;width:100%;max-width:520px;display:flex}.game-scores{gap:16px;font-weight:700;display:flex}.game-score{color:var(--color-text-muted)}.game-score.is-active{color:var(--color-primary-text)}.game-status-right{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.game-bag-count,.game-opponent-rack-count{color:var(--color-text-muted);white-space:nowrap;font-size:.85rem;font-weight:600}.game-timer{background-color:var(--color-background-soft);font-variant-numeric:tabular-nums;border-radius:999px;padding:4px 12px;font-weight:700}.game-message{color:var(--color-text-muted);text-align:center;font-size:.9rem}.game-score-preview{color:var(--color-primary-text);text-align:center;font-size:.95rem;font-weight:700}.game-actions{flex-wrap:wrap;justify-content:center;gap:12px;display:flex}.game-secondary-action{color:var(--color-text-muted);cursor:pointer;background:0 0;border:1px solid #ffffff26;border-radius:12px;padding:12px 20px;font-weight:600;transition:color .2s,border-color .2s}.game-secondary-action:hover{color:var(--color-text);border-color:var(--color-primary)}.game-secondary-action:disabled{opacity:.5;cursor:not-allowed}.online-game-history{flex-direction:column;align-items:center;gap:12px;width:100%;max-width:520px;display:flex}.online-game-history-list{flex-direction:column;gap:8px;width:100%;margin:0;padding:0;list-style:none;display:flex}.online-game-history-list li{background-color:var(--color-background-soft);color:var(--color-text-muted);border-radius:10px;padding:10px 14px;font-size:.85rem}.online-game-history-empty{text-align:center}.online-game-analysis{flex-direction:column;align-items:center;gap:12px;width:100%;max-width:520px;display:flex}.online-game-analysis-list{flex-direction:column;gap:8px;width:100%;margin:0;padding:0;list-style:none;display:flex}.online-game-analysis-list li{background-color:var(--color-background-soft);border-radius:10px;padding:10px 14px;font-size:.85rem}.online-game-analysis-missed{color:var(--color-error)}.online-game-analysis-optimal{color:var(--color-success)}.blank-picker-overlay{z-index:30;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);background-color:#0f172aa6;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.blank-picker{background-color:var(--color-background-soft);border-radius:16px;flex-direction:column;gap:16px;width:min(280px,100% - 32px);padding:32px;display:flex;box-shadow:0 10px 30px #7c3aed59,0 0 0 1px #ffffff14}.blank-picker select{color:var(--color-text);background-color:#ffffff0d;border:1px solid #ffffff1a;border-radius:10px;padding:10px;font-size:1rem}.blank-picker-actions{align-items:center;gap:12px;display:flex}.friends-page{flex-direction:column;gap:24px;max-width:480px;display:flex}.friends-card{background-color:var(--color-background-soft);border-radius:14px;flex-direction:column;gap:12px;padding:24px;display:flex}.friends-card p{margin:0}.friends-card form{flex-direction:column;gap:12px;display:flex}.friends-card input{color:var(--color-text);background-color:#ffffff0d;border:1px solid #ffffff1a;border-radius:10px;padding:12px 16px;font-size:1rem}.friends-error{color:var(--color-error);font-size:.9rem}.friends-share-button{color:#fff;cursor:pointer;background-color:#0866c9;border:none;border-radius:10px;align-self:flex-start;padding:12px 20px;font-size:.95rem;font-weight:600;transition:filter .2s}.friends-share-button:hover{filter:brightness(1.1)}.friends-list{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.friends-row{background-color:#ffffff0d;border-radius:10px;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;font-size:.95rem;display:flex}.friends-row-info{align-items:center;gap:10px;display:flex}.friends-avatar{font-size:1.3rem}.friends-row-actions{gap:8px;display:flex}.friends-row-actions button{cursor:pointer;border:none;border-radius:8px;padding:8px 12px;font-size:.85rem;font-weight:600}.friends-action-accept,.friends-action-invite{background-color:var(--color-primary);color:var(--color-background)}.friends-action-decline{color:var(--color-text);background-color:#ffffff1a}.leaderboard-page{flex-direction:column;gap:24px;max-width:560px;display:flex}.leaderboard-list{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.leaderboard-row{background-color:var(--color-background-soft);border-radius:10px;grid-template-columns:40px 32px 1fr auto auto;align-items:center;gap:12px;padding:12px 16px;font-size:.95rem;display:grid}.leaderboard-row-you{border:1px solid var(--color-primary)}.leaderboard-position{color:var(--color-text-muted);font-weight:700}.leaderboard-avatar{font-size:1.3rem}.leaderboard-username{font-weight:600}.leaderboard-tier{font-size:.85rem;font-weight:700}.leaderboard-rating{color:var(--color-text-muted);font-size:.85rem}.leaderboard-your-position{color:var(--color-text-muted);font-size:.9rem}@media (width<=480px){.leaderboard-row{grid-template-columns:32px 28px 1fr;grid-template-areas:"position avatar username""position avatar tier""position avatar rating"}.leaderboard-tier,.leaderboard-rating{grid-column:3}}.badges-page{flex-direction:column;gap:16px;max-width:640px;display:flex}.badges-back{color:var(--color-text-muted);cursor:pointer;background:0 0;border:none;align-self:flex-start;padding:0;font-size:.9rem}.badges-back:hover{color:var(--color-text)}.badges-progress{color:var(--color-text-muted);margin:0}.badges-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;display:grid}.badge-card{background-color:var(--color-background-soft);text-align:center;border-radius:14px;flex-direction:column;align-items:center;gap:6px;padding:20px 12px;display:flex}.badge-card-locked .badge-emoji{opacity:.4;filter:grayscale()}.badge-card-locked .badge-label,.badge-card-locked .badge-description{opacity:.75}.badge-emoji{font-size:2rem}.badge-label{font-size:.9rem;font-weight:700}.badge-description{color:var(--color-text-muted);font-size:.75rem}