/* Salus: визуальный язык экранов в стиле Lumi (design/index.html). Лайм→лаванда, чёрные таблетки, Inter: тонкий + жирный курсив. */
:root{
  color-scheme:light;
  --ink:#0f0f10; --ink-2:#2c2c31; --mute:#6c6c73; --line:#e6e5ea;
  --base:#f3f2f5; --white:#fff; --tile:#fbfbfc;
  --red:#c2412d; --red-bg:#fbe6df; --ok:#3d7a4a; --ok-bg:#e3f1e0;
  --g-chip:linear-gradient(115deg,#cbb7f7 0%,#ddd0f0 45%,#eeee8f 100%);
  --g-btn:linear-gradient(110deg,#c4b2f6 0%,#dccdf2 40%,#f1f08c 100%);
  --g-price:linear-gradient(110deg,#f2c6d6 0%,#cdbcf6 45%,#eef08c 100%);
  --g-slot:linear-gradient(110deg,#f3c7b3 0%,#efd8a8 45%,#ecf08b 100%);
  --sh-card:0 1px 1px rgba(40,30,70,.04),0 10px 24px -14px rgba(40,30,70,.22);
  --sh-float:0 24px 48px -20px rgba(40,30,90,.45),0 8px 18px -10px rgba(40,30,90,.25);
  --sh-dark:0 18px 34px -16px rgba(10,10,20,.6);
  --ease:cubic-bezier(.2,.9,.25,1.15);
  --font:"Inter",system-ui,-apple-system,sans-serif;
  --gut:20px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{font-family:var(--font);color:var(--ink);background:var(--base);-webkit-font-smoothing:antialiased;line-height:1.5;min-height:100vh;min-height:100dvh}
button,input,select,textarea{font:inherit;color:inherit}
button{border:0;background:none;cursor:pointer}
a{color:inherit}
img{max-width:100%}
:focus-visible{outline:2px solid #8a6fd8;outline-offset:3px}
[hidden]{display:none!important}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* фон-градиент с сеткой, как на первом экране */
.bg-soft{background:
  radial-gradient(80% 40% at 100% 70%,#f8d6c3 0%,rgba(248,214,195,0) 70%),
  radial-gradient(90% 40% at 0% 0%,#e1d8f8 0%,rgba(225,216,248,0) 70%),
  linear-gradient(180deg,#ebe5f8 0%,#f1ecf3 45%,#f6efe8 70%,#f5f6ec 100%) fixed}
.sheet-g{background:
  radial-gradient(70% 60% at 100% 100%,#bba7f2 0%,rgba(187,167,242,0) 70%),
  radial-gradient(60% 50% at 0% 100%,#e6dff7 0%,rgba(230,223,247,0) 70%),
  linear-gradient(180deg,#e8eeb2 0%,#e2e6bc 34%,#d6cdef 72%,#c9b9f1 100%)}

/* типографика: лёгкая строка + жирный курсив */
.h-l{font:300 30px/1.12 var(--font);letter-spacing:-.03em;color:#2a2a2f}
.h-b{font:italic 600 36px/1.08 var(--font);letter-spacing:-.035em;color:var(--ink)}
.lead{font:400 15px/1.6 var(--font);color:#5d5d64}
.small{font:400 13px/1.45 var(--font);color:var(--mute)}
.num{font-variant-numeric:tabular-nums}

/* кнопки */
.btn{height:54px;border-radius:27px;background:#0d0d0e;color:#fff;display:flex;align-items:center;justify-content:center;gap:10px;
  font:500 16px var(--font);width:100%;box-shadow:var(--sh-dark);transition:transform .3s var(--ease),opacity .2s;text-decoration:none}
.btn:hover{transform:translateY(-1px)} .btn:active{transform:scale(.98)}
.btn[disabled]{opacity:.35;pointer-events:none;box-shadow:none}
.btn.split{justify-content:space-between;padding:0 4px 0 24px}
.btn.split em{font-style:normal;height:46px;padding:0 18px;border-radius:23px;display:grid;place-items:center;background:var(--g-price);color:var(--ink);font:700 16px var(--font)}
.btn-ghost{height:50px;border-radius:25px;background:rgba(255,255,255,.75);border:1px solid rgba(255,255,255,.95);display:flex;align-items:center;justify-content:center;gap:9px;
  font:500 15px var(--font);width:100%;text-decoration:none;transition:transform .3s var(--ease)}
.btn-ghost:hover{transform:translateY(-1px)} .btn-ghost:active{transform:scale(.98)}
.circ{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.65);border:1px solid rgba(255,255,255,.95);transition:transform .35s var(--ease);flex:none}
.circ:hover{transform:scale(1.05)} .circ:active{transform:scale(.94)}
.link{color:var(--ink-2);text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(0,0,0,.25)}
.link:hover{text-decoration-color:var(--ink)}

/* карточки */
.tile{background:var(--tile);border:1px solid #ececef;border-radius:24px;box-shadow:var(--sh-card)}
.dark{background:#0d0d0e;color:#fff;border-radius:28px;box-shadow:var(--sh-dark)}
.chip{display:inline-flex;align-items:center;height:26px;padding:0 11px;border-radius:13px;font:500 12.5px var(--font);background:#efeef2;color:var(--ink-2);white-space:nowrap}
.chip.red{background:var(--red-bg);color:var(--red)} .chip.ok{background:var(--ok-bg);color:var(--ok)} .chip.g{background:var(--g-chip);color:var(--ink)}

/* оболочка «как приложение» */
.shell{max-width:460px;margin:0 auto;min-height:100vh;min-height:100dvh;position:relative;padding:0 var(--gut)}
@media (min-width:700px){.shell{padding-top:12px}}

/* поля */
.field{display:block;width:100%;height:54px;border-radius:18px;border:1px solid var(--line);background:#fff;padding:0 18px;font:400 16px var(--font);transition:border-color .2s}
.field:focus{outline:none;border-color:#9b86e0;box-shadow:0 0 0 4px rgba(155,134,224,.18)}
textarea.field{height:auto;padding:14px 18px;resize:vertical}
.check{display:flex;gap:12px;align-items:flex-start;font:400 13.5px/1.45 var(--font);color:#4f4f56;cursor:pointer}
.check input{appearance:none;flex:none;width:22px;height:22px;border-radius:7px;border:1.5px solid #b9b7c2;background:#fff;display:grid;place-items:center;margin-top:1px;transition:background .2s}
.check input:checked{background:#0d0d0e;border-color:#0d0d0e}
.check input:checked::after{content:"";width:10px;height:6px;border:2px solid #fff;border-top:0;border-right:0;transform:translateY(-1px) rotate(-45deg)}
.err{color:var(--red);font:500 13.5px/1.4 var(--font);min-height:0}
.err:empty{display:none}

/* нижний лист (вход на итоге) */
.veil{position:fixed;inset:0;background:rgba(20,16,40,.42);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);z-index:50;opacity:0;pointer-events:none;transition:opacity .3s}
.veil.on{opacity:1;pointer-events:auto}
.sheet:not(.on){visibility:hidden;transition:transform .45s var(--ease),opacity .3s,visibility 0s .45s}
.sheet{position:fixed;left:50%;bottom:0;width:min(460px,100%);transform:translate(-50%,105%);z-index:51;background:#f7f6f9;border-radius:30px 30px 0 0;
  padding:12px var(--gut) calc(24px + env(safe-area-inset-bottom));box-shadow:var(--sh-float);transition:transform .45s var(--ease);max-height:92vh;overflow:auto}
.sheet.on{transform:translate(-50%,0)}
.sheet .grab{width:42px;height:5px;border-radius:3px;background:#d6d4dc;margin:0 auto 18px}
@media (min-width:700px){.sheet{bottom:50%;border-radius:30px;transform:translate(-50%,60%) scale(.96);opacity:0}.sheet.on{transform:translate(-50%,50%);opacity:1}}

/* блок входа */
.auth{display:grid;gap:10px}
.auth .or{display:flex;align-items:center;gap:12px;color:#9a99a1;font:400 13px var(--font);margin:6px 0}
.auth .or::before,.auth .or::after{content:"";height:1px;flex:1;background:#e2e1e6}
.prov{height:52px;border-radius:26px;background:#fff;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;gap:10px;font:500 15px var(--font);
  transition:transform .3s var(--ease);text-decoration:none;width:100%}
.prov:hover{transform:translateY(-1px)} .prov:active{transform:scale(.98)}
.prov svg{flex:none}
.codebox{letter-spacing:.5em;text-align:center;font:600 22px var(--font)}
.devcode{background:#fff7d6;border-radius:12px;padding:8px 12px;font:500 13px var(--font);color:#6b5a00}

.foot{padding:28px 0 36px;display:flex;flex-wrap:wrap;gap:8px 18px;font:400 13px var(--font);color:var(--mute)}
.foot a{color:var(--mute)}
.disc{font:400 12px/1.45 var(--font);color:#8b8a92}

@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}