/* ============ палитра ============ */
:root{
  --bg:#f4f6f9; --panel:#fff; --panel2:#fbfcfd;
  --line:#e4e8ee; --line2:#eef1f5;
  --text:#0f1621; --text2:#3d4757; --muted:#7b8798;
  --accent:#3b64f5; --accent2:#5b7ff8; --accent-soft:#eaefff; --accent-line:#c9d6fe;
  --ok:#0f9960; --ok-soft:#e6f6ee; --ok-line:#b8e6cd;
  --pw:#7c3aed; --pw-soft:#f2ecfe; --pw-line:#dccdfb;
  --tc:#c2700a; --tc-soft:#fdf3e3; --tc-line:#f2d6a4;
  --red:#d92d20; --red-soft:#fdecea; --red-line:#f5c2bd;
  --sh1:0 1px 2px rgba(15,22,33,.05);
  --sh2:0 2px 4px rgba(15,22,33,.04), 0 8px 20px -6px rgba(15,22,33,.10);
  --sh3:0 18px 48px -12px rgba(15,22,33,.28);
  --av-s:58%; --av-l:91%; --avf-s:48%; --avf-l:36%;
}
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]){
  --bg:#0b0e14; --panel:#151a23; --panel2:#1a202b;
  --line:#252c38; --line2:#1f2530;
  --text:#e9edf4; --text2:#b9c2d0; --muted:#7e8899;
  --accent:#6c92ff; --accent2:#8aabff; --accent-soft:#1a2340; --accent-line:#2e3b63;
  --ok:#42cd8b; --ok-soft:#122a1f; --ok-line:#1e4534;
  --pw:#b18aff; --pw-soft:#211a35; --pw-line:#392d5c;
  --tc:#e0a33a; --tc-soft:#2a2114; --tc-line:#4a3a1c;
  --red:#f97066; --red-soft:#2c1614; --red-line:#5a2a26;
  --sh1:0 1px 2px rgba(0,0,0,.4);
  --sh2:0 2px 4px rgba(0,0,0,.3), 0 8px 20px -6px rgba(0,0,0,.5);
  --sh3:0 18px 48px -12px rgba(0,0,0,.7);
  --av-s:32%; --av-l:21%; --avf-s:62%; --avf-l:72%;
}}
:root[data-theme="dark"]{
  --bg:#0b0e14; --panel:#151a23; --panel2:#1a202b;
  --line:#252c38; --line2:#1f2530;
  --text:#e9edf4; --text2:#b9c2d0; --muted:#7e8899;
  --accent:#6c92ff; --accent2:#8aabff; --accent-soft:#1a2340; --accent-line:#2e3b63;
  --ok:#42cd8b; --ok-soft:#122a1f; --ok-line:#1e4534;
  --pw:#b18aff; --pw-soft:#211a35; --pw-line:#392d5c;
  --tc:#e0a33a; --tc-soft:#2a2114; --tc-line:#4a3a1c;
  --red:#f97066; --red-soft:#2c1614; --red-line:#5a2a26;
  --sh1:0 1px 2px rgba(0,0,0,.4);
  --sh2:0 2px 4px rgba(0,0,0,.3), 0 8px 20px -6px rgba(0,0,0,.5);
  --sh3:0 18px 48px -12px rgba(0,0,0,.7);
  --av-s:32%; --av-l:21%; --avf-s:62%; --avf-l:72%;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;color:var(--text);background:var(--bg);
  font:15px/1.5 "Segoe UI Variable Text","Segoe UI",-apple-system,BlinkMacSystemFont,Roboto,Arial,sans-serif;
  -webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(900px 520px at 10% -10%, color-mix(in srgb,var(--accent) 13%, transparent), transparent 70%),
    radial-gradient(760px 460px at 94% 2%, color-mix(in srgb,var(--pw) 10%, transparent), transparent 70%)}
[hidden]{display:none!important}
.mono,.mono input{font-family:"Cascadia Mono",ui-monospace,SFMono-Regular,Consolas,monospace;
  font-variant-ligatures:none}
.tnum{font-variant-numeric:tabular-nums}
.spacer{flex:1 1 auto}
.i{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.9;
  stroke-linecap:round;stroke-linejoin:round;flex:none}
.i14{width:14px;height:14px} .i18{width:18px;height:18px}
.wrap{max-width:1280px;margin:0 auto;padding:0 20px 90px}

/* ============ экран входа ============ */
.gate{min-height:100vh;display:grid;place-items:center;padding:24px}
.gatecard{width:100%;max-width:400px;background:var(--panel);border:1px solid var(--line);
  border-radius:18px;box-shadow:var(--sh3);padding:30px 28px 26px;text-align:center}
.glogo{width:54px;height:54px;margin:0 auto 16px;border-radius:16px;display:grid;place-items:center;
  background:linear-gradient(145deg,var(--accent2),var(--accent));color:#fff;font-weight:700;font-size:17px;
  box-shadow:0 8px 20px -6px color-mix(in srgb,var(--accent) 60%,transparent), inset 0 1px 0 rgba(255,255,255,.3)}
.gatecard h1{margin:0;font-size:20px;font-weight:640;letter-spacing:-.02em}
.gatecard p{margin:5px 0 22px;font-size:13.5px;color:var(--muted)}
.gatecard form{text-align:left;display:grid;gap:13px}
.gbtn{margin-top:4px;height:44px;border:0;border-radius:11px;cursor:pointer;
  background:linear-gradient(145deg,var(--accent2),var(--accent));color:#fff;
  font:inherit;font-size:15px;font-weight:600;letter-spacing:-.01em;
  box-shadow:0 6px 16px -6px color-mix(in srgb,var(--accent) 65%,transparent);transition:.15s}
.gbtn:hover{filter:brightness(1.06)} .gbtn:active{transform:translateY(1px)}
.gbtn:disabled{opacity:.6;cursor:progress}
.ghint{margin-top:18px;padding:11px 13px;border-radius:10px;background:var(--accent-soft);
  border:1px solid var(--accent-line);font-size:12.5px;line-height:1.55;color:var(--text2);
  text-align:left;display:flex;gap:9px}
.ghint svg{flex:none;margin-top:2px;color:var(--accent)}
.gerr{padding:10px 13px;border-radius:10px;background:var(--red-soft);border:1px solid var(--red-line);
  color:var(--red);font-size:13px;line-height:1.45}

/* поля ввода */
.fld{display:grid;gap:6px}
.fld>span{font-size:12.5px;font-weight:560;color:var(--text2);display:flex;gap:6px;align-items:baseline}
.fld>span i{font-style:normal;font-size:11px;color:var(--muted);font-weight:400}
.fld input,.fld textarea,textarea{width:100%;height:42px;padding:0 13px;border-radius:10px;
  border:1px solid var(--line);background:var(--panel2);color:var(--text);font:inherit;outline:none;transition:.14s}
textarea{height:auto;padding:11px 13px;line-height:1.5;resize:vertical}
.fld input::placeholder,textarea::placeholder{color:var(--muted);opacity:.8}
.fld input:focus,textarea:focus{border-color:var(--accent);background:var(--panel);
  box-shadow:0 0 0 3.5px var(--accent-soft)}
.pwwrap{position:relative;display:block}
.pwwrap input{padding-right:42px}
.pweye{position:absolute;right:5px;top:5px;width:32px;height:32px;display:grid;place-items:center;
  border:0;background:transparent;color:var(--muted);border-radius:8px;cursor:pointer;transition:.14s}
.pweye:hover{background:var(--accent-soft);color:var(--accent)}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.frow3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:13px}
.chk{display:flex;gap:9px;align-items:flex-start;font-size:13px;color:var(--text2);cursor:pointer;line-height:1.45}
.chk input{width:17px;height:17px;margin:1px 0 0;accent-color:var(--accent);flex:none;cursor:pointer}

/* ============ шапка ============ */
.brandbar{display:flex;align-items:center;gap:14px;padding:26px 0 18px;flex-wrap:wrap}
.logo{width:46px;height:46px;flex:none;border-radius:14px;display:grid;place-items:center;
  background:linear-gradient(145deg,var(--accent2),var(--accent));color:#fff;font-weight:700;font-size:15px;
  box-shadow:0 6px 16px -4px color-mix(in srgb,var(--accent) 55%,transparent), inset 0 1px 0 rgba(255,255,255,.28)}
.btitle h1{margin:0;font-size:22px;font-weight:640;letter-spacing:-.022em;line-height:1.2}
.btitle p{margin:3px 0 0;font-size:13.5px;color:var(--muted)}
.btitle p b{color:var(--text2);font-weight:550}
.hdr-right{display:flex;align-items:center;gap:12px;margin-left:auto}

.ringbox{position:relative;width:58px;height:58px;flex:none}
.ringbox svg{width:58px;height:58px;transform:rotate(-90deg)}
.ringbox circle{fill:none;stroke-width:5;stroke-linecap:round}
.ring-bg{stroke:var(--line)}
.ring-fg{stroke:var(--ok);stroke-dasharray:150.8;stroke-dashoffset:150.8;
  transition:stroke-dashoffset .55s cubic-bezier(.3,1,.4,1)}
.ringtxt{position:absolute;inset:0;display:grid;place-items:center;font-size:13px;font-weight:650;letter-spacing:-.02em}
.ringlbl{font-size:12.5px;color:var(--muted);line-height:1.35}
.ringlbl b{display:block;font-size:15px;color:var(--text);font-weight:600}

.iconbtn{width:38px;height:38px;flex:none;display:grid;place-items:center;border-radius:11px;
  border:1px solid var(--line);background:var(--panel);color:var(--muted);cursor:pointer;
  box-shadow:var(--sh1);transition:.15s}
.iconbtn:hover{color:var(--accent);border-color:var(--accent-line);transform:translateY(-1px)}

/* профиль */
.me{position:relative}
.mebtn{display:flex;align-items:center;gap:9px;padding:5px 11px 5px 5px;height:38px;
  border:1px solid var(--line);background:var(--panel);border-radius:11px;cursor:pointer;
  box-shadow:var(--sh1);transition:.15s;font:inherit;color:var(--text)}
.mebtn:hover{border-color:var(--accent-line)}
.meav{width:27px;height:27px;flex:none;border-radius:50%;display:grid;place-items:center;font-size:11.5px;
  font-weight:650;background:linear-gradient(145deg,var(--accent2),var(--accent));color:#fff}
.meinfo{display:flex;flex-direction:column;align-items:flex-start;line-height:1.15}
.meinfo b{font-size:13px;font-weight:580;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.meinfo i{font-style:normal;font-size:11px;color:var(--muted)}
.menu{position:absolute;right:0;top:44px;z-index:60;min-width:236px;padding:6px;
  background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:var(--sh3)}
.menu button{display:flex;align-items:center;gap:10px;width:100%;padding:9px 10px;border:0;border-radius:8px;
  background:transparent;color:var(--text2);font:inherit;font-size:13.5px;text-align:left;cursor:pointer}
.menu button:hover{background:var(--accent-soft);color:var(--accent)}
.menu button svg{color:var(--muted)} .menu button:hover svg{color:var(--accent)}
.menu hr{border:0;border-top:1px solid var(--line);margin:5px 2px}

/* ============ панель инструментов ============ */
.toolbar{position:sticky;top:0;z-index:30;margin:0 -20px 16px;padding:12px 20px;
  background:color-mix(in srgb,var(--bg) 82%, transparent);
  backdrop-filter:saturate(1.6) blur(14px);-webkit-backdrop-filter:saturate(1.6) blur(14px);
  border-bottom:1px solid transparent;transition:border-color .2s,box-shadow .2s}
.toolbar.stuck{border-bottom-color:var(--line);box-shadow:0 6px 18px -14px rgba(15,22,33,.5)}
.tools{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.tsep{width:1px;height:26px;background:var(--line);flex:none}

.search{position:relative;flex:1 1 240px;min-width:200px}
.search input{width:100%;height:42px;padding:0 40px;border-radius:11px;border:1px solid var(--line);
  background:var(--panel);color:var(--text);font:inherit;outline:none;box-shadow:var(--sh1);transition:.15s}
.search input::placeholder{color:var(--muted)}
.search input:focus{border-color:var(--accent);box-shadow:0 0 0 3.5px var(--accent-soft)}
.search .si{position:absolute;left:13px;top:13px;color:var(--muted);pointer-events:none}
.search .sk{position:absolute;right:11px;top:11px;font-size:11.5px;color:var(--muted);
  border:1px solid var(--line);border-bottom-width:2px;border-radius:6px;padding:1px 6px;
  background:var(--panel2);pointer-events:none}
.search input:not(:placeholder-shown)~.sk{display:none}

.seg{display:flex;gap:2px;padding:3px;background:var(--panel);border:1px solid var(--line);
  border-radius:11px;box-shadow:var(--sh1)}
.seg button{border:0;background:transparent;color:var(--muted);font:inherit;font-size:13.5px;font-weight:520;
  padding:7px 13px;border-radius:8px;cursor:pointer;transition:.14s;white-space:nowrap}
.seg button:hover{color:var(--text)}
.seg button.on{background:var(--accent-soft);color:var(--accent);font-weight:600}
.seg .n{font-size:11.5px;opacity:.75;margin-left:5px;font-variant-numeric:tabular-nums}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;height:42px;padding:0 14px;
  border-radius:11px;border:1px solid var(--line);background:var(--panel);color:var(--text2);
  font:inherit;font-size:13.5px;font-weight:520;cursor:pointer;box-shadow:var(--sh1);transition:.15s;white-space:nowrap}
.btn:hover{color:var(--accent);border-color:var(--accent-line)}
.btn:active{transform:translateY(1px)}
.btn:disabled{opacity:.55;cursor:default}
.btn.on{background:var(--accent-soft);border-color:var(--accent-line);color:var(--accent)}
.btn.primary{background:linear-gradient(145deg,var(--accent2),var(--accent));border-color:transparent;color:#fff;
  box-shadow:0 5px 14px -6px color-mix(in srgb,var(--accent) 65%,transparent)}
.btn.primary:hover{filter:brightness(1.06);color:#fff}
.btn.danger{background:var(--red-soft);border-color:var(--red-line);color:var(--red)}
.btn.danger:hover{background:var(--red);color:#fff;border-color:var(--red)}

/* ============ список ============ */
.list{background:var(--panel);border:1px solid var(--line);border-radius:16px;box-shadow:var(--sh2);overflow:hidden}
/* последняя колонка фиксирована: три кнопки (глазок + отметка + правка) = 33*3 + 6*2 */
.grid{display:grid;grid-template-columns:36px minmax(0,1.05fr) minmax(0,2.55fr) 111px;
  gap:12px;align-items:center;padding:0 14px}
.chips{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr) minmax(0,.95fr);gap:8px;align-items:center}

.head{padding:10px 14px;background:var(--panel2);border-bottom:1px solid var(--line)}
.head span{font-size:11px;font-weight:650;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.head .chips span{padding-left:2px}
.head .r{text-align:right}

.row{position:relative;padding-top:8px;padding-bottom:8px;border-bottom:1px solid var(--line2);transition:background .14s}
.row:last-child{border-bottom:0}
.row::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--accent);
  opacity:0;transition:opacity .15s}
.row:hover{background:color-mix(in srgb,var(--accent-soft) 45%, transparent)}
.row.cur{background:var(--accent-soft)} .row.cur::before{opacity:1}
.row.done{background:color-mix(in srgb,var(--ok-soft) 55%, transparent)}
.row.done .fio{opacity:.55}
.row.done.cur{background:var(--ok-soft)} .row.done.cur::before{background:var(--ok);opacity:1}

.av{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;user-select:none;
  font-size:12.5px;font-weight:650;background:hsl(var(--h,220) var(--av-s) var(--av-l));
  color:hsl(var(--h,220) var(--avf-s) var(--avf-l));
  box-shadow:inset 0 0 0 1px color-mix(in srgb,currentColor 14%,transparent)}
.row.done .av{box-shadow:inset 0 0 0 1.5px var(--ok)}

.who{min-width:0}
.fio{font-size:14.5px;font-weight:550;letter-spacing:-.008em;line-height:1.3;cursor:pointer;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-radius:4px}
.fio:hover{color:var(--accent)}
.sub{display:flex;align-items:center;gap:7px;margin-top:1px;min-width:0}
.no{font-size:11.5px;color:var(--muted);opacity:.7;font-variant-numeric:tabular-nums;flex:none}
.iin{font-family:"Cascadia Mono",ui-monospace,Consolas,monospace;font-size:11.8px;color:var(--muted);
  cursor:pointer;border-radius:4px;transition:.12s}
.iin:hover{color:var(--accent)}
.nt{font-size:11.5px;color:var(--muted);opacity:.75;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* кнопки-чипы копирования */
.chip{display:flex;align-items:center;gap:8px;min-width:0;height:36px;padding:0 9px 0 10px;
  border-radius:9px;border:1px solid;cursor:pointer;font:inherit;transition:.14s;text-align:left}
.chip .v{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  font-family:"Cascadia Mono",ui-monospace,Consolas,monospace;font-size:12.6px;font-weight:500}
.chip .v.dots{letter-spacing:2.5px;opacity:.6}
.chip .v.none{font-family:inherit;font-size:12.5px;opacity:.5;font-style:italic;letter-spacing:0}
.chip .cpi{opacity:.4;transition:.14s} .chip:hover .cpi{opacity:.95}
.chip:hover{transform:translateY(-1px);box-shadow:var(--sh1);filter:brightness(.98)}
.chip:active{transform:translateY(0)}
.chip.login{background:var(--accent-soft);border-color:var(--accent-line);color:var(--accent)}
.chip.mail{background:var(--pw-soft);border-color:var(--pw-line);color:var(--pw)}
.chip.tc{background:var(--tc-soft);border-color:var(--tc-line);color:var(--tc)}
.chip.flash{background:var(--ok)!important;border-color:var(--ok)!important;color:#fff!important;
  animation:pop .34s cubic-bezier(.34,1.56,.64,1)}
.chip.flash .cpi{opacity:1}
@keyframes pop{0%{transform:scale(1)}40%{transform:scale(1.035)}100%{transform:scale(1)}}

.acts{display:flex;gap:6px;justify-content:flex-end;align-items:center}
.mark{width:33px;height:33px;flex:none;display:grid;place-items:center;border-radius:9px;
  border:1px solid var(--line);background:var(--panel2);color:var(--muted);cursor:pointer;transition:.15s}
.mark:hover{border-color:var(--ok-line);color:var(--ok);background:var(--ok-soft)}
.mark.on{background:var(--ok);border-color:var(--ok);color:#fff}
.edit{width:33px;height:33px;flex:none;display:grid;place-items:center;border-radius:9px;
  border:1px solid transparent;background:transparent;color:var(--muted);cursor:pointer;transition:.15s}
.edit:hover{background:var(--accent-soft);color:var(--accent);border-color:var(--accent-line)}

.empty{padding:52px 20px;text-align:center;color:var(--muted)}
.empty .eico{width:46px;height:46px;margin:0 auto 12px;border-radius:14px;display:grid;place-items:center;
  background:var(--panel2);border:1px solid var(--line)}
.empty b{display:block;color:var(--text);font-weight:600;font-size:15px;margin-bottom:3px}

/* ============ подсказки / примечание ============ */
.hints{margin-top:16px;display:flex;gap:9px;flex-wrap:wrap;font-size:12.5px;color:var(--muted)}
.hints .hk{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:8px;
  background:var(--panel);border:1px solid var(--line)}
kbd{font-family:inherit;font-size:11.5px;font-weight:600;color:var(--text2);background:var(--panel2);
  border:1px solid var(--line);border-bottom-width:2px;border-radius:5px;padding:1px 5px;
  min-width:18px;text-align:center;display:inline-block}
.note{margin-top:14px;font-size:12.5px;color:var(--muted);display:flex;gap:9px;align-items:flex-start;
  padding:11px 14px;border-radius:10px;background:var(--tc-soft);
  border:1px solid color-mix(in srgb,var(--tc) 24%, transparent);line-height:1.55}
.note svg{flex:none;margin-top:2px;color:var(--tc)}
.note code{font-family:"Cascadia Mono",ui-monospace,Consolas,monospace;font-size:11.8px;
  background:var(--panel);padding:1px 5px;border-radius:5px;border:1px solid var(--line)}

/* ============ страницы-карточки ============ */
.mtext{margin:0;font-size:13.5px;color:var(--text2);line-height:1.5}
.colmap{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.colmap span{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--accent);
  background:var(--accent-soft);border:1px solid var(--accent-line);border-radius:7px;padding:6px 4px;text-align:center}
.ipreview{font-size:13px;color:var(--muted);padding:11px 13px;border-radius:10px;background:var(--panel2);
  border:1px dashed var(--line);line-height:1.5}
.ipreview.ok{color:var(--ok);border-color:var(--ok-line);background:var(--ok-soft)}
.ulist{display:grid;gap:8px}
.urow{display:flex;align-items:center;gap:11px;padding:10px 12px;border:1px solid var(--line);
  border-radius:11px;background:var(--panel2)}
.uav{width:32px;height:32px;flex:none;border-radius:50%;display:grid;place-items:center;font-size:12px;
  font-weight:650;background:hsl(var(--h,220) var(--av-s) var(--av-l));color:hsl(var(--h,220) var(--avf-s) var(--avf-l))}
.uinfo{min-width:0;flex:1}
.uinfo b{display:block;font-size:14px;font-weight:570;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.uinfo span{font-size:12px;color:var(--muted);font-family:"Cascadia Mono",ui-monospace,Consolas,monospace}
.badge{font-size:11px;font-weight:620;text-transform:uppercase;letter-spacing:.04em;padding:4px 9px;
  border-radius:99px;flex:none}
.badge.admin{background:var(--accent-soft);color:var(--accent);border:1px solid var(--accent-line)}
.badge.viewer{background:var(--panel);color:var(--muted);border:1px solid var(--line)}
.badge.you{background:var(--ok-soft);color:var(--ok);border:1px solid var(--ok-line)}
.udivider{font-size:11px;font-weight:650;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);
  display:flex;align-items:center;gap:11px;margin-top:4px}
.udivider::after{content:"";flex:1;height:1px;background:var(--line)}
.uacts{display:flex;gap:5px;flex:none}
.ubtn{width:31px;height:31px;display:grid;place-items:center;border-radius:8px;border:1px solid var(--line);
  background:var(--panel);color:var(--muted);cursor:pointer;transition:.14s}
.ubtn:hover{color:var(--accent);border-color:var(--accent-line)}
.ubtn.del:hover{color:var(--red);border-color:var(--red-line);background:var(--red-soft)}

/* ============ тост ============ */
.toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,16px) scale(.97);opacity:0;
  display:flex;align-items:center;gap:10px;max-width:min(620px,88vw);padding:11px 16px;border-radius:12px;
  z-index:200;pointer-events:none;background:color-mix(in srgb,#0a0d13 93%, transparent);color:#fff;
  box-shadow:var(--sh3), inset 0 1px 0 rgba(255,255,255,.09);
  transition:opacity .18s, transform .22s cubic-bezier(.34,1.4,.64,1)}
.toast.show{opacity:1;transform:translate(-50%,0) scale(1)}
.toast .tico{width:22px;height:22px;flex:none;border-radius:50%;display:grid;place-items:center;background:var(--ok);color:#fff}
.toast .tl{font-size:13.5px;opacity:.72;white-space:nowrap}
.toast .tv{font-family:"Cascadia Mono",ui-monospace,Consolas,monospace;font-size:13.5px;font-weight:600;
  color:#8ee5b4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.toast.err .tico{background:#f97066} .toast.err .tv{color:#ffc9c4}
.toast.err .tl{opacity:.9}

/* ============ адаптив ============ */
@media (max-width:1080px){
  .chips{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr)}
  .chip{padding:0 8px;gap:6px} .chip .cpi{display:none}
  .ringlbl{display:none}
}
@media (max-width:900px){
  /* карточный вид: ФИО и кнопки действий сверху, чипы копирования — во вторую строку.
     Области заданы явно, иначе .chips на всю ширину ломает авторазмещение .acts */
  .grid{grid-template-columns:36px minmax(0,1fr) 111px;gap:10px}
  .head .chips{display:none}
  .row{padding-top:10px;padding-bottom:10px;
    grid-template-areas:"av who acts" "chips chips chips"}
  .row .av{grid-area:av} .row .who{grid-area:who} .row .acts{grid-area:acts}
  .row .chips{grid-area:chips;grid-template-columns:1fr 1fr;margin-top:2px}
  .row .chip.login{grid-column:1/-1}
  .frow,.frow3{grid-template-columns:1fr}
  .colmap{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:620px){
  .wrap{padding:0 12px 80px}
  .grid{padding:0 12px}
  .row .chips{grid-template-columns:1fr}
  .brandbar{padding:18px 0 14px;gap:11px}
  .btitle h1{font-size:19px} .btitle p{font-size:12.5px}
  .logo{width:40px;height:40px;border-radius:12px;font-size:14px}
  .meinfo{display:none} .mebtn{padding:5px}
  .btn span{display:none} .btn{padding:0 12px}
  .btn.primary span,.seg button{display:inline}
  .search{flex:1 1 100%}
  .hints{display:none}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ============ добавлено для серверных страниц Django ============ */

/* ссылки, оформленные как кнопки */
a.btn,a.logo,.menu a{text-decoration:none}
a.logo{color:#fff}

/* меню профиля: внутри и ссылки, и форма выхода */
.menu a,.menu button{display:flex;align-items:center;gap:10px;width:100%;padding:9px 10px;
  border:0;border-radius:8px;background:transparent;color:var(--text2);font:inherit;font-size:13.5px;
  text-align:left;cursor:pointer}
.menu a:hover,.menu button:hover{background:var(--accent-soft);color:var(--accent)}
.menu a svg,.menu button svg{color:var(--muted)}
.menu a:hover svg,.menu button:hover svg{color:var(--accent)}
.menu form{margin:0}

/* системные сообщения Django */
.msgs{display:grid;gap:8px;margin-bottom:16px}
.msg{display:flex;gap:10px;align-items:flex-start;padding:11px 14px;border-radius:11px;
  font-size:13.5px;line-height:1.5;background:var(--ok-soft);border:1px solid var(--ok-line);color:var(--text)}
.msg svg{flex:none;margin-top:2px;color:var(--ok)}
.msg.error{background:var(--red-soft);border-color:var(--red-line)}
.msg.error svg{color:var(--red)}
.msg.warning{background:var(--tc-soft);border-color:var(--tc-line)}
.msg.warning svg{color:var(--tc)}

/* карточка страницы (форма эксперта, импорт, пользователи) */
.card{background:var(--panel);border:1px solid var(--line);border-radius:16px;
  box-shadow:var(--sh2);overflow:hidden}
.card.narrow{max-width:480px}
.cardform{padding:20px;display:grid;gap:16px}
.cardfoot{display:flex;gap:10px;align-items:center;flex-wrap:wrap;
  margin:4px -20px -20px;padding:16px 20px;border-top:1px solid var(--line);background:var(--panel2)}
.cardform form{display:contents}
.ferr{font-size:12.5px;color:var(--red);line-height:1.4}
.fld input.mono,.fld textarea.mono{font-family:"Cascadia Mono",ui-monospace,Consolas,monospace}

/* подтверждение удаления */
.delbox{display:flex;align-items:center;gap:14px;padding:14px;border-radius:12px;
  background:var(--red-soft);border:1px solid var(--red-line)}
.delbox b{display:block;font-size:15.5px;font-weight:600}
.delbox span{font-size:13px;color:var(--muted);
  font-family:"Cascadia Mono",ui-monospace,Consolas,monospace}

/* чип без значения — не кнопка, а заглушка */
.chip.empty{cursor:default;opacity:.65;background:var(--panel2);border-color:var(--line);color:var(--muted)}
.chip.empty:hover{transform:none;box-shadow:none;filter:none}

/* строки в таблице пользователей: формы не должны ломать раскладку */
.uacts form{display:contents}

/* прячем строку, не подходящую под поиск или фильтр */
.row.hide{display:none}