/* KDM Marketing Analytics — фирменный стиль КДМ
   Коралл #F25948 · Индиго #5F59B1 · Графит #1F1B20 · Manrope */
@font-face{
  font-family:'Manrope';
  src:url('/static/fonts/Manrope.ttf') format('truetype');
  font-weight:200 800;font-style:normal;font-display:swap;
}
:root{
  --coral:#F25948; --coral-soft:#FDEAE8; --coral-dark:#D8432F;
  --indigo:#5F59B1; --indigo-soft:#ECEBF6;
  --ink:#1F1B20; --muted:#6B6770; --faint:#A29EAA;
  --border:#E9E7EC; --bg:#F6F5F8; --paper:#fff;
  --ok:#27AE60; --ok-soft:#EEF8F0; --ok-border:#D8EEDD;
  --warn:#E8973A; --err:#D8432F;
  --nav:#4a464f; --nav-ic:#9a96a2; --border-strong:#dcd8e0;
  --r:14px; --r-lg:16px;
  --shadow:0 10px 26px -14px rgba(31,27,32,.25);
  --shadow-coral:0 12px 30px -14px rgba(242,89,72,.30);
}

/* ── Тёмная тема ───────────────────────────────────────────── */
:root[data-theme="dark"]{
  --coral:#FF6B59; --coral-soft:rgba(255,107,89,.15); --coral-dark:#FF8473;
  --indigo:#8B86E0; --indigo-soft:rgba(139,134,224,.16);
  --ink:#F1EEF5; --muted:#9B96A4; --faint:#6F6A78;
  --border:#2E2A35; --bg:#151318; --paper:#1E1B22;
  --ok:#5BE39A; --ok-soft:rgba(39,174,96,.14); --ok-border:rgba(39,174,96,.30);
  --warn:#E8A24A; --err:#FF7B6B;
  --nav:#C9C5D0; --nav-ic:#8B8693; --border-strong:#3C3743;
  --shadow:0 10px 26px -14px rgba(0,0,0,.6);
  --shadow-coral:0 14px 34px -16px rgba(242,89,72,.45);
}
:root{color-scheme:light;}
:root[data-theme="dark"]{color-scheme:dark;}
*{box-sizing:border-box;margin:0;padding:0;}
html,body{height:100%;}
body{font-family:'Manrope',-apple-system,'Segoe UI',sans-serif;background:var(--bg);color:var(--ink);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
a{color:inherit;text-decoration:none;}

/* ── App shell (sidebar + main) ────────────────────────────── */
.app{display:flex;min-height:100vh;}
.side{width:252px;flex:0 0 auto;background:var(--paper);border-right:1px solid var(--border);
  padding:18px 14px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh;overflow-y:auto;}
.logo{display:flex;align-items:center;gap:10px;padding:8px 8px 18px;}
.logo img{height:32px;width:auto;}
.logo b{font-weight:800;font-size:17px;letter-spacing:-.02em;line-height:1.12;}
.logo b small{display:block;font-weight:600;font-size:10px;color:var(--muted);
  text-transform:uppercase;letter-spacing:.05em;}
.grp{font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;
  color:var(--faint);padding:15px 10px 6px;}
.item{display:flex;align-items:center;gap:11px;padding:9px 10px;border-radius:10px;
  font-size:13.5px;font-weight:600;color:var(--nav);transition:background .14s,color .14s;}
.item svg{width:18px;height:18px;color:var(--nav-ic);flex:0 0 auto;transition:color .14s;}
.item:hover{background:var(--bg);}
.item.active{background:var(--coral);color:#fff;}
.item.active svg{color:#fff;}
.side-foot{margin-top:auto;padding-top:12px;border-top:1px solid var(--border);}
.tool{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:10px;
  font-size:13px;font-weight:600;color:var(--indigo);}
.tool svg{width:17px;height:17px;flex:0 0 auto;}
.tool:hover{background:var(--indigo-soft);}
.user{display:flex;align-items:center;gap:10px;padding:10px 8px 4px;margin-top:6px;}
.avatar{width:34px;height:34px;border-radius:50%;background:var(--indigo);color:#fff;
  display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;flex:0 0 auto;}
.who{font-size:13px;font-weight:700;line-height:1.2;min-width:0;}
.who small{display:block;color:var(--muted);font-weight:500;font-size:11.5px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px;}
.who a{display:block;color:var(--muted);font-weight:600;font-size:11px;margin-top:1px;}
.who a:hover{color:var(--coral);}

.main{flex:1;min-width:0;padding:26px 36px 56px;}
.bar{display:flex;align-items:center;gap:16px;margin-bottom:28px;flex-wrap:wrap;}
.h1{font-size:24px;font-weight:800;letter-spacing:-.03em;}
.h1 span{color:var(--coral);}
.sub{color:var(--muted);font-size:14.5px;font-weight:500;margin-top:4px;}
.spacer{flex:1;}
.pill{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:700;
  color:var(--ok);background:var(--ok-soft);border:1px solid var(--ok-border);
  padding:8px 13px;border-radius:20px;}
.pill.stale{color:var(--warn);background:#FCF3E8;border-color:#F3E0C5;}
.pill.never{color:var(--muted);background:var(--bg);border-color:var(--border);}
.dot{width:7px;height:7px;border-radius:50%;background:currentColor;}
.btn-refresh{display:inline-flex;align-items:center;gap:7px;font:inherit;font-size:13px;font-weight:700;
  color:var(--indigo);background:var(--indigo-soft);border:1px solid transparent;border-radius:20px;
  padding:8px 14px;cursor:pointer;transition:filter .14s,opacity .14s;}
.btn-refresh:hover{filter:brightness(.97);}
.btn-refresh svg{width:15px;height:15px;flex:0 0 auto;}
.btn-refresh.busy{opacity:.65;cursor:default;}
.btn-refresh.busy svg{animation:spin 1s linear infinite;transform-origin:center;}
@keyframes spin{to{transform:rotate(360deg);}}

.search{display:flex;align-items:center;gap:9px;background:var(--paper);border:1px solid var(--border);
  border-radius:11px;padding:9px 14px;width:270px;color:var(--muted);}
.search svg{width:16px;height:16px;flex:0 0 auto;}
.search input{border:none;outline:none;background:none;font:inherit;font-size:13.5px;
  color:var(--ink);width:100%;}
.search input::placeholder{color:var(--faint);}

/* ── Cards grid ────────────────────────────────────────────── */
.grp2{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;
  color:var(--muted);margin:24px 0 14px;}
.grp2:first-of-type{margin-top:6px;}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;}
.card{background:var(--paper);border:1px solid var(--border);border-radius:var(--r-lg);
  padding:18px 20px;display:flex;gap:14px;align-items:flex-start;
  transition:transform .16s,box-shadow .16s,border-color .16s;}
.card:hover{transform:translateY(-2px);box-shadow:var(--shadow);border-color:#dcd8e0;}
.ic{width:44px;height:44px;border-radius:12px;background:var(--coral-soft);color:var(--coral);
  display:flex;align-items:center;justify-content:center;flex:0 0 auto;}
.ic svg{width:22px;height:22px;}
.card.i .ic{background:var(--indigo-soft);color:var(--indigo);}
.card .body{min-width:0;}
.card h3{font-size:15px;font-weight:800;letter-spacing:-.01em;}
.card p{font-size:12.5px;color:var(--muted);margin-top:5px;line-height:1.45;font-weight:500;}
.empty{color:var(--muted);font-size:14px;padding:40px 0;text-align:center;display:none;}

/* ── Dashboard view (iframe) ───────────────────────────────── */
.view{flex:1;min-width:0;display:flex;flex-direction:column;height:100vh;}
.view-head{flex:0 0 auto;display:flex;align-items:center;gap:14px;
  padding:16px 28px;border-bottom:1px solid var(--border);background:var(--paper);}
.view-head .vic{width:34px;height:34px;border-radius:10px;background:var(--coral-soft);
  color:var(--coral);display:flex;align-items:center;justify-content:center;flex:0 0 auto;}
.view-head .vic svg{width:18px;height:18px;}
.view-head h1{font-size:17px;font-weight:800;letter-spacing:-.02em;}
.view-head .vsub{font-size:12.5px;color:var(--muted);font-weight:500;}
.view iframe{flex:1 1 auto;border:none;width:100%;background:var(--bg);}

/* ── Auth (login / verify) ─────────────────────────────────── */
.auth{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;
  background:radial-gradient(900px 420px at 80% -10%,rgba(242,89,72,.10),transparent),
             radial-gradient(700px 360px at 5% 0%,rgba(95,89,177,.08),transparent),var(--bg);}
.auth-card{background:var(--paper);border:1px solid var(--border);border-radius:22px;
  padding:40px 38px;width:100%;max-width:400px;box-shadow:0 24px 60px -28px rgba(31,27,32,.30);}
.auth-logo{display:flex;align-items:center;gap:11px;margin-bottom:24px;}
.auth-logo img{height:38px;}
.auth-logo b{font-weight:800;font-size:19px;letter-spacing:-.02em;line-height:1.12;}
.auth-logo b small{display:block;font-weight:600;font-size:10.5px;color:var(--muted);
  text-transform:uppercase;letter-spacing:.05em;}
.auth-card h1{font-size:22px;font-weight:800;letter-spacing:-.02em;}
.auth-card .subtitle{font-size:13.5px;color:var(--muted);margin-top:6px;margin-bottom:24px;
  line-height:1.5;font-weight:500;}
.auth-card label{display:block;font-size:13px;font-weight:700;margin-bottom:7px;}
.auth-card input{width:100%;padding:12px 14px;border:1.5px solid var(--border);border-radius:11px;
  font:inherit;font-size:15px;outline:none;transition:border-color .14s,box-shadow .14s;}
.auth-card input:focus{border-color:var(--coral);box-shadow:0 0 0 3px var(--coral-soft);}
.auth-card input.code{font-size:26px;text-align:center;letter-spacing:10px;font-weight:700;}
.btn{width:100%;padding:13px;background:var(--coral);color:#fff;border:none;border-radius:11px;
  font:inherit;font-size:15px;font-weight:700;cursor:pointer;margin-top:20px;transition:background .14s;}
.btn:hover{background:var(--coral-dark);}
.hint{font-size:12px;color:var(--muted);margin-top:10px;line-height:1.45;}
.back{display:block;text-align:center;margin-top:18px;font-size:13px;color:var(--muted);font-weight:600;}
.back:hover{color:var(--coral);}
.error{background:var(--coral-soft);color:var(--coral-dark);border:1px solid #F6CFC9;
  border-radius:11px;padding:11px 14px;font-size:13px;font-weight:600;margin-bottom:18px;}

/* ── Переключатель темы ────────────────────────────────────── */
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;
  width:38px;height:38px;border-radius:11px;border:1px solid var(--border);
  background:var(--paper);color:var(--muted);cursor:pointer;flex:0 0 auto;
  transition:color .14s,border-color .14s,background .14s;}
.theme-toggle:hover{color:var(--coral);border-color:var(--border-strong);}
.theme-toggle svg{width:18px;height:18px;}
.theme-toggle .ic-sun{display:none;}
:root[data-theme="dark"] .theme-toggle .ic-sun{display:block;}
:root[data-theme="dark"] .theme-toggle .ic-moon{display:none;}
/* в сайдбаре - в один ряд с конструктором */
.side-foot .toggle-row{display:flex;align-items:center;gap:8px;}
.side-foot .toggle-row .tool{flex:1;}
/* плавающая кнопка на экранах входа */
.theme-toggle.floating{position:fixed;top:20px;right:20px;z-index:30;}

/* ── Мобильная навигация: гамбургер + оверлей ──────────────── */
.navburger{display:none;}
.side-overlay{display:none;}

/* ── Спиннер поверх iframe дашборда ────────────────────────── */
.frame-wrap{position:relative;flex:1 1 auto;min-height:0;}
.frame-wrap iframe{position:absolute;inset:0;width:100%;height:100%;border:none;background:var(--bg);}
.frame-loader{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:14px;background:var(--bg);
  color:var(--muted,#888);font-size:14px;transition:opacity .35s ease;}
.frame-loader.hide{opacity:0;pointer-events:none;}
.frame-loader .spinner{width:38px;height:38px;border-radius:50%;
  border:3px solid var(--border);border-top-color:var(--accent,#ff6b5a);
  animation:spin .8s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}

@media(max-width:760px){
  .side{position:fixed;left:0;top:0;transform:translateX(-100%);z-index:20;
    box-shadow:var(--shadow);transition:transform .25s ease;}
  .side.open{transform:translateX(0);}
  .main{padding:20px;}
  .search{width:100%;}
  /* кнопка-гамбургер */
  .navburger{display:flex;position:fixed;top:12px;left:12px;z-index:40;
    width:44px;height:44px;align-items:center;justify-content:center;
    background:var(--paper);border:1px solid var(--border);border-radius:12px;
    color:var(--fg);box-shadow:var(--shadow);cursor:pointer;}
  .navburger svg{width:24px;height:24px;}
  /* затемнение под открытым меню */
  .side-overlay.show{display:block;position:fixed;inset:0;z-index:15;
    background:rgba(0,0,0,.45);}
  /* освободить место под кнопку у заголовков */
  .bar,.view-head{padding-left:54px;}
}

/* ── Глоссарий ─────────────────────────────────────────────── */
.gloss{padding:6px 0 48px;display:flex;flex-direction:column;gap:26px;max-width:920px;}
.gloss-grp h2{font-size:14px;font-weight:800;letter-spacing:.01em;text-transform:uppercase;
  margin:0 0 12px;color:var(--coral);}
.gloss dl{display:flex;flex-direction:column;gap:10px;margin:0;}
.gloss-item{background:var(--paper);border:1px solid var(--border);border-radius:12px;padding:13px 16px;}
.gloss-item dt{font-weight:700;font-size:14px;margin-bottom:4px;color:var(--ink);}
.gloss-item dd{margin:0;font-size:13px;color:var(--muted);line-height:1.5;}

/* logo_white.png в тёмной теме (читаемость вордмарка) */
:root[data-theme="dark"] .logo img{content:url('/static/img/logo_white.png');}

/* ── Управление доступом (админка) ─────────────────────────── */
.access-add{display:flex;gap:10px;margin-bottom:20px;flex-wrap:wrap;}
.access-add input,.access-add select{padding:9px 12px;border:1px solid var(--border);border-radius:10px;
  background:var(--paper);color:var(--ink);font:inherit;font-size:13.5px;}
.access-add input[type=email]{min-width:280px;}
.access-add button{padding:9px 16px;border:none;border-radius:10px;background:var(--coral);color:#fff;
  font:inherit;font-weight:700;font-size:13.5px;cursor:pointer;}
.access-add button:hover{filter:brightness(.96);}
.access-table{background:var(--paper);border:1px solid var(--border);border-radius:14px;overflow:hidden;max-width:980px;}
.access-table table{width:100%;border-collapse:collapse;font-size:13.5px;}
.access-table th{text-align:left;padding:12px 16px;font-size:11px;text-transform:uppercase;
  letter-spacing:.04em;color:var(--muted);border-bottom:1px solid var(--border);}
.access-table td{padding:11px 16px;border-bottom:1px solid var(--border);vertical-align:middle;}
.access-table tr:last-child td{border-bottom:none;}
.access-table .email{font-weight:600;}
.access-table .muted{color:var(--muted);}
.access-table select{padding:5px 8px;border:1px solid var(--border);border-radius:8px;
  background:var(--bg);color:var(--ink);font:inherit;font-size:13px;cursor:pointer;}
.access-table .inline{display:inline;}
.badge{display:inline-block;padding:3px 10px;border-radius:20px;font-size:12px;font-weight:700;}
.badge.ok{color:var(--ok);background:var(--ok-soft);}
.badge.off{color:var(--muted);background:var(--bg);}
.access-table .actions{white-space:nowrap;display:flex;gap:14px;align-items:center;}
.lnk{background:none;border:none;color:var(--indigo);font:inherit;font-size:13px;font-weight:600;cursor:pointer;padding:0;}
.lnk:hover{text-decoration:underline;}
.lnk.del{color:var(--err);}
.lnk.on{color:var(--ok);}