/* Штаб STOP PIRAMIDA — чёрная шапка со «стоп-лентой», вкладки сверху на компьютере и снизу на телефоне */
:root{
  --bg:#F3F3F0; --surface:#FFFFFF; --sunk:#EBEAE5; --ink:#161616; --muted:#615F58; --line:#DDDBD4;
  --yellow:#FDBB03; --orange:#EB9B22; --red:#B71F36; --blue:#004AA9; --green:#1C7A44;
  --red-soft:#F7E3E6; --blue-soft:#E2EBF7; --green-soft:#E1F1E7; --yellow-soft:#FFF3CC;
  --bar:#161616; --bar-ink:#F5F4EF; --bar-muted:#B8B6AE; --bar-line:#3A3A37; --bar-field:#262624;
  --f-display:"Montserrat","Arial Black",system-ui,sans-serif;
  --f-body:"Golos Text",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,Menlo,Consolas,monospace;
  --nav-h:0px;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root{
  --bg:#111111; --surface:#1B1B1A; --sunk:#232321; --ink:#F1F0EB; --muted:#A4A29B; --line:#30302D;
  --red:#E35A6E; --blue:#6A9CEB; --green:#52B87D; --orange:#F0A945;
  --red-soft:#3A1F24; --blue-soft:#1C2940; --green-soft:#1B3125; --yellow-soft:#3A3115;
  --bar:#0A0A0A; color-scheme:dark}}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--bg);color:var(--ink);font-family:var(--f-body);font-size:15px;line-height:1.45;-webkit-text-size-adjust:100%;min-height:100vh;padding-bottom:calc(var(--nav-h) + env(safe-area-inset-bottom,0px))}
[hidden]{display:none!important}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--orange);outline-offset:2px}
.wrap{max-width:1240px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.boot{min-height:100vh;display:grid;place-items:center;background:var(--bar)}
.mark{width:40px;height:40px;background:var(--yellow);color:#161616;display:grid;place-items:center;font-family:var(--f-display);font-weight:800;font-size:12px;letter-spacing:.02em;clip-path:polygon(29% 0,71% 0,100% 29%,100% 71%,71% 100%,29% 100%,0 71%,0 29%);flex:none}
.mark.big{width:84px;height:84px;font-size:22px}

/* login */
.auth{min-height:100vh;background:var(--bar);color:var(--bar-ink);display:flex;flex-direction:column}
.auth .tape{flex:none}
.auth-in{flex:1;display:grid;place-items:center;padding:32px max(16px,env(safe-area-inset-right,0px)) 32px max(16px,env(safe-area-inset-left,0px))}
.auth-card{width:100%;max-width:380px;display:flex;flex-direction:column;gap:18px}
.auth-card h1{font-family:var(--f-display);font-weight:800;font-size:26px;letter-spacing:.03em;text-transform:uppercase;margin:0;line-height:1.1}
.auth-card p{margin:0;color:var(--bar-muted);font-size:14px}
.auth-card .field label{color:var(--bar-muted)}
.auth-card .inp{background:var(--bar-field);border-color:var(--bar-line);color:var(--bar-ink);padding:12px 12px;font-size:16px}
.auth-card .btn.primary{padding:12px;font-size:16px;justify-content:center}
.auth-err{background:#3A1F24;color:#FFB3BE;border-radius:8px;padding:10px 12px;font-size:14px}
.auth-foot{font-size:12px;color:var(--bar-muted);text-align:center;padding-bottom:calc(16px + env(safe-area-inset-bottom,0px))}

/* header */
header.top{background:var(--bar);color:var(--bar-ink);padding-top:env(safe-area-inset-top,0px)}
.hd{display:flex;align-items:center;gap:14px;padding-block:12px}
.brand{display:flex;align-items:center;gap:12px;min-width:0;flex:1}
.brand h1{margin:0;font-family:var(--f-display);font-weight:800;font-size:17px;letter-spacing:.04em;text-transform:uppercase;line-height:1.1}
.brand p{margin:2px 0 0;font-size:12px;color:var(--bar-muted)}
.hd-r{display:flex;align-items:center;gap:12px}
.switch{display:flex;align-items:center;gap:8px;cursor:pointer;font-size:13px;font-weight:600;user-select:none;color:var(--bar-ink);position:relative}
.switch input{position:absolute;opacity:0;width:1px;height:1px}
.switch .tr{width:38px;height:22px;border-radius:11px;background:var(--bar-line);position:relative;transition:background .15s;flex:none}
.switch .tr::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#F5F4EF;transition:transform .15s}
.switch input:checked + .tr{background:var(--yellow)}
.switch input:checked + .tr::after{transform:translateX(16px);background:#161616}
.switch .lbl-s{display:none}
.switch input:focus-visible + .tr{outline:2px solid var(--orange);outline-offset:2px}
.userbtn{background:var(--bar-field);border:1px solid var(--bar-line);color:var(--bar-ink);border-radius:999px;padding:6px 12px;font-size:13px;cursor:pointer;max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.menu{position:absolute;right:max(16px,env(safe-area-inset-right,0px));top:calc(60px + env(safe-area-inset-top,0px));background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:10px;box-shadow:0 12px 40px rgba(0,0,0,.25);z-index:40;min-width:220px;overflow:hidden}
.menu .who{padding:12px 14px;border-bottom:1px solid var(--line);font-size:13px;color:var(--muted)}
.menu .who b{display:block;color:var(--ink);font-size:14px}
.menu button{display:block;width:100%;text-align:left;background:none;border:0;padding:12px 14px;cursor:pointer}
.menu button:hover{background:var(--sunk)}
.tape{height:8px;background:repeating-linear-gradient(-45deg,var(--yellow) 0 14px,#161616 14px 28px)}

nav.tabs{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none}
.tabline{border-bottom:1px solid var(--line);background:var(--bg)}
nav.tabs button{background:none;border:0;padding:12px 14px 10px;font-weight:600;color:var(--muted);cursor:pointer;white-space:nowrap;border-bottom:3px solid transparent;display:flex;align-items:center;gap:8px}
nav.tabs button svg{width:18px;height:18px;flex:none}
nav.tabs button[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--yellow)}
nav.tabs button:hover{color:var(--ink)}
main{padding-block:20px 48px}

/* generic */
.btn{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:8px 14px;font-weight:600;cursor:pointer;white-space:nowrap;min-height:38px}
.btn:hover{border-color:var(--muted)}
.btn.primary{background:var(--yellow);border-color:var(--yellow);color:#161616}
.btn.primary:hover{background:var(--orange);border-color:var(--orange)}
.btn.danger{color:var(--red);border-color:var(--red)}
.btn.ghost{background:none;border-color:transparent}
.btn.sm{padding:4px 10px;font-size:13px;min-height:30px}
.btn:disabled{opacity:.5;cursor:not-allowed}
.field{display:flex;flex-direction:column;gap:4px;min-width:0}
.field label{font-size:12px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.inp{background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:9px 10px;width:100%;min-width:0;font-size:15px}
.inp:disabled{background:var(--sunk);color:var(--muted)}
textarea.inp{resize:vertical;min-height:72px}
.muted{color:var(--muted)}
.mono{font-family:var(--f-mono);font-size:13px;font-variant-numeric:tabular-nums}
h2.sec{font-family:var(--f-display);font-weight:800;font-size:20px;margin:0;text-wrap:balance;letter-spacing:.01em}
.sec-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.sec-row .sp{flex:1}
.notice{border:1px dashed var(--line);border-radius:10px;padding:28px 20px;text-align:center;color:var(--muted);background:var(--surface)}
.notice b{color:var(--ink);display:block;font-size:16px;margin-bottom:4px}
.hint{font-size:13px;color:var(--muted);background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:12px 14px;margin-top:16px;max-width:75ch}
.hint b{color:var(--ink)}
.ro{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--muted);background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:4px 10px}
.offline{background:var(--yellow-soft);color:var(--ink);font-size:13px;text-align:center;padding:6px 16px}

/* summary */
.sum{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:18px}
.sum>div,.sum>button{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:12px 14px}
.sum .n{font-family:var(--f-display);font-weight:800;font-size:26px;font-variant-numeric:tabular-nums;line-height:1}
.sum .l{font-size:12px;color:var(--muted);margin-top:6px}
.sum .warn .n{color:var(--red)} .sum .soon .n{color:var(--orange)} .sum .ok .n{color:var(--green)}

/* filters */
.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.filters .inp{width:auto;flex:1 1 150px}
.filters input.inp{flex:2 1 200px}

/* tasks */
.list{background:var(--surface);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.trow{display:grid;grid-template-columns:150px minmax(0,1fr) 170px 150px 34px;gap:12px;align-items:center;padding:12px 14px;border-top:1px solid var(--line);position:relative}
.trow:first-child{border-top:0}
.trow.head{background:var(--sunk);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);padding-block:8px}
.trow::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:transparent}
.trow.p-high::before{background:var(--red)}
.trow.is-done .ttl{text-decoration:line-through;color:var(--muted)}
.ttl{font-weight:600;cursor:pointer;background:none;border:0;padding:0;text-align:left;width:100%}
.ttl:hover{color:var(--blue)}
.sub{font-size:12px;color:var(--muted);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sub .hi{color:var(--red);font-weight:600}
.assg{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.assg small{display:block;color:var(--muted);font-size:12px}
.due{font-size:13px}
.due .mono{display:block}
.due .rel{font-size:12px;color:var(--muted)}
.due.over .rel{color:var(--red);font-weight:600}
.due.soon .rel{color:var(--orange);font-weight:600}
select.st{appearance:none;-webkit-appearance:none;border-radius:999px;border:1px solid transparent;padding:6px 26px 6px 12px;font-size:13px;font-weight:600;cursor:pointer;width:100%;background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%);background-position:calc(100% - 13px) 52%,calc(100% - 9px) 52%;background-size:4px 4px;background-repeat:no-repeat}
select.st:disabled{cursor:default;opacity:1;background-image:none;padding-right:12px}
.s-todo{background-color:var(--sunk);color:var(--muted)}
.s-progress{background-color:var(--blue-soft);color:var(--blue)}
.s-done{background-color:var(--green-soft);color:var(--green)}
.s-failed{background-color:var(--red-soft);color:var(--red)}
.s-overdue{background-color:var(--red-soft);color:var(--red);border-color:var(--red)}
select.st option{background:var(--surface);color:var(--ink)}
.pill{display:inline-block;border-radius:999px;padding:2px 9px;font-size:12px;font-weight:600;background:var(--yellow-soft);color:var(--ink)}
.more{background:none;border:0;cursor:pointer;color:var(--muted);font-size:20px;line-height:1;padding:4px 8px;border-radius:6px}
.more:hover{background:var(--sunk);color:var(--ink)}

.s-review{background-color:var(--yellow-soft);color:var(--ink)}
.s-ready{background-color:var(--surface);color:var(--green);border-color:var(--green)}
.s-cancel{background-color:var(--sunk);color:var(--muted);text-decoration:line-through}
.sum>button.sum-btn{font:inherit;text-align:left;cursor:pointer;color:inherit}
.sum>button.sum-btn:hover{border-color:var(--red)}
nav.tabs .l-short{display:none}

/* content plan */
.cday{padding:9px 14px 7px;background:var(--sunk);border-top:1px solid var(--line);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.cday:first-child{border-top:0}
.cday .wd{color:var(--ink)}
.cday .rel{text-transform:none;letter-spacing:0;font-weight:600;margin-left:6px;color:var(--muted)}
.cday .rel.now{color:#161616;background:var(--yellow);border-radius:999px;padding:1px 8px}
.cday.today{background:var(--yellow-soft)}
.crow{display:grid;grid-template-columns:170px minmax(0,1fr) 110px 150px 120px 34px;gap:12px;align-items:center;padding:11px 14px;border-top:1px solid var(--line)}
.cday+.crow{border-top:0}
.crow.is-cancel .ttl{text-decoration:line-through;color:var(--muted)}
.plat{display:inline-block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:600;border:1px solid var(--line);border-radius:6px;padding:2px 8px;background:var(--bg)}
.c-v{display:flex;flex-direction:column;align-items:flex-end;gap:2px;font-size:12px;min-width:0}
.c-v .mono{font-size:12px;color:var(--muted)}
.c-v .late{color:var(--red);font-weight:600}
.lnk{color:var(--blue);font-weight:600;text-decoration:none;font-size:13px;white-space:nowrap}
.lnk:hover{text-decoration:underline}

.fres{display:flex;align-items:center;gap:12px;margin:-4px 0 12px;font-size:13px}
.notice .lnkbtn{font-size:inherit}
/* password eye */
.pw-wrap{position:relative}
.pw-wrap .inp{padding-right:46px}
.eye{position:absolute;right:4px;top:50%;transform:translateY(-50%);width:38px;height:38px;border:0;background:none;color:inherit;opacity:.7;cursor:pointer;display:grid;place-items:center;border-radius:8px}
.eye:hover{opacity:1}
.eye svg{width:20px;height:20px}
.auth-card .eye{color:var(--bar-ink)}

/* notifications */
.bell{position:relative;background:var(--bar-field);border:1px solid var(--bar-line);color:var(--bar-ink);border-radius:999px;width:36px;height:34px;display:grid;place-items:center;cursor:pointer;flex:none}
.bell svg{width:18px;height:18px}
.bell .badge{position:absolute;top:-5px;right:-5px;min-width:18px;height:18px;border-radius:9px;background:var(--red);color:#fff;font-size:11px;font-weight:700;display:grid;place-items:center;padding:0 4px;border:2px solid var(--bar)}
.npanel{width:min(380px,calc(100vw - 32px));max-height:min(70vh,560px);display:flex;flex-direction:column}
.npanel .nh{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-bottom:1px solid var(--line)}
.lnkbtn{background:none;border:0;color:var(--blue);font-weight:600;cursor:pointer;padding:0;font-size:13px;width:auto!important}
.npush{display:flex;flex-direction:column;gap:8px;padding:10px 14px;border-bottom:1px solid var(--line);font-size:13px;color:var(--muted);background:var(--bg)}
.npush .nbtns{display:flex;gap:6px}
.npanel .npush .btn{width:auto;display:inline-flex;border:1px solid var(--line);padding:4px 10px;background:var(--surface)}
.npanel .npush .btn.primary{background:var(--yellow);border-color:var(--yellow)}
.nlist{overflow-y:auto}
.npanel .nitem{display:flex!important;flex-direction:column;gap:2px;width:100%;text-align:left;border-bottom:1px solid var(--line)!important;padding:10px 14px}
.nitem span{font-size:14px;color:var(--ink)}
.nitem small{font-size:12px;color:var(--muted)}
.nitem.unread{background:var(--yellow-soft)}
.nempty{padding:18px 14px;font-size:13px;color:var(--muted)}

/* files */
.files-box{border-top:1px solid var(--line);padding-top:12px}
.fup{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:8px}
.fup label.btn{cursor:pointer;text-transform:none;letter-spacing:0;font-size:14px;color:var(--ink)}
.fnote{font-size:12px}
.fitem{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px dashed var(--line);flex-wrap:wrap}
.fitem:last-child{border-bottom:0}
.fmeta{flex:1;min-width:140px;display:flex;flex-direction:column;gap:2px}
.fmeta b{font-weight:600;font-size:14px;word-break:break-word}
.fmeta small{font-size:12px;color:var(--muted)}
.facts{display:flex;gap:6px;flex-wrap:wrap}
.facts .btn{text-decoration:none;color:var(--ink)}
.ficon{width:40px;height:40px;border-radius:8px;display:grid;place-items:center;font-size:11px;font-weight:800;font-family:var(--f-display);flex:none;background:var(--sunk);color:var(--muted)}
.ficon.f-w{background:#E2EBF7;color:#2B579A}.ficon.f-x{background:#E1F1E7;color:#1D6F42}.ficon.f-p{background:#FBE7DF;color:#C43E1C}.ficon.f-pdf{background:var(--red-soft);color:var(--red)}
.fthumb{width:56px;height:56px;border-radius:8px;overflow:hidden;flex:none;background:var(--sunk);display:block}
.fthumb img{width:100%;height:100%;object-fit:cover;display:block}
.fbar{height:6px;background:var(--sunk);border-radius:3px;overflow:hidden;display:block;margin-top:4px}
.fbar i{display:block;height:100%;background:var(--blue);transition:width .2s}

/* voice */
.voice-box{background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.vrec{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:8px}
.rec-dot{width:10px;height:10px;border-radius:50%;background:var(--red);display:inline-block}
.btn.recording{border-color:var(--red);color:var(--red);background:var(--red-soft)}
.btn.recording .rec-dot{animation:recblink 1s steps(2,start) infinite}
@keyframes recblink{to{visibility:hidden}}
.vitem{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:8px 0;border-bottom:1px dashed var(--line)}
.vitem:last-child{border-bottom:0}
.vmeta{font-size:13px;color:var(--muted);flex:1;min-width:0}
.vmeta b{color:var(--ink);font-weight:600}
.vaudio{flex-basis:100%}
.vaudio:empty{display:none}
.vaudio audio{width:100%;height:40px}
.vnone{font-size:13px}
.vhint{font-size:12px;margin:6px 0 0}
.vc{color:var(--blue);font-weight:600}

/* import */
.imp-steps p{margin:0 0 8px;font-size:14px}
.imp-steps p.muted{font-size:13px}
.imp-box{border:1px solid var(--line);border-radius:10px;padding:12px 14px;background:var(--bg);font-size:14px}
.imp-box+.imp-box{margin-top:10px}
.imp-box.bad{border-color:var(--red);background:var(--red-soft);color:var(--red);font-weight:600}
.imp-box.warnbox{border-color:var(--orange)}
.imp-h{font-family:var(--f-display);font-weight:700;font-size:14px;margin-bottom:6px}
.imp-list,.imp-warn{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:3px}
.imp-list b{font-variant-numeric:tabular-nums}
.imp-warn{max-height:220px;overflow-y:auto;font-size:13px;color:var(--muted)}

/* plans */
.plans{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.plan{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:16px;display:flex;flex-direction:column;gap:10px;min-width:0}
.plan h3{margin:0;font-family:var(--f-display);font-weight:700;font-size:16px;text-wrap:balance}
.plan .meta{display:flex;gap:8px;flex-wrap:wrap;font-size:12px;color:var(--muted);align-items:center}
.bar{height:8px;background:var(--sunk);border-radius:4px;overflow:hidden;display:flex}
.bar i{display:block;height:100%}
.bar .g{background:var(--green)}.bar .r{background:var(--red)}.bar .b{background:var(--blue)}
.plan ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;font-size:13px}
.plan li{display:flex;gap:8px;align-items:baseline;min-width:0}
.plan li .dot{width:8px;height:8px;border-radius:50%;flex:none;transform:translateY(-1px)}
.dot.done{background:var(--green)}.dot.failed,.dot.overdue{background:var(--red)}.dot.progress{background:var(--blue)}.dot.todo{background:var(--line)}
.plan li button{background:none;border:0;padding:0;text-align:left;cursor:pointer;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.plan li button:hover{color:var(--blue)}
.plan li .mono{margin-left:auto;font-size:12px;color:var(--muted)}
.plan .foot{display:flex;gap:8px;margin-top:auto;padding-top:4px;flex-wrap:wrap}

/* team */
.team{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.mem{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:8px;min-width:0}
.mem .role{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--orange)}
.mem .nm{font-weight:600;font-size:16px}
.mem .stats{display:flex;gap:12px;font-size:12px;color:var(--muted);flex-wrap:wrap}
.mem .stats b{color:var(--ink);font-variant-numeric:tabular-nums}
.mem .stats .r b{color:var(--red)}
.mem .acc{font-size:12px;color:var(--muted)}

/* tables */
.tblw{overflow-x:auto;background:var(--surface);border:1px solid var(--line);border-radius:12px;-webkit-overflow-scrolling:touch}
table{border-collapse:collapse;width:100%;min-width:720px;font-size:14px}
th,td{padding:10px 12px;text-align:right;border-top:1px solid var(--line);font-variant-numeric:tabular-nums;white-space:nowrap}
th{background:var(--sunk);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);border-top:0}
th:first-child,td:first-child{text-align:left}
td:first-child small{display:block;color:var(--muted);font-size:12px}
tr.tot td{font-weight:700;background:var(--sunk)}
td.bad{color:var(--red);font-weight:600}
td.good{color:var(--green);font-weight:600}
td.wrap{white-space:normal;min-width:220px}
td.wrap small{display:block;color:var(--muted);font-size:12px}
table.audit td,table.audit th{text-align:left}
tr.bad-row,tr.bad-row td{background:var(--red-soft)}
tr.bad-row td:nth-child(3){color:var(--red);font-weight:600}
.rate{display:flex;align-items:center;gap:8px;justify-content:flex-end}
.rate .bar{width:70px}
.rp-ctl{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-end;margin-bottom:16px}
.rp-ctl .field{flex:0 1 180px}
.rp-ctl .lbl{font-size:13px;color:var(--muted);padding-bottom:10px}
.rp-h{font-family:var(--f-display);font-weight:700;font-size:16px;margin:24px 0 10px}

/* users */
.users{display:flex;flex-direction:column;gap:10px}
.urow{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:12px 14px;display:grid;grid-template-columns:minmax(0,1.2fr) 170px minmax(0,1.4fr) auto;gap:10px;align-items:center}
.urow .lg{font-weight:600;overflow:hidden;text-overflow:ellipsis}
.urow .lg small{display:block;font-weight:400;color:var(--muted);font-size:12px}
.urow .acts{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.urow.off{opacity:.6}
.tag{font-size:11px;font-weight:600;border-radius:999px;padding:2px 8px;background:var(--sunk);color:var(--muted);margin-left:6px}
.tag.adm{background:var(--yellow-soft);color:var(--ink)}
.pwbox{font-family:var(--f-mono);font-size:16px;background:var(--sunk);border-radius:8px;padding:10px 12px;user-select:all;word-break:break-all}

/* modal */
.ov{position:fixed;inset:0;background:rgba(10,10,10,.55);display:flex;align-items:flex-start;justify-content:center;padding:max(24px,env(safe-area-inset-top,0px)) max(12px,env(safe-area-inset-right,0px)) max(24px,env(safe-area-inset-bottom,0px)) max(12px,env(safe-area-inset-left,0px));overflow-y:auto;z-index:50}
.md{background:var(--surface);border-radius:14px;width:100%;max-width:620px;box-shadow:0 20px 60px rgba(0,0,0,.35);overflow:hidden}
.md-h{display:flex;align-items:center;gap:10px;padding:16px 18px;border-bottom:1px solid var(--line)}
.md-h h3{margin:0;font-family:var(--f-display);font-weight:800;font-size:17px;flex:1}
.md-b{padding:18px;display:grid;grid-template-columns:1fr 1fr;gap:14px}
.md-b .full{grid-column:1/-1}
.md-f{display:flex;gap:8px;padding:14px 18px;border-top:1px solid var(--line);background:var(--sunk);flex-wrap:wrap}
.md-f .sp{flex:1}
.hist{grid-column:1/-1;font-size:12px;color:var(--muted);border-top:1px solid var(--line);padding-top:10px;display:flex;flex-direction:column;gap:3px}
.hist b{color:var(--ink);font-weight:600}
.toast{position:fixed;left:50%;bottom:calc(20px + var(--nav-h) + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:8px;font-size:14px;z-index:60;max-width:calc(100% - 32px);text-align:center}
.fab{display:none}

/* ---------- mobile ---------- */
@media (max-width:820px){
  .trow{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"t t" "a a" "s d";row-gap:8px}
  .trow.head{display:none}
  .trow>.c-st{grid-area:s}.trow>.c-t{grid-area:t;padding-right:30px}.trow>.c-a{grid-area:a}.trow>.c-d{grid-area:d;text-align:right}.trow>.c-m{position:absolute;right:6px;top:8px}
  .assg small{display:inline;margin-left:6px}
  .crow{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"t t" "p a" "s v";row-gap:8px;position:relative}
  .crow>.c-st{grid-area:s}.crow>.c-t{grid-area:t;padding-right:30px}.crow>.c-p{grid-area:p}.crow>.c-a{grid-area:a;text-align:right;font-size:13px;color:var(--muted)}.crow>.c-v{grid-area:v;justify-content:center}.crow>.c-m{position:absolute;right:6px;top:8px}
  .urow{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .urow .lg{grid-column:1/-1}
  .urow .acts{grid-column:1/-1;justify-content:flex-start}
}
@media (max-width:700px){
  :root{--nav-h:64px}
  .brand p{display:none}
  .switch .lbl{display:none}
  .switch .lbl-s{display:inline;font-size:12px}
  .userbtn{max-width:120px}
  .tabline{border:0}
  nav.tabs{position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--surface);border-top:1px solid var(--line);padding:0 env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px);gap:0;overflow:visible}
  nav.tabs button{flex:1;flex-direction:column;gap:3px;padding:9px 2px 8px;font-size:11px;border-bottom:0;border-top:3px solid transparent;min-width:0}
  nav.tabs button[aria-selected="true"]{border-top-color:var(--yellow);border-bottom-color:transparent}
  nav.tabs button svg{width:22px;height:22px}
  nav.tabs .l-full{display:none}
  nav.tabs .l-short{display:inline}
  nav.tabs button span{max-width:100%;overflow:hidden;text-overflow:ellipsis}
  .sum{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sum .n{font-size:22px}
  .filters .inp{flex:1 1 calc(50% - 4px)}
  .filters input.inp{flex:1 1 100%}
  .sec-row .newbtn{display:none}
  .fab{display:flex;position:fixed;right:max(16px,env(safe-area-inset-right,0px));bottom:calc(var(--nav-h) + 16px + env(safe-area-inset-bottom,0px));width:56px;height:56px;border-radius:50%;background:var(--yellow);color:#161616;border:0;font-size:30px;line-height:1;align-items:center;justify-content:center;box-shadow:0 6px 20px rgba(0,0,0,.3);z-index:31;cursor:pointer}
  /* Карточка на весь экран: шапка и кнопки на месте, прокручивается только середина (так надёжно работает в Safari на iPhone) */
  .ov{padding:0;align-items:stretch;overflow:hidden;height:100%;height:100dvh}
  .md{border-radius:0;max-width:none;height:100%;min-height:0;display:flex;flex-direction:column;overflow:hidden;padding-top:env(safe-area-inset-top,0px)}
  .md-h{flex:none}
  .md form{display:flex;flex-direction:column;flex:1;min-height:0}
  .md-b{grid-template-columns:1fr;flex:1 1 auto;min-height:0;align-content:start;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;touch-action:pan-y}
  .md-f{flex:none;padding-bottom:calc(14px + env(safe-area-inset-bottom,0px))}
  .md-b .inp:disabled{pointer-events:none}
  .md-f .btn{flex:1;justify-content:center}
  .md-f .sp{display:none}
  .inp,select.inp,textarea.inp{font-size:16px}
  table.audit{min-width:0}
  table.audit thead{display:none}
  table.audit tr{display:grid;grid-template-columns:auto minmax(0,1fr);gap:2px 10px;padding:10px 12px;border-top:1px solid var(--line)}
  table.audit tr:first-child{border-top:0}
  table.audit tbody{display:block}
  table.audit td{display:block;text-align:left;border:0;padding:0;white-space:normal;min-width:0;background:none}
  table.audit td:nth-child(2){font-weight:600}
  table.audit td:nth-child(3){grid-column:1/-1}
  table.audit td:nth-child(4),table.audit td:nth-child(5){font-size:12px;color:var(--muted)}
  main{padding-block:16px 96px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* ---------- адаптив: большие экраны, планшеты, маленькие телефоны ---------- */
@media (min-width:1600px){ .wrap{max-width:1480px} .trow{grid-template-columns:170px minmax(0,1fr) 220px 170px 34px} .crow{grid-template-columns:190px minmax(0,1fr) 130px 200px 140px 34px} }
@media (min-width:2200px){ .wrap{max-width:1760px} body{font-size:16px} }
/* планшет вертикально: таблица задач вместо карточек */
@media (min-width:721px) and (max-width:820px){
  .trow{grid-template-columns:130px minmax(0,1fr) 130px 110px 30px;grid-template-areas:none;row-gap:0}
  .trow.head{display:grid}
  .trow>.c-st,.trow>.c-t,.trow>.c-a,.trow>.c-d{grid-area:auto}.trow>.c-t{padding-right:0}.trow>.c-d{text-align:left}.trow>.c-m{position:static}
  .assg small{display:block;margin-left:0}
  .crow{grid-template-columns:150px minmax(0,1fr) 100px 120px 30px;grid-template-areas:none;row-gap:0}
  .crow>.c-st,.crow>.c-t,.crow>.c-p,.crow>.c-a,.crow>.c-v{grid-area:auto}.crow>.c-t{padding-right:0}.crow>.c-a{text-align:left;font-size:14px;color:var(--ink)}.crow>.c-m{position:static}
  .crow>.c-v{display:none}
}
/* карточки на телефоне: статус не растягиваем на всю ширину */
@media (max-width:720px){ .trow>.c-st select.st,.crow>.c-st select.st{max-width:230px} }
/* таблицы отчёта на узких экранах: первый столбец закреплён при прокрутке */
@media (max-width:820px){
  .tblw table th:first-child,.tblw table td:first-child{position:sticky;left:0;z-index:1;background:var(--surface);box-shadow:1px 0 0 var(--line)}
  .tblw table th:first-child{background:var(--sunk)} .tblw tr.tot td:first-child{background:var(--sunk)}
  .tblw table.audit td:first-child{position:static;box-shadow:none}
}
/* маленькие телефоны */
@media (max-width:400px){
  .brand h1{font-size:15px;white-space:nowrap}
  .brand .mark{width:34px;height:34px;font-size:10px}
  .hd{gap:8px}.hd-r{gap:8px}
  .switch .lbl-s{display:none}
  .userbtn{max-width:84px;padding:6px 10px}
  h2.sec{font-size:18px}
  .sum .n{font-size:20px}
}

/* пока открыта карточка, страница под ней не прокручивается */
html.modal-open,html.modal-open body{overflow:hidden}