/* Аудитор закупівель — стилі інтерфейсу.
   Підключається з app/web_ui.py (_CSS_HREF), кеш збивається версією пакета. */
:root{--bg:#0f1117;--card:#171a23;--mut:#8b93a7;--line:#262b38;--fg:#e6e9f0;
 --wrap:1280px}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font:15px/1.5 system-ui,Segoe UI,Roboto,sans-serif}
.wrap{max-width:var(--wrap);margin:0 auto;padding:28px 18px}
h1{font-size:22px;margin:0 0 4px} .sub{color:var(--mut);margin:0 0 22px}
.drop{border:2px dashed var(--line);border-radius:14px;padding:30px;text-align:center;background:var(--card)}
input[type=file]{margin:12px 0;color:var(--fg)}
button{background:#3b82f6;color:#fff;border:0;border-radius:9px;padding:11px 20px;font-size:15px;cursor:pointer}
button:hover{background:#2f6fd6}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px;margin:16px 0}
.fname{font-weight:600;font-size:16px;word-break:break-word}
.badge{font-size:11px;padding:2px 8px;border-radius:20px;margin-left:8px;vertical-align:middle}
.b-cache{background:#1e3a2f;color:#7ee2a8} .b-fresh{background:#3a341e;color:#e7cf7e}
.b-doc{background:#222838;color:#9fb0d0}
.banner{border-radius:10px;padding:10px 12px;margin:12px 0;font-weight:600}
.s-d8{background:#3a1e22;color:#ff9aa6;border:1px solid #5a2a30}
.s-ok{background:#16301f;color:#86e6a6;border:1px solid #245036}
.s-unreliable,.s-implausible{background:#3a341e;color:#f0d98a;border:1px solid #5a4f2a}
.s-not_found,.s-na{background:#202430;color:#9aa3b6;border:1px solid #2c3242}
.tscroll{overflow-x:auto;margin:6px 0 4px}
table.items{width:100%;min-width:620px;border-collapse:collapse;font-size:14px}
table.items th{text-align:left;color:var(--mut);font-weight:600;font-size:12px;
 padding:6px 8px;border-bottom:1px solid var(--line)}
table.items td{padding:8px;border-top:1px solid var(--line);vertical-align:top}
td.c,th.c{text-align:center} td.r,th.r{text-align:right}
.sub2{color:var(--mut);font-size:12px;margin-top:2px}
.skiphint{cursor:help;border-bottom:1px dotted #566}
.caveat{color:#f0d98a;font-size:12px;margin-top:3px}
.save{color:#ff9aa6;font-weight:600}
.cost{color:#8b96a5;font-weight:600}
.chips{margin:10px 0}
.chip{display:inline-block;background:#222838;border:1px solid var(--line);color:#cdd6e6;
 font-size:12px;padding:3px 9px;border-radius:20px;margin:3px 4px 0 0}
.comment{color:#cfd6e4;margin:8px 0}
.muted{color:var(--mut);font-size:13px}
a{color:#7fb0ff}
details{margin-top:8px} summary{cursor:pointer;color:var(--mut);font-size:13px}
.why{font-size:13px;color:#c7cede;margin:4px 0 0 6px}
.docbtn{display:inline-block;margin:10px 0 2px;background:#222838;border:1px solid var(--line);
 color:#7fb0ff;font-size:13px;padding:6px 13px;border-radius:8px;cursor:pointer;text-decoration:none}
.docbtn:hover{background:#2a3142}
.overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.72);z-index:50;padding:22px}
.overlay.open{display:flex;flex-direction:column}
.ovbar{display:flex;justify-content:space-between;align-items:center;gap:12px;color:#fff;margin-bottom:10px}
.ovbar .nm{font-weight:600;word-break:break-word}
.ovclose{background:#3b82f6;border:0;color:#fff;border-radius:8px;padding:7px 15px;cursor:pointer;flex:none}
.overlay iframe{flex:1;width:100%;border:0;border-radius:10px;background:#fff}
nav.top{display:flex;gap:8px;margin:0 0 18px;flex-wrap:wrap}
nav.top a{color:#cdd6e6;text-decoration:none;font-size:14px;padding:7px 14px;
 border-radius:9px;border:1px solid var(--line);background:var(--card)}
nav.top a.act{background:#3b82f6;color:#fff;border-color:#3b82f6}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin:0 0 18px}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px 16px}
.kpi .v{font-size:26px;font-weight:700;margin-top:2px}
.kpi .v.red{color:#ff9aa6}.kpi .v.green{color:#86e6a6}.kpi .v.yellow{color:#f0d98a}
.kpi .l{color:var(--mut);font-size:13px}
.kpi .s{color:var(--mut);font-size:12px;margin-top:2px}
.tabs{display:flex;gap:6px;margin:0 0 6px;flex-wrap:wrap}
.tab{cursor:pointer;font-size:13px;padding:6px 13px;border-radius:20px;
 border:1px solid var(--line);background:var(--card);color:#cdd6e6}
.tab.act{background:#3b82f6;border-color:#3b82f6;color:#fff}
table.cmp{width:100%;min-width:620px;border-collapse:collapse;font-size:14px}
table.cmp th{text-align:left;color:var(--mut);font-weight:600;font-size:12px;
 padding:7px 8px;border-bottom:1px solid var(--line)}
table.cmp td{padding:8px;border-top:1px solid var(--line);vertical-align:top}
.trend-up{color:#86e6a6}.trend-down{color:#ff9aa6}.trend-same{color:var(--mut)}
.stchip{font-size:12px;padding:2px 9px;border-radius:20px;white-space:nowrap}
.vform{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:0 0 16px}
select,input[type=text]{background:var(--card);color:var(--fg);border:1px solid var(--line);
 border-radius:8px;padding:8px 10px;font-size:14px}
.snapform{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:10px}
ol.flaglist{margin:10px 0 4px;padding-left:22px}
ol.flaglist li{margin:5px 0;font-size:14px;position:relative}
ol.flaglist .fldot{display:inline-block;width:9px;height:9px;border-radius:50%;
 margin-right:7px;vertical-align:1px}
li.fl-red .fldot{background:#ff5c70} li.fl-red b{color:#ff9aa6}
li.fl-yellow .fldot{background:#e6c34a} li.fl-yellow b{color:#f0d98a}
li.fl-gray .fldot{background:#6b7488} li.fl-gray b{color:#aab3c5}
.flwhy{color:var(--mut);font-size:13px}
.s-best{background:#123a2a;color:#7ff0b0;border:1px solid #1e5c40}
.stale{color:#f0d98a;font-size:12px;margin-left:6px}
.mailbar{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin:0 0 16px}
.calwrap{display:flex;gap:20px;flex-wrap:wrap;align-items:flex-start}
.calbox{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px 14px;flex:none}
.calhead{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:6px}
.calhead a{text-decoration:none;font-size:17px;padding:0 8px}
table.cal{border-collapse:separate;border-spacing:3px}
table.cal th{color:var(--mut);font-size:11px;font-weight:600;padding:2px;text-align:center}
table.cal td{width:40px;height:40px;text-align:center;border-radius:9px;font-size:13px;color:#5b6377;vertical-align:middle}
table.cal td.has{background:#222838;color:var(--fg)}
table.cal td.has a{color:var(--fg);text-decoration:none;display:block;padding:3px 0}
table.cal td.sel{outline:2px solid #3b82f6}
table.cal td.today{box-shadow:inset 0 0 0 1px #3b82f6}
.calcnt{display:block;font-size:10px;line-height:1;color:#7fb0ff}
.daycol{flex:1;min-width:340px}
.daynav{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:0 0 4px}
.daynav b{font-size:17px}
.navbtn{display:inline-block;background:#222838;border:1px solid var(--line);
 color:#7fb0ff;font-size:13px;padding:6px 13px;border-radius:8px;cursor:pointer;text-decoration:none}
.navbtn:hover{background:#2a3142}
.mailmeta{color:var(--mut);font-size:13px;margin-top:2px}
.mailnode{background:var(--card);border:1px solid var(--line);border-radius:14px;margin:14px 0;overflow:hidden}
.mailnode>summary{list-style:none;cursor:pointer;padding:13px 16px;display:flex;gap:11px;align-items:flex-start}
.mailnode>summary::-webkit-details-marker,.docnode>summary::-webkit-details-marker{display:none}
.mailnode>summary:hover{background:#1b202c}
.arr{flex:none;color:var(--mut);font-size:12px;line-height:1.6;transition:transform .15s}
details[open]>summary>.arr{transform:rotate(90deg)}
.mlhead{flex:1;min-width:200px}
.mlroll{display:flex;gap:8px;align-items:center;flex-wrap:wrap;flex:none;max-width:45%;
 justify-content:flex-end;font-size:13px;color:var(--mut);padding-top:2px}
.mlroll .save{font-size:13px}
.docnode{border-top:1px solid var(--line)}
.docnode>summary{list-style:none;cursor:pointer;padding:10px 16px 10px 22px;
 display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.docnode>summary:hover{background:#1b202c}
.docfname{flex:1;min-width:180px;font-size:14px;word-break:break-word}
.docbody{padding:0 16px 6px 22px}
.docbody .card{margin:8px 0}
.docbody .banner{margin:8px 0}
.jobpanel{background:var(--card);border:1px solid #2a3a5c;border-radius:14px;padding:14px 16px;margin:0 0 16px}
.jobtop{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.jobtop b{font-size:14px}
.jobcounts,.jobtime{color:var(--mut);font-size:13px}
.jobdetail{color:var(--mut);font-size:13px;margin-top:4px;word-break:break-word;white-space:pre-line}
.pbar{height:8px;background:#222838;border-radius:6px;margin-top:10px;overflow:hidden}
.pfill{height:100%;width:0%;background:#3b82f6;border-radius:6px;transition:width .5s ease}
.pfill.ind{width:35%;animation:pind 1.4s infinite ease-in-out}
@keyframes pind{0%{margin-left:-35%}100%{margin-left:100%}}
.spin{width:14px;height:14px;border:2px solid #3b82f6;border-top-color:transparent;border-radius:50%;
 display:inline-block;animation:spin .9s linear infinite;flex:none}
@keyframes spin{to{transform:rotate(360deg)}}
.jobnote{margin-top:10px;font-weight:600;color:#86e6a6}
.jobnote.err{color:#ff9aa6}
.steps{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.stepchip{font-size:12px;padding:3px 10px;border-radius:20px;border:1px solid var(--line);
 background:#1a1e29;color:#6b7488}
.stepchip.act{background:#1d2b4a;border-color:#3b82f6;color:#cfe0ff}
.stepchip.done{background:#16301f;border-color:#245036;color:#86e6a6}
button:disabled{opacity:.55;cursor:default}
.lblrow{margin-top:5px;display:flex;gap:6px;align-items:flex-start;flex-wrap:wrap}
.lblrow form{display:inline-flex;gap:6px;align-items:center;margin:0}
.lblform{align-items:flex-start;flex-wrap:wrap}
/* Причина спростування: згорнута, поки не натиснуто «хибно». Розкрита —
   забирає весь рядок, щоб текстарія не тулилась збоку від кнопок. */
.lblno{display:inline-block;margin:0}
.lblno[open]{flex:1 0 100%}
.lblno>summary{list-style:none;display:inline-flex;align-items:center}
.lblno>summary::-webkit-details-marker{display:none}
.lblnobox{display:flex;flex-direction:column;gap:8px;margin-top:8px;padding:10px;
 background:#1a1e29;border:1px solid var(--line);border-radius:8px}
.lblhint{color:var(--mut);font-size:12px;line-height:1.45}
.lblta{background:var(--card);border:1px solid var(--line);color:var(--fg);
 border-radius:8px;padding:8px 10px;font-size:13px;line-height:1.45;
 font-family:inherit;width:100%;min-height:78px;resize:vertical}
.lblta:focus-visible{outline:none;border-color:#3b82f6;
 box-shadow:0 0 0 3px rgba(59,130,246,.24)}
.lblnoact{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
/* Збережена причина: pre-line тримає абзаци, які написала людина. */
.lblreason{border-left:3px solid #5a2a30;padding-left:12px;margin:6px 0 0;
 color:#c7cede;font-size:13px;line-height:1.45;white-space:pre-line;
 max-width:640px}
.lblbtn{background:#222838;border:1px solid var(--line);color:#cdd6e6;
 font-size:12px;padding:3px 10px;border-radius:14px;cursor:pointer}
.lblbtn:hover{background:#2a3142}
.lblbtn.yes:hover{background:#16301f;border-color:#245036}
.lblbtn.no:hover{background:#3a1e22;border-color:#5a2a30}
.lblin{background:var(--card);border:1px solid var(--line);color:var(--fg);
 border-radius:8px;padding:3px 8px;font-size:12px;width:150px}
.lblchip{font-size:12px;padding:2px 9px;border-radius:14px}
.lblchip.ok{background:#16301f;color:#86e6a6;border:1px solid #245036}
.lblchip.bad{background:#3a1e22;color:#ff9aa6;border:1px solid #5a2a30}
.lblchip.ff{background:#1d2b4a;color:#cfe0ff;border:1px solid #3b82f6}
.lblclear{background:none;border:none;color:var(--mut);font-size:12px;
 cursor:pointer;padding:0 4px}
select.lblin{width:auto}
.lesson{border-left:3px solid var(--line);padding-left:12px;margin:12px 0}
.lesson.st-corroborated{border-color:#e6c34a}
.lesson.st-hypothesis{border-color:#6b7488}
.lesson.st-ratified{border-color:#3b82f6}
.lesson.st-implemented,.lesson.st-verified{border-color:#2ea36b}
.lesson.st-rejected{border-color:#5a2a30;opacity:.65}
.lesson .lt{font-weight:600}
.lesson .lmeta{color:var(--mut);font-size:12px;margin:2px 0}

/* --- Мобільна адаптація (телефони; S25 Ultra ≈ 412 CSS px) ----------------
   Сторінка по вертикалі ніколи не скролиться вбік: усе широке (таблиці)
   скролиться всередині .tscroll, решта перелаштовується в одну колонку. */
@media (max-width:760px){
 .wrap{padding:14px 10px}
 h1{font-size:19px}
 /* Навігація — один рядок з горизонтальним скролом замість трьох рядків. */
 nav.top{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;
  padding-bottom:4px;margin-bottom:14px}
 nav.top a{flex:none;white-space:nowrap}
 /* Контент дня — першим, календар — під ним: за день ходять кнопками
    ← →, а календар потрібен рідше. */
 .calwrap{gap:14px}
 .daycol{order:1;min-width:0;flex:1 1 100%}
 .calbox{order:2;flex:1 1 100%}
 table.cal{margin:0 auto}
 .calhead a{padding:6px 12px}
 /* Зведення листа (крапки, вигода) — під заголовок, а не в тісний стовпчик
    праворуч від нього. */
 .mailnode>summary{flex-wrap:wrap;padding:11px 12px}
 .mlroll{flex:1 1 100%;max-width:100%;justify-content:flex-start;
  padding:2px 0 0 23px}
 .docnode>summary{padding:10px 12px}
 .docbody{padding:0 8px 6px 10px}
 .card{padding:12px;margin:12px 0}
 .drop{padding:20px 14px}
 /* Таблиці: щільніше, скрол усередині обгортки з інерцією. */
 .tscroll{-webkit-overflow-scrolling:touch}
 table.items,table.cmp{min-width:560px;font-size:13px}
 table.items td,table.cmp td{padding:7px 6px}
 /* Дотикові цілі: кнопки розмітки й навігації — під палець, не під курсор. */
 .lblbtn{padding:8px 14px;font-size:13px}
 .lblclear{padding:6px 10px;font-size:14px}
 .navbtn,.docbtn{padding:9px 14px}
 /* 16px у полях вводу — нижче цього мобільний браузер зумить сторінку
    при фокусі, і після введення причини верстка лишається збільшеною. */
 .lblta,.lblin,select,input[type=text]{font-size:16px}
 .kpi .v{font-size:22px}
 .overlay{padding:8px}
 .ovbar{margin-bottom:6px}
}

/* --- Облікові записи: навігація, вхід, адмінка, профіль компанії ----------- */
nav.top .who{margin-left:auto;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.whoname{color:var(--fg);font-size:13px;font-weight:600}
.whoco{color:var(--mut);font-size:12px;padding:2px 8px;border:1px solid var(--line);border-radius:20px}
.inl{display:inline-flex;gap:6px;align-items:center;margin:0}
.implbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;background:#3a2a10;
 border:1px solid #7a5a1a;color:#f5d58a;border-radius:10px;padding:9px 14px;margin:0 0 14px;font-size:14px}
.authbox{display:flex;justify-content:center;padding:6vh 0}
.authcard{background:var(--card);border:1px solid var(--line);border-radius:16px;
 padding:30px 28px;max-width:420px;width:100%;text-align:center}
.authcard.wide{max-width:560px;text-align:left}
.authcard h1{margin:6px 0 4px}
.authlogo{font-size:40px}
.gbtn{width:100%;margin:8px 0 0;padding:12px 18px;font-size:15px}
.gbtn.alt{background:#222838;border:1px solid var(--line);color:#cdd6e6}
.gbtn.alt:hover{background:#2a3142}
.gbtn:disabled{opacity:.5;cursor:default}
.legallinks{margin:18px 0 0;font-size:13px;color:var(--mut)}
.authcard.legal{max-width:760px}
.authcard.legal h2{font-size:16px;margin:22px 0 6px}
.authcard.legal p,.authcard.legal li{font-size:14px;margin:6px 0}
.authcard.legal ul{padding-left:22px}
.legalnav{display:flex;justify-content:space-between;font-size:13px;margin-bottom:6px}
.authdev{margin-top:18px;padding-top:14px;border-top:1px dashed var(--line)}
.authform label{display:block;margin:12px 0 0;color:var(--mut);font-size:13px}
.authform input[type=text],.mailform input[type=text],.mailform input[type=password]{display:block;width:100%;
 margin-top:4px;background:var(--bg);color:var(--fg);border:1px solid var(--line);border-radius:8px;padding:9px 10px;font-size:14px}
.authform .lblta{margin-top:4px}
.authact{display:flex;gap:10px;align-items:center;margin-top:16px}
.authact .gbtn{width:auto;margin:0}
.uchip{font-size:12px;padding:2px 9px;border-radius:14px;white-space:nowrap}
.uchip.ok{background:#16301f;color:#86e6a6;border:1px solid #245036}
.uchip.warn{background:#3a341e;color:#f0d98a;border:1px solid #5a4f2a}
.uchip.bad{background:#3a1e22;color:#ff9aa6;border:1px solid #5a2a30}
.uchip.off{background:#202430;color:#9aa3b6;border:1px solid #2c3242}
.ucell{display:flex;gap:9px;align-items:center;min-width:180px}
.avatar{width:30px;height:30px;border-radius:50%;flex:none;object-fit:cover}
.avatar.ph{display:inline-flex;align-items:center;justify-content:center;background:#222838;font-size:15px}
.aphead{display:flex;justify-content:space-between;gap:10px;align-items:center;flex-wrap:wrap}
.apinfo{margin:10px 0;font-size:14px;color:#cfd6e4}
.pre{white-space:pre-line}
.approve{display:flex;flex-direction:column;gap:6px;margin:8px 0 6px}
.aprow{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.chk{display:inline-flex;gap:6px;align-items:center;font-size:13px;color:#cdd6e6}
.nowrap{white-space:nowrap}
.mailform label{display:block;margin:10px 0 0;color:var(--mut);font-size:13px}
.mailform .chk{color:var(--fg);font-size:14px}
.mailform .lblta{margin-top:4px}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:0 16px}
.tabs a.tab{text-decoration:none}
@media (max-width:760px){
 nav.top .who{margin-left:0}
 .authcard{padding:22px 16px}
}
.legalfoot{margin:28px 0 8px;text-align:center;font-size:12px;color:var(--mut)}
.legalfoot a{color:var(--mut)}