.hero{display:grid;grid-template-columns:1.12fr .88fr;gap:var(--sp-5);align-items:stretch;margin-bottom:var(--sp-6)}.hero__main{background:linear-gradient(145deg,var(--primary-light) 0%,var(--primary) 45%,var(--primary-strong) 100%);border-radius:var(--r-xl);padding:clamp(22px,3vw,38px);color:#fff;box-shadow:0 8px 0 var(--primary-deep),var(--shadow-lg);position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;gap:var(--sp-6)}.hero__main:before,.hero__main:after{content:"";position:absolute;border-radius:50%;pointer-events:none}.hero__main:before{right:-70px;top:-80px;width:280px;height:280px;background:#ffffff21}.hero__main:after{right:90px;bottom:-110px;width:190px;height:190px;background:var(--gold);opacity:.22}.hero__greet{font-family:var(--font-display);font-weight:800;font-size:clamp(26px,3.3vw,40px);line-height:1.08}.hero__note{opacity:.95;font-weight:700;margin-top:8px;font-size:clamp(14px,1.5vw,17px)}.hero__cta{position:relative;z-index:1}.hero__chip{background:#fff3;color:#fff;border:1.5px solid rgba(255,255,255,.3);backdrop-filter:blur(4px)}.goal{display:flex;flex-direction:column;gap:var(--sp-4)}.goal__row{display:flex;flex-direction:column;gap:8px}.goal__head{display:flex;align-items:baseline;justify-content:space-between;gap:8px;font-weight:800}.goal__done{color:var(--success)}.navcard{display:flex;flex-direction:column;gap:6px;align-items:flex-start;text-align:left;width:100%}.navcard__icon{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;font-size:28px;margin-bottom:8px;background:color-mix(in srgb,var(--card-accent, var(--primary)) 16%,var(--surface));border:2px solid color-mix(in srgb,var(--card-accent, var(--primary)) 38%,transparent);box-shadow:0 3px color-mix(in srgb,var(--card-accent, var(--primary)) 38%,transparent)}.navcard__title{font-family:var(--font-display);font-weight:800;font-size:20px;color:var(--card-accent, var(--text))}.navcard__desc{color:var(--text-dim);font-size:14px;font-weight:600;line-height:1.5}.tip{display:flex;gap:var(--sp-4);align-items:flex-start;background:var(--gold-soft);border:2px solid color-mix(in srgb,var(--gold) 45%,transparent);border-left:7px solid var(--gold);border-radius:var(--r-lg);padding:var(--sp-5);box-shadow:0 4px color-mix(in srgb,var(--gold) 35%,transparent)}.tip__icon{font-size:32px;line-height:1;flex:none}.result__banner{text-align:center;margin-bottom:var(--sp-6)}.result__title{font-family:var(--font-display);font-weight:800;line-height:1.02;font-size:clamp(38px,6.2vw,70px);letter-spacing:-.03em;background:linear-gradient(120deg,var(--primary),var(--c-violet) 45%,var(--gold));-webkit-background-clip:text;background-clip:text;color:transparent}.result__msg{color:var(--text-dim);font-weight:700;font-size:clamp(15px,1.8vw,19px);margin-top:10px}.bigstat{display:flex;flex-direction:column;align-items:center;gap:4px;padding:var(--sp-5) var(--sp-4);border-radius:var(--r-lg);background:var(--surface);border:2px solid var(--border);box-shadow:var(--edge),var(--shadow-sm)}.bigstat__value{font-family:var(--font-display);font-weight:800;line-height:1;font-size:clamp(40px,5.8vw,66px);font-variant-numeric:tabular-nums}.bigstat__label{font-weight:800;color:var(--text-dim);font-size:13px;text-transform:uppercase;letter-spacing:.09em}.record{display:flex;align-items:center;gap:var(--sp-4);flex-wrap:wrap;justify-content:center;background:linear-gradient(135deg,var(--gold-light),var(--gold));color:#4a3000;border-radius:var(--r-lg);padding:var(--sp-5);font-family:var(--font-display);font-weight:800;box-shadow:0 6px 0 var(--gold-deep),0 14px 30px #ef9f0057}.record__delta{font-size:clamp(22px,3vw,32px)}.scoreline{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);padding:10px 0;border-bottom:2px dotted var(--border);font-weight:700}.scoreline:last-child{border-bottom:none}.scoreline__value{font-family:var(--font-type);font-weight:700;font-variant-numeric:tabular-nums}.scoreline__value--neg{color:var(--danger)}.scoreline__value--pos{color:var(--success)}.unlock-card{display:flex;align-items:center;gap:var(--sp-4);padding:var(--sp-4);border-radius:var(--r-md);background:var(--surface);border:2px solid var(--primary);box-shadow:0 4px 0 var(--primary-deep)}.unlock-card__icon{font-size:38px;line-height:1}.lb{display:flex;flex-direction:column;gap:10px}.lb__row{display:grid;grid-template-columns:56px auto 1fr auto;align-items:center;gap:var(--sp-4);padding:13px var(--sp-4);border-radius:var(--r-md);background:var(--surface);border:2px solid var(--border);box-shadow:0 3px 0 var(--border);transition:all .16s ease}.lb__row:hover{transform:translate(3px);border-color:var(--border-strong);box-shadow:0 3px 0 var(--border-strong)}.lb__row--me{border-color:var(--primary);background:var(--primary-soft);box-shadow:0 4px 0 var(--primary)}.lb__row--top1{background:linear-gradient(100deg,var(--gold-soft),var(--surface) 62%);border-color:var(--gold);box-shadow:0 4px 0 var(--gold)}.lb__row--top2{background:linear-gradient(100deg,var(--surface-3),var(--surface) 62%);border-color:var(--border-strong);box-shadow:0 4px 0 var(--border-strong)}.lb__row--top3{background:linear-gradient(100deg,color-mix(in srgb,var(--c-orange) 16%,var(--surface)),var(--surface) 62%);border-color:var(--c-orange);box-shadow:0 4px color-mix(in srgb,var(--c-orange) 70%,black)}.lb__rank{font-family:var(--font-display);font-weight:800;font-size:24px;text-align:center;color:var(--text-faint)}.lb__name{font-family:var(--font-display);font-weight:800;font-size:18px;line-height:1.15}.lb__meta{color:var(--text-dim);font-size:13px;font-weight:700;display:flex;gap:12px;flex-wrap:wrap;font-family:var(--font-type)}.lb__score{font-family:var(--font-display);font-weight:800;font-size:22px;font-variant-numeric:tabular-nums;text-align:right}.me-card{position:sticky;bottom:var(--sp-4);margin-top:var(--sp-5);border:3px solid var(--primary);background:var(--surface);border-radius:var(--r-lg);padding:var(--sp-4);box-shadow:0 6px 0 var(--primary-deep),var(--shadow-lg)}.badge-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:var(--sp-4)}.badge-card{display:flex;flex-direction:column;align-items:center;gap:9px;text-align:center;padding:var(--sp-5) var(--sp-4);border-radius:var(--r-lg);background:var(--surface);border:2px solid var(--border);box-shadow:0 4px 0 var(--border);transition:all .18s ease}.badge-card--unlocked{border-color:var(--gold);box-shadow:0 4px 0 var(--gold);background:linear-gradient(165deg,var(--gold-soft),var(--surface) 62%)}.badge-card--unlocked:hover{transform:translateY(-4px) rotate(-1.5deg)}.badge-card--locked .badge-card__icon{filter:grayscale(1);opacity:.4}.badge-card__icon{font-size:46px;line-height:1;filter:drop-shadow(0 3px 5px rgba(0,0,0,.18))}.badge-card__name{font-family:var(--font-display);font-weight:800;font-size:16.5px}.badge-card__desc{font-size:13px;color:var(--text-dim);font-weight:600;line-height:1.45;flex:1}.lesson-card{display:flex;gap:var(--sp-4);align-items:center;width:100%;text-align:left}.lesson-card__icon{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;font-size:27px;flex:none;background:color-mix(in srgb,var(--card-accent, var(--primary)) 15%,var(--surface));border:2px solid color-mix(in srgb,var(--card-accent, var(--primary)) 36%,transparent)}.lesson-card__title{font-family:var(--font-display);font-weight:800;font-size:18.5px;line-height:1.2}.lesson-card__sub{color:var(--text-dim);font-size:13.5px;font-weight:600}.lesson-card__done{color:var(--success);font-size:24px}.table-wrap{overflow-x:auto;border-radius:var(--r-md);border:2px solid var(--border)}.table{width:100%;border-collapse:collapse;font-size:14.5px;min-width:640px}.table th,.table td{padding:13px 15px;text-align:left;border-bottom:2px solid var(--border)}.table th{background:var(--surface-3);font-weight:800;color:var(--text-dim);font-size:12px;text-transform:uppercase;letter-spacing:.07em;white-space:nowrap}.table tr:last-child td{border-bottom:none}.table tbody tr:hover{background:var(--surface-2)}.table td{font-weight:700}.table__num{font-variant-numeric:tabular-nums;font-family:var(--font-type)}.delta-up{color:var(--success);font-weight:800}.delta-flat{color:var(--text-faint);font-weight:800}.chart{width:100%;height:220px}.chart__grid{stroke:var(--border);stroke-width:1.5}.chart__line{fill:none;stroke:var(--primary);stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round}.chart__dot{fill:var(--primary)}.chart__label{fill:var(--text-faint);font-size:11px;font-weight:800;font-family:var(--font-type)}@media(max-width:960px){.hero{grid-template-columns:1fr}}@media(max-width:620px){.lb__row{grid-template-columns:44px auto 1fr}.lb__score{grid-column:1 / -1;text-align:left}}.course-unit__head{display:flex;align-items:center;gap:var(--sp-4);margin:var(--sp-8) 0 var(--sp-4)}.course-unit__icon{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;font-size:26px;flex:none;background:color-mix(in srgb,var(--card-accent) 18%,var(--surface));border:2px solid color-mix(in srgb,var(--card-accent) 45%,transparent);box-shadow:0 3px color-mix(in srgb,var(--card-accent) 45%,transparent)}.course-unit__title{font-family:var(--font-display);font-weight:800;font-size:22px;color:var(--card-accent);line-height:1.15}.course-unit__sub{color:var(--text-dim);font-weight:700;font-size:14px}.course-row{display:grid;grid-template-columns:42px 52px 1fr auto;align-items:center;gap:var(--sp-4);width:100%;text-align:left}.course-row__num{font-family:var(--font-display);font-weight:800;font-size:17px;width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:var(--surface-3);color:var(--text-dim)}.course-row--done .course-row__num{background:var(--success);color:#fff}.course-row--current .course-row__num{background:var(--primary);color:#fff}.course-row__icon{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;font-size:23px;background:color-mix(in srgb,var(--card-accent, var(--primary)) 14%,var(--surface));border:2px solid color-mix(in srgb,var(--card-accent, var(--primary)) 32%,transparent)}.course-row__title{font-family:var(--font-display);font-weight:800;font-size:17.5px;line-height:1.2}.course-row__sub{color:var(--text-dim);font-size:13.5px;font-weight:600}.course-row--locked{opacity:.55}.keycaps{display:inline-flex;gap:5px;flex-wrap:wrap;margin-top:6px}.keycap{font-family:var(--font-type);font-weight:700;font-size:14px;text-transform:uppercase;min-width:30px;height:30px;padding:0 7px;display:inline-grid;place-items:center;border-radius:9px;background:var(--primary);color:#fff;box-shadow:0 3px 0 var(--primary-deep)}.keycap--lg{min-width:52px;height:52px;font-size:24px;border-radius:14px;box-shadow:0 4px 0 var(--primary-deep)}.keycap--ghost{background:var(--surface-3);color:var(--text-dim);box-shadow:0 3px 0 var(--border-strong)}.stars{display:inline-flex;gap:3px;font-size:18px;line-height:1}.stars__item{filter:grayscale(1);opacity:.3}.stars__item--on{filter:none;opacity:1}.level-row{display:grid;grid-template-columns:38px 1fr auto auto;align-items:center;gap:var(--sp-4);padding:12px var(--sp-4);border-radius:var(--r-md);background:var(--surface);border:2px solid var(--border);box-shadow:0 3px 0 var(--border);transition:all .14s ease;width:100%;text-align:left}.level-row:hover{border-color:var(--primary);box-shadow:0 3px 0 var(--primary);transform:translate(3px)}.level-row--done{border-color:var(--success);box-shadow:0 3px 0 var(--success)}.level-row__num{font-family:var(--font-display);font-weight:800;font-size:15px;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:var(--surface-3);color:var(--text-dim)}.level-row--done .level-row__num{background:var(--success);color:#fff}.level-row__title{font-family:var(--font-display);font-weight:800;font-size:16px}.level-row__kind{color:var(--text-dim);font-size:13px;font-weight:600}.level-result{text-align:center}.level-result__stars{font-size:52px;line-height:1;letter-spacing:6px;margin-bottom:var(--sp-3)}.level-result__title{font-family:var(--font-display);font-weight:800;font-size:clamp(26px,3.4vw,38px)}@media(max-width:620px){.course-row{grid-template-columns:36px 1fr auto}.course-row__icon{display:none}.level-row{grid-template-columns:34px 1fr auto}}.auth{min-height:100vh;display:grid;place-items:center;padding:clamp(18px,4vw,48px) var(--sp-4)}.auth__inner{width:min(700px,100%)}.auth__hero{text-align:center;margin-bottom:var(--sp-8)}.auth__mark{position:relative;width:108px;height:116px;margin:0 auto var(--sp-5);display:grid;place-items:center;font-size:50px;background:linear-gradient(170deg,var(--primary-light),var(--primary-strong));border-radius:26px 26px 50% 50%/26px 26px 48% 48%;box-shadow:0 8px 0 var(--primary-deep),0 18px 40px #1d2f7d57}.auth__mark:after{content:"";position:absolute;inset:7px;border:3px solid rgba(255,255,255,.45);border-radius:20px 20px 50% 50%/20px 20px 46% 46%}.auth__ribbon{display:inline-block;margin:-14px auto var(--sp-4);position:relative;z-index:1;background:var(--gold-light);color:#4a3000;font-family:var(--font-display);font-weight:800;font-size:12px;letter-spacing:.24em;text-transform:uppercase;padding:7px 22px;border-radius:var(--r-full);box-shadow:0 4px 0 var(--gold-deep)}.auth__title{font-family:var(--font-display);font-weight:800;line-height:1;font-size:clamp(42px,7vw,78px);letter-spacing:-.04em;background:linear-gradient(115deg,var(--primary),var(--c-violet) 42%,var(--gold));background-size:220% auto;-webkit-background-clip:text;background-clip:text;color:transparent;animation:kr-shine 6s linear infinite}.auth__sub{font-size:clamp(16px,1.9vw,21px);color:var(--text-dim);font-weight:700;margin-top:var(--sp-3)}.chips{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}.chip{display:inline-flex;align-items:center;gap:9px;padding:8px 17px 8px 8px;border-radius:var(--r-full);background:var(--surface);border:2px solid var(--border-strong);box-shadow:0 3px 0 var(--border-strong);font-family:var(--font-display);font-weight:800;font-size:15px;transition:all .14s ease}.chip:hover{border-color:var(--primary);color:var(--primary);box-shadow:0 3px 0 var(--primary);transform:translateY(-2px)}.chip:active{transform:translateY(2px);box-shadow:0 0 0 var(--primary)}.avatar-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(106px,1fr));gap:var(--sp-3)}.avatar-pick{display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 8px;border-radius:var(--r-md);background:var(--surface-2);border:2.5px solid var(--border);box-shadow:0 3px 0 var(--border);transition:all .14s ease;position:relative}.avatar-pick:hover{transform:translateY(-4px);background:var(--surface-3);box-shadow:0 5px 0 var(--border-strong)}.avatar-pick--active{border-color:var(--primary);background:var(--primary-soft);box-shadow:0 4px 0 var(--primary)}.avatar-pick--locked{opacity:.55;cursor:not-allowed}.avatar-pick--locked:hover{transform:none;box-shadow:0 3px 0 var(--border)}.avatar-pick__name{font-family:var(--font-display);font-weight:800;font-size:13.5px;text-align:center;flex:1}.avatar-pick__lock{position:absolute;top:6px;right:8px;font-size:14px}.steps{display:flex;gap:9px;justify-content:center;margin-bottom:var(--sp-6)}.steps__dot{width:44px;height:8px;border-radius:var(--r-full);background:var(--border-strong);transition:background .25s}.steps__dot--active{background:var(--primary)}.alert{display:flex;gap:11px;align-items:flex-start;padding:13px 17px;border-radius:var(--r-md);font-weight:700;font-size:14.5px;border:2px solid transparent}.alert--error{background:var(--danger-soft);color:var(--danger-deep);border-color:color-mix(in srgb,var(--danger) 40%,transparent)}.alert--info{background:var(--primary-soft);color:var(--primary-strong);border-color:color-mix(in srgb,var(--primary) 35%,transparent)}.alert--success{background:var(--success-soft);color:var(--success-deep);border-color:color-mix(in srgb,var(--success) 40%,transparent)}[data-theme=dark] .alert--error{color:var(--danger)}[data-theme=dark] .alert--info{color:var(--primary-light)}[data-theme=dark] .alert--success{color:var(--success)}.tw-wrap{position:relative;border-radius:var(--r-lg);background:var(--surface);border:2px solid var(--border);box-shadow:var(--edge),var(--shadow-sm);padding:var(--sp-6) clamp(18px,3vw,40px);overflow:hidden;cursor:text}.tw-viewport{overflow:hidden}.tw-track{display:flex;flex-wrap:wrap;font-family:var(--font-type);font-size:clamp(18px,1.95vw,27px);font-weight:500;line-height:1.75;letter-spacing:0;transition:transform .22s cubic-bezier(.2,.8,.3,1);will-change:transform}.tw-word{display:inline-flex;white-space:pre}.tw-char{position:relative;color:var(--text-faint);transition:color .07s linear}.tw-char--correct{color:var(--success)}.tw-char--incorrect{color:var(--danger);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}.tw-char--incorrect.tw-char--space{background:var(--danger);opacity:.45;border-radius:3px}.tw-char--current:before{content:"";position:absolute;left:-2px;top:10%;bottom:10%;width:3px;border-radius:3px;background:var(--primary);animation:kr-blink 1.05s steps(1,end) infinite;box-shadow:0 0 12px color-mix(in srgb,var(--primary) 70%,transparent)}.tw-char--current{color:var(--text)}.tw-wrap--paused .tw-track{filter:blur(4px);opacity:.45}.tw-overlay{position:absolute;inset:0;display:grid;place-items:center;background:color-mix(in srgb,var(--surface) 78%,transparent);font-family:var(--font-display);font-weight:800;text-align:center;padding:var(--sp-4)}.countdown{position:absolute;inset:0;z-index:20;display:grid;place-items:center;background:color-mix(in srgb,var(--surface) 90%,transparent);backdrop-filter:blur(3px);border-radius:var(--r-lg);overflow:hidden}.countdown__value{font-family:var(--font-display);font-weight:800;font-size:clamp(48px,8.5vw,132px);line-height:1;background:linear-gradient(150deg,var(--primary-light),var(--primary-strong) 55%,var(--gold));-webkit-background-clip:text;background-clip:text;color:transparent;animation:kr-count-in .8s ease-out both}.countdown__hint{margin-top:6px;color:var(--text-dim);font-weight:800;font-size:clamp(12px,1.2vw,16px)}.hud{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:var(--sp-4)}.hud__side{display:flex;gap:var(--sp-3)}.hud__timer{font-family:var(--font-type);font-weight:700;font-variant-numeric:tabular-nums;font-size:clamp(38px,4.6vw,60px);line-height:1;letter-spacing:-.02em;padding:10px 28px;border-radius:var(--r-lg);background:var(--surface);border:3px solid var(--border-strong);box-shadow:0 5px 0 var(--border-strong);transition:color .3s,border-color .3s,box-shadow .3s,transform .3s}.hud__timer--warn{color:var(--warning);border-color:var(--warning);box-shadow:0 5px color-mix(in srgb,var(--warning) 65%,black)}.hud__timer--danger{color:var(--danger);border-color:var(--danger);box-shadow:0 5px 0 var(--danger-deep);animation:kr-pulse .9s ease-in-out infinite}.combo{display:inline-flex;align-items:center;gap:9px;padding:9px 18px;border-radius:var(--r-full);font-family:var(--font-display);font-weight:800;font-size:17px;background:linear-gradient(135deg,var(--gold),var(--c-coral));color:#fff;box-shadow:0 4px 0 var(--danger-deep),0 8px 18px #f4504e57}.combo--tiny{opacity:.9;background:var(--surface-3);color:var(--text-dim);box-shadow:none}.combo__label{font-size:13px;opacity:.95}.combo-float{position:absolute;left:50%;top:0;transform:translate(-50%);font-family:var(--font-display);font-weight:800;font-size:26px;color:var(--gold-deep);pointer-events:none;animation:kr-rise 1.1s ease-out forwards;white-space:nowrap;text-shadow:0 2px 10px rgba(0,0,0,.2)}[data-theme=dark] .combo-float{color:var(--gold)}.kb-scroll{max-width:100%;overflow-x:auto;overflow-y:hidden;padding-bottom:4px}.kb-scroll::-webkit-scrollbar{height:6px}.kb{display:flex;flex-direction:column;gap:7px;align-items:center;padding:var(--sp-4);border-radius:var(--r-lg);background:var(--surface-2);border:2px solid var(--border);box-shadow:var(--edge),var(--shadow-sm);user-select:none}.kb__row{display:flex;gap:7px}.kb__key{--key-w: clamp(30px, 3.4vw, 46px);width:var(--key-w);height:var(--key-w);display:grid;place-items:center;border-radius:11px;background:var(--surface);border:2px solid var(--border-strong);box-shadow:0 3px 0 var(--border-strong);font-family:var(--font-type);font-weight:700;font-size:clamp(11px,1.2vw,16px);color:var(--text-dim);text-transform:uppercase;position:relative;transition:transform .09s ease,background .12s ease,color .12s ease,border-color .12s ease,box-shadow .12s ease}.kb__key--wide{width:calc(var(--key-w) * 6.4);font-size:11px;letter-spacing:.1em}.kb__key--home:after{content:"";position:absolute;bottom:5px;left:50%;transform:translate(-50%);width:13px;height:3px;border-radius:2px;background:var(--text-faint)}.kb__key--next{color:#fff;transform:translateY(-4px);border-color:#0000002e;box-shadow:0 7px #00000038,0 10px 20px #0000002e;z-index:2}.kb__key--muted{opacity:.3;border-style:dashed;box-shadow:none}.kb__key--focus{background:var(--primary-soft);color:var(--primary-strong);border-color:var(--primary);box-shadow:0 3px 0 var(--primary)}.kb__key--hit{background:var(--success)!important;color:#fff!important;border-color:var(--success-deep)!important;transform:translateY(3px);box-shadow:0 0 0 var(--success-deep)!important}.kb__key--miss{background:var(--danger)!important;color:#fff!important;border-color:var(--danger-deep)!important;animation:kr-shake .24s ease}.kb--candy{background:#fff1f7;border-color:#f9a8d4}.kb--candy .kb__key{background:linear-gradient(180deg,#fff,#fde4ef);border-color:#f4a0c6;color:#9d174d;box-shadow:0 3px #f4a0c6}.kb--neon{background:#0b1120;border-color:#1e293b}.kb--neon .kb__key{background:#111a2e;border-color:#334155;color:#67e8f9;box-shadow:0 3px #1e293b,0 0 8px #67e8f938 inset}.kb--wood{background:#f5e2c3;border-color:#a16207}.kb--wood .kb__key{background:linear-gradient(180deg,#fde9bd,#dcae68);border-color:#a16207;color:#451a03;box-shadow:0 3px #a16207}.finger-hint{display:inline-flex;align-items:center;gap:11px;padding:10px 18px;border-radius:var(--r-full);background:var(--surface);border:2px solid var(--border-strong);box-shadow:0 3px 0 var(--border-strong);font-weight:800;font-size:15px}.finger-hint__dot{width:15px;height:15px;border-radius:50%;flex:none;box-shadow:0 0 0 4px color-mix(in srgb,currentColor 22%,transparent)}.finger-hint__key{font-family:var(--font-type);font-size:18px;font-weight:700;min-width:36px;height:36px;display:grid;place-items:center;border-radius:10px;background:var(--primary);color:#fff;text-transform:uppercase;box-shadow:0 3px 0 var(--primary-deep)}.hands{display:flex;gap:var(--sp-8);justify-content:center;flex-wrap:wrap}.hand{display:flex;gap:6px;align-items:flex-end}.hand__finger{width:28px;border-radius:var(--r-full) var(--r-full) 7px 7px;background:var(--surface-2);border:2.5px solid var(--border-strong);transition:all .2s ease;position:relative}.hand__finger--active{border-color:transparent;transform:translateY(-9px);box-shadow:0 7px 16px #0000003d}.hand__finger--locked{border-style:dashed;border-color:var(--border);background:transparent;opacity:.4}.hand__finger--new{animation:kr-pulse 1.6s ease-in-out infinite}.hand__label{text-align:center;font-size:12.5px;font-weight:800;color:var(--text-dim);margin-top:8px;font-family:var(--font-type)}@media(max-width:900px){.hud{grid-template-columns:1fr;justify-items:center;text-align:center}.hud__side{justify-content:center}.tw-wrap{padding:var(--sp-4)}}@media(max-width:620px){.kb{padding:10px 8px;gap:5px}.kb__row{gap:4px}.kb__key{--key-w: clamp(20px, calc((100vw - 56px) / 13.5), 34px);font-size:10.5px;border-radius:8px;border-width:1.5px;box-shadow:0 2px 0 var(--border-strong)}.kb__key--home:after{width:9px;bottom:3px}.finger-hint{font-size:13.5px;padding:8px 14px}.hands{gap:var(--sp-5)}}:root{color-scheme:light;--bg: #fbf6ec;--bg-accent: radial-gradient(900px 480px at 8% -6%, rgba(59, 91, 219, .16) 0%, transparent 62%), radial-gradient(780px 420px at 96% -4%, rgba(240, 165, 0, .2) 0%, transparent 58%), radial-gradient(700px 500px at 50% 108%, rgba(23, 163, 74, .1) 0%, transparent 60%);--bg-grid: radial-gradient(circle at 1px 1px, rgba(22, 38, 74, .07) 1px, transparent 0);--bg-grid-size: 26px 26px;--surface: #ffffff;--surface-2: #fdf8ef;--surface-3: #f4ebda;--overlay: rgba(22, 38, 74, .5);--text: #16264a;--text-dim: #5a6b8c;--text-faint: #97a3bd;--text-invert: #ffffff;--border: #ebe0cc;--border-strong: #d7c7a9;--primary: #3b5bdb;--primary-strong: #2a43ad;--primary-deep: #1d2f7d;--primary-light: #6a86f5;--primary-soft: #e4e9ff;--gold: #ef9f00;--gold-deep: #b87400;--gold-light: #ffc94a;--gold-soft: #fff3d6;--success: #17a34a;--success-deep: #0f7536;--success-soft: #dcfbe6;--danger: #ef4444;--danger-deep: #b91c1c;--danger-soft: #ffe4e4;--warning: #f97316;--warning-soft: #ffedd9;--accent: #0ea5e9;--accent-soft: #dcf2ff;--c-coral: #f4504e;--c-orange: #f97316;--c-gold: #ef9f00;--c-green: #17a34a;--c-teal: #0d9488;--c-sky: #0ea5e9;--c-violet: #7c3aed;--c-pink: #db2777;--font-display: "Outfit", "Trebuchet MS", system-ui, sans-serif;--font-body: "Nunito", system-ui, -apple-system, "Segoe UI", sans-serif;--font-type: "Roboto Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;--r-sm: 10px;--r-md: 16px;--r-lg: 22px;--r-xl: 30px;--r-full: 999px;--sp-1: 4px;--sp-2: 8px;--sp-3: 12px;--sp-4: 16px;--sp-5: 20px;--sp-6: 24px;--sp-8: 32px;--sp-10: 40px;--sp-12: 52px;--shadow-sm: 0 1px 2px rgba(22, 38, 74, .06), 0 3px 8px rgba(22, 38, 74, .06);--shadow-md: 0 4px 10px rgba(22, 38, 74, .08), 0 14px 32px rgba(22, 38, 74, .09);--shadow-lg: 0 12px 24px rgba(22, 38, 74, .1), 0 30px 64px rgba(22, 38, 74, .16);--shadow-primary: 0 10px 24px rgba(59, 91, 219, .32);--edge: 0 4px 0 var(--border-strong);--ring: 0 0 0 4px rgba(59, 91, 219, .3);--header-h: 72px}[data-theme=dark]{color-scheme:dark;--bg: #0a1024;--bg-accent: radial-gradient(900px 480px at 8% -6%, rgba(59, 91, 219, .3) 0%, transparent 62%), radial-gradient(780px 420px at 96% -4%, rgba(240, 165, 0, .16) 0%, transparent 58%), radial-gradient(700px 500px at 50% 108%, rgba(13, 148, 136, .16) 0%, transparent 60%);--bg-grid: radial-gradient(circle at 1px 1px, rgba(190, 210, 255, .07) 1px, transparent 0);--surface: #141f3f;--surface-2: #1a2750;--surface-3: #22325f;--overlay: rgba(4, 8, 20, .72);--text: #eaf0ff;--text-dim: #9fb0d4;--text-faint: #6d7fa6;--border: #2a3a6b;--border-strong: #3a4d88;--primary: #7b95ff;--primary-strong: #5c78f0;--primary-deep: #3450c4;--primary-light: #9db1ff;--primary-soft: #1f2d63;--gold: #ffc94a;--gold-deep: #c9901a;--gold-light: #ffdb85;--gold-soft: #3d2f0c;--success: #3ddc84;--success-deep: #1d9e58;--success-soft: #0d3f26;--danger: #ff6b6b;--danger-deep: #c73b3b;--danger-soft: #451318;--warning: #fb923c;--warning-soft: #44230c;--accent: #38bdf8;--accent-soft: #08334a;--c-coral: #ff6b69;--c-orange: #fb923c;--c-gold: #ffc94a;--c-green: #3ddc84;--c-teal: #2dd4bf;--c-sky: #38bdf8;--c-violet: #a78bfa;--c-pink: #f472b6;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .45);--shadow-md: 0 6px 18px rgba(0, 0, 0, .5);--shadow-lg: 0 20px 54px rgba(0, 0, 0, .6);--shadow-primary: 0 10px 26px rgba(91, 120, 240, .45);--edge: 0 4px 0 rgba(0, 0, 0, .38);--ring: 0 0 0 4px rgba(123, 149, 255, .35)}*,*:before,*:after{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:var(--font-body);font-size:16px;font-weight:600;color:var(--text);background:var(--bg);background-image:var(--bg-grid),var(--bg-accent);background-size:var(--bg-grid-size),auto,auto,auto;background-attachment:fixed;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}h1,h2,h3,h4{font-family:var(--font-display);margin:0;line-height:1.12;letter-spacing:-.02em;font-weight:800}h1{font-size:clamp(30px,3.4vw,44px)}h2{font-size:clamp(23px,2.4vw,31px)}h3{font-size:clamp(18px,1.7vw,23px);font-weight:700}p{margin:0;line-height:1.6}button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}button{cursor:pointer;border:none;background:none}button:disabled{cursor:not-allowed}a{color:var(--primary)}kbd{font-family:var(--font-type);font-size:.85em;font-weight:700;background:var(--surface-3);border:1px solid var(--border-strong);border-bottom-width:2px;border-radius:6px;padding:2px 7px}:focus-visible{outline:none;box-shadow:var(--ring);border-radius:var(--r-sm)}::-webkit-scrollbar{width:11px;height:11px}::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:var(--r-full);border:3px solid transparent;background-clip:content-box}::-webkit-scrollbar-track{background:transparent}.row{display:flex;align-items:center;gap:var(--sp-3)}.col{display:flex;flex-direction:column;gap:var(--sp-3)}.between{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3)}.wrap{flex-wrap:wrap}.grow{flex:1}.center{display:flex;align-items:center;justify-content:center}.text-dim{color:var(--text-dim)}.text-faint{color:var(--text-faint)}.text-center{text-align:center}.mono-num{font-variant-numeric:tabular-nums}.hide-sm{display:initial}.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}.rule{display:inline-block;height:5px;width:54px;border-radius:var(--r-full);background:linear-gradient(90deg,var(--primary),var(--gold));margin-top:8px}@keyframes kr-pop{0%{transform:scale(.82);opacity:0}60%{transform:scale(1.04)}to{transform:scale(1);opacity:1}}@keyframes kr-fade-up{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}@keyframes kr-fade-in{0%{opacity:0}to{opacity:1}}@keyframes kr-shake{0%,to{transform:translate(0)}20%{transform:translate(-5px)}40%{transform:translate(5px)}60%{transform:translate(-3px)}80%{transform:translate(3px)}}@keyframes kr-float{0%,to{transform:translateY(0)}50%{transform:translateY(-7px)}}@keyframes kr-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.06)}}@keyframes kr-blink{0%,45%{opacity:1}55%,to{opacity:.1}}@keyframes kr-count-in{0%{transform:scale(2.6);opacity:0}45%{transform:scale(1);opacity:1}80%{transform:scale(1);opacity:1}to{transform:scale(.6);opacity:0}}@keyframes kr-shine{0%{background-position:0% 50%}to{background-position:200% 50%}}@keyframes kr-rise{0%{transform:translateY(0) scale(.7);opacity:0}25%{opacity:1}to{transform:translateY(-64px) scale(1.15);opacity:0}}@keyframes kr-confetti{0%{transform:translateY(-10vh) rotate(0);opacity:1}to{transform:translateY(105vh) rotate(720deg);opacity:0}}@keyframes kr-drift{0%,to{transform:translate(0) rotate(0)}50%{transform:translate(8px,-12px) rotate(8deg)}}.anim-pop{animation:kr-pop .28s cubic-bezier(.2,.9,.3,1.3) both}.anim-fade-up{animation:kr-fade-up .38s ease both}.anim-fade-in{animation:kr-fade-in .3s ease both}.anim-float{animation:kr-float 3.2s ease-in-out infinite}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}@media(max-width:720px){.hide-sm{display:none!important}}.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--font-display);font-weight:800;letter-spacing:.005em;border-radius:var(--r-full);white-space:nowrap;position:relative;transition:transform .1s cubic-bezier(.2,.9,.3,1.3),box-shadow .12s ease,filter .16s ease,opacity .18s}.btn:hover:not(:disabled){filter:brightness(1.06)}.btn:disabled{opacity:.45}.btn--sm{padding:8px 16px;font-size:14px}.btn--md{padding:12px 22px;font-size:16px}.btn--lg{padding:15px 30px;font-size:19px}.btn--xl{padding:20px 42px;font-size:clamp(19px,1.9vw,25px);border-radius:var(--r-xl)}.btn--block{width:100%}.btn--primary,.btn--success,.btn--danger,.btn--gold{color:#fff}.btn--primary{background:var(--primary);box-shadow:0 5px 0 var(--primary-deep),var(--shadow-primary)}.btn--success{background:var(--success);box-shadow:0 5px 0 var(--success-deep),0 10px 22px #17a34a4d}.btn--danger{background:var(--danger);box-shadow:0 5px 0 var(--danger-deep),0 10px 22px #ef44444d}.btn--gold{color:#4a3000;background:var(--gold-light);box-shadow:0 5px 0 var(--gold-deep),0 10px 24px #ef9f0061}.btn--primary:active:not(:disabled),.btn--success:active:not(:disabled),.btn--danger:active:not(:disabled),.btn--gold:active:not(:disabled),.btn--secondary:active:not(:disabled){transform:translateY(4px);box-shadow:0 1px 0 currentColor}.btn--primary:active:not(:disabled){box-shadow:0 1px 0 var(--primary-deep)}.btn--success:active:not(:disabled){box-shadow:0 1px 0 var(--success-deep)}.btn--danger:active:not(:disabled){box-shadow:0 1px 0 var(--danger-deep)}.btn--gold:active:not(:disabled){box-shadow:0 1px 0 var(--gold-deep)}.btn--secondary{color:var(--text);background:var(--surface);border:2px solid var(--border-strong);box-shadow:0 4px 0 var(--border-strong)}.btn--secondary:hover:not(:disabled){border-color:var(--primary);color:var(--primary);box-shadow:0 4px 0 var(--primary)}.btn--secondary:active:not(:disabled){box-shadow:0 1px 0 var(--border-strong)}.btn--ghost{color:var(--text-dim);background:transparent}.btn--ghost:hover:not(:disabled){background:var(--surface-3);color:var(--text)}.btn--ghost:active:not(:disabled){transform:translateY(1px)}.card{position:relative;background:var(--surface);border:2px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--edge),var(--shadow-sm);padding:var(--sp-6);overflow:hidden}.card[style*=--card-accent]:before{content:"";position:absolute;inset:0 0 auto;height:6px;background:var(--card-accent)}.card--flat{box-shadow:none}.card--elevated{box-shadow:var(--edge),var(--shadow-md)}.card--pad-sm{padding:var(--sp-4)}.card--interactive{cursor:pointer;transition:transform .16s cubic-bezier(.2,.9,.3,1.2),box-shadow .2s ease,border-color .2s ease}.card--interactive:hover{transform:translateY(-5px);box-shadow:0 10px 0 var(--border-strong),var(--shadow-lg);border-color:var(--card-accent, var(--primary))}.card--interactive:active{transform:translateY(-1px);box-shadow:var(--edge),var(--shadow-sm)}.stat{display:flex;flex-direction:column;gap:3px;background:var(--surface-2);border:2px solid var(--border);border-radius:var(--r-md);padding:13px 16px;min-width:0}.stat__label{font-size:12px;font-weight:800;color:var(--text-dim);text-transform:uppercase;letter-spacing:.07em}.stat__value{font-family:var(--font-display);font-weight:800;line-height:1.02;font-size:clamp(23px,2.5vw,32px);font-variant-numeric:tabular-nums;display:flex;align-items:baseline;gap:5px}.stat__unit{font-size:.5em;font-weight:800;color:var(--text-dim)}.stat__hint{font-size:12.5px;color:var(--text-faint);font-weight:700}.stat--accent{background:var(--primary-soft);border-color:color-mix(in srgb,var(--primary) 35%,transparent)}.stat--accent .stat__value{color:var(--primary)}.stat--success{background:var(--success-soft);border-color:color-mix(in srgb,var(--success) 35%,transparent)}.stat--success .stat__value{color:var(--success)}.stat--danger{background:var(--danger-soft);border-color:color-mix(in srgb,var(--danger) 35%,transparent)}.stat--danger .stat__value{color:var(--danger)}.stat--gold{background:var(--gold-soft);border-color:color-mix(in srgb,var(--gold) 40%,transparent)}.stat--gold .stat__value{color:var(--gold-deep)}[data-theme=dark] .stat--gold .stat__value{color:var(--gold)}.progress{height:14px;background:var(--surface-3);border-radius:var(--r-full);overflow:hidden;position:relative;border:2px solid var(--border)}.progress--lg{height:20px}.progress--sm{height:9px;border-width:1px}.progress__fill{height:100%;border-radius:var(--r-full);background:linear-gradient(90deg,var(--primary),var(--accent));transition:width .5s cubic-bezier(.2,.8,.3,1);box-shadow:inset 0 -3px #0000001f}.progress__fill--success{background:linear-gradient(90deg,var(--success),#6ee7a6)}.progress__fill--gold{background:linear-gradient(90deg,var(--gold),var(--gold-light))}.avatar{position:relative;display:inline-grid;place-items:center;flex:none}.avatar__ring{position:absolute;inset:0;border-radius:var(--r-full);padding:4px}.avatar__disc{position:relative;width:100%;height:100%;border-radius:var(--r-full);display:grid;place-items:center;overflow:hidden;box-shadow:inset 0 -7px 16px #00000029}.avatar__face{line-height:1;filter:drop-shadow(0 2px 3px rgba(0,0,0,.22))}.avatar__hat{position:absolute;top:-13%;left:50%;transform:translate(-50%) rotate(-10deg);line-height:1}.avatar__glasses{position:absolute;top:38%;left:50%;transform:translate(-50%);line-height:1}.avatar__level{position:absolute;right:-6%;bottom:-6%;background:var(--gold-light);color:#4a3000;font-family:var(--font-display);font-weight:800;border-radius:var(--r-full);border:3px solid var(--surface);display:grid;place-items:center;box-shadow:0 3px 0 var(--gold-deep)}.pill{display:inline-flex;align-items:center;gap:6px;padding:6px 13px;border-radius:var(--r-full);font-size:13px;font-weight:800;font-family:var(--font-display);background:var(--surface-3);color:var(--text-dim);white-space:nowrap;border:1.5px solid transparent}.pill--primary{background:var(--primary-soft);color:var(--primary-strong);border-color:color-mix(in srgb,var(--primary) 30%,transparent)}.pill--success{background:var(--success-soft);color:var(--success-deep);border-color:color-mix(in srgb,var(--success) 30%,transparent)}.pill--danger{background:var(--danger-soft);color:var(--danger-deep);border-color:color-mix(in srgb,var(--danger) 30%,transparent)}.pill--warning{background:var(--gold-soft);color:var(--gold-deep);border-color:color-mix(in srgb,var(--gold) 40%,transparent)}.pill--outline{background:var(--surface);border-color:var(--border-strong)}[data-theme=dark] .pill--success{color:var(--success)}[data-theme=dark] .pill--danger{color:var(--danger)}[data-theme=dark] .pill--warning{color:var(--gold)}.segmented{display:inline-flex;background:var(--surface-3);padding:5px;border-radius:var(--r-full);gap:3px;border:2px solid var(--border)}.segmented__item{padding:9px 19px;border-radius:var(--r-full);font-weight:800;font-size:14.5px;font-family:var(--font-display);color:var(--text-dim);transition:all .16s ease;white-space:nowrap}.segmented__item:hover{color:var(--text)}.segmented__item--active{background:var(--surface);color:var(--primary);box-shadow:0 3px 0 var(--border-strong)}.field{display:flex;flex-direction:column;gap:8px}.field__label{font-weight:800;font-size:14px;color:var(--text-dim);text-transform:uppercase;letter-spacing:.05em}.input,.select{width:100%;padding:15px 18px;font-size:17px;font-weight:700;background:var(--surface-2);color:var(--text);border:2.5px solid var(--border-strong);border-radius:var(--r-md);transition:border-color .16s ease,box-shadow .16s ease,background .16s}.input::placeholder{color:var(--text-faint);font-weight:600}.input:focus,.select:focus{outline:none;border-color:var(--primary);box-shadow:var(--ring);background:var(--surface)}.input--lg{padding:18px 22px;font-size:22px;font-family:var(--font-type);font-weight:500;letter-spacing:.02em}.input--error{border-color:var(--danger)}.select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235a6b8c' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;background-size:18px;padding-right:46px}.switch{display:inline-flex;align-items:center;gap:13px;cursor:pointer;user-select:none}.switch__track{width:56px;height:32px;border-radius:var(--r-full);background:var(--border-strong);position:relative;transition:background .2s ease;flex:none;box-shadow:inset 0 2px 4px #00000024}.switch__thumb{position:absolute;top:3px;left:3px;width:26px;height:26px;border-radius:var(--r-full);background:#fff;box-shadow:0 2px 4px #00000047;transition:transform .2s cubic-bezier(.2,.9,.3,1.3)}.switch--on .switch__track{background:var(--success)}.switch--on .switch__thumb{transform:translate(24px)}.switch__label{font-weight:800;font-size:15.5px}.modal__backdrop{position:fixed;inset:0;background:var(--overlay);backdrop-filter:blur(6px);display:grid;place-items:center;padding:var(--sp-4);z-index:100;animation:kr-fade-in .18s ease both}.modal__panel{background:var(--surface);border-radius:var(--r-xl);box-shadow:var(--shadow-lg);border:2px solid var(--border);width:min(560px,100%);max-height:88vh;overflow:auto;padding:var(--sp-8);animation:kr-pop .26s cubic-bezier(.2,.9,.3,1.3) both}.modal__panel--wide{width:min(880px,100%)}.empty{text-align:center;padding:var(--sp-10) var(--sp-4);color:var(--text-dim)}.empty__icon{font-size:58px;margin-bottom:var(--sp-3);display:block}.confetti{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:90}.confetti__bit{position:absolute;width:10px;height:16px;border-radius:3px;animation:kr-confetti linear forwards}.shell{min-height:100%;display:flex;flex-direction:column;overflow-x:clip}.topbar{position:sticky;top:0;z-index:50;height:var(--header-h);display:flex;align-items:center;gap:var(--sp-4);padding:0 clamp(14px,3vw,34px);background:color-mix(in srgb,var(--surface) 88%,transparent);backdrop-filter:blur(16px);border-bottom:2px solid var(--border);box-shadow:0 2px color-mix(in srgb,var(--border) 55%,transparent)}.brand{display:flex;align-items:center;gap:12px;font-family:var(--font-display);font-weight:800}.brand__mark{position:relative;width:44px;height:46px;flex:none;display:grid;place-items:center;font-size:21px;background:linear-gradient(170deg,var(--primary-light),var(--primary-strong));border-radius:12px 12px 50% 50%/12px 12px 46% 46%;box-shadow:0 3px 0 var(--primary-deep),0 6px 14px #1d2f7d4d}.brand__mark:after{content:"";position:absolute;inset:3px;border:2px solid rgba(255,255,255,.45);border-radius:10px 10px 50% 50%/10px 10px 44% 44%;pointer-events:none}.brand__name{font-size:22px;letter-spacing:-.03em;line-height:1}.brand__tag{font-size:10.5px;color:var(--gold-deep);font-weight:800;letter-spacing:.22em;text-transform:uppercase;margin-top:3px}[data-theme=dark] .brand__tag{color:var(--gold)}.usernav{display:flex;align-items:center;gap:13px}.usernav__xp{width:clamp(90px,13vw,175px)}.usernav__name{font-family:var(--font-display);font-weight:800;font-size:16px;line-height:1.1}.iconbtn{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;font-size:18px;background:var(--surface-2);border:2px solid var(--border);box-shadow:0 3px 0 var(--border);transition:all .14s ease;flex:none}.iconbtn:hover{background:var(--surface-3);border-color:var(--border-strong);box-shadow:0 3px 0 var(--border-strong)}.iconbtn:active{transform:translateY(3px);box-shadow:0 0 0 var(--border-strong)}.iconbtn--active{background:var(--gold-soft);border-color:var(--gold);box-shadow:0 3px 0 var(--gold)}.page{flex:1;width:100%;max-width:1240px;margin:0 auto;padding:clamp(20px,2.8vw,36px) clamp(14px,3vw,30px) 64px}.page--wide{max-width:1480px}.page--narrow{max-width:780px}.page__head{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--sp-4);margin-bottom:var(--sp-6);flex-wrap:wrap}.page__title{display:flex;flex-direction:column;gap:2px}.page__sub{color:var(--text-dim);font-weight:700}.grid{display:grid;gap:var(--sp-4)}.grid--stats{grid-template-columns:repeat(auto-fit,minmax(158px,1fr))}.grid--cards{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}.grid--2{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}.shell--focus .topbar{opacity:.3;transition:opacity .3s}.shell--focus .topbar:hover{opacity:1}@media(max-width:720px){.brand__tag,.usernav__xp{display:none}.page{padding-bottom:40px}.topbar{gap:8px;padding:0 12px}}@media(max-width:560px){.topbar{gap:6px;padding:0 10px;height:62px}.brand__mark{width:36px;height:38px;font-size:17px}.brand__name{font-size:19px}.iconbtn{width:38px;height:38px;font-size:16px;border-radius:12px}.iconbtn--theme{display:none}:root{--header-h: 62px}}@media(max-width:400px){.iconbtn--sound{display:none}}