/* ============================================================
   Оболочка приложения: анкета /registration/ и ЛК /account/
   Зависит от style.css (токены). Префиксы: ap- (общие), an- (анкета), lk-/mn-/vd-/ch-/st-/sh- (ЛК)
   ============================================================ */
:root{
  --ap-bg:#f6f3f2;
  --ap-card:#ffffff;
  --ap-soft:#f6f3f2;
  --ap-line:#ece6e4;
  --ap-muted:#6f7486;
  --ap-ok:#2f8f62;
  --ap-ok-soft:#e5f3ec;
  --ap-warm:#b5651d;
  --ap-warm-soft:#fcefe2;
  --ap-r:24px;
  --ap-r-sm:16px;
  --ap-ease:cubic-bezier(.2,.7,.2,1);
  --ap-safe:env(safe-area-inset-bottom,0px);
}
.ap{margin:0;min-height:100vh;background:var(--ap-bg);color:var(--blue-dark);font:400 15px/1.5 var(--font-onest);-webkit-font-smoothing:antialiased;overflow-x:hidden}
html.lk-page,html:has(body.lk-page){scrollbar-gutter:stable}
.ap h1,.ap h2,.ap h3{font-family:var(--font-montserrat);letter-spacing:-.025em;margin:0}
:where(.ap) a{color:inherit;text-decoration:none}
.ap [hidden]{display:none!important}
:where(.ap) section{padding:0}
.ap svg{width:20px;height:20px;flex:none}
.ap button{cursor:pointer}
.flip{transform:scaleX(-1)}

/* ---- кнопки ---- */
.ap-btn{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;height:52px;padding:0 22px;border-radius:16px;font:600 15px/1 var(--font-onest);white-space:nowrap;transition:background-color .2s,color .2s,box-shadow .2s,transform .2s var(--ap-ease),opacity .2s}
.ap-btn svg{width:18px;height:18px}
.ap-btn:active{transform:scale(.98)}
.ap-btn:focus-visible{box-shadow:var(--shadow-focus)}
.ap-btn--pink{background:var(--pink);color:#fff}
.ap-btn--pink:hover{background:var(--pink-dark)}
.ap-btn--navy{background:var(--blue-dark);color:#fff}
.ap-btn--navy:hover{background:#1b2337}
.ap-btn--ghost{box-shadow:inset 0 0 0 1.5px var(--ap-line);color:var(--blue-dark);background:#fff}
.ap-btn--ghost:hover{box-shadow:inset 0 0 0 1.5px var(--blue-dark)}
.ap-btn--white{background:#fff;color:var(--blue-dark)}
.ap-btn--sm{height:40px;padding:0 16px;border-radius:12px;font-size:14px}
.ap-btn[disabled],.ap-btn[aria-disabled="true"]{opacity:.45;cursor:default;pointer-events:none}
.ap-ibtn{all:unset;box-sizing:border-box;cursor:pointer;position:relative;width:44px;height:44px;border-radius:14px;display:inline-grid;place-items:center;color:var(--blue-dark);background:#fff;box-shadow:inset 0 0 0 1.5px var(--ap-line);transition:box-shadow .2s,background-color .2s;flex:none}
.ap-ibtn:hover{box-shadow:inset 0 0 0 1.5px var(--blue-dark)}
.ap-ibtn:focus-visible{box-shadow:var(--shadow-focus)}
.ap-ibtn--sm{width:34px;height:34px;border-radius:10px}
.ap-ibtn--sm svg{width:16px;height:16px}
.ap-link{all:unset;cursor:pointer;color:var(--pink-dark);font-weight:600;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.ap-link[disabled]{color:var(--ap-muted);text-decoration:none;cursor:default}
.ap-link:focus-visible{box-shadow:var(--shadow-focus);border-radius:4px}

/* ---- поля ---- */
.ap-fld{display:grid;gap:7px;min-width:0}
.ap-fld>span{font-size:13px;font-weight:600;color:var(--ap-muted)}
.ap-fld>span i{font-style:normal;font-weight:500;opacity:.8}
.ap-fld input,.ap-fld textarea,.ap-fld select{width:100%;box-sizing:border-box;border:0;border-radius:14px;background:var(--ap-soft);padding:15px 16px;font:500 16px/1.35 var(--font-onest);color:var(--blue-dark);outline:none;resize:vertical;transition:box-shadow .2s,background-color .2s;-webkit-appearance:none;appearance:none}
.ap-fld input::placeholder,.ap-fld textarea::placeholder{color:#9a9fae;font-weight:400}
.ap-fld input:focus,.ap-fld textarea:focus{background:#fff;box-shadow:0 0 0 2px var(--pink)}
.ap-fld.bad input,.ap-fld.bad textarea{box-shadow:0 0 0 2px #d94a4a;background:#fff}
.ap-fld small{font-size:12px;line-height:17px;color:var(--ap-muted)}
.ap-fld.is-ro input{background:#fff;box-shadow:inset 0 0 0 1.5px var(--ap-line);color:var(--ap-muted)}
.ap-fld--sm input{padding:10px 12px;font-size:15px;border-radius:12px}
.ap-search{display:flex;align-items:center;gap:10px;height:52px;padding:0 16px;border-radius:14px;background:var(--ap-soft);transition:box-shadow .2s,background-color .2s}
.ap-search:focus-within{background:#fff;box-shadow:0 0 0 2px var(--pink)}
.ap-search svg{color:var(--ap-muted)}
.ap-search input{flex:1;min-width:0;border:0;background:transparent;outline:none;font:500 16px var(--font-onest);color:var(--blue-dark)}

/* ---- бейджи, чипсы, сегменты ---- */
.ap-badge{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px;border-radius:999px;background:var(--ap-soft);color:var(--ap-muted);font-size:12px;font-weight:700;letter-spacing:.01em;white-space:nowrap}
.ap-badge i{width:6px;height:6px;border-radius:50%;background:currentColor}
.ap-badge--warm{background:var(--ap-warm-soft);color:var(--ap-warm)}
.ap-badge--ok{background:var(--ap-ok-soft);color:var(--ap-ok)}
.ap-badge--pink{background:var(--pink-soft);color:var(--pink-dark)}
.ap-chips{display:flex;flex-wrap:wrap;gap:8px}
.ap-chip{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 14px;border-radius:999px;background:#fff;box-shadow:inset 0 0 0 1.5px var(--ap-line);font-size:14px;font-weight:600;white-space:nowrap;transition:background-color .2s,color .2s,box-shadow .2s}
.ap-chip:hover{box-shadow:inset 0 0 0 1.5px var(--blue-dark)}
.ap-chip[aria-pressed="true"]{background:var(--blue-dark);color:#fff;box-shadow:none}
.ap-chip i{font-style:normal;font-size:12px;opacity:.65}
.ap-chip:focus-visible{box-shadow:var(--shadow-focus)}
.ap-seg{display:flex;gap:4px;padding:4px;border-radius:16px;background:#fff;box-shadow:inset 0 0 0 1px var(--ap-line);overflow-x:auto;scrollbar-width:none}
.ap-seg::-webkit-scrollbar{display:none}
.ap-seg-i{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 14px;border-radius:12px;font-size:14px;font-weight:600;color:var(--ap-muted);white-space:nowrap;transition:background-color .2s,color .2s}
.ap-seg-i i{font-style:normal;min-width:22px;height:22px;padding:0 6px;box-sizing:border-box;border-radius:999px;background:var(--ap-soft);display:inline-grid;place-items:center;font-size:12px;color:var(--blue-dark)}
.ap-seg-i:hover{color:var(--blue-dark)}
.ap-seg-i[aria-selected="true"]{background:var(--blue-dark);color:#fff}
.ap-seg-i[aria-selected="true"] i{background:rgba(255,255,255,.18);color:#fff}
.ap-seg-i:focus-visible{box-shadow:var(--shadow-focus)}

/* ---- шторка / панель / тост ---- */
.ap-scrim{position:fixed;inset:0;z-index:80;background:rgba(39,49,74,.36);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);opacity:0;transition:opacity .25s}
.ap-scrim.on{opacity:1}
.ap-drawer,.ap-sheet{position:fixed;z-index:90;inset:0;pointer-events:none}
.ap-drawer-in,.ap-sheet-in{pointer-events:auto;position:absolute;background:#fff;overflow:auto;overscroll-behavior:contain;transition:transform .35s var(--ap-ease)}
.ap-drawer-in{top:12px;right:12px;bottom:12px;width:min(480px,calc(100% - 24px));border-radius:28px;padding:28px;transform:translateX(calc(100% + 24px))}
.ap-drawer.on .ap-drawer-in{transform:none}
.ap-sheet-in{left:0;right:0;bottom:0;border-radius:28px 28px 0 0;padding:10px 16px calc(20px + var(--ap-safe));transform:translateY(100%);display:grid;gap:6px}
.ap-sheet.on .ap-sheet-in{transform:none}
.ap-grab{display:none;width:40px;height:5px;border-radius:5px;background:var(--ap-line);margin:0 auto 10px}
.ap-sheet .ap-grab{display:block}
.ap-toast{position:fixed;z-index:100;left:50%;bottom:24px;transform:translate(-50%,20px);max-width:calc(100% - 32px);padding:12px 18px;border-radius:14px;background:var(--blue-dark);color:#fff;font-size:14px;font-weight:600;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s var(--ap-ease)}
.ap-toast.on{opacity:1;transform:translate(-50%,0)}

@media (max-width:760px){
  .ap-drawer-in{top:auto;left:0;right:0;bottom:0;width:auto;max-height:calc(100% - 48px);border-radius:28px 28px 0 0;padding:10px 18px calc(22px + var(--ap-safe));transform:translateY(100%)}
  .ap-drawer .ap-grab{display:block}
  .ap-btn{height:50px}
}
@media (prefers-reduced-motion:reduce){
  .ap *,.ap *::before,.ap *::after{transition-duration:.01ms!important;animation-duration:.01ms!important}
}