/* t19-20261031 · полировка личного кабинета (подключается последним; дизайн тот же — только доводка).
   1) 60 fps прокрутка: backdrop-filter на крупных панелях убран (они и так на 92–96 % непрозрачные —
      визуально не отличить, а размытие под ними пересчитывалось на каждом кадре: p95 кадра 50 → 17 мс).
   2) Скелетоны до первых данных вместо «0» и «Пока нет аккаунтов».
   3) Липкая шапка (на телефоне — строка статуса), safe-area для iPhone.
   4) Цели касания ≥ 44 px на сенсорных экранах. 5) Состояния загрузки/нажатия, reduced-motion. */

.hero-card,.panel,.live-head,#liveWait,.top{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}

/* --- safe area --- */
.app{padding-left:max(20px,env(safe-area-inset-left));padding-right:max(20px,env(safe-area-inset-right));padding-bottom:max(56px,calc(env(safe-area-inset-bottom) + 32px))}
.gate{padding:max(24px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left));min-height:100dvh}
@supports not (min-height:100dvh){.gate{min-height:100vh}}

/* --- липкая шапка --- */
@media (min-width:821px){
  .top{position:sticky;top:0;z-index:100;margin-top:-10px;padding:10px 0;background:#06080d;box-shadow:0 0 0 100vmax #06080d,0 10px 24px -18px rgba(0,0,0,.9);clip-path:inset(0 -100vmax 0);border-bottom:1px solid rgba(255,255,255,.06)}
}
@media (max-width:820px){
  .top{display:contents}
  .top>.brand{position:sticky;top:0;z-index:100;isolation:isolate;padding:calc(8px + env(safe-area-inset-top)) 0 8px;margin:-8px 0 14px;background:#06080d;box-shadow:0 0 0 100vmax #06080d,0 10px 22px -16px rgba(0,0,0,.9);clip-path:inset(0 -100vmax 0);border-bottom:1px solid rgba(255,255,255,.06)}
  .top>.top-actions{margin-bottom:18px}
}

/* --- скелетоны до первых данных --- */
@keyframes cabSk{0%{background-position:150% 0}100%{background-position:-50% 0}}
.app.is-loading #stAcc,.app.is-loading #stRun,.app.is-loading #stRound,.app.is-loading #stInChat,.app.is-loading #stFreeC,.app.is-loading #stHereC,.app.is-loading #sessionAccounts,.app.is-loading #stFreePending,.app.is-loading #serverClock,.app.is-loading #sessionHint{color:transparent!important;-webkit-text-fill-color:transparent;border-radius:8px;background:linear-gradient(90deg,rgba(255,255,255,.05) 25%,rgba(255,255,255,.11) 50%,rgba(255,255,255,.05) 75%) 0 0/200% 100%;animation:cabSk 1.3s ease-in-out infinite;text-shadow:none!important}
.app.is-loading #stAcc,.app.is-loading #stRun,.app.is-loading #stRound,.app.is-loading #stInChat,.app.is-loading #stFreeC,.app.is-loading #stHereC{display:inline-block;min-width:2.2ch}
.app.is-loading #accEmpty{display:none!important}
.app.is-loading #accList>*{display:none}
.app.is-loading #accList::before,.app.is-loading #accList::after{content:"";display:block;height:340px;border-radius:22px;border:1px solid rgba(255,255,255,.06);background:linear-gradient(90deg,rgba(255,255,255,.025) 25%,rgba(255,255,255,.06) 50%,rgba(255,255,255,.025) 75%) 0 0/200% 100%;animation:cabSk 1.3s ease-in-out infinite}
.app.is-loading #accList::after{margin-top:14px;height:180px;opacity:.6}

/* Steam-блок карточки: скелетон статуса, подпись невидимки */
.cst-sk{display:grid;gap:7px;padding-top:2px}
.cst-sk i{display:block;height:11px;border-radius:6px;background:linear-gradient(90deg,rgba(255,255,255,.05) 25%,rgba(255,255,255,.11) 50%,rgba(255,255,255,.05) 75%) 0 0/200% 100%;animation:cabSk 1.3s ease-in-out infinite}
.cst-sk i+i{width:62%}
.cst-inv-x{color:var(--eo-text-2,#a7a39a);font-weight:500}
.cst-pers{transition:background-color .2s,color .2s,border-color .2s,opacity .2s}
.cst-mini:not(:disabled):hover{border-color:rgba(255,255,255,.22);background:rgba(255,255,255,.07)}
.cst-mini:not(:disabled):active,.cst-b:not(:disabled):active{transform:scale(.97)}
.cst-b,.cst-mini{transition:color .2s,transform .12s,background-color .2s,border-color .2s}
.cst-inv:hover{border-color:rgba(255,255,255,.14)}

/* «Аптайм» в мини-статистике: подпись не обрезается на узких карточках */
.eo-card .cs2-xs .lbl{text-overflow:clip}

/* --- кнопка входа: состояние загрузки --- */
#loginBtn.is-busy{position:relative;color:transparent!important;pointer-events:none}
#loginBtn.is-busy::after{content:"";position:absolute;left:50%;top:50%;width:18px;height:18px;margin:-9px 0 0 -9px;border-radius:50%;border:2px solid rgba(26,18,6,.25);border-top-color:#1a1206;animation:cabSpin .7s linear infinite}
@keyframes cabSpin{to{transform:rotate(360deg)}}
button:disabled{cursor:not-allowed}

/* --- цели касания ≥ 44 px (сенсорные экраны / узкие окна) --- */
@media (pointer:coarse),(max-width:720px){
  .top-btn,.key-chip,.run-btn,#addAccBtn,.log-clear,#quizClearBtn,.quiz-clear-btn{min-height:44px}
  .modal-x,.quiz-del{min-width:44px;min-height:44px}
  .cst-b{height:44px}.cst-thumb{height:44px}
  .cst-pers,.cst-mini,.cst-sel{min-height:44px}
  .cst-x{width:44px;height:44px;margin:-7px -7px -7px 0}
  .foot-chip,.proxy-refresh,.cs2-unlink{position:relative}
  .foot-chip::after,.proxy-refresh::after,.cs2-unlink::after{content:"";position:absolute;left:50%;top:50%;width:max(100%,44px);height:44px;transform:translate(-50%,-50%)}
  .cs2-unlink{padding:12px 4px;margin-top:-8px;margin-bottom:-8px}
}

@media (prefers-reduced-motion:reduce){
  .app.is-loading *,.cst-sk i,.app.is-loading #accList::before,.app.is-loading #accList::after{animation:none!important}
  .cst-b,.cst-mini{transition:none}
  #loginBtn.is-busy::after{animation-duration:1.6s}
}

/* t19 pass-2: чекбоксы в модалках и кнопки модалок — касание ≥44 px */
@media (pointer:coarse),(max-width:720px){
  .modal-card label.check{min-height:44px;margin-top:0;margin-bottom:6px}
  .modal-actions .btn{min-height:44px}
}
/* t19d: timer meta («кнопка готова» → «подтверждено сайтом») wraps to 2 lines on phones — reserve both lines so the card doesn't grow on live updates */
@media (max-width:520px){
  .timer-box .t-meta{line-height:1.35;min-height:2.7em}
}
/* t19e: «Всего в CS2 · Steam» / «Накручено нами» — on phones two tiles side by side don't fit (value is nowrap 23px), the second tile was cut by the card edge. One column on ≤560px. */
@media (max-width:560px){
  .eo-card .stats{grid-template-columns:minmax(0,1fr)}
  .eo-card .st{min-width:0}
}
/* t19f: journal on phones — each .log-line had content-visibility:auto with a 44px placeholder, but a real phone line is 70–110px, so lines jumped (layout shift 0.03–0.04) when the journal scrolled into view. Skip rendering of the whole fixed-height box instead: no shift, same saving. */
#logBox .log-line{content-visibility:visible;contain-intrinsic-size:none}
@media (max-width:820px){#logBox{content-visibility:auto;contain-intrinsic-size:auto 420px}}
/* t19f: a new journal line fades in (the lines below glide down via FLIP in app.js instead of jumping) */
#logBox .log-line.log-in{animation:t19LogIn .24s ease-out both}
@keyframes t19LogIn{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){#logBox .log-line.log-in{animation:none}}
