/* OOD.BG Platform — UI components (values copied 1:1 from the prototype's inline styles)
   (c) DOBG — dobg.net. All rights reserved. */
body{margin:0}*{box-sizing:border-box}button,input,textarea{font-family:inherit}
a{color:var(--accentText)}a:hover{color:var(--accent)}
@keyframes pulse{50%{opacity:.3}}
.ic{font-family:'Material Symbols Rounded';line-height:1;font-weight:normal;font-style:normal;letter-spacing:normal;text-transform:none;white-space:nowrap;direction:ltr;font-feature-settings:'liga';-webkit-font-feature-settings:'liga';display:inline-block}
.mono{font-family:'JetBrains Mono',monospace}

/* app root */
.app{min-height:100vh;background:var(--bg);color:var(--ink);font-family:Onest,system-ui,sans-serif;-webkit-font-smoothing:antialiased;display:flex;flex-direction:column}

/* top bar — 56px */
.topbar{height:56px;flex:none;background:var(--bar);color:var(--barInk);display:flex;align-items:center;gap:14px;padding:0 18px;position:sticky;top:0;z-index:30}
.tb-home{flex:none;display:flex;align-items:center;gap:10px;border:none;background:transparent;color:inherit;cursor:pointer;padding:0;text-decoration:none}
.tb-home:hover{color:inherit}
.tb-apps{width:34px;height:34px;border-radius:10px;background:rgba(255,255,255,.08);display:grid;place-items:center;font-size:20px}
.wordmark{font-size:20px;font-weight:700;letter-spacing:-0.035em}.wordmark span{color:oklch(0.72 0.15 150)}
.tb-sep{width:1px;height:24px;flex:none;background:rgba(255,255,255,.15)}
.tb-mod{font-size:15px;font-weight:650;white-space:nowrap;flex:none}
.tb-menu{display:flex;gap:2px;margin-left:6px;flex-wrap:nowrap;overflow-x:auto;min-width:0;flex:0 1 auto;scrollbar-width:none}
.tb-menu::-webkit-scrollbar{display:none}
.tb-menu a{flex:none;white-space:nowrap;border:none;cursor:pointer;height:34px;padding:0 12px;border-radius:9px;background:transparent;color:inherit;font-size:13px;font-weight:500;display:flex;align-items:center;text-decoration:none}
.tb-menu a.on{background:rgba(255,255,255,.14);font-weight:650}
.tb-menu a:hover{color:inherit}
.tb-spacer{flex:1;min-width:8px}
.tb-ai{flex:0 1 260px;min-width:44px;white-space:nowrap;overflow:hidden;display:flex;align-items:center;gap:8px;height:36px;padding:0 12px;border-radius:18px;border:none;background:rgba(255,255,255,.08);color:rgba(255,255,255,.75);cursor:pointer;font-size:13px}
.tb-ai .ic{font-size:18px;color:oklch(0.78 0.12 285)}
.tb-ai .kbd{margin-left:auto;font:11px 'JetBrains Mono',monospace;opacity:.6}
.tb-company{flex:none;white-space:nowrap;display:flex;align-items:center;gap:6px;height:36px;padding:0 12px;border-radius:10px;border:none;background:rgba(255,255,255,.08);color:inherit;cursor:pointer;font-size:13px;font-weight:600}
.tb-company .eik{font:11px 'JetBrains Mono',monospace;opacity:.6}
.tb-company .ic{font-size:18px}
.tb-theme{flex:none;width:36px;height:36px;border-radius:18px;border:none;background:rgba(255,255,255,.08);color:inherit;cursor:pointer;display:grid;place-items:center}
.tb-theme .ic{font-size:19px}
.tb-navset{flex:none;width:32px;height:32px;margin-left:4px;border-radius:9px;border:none;background:transparent;color:rgba(255,255,255,.6);cursor:pointer;display:grid;place-items:center}.tb-navset:hover{background:rgba(255,255,255,.08);color:#fff}.tb-navset .ic{font-size:18px}
.sb-navset{color:var(--ink2);font-size:13px;height:34px;margin-bottom:6px}.sb-navset .ic{font-size:17px}
.avatar{flex:none;width:34px;height:34px;border-radius:17px;background:oklch(0.72 0.15 150);color:#07130b;display:grid;place-items:center;font-weight:700;font-size:13px;overflow:hidden;text-decoration:none}
.avatar:hover{color:#07130b;box-shadow:0 0 0 2px var(--barInk)}.avatar img{width:100%;height:100%;object-fit:cover;display:block}

/* nav mode: top menu vs left sidebar (both rendered, CSS picks) */
.app[data-nav="side"] .tb-modmenu{display:none}
.app[data-nav="top"] .sidebar{display:none}

/* body + sidebar 232px */
.body{flex:1;display:flex;min-height:0}
.sidebar{width:232px;flex:none;background:var(--surface);border-right:1px solid var(--line);padding:16px 12px;display:flex;flex-direction:column;gap:4px;position:sticky;top:56px;height:calc(100vh - 56px)}
.sb-head{display:flex;align-items:center;gap:10px;padding:4px 8px 14px}
.sb-head .tile{width:36px;height:36px;border-radius:11px;background:var(--hbg);color:var(--hfg);display:grid;place-items:center;font-size:21px}
.sb-head .name{font-size:16px;font-weight:700}
.sb-item{display:flex;align-items:center;gap:10px;border:none;cursor:pointer;height:38px;padding:0 10px;border-radius:10px;background:transparent;color:var(--ink);font-size:14px;font-weight:500;text-align:left;text-decoration:none}
.sb-item:hover{color:var(--ink)}
.sb-item .ic{font-size:19px}
.sb-item.on{background:var(--accentSoft);color:var(--accentText);font-weight:650}
.sb-fill{flex:1}
.section-label{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink2)}
.sidebar .section-label{padding:8px 10px}
.sb-mods{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;padding:0 4px}
.sb-mods a{height:40px;border-radius:10px;border:none;background:var(--hbg);color:var(--hfg);cursor:pointer;display:grid;place-items:center;font-size:20px;text-decoration:none}

/* main */
.main{flex:1;min-width:0;padding:28px 32px 60px;display:flex;flex-direction:column;gap:20px}

/* launcher */
.launcher{max-width:1240px;width:100%;margin:0 auto;display:flex;flex-direction:column;gap:24px}
.l-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap}
.l-title{font-size:30px;font-weight:700;letter-spacing:-0.03em}
.l-date{font-size:14px;color:var(--ink2)}
.l-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:16px}
.ai-brief{background:var(--aiSoft);border-radius:22px;padding:22px;display:flex;flex-direction:column;gap:14px}
.ai-brief-label{display:flex;align-items:center;gap:6px;color:var(--aiText);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.ai-brief-label .ic{font-size:17px}
.ai-brief-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.brief-card{background:var(--surface);border-radius:16px;padding:14px 16px;display:flex;flex-direction:column;gap:6px}
.brief-card .row{display:flex;align-items:center;gap:8px}
.brief-card .dot{width:8px;height:8px;border-radius:4px;flex:none}
.brief-card .t{font-size:14px;font-weight:650}
.brief-card .s{font-size:13px;color:var(--ink2);line-height:1.4;flex:1}
.brief-card .cta{align-self:flex-start;border:none;cursor:pointer;background:transparent;color:var(--aiText);font-weight:650;font-size:13px;padding:2px 0;text-decoration:none}
.kpis{display:flex;flex-direction:column;gap:10px}
.kpi{flex:1;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:16px 18px;display:flex;flex-direction:column;gap:4px;justify-content:center}
.kpi .l{font-size:12px;color:var(--ink2)}
.kpi .v{font-size:24px;font-weight:650;font-family:'JetBrains Mono',monospace;letter-spacing:-0.03em}
.kpi .s{font-size:12px}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}
.tile-btn{display:flex;align-items:center;gap:14px;padding:18px;border-radius:20px;border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer;text-align:left;text-decoration:none;font:inherit}
.tile-btn:hover{border-color:var(--accent);color:var(--ink)}
.tile-icon{width:56px;height:56px;flex:none;border-radius:17px;background:var(--hbg);color:var(--hfg);display:grid;place-items:center;position:relative}
.tile-icon .ic{font-size:28px}
.tile-badge{position:absolute;top:-5px;right:-5px;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:var(--bad);color:#fff;font-size:11px;font-weight:700;display:grid;place-items:center;border:2px solid var(--surface)}
.tile-text{display:flex;flex-direction:column;gap:3px;min-width:0}
.tile-text .n{font-size:16px;font-weight:650}
.tile-text .d{font-size:12px;color:var(--ink2);line-height:1.35}

/* module placeholder (until each stage implements its screens) */
.wip{max-width:1240px;width:100%;margin:0 auto;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:28px;color:var(--ink2);font-size:14px}
.wip h1{margin:0 0 6px;color:var(--ink);font-size:24px;font-weight:700;letter-spacing:-0.02em}

/* nav-mode switch, bottom-right */
.seg{display:flex;gap:3px;padding:3px;background:var(--surface2);border-radius:10px}
.seg button{border:none;cursor:pointer;height:30px;padding:0 12px;border-radius:8px;background:transparent;box-shadow:none;color:var(--ink);font-size:12px;font-weight:600}
.seg button.on{background:var(--surface);box-shadow:0 1px 3px rgba(0,0,0,.12)}

/* toast — 2.4s, top-center */
.toast{position:fixed;top:70px;left:50%;transform:translateX(-50%);z-index:60;background:var(--ink);color:var(--bg);padding:12px 18px;border-radius:14px;font-size:14px;font-weight:500;box-shadow:0 8px 30px rgba(0,0,0,.25)}
.toast[hidden]{display:none}

@media (max-width:900px){.l-grid{grid-template-columns:minmax(0,1fr)}}

/* ===== stage 2: documents list + drawer (values from the prototype) ===== */
.docs{display:flex;flex-direction:column;gap:16px}
.page-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.page-title{font-size:24px;font-weight:700;letter-spacing:-0.02em;flex:1}
.page-title .count{font-size:14px;font-weight:500;color:var(--ink2)}
.search{display:flex;align-items:center;gap:8px;height:40px;width:280px;padding:0 12px;border-radius:12px;background:var(--surface);border:1px solid var(--line)}
.search .ic{font-size:19px;color:var(--ink2)}
.search input{flex:1;min-width:0;border:none;outline:none;background:transparent;color:var(--ink);font-size:14px}
.btn-primary{height:40px;padding:0 16px;border-radius:12px;border:none;background:var(--btn);color:var(--onBtn);font-weight:650;font-size:14px;cursor:pointer;display:flex;align-items:center;gap:6px;text-decoration:none}
.btn-primary:hover{color:var(--onBtn)}
.btn-primary .ic{font-size:19px}
.ai-strip{background:var(--aiSoft);border-radius:14px;padding:12px 16px;display:flex;align-items:center;gap:12px}
.ai-strip .ic{font-size:20px;color:var(--aiText)}
.ai-strip .txt{flex:1;font-size:14px}
.ai-strip button{border:none;cursor:pointer;background:var(--surface);color:var(--aiText);font-weight:650;font-size:13px;padding:8px 14px;border-radius:10px}
.table{background:var(--surface);border:1px solid var(--line);border-radius:18px;overflow-x:auto}
.docs-grid{min-width:880px;display:grid;grid-template-columns:150px 120px minmax(180px,1fr) 100px 110px 130px 130px 76px;gap:12px}
.tr.th{padding:12px 18px;font-size:12px;font-weight:600;color:var(--ink2);border-bottom:1px solid var(--line)}
.tr:not(.th){padding:13px 18px;font-size:14px;border-bottom:1px solid var(--line);cursor:pointer;align-items:center;background:transparent}
.tr:not(.th):hover,.tr.sel{background:var(--surface2)}
.tr[hidden]{display:none}
.r{text-align:right}
.c-type{color:var(--ink2);font-size:13px}
.c-num{font-size:13px}
.c-partner{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.c-date{color:var(--ink2);font-size:13px}.c-date.od{color:var(--badText)}
.c-sum{text-align:right;font-weight:600}
.strike{text-decoration:line-through}
.badge{font-size:11px;font-weight:700;padding:4px 9px;border-radius:99px}
.tone-ok{background:var(--accentSoft);color:var(--accentText)}
.tone-warn{background:var(--warnSoft);color:var(--warnText)}
.tone-bad{background:var(--badSoft);color:var(--badText)}
.tone-neutral{background:var(--surface2);color:var(--ink2)}
.tone-info{background:var(--surface2);color:var(--ink)}
.row-acts{display:flex;gap:4px;justify-content:flex-end}
.icon-btn{width:32px;height:32px;border-radius:9px;border:none;background:transparent;color:var(--ink2);cursor:pointer;display:grid;place-items:center;font-size:19px;text-decoration:none}
.icon-btn:hover{background:var(--surface);color:var(--ink2)}
.drawer{width:380px;max-width:100vw;background:var(--surface);border-left:1px solid var(--line);position:fixed;right:0;top:56px;bottom:0;z-index:40;box-shadow:-12px 0 40px rgba(0,0,0,.15);overflow-y:auto;padding:18px;display:flex;flex-direction:column;gap:14px}
.dr-top{display:flex;align-items:center;justify-content:space-between}
.dr-close{width:36px;height:36px;border-radius:18px;border:none;background:var(--surface2);color:var(--ink);cursor:pointer;display:grid;place-items:center;font-size:20px;text-decoration:none}
.dr-close:hover{color:var(--ink)}
.dr-head{display:flex;flex-direction:column;gap:4px}
.dr-type{font-size:13px;color:var(--ink2)}
.dr-partner{font-size:18px;font-weight:650}
.dr-total{font-size:30px;font-weight:650;letter-spacing:-0.04em}
.dr-meta{font-size:12px;color:var(--ink2)}
.dr-acts{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.dr-acts a,.dr-acts button{height:42px;border-radius:12px;border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer;font-size:13px;font-weight:600;display:flex;align-items:center;justify-content:center;gap:6px;text-decoration:none}
.dr-acts .ic{font-size:18px}
.dr-status{display:flex;flex-wrap:wrap;gap:6px}
.chip{border:none;outline:2px solid transparent;outline-offset:1px;cursor:pointer;font-size:12px;font-weight:700;padding:7px 11px;border-radius:99px}
.chip.ring{outline:2px solid var(--ink)}
.ai-note{background:var(--aiSoft);border-radius:14px;padding:12px 14px;font-size:13px;line-height:1.45;display:flex;flex-direction:column;gap:8px}
.btn-sm{align-self:flex-start;border:none;cursor:pointer;background:var(--btn);color:var(--onBtn);font-weight:650;font-size:12px;padding:8px 12px;border-radius:9px}
.audit{display:flex;flex-direction:column}
.audit-row{display:flex;gap:10px;padding:9px 0;border-bottom:1px solid var(--line)}
.audit-row .dot{width:8px;height:8px;border-radius:4px;background:var(--accent);margin-top:6px;flex:none}
.audit-row .txt{display:flex;flex-direction:column;gap:2px}
.audit-row .t{font-size:13px}.audit-row .w{font-size:11px;color:var(--ink2)}

/* ===== documents list tools: filters, export, selection, pager, overdue marker ===== */
.export{display:flex;align-items:center;gap:6px;height:40px;padding:0 6px 0 12px;border-radius:12px;background:var(--surface);border:1px solid var(--line);font-size:13px;font-weight:600;color:var(--ink2)}
.export .ic{font-size:19px}
.export a{height:30px;padding:0 10px;border-radius:8px;display:flex;align-items:center;color:var(--ink);text-decoration:none;font-weight:600}
.export a:hover{background:var(--surface2);color:var(--ink)}
.filters{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.fld{display:flex;align-items:center;gap:8px;height:40px;padding:0 12px;border-radius:12px;background:var(--surface);border:1px solid var(--line);position:relative}
.fld .ic{font-size:19px;color:var(--ink2)}
.fld .lbl{font-size:12px;font-weight:600;color:var(--ink2)}
.fld input,.fld select{flex:1;min-width:0;border:none;outline:none;background:transparent;color:var(--ink);font-size:14px;font-family:inherit}
.fld input.date-mask{font-family:'JetBrains Mono',monospace;font-size:13px}
.fld select{appearance:none;cursor:pointer;padding-right:22px}
.fld select+.ic{position:absolute;right:10px;pointer-events:none}
.fld:focus-within{border-color:var(--accent)}
.w-num{width:170px}.w-date{width:160px}.w-partner{flex:1;min-width:240px}.w-status{width:200px}
.filters .clear{font-size:13px;font-weight:650;color:var(--accentText);text-decoration:none;padding:0 6px}
.docs-grid{min-width:916px;grid-template-columns:24px 150px 120px minmax(180px,1fr) 100px 110px 130px 130px 76px}
.cb{width:16px;height:16px;margin:0;accent-color:var(--btn);cursor:pointer}
.tr.od-row{box-shadow:inset 3px 0 0 var(--bad)}
.empty{padding:28px 18px;color:var(--ink2);font-size:14px;text-align:center}
.tfoot{display:flex;align-items:center;gap:12px;padding:10px 18px;min-width:916px;flex-wrap:wrap}
.sel-bar{display:flex;align-items:center;gap:12px}
.sel-bar[hidden]{display:none}
.sel-count{font-size:13px;font-weight:650}
.sel-bar .btn-primary{height:36px;font-size:13px}
.link{border:none;background:transparent;color:var(--ink2);font-size:13px;font-weight:600;cursor:pointer}
.pager{margin-left:auto;display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:flex-end}
.pp{font-size:13px;color:var(--ink2);display:flex;align-items:center;gap:6px}
.pp select{height:32px;border-radius:9px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font:13px 'JetBrains Mono',monospace;padding:0 6px;cursor:pointer}
.pages{display:flex;gap:4px}
.pages a{min-width:32px;height:32px;border-radius:9px;display:grid;place-items:center;font:13px 'JetBrains Mono',monospace;color:var(--ink);text-decoration:none}
.pages a:hover{background:var(--surface2);color:var(--ink)}
.pages a.on{background:var(--accentSoft);color:var(--accentText);font-weight:600}
.pages{align-items:center;flex-wrap:wrap}
.pages a.pg-arrow .ic{font-size:18px}
.pages a.pg-arrow.off{opacity:.35;pointer-events:none}
.pg-jump{display:flex;align-items:center;gap:6px;margin-left:8px;font-size:13px;color:var(--ink2);white-space:nowrap}
.pg-jump input{width:52px;height:32px;border-radius:9px;border:1px solid var(--line);background:var(--surface);color:var(--ink);text-align:center;font:13px 'JetBrains Mono',monospace}

/* ===== listing component: sortable header + calendar (shared by all modules) ===== */
.th .sort{display:flex;align-items:center;gap:3px;color:var(--ink2);text-decoration:none;cursor:pointer;white-space:nowrap}
.th .sort.r{justify-content:flex-end}
.th .sort .ic{font-size:15px;opacity:.45}
.th .sort:hover{color:var(--ink)}.th .sort:hover .ic{opacity:.8}
.th .sort.on{color:var(--ink)}.th .sort.on .ic{opacity:1;color:var(--accentText)}
.cal-btn{border:none;background:transparent;color:var(--ink2);cursor:pointer;font-size:19px;padding:0;width:24px;height:24px;display:grid;place-items:center;border-radius:6px}
.cal-btn:hover{background:var(--surface2);color:var(--ink)}
.w-date{width:190px}
.cal{position:absolute;z-index:80;width:288px;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:12px;box-shadow:0 8px 30px rgba(0,0,0,.18);font-family:Onest,system-ui,sans-serif;color:var(--ink)}
.cal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;font-size:14px;font-weight:650}
.cal-head button{width:32px;height:32px;border:none;border-radius:9px;background:transparent;color:var(--ink);cursor:pointer;font-size:20px}
.cal-head button:hover{background:var(--surface2)}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.cal-grid .wd{font-size:11px;font-weight:700;color:var(--ink2);text-align:center;padding:4px 0}
.cal-grid button{height:34px;border:none;border-radius:9px;background:transparent;color:var(--ink);cursor:pointer;font:13px 'JetBrains Mono',monospace}
.cal-grid button:hover{background:var(--surface2)}
.cal-grid button.today{outline:1px solid var(--accent);outline-offset:-1px}
.cal-grid button.on{background:var(--btn);color:var(--onBtn)}
.cal-foot{display:flex;justify-content:space-between;margin-top:8px;padding-top:8px;border-top:1px solid var(--line)}
.cal-foot button{border:none;background:transparent;color:var(--accentText);font-weight:650;font-size:13px;cursor:pointer;padding:4px 6px;border-radius:8px}
.cal-foot button:hover{background:var(--surface2)}

/* rich-text editors: show data-ph placeholder when empty */
[contenteditable][data-ph]:empty:before{content:attr(data-ph);color:var(--ink2)}

.fld input.date-mask{cursor:pointer}

/* public document pages (/p/<token>) */
.pub{min-height:100vh;display:flex;flex-direction:column;background:var(--bg)}
.pub-top{display:flex;align-items:center;gap:12px;padding:12px 20px;background:var(--surface);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}
.pub-brand{font-weight:700;font-size:18px;margin-right:auto}.pub-brand span{color:var(--accentText)}
.pub-lang a{height:30px;padding:0 12px;border-radius:8px;display:grid;place-items:center;font-size:12px;font-weight:600;color:var(--ink);text-decoration:none}
.pub-lang a.on{background:var(--surface);box-shadow:0 1px 3px rgba(0,0,0,.12)}
.pub-main{flex:1;width:100%;max-width:820px;margin:0 auto;padding:24px 16px;display:flex;flex-direction:column;gap:18px}
.pub-paper{overflow-x:auto;padding:4px}
.pub-paper>div{min-width:640px}
.pub-card{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:20px;display:flex;flex-direction:column;gap:12px}
.pub-gate{max-width:420px;margin:40px auto;align-items:center;text-align:center}
.pub-gate h1{font-size:20px;margin:0}.pub-gate p{margin:0;color:var(--ink2);font-size:14px}
.pub-lock{font-size:40px;color:var(--accentText)}
.pub-code{width:200px;height:52px;text-align:center;font-family:'JetBrains Mono',monospace;font-size:24px;letter-spacing:.3em;border-radius:12px;border:1px solid var(--line);background:var(--surface);color:var(--ink)}
.pub-err{background:var(--badSoft);color:var(--badText);padding:10px 14px;border-radius:12px;font-size:14px}
.pub-foot{text-align:center;color:var(--ink2);font-size:12px;padding:16px}
.pub-sign h2{display:flex;align-items:center;gap:8px;font-size:17px;margin:0}
.pub-sign canvas{width:100%;max-width:600px;aspect-ratio:3/1;border:1.5px dashed var(--line);border-radius:12px;background:#fff;touch-action:none;cursor:crosshair}
.pub-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.pub-row input{height:40px;border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:0 12px;font-size:14px;flex:1;min-width:140px}
.pub-row .btn-sm{align-self:center;display:flex;align-items:center;gap:6px}
.muted{color:var(--ink2)}

/* send-by-email dialog (documents drawer) */
.modal{border:none;border-radius:18px;padding:0;width:min(560px,calc(100vw - 32px));background:var(--surface);color:var(--ink);box-shadow:0 20px 60px rgba(0,0,0,.3)}
.modal::backdrop{background:rgba(0,0,0,.4)}
.modal form{display:flex;flex-direction:column;gap:12px;padding:20px}
.modal h2{font-size:18px;margin:0;display:flex;align-items:center;gap:8px}
.modal label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--ink2)}
.modal input[type=email],.modal input[type=text],.modal input[type=tel],.modal input[type=number],.modal input[type=date],.modal input:not([type]),.modal select,.modal textarea{height:40px;border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:0 12px;font-size:14px;font-family:inherit}
.modal textarea{height:220px;padding:10px 12px;resize:vertical;line-height:1.45}
.modal .chk{flex-direction:row;align-items:center;gap:8px;font-size:14px;color:var(--ink)}
.modal .hint{font-size:12px;color:var(--ink2);background:var(--surface2);border-radius:10px;padding:8px 12px}
.modal .acts{display:flex;justify-content:flex-end;gap:10px}
.modal .btn-ghost{height:40px;padding:0 16px;border-radius:12px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font-weight:600;cursor:pointer}

/* site footer: dark band like the top bar (the logo is white), same in both themes */
.site-foot{flex:none;background:var(--bar);color:var(--barInk);padding:36px 32px 0;margin-top:auto;font-size:13px}
.sf-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr 1.2fr;gap:28px;max-width:1280px;margin:0 auto;padding-bottom:28px}
.sf-brand p,.sf-col p{margin:0;color:rgba(238,241,238,.62);line-height:1.5}
.sf-logo{display:inline-block;margin-bottom:10px}.sf-logo img{display:block;height:44px;width:auto}
.sf-col{display:flex;flex-direction:column;gap:9px;align-items:flex-start}
.sf-col h3{margin:0 0 4px;font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:rgba(238,241,238,.5)}
.site-foot a{color:var(--barInk);text-decoration:none;display:inline-flex;align-items:center;gap:6px}
.site-foot a:hover{color:oklch(0.78 0.14 150)}
.site-foot .ic{font-size:17px}
.sf-secure{display:inline-flex;align-items:center;gap:6px;color:rgba(238,241,238,.62)}.sf-secure .ic{color:oklch(0.72 0.15 150)}
.sf-fb{margin-top:4px;height:36px;padding:0 14px;border-radius:10px;border:1px solid rgba(238,241,238,.22);background:rgba(255,255,255,.06);color:var(--barInk);font:inherit;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.sf-fb:hover{background:rgba(255,255,255,.12)}
.sf-bottom{max-width:1280px;margin:0 auto;border-top:1px solid rgba(238,241,238,.1);padding:14px 0 18px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;color:rgba(238,241,238,.5);font-size:12px}
.sf-credit{font-weight:700;letter-spacing:-.02em;gap:0!important}.sf-credit span{color:oklch(0.72 0.15 150)}
.sf-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.sf-captcha{min-height:65px}
.pub-back{font-size:13px;color:var(--accentText);text-decoration:none}
.pub-h1{font-size:22px;margin:0}
@media (max-width:1000px){.sf-grid{grid-template-columns:1fr 1fr}.sf-brand{grid-column:1/-1}}
@media (max-width:560px){.site-foot{padding:28px 16px 0}.sf-grid{grid-template-columns:1fr}.sf-bottom{flex-direction:column}}

/* Сканиране · inbox grid (prototype: minmax(0,1fr) 200px 120px 80px 130px, min 880px) + chevron */
.scan-grid{min-width:880px;display:grid;grid-template-columns:minmax(0,1fr) 200px 120px 80px 130px 24px;gap:12px;align-items:center}
@media (max-width:900px){#scan-verify{grid-template-columns:minmax(0,1fr)!important}#scan-verify>div:first-child{position:static!important}}

/* footer content pages (/pages/<slug>): page chips + readable prose */
.pg-nav{display:flex;flex-wrap:wrap;gap:6px}
.pg-nav a{height:32px;padding:0 12px;border-radius:16px;display:flex;align-items:center;font-size:13px;font-weight:600;color:var(--ink2);text-decoration:none;background:var(--surface);border:1px solid var(--line)}
.pg-nav a.on{background:var(--accentSoft);color:var(--accentText);border-color:transparent}
.prose{font-size:15px;line-height:1.65;color:var(--ink);gap:0}
.prose h1{font-size:26px;letter-spacing:-.02em;margin:0 0 6px}
.prose h2{font-size:18px;margin:26px 0 8px}
.prose h3{font-size:15px;margin:18px 0 6px}
.prose p,.prose ul,.prose ol{margin:0 0 12px}
.prose ul,.prose ol{padding-left:22px}
.prose li{margin:3px 0}
.prose a{color:var(--accentText)}
.prose .lead{font-size:17px;color:var(--ink2)}
.prose .meta{font-size:13px;color:var(--ink2);margin-bottom:18px}
.prose details{border:1px solid var(--line);border-radius:12px;padding:0 16px;margin:0 0 8px;background:var(--surface)}
.prose details[open]{padding-bottom:6px}
.prose summary{cursor:pointer;font-weight:600;padding:12px 0;list-style:none;display:flex;justify-content:space-between;gap:12px}
.prose summary::-webkit-details-marker{display:none}
.prose summary:after{content:"expand_more";font-family:'Material Symbols Rounded';font-size:20px;color:var(--ink2);transition:transform .15s}
.prose details[open] summary:after{transform:rotate(180deg)}
.prose .grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:8px 0 16px}
.prose .tile{border:1px solid var(--line);border-radius:14px;padding:14px 16px;background:var(--surface2)}
.prose .tile h3{margin:0 0 4px;display:flex;align-items:center;gap:8px}.prose .tile h3 .ic{color:var(--accentText);font-size:20px}
.prose .tile p{margin:0;font-size:14px;color:var(--ink2);line-height:1.5}
.prose table{width:100%;border-collapse:collapse;font-size:14px;margin:0 0 14px}
.prose th,.prose td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:top}
.prose th{font-size:12px;color:var(--ink2);font-weight:600}
.prose code{font-family:'JetBrains Mono',monospace;font-size:13px;background:var(--surface2);padding:1px 5px;border-radius:5px}
@media (max-width:640px){.prose .grid2{grid-template-columns:1fr}.prose{font-size:14px}.prose h1{font-size:22px}}
/* developer docs (/developers/*): code blocks, endpoint tables, method badges */
.dev-nav{margin:0 0 14px}.dev-doc{max-width:980px}
.prose pre{background:var(--surface2);border:1px solid var(--line);border-radius:10px;padding:12px 14px;overflow-x:auto;margin:0 0 14px}
.prose pre code{background:none;padding:0;font-size:12.5px;line-height:1.55;white-space:pre}
.dev-ep td{font-size:13px}.dev-ep td:first-child{white-space:nowrap}.dev-sub{font-size:12px;color:var(--ink2)}
.dev-m{display:inline-block;min-width:54px;text-align:center;font:600 11px/20px 'JetBrains Mono',monospace;border-radius:6px;background:var(--surface2);color:var(--ink2)}
.dev-get{background:var(--accentSoft);color:var(--accentText)}
.dev-skill{border:1px solid var(--line);border-radius:14px;padding:4px 18px 6px;margin:24px 0 10px;background:var(--surface)}.dev-skill h2{margin-top:14px}
.dev-dl{display:flex;flex-wrap:wrap;gap:8px}.dev-dl a{text-decoration:none}.dev-credit{font-size:12px;color:var(--ink2);margin-top:18px}.dev-delete{background:var(--warnSoft);color:var(--warnText)}

/* user profile (/profile) */
.settings .btn-ghost,.pf-alert .btn-ghost{height:38px;padding:0 14px;border-radius:11px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font:inherit;font-size:13px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:6px;text-decoration:none;white-space:nowrap}
.settings .btn-ghost:hover{background:var(--surface2);color:var(--ink)}
.settings .btn-ghost .ic,.modal .btn-primary .ic{font-size:18px}
.settings .btn-ghost.sm{height:32px;padding:0 10px;font-size:12px}
.btn-ghost.danger{color:var(--badText)}.btn-primary.danger{background:var(--bad);color:#fff}
.pf-avatar,.pf-inline{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.pf-pic{width:64px;height:64px;border-radius:32px;background:oklch(0.72 0.15 150);color:#07130b;display:grid;place-items:center;font-weight:700;font-size:22px;overflow:hidden;flex:none}
.pf-pic img{width:100%;height:100%;object-fit:cover}
.pill{display:inline-flex;align-items:center;gap:5px;height:28px;padding:0 10px;border-radius:14px;font-size:12px;font-weight:650;white-space:nowrap}
.pill .ic{font-size:16px}
.pill.ok{background:var(--accentSoft);color:var(--accentText)}.pill.off{background:var(--surface2);color:var(--ink2)}.pill.warn{background:var(--warnSoft);color:var(--warnText)}
.pf-sessions{display:flex;flex-direction:column;gap:8px;flex:1;min-width:0;max-width:560px}
.pf-sess{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid var(--line);border-radius:12px}
.pf-sess>.ic{font-size:22px;color:var(--ink2)}
.pf-sess .t{flex:1;min-width:0;display:flex;flex-direction:column;font-size:13px}.pf-sess .t span{color:var(--ink2);font-size:12px}
.pf-sessions .btn-dashed{align-self:flex-start}
.pf-alert{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px 16px;border-radius:14px;background:var(--warnSoft);color:var(--warnText);font-size:14px}
.pf-alert span:nth-child(2){flex:1}
.settings>div[id]{scroll-margin-top:72px}
.pf-tfa{display:flex;gap:16px;align-items:flex-start}
.pf-tfa img{background:#fff;border-radius:12px;padding:6px;flex:none}
.pf-tfa ol{margin:0;padding-left:18px;font-size:13px;line-height:1.55;display:flex;flex-direction:column;gap:6px}
.pf-tfa code,.pf-codes code{font-family:'JetBrains Mono',monospace;font-size:13px;background:var(--surface2);padding:2px 6px;border-radius:6px;word-break:break-all}
.modal input.pf-code{font-family:'JetBrains Mono',monospace;font-size:20px;letter-spacing:.25em;height:48px;text-align:center;max-width:200px}
.modal input[type=password]{height:40px;border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:0 12px;font-size:14px;font-family:inherit}
.modal input:not([type]){height:40px;border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:0 12px;font-size:14px;font-family:inherit}
.pf-codes-box{display:flex;flex-direction:column;gap:12px}
.pf-codes{display:grid;grid-template-columns:1fr 1fr;gap:8px}.pf-codes code{text-align:center;padding:8px;font-size:14px}
.pf-codes-box .acts{flex-wrap:wrap}
@media (max-width:560px){.pf-tfa{flex-direction:column;align-items:center}}
.modal [data-step][hidden]{display:none!important}
.modal label[hidden]{display:none}
.pf-tfa code{white-space:nowrap;word-break:normal;display:inline-block;margin-top:4px}
.modal .btn-ghost{display:inline-flex;align-items:center;gap:6px}.modal .btn-ghost .ic{font-size:18px}

/* AI panel (stage 6): its inline display:flex must not defeat [hidden] */
#ai-panel[hidden]{display:none!important}
#ai-msgs > *{flex:none}  /* chat cards keep their height; the list scrolls */

/* Документи → Настройки: numbering groups (A…D) */
.ng-list{display:flex;flex-direction:column;gap:14px}
.ng{border:1px solid var(--line);border-radius:14px;overflow:hidden}
.ng-head{display:flex;align-items:center;gap:10px;padding:10px 14px;background:var(--surface2)}
.ng-badge{width:26px;height:26px;border-radius:8px;background:var(--surface);display:grid;place-items:center;font-weight:700;font-size:12px}
.ng-title{font-weight:650;font-size:14px;flex:1}
.ng-rm{border:none;background:transparent;color:var(--badText);font:inherit;font-size:12px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:4px}.ng-rm .ic{font-size:16px}
.ng-table{overflow-x:auto;max-width:100%}
.ng-row{min-width:620px;display:grid;grid-template-columns:minmax(200px,1fr) 100px 130px 140px;gap:10px;padding:8px 14px;border-top:1px solid var(--line);font-size:13px;align-items:center}
.ng-th{font-size:12px;font-weight:600;color:var(--ink2);border-top:none}
.ng-row input{width:100%;height:30px;border-radius:8px;border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:0 8px;font-size:13px;font-weight:650;outline:none;text-transform:uppercase}
.ng-row input:focus{border-color:var(--accent)}
.ng-row .mono{font-family:'JetBrains Mono',monospace}
/* Документи → Настройки on a phone: the label above its control, a bank account on three lines, no page scroll */
@media (max-width:640px){.set-sec{padding:16px 14px!important;min-width:0}.set-row{grid-template-columns:minmax(0,1fr)!important;gap:8px!important}
#banks [data-bank]{grid-template-columns:32px minmax(0,1fr) minmax(0,1fr) 32px!important;gap:8px!important;padding:10px!important}
#banks [data-bank]>:nth-child(2){grid-column:2/4}#banks [data-bank]>:nth-child(3){grid-column:1/-1;grid-row:2}
#banks [data-bank]>:nth-child(4){grid-column:1/3;grid-row:3;padding-left:4px}#banks [data-bank]>:nth-child(5){grid-column:3/-1;grid-row:3}
.ng-row{min-width:0;grid-template-columns:64px minmax(0,1fr) minmax(0,1.5fr);gap:4px 8px;padding:8px 10px}.ng-row>:first-child{grid-column:1/-1}.ng-th>:first-child{display:none}.ng-table .ng-ranges{flex-wrap:wrap;padding-left:10px}}
.ng-fixed{font-weight:650;padding-left:9px}
.ng-jumpcell{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ng-jump{border:none;background:transparent;color:var(--accentText);font:inherit;font-size:12px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:3px;padding:0}.ng-jump .ic{font-size:15px}
.ng-strict{font-size:11px;font-weight:600;color:var(--accentText);background:var(--accentSoft);padding:1px 6px;border-radius:6px;margin-left:4px}
.ng-add{align-self:flex-start;height:36px;padding:0 12px;border-radius:10px;border:1px dashed var(--line);background:transparent;color:var(--accentText);font-weight:600;font-size:13px;cursor:pointer}
.ng-note{margin:0;font-size:12px;color:var(--ink2);line-height:1.5}

/* Документи → Настройки: online payment providers */
.pay{display:flex;flex-direction:column;gap:14px}
.pay-tabs{display:flex;flex-wrap:wrap;gap:3px;padding:3px;background:var(--surface2);border-radius:11px;align-self:flex-start}
.pay-tabs button{height:34px;padding:0 14px;border-radius:9px;border:none;background:transparent;color:var(--ink);font:inherit;font-size:13px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:8px}
.pay-tabs button.on{background:var(--surface);box-shadow:0 1px 3px rgba(0,0,0,.12)}
.pay-dot{width:8px;height:8px;border-radius:4px;background:var(--line)}.pay-dot.on{background:var(--accent)}
.pay-panel{display:flex;flex-direction:column}
.pay-panel[hidden]{display:none}
.pay-desc{margin:0 0 6px;font-size:13px;color:var(--ink2);line-height:1.5}
.pay-row{display:grid;grid-template-columns:minmax(180px,280px) minmax(0,1fr);gap:16px;align-items:center;padding:10px 0;border-top:1px solid var(--line)}
.pay-l{display:flex;flex-direction:column;gap:2px;font-size:14px;font-weight:500}.pay-l .req{color:var(--badText)}
.pay-h{font-size:12px;color:var(--ink2);font-weight:400;line-height:1.4}
.pay-row input[type=text],.pay-row input[type=email],.pay-row input[type=password]{width:100%;max-width:460px;height:40px;border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:0 12px;font-size:14px;font-family:inherit;outline:none}
.pay-row input.mono,.pay-row input[type=password]{font-family:'JetBrains Mono',monospace;font-size:13px}
.pay-row input:focus{border-color:var(--accent)}
.pay-secret{display:flex;gap:8px;align-items:center;max-width:460px}
.pay-clear{height:40px;padding:0 12px;border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--badText);font:inherit;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap}
.pay-sw{width:46px;height:28px;border-radius:14px;border:none;padding:3px;background:var(--surface2);cursor:pointer;display:flex;justify-content:flex-start}
.pay-sw span{width:22px;height:22px;border-radius:11px;background:#fff;display:block;box-shadow:0 1px 2px rgba(0,0,0,.2)}
.pay-sw.on{background:var(--accent);justify-content:flex-end}
.pay-methods{display:flex;flex-wrap:wrap;gap:14px;font-size:14px}.pay-methods label{display:flex;align-items:center;gap:6px;cursor:pointer}
@media (max-width:700px){.pay-row{grid-template-columns:1fr;gap:6px}}
.pay-row .seg{justify-self:start}

/* public document: online payment */
.pub-ok,.pub-note{display:flex;align-items:center;gap:8px;padding:10px 14px;border-radius:12px;font-size:14px}
.pub-ok{background:var(--accentSoft);color:var(--accentText)}.pub-note{background:var(--surface2);color:var(--ink)}
.pub-pay h2{display:flex;align-items:center;gap:8px;font-size:17px;margin:0}
.pub-pay p{margin:0;font-size:13px}
.pub-pay-btns{display:flex;flex-wrap:wrap;gap:10px}.pub-pay-btns form{margin:0}
.pay-btn{height:46px;padding:0 18px;border-radius:12px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font:inherit;font-size:14px;font-weight:650;cursor:pointer;display:flex;align-items:center;gap:8px}
.pay-btn:hover{border-color:var(--accent);background:var(--accentSoft)}
.pay-btn small{font-size:11px;font-weight:500;color:var(--ink2)}
.pay-code{font-family:'JetBrains Mono',monospace;font-size:32px;font-weight:700;letter-spacing:.12em;padding:12px 18px;border-radius:12px;background:var(--surface2)}
.pay-hook{display:flex;gap:8px;align-items:center;min-width:0;max-width:560px}.pay-hook code{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:"JetBrains Mono",monospace;font-size:12px;background:var(--surface2);padding:10px 12px;border-radius:10px}.pay-copy{color:var(--accentText)}

/* login / registration / 2FA pages */
.auth{width:100%;max-width:420px;margin:24px auto;display:flex;flex-direction:column;align-items:stretch;gap:14px}
.auth-logo{align-self:center;background:var(--bar);padding:12px 18px;border-radius:14px}.auth-logo img{display:block;height:40px;width:auto}
.auth-card h1{font-size:22px;margin:0 0 4px;letter-spacing:-.02em}
.auth-card label{display:flex;flex-direction:column;gap:5px;font-size:13px;color:var(--ink2)}
.auth-card input:not([type=checkbox]){height:44px;border-radius:11px;border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:0 13px;font-size:15px;font-family:inherit;outline:none}
.auth-card input:focus{border-color:var(--accent)}
.auth-card .auth-check{flex-direction:row;align-items:center;gap:8px;font-size:14px;color:var(--ink)}
.auth-code{font-family:'JetBrains Mono',monospace;letter-spacing:.2em;font-size:20px!important;text-align:center}
.auth-go{height:46px;justify-content:center;font-size:15px}
.auth-links{display:flex;justify-content:space-between;font-size:13px}
.auth-links a,.auth-link{color:var(--accentText);text-decoration:none;background:none;border:none;padding:0;font:inherit;cursor:pointer}
.auth-alt{text-align:center;font-size:14px;color:var(--ink2);margin:0}.auth-alt a{color:var(--accentText);font-weight:600}
.auth-fine{font-size:12px;color:var(--ink2);margin:0;line-height:1.5}.auth-fine a{color:var(--accentText)}
.auth-card [hidden]{display:none!important}
.auth-or{display:flex;align-items:center;gap:10px;color:var(--ink2);font-size:12px}.auth-or:before,.auth-or:after{content:"";flex:1;height:1px;background:var(--line)}
.auth-social{display:flex;flex-direction:column;gap:8px}
.btn-social{height:44px;border-radius:11px;border:1px solid var(--line);background:var(--surface);color:var(--ink);display:flex;align-items:center;justify-content:center;gap:10px;font-weight:600;font-size:14px;text-decoration:none}
.btn-social:hover{background:var(--surface2);color:var(--ink)}
.pf-note{font-size:12px;color:var(--ink2)}
.pf-key-form{display:flex;flex-direction:column;gap:12px}
.pf-key-group{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--ink2);white-space:nowrap}.pf-key-group select{font-size:12px;padding:2px 6px}
.pf-key-rights{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;font-size:13px;max-height:260px;overflow:auto;border:1px solid var(--line);border-radius:10px;padding:10px}
.pf-key-rights>div{display:flex;flex-direction:column;gap:4px}
.modal select{height:40px;border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:0 10px;font-size:14px;font-family:inherit}
.pf-secret{font-family:'JetBrains Mono',monospace;font-size:13px;background:var(--surface2);padding:12px;border-radius:10px;word-break:break-all}
.beta-bar{display:flex;align-items:center;gap:10px;padding:6px 18px;background:var(--warnSoft);color:var(--warnText);font-size:13px;font-weight:600}.beta-bar .ic{font-size:18px}
.demo-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:8px 18px;background:var(--aiSoft);color:var(--aiText);font-size:13px}
.demo-bar span:nth-child(2){flex:1;min-width:200px}.demo-bar .ic{font-size:18px}
.demo-bar a,.demo-bar button{font:inherit;font-weight:650;color:var(--aiText);background:none;border:1px solid currentColor;border-radius:8px;padding:4px 10px;cursor:pointer;text-decoration:none}
.usage-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:8px 18px;font-size:13px;background:var(--badSoft);color:var(--badText)}
.usage-bar.usage-warn,.usage-bar.usage-grace{background:var(--warnSoft);color:var(--warnText)}
.usage-bar.usage-gift{background:var(--accentSoft);color:var(--accentText)}
.usage-bar span:nth-child(2){flex:1;min-width:200px}.usage-bar .ic{font-size:18px}
.usage-bar a{font:inherit;font-weight:650;color:inherit;border:1px solid currentColor;border-radius:8px;padding:4px 10px;text-decoration:none}
.demo-bar form{margin:0}

/* welcome tour (static/js/tour.js) */
.tour-shade{position:fixed;inset:0;z-index:90;pointer-events:none}.tour-shade.on{background:rgba(0,0,0,.45)}
.tour-ring{position:fixed;z-index:91;border-radius:14px;box-shadow:0 0 0 4px oklch(0.72 0.15 150),0 0 0 9999px rgba(0,0,0,.45);pointer-events:none;transition:all .25s ease}
.tour-pop{position:fixed;z-index:92;width:min(340px,calc(100vw - 24px));background:var(--surface);color:var(--ink);border-radius:16px;padding:16px 18px;box-shadow:0 18px 50px rgba(0,0,0,.35);display:flex;flex-direction:column;gap:6px}
.tour-pop h3{margin:0;font-size:17px}.tour-pop p{margin:0;font-size:14px;color:var(--ink2);line-height:1.5}
.tour-step{font-size:12px;font-weight:600;color:var(--accentText)}
.tour-acts{display:flex;align-items:center;gap:8px;margin-top:8px}.tour-acts span{flex:1}
.tour-acts button{height:36px;padding:0 14px;border-radius:10px;font:inherit;font-size:13px;font-weight:650;cursor:pointer}
.tour-skip{border:none;background:none;color:var(--ink2);padding:0 4px!important}
.tour-back{border:1px solid var(--line);background:var(--surface);color:var(--ink)}
.tour-next{border:none;background:var(--btn);color:var(--onBtn)}
/* document rich texts (offer pre/post texts, also imported legacy HTML): the editor and the printed paper */
.doc-rich h1,[contenteditable][data-ph] h1{font-size:1.5em;margin:.45em 0 .3em;line-height:1.25}
.doc-rich h2,[contenteditable][data-ph] h2{font-size:1.3em;margin:.45em 0 .3em;line-height:1.25}
.doc-rich h3,[contenteditable][data-ph] h3{font-size:1.15em;margin:.4em 0 .25em}
.doc-rich :is(h4,h5,h6),[contenteditable][data-ph] :is(h4,h5,h6){font-size:1em;margin:.4em 0 .2em}
.doc-rich p,[contenteditable][data-ph] p{margin:.3em 0}
.doc-rich :is(ul,ol),[contenteditable][data-ph] :is(ul,ol){margin:.3em 0;padding-left:1.4em}
/* public document: payment status ribbon (corner of the paper) and "How to pay" under it */
.pub-ribboned{position:relative;max-width:720px;margin:0 auto}  /* exactly the paper: the ribbon sits on its corner */
.pub-ribbon{position:absolute;top:0;right:0;width:112px;height:112px;overflow:hidden;pointer-events:none;z-index:2}
.pub-ribbon span{position:absolute;top:24px;right:-38px;width:160px;transform:rotate(45deg);text-align:center;padding:6px 0;font-weight:800;font-size:10.5px;line-height:1;letter-spacing:.08em;text-transform:uppercase;color:#fff;box-shadow:0 2px 6px rgba(0,0,0,.18)}
.rib-ok span{background:#2f8f57}.rib-warn span{background:#c77a12}.rib-bad span{background:#c0392b}.rib-mute span{background:#7a7f7a}
.pub-paylink{text-decoration:none}
.pub-status{display:none}  /* phones: the paper scrolls sideways, so the status also shows above it */
@media (max-width:760px){.pub-status{display:flex}.pub-status span{color:#fff;font-weight:800;font-size:12px;letter-spacing:.08em;text-transform:uppercase;padding:6px 12px;border-radius:99px}
.pub-status.rib-ok span{background:#2f8f57}.pub-status.rib-warn span{background:#c77a12}.pub-status.rib-bad span{background:#c0392b}.pub-status.rib-mute span{background:#7a7f7a}}
.pub-how h2{display:flex;align-items:center;gap:8px;font-size:17px;margin:0}
.pub-how-sec{display:flex;flex-direction:column;gap:8px;padding-top:12px;border-top:1px solid var(--line)}
.pub-how-sec h3{margin:0;font-size:14px;font-weight:650}.pub-how-sec p{margin:0;font-size:13px}
.pub-bank{display:flex;gap:20px;align-items:flex-start;flex-wrap:wrap}
.pub-copy{margin:0;display:flex;flex-direction:column;gap:6px;flex:1;min-width:240px}
.pub-copy>div{display:grid;grid-template-columns:96px 1fr;gap:10px;align-items:center}
.pub-copy dt{font-size:12px;color:var(--ink2)}
.pub-copy dd{margin:0;display:flex;align-items:center;gap:6px;font-size:14px;font-weight:600;min-width:0;overflow-wrap:anywhere}
.pub-copy-btn{flex:none;width:30px;height:30px;border-radius:8px;border:1px solid var(--line);background:var(--surface);color:var(--ink2);cursor:pointer;display:grid;place-items:center}
.pub-copy-btn .ic{font-size:16px}.pub-copy-btn:hover{color:var(--accentText);border-color:var(--accent)}
.pub-copy-btn.done{color:var(--accentText);border-color:var(--accent);background:var(--accentSoft)}
.pub-qr{margin:0;display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11px;color:var(--ink2);text-align:center;max-width:160px}
.pub-qr img{background:#fff;border-radius:8px;border:1px solid var(--line)}
@media (max-width:560px){.pub-copy>div{grid-template-columns:1fr;gap:2px}.pub-bank{flex-direction:column;align-items:stretch}.pub-qr{align-self:center}}

/* Документи → Настройки → Шаблон и визия: company logo / stamp (company_images) */
.ci-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px}
.ci{display:flex;gap:14px;align-items:center;border:1px solid var(--line);border-radius:14px;padding:12px}
.ci-prev{flex:none;width:132px;height:64px;border-radius:10px;background:#fff;border:1px solid var(--line);display:grid;place-items:center;overflow:hidden}
.ci-prev.ci-stamp{width:80px;height:80px}
.ci-prev img{width:100%;height:100%;object-fit:contain;padding:4px}
.ci-prev .ic{font-size:28px;color:#b5b9b5}
.ci-body{display:flex;flex-direction:column;gap:4px;min-width:0}
.ci-body b{font-size:14px}.ci-hint{font-size:12px;color:var(--ink2)}
.ci-acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:4px}
.ci-btn,.ci-rm{height:32px;padding:0 12px;border-radius:9px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font:inherit;font-size:13px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.ci-btn .ic,.ci-rm .ic{font-size:17px}.ci-rm{color:var(--badText)}
.ci-rm[hidden]{display:none}.ci-btn:hover{border-color:var(--accent)}.ci.busy{opacity:.6;pointer-events:none}

/* /welcome — setup wizard of a new account (steps: Фирма, Банкова сметка, Лого) */
.wiz{max-width:520px}
.wiz-card{gap:14px}
.wiz-bar{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.wiz-bar i{height:4px;border-radius:2px;background:var(--surface2)}.wiz-bar i.on{background:var(--accent)}
.wiz-step{font-size:12px;font-weight:600;color:var(--ink2)}
.wiz-card section{display:flex;flex-direction:column;gap:12px}.wiz-card section[hidden]{display:none}
.wiz-card section h1{margin:0}
.wiz-row{display:flex;gap:8px}.wiz-row input{flex:1;min-width:0}
.wiz-check{height:44px;padding:0 16px;border-radius:11px;border:1.5px solid var(--ink);background:var(--surface);color:var(--ink);font:inherit;font-weight:650;cursor:pointer;white-space:nowrap}
.wiz-check:disabled{opacity:.6;cursor:default}
.wiz-found{background:var(--accentSoft);border:1px solid color-mix(in oklab,var(--accent) 35%,transparent);border-radius:14px;padding:12px 14px;display:flex;flex-direction:column;gap:8px}
.wiz-found b{display:flex;align-items:center;gap:6px;color:var(--accentText);font-size:14px}.wiz-found b .ic{font-size:18px}
.wiz-found dl{margin:0;display:grid;grid-template-columns:72px 1fr;gap:4px 12px;font-size:14px}
.wiz-found dt{color:var(--ink2)}.wiz-found dd{margin:0;font-weight:600;overflow-wrap:anywhere}
.wiz-link{align-self:flex-start;border:none;background:transparent;color:var(--accentText);font:inherit;font-size:13px;font-weight:600;cursor:pointer;padding:0}
.wiz-link[hidden]{display:none}
.wiz-fields{display:flex;flex-direction:column;gap:12px}.wiz-fields[hidden],[data-more][hidden]{display:none}
[data-more]{display:flex;flex-direction:column;gap:12px}
.wiz-two{display:grid;grid-template-columns:1fr 1fr;gap:10px;align-items:end}
.wiz-num{align-items:center}
.wiz-hint{font-size:12px;color:var(--ink2);line-height:1.45}
.wiz-card .chk{flex-direction:row;align-items:center;gap:8px;font-size:14px;color:var(--ink)}.wiz-card .chk[hidden]{display:none}
.wiz-acts{display:flex;align-items:center;gap:10px;margin-top:4px}.wiz-acts>span{flex:1}
.wiz-acts .btn-primary{height:46px;padding:0 20px;border-radius:23px;font-weight:650;text-decoration:none;display:inline-flex;align-items:center}
.wiz-acts .btn-primary:disabled{opacity:.5;cursor:default}
.wiz-acts .btn-ghost{height:46px;padding:0 16px;border-radius:12px;border:none;background:transparent;color:var(--ink2);font:inherit;font-weight:600;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center}
.wiz-acts .btn-social[hidden]{display:none}
.wiz-logo{display:flex;align-items:center;gap:14px}
.wiz-card .pub-note{display:flex;gap:8px;align-items:flex-start;font-size:13px}.wiz-card .pub-note[hidden]{display:none}
@media (max-width:520px){.wiz-two{grid-template-columns:1fr}}
.wiz-card .pub-ok[hidden]{display:none}

/* /demo?sent=1 — „Проверете пощата си“ with the next steps */
.demo-sent{align-items:center;text-align:center;gap:12px;padding:28px 24px}
.demo-sent h1{margin:0}
.demo-sent-ic{width:72px;height:72px;border-radius:36px;background:var(--accentSoft);color:var(--accentText);display:grid;place-items:center}
.demo-sent-ic .ic{font-size:34px}
.demo-sent-again{font:13px 'JetBrains Mono',monospace;color:var(--ink2);margin:0}
.demo-resend{display:inline;margin:0}.demo-resend button{border:none;background:transparent;padding:0;font:inherit;color:var(--accentText);cursor:pointer;text-decoration:underline}
.demo-next{align-self:stretch;text-align:left;background:var(--surface2);border:1px solid var(--line);border-radius:14px;padding:14px 16px;display:flex;flex-direction:column;gap:8px}
.demo-next-t{font-size:12px;color:var(--ink2)}
.demo-next ol{margin:0;padding:0;list-style:none;counter-reset:dn;display:flex;flex-direction:column;gap:8px}
.demo-next li{counter-increment:dn;display:grid;grid-template-columns:18px 1fr;gap:8px;font-size:14px;line-height:1.4}
.demo-next li::before{content:counter(dn);font-weight:700;color:var(--accentText)}
.wiz-logo .ci-btn{flex-direction:row;height:40px;font-size:14px;color:var(--ink)}
.wiz-acts{flex-wrap:wrap}.wiz-acts .btn-primary,.wiz-acts .btn-ghost{white-space:nowrap}
/* Екип → Потребители of a real company (team_members.html) */
.tmm{display:flex;flex-direction:column;gap:16px;max-width:1000px}
.tmm-plan{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink2);flex-wrap:wrap}.tmm-plan .ic{font-size:18px}
.tmm-sec{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:6px 16px 10px}
.tmm-sec h3{display:flex;align-items:center;gap:8px;font-size:15px;margin:10px 0 4px}.tmm-sec h3 .ic{font-size:19px;color:var(--ink2)}
.tmm-row{display:flex;align-items:center;gap:10px;padding:10px 0;border-top:1px solid var(--line);flex-wrap:wrap}
.tmm-sec h3+.tmm-row{border-top:none}
.tmm-row.frozen{opacity:.6}
.tmm-av{width:36px;height:36px;border-radius:18px;background:var(--accentSoft);color:var(--accentText);display:grid;place-items:center;font-weight:700;font-size:13px;flex:none}
.tmm-who{flex:1;min-width:180px;display:flex;flex-direction:column;gap:1px}.tmm-who span{font-size:12px;color:var(--ink2)}
.tmm-who .tmm-msg{font-style:italic}.tmm-me{font-weight:400;color:var(--ink2)}
.tmm-badge{font-size:12px;font-weight:600;padding:4px 10px;border-radius:99px;background:var(--surface2);color:var(--ink)}
.tmm-badge.owner{background:var(--accentSoft);color:var(--accentText)}.tmm-badge.frozen{background:var(--warnSoft);color:var(--warnText)}
.tmm-ext{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--ink2)}
.tmm .btn-ghost{height:36px;padding:0 12px;border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font:inherit;font-size:13px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.tmm .btn-ghost .ic{font-size:17px}.tmm .tmm-danger{color:var(--badText)}.tmm .tmm-danger.sure{background:var(--badSoft);border-color:var(--bad)}
.tmm .btn-primary{height:36px;padding:0 14px;border-radius:10px;font-size:13px}
.tmm-role{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--ink2)}.tmm-role select{height:36px;border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:0 8px}
.tmm-dlg form{max-width:560px}
.tmm-roles{display:flex;flex-direction:column;gap:8px}
.tmm-rc{flex-direction:row!important;align-items:flex-start!important;gap:10px!important;padding:10px 12px;border:1px solid var(--line);border-radius:12px;cursor:pointer}
.tmm-rc span{display:flex;flex-direction:column;gap:2px;color:var(--ink)}.tmm-rc small{color:var(--ink2);font-size:12px}
.tmm-rc:has(input:checked){border-color:var(--accent);background:var(--accentSoft)}
.tmm-matrix{display:flex;flex-direction:column;gap:6px;max-height:46vh;overflow:auto;border:1px solid var(--line);border-radius:12px;padding:8px 12px}
.tmm-matrix[hidden]{display:none}
.tmm-mrow{display:grid;grid-template-columns:150px 1fr;gap:8px;padding:6px 0;border-top:1px solid var(--line);font-size:13px}.tmm-mrow:first-child{border-top:none}
.tmm-macts{display:flex;flex-wrap:wrap;gap:6px 14px}.tmm-macts label{flex-direction:row!important;align-items:center;gap:4px!important;color:var(--ink)!important;font-size:13px!important}
.tmm-quick{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:12px;color:var(--ink2)}
.tmm-chip{height:30px;padding:0 12px;border-radius:15px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font:inherit;font-size:12px;font-weight:600;cursor:pointer}
@media (max-width:600px){.tmm-mrow{grid-template-columns:1fr}}
.inv-card{align-items:center;text-align:center;gap:12px}.inv-card .btn-social,.inv-card .auth-go{align-self:stretch}

/* document form: the strict series' ranges (main + extra) offered by their next number */
.num-range{height:28px;padding:0 10px;border-radius:14px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font:12px 'JetBrains Mono',monospace;cursor:pointer}
.num-range.on{border-color:var(--accent);background:var(--accentSoft);color:var(--accentText);font-weight:600}
.ng-ranges{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--ink2);padding:2px 0 6px 2px;font-family:'JetBrains Mono',monospace}.ng-ranges .ic{font-size:16px;color:var(--aiText)}

/* Входящи: the record just saved from a scan (/m/docs/in#in-<id>) */
.in-grid:target{background:var(--accentSoft);box-shadow:inset 3px 0 0 var(--accent);scroll-margin-top:120px}
.in-card.in-hl{border-color:var(--accent);background:var(--accentSoft)}
/* sector picker (КИД-2008): chips + search + list — Моите фирми and the setup wizard (static/js/sectors.js) */
.sec-field{display:flex;flex-direction:column;gap:5px;font-size:12px;color:var(--ink2)}
.sec-field>span{display:flex;gap:6px;align-items:baseline;flex-wrap:wrap}.sec-field>span i{font-style:normal;font-size:11px}
.sec-pick{position:relative;display:flex;flex-direction:column;gap:6px;min-width:0}
.sec-pick .sec-q{width:100%;min-width:0;box-sizing:border-box}
.sec-chips{display:flex;flex-wrap:wrap;gap:6px}.sec-chips[hidden]{display:none}
.sec-chip{display:inline-flex;align-items:center;gap:6px;max-width:100%;min-height:30px;padding:0 4px 0 10px;border-radius:15px;background:var(--surface2);color:var(--ink);font-size:13px}
.sec-chip b{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--accentText)}
.sec-chip-n{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:260px}
.sec-x{width:22px;height:22px;flex:none;border-radius:11px;border:none;background:transparent;color:var(--ink2);cursor:pointer;display:grid;place-items:center;padding:0}.sec-x:hover{background:var(--line)}.sec-x .ic{font-size:15px}
.sec-list{position:absolute;z-index:30;left:0;right:0;top:100%;margin-top:4px;max-height:300px;overflow-y:auto;background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 32px rgba(0,0,0,.14);padding:4px}.sec-list[hidden]{display:none}
.sec-opt{display:flex;align-items:baseline;gap:8px;width:100%;text-align:left;border:none;background:transparent;color:var(--ink);font:inherit;font-size:13px;line-height:1.35;padding:7px 10px;border-radius:8px;cursor:pointer}
.sec-opt:hover,.sec-opt.hl{background:var(--surface2)}
.sec-opt b{flex:none;min-width:44px;font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--ink2)}
.sec-opt span:not(.ic){flex:1;min-width:0}
.sec-opt.lv0{font-weight:650}.sec-opt.lv0 b{color:var(--accentText)}.sec-opt.lv1{padding-left:18px}.sec-opt.lv2{padding-left:26px}.sec-opt.lv3{padding-left:34px}
.sec-opt .sec-ok{visibility:hidden;font-size:17px;color:var(--accentText);align-self:center}.sec-opt.on{background:var(--accentSoft,var(--surface2))}.sec-opt.on .sec-ok{visibility:visible}
.sec-empty{padding:10px;font-size:12px;color:var(--ink2)}
.sec-note{font-size:12px;color:var(--badText)}.sec-note[hidden]{display:none}
.co-sectors{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}.co-sectors span{font-size:12px;padding:3px 9px;border-radius:12px;background:var(--surface2);color:var(--ink2)}.co-sectors b{font-family:'JetBrains Mono',monospace;font-weight:600;color:var(--ink);margin-right:4px}
.adm-sectors{margin-bottom:12px}.adm-sectors summary{cursor:pointer;font-weight:650;display:flex;gap:8px;align-items:center}.adm-sectors summary .ic{font-size:19px;color:var(--ink2)}.adm-sectors table{margin-top:8px}

/* superadmin campaign: a button waiting for its second, confirming click */
.adm-acts button.armed,[data-cancel].armed,[data-ai].armed{background:var(--warnSoft)!important;color:var(--warnText)!important;border-color:var(--warnText)!important}

/* in-page confirm / prompt (app.js ood.confirm, ood.prompt) — never the browser's dialogs */
.ood-ask form{gap:14px}.ood-ask-text{margin:0;font-size:15px;line-height:1.5;white-space:pre-line}
.ood-ask-input{min-height:80px;border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:10px 12px;font:inherit;font-size:14px;resize:vertical}
input.ood-ask-input{min-height:0;height:40px}.ood-ask-err{color:var(--badText)!important}.ood-ask-danger{background:var(--bad,#c0392b)!important;color:#fff!important}