/* ЦПП / Digital Port Platform — дизайн-система «Глубокая вода». Общий CSS для 13 экранов MVP. */
:root{
  --navy:#0E2C4A; --navy-2:#16375A;
  --canvas:#CDD8E2; --page:#EAF1F7; --panel:#F4F8FB; --card:#FFFFFF;
  --ink:#12314E; --muted:#5E7286; --line:#D8E2EC;
  --slate:#44586B; --slate-weak:#E7EDF3;
  --azure:#1668B0; --azure-strong:#12568F; --azure-weak:#E3EEF8;
  --teal:#0E8A8A; --teal-weak:#DCF0EF;
  --pos:#1C7A5A; --pos-weak:#DEEDE6;
  --neg:#C0443A; --neg-weak:#F6E3E0;
  --warn:#9C6A12; --warn-weak:#F1E7CF;
  --side-ink:#DCE7F1; --side-txt:#AFC0D2; --side-mut:#7E93A8;
  --ff:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --ring:0 0 0 3px rgba(22,104,176,.22);
  --sh-lg:0 18px 48px rgba(14,44,74,.28);
}
*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:var(--ff);background:var(--canvas);color:var(--ink);font-size:13px;line-height:1.45;-webkit-font-smoothing:antialiased;}
.num,.tnum{font-variant-numeric:tabular-nums;}

/* ===== каркас ===== */
.app{display:flex;min-height:100vh;}
.side{width:216px;background:var(--navy);color:#C7D5E3;display:flex;flex-direction:column;flex-shrink:0;}
.side .logo{display:flex;align-items:center;gap:9px;padding:18px 18px 16px;border-bottom:1px solid rgba(255,255,255,.08);}
.side .logo .mark{background:var(--azure);color:#fff;font-weight:700;font-size:13px;padding:4px 9px;border-radius:7px;letter-spacing:.05em;}
.side a.logo{text-decoration:none;cursor:pointer;transition:background .12s;}
.side a.logo:hover{background:rgba(255,255,255,.05);}
.side .logo .name{font-size:13px;color:var(--side-ink);font-weight:600;line-height:1.2;}
.side .logo .name small{display:block;font-size:12px;color:var(--side-txt);font-weight:600;margin-top:3px;letter-spacing:.01em;}
.nav{padding:12px 10px;display:flex;flex-direction:column;gap:2px;}
.nav a{display:flex;align-items:center;gap:11px;padding:9px 12px;border-radius:8px;font-size:13px;color:var(--side-txt);text-decoration:none;}
.nav a svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.7;opacity:.9;}
.nav a:hover{background:var(--navy-2);color:#EAF1F8;}
.nav a.on{background:var(--azure);color:#fff;}
.nav a.on svg{opacity:1;}
.side .foot{margin-top:auto;padding:14px 18px;border-top:1px solid rgba(255,255,255,.08);font-size:11.5px;color:var(--side-mut);}
.main{flex:1;background:var(--page);min-width:0;display:flex;flex-direction:column;}
.topbar{display:flex;align-items:center;justify-content:space-between;padding:14px 24px;background:var(--panel);border-bottom:1px solid var(--line);}
.crumbs{font-size:13px;color:var(--muted);display:flex;align-items:center;flex-wrap:wrap;}
.crumbs a{color:var(--muted);text-decoration:none;}
.crumbs a:hover{color:var(--azure);text-decoration:underline;}
.crumbs .sep{color:var(--line);margin:0 8px;font-size:14px;}
.crumbs b{color:var(--ink);font-weight:640;}
.top-right{display:flex;align-items:center;gap:14px;font-size:12.5px;color:var(--muted);}
.avatar{width:30px;height:30px;border-radius:50%;background:var(--azure-weak);color:var(--azure);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;}
.content{padding:22px 24px;max-width:1200px;}
.page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:18px;}
.h1{font-size:19px;font-weight:650;color:var(--ink);margin-bottom:2px;}
.sub{font-size:13px;color:var(--muted);}
.section-h{font-size:14px;font-weight:640;color:var(--ink);margin:22px 0 10px;}

/* ===== метрики ===== */
.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin-bottom:18px;}
.metrics.m3{grid-template-columns:repeat(3,1fr);}
.metric{background:var(--card);border:1px solid #C6D4E2;border-radius:12px;padding:15px 17px;box-shadow:0 2px 7px rgba(14,44,74,.08);}
.metric .k{font-size:11px;color:var(--slate);font-weight:640;margin-bottom:8px;text-transform:uppercase;letter-spacing:.04em;}
.metric .v{font-size:25px;font-weight:680;font-variant-numeric:tabular-nums;color:var(--ink);letter-spacing:-.01em;}
.metric .v.neg{color:var(--neg);}
.metric .v.pos{color:var(--pos);}
.metric .d{font-size:11px;margin-top:4px;color:var(--muted);}

/* ===== панель + таблица ===== */
.panel{background:var(--card);border:1px solid var(--line);border-radius:13px;overflow:hidden;margin-bottom:16px;}
.panel-h{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 18px;border-bottom:1px solid var(--line);font-size:14px;font-weight:620;}
.panel-h em{font-style:normal;font-size:11px;font-weight:600;color:var(--azure);background:var(--azure-weak);padding:3px 10px;border-radius:20px;}
.panel-b{padding:16px 18px;}
.tw{overflow-x:auto;}
table{width:100%;border-collapse:collapse;font-size:13px;}
th{text-align:left;font-weight:640;font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--slate);padding:11px 18px;background:var(--panel);border-bottom:1px solid var(--line);}
td{padding:12px 18px;border-top:1px solid var(--line);color:var(--ink);font-variant-numeric:tabular-nums;}
th.num,td.num{text-align:right;}
td.neg{color:var(--neg);}
td.pos{color:var(--pos);}
tbody tr:hover{background:var(--panel);}
tfoot td{font-weight:640;border-top:2px solid var(--line);background:var(--panel);}
td a{color:var(--azure);text-decoration:none;font-weight:560;}
td a:hover{text-decoration:underline;}
td b{font-weight:640;color:var(--ink);}

/* ===== статус-пилюли ===== */
.st{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:600;padding:2px 10px;border-radius:20px;white-space:nowrap;line-height:1.5;}
.st.s-neu{background:var(--slate-weak);color:var(--slate);}
.st.s-azure{background:var(--azure-weak);color:var(--azure);}
.st.s-teal{background:var(--teal-weak);color:var(--teal);}
.st.s-pos{background:var(--pos-weak);color:var(--pos);}
.st.s-neg{background:var(--neg-weak);color:var(--neg);}
.st.s-warn{background:var(--warn-weak);color:var(--warn);}
.st.dep{background:var(--warn-weak);color:var(--warn);}
.st.ras{background:var(--azure-weak);color:var(--azure);}
.st.vyp{background:var(--pos-weak);color:var(--pos);}
.teal-tag{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:600;color:var(--teal);background:var(--teal-weak);padding:2px 9px;border-radius:20px;}
.pill-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center;}
.src{font-size:10.5px;font-weight:600;padding:1px 7px;border-radius:6px;border:1px solid var(--line);color:var(--muted);background:var(--panel);margin-left:6px;}
.src.rule{color:var(--teal);border-color:var(--teal-weak);background:var(--teal-weak);}
.src.model{color:var(--azure);border-color:var(--azure-weak);background:var(--azure-weak);}
.src.manual{color:var(--slate);border-color:var(--slate-weak);background:var(--slate-weak);}

/* ===== степпер ===== */
.flow{display:flex;align-items:center;gap:14px;margin-top:0;margin-bottom:16px;padding:15px 18px;background:var(--card);border:1px solid var(--line);border-radius:13px;}
.step{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--ink);}
.dot{width:21px;height:21px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:12px;color:#fff;flex-shrink:0;}
.dot.on{background:var(--azure);}
.dot.done{background:var(--pos);}
.dot.off{background:transparent;border:1.5px solid var(--line);color:var(--muted);}
.arr{color:var(--muted);}
.spacer{flex:1;}

/* ===== кнопки ===== */
.actions{display:flex;align-items:center;gap:8px;}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;font-size:13px;font-weight:600;padding:9px 17px;border-radius:9px;border:1px solid transparent;cursor:pointer;font-family:inherit;line-height:1;text-decoration:none;}
.btn:focus-visible{outline:none;box-shadow:var(--ring);}
.btn.primary{background:var(--azure);color:#fff;}
.btn.primary:hover{background:var(--azure-strong);}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--line);}
.btn.ghost:hover{background:var(--panel);border-color:var(--muted);}
.btn.teal{background:var(--teal);color:#fff;}
.btn.danger{background:transparent;color:var(--neg);border-color:var(--neg-weak);}
.btn.danger:hover{background:var(--neg-weak);}
.btn.sm{font-size:12px;padding:6px 12px;border-radius:8px;}
.btn[disabled],.btn:disabled{opacity:.5;cursor:not-allowed;}
/* размер иконки задаём явно: inline-svg без размера растягивается и ломает кнопку */
.btn svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.8;flex-shrink:0;}
.btn.sm svg{width:14px;height:14px;}
.actions{flex-wrap:wrap;row-gap:8px;}

/* ===== формы ===== */
.field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px;}
.field .lbl{font-size:12px;font-weight:600;color:var(--ink);}
.field .lbl .req{color:var(--neg);margin-left:2px;}
.inp,.sel,.ta{width:100%;font-family:inherit;font-size:13px;color:var(--ink);background:var(--card);border:1px solid var(--line);border-radius:9px;padding:9px 12px;line-height:1.3;}
.inp:focus,.sel:focus,.ta:focus{outline:none;border-color:var(--azure);box-shadow:var(--ring);}
.ta{min-height:80px;resize:vertical;}
.inp[readonly]{background:var(--panel);color:var(--muted);}
.field .hint{font-size:11.5px;color:var(--muted);}
.field.err .inp{border-color:var(--neg);}
.field .err-msg{font-size:11.5px;color:var(--neg);}
.money{position:relative;}
.money .inp{padding-right:26px;text-align:right;font-variant-numeric:tabular-nums;}
.money .cur{position:absolute;right:12px;top:50%;transform:translateY(-50%);color:var(--muted);font-size:13px;pointer-events:none;}
.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.inp.code{letter-spacing:.5em;text-align:center;font-size:18px;font-weight:640;}

/* ===== key-value (карточка захода / участники) ===== */
.kv{display:grid;grid-template-columns:repeat(2,1fr);gap:14px 32px;}
.kv.k3{grid-template-columns:repeat(3,1fr);}
.kv .row{display:flex;flex-direction:column;gap:3px;}
.kv .row .k{font-size:11.5px;color:var(--muted);}
.kv .row .v{font-size:14px;color:var(--ink);font-weight:560;}

/* ===== реестр (список-строки) ===== */
.list{background:var(--card);border:1px solid var(--line);border-radius:13px;overflow:hidden;}
.list .row{display:flex;align-items:center;gap:14px;padding:13px 18px;border-top:1px solid var(--line);text-decoration:none;color:var(--ink);cursor:pointer;}
.list .row:first-child{border-top:none;}
.list .row:hover{background:var(--panel);}
.list .row.mute{opacity:.6;cursor:default;}
.row-main{min-width:0;flex:1;}
.row-title{font-size:14px;font-weight:640;color:var(--ink);}
.row-title .mut{color:var(--slate);font-weight:560;}
.row-sub{font-size:12px;color:var(--slate);margin-top:3px;}
.row-amt{font-size:13px;font-weight:640;font-variant-numeric:tabular-nums;text-align:right;min-width:130px;}
.row .chev{width:16px;height:16px;stroke:var(--muted);fill:none;stroke-width:1.8;flex-shrink:0;}

/* ===== диалог 2FA ===== */
.overlay{position:fixed;inset:0;background:rgba(14,44,74,.42);display:flex;align-items:center;justify-content:center;padding:24px;z-index:50;}
.modal{width:100%;max-width:440px;background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--sh-lg);overflow:hidden;}
.modal-h{padding:18px 20px 14px;border-bottom:1px solid var(--line);}
.modal-h .teal-tag{margin-bottom:8px;}
.modal-h h3{font-size:15px;font-weight:640;color:var(--ink);}
.modal-b{padding:16px 20px;}
.modal-b .intent{font-size:13px;color:var(--ink);margin-bottom:10px;}
.intent-sum{font-size:26px;font-weight:640;font-variant-numeric:tabular-nums;color:var(--ink);margin-bottom:8px;}
.intent-meta{list-style:none;font-size:12px;color:var(--muted);display:flex;flex-direction:column;gap:4px;margin-bottom:16px;}
.intent-meta li{display:flex;justify-content:space-between;gap:12px;}
.intent-meta b{color:var(--ink);font-weight:600;}
.modal-note{margin-top:12px;font-size:11.5px;color:var(--muted);}
.modal-f{display:flex;justify-content:flex-end;gap:8px;padding:14px 20px;border-top:1px solid var(--line);background:var(--panel);}

/* ===== два гейта (экран 10) ===== */
.gates{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:16px;}
.gate{background:var(--card);border:1px solid var(--line);border-radius:13px;padding:16px 18px;}
.gate.open{border-color:var(--pos);}
.gate.closed{border-color:var(--warn);}
.gate .gh{display:flex;align-items:center;justify-content:space-between;font-size:13.5px;font-weight:640;margin-bottom:4px;}
.gate .gs{font-size:12px;color:var(--muted);margin-bottom:12px;}
.gate ul{list-style:none;font-size:12.5px;color:var(--ink);display:flex;flex-direction:column;gap:6px;}
.gate ul li{display:flex;justify-content:space-between;gap:10px;}

/* ===== чек-лист условий гейта ===== */
.gate-check{list-style:none;display:flex;flex-direction:column;gap:0;font-size:13px;}
.gate-check li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 0;border-top:1px solid var(--line);color:var(--ink);}
.gate-check li:first-child{border-top:none;}

/* ===== документы / файлы ===== */
.file{display:flex;align-items:center;gap:12px;padding:11px 18px;border-top:1px solid var(--line);font-size:13px;}
.file:first-child{border-top:none;}
.file .ic{width:30px;height:30px;border-radius:8px;background:var(--azure-weak);color:var(--azure);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.file .nm{flex:1;}
.file .nm small{display:block;color:var(--muted);font-size:11.5px;}

/* ===== timeline (карточка захода) ===== */
.tl{display:flex;flex-direction:column;gap:0;}
.tl .t{display:flex;gap:12px;padding:9px 0;}
.tl .t .mk{width:14px;display:flex;flex-direction:column;align-items:center;flex-shrink:0;}
.tl .t .mk i{width:11px;height:11px;border-radius:50%;background:var(--pos);display:block;}
.tl .t.now .mk i{background:var(--azure);}
.tl .t.next .mk i{background:transparent;border:1.5px solid var(--line);}
.tl .t .mk s{flex:1;width:1.5px;background:var(--line);margin-top:3px;}
.tl .t:last-child .mk s{display:none;}
.tl .t .tx{font-size:13px;color:var(--ink);}
.tl .t .tx small{display:block;color:var(--muted);font-size:11.5px;margin-top:1px;}

/* ===== alert ===== */
.alert{display:flex;align-items:flex-start;gap:10px;padding:12px 16px;border-radius:11px;font-size:13px;margin-bottom:12px;}
.alert svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.8;flex-shrink:0;margin-top:1px;}
.file .ic svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.8;}
.alert.warn{background:var(--warn-weak);color:var(--warn);}
.alert.neg{background:var(--neg-weak);color:var(--neg);}
.alert.info{background:var(--azure-weak);color:var(--azure);}
.alert.pos{background:var(--pos-weak);color:var(--pos);}

/* ===== AI-акцент (GigaChat) ===== */
.ai-badge{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:680;color:#fff;background:linear-gradient(90deg,var(--azure) 0%,var(--teal) 100%);padding:5px 12px;border-radius:20px;white-space:nowrap;}
.ai-badge svg{width:14px;height:14px;fill:#fff;stroke:none;}
.ai-banner{display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:12px;margin-bottom:16px;background:linear-gradient(90deg,rgba(22,104,176,.10) 0%,rgba(14,138,138,.10) 100%);border:1px solid var(--azure-weak);}
.ai-banner .ai-ic{width:34px;height:34px;border-radius:10px;flex-shrink:0;display:flex;align-items:center;justify-content:center;color:#fff;background:linear-gradient(135deg,var(--azure) 0%,var(--teal) 100%);}
.ai-banner .ai-ic svg{width:19px;height:19px;fill:#fff;stroke:none;}
.ai-banner .ai-tx{font-size:13px;color:var(--ink);}
.ai-banner .ai-tx b{font-weight:680;}
.ai-banner .ai-tx small{display:block;color:var(--slate);font-size:11.5px;margin-top:1px;}

/* ===== грузовой блок (масштабируемый вывод позиций) ===== */
.cargo-sum{display:flex;flex-wrap:wrap;gap:10px 26px;padding:14px 18px;border-bottom:1px solid var(--line);}
.cargo-sum .c{display:flex;flex-direction:column;gap:2px;}
.cargo-sum .c .k{font-size:11px;color:var(--muted);}
.cargo-sum .c .v{font-size:15px;font-weight:620;color:var(--ink);}
.cargo-scroll{max-height:220px;overflow-y:auto;}

/* ===== зона загрузки файла ===== */
.dropzone{border:1.5px dashed var(--azure);border-radius:12px;background:var(--azure-weak);padding:26px 20px;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;color:var(--azure);cursor:pointer;}
.dropzone svg{width:26px;height:26px;stroke:var(--azure);fill:none;stroke-width:1.7;}
.dropzone .big{font-size:13.5px;font-weight:620;color:var(--ink);}
.dropzone .sm{font-size:11.5px;color:var(--muted);}

/* ===== пагинация ===== */
.pager{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 18px;border-top:1px solid var(--line);font-size:12.5px;color:var(--muted);}
.pager .pages{display:flex;gap:4px;align-items:center;}
.pager .pg{min-width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;padding:0 8px;border-radius:7px;border:1px solid var(--line);background:var(--card);color:var(--ink);text-decoration:none;font-weight:560;font-variant-numeric:tabular-nums;cursor:pointer;}
.pager .pg:hover{background:var(--panel);}
.pager .pg.on{background:var(--azure);color:#fff;border-color:var(--azure);}
.pager .pg.nav{color:var(--muted);}
.pager .pg[aria-disabled="true"]{opacity:.4;cursor:not-allowed;}

/* ===== empty ===== */
.empty{text-align:center;color:var(--muted);font-size:13px;padding:40px 20px;}

/* ===== login ===== */
.login{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--navy);}
.login .box{background:var(--card);border-radius:16px;padding:34px 32px;width:380px;max-width:92vw;box-shadow:0 24px 60px rgba(6,22,40,.4);}
.login .brand{display:flex;align-items:center;gap:10px;margin-bottom:6px;}
.login .brand .mark{background:var(--azure);color:#fff;font-weight:700;font-size:15px;padding:5px 11px;border-radius:8px;letter-spacing:.05em;}
.login .brand .nm{font-size:15px;font-weight:640;}
.login .lead{font-size:12.5px;color:var(--muted);margin-bottom:22px;}

/* ============================================================
   Светофор · инфографика · иконки · логотип (handoff «Глубокая вода»+)
   ============================================================ */
:root{
  --gold:#C9A24B; --gold-2:#E8C776; --gold-deep:#B08328; --gold-weak:#F6EDD6;
  --led-y:#C9931F; --tone-y-bg:#FCF6EA; --tone-r-bg:#FDF1EF; --ring-track:#E4EBF1;
}

/* ===== логотип (волна-чек, золотая плашка) ===== */
.brandmark{border-radius:24%;background:linear-gradient(135deg,var(--gold-2) 0%,var(--gold) 100%);
  display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;}
.brandmark svg{width:62%;height:62%;stroke:var(--navy);stroke-width:3.6;fill:none;}
.brandmark.sm{border-radius:7px;}
.gold-word{color:var(--gold-deep);}

/* ===== светофор (LED) ===== */
.led{width:9px;height:9px;border-radius:50%;display:inline-block;flex-shrink:0;background:var(--azure);}
.led.g{background:var(--pos); box-shadow:0 0 0 3px rgba(28,122,90,.16);}
.led.y{background:var(--led-y); box-shadow:0 0 0 3px rgba(156,106,18,.16);}
.led.r{background:var(--neg); box-shadow:0 0 0 3px rgba(192,68,58,.16);}
.led.b{background:var(--azure); box-shadow:0 0 0 3px rgba(22,104,176,.14);}
.led.lg{width:10px;height:10px;}
tr.tone-y{background:var(--tone-y-bg);}
tr.tone-r{background:var(--tone-r-bg);}
tr.tone-y:hover,tr.tone-r:hover{filter:brightness(.985);}
td.led-cell{width:22px;padding-right:0;}
.gate-check li .led{margin-right:8px;}
.gate-check li.attn{background:var(--tone-y-bg);margin:0 -18px;padding-left:18px;padding-right:18px;}

/* ===== метрика с иконкой + светофором ===== */
.metric{position:relative;overflow:hidden;}
.metric.tone-g::before,.metric.tone-y::before,.metric.tone-r::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:4px;}
.metric.tone-g::before{background:var(--pos);}
.metric.tone-y::before{background:var(--led-y);}
.metric.tone-r::before{background:var(--neg);}
.metric .k-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;}
.metric .k-ic{width:26px;height:26px;border-radius:8px;background:var(--azure-weak);color:var(--azure);
  display:flex;align-items:center;justify-content:center;}
.metric .k-ic svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.8;}
.metric.tone-g .k-ic{background:var(--pos-weak);color:var(--pos);}
.metric.tone-y .k-ic{background:var(--warn-weak);color:var(--led-y);}
.metric.tone-r .k-ic{background:var(--neg-weak);color:var(--neg);}
.metric.tone-r .v{color:var(--neg);}

/* ===== панель «Здоровье портфеля» · донат · стек · легенда ===== */
.health .health-b{display:flex;gap:24px;align-items:center;flex-wrap:wrap;}
.donut{width:120px;height:120px;border-radius:50%;position:relative;flex-shrink:0;}
.donut::after{content:"";position:absolute;inset:18px;background:var(--card);border-radius:50%;}
.donut .cap{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;}
.donut .cap b{font-size:20px;font-weight:680;color:var(--ink);line-height:1;}
.donut .cap span{font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-top:3px;}
.legend{display:flex;flex-direction:column;gap:8px;font-size:12px;min-width:200px;}
.legend .li{display:flex;align-items:center;gap:8px;color:var(--slate);}
.legend .sw{width:9px;height:9px;border-radius:2px;flex-shrink:0;}
.legend b{margin-left:auto;color:var(--ink);font-variant-numeric:tabular-nums;}
.stack{height:14px;border-radius:7px;overflow:hidden;display:flex;width:100%;}
.stack > span{display:block;}

/* ===== прогресс-кольцо (N из M) ===== */
.ring{border-radius:50%;position:relative;flex-shrink:0;}
.ring::after{content:"";position:absolute;inset:8px;background:var(--card);border-radius:50%;}
.ring .cap{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;}
.ring .cap b{font-size:15px;font-weight:680;color:var(--ink);line-height:1;}
.ring .cap span{font-size:7.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin-top:2px;}

/* ===== платёжный календарь · шкала времени ===== */
.paycal{position:relative;height:150px;margin:6px 6px 0;}
.paycal .axis{position:absolute;left:0;right:0;top:74px;height:2px;background:var(--line);}
.paycal .today{position:absolute;top:8px;bottom:26px;width:2px;background:var(--azure);}
.paycal .today-lbl{position:absolute;top:0;transform:translateX(-50%);font-size:9px;font-weight:680;
  color:var(--azure);background:var(--azure-weak);padding:1px 6px;border-radius:10px;white-space:nowrap;}
.paycal .tick{position:absolute;top:80px;font-size:9px;color:#94A7B8;transform:translateX(-50%);}
.paycal .pin{position:absolute;top:70px;width:9px;height:9px;border-radius:50%;transform:translateX(-50%);border:2px solid var(--card);}
.paycal .evt{position:absolute;transform:translateX(-50%);width:120px;border:1px solid;border-radius:8px;padding:5px 8px;background:var(--card);}
.paycal .evt .h{display:flex;align-items:center;gap:5px;font-size:9px;font-weight:640;}
.paycal .evt .h .dot{width:7px;height:7px;border-radius:50%;flex-shrink:0;}
.paycal .evt .nm{font-size:10px;color:var(--ink);margin-top:2px;}
.paycal .evt .am{font-size:10px;font-weight:640;font-variant-numeric:tabular-nums;}
.paycal .evt.g{background:var(--pos-weak);border-color:#BFE0D3;}
.paycal .evt.g .h{color:var(--pos);} .paycal .evt.g .dot{background:var(--pos);}
.paycal .evt.r{background:var(--neg-weak);border-color:#E8C2BC;}
.paycal .evt.r .h{color:var(--neg);} .paycal .evt.r .dot{background:var(--neg);}
.paycal .evt.b{background:var(--azure-weak);border-color:#BBD5EC;}
.paycal .evt.b .h{color:var(--azure);} .paycal .evt.b .dot{background:var(--azure);}
.paycal .evt.y{background:var(--tone-y-bg);border-color:#E8D9A8;}
.paycal .evt.y .h{color:var(--led-y);} .paycal .evt.y .dot{background:var(--led-y);}
.paycal-undated{display:flex;gap:8px;flex-wrap:wrap;align-items:center;border-top:1px solid #EDF2F7;padding-top:9px;margin-top:2px;}
.paycal-undated .u{display:inline-flex;align-items:center;gap:6px;font-size:11px;color:var(--slate);background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:4px 10px;}

/* ===== секц-заголовок с иконкой ===== */
.section-h.ic-h{display:flex;align-items:center;gap:8px;}
.section-h.ic-h svg{width:17px;height:17px;stroke:var(--azure);fill:none;stroke-width:1.8;flex-shrink:0;}
.panel-h .hi{width:17px;height:17px;stroke:var(--azure);fill:none;stroke-width:1.8;flex-shrink:0;margin-right:2px;vertical-align:-3px;}

/* ===== две колонки для узких блоков рядом ===== */
.cols2{display:grid;grid-template-columns:1fr 1fr;gap:0 16px;align-items:start;}
.cols2 > div{min-width:0;}
.cols2 > div > .section-h:first-child{margin-top:0;}
@media(max-width:900px){.cols2{grid-template-columns:1fr;}}

/* ===== вход · сплит-макет ===== */
.login-split{min-height:100vh;display:flex;background:var(--navy);}
.login-brandpane{flex:1;background:linear-gradient(160deg,var(--navy) 0%,#0A2138 100%);color:#fff;padding:56px 48px;display:flex;flex-direction:column;justify-content:center;max-width:540px;}
.login-brandpane .lb-logo{display:flex;align-items:center;gap:12px;margin-bottom:34px;}
.login-brandpane .lb-logo .nm{font-size:17px;font-weight:640;color:#EAF1F8;}
.login-brandpane h2{font-size:26px;font-weight:660;line-height:1.25;margin-bottom:12px;letter-spacing:-.01em;}
.login-brandpane p{font-size:13.5px;color:var(--side-txt);line-height:1.6;margin-bottom:28px;max-width:400px;}
.lb-marks{display:flex;flex-direction:column;gap:14px;}
.lb-marks .m{display:flex;align-items:flex-start;gap:11px;font-size:13px;color:var(--side-ink);}
.lb-marks .m svg{width:20px;height:20px;stroke:var(--gold-2);fill:none;stroke-width:2;flex-shrink:0;margin-top:1px;}
.login-formpane{flex:1;display:flex;align-items:center;justify-content:center;padding:32px;background:var(--page);}
.login-formpane .box{width:400px;max-width:100%;}
.login-formpane h3{font-size:20px;font-weight:650;margin-bottom:4px;color:var(--ink);}
.login-formpane .sub{font-size:13px;color:var(--muted);margin-bottom:24px;}
.inp-ic{position:relative;}
.inp-ic > svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:16px;height:16px;stroke:var(--muted);fill:none;stroke-width:1.8;}
.inp-ic .inp{padding-left:36px;}
.field-2fa .inp{border-color:var(--azure);box-shadow:var(--ring);}
.login-secure{display:flex;align-items:center;gap:8px;font-size:11.5px;color:var(--muted);margin-top:20px;}
.login-secure svg{width:15px;height:15px;stroke:var(--pos);fill:none;stroke-width:1.8;}
@media(max-width:820px){.login-brandpane{display:none;}}

/* ===== календарь занятости причалов ===== */
.gantt-panel{overflow:hidden;}
.gantt-scroll{overflow-x:auto;}
.gantt{min-width:720px;padding:4px 0 8px;}
.g-row{display:flex;align-items:stretch;border-top:1px solid var(--line);}
.g-row.g-head{border-top:none;}
.g-name{width:180px;flex-shrink:0;padding:9px 14px;display:flex;flex-direction:column;gap:2px;
  font-size:13px;color:var(--ink);border-right:1px solid var(--line);}
.g-name small{font-size:11px;color:var(--muted);}
.g-head .g-name{font-size:11.5px;font-weight:680;color:var(--muted);text-transform:uppercase;letter-spacing:.03em;}
.g-track{position:relative;flex:1;min-height:38px;}
.g-head .g-track{min-height:26px;}
.g-day{position:absolute;top:0;bottom:0;display:flex;align-items:center;justify-content:center;
  font-size:10.5px;color:var(--muted);border-left:1px solid var(--line-soft,rgba(0,0,0,.05));}
.g-day i{font-style:normal;opacity:.7;}
.g-day.we{background:var(--page);}
.g-day.now{color:var(--azure);font-weight:700;}
.g-cell{position:absolute;top:0;bottom:0;border-left:1px solid rgba(0,0,0,.04);}
.g-cell.we{background:rgba(0,0,0,.022);}
.g-now{position:absolute;top:0;bottom:0;width:2px;background:var(--azure);opacity:.55;}
.g-bar{position:absolute;top:6px;bottom:6px;border-radius:7px;display:flex;align-items:center;
  padding:0 8px;font-size:11.5px;font-weight:620;color:#fff;text-decoration:none;overflow:hidden;
  background:var(--azure);border:1px solid rgba(255,255,255,.35);}
.g-bar span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.g-bar:hover{filter:brightness(1.08);}
.g-bar.mine{background:var(--pos);}
.gantt-legend{display:flex;gap:18px;align-items:center;border-top:1px solid var(--line);padding-top:10px;}
.gantt-legend .lg{display:inline-flex;align-items:center;gap:7px;font-size:11.5px;color:var(--muted);}
.gantt-legend .sw{width:14px;height:10px;border-radius:3px;display:inline-block;}
.gantt-legend .sw.busy{background:var(--azure);}
.gantt-legend .sw.mine{background:var(--pos);}
.gantt-legend .sw.free{background:var(--panel);border:1px solid var(--line);}

/* ===== флажок в форме ===== */
.chk{display:inline-flex;align-items:center;gap:9px;font-size:13px;color:var(--ink);cursor:pointer;
  padding:9px 12px;border:1px solid var(--line);border-radius:9px;background:var(--card);}
.chk input{width:16px;height:16px;accent-color:var(--azure);cursor:pointer;}
.chk:hover{border-color:var(--azure);}

/* ===== пара дат в одном поле ===== */
.pair{display:flex;align-items:center;gap:8px;}
.pair .inp{flex:1;min-width:0;}
.pair .dash{color:var(--muted);flex-shrink:0;}

/* ===== пакет данных захода ===== */
.led.o{background:transparent;border:1.5px solid var(--muted);box-shadow:none;}
.metric .v.sm{font-size:17px;line-height:1.25;}
.pkg-sum{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-bottom:14px;}
.pkg-bar{flex:1;min-width:160px;height:8px;margin-left:6px;}
.pkg-grid{columns:2;column-gap:32px;}
.pkg-group{break-inside:avoid;margin-bottom:14px;}
.pkg-gh{font-size:11px;font-weight:680;color:var(--slate);text-transform:uppercase;letter-spacing:.04em;margin-bottom:2px;}
.pkg-t{display:flex;align-items:flex-start;gap:0;min-width:0;}
.pkg-t .led{margin-top:5px;}
.pkg-t b{font-weight:600;}
.pkg-t small{display:block;color:var(--muted);font-size:11.5px;margin-top:1px;}
.pkg-group .gate-check li{align-items:flex-start;}
.pkg-group .gate-check li.attn{margin:0 -8px;padding-left:8px;padding-right:8px;border-radius:6px;}
.pkg-foot{font-size:12px;color:var(--muted);border-top:1px solid var(--line);}
@media(max-width:900px){.pkg-grid{columns:1;}}

/* ===== шкала длительности этапа: ориентир посередине ===== */
.dbar{position:relative;height:8px;min-width:110px;background:var(--ring-track);border-radius:4px;overflow:hidden;}
.dbar span{display:block;height:100%;background:var(--azure);border-radius:4px;}
.dbar.over span{background:var(--led-y);}
.dbar i{position:absolute;left:50%;top:0;bottom:0;width:2px;background:var(--ink);opacity:.45;}
td.over{color:var(--warn);font-weight:640;}
.mut{color:var(--muted);}
td .cell-sub{display:block;color:var(--muted);font-size:11.5px;margin-top:1px;}
td.nowrap{white-space:nowrap;}
td .run{color:var(--azure);font-style:italic;}
