/* index: style-1 */
/* Дизайн-токены вынесены в css/tokens.css — подключается раньше этого файла. */

/* Профиль больше не меняет тему: дизайн один для всех экранов. */


@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    transition-duration: .001ms !important;
  }
}


/* css/base.css */
/* ============================================================
   Base — reset, typography, фон-атмосфера
   ============================================================ */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
  font-family: var(--font-sans);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--text-1);
  background: var(--bg-1);
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  transition: background var(--dur) var(--ease), color var(--dur) var(--ease);
}

button, input, select, textarea { font: inherit; }

/* Атмосферный фон: мягкое свечение активного акцента + тонкое зерно */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -2;
  background:
    radial-gradient(60vw 50vh at 78% -8%, var(--accent-soft), transparent 60%),
    radial-gradient(50vw 40vh at 0% 100%, color-mix(in srgb,var(--accent) 18%,var(--bg-1)), transparent 55%);
  transition: background var(--dur-slow) var(--ease);
  pointer-events: none;
}
body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  opacity: .035;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* Типографика заголовков — вынесена в css/design.css */

/* Заголовки секций внутри карточек — вынесены в css/design.css */

p { color: var(--text-2); }

a { color: var(--accent); text-decoration: none; transition: opacity var(--dur-fast); }
a:hover { opacity: .8; }

small, .text-sm { font-size: var(--fs-sm); }
.muted { color: var(--text-3); }

.mono { font-family: var(--font-ui); font-variant-numeric: tabular-nums; letter-spacing: -.01em; }

::selection { background: var(--accent); color: var(--text-on-accent); }

/* --- Скроллбар --- */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--line-strong); border-radius: var(--r-pill); border: var(--bw-1-5) solid var(--bg-1); }
::-webkit-scrollbar-thumb:hover { background: var(--text-3); }

/* --- Фокус для доступности --- */
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: var(--r-md); }

/* --- Утилиты раскладки --- */
.stack > * + * { margin-top: var(--sp-4); }
.stack-sm > * + * { margin-top: var(--sp-2); }
.stack-lg > * + * { margin-top: var(--sp-6); }
.row { display: flex; align-items: center; gap: var(--sp-3); }
.wrap { flex-wrap: wrap; }
.grid { display: grid; gap: var(--sp-4); }
.grid-2 { grid-template-columns: repeat(2, 1fr); }
.fill { flex: 1 1 auto; }
.center { text-align: center; }
.hidden { display: none !important; }

@media (max-width: 699px) {
  .grid-2, .grid-3 { grid-template-columns: 1fr; }
}


/* css/components.css */
/* ============================================================
   Components — карточки, кнопки, поля, чипы, табы, бейджи, метрики
   ============================================================ */

/* ---------- Карточка ---------- */
.card {
  padding: var(--sp-5);
  border-radius: var(--r-xl);
  border: var(--bw-1-5) solid var(--accent-line);
  background: var(--bg-2);
  box-shadow: var(--shadow-md), 0 0 36px -14px rgba(207,200,255,.28), 0 0 26px -12px rgba(248,168,184,.2);
  color: var(--text-1);
  transition: border-color var(--dur) var(--ease), transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.card-accent { box-shadow: 0 16px 44px -20px var(--accent-soft); }
.card-pad-lg { padding: var(--sp-6); }
.di-profile{ position:relative; overflow:hidden; }
.di-profile::before{
  content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(50% 90% at 100% 0%, var(--accent-soft), transparent 70%),
    radial-gradient(40% 80% at 0% 100%, var(--peri-soft), transparent 70%);
}
.di-profile > *{ position:relative; z-index:1; }

/* карточка внутри карточки — вложенная панель */
.card-inset {
  padding: var(--sp-5);
  border-radius: var(--r-lg);
  border: var(--bw-1) solid var(--line-soft);
  background: var(--bg-3);
  box-shadow: none;
}

.card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--sp-3); margin-bottom: var(--sp-3); }
.card-head p { font-size: var(--fs-sm); line-height: var(--lh-body); color: var(--text-2); margin: var(--sp-1) 0 0; }

/* строка/инлайн-блок внутри карточки — мельче card-inset */
.row-inset {
  padding: var(--sp-3);
  border-radius: var(--r-md);
  border: var(--bw-1) solid var(--line-soft);
  background: var(--bg-3);
}

/* Базовые стили кнопок — вынесены в css/design.css */

/* ---------- Поля ввода ---------- */
.field-label { display: block; font-size: var(--fs-sm); color: var(--text-2); margin-bottom: var(--sp-2); }
.input, .textarea, .select {
  width: 100%;
  font: inherit;
  font-size: var(--fs-body);
  color: var(--text-1);
  background: var(--bg-2);
  border: var(--bw-1-5) solid var(--line);
  border-radius: var(--r-md);
  padding:var(--sp-3) var(--sp-4);
  transition: border-color var(--dur-fast), background var(--dur-fast), box-shadow var(--dur-fast);
}
.input::placeholder, .textarea::placeholder { color: var(--text-3); }
.input:focus, .textarea:focus, .select:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accent-soft);
}
.textarea { resize: vertical; min-height: 110px; line-height: var(--lh-body); }
.select { appearance: none; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%237d7a8c' stroke-width='1.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 14px center; padding-right:var(--sp-7);
}

/* ---------- Чипы ---------- */
.chip {
  display: inline-flex; align-items: center; gap:var(--sp-2);
  font-size: var(--fs-sm); font-weight: 500;
  padding:var(--sp-2) var(--sp-3); border-radius: var(--r-md);
  background: var(--bg-2); color: var(--text-2);
  border: var(--bw-1-5) solid var(--line); cursor: pointer;
  transition: all var(--dur-fast);
}
@property --chip-glow-a{ syntax:'<angle>'; inherits:false; initial-value:0deg; }
.chip-active,.chip.chip-active { position:relative; background: var(--accent-soft); color: var(--text-1); border-color: transparent; }

.chip-active::before,.chip.chip-active::before,
.choice-active::before,.choice[aria-pressed=true]::before,
.tx-chip[aria-pressed="true"]::before,.tx-chip.tx-chip-active::before,
.di-tab.on::before,
.tx-seg-opt.active::before,
body:not(.route-home):not(.route-admin) .mood-pill.on::before {
  content:''; position:absolute; inset:0; z-index:-1; border-radius:inherit; padding:var(--bw-1-5);
  background:conic-gradient(from var(--chip-glow-a), var(--accent), var(--coral-d), var(--indigo), var(--accent));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
  opacity:.35; animation:chipBorderGlow 8s linear infinite;
}
body:not(.route-home):not(.route-admin) .mood-pill.on::before{
  background:conic-gradient(from var(--chip-glow-a), var(--m), var(--accent), var(--m));
}
@keyframes chipBorderGlow{ to{ --chip-glow-a:360deg; } }
@media(prefers-reduced-motion:reduce){
  .chip-active::before,.chip.chip-active::before,
  .choice-active::before,.choice[aria-pressed=true]::before,
  .tx-chip[aria-pressed="true"]::before,.tx-chip.tx-chip-active::before,
  .di-tab.on::before,
  .tx-seg-opt.active::before,
  body:not(.route-home):not(.route-admin) .mood-pill.on::before{ animation:none; }
}

/* ---------- Бейджи / статусы ---------- */
.badge {
  display: inline-flex; align-items: center; gap:var(--sp-2);
  font-family: var(--font-ui); font-size: var(--fs-xs); letter-spacing: -.01em;
  padding:var(--sp-1) var(--sp-3); border-radius: var(--r-pill);
  background: var(--bg-3); color: var(--text-2); border: var(--bw-1) solid var(--line);
}
.dot { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }

/* ---------- Метрика / сигнал ---------- */
.metric { display: flex; flex-direction: column; gap: 2px; }
.metric-value { font-weight: 760; letter-spacing: -.045em; line-height: 1; }
.metric-label { font-size: var(--fs-xs); color: var(--text-3); text-transform: uppercase; letter-spacing: .08em; }

.bar { height: 6px; background: var(--bg-inset); border-radius: var(--r-pill); overflow: hidden; }
.bar > span { display: block; height: 100%; border-radius: var(--r-pill);
  background: linear-gradient(90deg, var(--signal-mid), var(--indigo));
  transition: width var(--dur-slow) var(--ease-out); }

/* ---------- Заметка/выноска ---------- */
.callout {
  display: flex; gap: var(--sp-3);
  padding: var(--sp-4); border-radius: var(--r-md);
  background: var(--accent-soft); border: var(--bw-1) solid var(--accent-line);
  font-size: var(--fs-sm); color: var(--text-2);
}
.callout strong { color: var(--text-1); }

/* ---------- Пустое состояние ---------- */
.empty { text-align: center; padding: var(--sp-7) var(--sp-4); color: var(--text-3); }
.empty-glyph { font-family: var(--font-display); font-size: 2.6rem; opacity: .4; margin-bottom: var(--sp-2); }
.tx-locked{ max-width:480px; }
.tx-locked-ic{ width:48px; height:48px; border-radius:var(--r-pill); background:var(--accent-soft); display:grid; place-items:center; font-size:20px; margin-bottom:var(--sp-4); }
.tx-locked h3{ margin:0 0 var(--sp-2); }
.tx-locked p{ max-width:46ch; margin:0; }
.tx-locked .pair-empty-action{ margin-top:var(--sp-5); }
/* v2.7 functional additions */
.choice{display:flex;gap:var(--sp-3);text-align:left;width:100%;cursor:pointer;transition:.16s ease}.choice b{display:grid;place-items:center;border-radius:50%;flex:0 0 auto}.choice:hover{color:var(--text-1)}
.score-row{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin-top:var(--sp-3)}.checkline{display:flex;align-items:center;gap:var(--sp-2);color:var(--text-2);font-size:var(--fs-sm);margin:var(--sp-2) 0}.checkline input{accent-color:var(--accent)}.item{padding:var(--sp-3);border:var(--bw-1) solid var(--line-soft);background:var(--bg-inset);border-radius:var(--r-md)}.item p{font-size:var(--fs-sm);color:var(--text-2);margin:var(--sp-1) 0 0}@media(max-width:900px){.grid-3,.grid-2{grid-template-columns:1fr}}


/* css/layout.css */
/* ============================================================
   Layout — app shell, сайдбар, шапка, контейнер view
   ============================================================ */

.app {
  display: grid;
  grid-template-columns: var(--sidebar-w) 1fr;
  min-height: 100vh;
}

/* ---------- Сайдбар ---------- */
.sidebar {
  position: sticky;
  top: 0;
  align-self: start;
  height: 100vh;
  display: flex;
  flex-direction: column;
  gap: var(--sp-5);
  padding: var(--sp-5) var(--sp-4);
  background: color-mix(in srgb,var(--indigo) 18%,var(--bg-0));
  border-right: var(--bw-1) solid var(--line);
  z-index: var(--z-nav);
}

.brand { display: flex; align-items: center; gap: var(--sp-3); padding: 0 var(--sp-2); }
.brand-mark {
  width: 36px; height: 36px; border-radius:var(--r-md); flex: none;
  display: grid; place-items: center;
  background: url('../assets/pair-studio-icon.svg') center/cover no-repeat;
  color: var(--bg-2); font-family: var(--font-display); font-weight: 600; font-size: var(--fs-card-title);
  box-shadow: var(--shadow-md);
}
.brand-mark svg{display:none}
.brand-name { font-family: var(--font-ui); font-size:var(--fs-body); font-weight: 720; letter-spacing: -.035em; line-height: 1.1; }
.brand-sub { font-size: var(--fs-xs); color: var(--text-3); }

.nav { display: flex; flex-direction: column; gap: 2px; }
.nav a, .nav button {
  display: flex; align-items: center; gap: var(--sp-3);
  font: inherit; font-size: var(--fs-sm); text-align: left;
  width: 100%; padding:var(--sp-3) var(--sp-3);
  border: 0; border-radius: var(--r-md);
  background: transparent; color: var(--text-2); cursor: pointer;
  transition: background var(--dur-fast), color var(--dur-fast);
}
.nav a:hover, .nav button:hover { background: var(--bg-2); color: var(--text-1); }
.nav a.active {
  background: var(--accent-soft); color: var(--text-1); font-weight: 500;
  box-shadow: inset 2px 0 0 var(--accent);
}
.nav-ico { width: 18px; height: 18px; flex: none; opacity: .85; }

.sidebar-foot { margin-top: auto; display: flex; flex-direction: column; gap: var(--sp-3); }

/* ---------- Главная колонка ---------- */
.main { display: flex; flex-direction: column; min-width: 0; }

.topbar {
  position: sticky; top: 0; z-index: var(--z-header);
  display: none; align-items: center; justify-content: space-between; gap: var(--sp-4);
  padding: var(--sp-4) var(--sp-6);
  background: color-mix(in srgb, var(--bg-1) 82%, transparent);
  backdrop-filter: blur(14px);
  border-bottom: var(--bw-1) solid var(--line);
}
/* Выбор активного профиля */
.profile-switch { display: flex; align-items: center; gap: var(--sp-3); }

.view {
  flex: 1;
  width: 100%;
  max-width: var(--maxw);
  margin: 0 auto;
  padding: var(--sp-6);
}

/* появление view */

/* staggered reveal для карточек на странице */
.reveal > * { animation: revealUp var(--dur) var(--ease-out) both; }
.reveal > *:nth-child(1) { animation-delay: .03s; }
.reveal > *:nth-child(2) { animation-delay: .08s; }
.reveal > *:nth-child(3) { animation-delay: .13s; }
.reveal > *:nth-child(4) { animation-delay: .18s; }
.reveal > *:nth-child(5) { animation-delay: .23s; }
.reveal > *:nth-child(6) { animation-delay: .28s; }
@keyframes revealUp { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* ---------- Мобильная навигация ---------- */
.mobile-bar { display: none; }

@media (max-width: 699px) {
  .app { grid-template-columns: 1fr; }
  .sidebar {
    position: fixed; left: 0; top: 0; bottom: 0; width: 80%; max-width: 300px;
    transform: translateX(-100%); transition: transform var(--dur) var(--ease);
    box-shadow: var(--shadow-lg);
  }
  body.nav-open .sidebar { transform: none; }
  .nav-scrim { position: fixed; inset: 0; background: var(--overlay); opacity: 0; pointer-events: none; transition: opacity var(--dur); z-index: 45; }
  body.nav-open .nav-scrim { opacity: 1; pointer-events: auto; }
  .mobile-bar { display: flex; }
  .view { padding: var(--sp-4); }
  .topbar { display: flex; padding: var(--sp-4); }
  /* единый размер с топбаром лендинга (.lp-mnav-btn / .nav-cta) */
  .topbar .mobile-bar { border-radius: var(--r-md); }
  .topbar .profile-switch .btn-primary {
    height: 42px; padding:0 var(--sp-5); font-size:var(--fs-sm);
    border-radius: var(--r-md); line-height: 1;
  }
}


/* Current interaction and translator layout */
/* Подменю опросников: статический компонентный слой. */
@keyframes nav-submenu-in{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}
@keyframes nav-active-in{from{opacity:.45;transform:translateX(-3px)}to{opacity:1;transform:translateX(0)}}
.nav-item-wrap{display:flex;flex-direction:column;gap:2px}
.nav-item-wrap.section-open>a{background:transparent;color:var(--indigo);font-weight:600;box-shadow:none}
.nav-submenu{display:none;margin:2px 0 var(--sp-3) var(--sp-7);padding-left:var(--sp-3);border-left:var(--bw-1) solid var(--line)}
.nav-item-wrap.open .nav-submenu{display:flex;flex-direction:column;gap:1px;animation:nav-submenu-in .24s cubic-bezier(.2,.8,.2,1) both}
.nav a{transition:color var(--dur-fast) ease,background var(--dur-fast) ease,transform var(--dur-fast) cubic-bezier(.2,.8,.2,1),box-shadow var(--dur-fast) ease}
.nav a:hover{transform:translateX(2px)}
.nav-subitem{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);padding:var(--sp-2) var(--sp-3);border-radius:var(--r-md);font-size:var(--fs-xs);line-height:1.2;color:var(--text-3);background:transparent;border:0;text-align:left;cursor:pointer;transition:color var(--dur-fast) ease,background var(--dur-fast) ease,transform var(--dur-fast) cubic-bezier(.2,.8,.2,1),box-shadow var(--dur-fast) ease}
.nav-subitem>span:first-child{min-width:0;white-space:nowrap}
.nav-subitem:hover{background:var(--bg-2);color:var(--text-1);transform:translateX(2px)}
.nav-subitem.active{background:transparent;color:var(--indigo);font-weight:650;box-shadow:inset 2px 0 0 var(--accent);animation:nav-active-in .22s cubic-bezier(.2,.8,.2,1) both}
.nav-submeta{font-size:var(--fs-xs);color:var(--text-3);font-variant-numeric:tabular-nums;white-space:nowrap}
.nav-subitem.active .nav-submeta{color:var(--text-3)}
@media (prefers-reduced-motion:reduce){.nav a,.nav-subitem{transition:none!important}.nav-item-wrap.open .nav-submenu,.nav-subitem.active{animation:none!important}}

.card,.choice,.item{will-change:transform}.btn-primary{position:relative;overflow:hidden}.btn-primary::after{content:"";position:absolute;inset:-60% auto -60% -30%;width:35%;transform:rotate(18deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.28),transparent);opacity:0;transition:transform .65s var(--ease-out),opacity .2s var(--ease)}.btn-primary:hover::after{transform:translateX(420%) rotate(18deg);opacity:1}
.chip,.choice,.nav a,.nav button{transition:transform var(--dur-fast) var(--ease),background var(--dur-fast),border-color var(--dur-fast),color var(--dur-fast),box-shadow var(--dur-fast)}.chip:hover{transform:translateY(-1px)}
.question-card .card-head h3,.card .card-head h3{letter-spacing:-.025em}
.choice{position:relative;min-height:72px;align-items:center;padding:var(--sp-5);background:var(--bg-2);border:var(--bw-1-5) solid var(--line);border-radius:var(--r-md);color:var(--text-1);box-shadow:none}
.choice span{color:var(--text-1);font-size:var(--fs-body);line-height:1.45}
.choice b{width:var(--control-sm);height:var(--control-sm);font-size:var(--fs-sm);background:var(--peri-soft);color:var(--indigo)}
.choice:hover{background:var(--bg-3)}
.choice-active,.choice[aria-pressed=true]{position:relative;background:linear-gradient(135deg,var(--accent-soft),var(--peri-soft));border-color:transparent;color:var(--text-1)}
.choice-active b,.choice[aria-pressed=true] b{background:var(--accent);color:var(--bg-2);box-shadow:none}
.choice-active span,.choice[aria-pressed=true] span{color:var(--text-1)}
@media(min-width:700px) and (max-width:1100px){.question-card .grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}}
.q-next{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-5);flex-wrap:wrap;margin-top:var(--sp-4);background:var(--accent-soft);border-color:var(--accent-line)}
.q-next-body{min-width:0;flex:1 1 320px}
.q-next-body h3{margin:0 0 var(--sp-2)}
.q-next-btn{flex:0 0 auto}
.questionnaire-description{margin-top:var(--sp-2)}
.questionnaire-actions{margin-top:var(--sp-4)}
.q-hint{margin-top:var(--sp-3);padding:var(--sp-3) var(--sp-4);border-radius:var(--r-md);background:var(--accent-soft);border:var(--bw-1) solid var(--accent-line);color:var(--text-2);font-size:var(--fs-sm);line-height:1.5}
.card .card{box-shadow:none}.profile-switch{gap:var(--sp-2)}.brand-button{width:100%;border:0;background:transparent;color:inherit;text-align:left;cursor:pointer}.brand-button:hover{transform:translateY(-1px)}
@media(max-width:900px){.choice-active span{padding-right:0}.choice-active:after{position:static;margin-left:auto}}@media(max-width:699px){.choice{min-height:auto;padding:var(--sp-4)}.question-card .card-head{display:flex;align-items:flex-start;gap:var(--sp-3)}.question-card .card-head>div{min-width:0;flex:1 1 auto}.question-card .card-head .btn{width:auto;min-width:128px;min-height:48px;padding-inline:var(--sp-4);margin:0;white-space:nowrap;flex:0 0 auto}}@media(prefers-reduced-motion:reduce){.view-enter{animation:none!important}.btn-primary::after{display:none}}


/* Мини-профиль при первом создании профиля */
.profile-start-card{max-width:760px;margin:0 auto;padding:clamp(var(--sp-6),4vw,var(--sp-8))}
.profile-start-head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--sp-5);margin-bottom:var(--sp-6)}
.profile-start-head h2{font-family:var(--font-display);font-size:var(--fs-page-title);line-height:var(--lh-tight);margin:0}
.profile-start-head p{margin-top:var(--sp-2);max-width:560px}
.profile-start-badge{display:inline-flex;align-items:center;gap:var(--sp-2);padding:var(--sp-2) var(--sp-3);border-radius:var(--r-pill);background:var(--accent-soft);color:var(--accent);font-weight:700;font-size:var(--fs-xs);white-space:nowrap}
.profile-start-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-4);margin-top:var(--sp-5)}
.profile-start-grid label:first-child{grid-column:1/-1}
.profile-start-actions{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);margin-top:var(--sp-6);flex-wrap:wrap}
.profile-start-actions .btn{height:52px;min-height:52px;padding-inline:var(--sp-6)}
.profile-start-note{font-size:var(--fs-sm);color:var(--text-2);line-height:var(--lh-body);max-width:420px}
.profile-start-modal{position:fixed;inset:0;z-index:var(--z-modal);display:flex;align-items:center;justify-content:center;padding:var(--sp-6);isolation:isolate}
.profile-start-backdrop{position:absolute;inset:0;background:color-mix(in srgb,var(--text-1) 52%,transparent);backdrop-filter:blur(var(--sp-2));-webkit-backdrop-filter:blur(var(--sp-2))}
.profile-start-dialog{position:relative;z-index:1;width:min(760px,100%);max-height:calc(100vh - 44px);overflow:auto;box-shadow:var(--shadow-lg)}
@media(max-width:699px){.profile-start-card{margin:0}.profile-start-head{display:block}.profile-start-badge{margin-top:var(--sp-4)}.profile-start-grid{grid-template-columns:1fr}.profile-start-actions .btn{width:100%}}

/* index: pair-v12-design-polish */
/* ============================================================
   v12 DESIGN POLISH — только визуальный слой, последним в каскаде.
   Логика, разметка, JS, API, БД не затронуты.
   Шрифты · ритм карточек · акценты.
   ============================================================ */

/* --- 1. Характерная типографика (токены — в базовом :root) --- */
body{ font-family: var(--font-ui); letter-spacing: -0.005em; }
.pair-code, .mono{ font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
.metric-value{ font-variant-numeric: tabular-nums; }

/* --- 2. Ритм и карточки --- */
.view, main .view{ padding: clamp(var(--sp-5), 4vw, var(--sp-7)); }
.stack-lg > * + *{ margin-top: var(--sp-6); }

/* --- 3. Акценты и фон --- */
body{
  background:
    radial-gradient(1000px 560px at 84% -12%, var(--accent-soft), transparent 64%),
    radial-gradient(800px 480px at -10% 100%, var(--b-soft), transparent 60%),
    var(--bg-1);
}
.brand-mark{
  font-family: var(--font-display);
  background: linear-gradient(135deg, var(--a), var(--b));
  box-shadow:var(--shadow-glow);
}
.nav a.active{ box-shadow: inset 2px 0 0 var(--accent); }

/* плавное появление контента view */
.view-enter{ animation: pisIn var(--dur) var(--ease-out) both; }
@keyframes pisIn{ from{ opacity:0; transform: translateY(8px);} to{ opacity:1; transform:none; } }

/* Force collapse header nav on small screens to avoid overflow */
@media (max-width:699px){
  /* Скрываем только навигацию лендинговой/верхней шапки.
     НЕ трогаем .sidebar .nav и .sidebar .brand, иначе в кабинете
     гамбургер открывает пустое боковое меню. */
  header .nav, header .navlinks, header .navright { display: none; }

  header .lp-mnav-btn, header .mobile-bar,
  .topbar .mobile-bar { display: flex; }

  /* Бренд скрываем только в верхней шапке/лендинге, не в sidebar кабинета. */
  header .brand, header .brand-button { display: none; }
}

/* ---- ГОСТЬ: меню не нужно, скрываем навигацию ---- */
body.guest .sidebar{ display:none; }
body.guest .app{ grid-template-columns:1fr; }
body.guest .mobile-bar{ display:none; }
body.guest .profile-switch{ display:none; }
body.guest .topbar-crumb,
body.guest .topbar-title{ display:none; }
/* топбар у гостя — лёгкая прозрачная шапка только с брендом */
body.guest .topbar{ justify-content:flex-start; }
body.guest .topbar::before{
  content:"Pair Studio"; font-family:var(--font-display); font-weight:560; font-size:var(--fs-modal-title); color:var(--text-1);
}


.tr-avoid{ display:flex; flex-direction:column; gap:var(--sp-2); margin-top:var(--sp-2); }
.tr-avoid .a{ display:flex; align-items:center; gap:var(--sp-3); padding:var(--sp-3) var(--sp-4); border-radius:var(--r-md); background:var(--err-soft); border:var(--bw-1) solid transparent; color:var(--text-1); font-size:var(--fs-sm); }
.tr-avoid .a .x{ width:20px;height:20px;border-radius:50%;background:var(--err);color:var(--bg-2);display:grid;place-items:center;font-size:var(--fs-xs);flex:none; }

/* index: pair-compat */
.cmp-score-text{ flex:1; min-width:260px; color:var(--text-2); }
.cmp-score-text b{ display:block; color:var(--text-1); font-size:var(--fs-card-subtitle); margin-bottom:var(--sp-1); }
.cmp-score-text p{ margin:0 0 var(--sp-2); font-size:var(--fs-sm); line-height:1.5; }
.cmp-score-text small{ display:block; color:var(--text-3); font-size:var(--fs-xs); line-height:1.45; }

/* index: pair-ai-analysis */
.pai-spin{ display:inline-block;vertical-align:middle;width:16px;height:16px;border-radius:50%;border:var(--bw-1-5) solid var(--accent-line);border-top-color:var(--accent);animation:paiSpin .8s linear infinite;will-change:transform; }
@keyframes paiSpin{ to{transform:rotate(360deg)} }
.pai-elapsed{ vertical-align:middle; }
.ai-rate-toast{ position:fixed; left:50%; bottom:24px; transform:translateX(-50%); z-index:120; max-width:min(420px,calc(100vw - 32px)); display:grid; gap:var(--sp-2); padding:var(--sp-5) var(--sp-5); border-radius:var(--r-lg); background:var(--bg-2); border:var(--bw-1) solid var(--accent-line); box-shadow:var(--shadow-md); color:var(--text-2); font-size:var(--fs-sm); line-height:1.5; cursor:pointer; animation:aiRateIn .25s var(--ease-out) both; }
.ai-rate-toast b{ color:var(--text-1); }
.ai-rate-toast .ai-rate-clock{ color:var(--accent); font-variant-numeric:tabular-nums; }
@keyframes aiRateIn{ from{ opacity:0; transform:translate(-50%,10px); } to{ opacity:1; transform:translate(-50%,0); } }

/* index: pair-translator-ui */
/* ===== Перевод смысла — чистый ввод ===== */
.tx-hero{ padding:clamp(var(--sp-5),3vw,var(--sp-6)); }
.tx-phrase{ width:100%; height:58px; box-sizing:border-box; font-size:var(--fs-body); line-height:1.5; padding:var(--sp-4) var(--sp-5);
  background:var(--bg-2); border:var(--bw-1-5) solid var(--line); border-radius:var(--r-md); color:var(--text-1); }
.tx-phrase:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft); }
.tx-compose{display:flex;align-items:stretch;gap:var(--sp-3)}
.tx-compose .tx-phrase{flex:1;min-width:0}
.tx-compose .btn{flex:none;min-width:220px}
/* примеры лентой */
.tx-ex{ margin-top:var(--sp-5); }
.tx-ex-h{ display:flex; align-items:center; justify-content:space-between; margin-bottom:var(--sp-3); }
.tx-ex-h b{ font-size:var(--fs-xs); color:var(--text-2); } .tx-ex-h span{ font-size:var(--fs-xs); color:var(--text-3); }
.tx-topics{ display:flex; flex-wrap:wrap; gap:var(--sp-2); margin-bottom:var(--sp-3); }
@media(max-width:600px){
 .tx-phrase{ font-size:var(--fs-body); height:54px; padding:var(--sp-4) var(--sp-5); }
 .tx-compose{display:block}.tx-compose .btn{width:100%;margin-top:var(--sp-3)}
 #aiStatus{ width:100%; text-align:center; }
}

/* index: pair-global-compact */
/* ============================================================
   ГЛОБАЛЬНЫЙ COMPACT-СЛОЙ — последний в каскаде.
   Унифицирует ритм и делает весь сайт компактнее.
   Только визуал, логику/разметку не трогает.
   Компактная шкала отступов/радиусов/заголовков — в базовом :root.
   ============================================================ */
/* рабочая область уже и плотнее */
.view{ max-width: 1240px; padding: clamp(16px, 2.2vw, 32px) clamp(16px, 3vw, 40px); }
/* единый ритм вертикальных стеков */
.stack > * + *{ margin-top: var(--sp-3); }
.stack-lg > * + *{ margin-top: var(--sp-5); }
.grid{ gap: var(--sp-4); }
/* единые кнопки — чуть компактнее */
.btn:not(.btn-icon){ padding:var(--sp-3) var(--sp-5); }
.btn-sm:not(.btn-icon){ padding:var(--sp-2) var(--sp-3); }
section.view-enter > header.stack-sm{ margin-bottom: var(--sp-4); }
/* поля ввода — единая высота */
.input, .select{ padding:var(--sp-3) var(--sp-4); }
.textarea{ padding:var(--sp-3) var(--sp-4); }
/* таблицы и списки плотнее */
.item{ padding:var(--sp-3) var(--sp-3); }
/* метрики единообразно */
.metric-value{ font-size: var(--fs-h1); }

/* index: tr-localnote-css */
.tr-local-note{margin:var(--sp-3) 0 0;padding:var(--sp-3) var(--sp-4);border-radius:var(--r-md);background:var(--warn-soft);border:var(--bw-1) solid var(--warn);color:var(--text-1);font-size:var(--fs-sm);line-height:1.45}

/* index: tr-simple-css */
.tr-orig{font-size:var(--fs-card-subtitle);color:var(--text-2);font-style:italic}.tr-hero{margin-top:var(--sp-3);padding:var(--sp-5) var(--sp-5) var(--sp-5) var(--sp-6);border-radius:var(--r-lg);background:var(--bg-3);border:var(--bw-1) solid var(--line-soft);border-left:var(--bw-1-5) solid var(--line);box-shadow:none}.tr-hero-lbl{font-weight:700;font-size:var(--fs-xs);margin-bottom:var(--sp-2);letter-spacing:.04em;text-transform:uppercase}.tr-hero-txt{font-size:var(--fs-body);line-height:1.5;color:var(--text-1)}.tr-hero-meaning{border-left-color:var(--indigo)}.tr-hero-meaning .tr-hero-lbl{color:var(--indigo)}.tr-hero-reply{border-left-color:var(--accent)}.tr-hero-reply .tr-hero-lbl{color:var(--coral-d)}.tr-rate{margin-top:var(--sp-5);display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-3)}.tr-rate-q{font-weight:600;font-size:var(--fs-sm);color:var(--text-1)}.tr-rate-done{font-size:var(--fs-xs);color:var(--ok);font-weight:600}
.tx-dir2{margin:var(--sp-2) 0 var(--sp-4);display:flex;flex-direction:column;gap:var(--sp-2)}
.tx-seg{display:inline-flex;gap:var(--sp-1);background:var(--bg-3);border:var(--bw-1-5) solid var(--line);border-radius:var(--r-md);padding:var(--sp-1);width:fit-content;max-width:100%}
.tx-seg-opt{border:0;background:transparent;color:var(--text-2);border-radius:var(--r-md);padding:var(--sp-3) var(--sp-5);cursor:pointer;font:500 var(--fs-sm)/1 var(--font-ui);display:inline-flex;align-items:center;gap:var(--sp-2);transition:background .2s,color .2s,box-shadow .2s}
.tx-seg-opt .arr{color:var(--text-3);font-weight:700;transition:color .2s}
.tx-seg-opt:hover{color:var(--text-1)}
.tx-seg-opt.active{position:relative;background:var(--bg-2);color:var(--text-1);box-shadow:var(--shadow-sm)}
.tx-seg-opt.active .arr{color:var(--accent)}
@media(max-width:520px){.tx-seg{width:100%}}

/* index: tr-font-unify-css */
/* Единый масштаб шрифтов в блоке разбора фразы: один размер для подписей, один для текста */
#resultBlock .tr-orig span,
#resultBlock .tr-hero-lbl,
#resultBlock .tr-rate-q,
#resultBlock .field-label{
  font-size:var(--fs-xs);
  font-weight:700;
  letter-spacing:.05em;
  text-transform:uppercase;
  color:var(--text-3);
  line-height:1.4;
}
#resultBlock .tr-orig b,
#resultBlock .tr-hero-txt,
#resultBlock .tr-avoid .a{
  font-size:var(--fs-card-subtitle);
  line-height:1.6;
  font-weight:500;
  color:var(--text-1);
  text-transform:none;
  letter-spacing:normal;
}

/* index: acc-row-css */
.acc-row{display:flex;align-items:flex-end;gap:var(--sp-4);flex-wrap:wrap}
.acc-row+.acc-row{margin-top:var(--sp-6)}
.acc-row label{flex:1 1 180px;min-width:0;display:block}
.acc-row label input{width:100%}
.acc-row .btn{flex:0 0 auto;white-space:nowrap;margin-top:0}
@media(max-width:699px){.acc-row{flex-direction:column;align-items:stretch}.acc-row label{flex:none}.acc-row .btn{width:100%}}

.tx-history-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-5);margin-top:var(--sp-5)}
.tx-history-grid>.card{min-width:0}
.cab-panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--sp-3);margin-bottom:var(--sp-4)}
.cab-panel-head>div{min-width:0}
.cab-panel-head h3{margin:0;color:var(--text-1)}
.cab-panel-head p{margin:var(--sp-1) 0 0;color:var(--text-2);font-size:var(--fs-body);line-height:1.45}
.tx-hist-all{display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-1);flex:none;min-height:36px;padding:var(--sp-2) var(--sp-3);border:var(--bw-1) solid var(--line);border-radius:var(--r-md);background:var(--bg-2);color:var(--text-2);font:700 var(--fs-xs)/1 var(--font-ui);white-space:nowrap;cursor:pointer;transition:color var(--dur) var(--ease),border-color var(--dur) var(--ease),background var(--dur) var(--ease)}
.tx-hist-all:hover{color:var(--accent);border-color:var(--accent-line);background:var(--accent-soft)}
.tx-hist-all svg{flex:none}
.pair-memory-list,.pair-history-list{display:grid;gap:var(--sp-2)}
.tx-hist-dot{width:8px;height:8px;border-radius:50%;background:var(--line-strong);flex:none}
.tx-hist-dot.ok{background:var(--ok)}
.tx-hist-dot.warn{background:var(--warn)}
.tx-hist-date,.tx-hist-score{color:var(--text-3);font-size:var(--fs-xs);white-space:nowrap}
.tx-hist-score{font-weight:700}
.tx-hist-score.ok{color:var(--ok)}
.tx-hist-chev{color:var(--text-3);flex:none}
.pair-memory-item{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:var(--sp-2);row-gap:var(--sp-1);align-items:start}
.pair-memory-item .tx-hist-dot{margin-top:var(--sp-2)}
.pair-memory-text{min-width:0}
.pair-memory-text p{margin:0;color:var(--text-2);line-height:1.5;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.pair-memory-item.expanded .pair-memory-text p{display:block;overflow:visible}
.pair-memory-more{display:inline-flex;align-items:center;gap:var(--sp-1);margin-top:var(--sp-2);padding:0;border:0;background:none;color:var(--accent);font:700 var(--fs-xs)/1.2 var(--font-ui);cursor:pointer}
.pair-memory-more svg{transition:transform var(--dur) var(--ease)}
.pair-memory-item.expanded .pair-memory-more svg{transform:rotate(180deg)}
.pair-memory-item .tx-hist-date{grid-column:2}
.pair-history-item{width:100%;color:var(--text-1);font:inherit;text-align:left;display:grid;grid-template-columns:auto minmax(0,1fr) auto;column-gap:var(--sp-2);row-gap:var(--sp-1);align-items:center;cursor:pointer;transition:border-color var(--dur) var(--ease),background var(--dur) var(--ease)}
.pair-history-item .tx-hist-dot{grid-column:1;grid-row:1/3}
.pair-history-item b{grid-column:2;grid-row:1;min-width:0;overflow-wrap:anywhere;line-height:1.35}
.pair-history-item .tx-hist-date{grid-column:2;grid-row:2}
.pair-history-item .tx-hist-chev{grid-column:3;grid-row:1}
.pair-history-item .tx-hist-score{grid-column:3;grid-row:2}
.pair-history-item:hover{border-color:var(--accent-line);background:var(--bg-2)}
.pair-empty-small{padding:var(--sp-5)}
.pair-empty-small b{display:block;color:var(--text-1);margin-bottom:var(--sp-1)}
.pair-empty-small p{margin:0 0 var(--sp-3);color:var(--text-2);font-size:var(--fs-xs)}
.cmp-card .card-head{align-items:flex-start}
@media(max-width:699px){.tx-history-grid{grid-template-columns:1fr}.cab-panel-head{align-items:center}.tx-hist-all{min-height:var(--control-sm)}}

/* index: translator-clarity-polish */
.tx-guide{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-3);margin-bottom:var(--sp-4)}
.tx-guide div{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);border:var(--bw-1-5) solid var(--accent-line);border-radius:var(--r-xl);background:var(--bg-2);color:var(--text-2);font-size:var(--fs-xs);box-shadow:var(--shadow-md)}
.tx-guide b{width:24px;height:24px;border-radius:var(--r-md);display:grid;place-items:center;background:var(--accent-soft);color:var(--accent);font-weight:800;flex:none}
.tx-section-label{display:flex;align-items:baseline;justify-content:space-between;gap:var(--sp-3);margin-bottom:var(--sp-3);color:var(--text-1)}
.tx-section-label b{font-size:var(--fs-card-subtitle)}.tx-section-label span{font-size:var(--fs-xs);color:var(--text-3)}

.tr-orig{padding:var(--sp-4) var(--sp-5);margin:var(--sp-3) 0 var(--sp-4)}.tr-orig span{display:block;color:var(--text-3);font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.1em;margin-bottom:var(--sp-2)}.tr-orig b{display:block;color:var(--text-1);font-size:var(--fs-card-subtitle);line-height:1.45;font-weight:560}
.tr-result-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-4)}.tr-hero-lbl{font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.08em}.tr-hero-txt{font-size:var(--fs-body);line-height:var(--lh-body)}
@media(max-width:699px){.tx-guide,.tr-result-grid{grid-template-columns:1fr}.tx-section-label{display:block}.tx-section-label span{display:block;margin-top:var(--sp-1)}}

.tx-progress{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--sp-3);margin-top:var(--sp-5);padding:var(--sp-5);border:var(--bw-1) solid var(--line-soft);border-radius:var(--r-lg);background:var(--bg-3);box-shadow:none}
.tx-progress-step{position:relative;display:grid;justify-items:center;gap:var(--sp-2);min-width:0;text-align:center;color:var(--text-3);font-size:var(--fs-sm)}
.tx-progress-step:not(:last-child)::after{content:"";position:absolute;top:20px;left:calc(50% + 25px);width:calc(100% - 50px);border-top:var(--bw-1-5) dotted var(--line-strong)}
.tx-progress-dot{position:relative;z-index:1;width:40px;height:40px;display:grid;place-items:center;border:var(--bw-1-5) solid var(--line-strong);border-radius:50%;background:var(--bg-2);color:var(--text-3);font-weight:800;font-size:var(--fs-modal-title)}
.tx-progress-caption{white-space:nowrap;line-height:1.3}
.tx-progress-caption b{color:var(--text-2);font-size:var(--fs-sm)}
.tx-progress-caption span{font:inherit;font-variant-numeric:tabular-nums;color:inherit}
.tx-progress-step.is-active .tx-progress-dot{border-color:var(--accent);color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
.tx-progress-step.is-active b{color:var(--text-1)}
.tx-progress-step.is-done .tx-progress-dot{border-color:var(--ok);background:var(--ok);color:var(--bg-2)}
.tx-progress-step.is-done:not(:last-child)::after{border-color:color-mix(in srgb,var(--ok) 55%,transparent)}
.tx-progress-step.is-done .tx-progress-caption b,.tx-progress-step.is-done .tx-progress-caption span{color:var(--ok)}
.tx-progress-step.is-error .tx-progress-dot{border-color:var(--err);color:var(--err)}
.tx-progress-step.is-error .tx-progress-caption b,.tx-progress-step.is-error .tx-progress-caption span{color:var(--err)}
@media(max-width:1100px){
  .tx-hero{padding:var(--sp-5)}
  .tx-section-label{display:block}
  .tx-section-label span{display:block;margin-top:var(--sp-1)}
  .tx-compose .btn{min-width:190px}
  .tx-progress{gap:var(--sp-2);padding:var(--sp-4)}
  .tx-progress-step{font-size:var(--fs-xs)}
  .tx-progress-caption{white-space:normal;line-height:1.25}
  .tx-progress-caption b{font-size:var(--fs-xs)}
  .tx-progress-dot{width:36px;height:36px;font-size:var(--fs-body)}
  .tx-progress-step:not(:last-child)::after{top:18px;left:calc(50% + 22px);width:calc(100% - 44px)}
}
@media(max-width:699px){
  .tx-hero{padding:var(--sp-4)}
  .tx-seg{width:100%;box-sizing:border-box}
  .tx-seg-opt{flex:1;justify-content:center;padding:var(--sp-3) var(--sp-2);font-size:var(--fs-sm);gap:var(--sp-2)}
  .tx-phrase{height:54px;font-size:var(--fs-body);padding:var(--sp-3) var(--sp-4)}
  .tx-compose{display:block}
  .tx-compose .btn{width:100%;margin-top:var(--sp-3)}
  .tx-progress{grid-template-columns:1fr;gap:var(--sp-3);padding:var(--sp-4)}
  .tx-progress-step{grid-template-columns:40px minmax(0,1fr) auto;justify-items:start;align-items:center;text-align:left}
  .tx-progress-caption{white-space:normal}
  .tx-progress-caption b{font-size:var(--fs-xs)}
  .tx-progress-step:not(:last-child)::after{top:44px;left:19px;width:0;height:calc(100% - 4px);border-top:0;border-left:var(--bw-1-5) dotted var(--line-strong)}
}

/* index: site-modal-css */
.site-modal-backdrop{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;padding:var(--sp-6);background:var(--overlay);backdrop-filter:blur(8px)}
.site-modal{width:min(620px,100%);border:var(--bw-1-5) solid var(--line);border-radius:var(--r-xl);background:var(--bg-2);box-shadow:var(--shadow-lg);padding:var(--sp-6);display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--sp-4);color:var(--text-1)}
.site-modal-ico{width:48px;height:48px;border-radius:var(--r-lg);display:grid;place-items:center;background:var(--accent-soft);color:var(--accent);font:800 14px/1 var(--font-ui);letter-spacing:.04em}
.site-modal-body h3{margin:0}
.site-modal-body p{margin:var(--sp-3) 0 0;color:var(--text-2);font-size:var(--fs-body);line-height:1.5}
.site-modal-actions{grid-column:1/-1;display:flex;justify-content:flex-end;gap:var(--sp-3);margin-top:var(--sp-2)}.site-modal-actions .btn{min-width:132px}
.site-modal-info{max-height:82vh;overflow:auto}.site-modal-info .site-modal-body p{margin:var(--sp-3) 0 0}.site-modal-info .site-modal-body p:first-child{margin-top:var(--sp-3)}
@media(max-width:560px){.site-modal{grid-template-columns:1fr;padding:var(--sp-5)}.site-modal-actions{display:grid;grid-template-columns:1fr}.site-modal-actions .btn{width:100%}}

/* Единая типографика кабинета. Источник семейств — tokens.css. */
body:not(.route-home):not(.route-admin){
  font-family:var(--font-ui);
}
body:not(.route-home):not(.route-admin) .display,
body:not(.route-home):not(.route-admin) h1,
body:not(.route-home):not(.route-admin) h2,
body:not(.route-home):not(.route-admin) h3,
body:not(.route-home):not(.route-admin) h4,
body:not(.route-home):not(.route-admin) .cab-name,
body:not(.route-home):not(.route-admin) .cab-name-edit,
body:not(.route-home):not(.route-admin) .cab-panel-head h3,
body:not(.route-home):not(.route-admin) .metric-value{
  font-family:var(--font-display);
}
body:not(.route-home):not(.route-admin) .btn,
body:not(.route-home):not(.route-admin) .input,
body:not(.route-home):not(.route-admin) .select,
body:not(.route-home):not(.route-admin) .textarea,
body:not(.route-home):not(.route-admin) .choice,
body:not(.route-home):not(.route-admin) .choice span,
body:not(.route-home):not(.route-admin) .tx-phrase,
body:not(.route-home):not(.route-admin) .tx-chip,
body:not(.route-home):not(.route-admin) .tr-hero-txt,
body:not(.route-home):not(.route-admin) .pair-history-item{
  font-family:var(--font-ui);
}
body:not(.route-home):not(.route-admin) .mono,
body:not(.route-home):not(.route-admin) .pair-code{
  font-family:var(--font-mono);
}
body:not(.route-home):not(.route-admin) .eyebrow,
body:not(.route-home):not(.route-admin) .field-label,
body:not(.route-home):not(.route-admin) .badge,
body:not(.route-home):not(.route-admin) .nav,
body:not(.route-home):not(.route-admin) .brand-name{
  font-family:var(--font-ui);
}

/* Единые кнопки кабинета. */
body:not(.route-home):not(.route-admin) .btn:not(.btn-icon){
  min-height:42px;
  padding:0 var(--sp-5);
  border-radius:var(--r-md);
  font-family:var(--font-ui);
  font-size:var(--fs-sm);
  font-weight:700;
  line-height:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:var(--sp-2);
  text-decoration:none;
  transform:none;
}
body:not(.route-home):not(.route-admin) .btn:not(.btn-icon):not(.di-ai-action){
  box-shadow:var(--shadow-sm);
}
body:not(.route-home):not(.route-admin) .btn:not(.btn-icon):hover{transform:translateY(-1px);text-decoration:none}
body:not(.route-home):not(.route-admin) .btn-primary:not(.btn-icon){
  background:var(--accent);
  color:var(--bg-2);
  border:var(--bw-1) solid var(--accent);
}
body:not(.route-home):not(.route-admin) .btn-primary:not(.btn-icon):not(.di-ai-action){
  box-shadow:var(--shadow-glow);
}
body:not(.route-home):not(.route-admin) .btn-primary:not(.btn-icon):hover{background:var(--coral-d);border-color:var(--coral-d)}
body:not(.route-home):not(.route-admin) .btn-ghost:not(.btn-icon),
body:not(.route-home):not(.route-admin) .btn-secondary:not(.btn-icon){
  background:var(--bg-2);
  color:var(--text-1);
  border:var(--bw-1) solid var(--line);
  box-shadow:var(--shadow-sm);
}
body:not(.route-home):not(.route-admin) .btn-ghost:not(.btn-icon):hover,
body:not(.route-home):not(.route-admin) .btn-secondary:not(.btn-icon):hover{
  background:var(--accent-soft);
  border-color:var(--accent);
  color:var(--text-1);
}
body:not(.route-home):not(.route-admin) .btn-sm:not(.btn-icon){min-height:38px;padding:0 var(--sp-5);font-size:var(--fs-xs)}
body:not(.route-home):not(.route-admin) .btn-block:not(.btn-icon){width:100%}
@media(max-width:560px){body:not(.route-home):not(.route-admin) .btn:not(.btn-icon){white-space:normal}}

/* index: language selector (кабинет, светлый DOM) */
.sidebar-lang{display:flex}
.lang-select{position:relative;display:inline-block}
.lang-select-btn{font-weight:700;font-size:var(--fs-xs);letter-spacing:.04em;height:var(--control-sm);padding:0 var(--sp-3);display:inline-flex;align-items:center;gap:var(--sp-1);border-radius:var(--r-pill);background:var(--bg-2);color:var(--text-2);border:var(--bw-1) solid var(--line);cursor:pointer;transition:transform var(--dur-fast) ease,border-color var(--dur-fast) ease,color var(--dur-fast) ease;}
.lang-select-btn:hover{border-color:var(--accent-line);color:var(--accent);transform:translateY(-1px)}
.lang-select-caret{flex:none}
.lang-select-menu{position:absolute;bottom:calc(100% + 6px);left:0;min-width:132px;background:var(--bg-2);border:var(--bw-1) solid var(--line);border-radius:var(--r-md);box-shadow:var(--shadow-md);padding:4px;z-index:40;display:flex;flex-direction:column;gap:2px}
.lang-select-menu[hidden]{display:none}
.lang-select-btn[aria-expanded="true"] .lang-select-caret{transform:rotate(180deg)}
:root[dir="rtl"] .lang-select-menu{left:auto;right:0}
.lang-select-opt{all:unset;box-sizing:border-box;display:block;width:100%;padding:var(--sp-2) var(--sp-3);border-radius:var(--r-md);font:500 13px var(--body,inherit);color:var(--text-2);cursor:pointer}
.lang-select-opt:hover{background:var(--accent-soft);color:var(--accent)}
.lang-select-opt.is-current{color:var(--accent);font-weight:700}

/* index: social links */
.sidebar-social-links{display:flex;align-items:center;gap:var(--sp-2);}
.sidebar-social-links a{width:var(--control-sm);height:var(--control-sm);border-radius:var(--r-md);display:grid;place-items:center;background:var(--bg-2);border:var(--bw-1) solid var(--line);color:var(--text-2);font-size:var(--fs-xs);font-weight:760;letter-spacing:.02em;}
.sidebar-social-links svg{width:16px;height:16px;display:block;}
.sidebar-social-links a:hover{border-color:var(--accent-line);color:var(--accent);background:var(--accent-soft);}

/* Единый размер контролов страницы настроек. */
:root{ --settings-control-h:52px; }
#accLogin,#accLoginPass,#pwCurrent,#pwNew,#pwConfirm{
  height:var(--settings-control-h);
  min-height:var(--settings-control-h);
  box-sizing:border-box;
}
button[data-action="change-login"],
button[data-action="change-password"],
button[data-action="export-json"],
button[data-action="import-json"]{
  height:var(--settings-control-h);
  min-height:var(--settings-control-h);
  padding-top:0;
  padding-bottom:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  line-height:1;
}
.referral-code-row{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4)}
.referral-code-row strong{display:block;margin-top:var(--sp-2);font:600 var(--fs-sm)/1.4 var(--font-mono);color:var(--indigo);letter-spacing:0;overflow-wrap:anywhere}
.referral-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:center;width:100%;gap:var(--sp-2)}
.referral-actions .btn{width:100%;min-width:0}
.referral-help{margin:var(--sp-3) 0 0;color:var(--text-2);font-size:var(--fs-sm);line-height:var(--lh-body)}
.referral-meta{display:flex;flex-wrap:wrap;gap:var(--sp-3) var(--sp-6);margin-top:var(--sp-4);color:var(--text-2);font-size:var(--fs-sm)}
.referral-meta b{color:var(--text-1)}
.referral-list{margin-top:var(--sp-4);color:var(--text-2);font-size:var(--fs-sm);line-height:var(--lh-body)}
.referral-entry b{color:var(--text-1)}
.referral-empty{padding:var(--sp-4);border:var(--bw-1) dashed var(--line-strong);border-radius:var(--r-md);color:var(--text-3);font-size:var(--fs-sm);text-align:center}
@media(max-width:980px) and (min-width:700px){
  .referral-code-row{align-items:stretch;flex-direction:column;gap:var(--sp-4)}
  .referral-code-row>div:first-child{min-width:0}
  .referral-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-2)}
  .referral-actions .btn{width:100%;min-width:0;padding:var(--sp-3) var(--sp-3);font-size:var(--fs-xs);white-space:normal}
}
@media(max-width:699px){
  .referral-code-row{align-items:stretch;flex-direction:column}.referral-actions{display:grid;grid-template-columns:1fr}.referral-code-row .btn{width:100%}
  button[data-action="change-login"],button[data-action="change-password"],button[data-action="export-json"],button[data-action="import-json"]{width:100%}
}

/* index: tx-example-answer-style-fix */
/* Примеры в переводчике — стиль как у ответов в опроснике */
.tx-chips{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--sp-3);
}
.tx-chip-group{display:contents}.tx-chip-group[hidden]{display:none}
.tx-chip{
  position:relative;width:100%;min-height:auto;display:flex;align-items:center;
  gap:var(--sp-3);text-align:left;padding:var(--sp-3) var(--sp-4);
  border-radius:var(--r-md);border:var(--bw-1-5) solid var(--line);background:var(--bg-inset);
  color:var(--text-2);box-shadow:none;font-size:var(--fs-body);line-height:1.35;
}
.tx-chip small{
  flex:0 0 auto;display:grid;place-items:center;min-width:var(--control-sm);height:var(--control-sm);
  padding:0 var(--sp-3);border-radius:var(--r-md);margin:0;background:var(--accent-soft);
  color:var(--coral-d);font-size:var(--fs-xs);font-weight:800;line-height:1;
  letter-spacing:.055em;text-transform:uppercase;
}
.tx-chip:hover{
  background:var(--bg-3);color:var(--text-1);transform:translateY(-1px);
}
.tx-chip[aria-pressed="true"],.tx-chip.tx-chip-active{
  background:linear-gradient(135deg,var(--accent-soft),var(--peri-soft));border-color:transparent;color:var(--text-1);
}
.tx-chip[aria-pressed="true"] small,.tx-chip.tx-chip-active small{
  background:var(--accent);color:var(--text-on-accent);
}
@media(max-width:1100px){
  .tx-chips{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:699px){
  .tx-chips{grid-template-columns:1fr}
  .tx-chip{padding:var(--sp-4)}
}

.tx-chip:focus{outline:none}
.tx-chip:focus-visible{
  outline:2px solid var(--accent-line);outline-offset:2px;
}

/* index: mobile-account-two-lines-fix */
@media(max-width:699px){
  .acc-row.acc-login-row,
  .acc-row.acc-password-row{
    display:grid;grid-template-columns:minmax(0,1fr);
    column-gap:var(--sp-3);row-gap:var(--sp-5);align-items:end;
  }
  .acc-row.acc-login-row label,
  .acc-row.acc-password-row label{
    min-width:0;width:100%;flex:none;
  }
  .acc-row.acc-login-row .btn[data-action="change-login"]{
    grid-column:1 / -1;width:100%;
  }
  .acc-row.acc-password-row .btn[data-action="change-password"]{
    grid-column:1 / -1;width:100%;
  }
  .acc-row.acc-login-row .field-label,
  .acc-row.acc-password-row .field-label{
    white-space:normal;
  }
}

/* index: style-2 */
#bootHint{position:fixed;inset:0;z-index:9999;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--sp-5);background:var(--bg-1);font-family:var(--font-ui);text-align:center;padding:var(--sp-6);box-sizing:border-box}
    #bootHint .boot-mark{width:52px;height:52px;border-radius:var(--r-lg);display:grid;place-items:center;background:url('../assets/pair-studio-icon.svg') center/cover no-repeat;color:transparent;box-shadow:0 12px 28px color-mix(in srgb,var(--accent) 28%,transparent)}
    #bootHint .boot-mark svg{display:none}
    #bootHint .boot-title{font-family:var(--font-display);font-size:var(--fs-h2);color:var(--text-1);font-weight:600}
    #bootHint .boot-sub{color:var(--text-2,#585c7a);font-size:var(--fs-sm);max-width:360px;line-height:1.5}
    #bootHint .boot-dots{display:flex;gap:var(--sp-2)}
    #bootHint .boot-dots span{width:6px;height:6px;border-radius:50%;background:var(--accent,#ff6350);opacity:.35;animation:bootPulse 1.1s ease-in-out infinite}
    #bootHint .boot-dots span:nth-child(2){animation-delay:.15s}
    #bootHint .boot-dots span:nth-child(3){animation-delay:.3s}
    @keyframes bootPulse{0%,80%,100%{opacity:.25;transform:scale(.85)}40%{opacity:1;transform:scale(1)}}
    #bootHint.boot-error .boot-mark{background:#fff;border:var(--bw-1-5) solid var(--accent,#ff6350);color:var(--accent,#ff6350)}
    #bootHint .boot-error-text{color:var(--accent,#ff6350);font-size:var(--fs-sm);max-width:420px}
    .api-status-banner{position:sticky;top:0;z-index:1400;display:none;justify-content:center;padding:var(--sp-2) var(--sp-5) 0;opacity:.9}
    .api-status-banner.show{display:flex}
    .api-status-card{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);width:min(720px,100%);padding:var(--sp-2) var(--sp-3);border-radius:var(--r-md);background:color-mix(in srgb,var(--bg-1) 96%,transparent);border:var(--bw-1) solid var(--line-soft);box-shadow:var(--shadow-md);color:var(--text-3)}
    .api-status-title{font-weight:600;font-size:var(--fs-sm);margin-bottom:1px;color:var(--text-2,var(--text-3))}
    .api-status-text{font-size:var(--fs-xs);color:var(--text-3);line-height:1.3;opacity:.85}
    .api-status-action{border:0;border-radius:var(--r-pill);background:var(--peri-soft);color:var(--text-2);padding:var(--sp-2) var(--sp-3);font:600 var(--fs-xs)/1 var(--font-ui);cursor:pointer}
    .api-status-close{border:0;background:transparent;color:var(--text-3);font-size:var(--fs-card-subtitle);cursor:pointer;padding:2px var(--sp-1);opacity:.7}

/* index: lp-retheme */
/* fonts loaded via <link> in <head> (no @import — avoids being stripped by proxies) */
/* Current light theme refinements. */
body,body.route-home,body:not(.route-home):not(.route-admin){
  background:
    radial-gradient(1100px 620px at 84% -12%, var(--peri-soft), transparent 62%),
    radial-gradient(900px 520px at -8% 108%, color-mix(in srgb,var(--accent) 18%,var(--bg-1)), transparent 60%),
    var(--bg-1);
  color:var(--text-1);
  font-family:var(--font-ui);
}
body::before,body::after,body.route-home::before,body.route-home::after,
body:not(.route-home):not(.route-admin)::before{display:none;content:none}
.muted,.text-sm.muted{color:var(--text-3)}


/* Цвет/форма кнопок (btn-primary/secondary/ghost) — вынесены в css/design.css */

/* сайдбар / топбар / навигация */
.app{background:transparent}
html:not(.tg-miniapp) body:not(.route-home):not(.route-admin){
  background:#faf8f5;
  position:relative;
}
html:not(.tg-miniapp) body:not(.route-home):not(.route-admin)::before{
  content:'';
  display:block;
  position:fixed; inset:-5%;
  z-index:0; pointer-events:none;
  filter:blur(150px);
  opacity:.48;
  background:
    radial-gradient(65% 60% at 18% 4%, #D8C8E8 0%, #FFE2D0 35%, transparent 78%),
    radial-gradient(60% 55% at 90% 88%, #FFE2D0 0%, #CFC8EE 30%, transparent 78%),
    radial-gradient(60% 58% at 4% 94%, #C6CCF5 0%, #EFE9FF 32%, transparent 78%),
    radial-gradient(60% 170% at 105% 50%, #C2CBF2 0%, #D8D2F2 50%, transparent 88%);
  animation: bgBlobDrift 34s ease-in-out infinite alternate;
}
@keyframes bgBlobDrift{
  from{ transform:translate(0,0) scale(1); }
  to{ transform:translate(-1.5%,1.5%) scale(1.03); }
}
html:not(.tg-miniapp) body:not(.route-home):not(.route-admin) .app{ position:relative; z-index:1; }
@media(prefers-reduced-motion:reduce){
  html:not(.tg-miniapp) body:not(.route-home):not(.route-admin)::before{ animation:none; }
}
.sidebar{background:color-mix(in srgb,color-mix(in srgb,var(--indigo) 18%,var(--bg-0)) 80%,transparent);border-right:var(--bw-1) solid var(--line);backdrop-filter:blur(8px);box-shadow:none}
.topbar{background:color-mix(in srgb,var(--bg-1) 80%,transparent);border-bottom:var(--bw-1) solid var(--line);backdrop-filter:blur(8px)}
.nav a{color:var(--text-2);border-radius:var(--r-md)}
.nav a:hover{background:var(--bg-2);color:var(--text-1)}
.nav a.active{background:var(--bg-2);color:var(--indigo);box-shadow:inset 3px 0 0 var(--accent)}
.brand-sub{color:var(--text-3)}
.brand-name{color:var(--text-1)}

/* бейджи / чипы */
.badge{background:var(--bg-2);border:var(--bw-1) solid var(--line);color:var(--text-2)}
.score-btn{background:var(--bg-2);border:var(--bw-1-5) solid var(--line);color:var(--text-2)}
.score-btn:hover{border-color:var(--accent)}
.score-btn.chip-active{background:var(--accent);color:var(--text-on-accent);border-color:var(--accent)}

/* полоски-сигналы / метрики */
.bar{background:var(--line)}
.bar span{background:linear-gradient(90deg,var(--accent),var(--indigo))}
.metric-value{color:var(--text-1);font-family:var(--font-display)}
.metric-label{color:var(--text-3)}

/* AI-разбор / переводчик */
.pai-spin{border-color:var(--accent-line);border-top-color:var(--accent)}
/* прочее */
.item{background:var(--bg-2);border-color:var(--line)}
.empty-glyph{ filter:none; }
hr{border-color:var(--line)}
::selection{ background:var(--accent); color:var(--bg-2); }





/* index: pair-login-hint-design */
.login-rule-hint{
  display:block;
  margin-top:var(--sp-2);
  padding:var(--sp-3) var(--sp-3);
  border-radius:var(--r-md);
  border:var(--bw-1) solid var(--line);
  background:var(--bg-3);
  color:var(--text-2);
  font-size:var(--fs-xs);
  line-height:1.42;
  box-shadow:none;
}
.login-rule-hint b{
  display:block;
  margin-bottom:2px;
  font-weight:650;
  color:var(--text-1);
}
.login-rule-hint small{display:block;color:var(--text-3);font-size:var(--fs-xs);line-height:1.38}
.input.login-rule-error{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft);background:var(--bg-2)}

/* index: mobile-sidebar-foot-raise-fix */
@media (max-width: 699px){
  .sidebar{
    justify-content:flex-start;
    gap:var(--sp-4);
    overflow-y:auto;
    padding-bottom:calc(18px + env(safe-area-inset-bottom,0px));
  }
  .sidebar-foot{
    margin-top:var(--sp-5);
    padding-top:var(--sp-3);
    border-top:var(--bw-1) solid var(--line);
    gap:var(--sp-3);
  }
  .sidebar-foot .btn[data-action="logout"]{
    width:100%;
    min-height:52px;
  }
}

/* index: style-4 */

body:not(.route-home) .sidebar .brand {
  display:flex;
  align-items:center;
  gap:var(--sp-3);
}

body:not(.route-home) .sidebar .brand .brand-mark {
  width:44px;
  height:44px;
}

body:not(.route-home) .app .btn {
  font-family:var(--font-ui);
}

body:not(.route-home) .app .nav a {
  display:flex;
}

body:not(.route-home) .app .topbar {
  position:sticky;
}

body:not(.route-home) .lp-page {
  display:none;
}

/* ============================================================
   FINAL MOBILE CABINET FIX
   Исправляет огромный верхний отступ и возвращает мобильное меню.
   Этот блок должен оставаться самым последним в файле.
   ============================================================ */

@media (max-width: 699px) {
  body:not(.route-home):not(.route-admin) .app {
    display: block;
    width: 100%;
    min-height: 100dvh;
  }

  body:not(.route-home):not(.route-admin) .main {
    width: 100%;
    min-width: 0;
    margin: 0;
    padding: 0;
  }

  body:not(.route-home):not(.route-admin) .topbar {
    display: flex;
    position: sticky;
    top: 0;
    z-index: 60;
    min-height: 62px;
    height: auto;
    margin: 0;
    padding: calc(8px + env(safe-area-inset-top, 0px)) 14px 8px;
    align-items: center;
  }

  body:not(.route-home):not(.route-admin) .topbar .mobile-bar,
  body:not(.route-home):not(.route-admin) button[data-open-nav] {
    display: inline-flex;
    visibility: visible;
    opacity: 1;
    /* Размер идентичен гамбургеру лендинга (.lp-mnav-btn: 38×38, radius 14). */
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    padding: 0;
    border-radius:var(--r-md);
    border: var(--bw-1) solid var(--line);
    background: var(--bg-2);
    color: var(--indigo);
    font-size:var(--fs-modal-title);
    line-height: 1;
    align-items: center;
    justify-content: center;
  }

  body:not(.route-home):not(.route-admin) .view {
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding:var(--sp-4) var(--sp-4) 140px;
  }

  body:not(.route-home):not(.route-admin) .sidebar {
    display: flex;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    z-index: 70;
    width: min(82vw, 300px);
    max-width: 300px;
    height: 100dvh;
    min-height: 100dvh;
    margin: 0;
    transform: translateX(-105%);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  body:not(.route-home):not(.route-admin).nav-open .sidebar {
    transform: translateX(0);
  }

  body:not(.route-home):not(.route-admin) .nav-scrim {
    position: fixed;
    inset: 0;
    z-index: 65;
  }

  body:not(.route-home):not(.route-admin) .api-status-banner:not(.show) {
    display: none;
    height: 0;
    min-height: 0;
    padding: 0;
    margin: 0;
  }
}

/* Telegram Mini App: реальная высота вьюпорта Telegram (--tg-vh) надёжнее 100dvh */
html.tg-miniapp body:not(.route-home):not(.route-admin) .app{min-height:var(--tg-vh,100dvh)}
html.tg-miniapp body:not(.route-home):not(.route-admin){overflow-x:hidden}
html.tg-miniapp body:not(.route-home):not(.route-admin) .main,
html.tg-miniapp body:not(.route-home):not(.route-admin) .view{overflow-x:hidden;max-width:100%}
/* В ТГ навигацию «назад/домой» закрывает нативная BackButton — прячем дублирующую кнопку */
html.tg-miniapp .topbar .profile-switch{display:none}
/* Нижняя навигация и действие Telegram: резерв действует только там, где они показаны. */
@media(max-width:1100px){
  html.tg-miniapp body:not(.route-home):not(.route-admin) .view{padding-bottom:calc(var(--tg-bottom-nav-height) + var(--tg-action-reserve) + env(safe-area-inset-bottom,0px))}
}
@media (max-width:699px){
  body:not(.route-home):not(.route-admin) .topbar{display:flex;min-height:72px;padding:10px var(--sp-4)}
  body:not(.route-home):not(.route-admin) .topbar .mobile-bar{display:none}
  body:not(.route-home):not(.route-admin) .topbar .profile-switch{display:none}
  .tg-topbar-brand{width:100%;display:flex;align-items:center;gap:var(--sp-2);min-width:0;}
  .tg-topbar-brand>img{width:38px;height:38px;object-fit:contain;flex:none;}
  .tg-topbar-brand>span{display:flex;flex-direction:column;min-width:0;line-height:1.05;}
  .tg-topbar-brand b{font:700 var(--fs-brand) var(--font-ui);color:var(--text-1);}
  .tg-topbar-brand small{margin-top:var(--sp-1);font:500 var(--fs-caption) var(--font-ui);color:var(--text-3);}
  .tg-topbar-brand .lang-select{flex:none;}
  .tg-topbar-brand .lang-select-btn{height:28px;padding:0 var(--sp-2);background:var(--bg-2);}
  .tg-topbar-brand .lang-select-menu{top:calc(100% + var(--sp-2));bottom:auto;left:auto;right:0;z-index:90;}
  .tg-topbar-social{margin-left:auto;display:flex;align-items:center;gap:var(--sp-1);}
  .tg-topbar-social a{border:var(--bw-1) solid var(--line-strong);color:var(--indigo);font:700 var(--fs-nav) var(--font-ui);text-decoration:none;}
}
@media(max-width:420px){
  .tg-topbar-brand>span small{display:none;}
  .tg-topbar-brand b{font-size:var(--fs-nav);}
}
@media(max-width:350px){.tg-topbar-brand>span{display:none;}}
.tg-bottom-nav{
  position:fixed; left:0; right:0; bottom:0; z-index:80;
  display:grid; grid-template-columns:repeat(5,1fr); gap:2px;
  height:var(--tg-bottom-nav-height); box-sizing:border-box;
  padding:8px 8px calc(8px + env(safe-area-inset-bottom,0px));
  background:var(--surface-glass); border-top:var(--bw-1) solid var(--line);
  -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px);
}
.tg-action-bar{
  position:fixed; left:0; right:0; bottom:var(--tg-bottom-nav-height); z-index:81;
  display:none; padding:var(--sp-1) var(--sp-3) 3px;
  background:var(--surface-glass);
  -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px);
}
.tg-action-bar.is-visible{display:block}
.tg-action-button{
  width:100%; min-height:40px; border:0; border-radius:var(--r-md);
  background:var(--accent); color:var(--bg-2); font:700 var(--fs-sm) var(--font-ui);
  box-shadow:0 8px 20px -12px var(--accent-d); cursor:pointer;
}
.tg-action-button:active{transform:scale(.985);}
.tg-action-bar.tg-action-questionnaire.is-visible{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-2);padding:6px var(--sp-3) var(--sp-1)}
.tg-action-questionnaire .tg-questionnaire-option{min-height:40px;}
.tg-bottom-item{
  min-width:0; height:100%; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:var(--sp-1); border:0;
  border-radius:var(--r-md); background:transparent; color:var(--text-3);
  font:600 var(--fs-caption)/1.1 var(--font-ui); cursor:pointer;
}
.tg-bottom-item .nav-ico{width:21px;height:21px;opacity:.8;flex:none}
.tg-bottom-item span{display:block;width:100%;text-align:center}
.tg-bottom-item.active{background:var(--accent-soft);color:var(--indigo)}
.tg-bottom-item.active .nav-ico{opacity:1;width:21px;height:21px}
.tg-bottom-item[data-route="pairPlus"] .nav-ico{transform:scale(.86)}
body.route-admin .tg-bottom-nav{display:none}
body.route-home .tg-bottom-nav,
body.route-home .tg-action-bar,
body.route-home .tg-questionnaire-picker{display:none}
.tg-questionnaire-picker{position:fixed;left:0;right:0;bottom:var(--tg-bottom-nav-height);z-index:81;display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-2);margin:0;padding:var(--sp-2) var(--sp-3) var(--sp-1);background:color-mix(in srgb,var(--bg-2) 94%,transparent);border-top:var(--bw-1) solid var(--line);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}
.tg-questionnaire-option{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-2);min-height:40px;padding:var(--sp-2) var(--sp-3);border:var(--bw-1) solid var(--line);border-radius:var(--r-md);background:var(--bg-2);color:var(--text-2);font:700 var(--fs-control) var(--font-ui);cursor:pointer}
.tg-questionnaire-option small{font-size:var(--fs-xs);color:var(--text-3);font-weight:600;white-space:nowrap;}
.tg-questionnaire-option.active{background:var(--accent);border-color:var(--accent);color:var(--bg-2);box-shadow:var(--shadow-glow)}
.tg-questionnaire-option.active small{color:var(--bg-2)}
@media(max-width:380px){.tg-questionnaire-picker{grid-template-columns:1fr;}.tg-questionnaire-option{min-height:38px;}}
html.tg-miniapp #bootHint{background:var(--bg-1,#f5f2ec);z-index:9999;}
html.tg-miniapp #bootHint .boot-mark{width:58px;height:58px;border-radius:var(--r-md);box-shadow:0 14px 30px -14px color-mix(in srgb,var(--accent) 55%,transparent);}
html.tg-miniapp #bootHint .boot-title{font-size:var(--fs-h2);}
html.tg-miniapp .api-status-banner{position:fixed;left:10px;right:10px;top:calc(8px + env(safe-area-inset-top,0px));padding:0;z-index:1400;}
html.tg-miniapp .api-status-card{width:100%;border-radius:var(--r-lg);padding:var(--sp-3);background:color-mix(in srgb,var(--bg-3) 97%,transparent);border-color:var(--accent-line);box-shadow:var(--shadow-md)}
html.tg-miniapp .api-status-title{color:var(--text-1);font-size:var(--fs-xs);}
html.tg-miniapp .api-status-text{font-size:var(--fs-xs);line-height:1.4;}
html.tg-miniapp .api-status-action{background:var(--accent);color:var(--bg-2);padding:var(--sp-2) var(--sp-3)}
html.tg-miniapp .api-status-close{font-size:var(--fs-modal-title);}

.tg-auth-overlay{position:fixed;inset:0;z-index:100000;display:flex;align-items:center;justify-content:center;padding:var(--sp-6);background:color-mix(in srgb,var(--bg-1) 96%,transparent);font-family:var(--font-ui);color:var(--text-1);text-align:center}
.tg-auth-card{width:min(360px,100%);background:var(--bg-2);border:var(--bw-1) solid var(--line);border-radius:var(--r-xl);padding:var(--sp-6);box-shadow:var(--shadow-lg)}
.tg-auth-icon{font-size:var(--fs-icon-lg);margin-bottom:var(--sp-3)}
.tg-auth-title{display:block;font:600 var(--fs-modal-title)/1.2 var(--font-display);margin-bottom:var(--sp-2)}
.tg-auth-message{font-size:var(--fs-sm);line-height:var(--lh-body);color:var(--text-2)}
.tg-auth-retry{display:none;margin:var(--sp-5) auto 0;border:0;border-radius:var(--r-md);padding:var(--sp-3) var(--sp-5);background:var(--text-1);color:var(--bg-2);font:600 var(--fs-sm)/1 var(--font-ui);cursor:pointer}
.tg-auth-overlay.is-error .tg-auth-retry{display:inline-flex}
.questionnaire-draft-banner{margin-bottom:var(--sp-5)}
.pair-empty-action{margin-top:var(--sp-5)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .view,
html.tg-miniapp body:not(.route-home):not(.route-admin) .view *{min-width:0;}
html.tg-miniapp body:not(.route-home):not(.route-admin) .view img,
html.tg-miniapp body:not(.route-home):not(.route-admin) .view svg{max-width:100%;}
html.tg-miniapp body:not(.route-home):not(.route-admin) .view h1,
html.tg-miniapp body:not(.route-home):not(.route-admin) .view h2,
html.tg-miniapp body:not(.route-home):not(.route-admin) .view h3,
html.tg-miniapp body:not(.route-home):not(.route-admin) .view h4,
html.tg-miniapp body:not(.route-home):not(.route-admin) .view p,
html.tg-miniapp body:not(.route-home):not(.route-admin) .view .text-sm,
html.tg-miniapp body:not(.route-home):not(.route-admin) .view .muted{
  overflow-wrap:anywhere; word-break:normal;
}
html.tg-miniapp body:not(.route-home):not(.route-admin) .view pre,
html.tg-miniapp body:not(.route-home):not(.route-admin) .view code{
  max-width:100%; white-space:pre-wrap; overflow-wrap:anywhere;
}
html.tg-miniapp body:not(.route-home):not(.route-admin) .view table{display:block; max-width:100%; overflow-x:auto;}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp-heart-widget{width:96px;height:96px;max-width:100%}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp-hero{grid-template-columns:auto 1fr;gap:var(--sp-4);padding:var(--sp-3);text-align:left;align-items:center;border-radius:var(--r-md)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp-hero-art{order:0;min-height:0;justify-content:center}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp-hero-text{order:1}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp-together{display:none}
.pp-hero-title-tg{display:none}
.pp-hero-compact{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp-hero-text:has(.pp-hero-title-tg) .pp-hero-title{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp-hero-title-tg{display:block;font-family:var(--font-display,serif);font-size:var(--fs-h1);line-height:var(--lh-tight);color:var(--text-1);margin:0 0 var(--sp-1)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp-hero-text:has(.pp-hero-title-tg) .pp-hero-sub{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp-hero-compact{display:flex;flex-direction:column;gap:var(--sp-2);margin-top:var(--sp-3)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp-hc-row{display:flex;align-items:center;gap:var(--sp-2);font-size:var(--fs-sm);color:var(--text-1)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp-hc-row:has(.pp-hc-dot){display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp-hc-heart{color:var(--accent);font-size:var(--fs-body)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp-hc-dot{width:8px;height:8px;border-radius:50%;background:var(--ok);flex:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp-heart-img{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp-ava{box-shadow:none;border-width:2px}
html.tg-miniapp body:not(.route-home):not(.route-admin) .view input,
html.tg-miniapp body:not(.route-home):not(.route-admin) .view textarea,
html.tg-miniapp body:not(.route-home):not(.route-admin) .view select{max-width:100%;}
html.tg-miniapp body:not(.route-home):not(.route-admin) .view .card{border-radius:var(--r-md);padding:var(--sp-3);min-width:0;}
html.tg-miniapp body:not(.route-home):not(.route-admin) .view{padding-left:var(--sp-3);padding-right:var(--sp-3);padding-top:var(--sp-2)}
@media (max-width:420px){
  html.tg-miniapp body:not(.route-home):not(.route-admin) .view .grid,
  html.tg-miniapp body:not(.route-home):not(.route-admin) .view .cab-give-grid,
  html.tg-miniapp body:not(.route-home):not(.route-admin) .view .split{grid-template-columns:1fr}
}
@media (max-width: 699px){
  html.tg-miniapp body:not(.route-home):not(.route-admin) .sidebar{
    height:var(--tg-vh,100dvh);min-height:var(--tg-vh,100dvh)
  }
}
/* Профиль: единый спокойный стиль для всех вкладок. */
.cab-give-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-4);}
.cab-give-card-warm{background:var(--accent-soft);border-color:var(--accent-line,var(--line-soft));}
.cab-give-card-title{font-size:var(--fs-card-subtitle);font-family:var(--font-ui);}
.cab-give-card-text{font-size:var(--fs-sm);line-height:var(--lh-body);color:var(--text-2);}

/* Настроение профиля. */
body:not(.route-home):not(.route-admin) .mood-pill{
  --m:var(--accent);
  display:inline-flex;align-items:center;gap:var(--sp-2);
  padding:var(--sp-2) var(--sp-4);
  border-radius:var(--r-pill);
  background:var(--bg-2);
  border:var(--bw-1-5) solid var(--line);
  color:var(--text-2);
  font-size:var(--fs-xs);font-weight:650;
  transition:transform var(--dur-fast) var(--ease),background var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease);
}
body:not(.route-home):not(.route-admin) .mood-pill span{
  font-size:var(--fs-body);line-height:1;transition:transform var(--dur-fast) var(--ease);
}
body:not(.route-home):not(.route-admin) .mood-pill[data-mood="calm"]{--m:var(--mood-calm)}
body:not(.route-home):not(.route-admin) .mood-pill[data-mood="warm"]{--m:var(--mood-warm)}
body:not(.route-home):not(.route-admin) .mood-pill[data-mood="tired"]{--m:var(--mood-tired)}
body:not(.route-home):not(.route-admin) .mood-pill[data-mood="tense"]{--m:var(--mood-tense)}
body:not(.route-home):not(.route-admin) .mood-pill[data-mood="low"]{--m:var(--mood-low)}
@media(hover:hover){
  body:not(.route-home):not(.route-admin) .mood-pill:hover{
    border-color:var(--m);
    background:color-mix(in srgb,var(--m) 8%,var(--bg-2));
    color:var(--text-1);
    transform:translateY(-2px);
    box-shadow:0 10px 20px -14px var(--m);
  }
  body:not(.route-home):not(.route-admin) .mood-pill:hover span{transform:scale(1.14)}
}
body:not(.route-home):not(.route-admin) .mood-pill.on{
  position:relative;
  background:color-mix(in srgb,var(--m) 15%,var(--bg-2));
  border-color:transparent;
  color:var(--text-1);
  box-shadow:0 12px 24px -16px var(--m);
  transform:translateY(-1px);
  font-weight:700;
}
body:not(.route-home):not(.route-admin) .mood-pill.on span{transform:scale(1.14)}

/* Цифровая личность (identity view). */
.di-grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:var(--sp-5);align-items:start}
.di-col{display:flex;flex-direction:column;gap:var(--sp-5);min-width:0}
.di-grid .card h3,.pp-theme-card h3{margin:0 0 var(--sp-4)}

/* hero */
.di-hero{display:flex;gap:var(--sp-5);align-items:flex-start}
.di-profile-main{min-width:0}
.di-ava{width:96px;height:96px;border-radius:var(--r-xl);flex:none;overflow:hidden;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--accent),var(--indigo));color:var(--bg-2);font:600 var(--fs-page-title)/1 var(--font-display);
  box-shadow:var(--shadow-md)}
.di-ava.has-photo{background:var(--bg-2);outline:var(--bw-1-5) solid var(--line);outline-offset:calc(-1 * var(--bw-1-5))}
.di-ava img{width:100%;height:100%;object-fit:cover;display:block}
.di-name{font-family:var(--font-display);font-size:var(--fs-h1);font-weight:600;line-height:var(--lh-tight);color:var(--text-1)}
.di-login{color:var(--text-3);font-size:var(--fs-sm);margin-top:var(--sp-1)}

/* rings */
.di-profile-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}
.di-profile-metric{display:flex;flex-direction:column;align-items:flex-start;gap:var(--sp-1);min-width:0;padding:var(--sp-2) var(--sp-4)}
.di-profile-metric+.di-profile-metric{border-left:var(--bw-1-5) solid var(--line)}
.di-profile-value{font-family:var(--font-display);font-size:var(--fs-h1);font-weight:600;line-height:var(--lh-tight);color:var(--indigo)}
.di-profile-metric b{display:block;color:var(--text-1);font-size:var(--fs-sm)}
.di-profile-metric span{display:block;margin-top:var(--sp-1);color:var(--text-3);font-size:var(--fs-xs);line-height:1.4}

.di-lead{color:var(--text-2);font-size:var(--fs-sm);line-height:var(--lh-body);margin:0}
.di-empty{color:var(--text-3);font-size:var(--fs-sm);line-height:var(--lh-body)}
.di-empty-spaced{margin-bottom:var(--sp-3)}
.di-empty-notes{margin-top:var(--sp-3)}
.di-card-note{margin:0 0 var(--sp-4);color:var(--text-2);font-size:var(--fs-sm);line-height:var(--lh-body)}
.di-card-note-short{display:none;margin:0 0 var(--sp-3);color:var(--text-3);font-size:var(--fs-xs)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-mood-card .di-card-note{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-mood-card .di-card-note-short{display:block}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-mood-card .di-empty-spaced{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-mood-card .mood-row{flex-wrap:nowrap;overflow-x:auto;width:100%;min-width:0;scrollbar-width:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-mood-card .mood-row::-webkit-scrollbar{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-mood-card .mood-pill{flex:0 0 auto}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-mood-card .mood-pill:hover span,
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-mood-card .mood-pill.on span{transform:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-mood-card .mood-pill.on{transform:none;box-shadow:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-mood-card .mood-pill:hover{transform:none;box-shadow:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-mood-card .di-mood-cur{display:none}
.di-notes-add .textarea{min-height:72px;resize:vertical}
.di-notes-add{display:flex;flex-direction:column}
.di-note-add{align-self:flex-end;margin-top:var(--sp-2)}
.di-notes-list{display:flex;flex-direction:column;gap:var(--sp-2);margin-top:var(--sp-4)}
.di-note-item{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--sp-3)}
.di-note-item p{margin:0;font-size:var(--fs-sm);line-height:var(--lh-body);color:var(--text-2)}
.di-note-item .btn-icon{flex:0 0 auto;width:var(--sp-6);height:var(--sp-6);font-size:var(--fs-body);line-height:1}

/* rail */
@media(max-width:1100px){.di-grid{grid-template-columns:1fr}}
@media(max-width:980px){.di-profile-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.di-profile-metric{padding:var(--sp-2) var(--sp-3)}.di-profile-metric:nth-child(3){border-left:0}.di-profile-metric:nth-child(n+3){border-top:var(--bw-1-5) solid var(--line)}}
@media(max-width:699px){.di-profile-metrics{grid-template-columns:1fr}.di-profile-metric,.di-profile-metric+.di-profile-metric{padding:var(--sp-2) var(--sp-1);border-left:0}.di-profile-metric+.di-profile-metric{border-top:var(--bw-1-5) solid var(--line)}}
.di-stat-grid{display:none;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--sp-3)}
.di-stat-tile{background:var(--bg-2);border:var(--bw-1) solid var(--line-soft);box-shadow:var(--shadow-md);border-radius:var(--r-lg);padding:var(--sp-3) var(--sp-2);display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--sp-2)}
.di-stat-ic{width:36px;height:36px;border-radius:var(--r-pill);display:grid;place-items:center}
.di-stat-ic-a{background:var(--accent-soft);color:var(--accent)}
.di-stat-ic-b{background:var(--ok-soft);color:var(--ok)}
.di-stat-ic-c{background:var(--peri-soft);color:var(--indigo)}
.di-stat-ic-d{background:var(--warn-soft);color:var(--warn)}
.di-stat-v{font-family:var(--font-display);font-size:var(--fs-h2);font-weight:600;color:var(--indigo);line-height:var(--lh-tight)}
.di-stat-l{font-size:var(--fs-xs);color:var(--text-3)}
@media(max-width:480px){.di-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
html.tg-miniapp body:not(.route-home):not(.route-admin) .view .di-stats-card{background:none;border:none;box-shadow:none;padding:var(--sp-1) 0}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--sp-2)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-stat-tile{padding:var(--sp-2) var(--sp-1);gap:var(--sp-1)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-stat-ic{width:28px;height:28px}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-stat-ic svg{width:14px;height:14px}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-stat-v{font-size:var(--fs-sm)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-stat-l{font-size:var(--fs-xs);line-height:1.2}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-profile-metrics{display:none}

/* Analysis tabs: stable rhythm, natural height for long text. */
@media(max-width:699px){
  .di-tab{white-space:normal;min-height:44px;padding:var(--sp-2);line-height:1.15;font-size:var(--fs-xs)}
  .di-ai-trigger{gap:var(--sp-3)}
  .di-ai-trigger .di-ai-action{width:100%}
  .di-portrait-text .di-lead{font-size:var(--fs-sm);line-height:var(--lh-body)}
}

/* identity — Этап 2: табы, дельты, уровень, достижения */
.di-tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));align-items:stretch;gap:var(--sp-2);margin-bottom:var(--sp-5)}
.di-tab{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--font-ui);font-size:var(--fs-sm);font-weight:700;color:var(--text-2);background:var(--bg-3);border:var(--bw-1-5) solid var(--line);border-radius:var(--r-md);padding:var(--sp-2) var(--sp-3);cursor:pointer;transition:border-color var(--dur-fast) var(--ease),background var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease)}
.di-tab.on{position:relative;background:var(--accent-soft);border-color:transparent;color:var(--text-1)}
.di-ai-trigger{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);padding:0 0 var(--sp-4);margin-bottom:var(--sp-4);border-bottom:var(--bw-1-5) solid var(--line)}
.di-ai-trigger b{display:block;color:var(--text-1);font-size:var(--fs-sm)}
.di-ai-trigger span:not(.di-ai-action-label){display:block;margin-top:var(--sp-1);color:var(--text-3);font-size:var(--fs-xs);line-height:1.4}
.di-ai-trigger .di-ai-action{min-height:40px;border-radius:var(--r-md);padding:var(--sp-2) var(--sp-4);font-size:var(--fs-sm);font-weight:700;white-space:nowrap}
.di-ai-loading{color:var(--text-2);font-size:var(--fs-xs);white-space:nowrap}
.di-ai-stale{margin:0 0 var(--sp-4);color:var(--text-3);font-size:var(--fs-xs);line-height:1.45}
.di-ai-error{color:var(--err)}
.di-ai-content p{margin:0 0 var(--sp-4)}.di-ai-content p:last-child{margin-bottom:0}
.pp-theme-card .di-ai-trigger,.di-analysis-card .di-ai-trigger{padding-bottom:0;margin-bottom:var(--sp-4);border-bottom:0}
.pp-theme-progress{margin-top:0;margin-bottom:var(--sp-4);padding-bottom:var(--sp-4);border-bottom:var(--bw-1-5) solid var(--line)}
.pp-theme-progress .tx-progress-caption{white-space:normal;max-width:170px}
.pp-theme-progress .tx-progress-caption b{display:block}
.di-analysis-progress{margin-top:0;margin-bottom:var(--sp-4);padding-bottom:var(--sp-4);border-bottom:var(--bw-1-5) solid var(--line)}
.di-analysis-progress .tx-progress-caption{white-space:normal;max-width:170px}
.di-analysis-progress .tx-progress-caption b{display:block}
@media(max-width:980px){.di-tabs{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:980px) and (min-width:700px){.di-ai-trigger{align-items:flex-start;flex-direction:column}}
@media(max-width:699px){.di-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}.di-tab{padding:var(--sp-2);font-size:var(--fs-xs)}.di-ai-trigger{align-items:flex-start;flex-direction:column}.di-ai-trigger .btn{width:100%}.di-ai-loading{white-space:normal}}

/* identity — настроение */
.di-mood-card .mood-row{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin-top:var(--sp-1)}
.di-mood-cur{font-size:var(--fs-sm);font-weight:650;color:var(--text-2);margin-bottom:var(--sp-3)}

/* identity — текстовый портрет вместо графиков */
.di-analysis-card,.pp-theme-card{overflow-anchor:none}
.di-portrait-text{min-height:200px;height:auto;margin-bottom:var(--sp-6);overflow-anchor:none}
.di-portrait-text .cab-portrait-text{font-size:var(--fs-sm);line-height:var(--lh-body);color:var(--text-2);margin:0 0 var(--sp-3)}
.di-portrait-text .cab-portrait-text:last-child{margin-bottom:0}
.di-topic{padding:var(--sp-4) 0;border-bottom:var(--bw-1-5) solid var(--line)}
.di-topic:first-child{padding-top:0}
.di-topic:last-child{border-bottom:0;padding-bottom:0}
.di-topic h4{margin:0 0 var(--sp-1)}
.di-topic .di-lead{margin:0}
@media(max-width:699px){.di-portrait-text{min-height:0}}

/* identity — редактируемая шапка (имя/пол/дата) */
.di-name-edit{font-family:var(--font-display);font-size:var(--fs-h1);font-weight:600;line-height:var(--lh-tight);color:var(--text-1);
  border:var(--bw-1-5) solid transparent;border-radius:var(--r-md);background:transparent;padding:var(--sp-1) var(--sp-2);margin:calc(-1 * var(--sp-1)) calc(-1 * var(--sp-2));max-width:100%;
  transition:border-color var(--dur-fast) var(--ease),background var(--dur-fast) var(--ease)}
.di-name-edit:hover{border-color:var(--line)}
.di-name-edit:focus{outline:none;border-color:var(--accent);background:var(--bg-2)}
.di-fields{display:flex;flex-wrap:wrap;gap:var(--sp-3);margin-top:var(--sp-4)}
.di-field{display:flex;flex-direction:column;gap:var(--sp-1);min-width:0}
.di-flab{font-size:var(--fs-xs);font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--text-3)}
.di-field .select-sm,.di-field .input-sm{height:38px;border:var(--bw-1-5) solid var(--line);border-radius:var(--r-md);background:var(--bg-2);padding:0 var(--sp-3);font-size:var(--fs-sm);max-width:100%}
@media(max-width:480px){.di-fields{flex-direction:column}.di-field{width:100%}.di-field .select-sm,.di-field .input-sm{width:100%}}

/* identity — редактирование фото на аватарке */
.di-ava-wrap{position:relative;flex:none;width:135px;height:135px}
.di-ava-wrap .di-ava{width:135px;height:135px;margin:0;cursor:pointer}
.di-hidden-file{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden;clip:rect(0 0 0 0)}
.di-ava-ov{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:center;padding-bottom:var(--sp-3);
  border-radius:var(--r-md);color:var(--bg-2);font-size:var(--fs-xs);font-weight:700;letter-spacing:.02em;
  background:linear-gradient(180deg,transparent 45%,rgba(20,18,44,.6));opacity:0;transition:opacity var(--dur-fast) var(--ease)}
.di-ava:hover .di-ava-ov,.di-ava:focus-visible .di-ava-ov{opacity:1}
.di-ava-del{position:absolute;top:calc(-1 * var(--sp-1));right:calc(-1 * var(--sp-1));width:var(--sp-6);height:var(--sp-6);border-radius:var(--r-pill);border:var(--bw-1-5) solid var(--line);
  background:var(--bg-2);color:var(--text-3);font-size:var(--fs-body);line-height:1;cursor:pointer;display:grid;place-items:center;
  box-shadow:var(--shadow-sm);transition:color var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease),transform var(--dur-fast) var(--ease);z-index:2}
.di-ava-del:hover{color:var(--err);border-color:var(--err-soft);transform:scale(1.08)}
@media(max-width:560px){.di-ava-wrap,.di-ava-wrap .di-ava{width:84px;height:84px}.di-ava-ov{border-radius:var(--r-xl)}}
.di-ava-cam{display:none;position:absolute;bottom:-2px;right:-2px;width:var(--control-sm);height:var(--control-sm);border-radius:var(--r-pill);border:var(--bw-1-5) solid var(--line);
  background:var(--bg-2);color:var(--indigo);cursor:pointer;align-items:center;justify-content:center;box-shadow:var(--shadow-sm);z-index:2}
.di-ficon{display:none;flex:none;color:var(--text-3);}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-ava-cam{display:flex}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-ava-del,
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-ava-ov{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) header:has(+ .di-grid){display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) header:has(~ .questionnaire-intro){display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) header:has(~ .pp-shell .pp-hero){display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) header:has(~ .tx-guide){display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) header:has(+ .settings-shell){display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .settings-shell{display:flex;flex-direction:column;gap:var(--sp-3)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .settings-shell .settings-section{margin-top:0}
html.tg-miniapp body:not(.route-home):not(.route-admin) .settings-shell .card>.card-head:last-child{margin-bottom:0}
html.tg-miniapp body:not(.route-home):not(.route-admin) .acc-security-card .card-head{margin-bottom:0}
html.tg-miniapp body:not(.route-home):not(.route-admin) .settings-shell .card-head b{font-size:var(--fs-sm)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .referral-code-row{gap:var(--sp-2)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .referral-actions{gap:var(--sp-1)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .referral-actions .btn{min-height:36px;font-size:var(--fs-xs);padding:0 var(--sp-2)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .referral-help{font-size:var(--fs-xs);margin-top:var(--sp-2)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .referral-meta{gap:var(--sp-2) var(--sp-3);margin-top:var(--sp-2);font-size:var(--fs-xs)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .settings-copy{font-size:var(--fs-xs)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .settings-actions .btn{min-height:40px}
html.tg-miniapp body:not(.route-home):not(.route-admin) .sidebar-lang{display:none!important}
.tg-lang-card{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tg-lang-card{display:block}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tg-lang-card .card-head{align-items:center}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tg-lang-tabs{display:flex;gap:var(--sp-1);flex:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tg-lang-tab{flex:none;min-height:var(--control-sm);padding:0 var(--sp-3);border-radius:var(--r-md);border:var(--bw-1-5) solid var(--line-soft);background:var(--bg-3);color:var(--text-2);font-weight:700;font-size:var(--fs-xs);cursor:pointer}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tg-lang-tab.on{background:var(--indigo);border-color:var(--indigo);color:var(--bg-2)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .settings-shell .card{padding:var(--sp-3)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .settings-shell .card-head p{display:none}
.acc-sec-toggle{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .acc-sec-toggle{display:flex;align-items:center;justify-content:center;flex:none;width:var(--control-sm);height:var(--control-sm);border-radius:var(--r-pill);border:var(--bw-1-5) solid var(--line);background:var(--bg-2);color:var(--indigo);cursor:pointer}
html.tg-miniapp body:not(.route-home):not(.route-admin) .acc-sec-body{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .acc-security-card.sec-open .acc-sec-body{display:block;margin-top:var(--sp-3)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .acc-row{display:grid;grid-template-columns:1fr 1fr;align-items:start;gap:var(--sp-2)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .acc-row+.acc-row{margin-top:var(--sp-3);padding-top:var(--sp-3);border-top:var(--bw-1) solid var(--line-soft)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .acc-row label{flex:none;display:flex;flex-direction:column;gap:var(--sp-1);min-width:0}
html.tg-miniapp body:not(.route-home):not(.route-admin) .acc-row .field-label{font-size:var(--fs-xs)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .acc-row .input{height:40px;font-size:var(--fs-sm)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .acc-row .btn{grid-column:1/-1;width:100%;min-height:40px}
html.tg-miniapp body:not(.route-home):not(.route-admin) .settings-shell .settings-copy{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .settings-shell .referral-help{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .settings-shell>.card:last-child>p.text-sm.muted:not(.settings-copy){display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-guide{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-hero{padding:var(--sp-3)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-section-label{display:block;margin-bottom:var(--sp-3)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-section-label>span{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-section-label .tx-dir2{margin:var(--sp-3) 0 0}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-seg{width:100%;box-sizing:border-box}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-seg-opt{flex:1;justify-content:center;padding:var(--sp-2) var(--sp-2);font-size:var(--fs-xs);font-weight:500;gap:4px}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-seg-opt.active{font-weight:600}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-compose .btn{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-compose{padding-bottom:0}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-topics{flex-wrap:nowrap;overflow-x:auto;width:100%;min-width:0;scrollbar-width:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-topics::-webkit-scrollbar{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-topics .chip{flex:0 0 auto;min-height:0;height:var(--control-sm);padding:0 var(--sp-3);font-size:var(--fs-xs);border-radius:var(--r-pill);background:var(--bg-3);border-color:var(--line-soft);transform:none!important}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-topics .chip:hover{transform:none!important}
html.tg-miniapp body:not(.route-home):not(.route-admin) .view .chip:hover,
html.tg-miniapp body:not(.route-home):not(.route-admin) .view .choice:hover,
html.tg-miniapp body:not(.route-home):not(.route-admin) .view .btn:hover,
html.tg-miniapp body:not(.route-home):not(.route-admin) .view .lang-select-btn:hover,
html.tg-miniapp body:not(.route-home):not(.route-admin) .view .pp-hero-btn:hover{transform:none!important}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-topics .chip.chip-active{background:var(--indigo);border-color:var(--indigo);color:var(--bg-2)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-chips{gap:var(--sp-2)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-chip{padding:var(--sp-3);font-size:var(--fs-sm);line-height:1.35;transform:none!important}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-chip small{min-width:26px;height:26px;padding:0 var(--sp-2);font-size:var(--fs-3xs)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-chip:hover{transform:none!important;border-color:var(--line);background:var(--bg-inset);color:var(--text-2)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .cab-panel-head{align-items:center}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-history-grid{gap:var(--sp-3);margin-top:var(--sp-3)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .cab-panel-head p{font-size:var(--fs-xs)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-hist-all{display:flex;align-items:center;gap:2px;flex:none;background:none;border:none;color:var(--accent);font-size:var(--fs-xs);font-weight:700;cursor:pointer;padding:0;white-space:nowrap}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pair-history-list{gap:0}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pair-history-item{grid-template-columns:auto minmax(0,1fr) auto auto auto;align-items:center;gap:var(--sp-2);border:none;border-radius:0;border-bottom:var(--bw-1) solid var(--line-soft);background:none;padding:var(--sp-2) 0}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pair-history-item .tx-hist-dot,html.tg-miniapp body:not(.route-home):not(.route-admin) .pair-history-item b,html.tg-miniapp body:not(.route-home):not(.route-admin) .pair-history-item .tx-hist-date,html.tg-miniapp body:not(.route-home):not(.route-admin) .pair-history-item .tx-hist-score,html.tg-miniapp body:not(.route-home):not(.route-admin) .pair-history-item .tx-hist-chev{grid-column:auto;grid-row:auto}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pair-history-list .pair-history-item:last-child{border-bottom:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pair-history-item b{font-size:var(--fs-sm);font-weight:400;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pair-history-item span{display:inline;background:none;font-size:var(--fs-xs)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-hist-dot{width:7px;height:7px;border-radius:50%;background:var(--line-strong);flex:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-hist-dot.ok{background:var(--ok)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-hist-date{color:var(--text-3);white-space:nowrap}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-hist-score{color:var(--text-3);font-weight:700;white-space:nowrap}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-hist-score.ok{color:var(--ok)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-hist-chev{flex:none;color:var(--text-3)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-hist-dot.warn{background:var(--warn)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pair-memory-list{gap:0}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pair-memory-item{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:start;gap:var(--sp-2);border:none;border-radius:0;border-bottom:var(--bw-1) solid var(--line-soft);background:none;padding:var(--sp-3) 0}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pair-memory-item .tx-hist-date{grid-column:auto;align-self:start;margin-top:2px}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pair-memory-item .tx-hist-dot{margin-top:6px}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pair-memory-list .pair-memory-item:last-child{border-bottom:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pair-memory-text p{margin:0;font-size:var(--fs-sm);white-space:normal;overflow-wrap:anywhere;min-width:0;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pair-memory-item.expanded .pair-memory-text p{-webkit-line-clamp:unset;overflow:visible}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pair-memory-more{display:flex;align-items:center;gap:2px;margin-top:var(--sp-1);background:none;border:none;color:var(--accent);font-size:var(--fs-xs);font-weight:700;cursor:pointer;padding:0}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-progress{grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;padding:var(--sp-3)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-progress-step{grid-template-columns:none;justify-items:center;text-align:center;font-size:var(--fs-2xs);min-width:0;padding:0 2px}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-progress-dot{width:26px;height:26px;font-size:var(--fs-xs)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-progress-caption{white-space:normal;line-height:1.15;overflow-wrap:break-word;word-break:normal;hyphens:none;width:100%}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-progress-caption b{font-size:var(--fs-2xs);display:block}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-progress-caption span{display:block;font-size:var(--fs-2xs);font-variant-numeric:tabular-nums;min-width:44px}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-progress-step:not(:last-child)::after{top:15px;left:calc(50% + 17px);width:calc(100% - 34px);height:0;border-top:2px dotted var(--line-strong);border-left:0}
/* Разбор фразы (resultBlock) — компактный стиль ТГ */
html.tg-miniapp body:not(.route-home):not(.route-admin) #resultBlock{box-shadow:none;border-color:var(--line-soft)}
html.tg-miniapp body:not(.route-home):not(.route-admin) #resultBlock .card-head{margin-bottom:var(--sp-2)}
html.tg-miniapp body:not(.route-home):not(.route-admin) #resultBlock .eyebrow{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) #resultBlock .card-head h3{font-size:var(--fs-sm)}
html.tg-miniapp body:not(.route-home):not(.route-admin) #resultBlock .tr-orig{padding:var(--sp-2) var(--sp-3);margin:var(--sp-2) 0 var(--sp-3)}
html.tg-miniapp body:not(.route-home):not(.route-admin) #resultBlock .tr-orig span{margin-bottom:2px}
html.tg-miniapp body:not(.route-home):not(.route-admin) #resultBlock .tr-orig b{font-size:var(--fs-sm)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tr-result-grid{gap:var(--sp-2)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tr-hero{padding:var(--sp-3);border-left-width:3px}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tr-hero-lbl{font-size:var(--fs-3xs);margin-bottom:var(--sp-1)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tr-hero-txt{font-size:var(--fs-sm)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-result-tabs{padding:var(--sp-3) 0 var(--sp-2);mask-image:linear-gradient(to right,#000 calc(100% - 28px),transparent 100%);-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 28px),transparent 100%)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-result-tabs .di-tab{min-height:var(--control-sm);padding:0 var(--sp-3);font-size:var(--fs-xs)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-fields{gap:var(--sp-2)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-field-lbl{font-size:var(--fs-3xs)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-field-val{font-size:var(--fs-sm)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-feedback-card{padding:var(--sp-3);margin-top:var(--sp-2)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tr-rate{margin-top:0;gap:var(--sp-2)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tr-rate-q{font-size:var(--fs-sm)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-feedback-details summary{padding-top:var(--sp-3);border-top:var(--bw-1) solid var(--line-soft)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-feedback-details summary b{font-size:var(--fs-sm)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-feedback-details summary small{font-size:var(--fs-3xs)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-feedback-body{margin-top:var(--sp-2)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-feedback-fields{gap:var(--sp-2)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-feedback-parts .field-label{font-size:var(--fs-xs)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-feedback-options{gap:var(--sp-1);margin-top:var(--sp-1)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-feedback .checkline{padding:var(--sp-1) var(--sp-2);font-size:var(--fs-xs)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-feedback-comment{margin-top:var(--sp-2)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-feedback-comment .field-label{font-size:var(--fs-xs)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-feedback-comment .textarea{min-height:56px;padding:var(--sp-2) var(--sp-3);font-size:var(--fs-sm)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-feedback-actions{margin-top:var(--sp-2)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-feedback-actions .btn{min-height:40px}
.q-reset-ic{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .questionnaire-intro{padding:var(--sp-3)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .questionnaire-intro h3{font-size:var(--fs-sm)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .questionnaire-description{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .qbar{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp2{padding:var(--sp-3)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp2-head{display:none}
.pp2-title-tg{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp2-title-tg{display:block;font-size:var(--fs-sm);margin:0 0 var(--sp-3)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp2-rail .pp2-grid{grid-template-columns:1fr 1fr;gap:0;margin-top:0}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp2-rail .pp2-box{padding:var(--sp-3);background:none;border:none;border-radius:0}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp2-rail .pp2-box.pp2-box-wide{border-left:var(--bw-1) solid var(--line-soft)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp2-together{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp2-box-head{gap:var(--sp-2);margin-bottom:var(--sp-2)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp2-box-head b:not(.pp2-box-head-tg){display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp2-box-head-tg{display:block;font-size:var(--fs-xs)}
.pp2-box-head-tg{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp2-ico{width:var(--control-sm);height:var(--control-sm)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp2-ico svg{width:16px;height:16px}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp2-date-ico{width:34px;height:34px}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp2-date,
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp2-code{padding:var(--sp-2) var(--sp-3);box-shadow:none;border-color:var(--line-soft)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp2-date input{font-size:var(--fs-sm)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp2-code{min-width:0}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp2-code b{min-width:0;overflow:hidden;text-overflow:ellipsis;letter-spacing:0}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp2-copy{width:24px;height:24px;flex:0 0 auto;background:none;border:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp2-copy svg{width:14px;height:14px}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp2-rail .pp2-two{grid-template-columns:1fr;gap:0}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp2-code b{font-size:var(--fs-sm);letter-spacing:.02em;white-space:nowrap}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp2-members-col{margin-top:var(--sp-4)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp2-label{display:none}
.pp2-label-tg{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp2-members{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp2-member+.pp2-member{border-top:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp2-disc{margin-top:var(--sp-4)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .questionnaire-actions{margin-top:var(--sp-2)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .questionnaire-actions .btn{display:inline-flex;align-items:center;justify-content:center;gap:0;min-height:0;height:28px;width:28px;padding:0;font-size:var(--fs-xs)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .q-reset-ic{display:inline-block}
html.tg-miniapp body:not(.route-home):not(.route-admin) .q-reset-label{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tg-questionnaire-picker{position:static;display:block;grid-template-columns:none;background:none;border-top:none;-webkit-backdrop-filter:none;backdrop-filter:none;padding:0;margin:0 0 var(--sp-3);}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tg-questionnaire-picker.tg-questionnaire-top-row{display:flex;align-items:center;gap:var(--sp-2);min-width:0}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tg-questionnaire-pills{display:flex;flex:1;min-width:0;flex-wrap:nowrap;overflow-x:auto;gap:var(--sp-2);scrollbar-width:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tg-questionnaire-pills::-webkit-scrollbar{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tg-questionnaire-option{flex:0 0 auto;min-height:var(--control-sm);padding:0 var(--sp-3);border-radius:var(--r-pill);font-size:var(--fs-xs);white-space:nowrap}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tg-questionnaire-top-row .questionnaire-actions{flex:none;margin-top:0}
html.tg-miniapp body:not(.route-home):not(.route-admin) .question-card{padding:var(--sp-3)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .question-card .card-head{margin-bottom:var(--sp-2)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .question-card .card-head h3{font-size:var(--fs-sm)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .question-card .card-head p{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .question-card .card-head .btn{min-height:0;height:26px;min-width:0;width:26px;padding:0;font-size:var(--fs-xs);justify-content:center}
.q-clear-ic{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .q-clear-ic{display:inline-block}
html.tg-miniapp body:not(.route-home):not(.route-admin) .q-clear-label{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .question-card .grid-2{display:flex;flex-direction:column;gap:var(--sp-2)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .question-card .choice{min-height:0;padding:var(--sp-2) var(--sp-3);gap:var(--sp-2)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .question-card .choice b{width:22px;height:22px;font-size:var(--fs-xs)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .question-card .choice span{font-size:var(--fs-sm);line-height:1.3}
html.tg-miniapp body:not(.route-home):not(.route-admin) .view .stack-lg > * + *{margin-top:var(--sp-3)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp-shell{gap:var(--sp-3)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp-layout{gap:var(--sp-3)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp-main{gap:var(--sp-3)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-flab{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-ficon{display:inline-flex}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-fields{flex-wrap:nowrap;flex-direction:row}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-field{flex-direction:row;align-items:center;gap:var(--sp-1);width:auto!important}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-field+.di-field{padding-left:var(--sp-3);border-left:var(--bw-1) solid var(--line)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-field .select-sm,
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-field .input-sm{border:none;background:transparent;padding:0;height:auto;width:auto!important;font-size:var(--fs-sm);color:var(--text-1)}

.di-ai-action-ic{display:none}
.di-portrait-more{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-ai-trigger{display:grid;grid-template-columns:1fr auto;column-gap:var(--sp-2);row-gap:var(--sp-1);align-items:center;border-bottom:none;padding-bottom:0;margin-bottom:var(--sp-3)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-ai-trigger>div{display:contents}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-ai-trigger>div b{grid-column:1;grid-row:1;font-size:var(--fs-sm)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-ai-trigger>div>span:not(.di-ai-updated){display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-ai-updated{grid-column:1/3;grid-row:2;color:var(--text-3);font-size:var(--fs-xs);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-ai-trigger .di-ai-action{grid-column:2;grid-row:1;justify-self:end;flex:none;width:auto;background:none;border:none;box-shadow:none;color:var(--accent);padding:0;min-height:0;height:auto;font-size:var(--fs-sm);white-space:nowrap}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-ai-trigger .di-ai-action::after{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-ai-loading{grid-column:2;grid-row:1;justify-self:end}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-ai-action-ic{display:inline-block;margin-right:0;vertical-align:middle}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-ai-action-label{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .card{min-width:0}
/* Принудительно мобильная раскладка каркаса в ТГ — не полагаемся на @media ширину,
   т.к. Telegram WebView иногда репортит layout-viewport шире реального экрана. */
html.tg-miniapp body:not(.route-home):not(.route-admin) .app{display:block!important;width:100%!important}
html.tg-miniapp body:not(.route-home):not(.route-admin) .main{width:100%!important;min-width:0!important;margin:0!important}
html.tg-miniapp body:not(.route-home):not(.route-admin) .sidebar{display:flex!important;position:fixed!important;left:0!important;top:0!important;bottom:0!important;z-index:70!important;width:min(82vw,300px)!important;max-width:300px!important;height:100vh!important;min-height:100vh!important;transform:translateX(-105%)!important;overflow-y:auto!important}
html.tg-miniapp body:not(.route-home):not(.route-admin).nav-open .sidebar{transform:translateX(0)!important}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-grid{display:flex!important;flex-direction:column!important;align-items:stretch!important;grid-template-columns:1fr!important;width:100%!important;min-width:0!important}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-col{display:flex!important;flex-direction:column!important;flex-wrap:nowrap!important;overflow-x:visible!important;width:100%!important;min-width:0!important;gap:var(--sp-3)!important}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-tabs{display:flex;flex-wrap:nowrap;overflow-x:auto;width:100%;min-width:0;gap:var(--sp-2);margin-bottom:var(--sp-3);scrollbar-width:none;mask-image:linear-gradient(to right,#000 calc(100% - 28px),transparent 100%);-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 28px),transparent 100%)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .tx-topics,
html.tg-miniapp body:not(.route-home):not(.route-admin) .tg-questionnaire-pills,
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-mood-card .mood-row{mask-image:linear-gradient(to right,#000 calc(100% - 28px),transparent 100%);-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 28px),transparent 100%)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .score-row{display:flex!important;flex-wrap:nowrap;overflow-x:auto;width:100%;min-width:0;gap:var(--sp-2);scrollbar-width:none;mask-image:linear-gradient(to right,#000 calc(100% - 28px),transparent 100%);-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 28px),transparent 100%)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .score-row::-webkit-scrollbar{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .score-row .score-btn{flex:0 0 auto;width:34px;height:34px;font-size:var(--fs-xs);font-weight:700}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-tabs::-webkit-scrollbar{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-tabs .di-tab{flex:0 0 auto;min-height:0;height:var(--control-sm);max-width:128px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:0 var(--sp-3);font-size:var(--fs-xs);border-radius:var(--r-pill);background:var(--bg-3);border-color:var(--line-soft)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-tabs .di-tab.on{background:var(--indigo);border-color:var(--indigo);color:var(--bg-2)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-portrait-wrap{display:block;border:var(--bw-1) solid var(--line-soft);border-radius:var(--r-lg);padding:var(--sp-3)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-portrait-text{width:100%;margin-bottom:0;min-height:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-portrait-text p{display:inline;margin:0}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-portrait-text .di-ai-content{display:inline}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-portrait-wrap.expanded .di-portrait-text p{display:block;margin:0 0 var(--sp-3)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-portrait-wrap.expanded .di-portrait-text .di-ai-content{display:block}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-portrait-wrap.expanded .di-portrait-text{-webkit-line-clamp:unset;display:block;overflow:visible}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-portrait-more{display:flex;width:100%;margin-top:var(--sp-2);align-items:center;justify-content:flex-end;gap:var(--sp-1);background:none;border:none;color:var(--accent);font-size:var(--fs-xs);cursor:pointer;padding:0}
.di-clearer-more{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-clearer-text{width:100%;min-height:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-clearer-text p{display:inline;margin:0}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-collapsible.expanded .di-clearer-text{-webkit-line-clamp:unset;display:block;overflow:visible}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-collapsible.expanded .di-clearer-text p{display:block;margin:0}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-clearer-more{display:flex;width:100%;margin-top:var(--sp-2);align-items:center;justify-content:flex-end;gap:var(--sp-1);background:none;border:none;color:var(--accent);font-size:var(--fs-xs);cursor:pointer;padding:0}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-collapsible.expanded .di-clearer-more svg{transform:rotate(180deg)}
.di-notes-add-toggle{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-notes-head{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);margin-bottom:var(--sp-3)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-notes-head h3{margin:0;font-size:var(--fs-sm)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-notes-add-toggle{display:inline-flex;align-items:center;gap:var(--sp-1);background:none;border:none;color:var(--accent);font-size:var(--fs-sm);font-weight:700;cursor:pointer;padding:0}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-notes-add-label{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-notes-card .di-card-note,
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-notes-card .di-notes-add{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-notes-card.notes-adding .di-card-note,
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-notes-card.notes-adding .di-notes-add{display:block}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-notes-list{flex-direction:row;flex-wrap:wrap}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-note-item{flex:0 1 auto;width:auto;background:var(--bg-3);border-radius:var(--r-pill);padding:var(--sp-2) var(--sp-3);align-items:center}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-note-item p{font-size:var(--fs-sm)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .di-portrait-wrap.expanded .di-portrait-more svg{transform:rotate(90deg)}

/* --- questionnaire progress bar (как полоса совместимости) --- */
.qbar{margin-top:var(--sp-5)}
.qbar-head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--sp-3);margin-bottom:var(--sp-2)}
.qbar-lab{font-size:var(--fs-xs);letter-spacing:.08em;text-transform:uppercase;color:var(--text-3)}
.qbar-val{font-family:var(--font-display);font-size:var(--fs-modal-title);color:var(--text-1);font-variant-numeric:tabular-nums}
.qbar-track{ height:12px; border-radius:var(--r-pill); background:var(--bg-inset); overflow:hidden; }
.qbar-fill{ display:block; height:100%; border-radius:var(--r-pill);
  background:linear-gradient(90deg,var(--peri),var(--accent));
  transition:width var(--dur-slow) var(--ease); }

/* ===== Пара (new / pairPlus) ===== */
.pp-shell{display:flex;flex-direction:column;gap:var(--sp-6)}
.pp-connect-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-5);align-items:stretch}
.pp-connect-card{display:flex;flex-direction:column;gap:var(--sp-3);padding:var(--sp-6)}
.pp-connect-card .pp2-box-head{margin-bottom:0}
.pp-connect-card p{margin:0;font-size:var(--fs-sm);line-height:var(--lh-body);color:var(--text-2)}
.pp-connect-card .pp2-code,.pp-connect-card .pp-connect-row{margin-top:auto}
.pp-connect-card .pp2-code{padding:var(--sp-3) var(--sp-4)}
.pp-connect-card .pp2-code b{font-size:var(--fs-body);white-space:nowrap}
.pp-connect-card .pp2-copy{width:26px;height:26px}
.pp-connect-card .pp2-copy svg{width:14px;height:14px}
.pp-connect-row{display:flex;gap:var(--sp-3)}
.pp-connect-row .input{flex:1;min-width:0}
.pp-connect-row .btn{flex:0 0 auto;white-space:nowrap}
.pp-connect-input{text-transform:uppercase}
@media(max-width:520px){.pp-connect-row{flex-direction:column}}
@media(max-width:699px){.pp-connect-grid{grid-template-columns:1fr}}
@keyframes pp-rise{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:none; } }
@media (prefers-reduced-motion:reduce){ .pp-hero{ animation:none; } }
/* block 1: hero */
.pp-hero{position:relative;overflow:hidden;display:grid;grid-template-columns:1fr .9fr;gap:var(--sp-6);align-items:center;
  padding:var(--sp-7) var(--sp-5);border-radius:var(--r-xl);border:var(--bw-1-5) solid var(--accent-line);
  animation:pp-rise var(--dur-slow) var(--ease) both;
  background:
    radial-gradient(120% 140% at 85% -20%, color-mix(in srgb,var(--accent) 18%,var(--bg-2)) 0%, transparent 55%),
    radial-gradient(100% 120% at 0% 120%, var(--peri-soft) 0%, transparent 50%),
    var(--bg-2);
  box-shadow:var(--shadow-md); }
.pp-hero-title{ font-family:var(--font-display); font-size:var(--fs-page-title); line-height:var(--lh-tight); color:var(--text-1); margin:0; }
.pp-hero-title em{ font-style:normal; color:var(--accent); }
.pp-hero-sub{ margin:var(--sp-5) 0 0; max-width:46ch; color:var(--text-2); font-size:var(--fs-sm); line-height:var(--lh-body); }
.pp-hero-btn.pp-hero-btn{ margin-top:var(--sp-6); background:var(--bg-2); color:var(--text-1); border:var(--bw-1) solid var(--line);
  border-radius:var(--r-md); padding:var(--sp-3) var(--sp-6); font-weight:600; box-shadow:var(--shadow-sm); }
.pp-hero-btn.pp-hero-btn:hover{ transform:translateY(-1px); border-color:var(--accent-line); }
.pp-hero-art{ position:relative; min-height:200px; display:flex; align-items:center; justify-content:flex-start; gap:var(--sp-5); flex-wrap:wrap; align-self:stretch; }
.pp-heart-widget{ position:relative; width:192px; height:192px; flex:none; display:grid; place-items:center; }
.pp-heart-img{ position:absolute; top:50%; left:50%; width:192px; max-width:100%; height:auto; pointer-events:none;
  filter:drop-shadow(0 22px 44px color-mix(in srgb,var(--accent) 30%,transparent));
  transform:translate(-50%,-50%); animation:pp-float 6s ease-in-out infinite; }
@keyframes pp-float{ 0%,100%{ transform:translate(-50%,-52%) rotate(-1.5deg); } 50%{ transform:translate(-50%,-48%) rotate(1.5deg); } }
.pp-avas{ animation:pp-breathe 6s ease-in-out infinite; }
@keyframes pp-breathe{ 0%,100%{ transform:scale(1); } 50%{ transform:scale(1.035); } }
@media (prefers-reduced-motion:reduce){ .pp-heart-img,.pp-avas{ animation:none; } }
.pp-avas{ position:relative; z-index:1; display:flex; }
.pp-ava{ width:77px; height:77px; border-radius:50%; overflow:hidden; display:grid; place-items:center;
  background:var(--bg-3); border:var(--bw-1-5) solid var(--bg-2); box-shadow:var(--shadow-md);
  font-family:var(--font-display); font-size:var(--fs-page-title); color:var(--text-2); }
.pp-ava:last-child{ margin-left:-19px; }
.pp-ava img{ width:100%; height:100%; object-fit:cover; }
@media (max-width:820px){
  .pp-hero{ grid-template-columns:1fr; text-align:center; padding:var(--sp-7) var(--sp-6); }
  .pp-hero-sub{ margin-left:auto; margin-right:auto; }
  .pp-hero-art{ min-height:210px; order:-1; overflow:hidden; justify-content:center; }
  .pp-heart-img{ width:auto; height:192px; }
  .pp-ava{ width:59px; height:59px; }
}

/* block 2: настройки пары (reuse existing .pair-settings-card style) */
.pp-settings{animation:pp-rise var(--dur-slow) var(--ease) both}
/* block 3: полоса совместимости */
.pp-compat-pct{ font-family:var(--font-display); font-size:var(--fs-page-title); line-height:1; color:var(--accent); font-variant-numeric:tabular-nums; }
.pp-compat-pct small{ font-size:var(--fs-h2); }
.pp-compat-track{ margin-top:var(--sp-5); height:12px; border-radius:var(--r-pill); background:var(--bg-inset); overflow:hidden; }
.pp-compat-fill{ display:block; height:100%; border-radius:var(--r-pill);
  background:linear-gradient(90deg,var(--peri),var(--accent));
  transition:width var(--dur-slow) var(--ease); }

/* pairPlus: hero «Вместе N дней» pill */
.pp-together{ transform:rotate(-2deg);
  display:inline-flex; align-items:center; gap:var(--sp-2); white-space:nowrap;
  font-family:var(--font-hand); font-weight:700; font-size:var(--fs-page-title); line-height:1; color:var(--coral-d); }
.pp-together-heart{ color:var(--accent); font-size:.8em; }
/* pairPlus: block 2 в две колонки, объединённая карточка код+связь */
/* pairPlus block 2 (pp2): референс-раскладка в наших цветах */
.pp2{ padding:var(--sp-7) var(--sp-7); }
.pp2-head h3{ margin:var(--sp-2) 0 0; }
.pp2-sub{ margin:var(--sp-2) 0 0; color:var(--text-2); font-size:var(--fs-sm); line-height:var(--lh-body); }
.pp2-grid{ margin-top:var(--sp-6); display:grid; grid-template-columns:minmax(240px,.8fr) minmax(360px,1.5fr); gap:var(--sp-5); align-items:stretch; }
.pp2-box{ display:flex; flex-direction:column; padding:var(--sp-6); }
.pp2-box-head{ display:flex; align-items:center; gap:var(--sp-4); margin-bottom:var(--sp-5); }
.pp2-box-head b{ font-size:var(--fs-body); color:var(--text-1); }
.pp2-ico{ display:grid; place-items:center; width:46px; height:46px; flex:0 0 auto; border-radius:var(--r-md);
  background:var(--accent-soft); color:var(--accent); }
.pp2-ico svg{ width:22px; height:22px; }
.pp2-ico-alt{ background:var(--peri-soft); color:var(--indigo); }
/* дата */
.pp2-date{ display:flex; align-items:center; gap:var(--sp-4); padding:var(--sp-3) var(--sp-5); background:var(--bg-2);
  border:var(--bw-1-5) solid var(--line); border-radius:var(--r-md); cursor:pointer; }
.pp2-date:hover{ border-color:var(--accent-line); }
.pp2-date-ico{ display:grid; place-items:center; width:40px; height:40px; flex:0 0 auto; border-radius:var(--r-md); background:var(--accent-soft); color:var(--accent); }
.pp2-date-ico svg{ width:20px; height:20px; }
.pp2-date input, .pp2-date input[type=date]{flex:1 1 auto;min-width:0;cursor:pointer;
  border:0;background:transparent;border-radius:0;box-shadow:none;padding:0;
  -webkit-appearance:none; appearance:none; outline:none;
  font-family:var(--font-ui);font-size:var(--fs-modal-title);font-weight:650;
  font-variant-numeric:tabular-nums;letter-spacing:-.01em;color:var(--text-1)}
.pp2-date input:focus,.pp2-date input[type=date]:focus{outline:none;box-shadow:none;border:0}
.pp2-date input::-webkit-datetime-edit{ padding:0;font-family:var(--font-ui);font-variant-numeric:tabular-nums; }
/* скрыть нативную иконку календаря, но оставить клик по всему полю */
.pp2-date input::-webkit-calendar-picker-indicator{ position:absolute; inset:0; width:100%; height:100%; margin:0; padding:0; opacity:0; cursor:pointer; }
.pp2-date{ position:relative; }
.pp2-together{ display:flex; align-items:center; gap:var(--sp-2); margin-top:var(--sp-5); font-size:var(--fs-sm); color:var(--text-2); }
.pp2-together-heart{ color:var(--accent); }
/* код + связь */
.pp2-two{ display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-6); align-items:stretch; }
.pp2-col{ display:flex; flex-direction:column; }
.pp2-disc{margin-top:auto}
.pp2-label{ font-size:var(--fs-xs); font-weight:600; color:var(--text-2); margin-bottom:var(--sp-3); }
.pp2-code{ display:flex; align-items:center; justify-content:space-between; gap:var(--sp-3); width:100%;
  padding:var(--sp-5) var(--sp-5); border-radius:var(--r-md); cursor:pointer; background:var(--bg-2); border:var(--bw-1) solid var(--line); }
.pp2-code b{ font-size:var(--fs-h2); letter-spacing:.08em; color:var(--text-1); }
.pp2-copy{ display:grid; place-items:center; width:38px; height:38px; flex:0 0 auto; border-radius:var(--r-md); background:var(--bg-3); color:var(--text-2); }
.pp2-copy svg{ width:18px; height:18px; }
.pp2-code:hover{ border-color:var(--accent-line); }
.pp2-members{ display:flex; flex-direction:column; }
.pp2-member{ display:flex; align-items:center; gap:var(--sp-3); padding:var(--sp-3) 0; }
.pp2-member + .pp2-member{ border-top:var(--bw-1) solid var(--line-soft); }
.pp2-member .pp2-ava{ width:44px; height:44px; flex:0 0 auto; border-radius:50%; overflow:hidden; display:grid; place-items:center;
  background:var(--bg-2); border:var(--bw-1) solid var(--line-soft); font-family:var(--font-display,serif); color:var(--text-2); }
.pp2-member .pp2-ava img{ width:100%; height:100%; object-fit:cover; }
.pp2-member b{ display:block; font-size:var(--fs-card-subtitle); color:var(--text-1); }
.pp2-member span{ font-size:var(--fs-xs); color:var(--text-3); }
.pp2-disc{ display:flex; align-items:center; justify-content:center; gap:var(--sp-3); width:100%; margin-top:var(--sp-5);
  padding:var(--sp-4); border-radius:var(--r-md); cursor:pointer; font-weight:600; font-size:var(--fs-card-subtitle);
  background:var(--bg-2);color:var(--accent);border:var(--bw-1) solid var(--accent-line);transition:background var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease)}
.pp2-disc svg{ width:19px; height:19px; }
.pp2-disc:hover{ background:var(--accent-soft); }
/* pairPlus: единый блок совместимости */
.pp-compat-merged .pp-compat-track{ margin-top:var(--sp-5); }
.pp-compat-merged .pp-compat-meaning{ margin-top:var(--sp-5); }
.pp-compat-merged .card-head{ align-items:flex-start; }
.pp-compat-merged .pp-compat-pct{ flex:0 0 auto; }
.pp-compat-title-tg{display:none}
.pp-compat-tone-row{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp-compat-merged .card-head>div>h3:not(.pp-compat-title-tg),
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp-compat-merged .card-head>div>.eyebrow{display:none}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp-compat-title-tg{display:block;font-size:var(--fs-sm);color:var(--text-1);margin:0}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp-compat-meaning{margin-top:var(--sp-3)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp-compat-tone-row{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-2)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp-compat-tone{font-size:var(--fs-sm);color:var(--text-2)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp-compat-more{display:inline-flex;align-items:center;gap:var(--sp-1);background:none;border:none;color:var(--accent);font-size:var(--fs-xs);cursor:pointer;padding:0}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp-compat-meaning>p{display:none;margin-top:var(--sp-2)}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp-compat-meaning.expanded>p{display:block}
html.tg-miniapp body:not(.route-home):not(.route-admin) .pp-compat-meaning.expanded .pp-compat-more svg{transform:rotate(90deg)}
.di-care-block{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-3);margin:0 0 var(--sp-5)}
.di-care-layer h3{margin:0 0 var(--sp-3)}
.di-care-list{display:grid;gap:var(--sp-2)}
.di-care-item{display:flex;justify-content:space-between;gap:var(--sp-3);color:var(--text-2);font-size:var(--fs-card-subtitle)}
.di-care-item span{color:var(--accent);font-weight:700;white-space:nowrap}
@media (max-width:699px){.di-care-block{grid-template-columns:1fr}.di-care-layer{padding:var(--sp-4)}}

/* pairPlus: две колонки — основной контент + рейл с настройками (как rail в профиле) */
.pp-layout{ display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:var(--sp-5); align-items:start; }
.pp-main{ display:flex; flex-direction:column; gap:var(--sp-6); min-width:0; }
.pp-rail{ position:sticky; top:var(--sp-5); }
/* компактный вертикальный вид настроек в рейле — две отдельные карточки-секции */
.pp2-rail{padding:var(--sp-6)}
.pp2-rail .pp2-grid{grid-template-columns:1fr;margin-top:var(--sp-5);gap:var(--sp-4)}
.pp2-rail .pp2-two{grid-template-columns:1fr;gap:var(--sp-5)}
.pp2-rail .pp2-box{padding:var(--sp-5)}
.pp2-rail .pp2-together{ margin-top:var(--sp-4); margin-bottom:2px; }
.pp2-rail .pp2-box-head{ gap:var(--sp-3); margin-bottom:var(--sp-5); }
.pp2-rail .pp2-ico{ width:38px; height:38px; border-radius:var(--r-md); }
.pp2-rail .pp2-ico svg{ width:19px; height:19px; }
.pp2-rail .pp2-box-head b{ font-size:var(--fs-card-subtitle); }
.pp2-rail .pp2-date-ico{ display:none; }
.pp2-rail .pp2-date{ padding:var(--sp-3) var(--sp-4); }
.pp2-rail .pp2-code{ padding:var(--sp-3) var(--sp-4); }
.pp2-rail .pp2-code b{ font-size:var(--fs-modal-title); }
@media (max-width:1100px){.pp-layout{grid-template-columns:1fr}.pp-rail{position:static}}
.tx-result-tabs{display:flex;gap:var(--sp-2);overflow-x:auto;padding:var(--sp-5) 0 var(--sp-3);border-bottom:var(--bw-1) solid var(--line-soft);scrollbar-width:none}.tx-result-tabs::-webkit-scrollbar{display:none}
.tx-result-tabs .di-tab{flex:0 0 auto;min-height:40px;padding:var(--sp-2) var(--sp-5);font-size:var(--fs-sm);font-weight:700;border:var(--bw-1-5) solid var(--line);border-radius:var(--r-md);background:var(--bg-3);color:var(--text-2);cursor:pointer;transition:.15s}.tx-result-tabs .di-tab.on{border-color:transparent}
.tx-result-panel{min-height:116px;padding:var(--sp-5) var(--sp-1) var(--sp-1)}
.tx-feedback-card{max-width:var(--content-wide);margin:var(--sp-3) auto 0;padding:var(--sp-3) var(--sp-4);border:var(--bw-1-5) solid var(--accent-line);border-radius:var(--r-xl);background:var(--bg-2);box-shadow:var(--shadow-md)}
.tx-feedback{margin:0}
.tx-feedback-details summary{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);padding-top:var(--sp-2);color:var(--text-1);cursor:pointer;list-style:none}
.tx-feedback-details summary::-webkit-details-marker{display:none}
.tx-feedback-details summary span:first-child{display:grid;gap:2px}
.tx-feedback-details summary b{font:700 var(--fs-body)/var(--lh-tight) var(--font-ui)}
.tx-feedback-details summary small{color:var(--text-3);font-size:var(--fs-xs)}
.tx-feedback-details .chev{color:var(--text-3);transition:transform var(--dur-fast) var(--ease)}
.tx-feedback-details[open] .chev{transform:rotate(180deg)}
.tx-feedback-body{padding-top:var(--sp-3)}
.tx-feedback-fields{display:grid;grid-template-columns:minmax(220px,.8fr) minmax(280px,1.2fr);gap:var(--sp-3)}
.tx-feedback-options{display:flex;flex-wrap:wrap;gap:var(--sp-1);margin-top:var(--sp-2)}
.tx-feedback .checkline{margin:0;padding:var(--sp-2) var(--sp-3);border:var(--bw-1) solid var(--line);border-radius:var(--r-pill);background:var(--bg-3);cursor:pointer}
.tx-feedback .checkline:has(input:checked){border-color:var(--accent-line);background:var(--accent-soft);color:var(--text-1)}
.tx-feedback-comment{display:block}
.tx-feedback-comment .textarea{min-height:72px;resize:vertical}
.tx-feedback-actions{display:flex;justify-content:flex-end;margin-top:var(--sp-2)}
.tx-feedback .btn{margin:0}
.settings-section{margin-top:var(--sp-4)}
.settings-actions{margin-top:var(--sp-3)}
.settings-copy{margin-top:var(--sp-2)}
.settings-file-input{display:none}
.brand-mark,.auth-mark,#bootHint .boot-mark{background-color:transparent;background-image:url('../assets/pair-studio-icon.svg');background-position:center;background-size:contain;background-repeat:no-repeat;box-shadow:none;color:transparent;animation:pairLogoFloat 5s ease-in-out infinite}
.brand-mark svg,.auth-mark svg,#bootHint .boot-mark svg{display:none}
.brand-mark:hover,.auth-mark:hover{animation:pairLogoFloat 2.2s ease-in-out infinite;transform:translateY(-2px) scale(1.04)}
@keyframes pairLogoFloat{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-2px) rotate(-1deg)}}

/* translator: единый вид ИИ-текста во всех вкладках результата */
.tx-fields{ display:grid; gap:var(--sp-3); }
.tx-fields-2{ grid-template-columns:repeat(2,minmax(0,1fr)); }
@media(max-width:640px){ .tx-fields-2{ grid-template-columns:1fr; } }
.tx-field{ display:grid; gap:var(--sp-2); padding:var(--sp-4) var(--sp-5); }
.tx-field-lbl{ font-size:var(--fs-xs); font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--text-3); }
.tx-field-val{ color:var(--text-1); font-size:var(--fs-card-subtitle); line-height:var(--lh-body); }
.tx-avoid-lbl{ display:block; margin:var(--sp-5) 2px var(--sp-2); }
.tx-result-panel .tr-avoid{ gap:var(--sp-2); margin-top:0; }
.tx-result-panel .tr-avoid .a{ padding:var(--sp-3) var(--sp-5); border-radius:var(--r-md); }

/* translator: оценка + уточнение в одной карточке */
.tx-feedback .tr-rate{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:var(--sp-3);margin:0 0 var(--sp-3);padding-bottom:var(--sp-3);border-bottom:var(--bw-1) solid var(--line-soft)}
.tx-feedback .score-row{margin:0;gap:var(--sp-1)}
.tx-feedback .score-btn{width:var(--control-sm);height:var(--control-sm);padding:0;display:inline-grid;place-items:center}
@media(max-width:900px){.tx-feedback .tr-rate{grid-template-columns:1fr}.tx-feedback-fields{grid-template-columns:1fr}.tx-feedback-actions{justify-content:stretch}.tx-feedback-actions .btn{width:100%}}
@media(max-width:699px){.tx-feedback-card{padding:var(--sp-3)}.tx-feedback .score-row{display:grid;grid-template-columns:repeat(6,1fr)}.tx-feedback .score-btn{width:100%}}

/* index: pd-dialog — единые alert/confirm вместо системных */
.pd-scrim{
  position:fixed; inset:0; z-index:1200;
  display:flex; align-items:center; justify-content:center;
  padding:var(--sp-5);
  background:rgba(20,18,14,.42);
  backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
  animation:pdScrimIn var(--dur-fast) var(--ease-out) both;
}
.pd-scrim.pd-closing{ animation:pdScrimOut var(--dur-fast) var(--ease) both; }
@keyframes pdScrimIn{ from{ opacity:0 } to{ opacity:1 } }
@keyframes pdScrimOut{ from{ opacity:1 } to{ opacity:0 } }
.pd-card{
  width:100%; max-width:380px;
  background:var(--bg-2); border:var(--bw-1-5) solid var(--line);
  border-radius:var(--r-xl);
  box-shadow:var(--shadow-lg);
  padding:var(--sp-6);
  animation:pdCardIn var(--dur-fast) var(--ease-out) both;
}
.pd-scrim.pd-closing .pd-card{ animation:pdCardOut var(--dur-fast) var(--ease) both; }
@keyframes pdCardIn{ from{ opacity:0; transform:translateY(8px) scale(.97) } to{ opacity:1; transform:none } }
@keyframes pdCardOut{ from{ opacity:1; transform:none } to{ opacity:0; transform:translateY(8px) scale(.98) } }
.pd-title{ font-family:var(--font-display); font-size:var(--fs-modal-title); color:var(--text-1); margin:0 0 var(--sp-2); letter-spacing:-.01em; }
.pd-msg{ font-size:var(--fs-sm); line-height:1.5; color:var(--text-2); margin:0; }
.pd-actions{ display:flex; justify-content:flex-end; gap:var(--sp-3); margin-top:var(--sp-6); }
.pd-actions .btn{ min-width:96px; }
@media(max-width:480px){
  .pd-card{ padding:var(--sp-5); }
  .pd-actions{ flex-direction:column-reverse; }
  .pd-actions .btn{ width:100%; }
}
body.pd-open{ overflow:hidden; }

/* На лендинге используется только собственное верхнее меню. */
body.route-home .app{grid-template-columns:1fr}
body.route-home .sidebar,
body.route-home .topbar,
body.route-home .nav-scrim{display:none}
body.route-home .main{width:100%;padding:0}
body.route-home .view{max-width:none;padding:0}

/* Общий tablet: на планшете кабинет всегда работает как desktop. */
.nav-social,.foot-social,.sidebar-social-links,.tg-topbar-social{display:flex;align-items:center;gap:var(--sp-2);}
.nav-social a,.foot-social a,.sidebar-social-links a,.tg-topbar-social a{width:var(--control-sm);height:var(--control-sm);display:grid;place-items:center;border:var(--bw-1) solid var(--line);border-radius:var(--r-md);background:var(--bg-2);color:var(--indigo);text-decoration:none;transition:transform var(--dur-fast) ease,background var(--dur-fast) ease,border-color var(--dur-fast) ease,color var(--dur-fast) ease;}
.nav-social a:hover,.foot-social a:hover,.sidebar-social-links a:hover,.tg-topbar-social a:hover{transform:translateY(-2px);background:var(--accent-soft);border-color:var(--accent-line);color:var(--accent);}
.nav-social svg,.foot-social svg,.sidebar-social-links svg,.tg-topbar-social svg{width:16px;height:16px;display:block;}
@media (min-width:1101px){
  .tg-bottom-nav,
  .tg-action-bar.is-visible,
  .tg-questionnaire-picker,
  .tg-topbar-brand{display:none}
  html.tg-miniapp body:not(.route-home):not(.route-admin) .view{padding-bottom:var(--sp-6);}
  body:not(.route-home):not(.route-admin) .sidebar{
    position:sticky;
    display:flex;
    left:auto;
    top:0;
    bottom:auto;
    width:auto;
    max-width:none;
    height:100vh;
    min-height:100vh;
    transform:none;
    padding:var(--sp-5) var(--sp-4);
    background:color-mix(in srgb,color-mix(in srgb,var(--indigo) 18%,var(--bg-0)) 82%,transparent);
    backdrop-filter:blur(8px);
    box-shadow:none;
  }
  body:not(.route-home):not(.route-admin) .sidebar .nav-item-wrap{display:grid;gap:var(--sp-1);}
  body:not(.route-home):not(.route-admin) .sidebar .nav-submenu{display:grid;gap:var(--sp-1);margin:0 0 var(--sp-1) var(--sp-7);}
  body:not(.route-home):not(.route-admin) .sidebar .nav-subitem{
    display:flex;align-items:center;justify-content:space-between;gap:var(--sp-2);
    min-height:34px;padding:var(--sp-2) var(--sp-3);border:0;border-radius:var(--r-md);
    background:transparent;color:var(--text-3);font:600 13px/1.2 var(--font-ui);
  }
  body:not(.route-home):not(.route-admin) .sidebar .nav-subitem:hover,
  body:not(.route-home):not(.route-admin) .sidebar .nav-subitem.active{background:var(--accent-soft);color:var(--indigo);}
  body:not(.route-home):not(.route-admin) .sidebar .nav-submeta{font-size:var(--fs-xs);color:var(--text-3);white-space:nowrap;}
}
@media (min-width:700px) and (max-width:1100px){
  body:not(.route-home):not(.route-admin) .app{display:block;width:100%;}
  body:not(.route-home):not(.route-admin) .main{width:100%;min-width:0;margin:0;}
  body:not(.route-home):not(.route-admin) .topbar{display:flex;position:sticky;top:0;z-index:60;min-height:62px;padding:var(--sp-3) var(--sp-4);}
  body:not(.route-home):not(.route-admin) .topbar .profile-switch{display:none}
  body:not(.route-home):not(.route-admin) .mobile-bar{display:inline-flex;visibility:visible;opacity:1;}
  body:not(.route-home):not(.route-admin) .sidebar{display:flex;position:fixed;left:0;top:0;bottom:0;z-index:70;width:min(82vw,300px);max-width:300px;height:100vh;min-height:100vh;transform:translateX(-105%);overflow-y:auto;}
  body:not(.route-home):not(.route-admin).nav-open .sidebar{transform:translateX(0);}
  body:not(.route-home):not(.route-admin) .nav-scrim{display:block;position:fixed;inset:0;z-index:65;opacity:0;pointer-events:none;}
  body:not(.route-home):not(.route-admin).nav-open .nav-scrim{opacity:1;pointer-events:auto;}
  .tg-topbar-brand,
  .tg-bottom-nav,
  .tg-action-bar.is-visible,
  .tg-questionnaire-picker{display:none}
  body:not(.route-home):not(.route-admin) .view{padding:var(--sp-6);}
}

/* Единый вид бокового меню на планшете и десктопе. */
@media (min-width:700px){
  body:not(.route-home):not(.route-admin) .sidebar .nav a{
    min-height:44px;padding:var(--sp-3);border-radius:var(--r-md);
    background:transparent;color:var(--text-2);
    font:600 var(--fs-sm)/1.2 var(--font-ui);box-shadow:none;
  }
  body:not(.route-home):not(.route-admin) .sidebar .nav a:hover{
    background:var(--accent-soft);color:var(--text-1);
  }
  body:not(.route-home):not(.route-admin) .sidebar .nav a.active{
    background:var(--accent-soft);color:var(--indigo);
    box-shadow:inset 3px 0 0 var(--accent);
  }
  body:not(.route-home):not(.route-admin) .sidebar-social-links a{
    width:var(--control-sm);height:var(--control-sm);border-radius:var(--r-md);
    background:var(--bg-2);border-color:var(--line);color:var(--indigo);
  }
  body:not(.route-home):not(.route-admin) .sidebar-social-links a:hover{
    background:var(--accent-soft);border-color:var(--accent-line);color:var(--accent);
  }
  body:not(.route-home):not(.route-admin) .sidebar-foot .btn[data-action="logout"]{
    width:100%;min-height:44px;border-radius:var(--r-md);
  }
}