/* Палитра, базовая типографика, оболочка экранов и текстовые утилиты. */

:root{
  color-scheme:dark;
  --bg:#090a0c; --panel:#141619; --panel2:#1a1c20; --text:#f3f4f5;
  --muted:#969ba3; --line:#2b2e34; --accent:#f3f4f5; --soft:#202328;
  --good:#d0d3d8; --danger:#d0d3d8; --track:#303339;
}

*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}

html{background:#050607}

body{
  margin:0;background:#050607;color:var(--text);
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;min-height:100vh;display:flex;justify-content:center;
}

#app{
  width:min(100%,430px);min-height:100vh;min-height:100dvh;background:var(--bg);
  position:relative;border-inline:1px solid #15171b;
}

.screen{min-height:100vh;min-height:100dvh;padding:calc(22px + env(safe-area-inset-top)) 18px calc(96px + env(safe-area-inset-bottom));display:none}

.screen.active{display:block}

.topbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:22px}

.topbar > div,.row > *,.between > *{min-width:0}

.title{font-size:30px;font-weight:800;letter-spacing:-.035em;line-height:1.12;overflow-wrap:anywhere}

.subtitle{color:var(--muted);font-size:13px;line-height:1.45;margin-top:6px}

.section-title{font-size:10px;font-weight:750;color:var(--muted);text-transform:uppercase;letter-spacing:.14em;margin:24px 0 11px}

.notice{font-size:12px;color:var(--muted);line-height:1.45}

.center{text-align:center}

.tiny{font-size:11px;color:var(--muted);line-height:1.4}