/* ---------- Главный экран — рабочий фокус (14.09.2026) ----------
   Экран поверх шапки: общая шапка с суммами, «Задачами», «Доской», «Акциями» здесь не нужна
   (решение владельца). Один лист 16:9 без прокрутки: единица --u = 1% высоты «слайда», слайд
   вписан в окно целиком, всё внутри меряется в --u. Окна (.modal, z 20) и тосты — поверх.
   На телефоне слайд не влезает — обычная страница с прокруткой. Логика — static/home.js. */
#view-home{--u:min(1vh,.5625vw);--hm-ink:#15171d;--hm-mut:#6f737d;--hm-brand:#d81f26;
  --hm-wb:#c21aa8;--hm-oz:#1d6bff;--hm-up:#12824f;
  position:fixed;inset:0;z-index:15;overflow:hidden;background:#fbf6f1;color:var(--hm-ink);
  font:500 calc(var(--u)*1.45)/1.4 Onest,"Segoe UI",system-ui,sans-serif;font-variant-numeric:tabular-nums}
#home-bg{position:absolute;inset:0;width:100%;height:100%;display:block}
#view-home.nogl{background:radial-gradient(60% 50% at 40% 60%,#ffd6c4,transparent 70%),
  radial-gradient(40% 40% at 75% 30%,#ffd0e6,transparent 70%),#fbf6f1}
#view-home.nogl #home-bg{display:none}

.hm-page{position:relative;z-index:1;box-sizing:border-box;width:calc(var(--u)*177.78);height:calc(var(--u)*100);
  margin:calc((100vh - var(--u)*100)/2) auto 0;padding:calc(var(--u)*2.6) calc(var(--u)*4);
  display:grid;grid-template-rows:calc(var(--u)*4.2) auto 1fr auto calc(var(--u)*27.5);row-gap:calc(var(--u)*1.6)}
.hm-page *{box-sizing:border-box}

.hm-top{display:flex;align-items:center;gap:calc(var(--u)*1.6)}
.hm-logo{font-weight:800;font-size:calc(var(--u)*1.7);display:flex;gap:calc(var(--u)*1);align-items:center}
.hm-logo i{width:calc(var(--u)*3.2);height:calc(var(--u)*3.2);border-radius:50%;background:var(--hm-brand);color:#fff;
  display:grid;place-items:center;font-style:normal}
.hm-sp{flex:1}
.hm-fresh{color:var(--hm-mut);font-size:calc(var(--u)*1.35);display:flex;align-items:center;gap:calc(var(--u)*.7)}
.hm-fresh:not(:empty)::before{content:"";width:calc(var(--u)*.8);height:calc(var(--u)*.8);border-radius:50%;background:#2fbf71;
  box-shadow:0 0 0 calc(var(--u)*.35) rgba(47,191,113,.2)}
.hm-me{position:relative}
.hm-me-btn{display:flex;align-items:center;gap:calc(var(--u)*1);font:600 calc(var(--u)*1.45) Onest,"Segoe UI",sans-serif;color:var(--hm-ink);
  background:rgba(255,255,255,.8);border:0;padding:calc(var(--u)*.5) calc(var(--u)*.5) calc(var(--u)*.5) calc(var(--u)*1.5);border-radius:999px;cursor:pointer}
.hm-me-btn b{width:calc(var(--u)*3);height:calc(var(--u)*3);border-radius:50%;background:var(--hm-ink);color:#fff;display:grid;place-items:center;font-size:calc(var(--u)*1.2)}
.hm-menu{position:absolute;right:0;top:calc(100% + var(--u)*.8);background:#fff;border-radius:calc(var(--u)*1.4);padding:calc(var(--u)*.6);
  min-width:calc(var(--u)*16);box-shadow:0 calc(var(--u)*1.5) calc(var(--u)*4) rgba(20,20,30,.2);z-index:3;display:flex;flex-direction:column}
.hm-menu button{border:0;background:none;text-align:left;font:500 calc(var(--u)*1.45) Onest,"Segoe UI",sans-serif;color:var(--hm-ink);
  padding:calc(var(--u)*.9) calc(var(--u)*1.2);border-radius:calc(var(--u)*.9);cursor:pointer}
.hm-menu button:hover{background:#f3efe9}

.hm-hi h1{margin:0;font-size:calc(var(--u)*4.6);line-height:1.1;letter-spacing:-.035em;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--hm-ink)}
.hm-hi h1 span{background:linear-gradient(90deg,#d81f26,#ff7a3d 50%,#b3179a);-webkit-background-clip:text;background-clip:text;color:transparent}
.hm-fade{animation:hmFade .7s cubic-bezier(.2,.8,.2,1) both}
@keyframes hmFade{from{opacity:0;transform:translateY(calc(var(--u)*1))}}

.hm-card{border-radius:calc(var(--u)*2.4);padding:calc(var(--u)*1.9) calc(var(--u)*2.2);background:rgba(255,255,255,.93);
  box-shadow:0 calc(var(--u)*1.8) calc(var(--u)*4) calc(var(--u)*-3) rgba(40,20,20,.45);position:relative;overflow:hidden;min-height:0}
.hm-cap{color:var(--hm-mut);font-weight:700;font-size:calc(var(--u)*1.15);text-transform:uppercase;letter-spacing:.07em}

.hm-pulse{display:grid;grid-template-columns:1.25fr 1fr;gap:calc(var(--u)*1.4);min-height:0}
.hm-mps{display:grid;grid-template-rows:1fr 1fr;gap:calc(var(--u)*1.4);min-height:0}

.hm-chart{display:flex;flex-direction:column}
.hm-ch-head{display:flex;align-items:flex-start;justify-content:space-between;gap:calc(var(--u)*1.2)}
.hm-sum{font-size:calc(var(--u)*3.2);font-weight:800;letter-spacing:-.03em;line-height:1.1;margin-top:calc(var(--u)*.3)}
.hm-sum em{font-style:normal;font-size:calc(var(--u)*1.4);font-weight:700;margin-left:calc(var(--u)*.8)}
.hm-leg{display:flex;gap:calc(var(--u)*1.8)}
.hm-leg div{display:flex;flex-direction:column;align-items:flex-end}
.hm-leg span{display:flex;align-items:center;gap:calc(var(--u)*.6);font-size:calc(var(--u)*1.25);color:var(--hm-mut);font-weight:600}
.hm-leg i{width:calc(var(--u)*1.6);height:calc(var(--u)*.45);border-radius:9px}
.hm-leg i.wb{background:var(--hm-wb)}.hm-leg i.oz{background:var(--hm-oz)}
.hm-leg b{font-size:calc(var(--u)*1.8)}
.hm-tip{height:calc(var(--u)*2.2);margin-top:calc(var(--u)*.6);font-size:calc(var(--u)*1.3);color:var(--hm-mut);white-space:nowrap;overflow:hidden}
.hm-tip b{color:var(--hm-ink)}
.hm-plot{flex:1;min-height:0;position:relative}
.hm-plot svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.hm-plot text{font:500 calc(var(--u)*1.2) Onest,"Segoe UI",sans-serif;fill:#8a8e97}
.hm-plot .grid{stroke:#ece8e3;stroke-width:1}
.hm-plot .ln{fill:none;stroke-width:calc(var(--u)*.35);stroke-linejoin:round;stroke-linecap:round}
.hm-plot .guide{stroke:#15171d;stroke-width:1;stroke-dasharray:3 4;opacity:0;transition:opacity .15s}
.hm-plot .pt{stroke:#fff;stroke-width:calc(var(--u)*.25)}
.hm-empty{color:var(--hm-mut);display:grid;place-items:center;height:100%}

.hm-mp{color:#fff;display:flex;flex-direction:column}
.hm-mp.wb{background:linear-gradient(135deg,#c21aa8,#5a1480)}
.hm-mp.oz{background:linear-gradient(135deg,#1d6bff,#0a3fc4)}
.hm-mp::after{content:"";position:absolute;right:calc(var(--u)*-6);top:calc(var(--u)*-7);width:calc(var(--u)*22);height:calc(var(--u)*22);border-radius:50%;background:rgba(255,255,255,.09);pointer-events:none}
.hm-mp .hm-cap{color:rgba(255,255,255,.78)}
.hm-mp-row{display:grid;grid-template-columns:1.2fr 1fr;gap:calc(var(--u)*1.8);margin:auto 0}
.hm-kpi .l{font-size:calc(var(--u)*1.25);color:rgba(255,255,255,.78)}
.hm-kpi .v{font-size:calc(var(--u)*3.4);font-weight:800;letter-spacing:-.03em;line-height:1.15;white-space:nowrap}
.hm-d{display:inline-flex;align-items:center;gap:calc(var(--u)*.4);margin-top:calc(var(--u)*.5);font-size:calc(var(--u)*1.3);font-weight:700;
  padding:calc(var(--u)*.2) calc(var(--u)*.9);border-radius:999px;background:rgba(255,255,255,.2)}
.hm-d.good::before{content:"▲";font-size:.7em}.hm-d.bad::before{content:"▼";font-size:.7em}
.hm-d.bad{background:rgba(40,0,10,.3)}
.hm-mp .per{font-size:calc(var(--u)*1.2);color:rgba(255,255,255,.72)}

.hm-sec{margin:0;font-size:calc(var(--u)*2.3);letter-spacing:-.02em;align-self:end;color:var(--hm-ink);font-weight:700}
.hm-depts{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:calc(var(--u)*1.2);min-height:0}
.hm-dept{padding:calc(var(--u)*1.5) calc(var(--u)*1.2);display:flex;flex-direction:column;gap:calc(var(--u)*.8)}
.hm-dept header{display:flex;align-items:center;gap:calc(var(--u)*.8);padding:0 calc(var(--u)*.5)}
.hm-dept .em{width:calc(var(--u)*3);height:calc(var(--u)*3);border-radius:calc(var(--u)*.9);display:grid;place-items:center;font-size:calc(var(--u)*1.6);background:#f3efe9;flex:none}
.hm-dept h3{margin:0;font-size:calc(var(--u)*1.65);letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* 22.09.2026: в «Планировании» шесть отчётов — последний обрезался. Ссылки компактнее, строка разделов
   выше (27,5u за счёт графика): влезает до 7 ссылок; больше — список прокручивается, а не режется. */
.hm-links{display:flex;flex-direction:column;gap:calc(var(--u)*.2);min-height:0;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin}
.hm-links button{display:flex;align-items:center;gap:calc(var(--u)*.7);padding:calc(var(--u)*.55) calc(var(--u)*.7);flex:none;border:0;background:none;border-radius:calc(var(--u)*1);
  text-align:left;color:var(--hm-ink);font:500 calc(var(--u)*1.35)/1.2 Onest,"Segoe UI",sans-serif;cursor:pointer;transition:background .15s}
.hm-links button:hover{background:#f1ede7}
.hm-links .dot{width:calc(var(--u)*.6);height:calc(var(--u)*.6);border-radius:50%;background:#d3d5da;flex:none}
.hm-links .ready{background:linear-gradient(90deg,#fdeceb,#fff5f0);font-weight:700}
.hm-links .ready .dot{background:var(--hm-brand);box-shadow:0 0 0 calc(var(--u)*.3) rgba(216,31,38,.15)}
.hm-links .soon{color:#8f939b;cursor:default}
/* закрытый отчёт (app/report_access.py): плитка видна, но приглушена, справа замочек; по клику —
   окно «нет доступа» (#modal-lock, static/app.js reportLockedNotice) */
.hm-links .ready.locked{background:#f4f4f5;color:#6b7078;font-weight:600}
.hm-links .ready.locked .dot{background:#b8bcc4;box-shadow:none}
.hm-links .ready.locked:hover{background:#ecedef}
.hm-lock{margin-left:auto;font-size:.85em;opacity:.8}
#modal-lock{z-index:40}
.lock-box{max-width:420px;padding:22px 24px;text-align:center}
.lock-box .lock-ico{font-size:30px;line-height:1}
.lock-box h3{margin:8px 0 6px;font-size:16px}
.lock-box .lock-reason{margin:0 0 6px}
.lock-box .lock-how{font-size:12px;margin:0 0 10px}
.lock-box textarea{width:100%;box-sizing:border-box;resize:vertical;font-size:12px}
.lock-actions{display:flex;gap:8px;justify-content:center;margin-top:10px}

/* ---------- Адаптивность для планшетов и мобильных (Responsive Media Queries) ---------- */
@media (max-width: 1240px) and (min-width: 761px) {
  #view-home { overflow-y: auto !important; }
  .hm-page {
    width: 96vw !important;
    height: auto !important;
    min-height: 100vh !important;
    margin: 12px auto !important;
    grid-template-rows: auto auto auto auto 1fr !important;
    padding: 16px 20px 32px !important;
    row-gap: 16px !important;
  }
  .hm-depts {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }
}

@media (max-width: 940px) and (min-width: 761px) {
  .hm-depts {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 760px) {
  #view-home { --u: 7px; overflow-x: hidden !important; overflow-y: auto !important; }
  .hm-page {
    width: 100vw !important;
    max-width: 100vw !important;
    height: auto !important;
    margin: 0 !important;
    padding: 12px !important;
    grid-template-rows: none !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
    overflow-x: hidden !important;
  }
  .hm-pulse { grid-template-columns: 1fr !important; gap: 12px !important; }
  .hm-chart { height: 300px !important; min-width: 0 !important; width: 100% !important; }
  .hm-mp { min-height: 140px !important; }
  .hm-depts {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)) !important;
    gap: 10px !important;
    width: 100% !important;
  }
  .hm-hi h1 { white-space: normal !important; font-size: 22px !important; }
}