:root{--bg:#f6f7f9;--panel:#fff;--ink:#14161a;--muted:#757a84;--line:#e8e9ed;--dark:#15171c;--lime:#d9f65d;--blue:#dfe8ff;--orange:#ffdfc2;--green:#d8f1dd;--purple:#e9ddff;--shadow:0 14px 40px rgba(24,28,38,.06)}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.45 Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}button,input,select,textarea{font:inherit}button{cursor:pointer;border:0}.app{display:flex;min-height:100vh}.sidebar{width:256px;background:var(--dark);color:#fff;padding:24px 16px;position:fixed;inset:0 auto 0 0;display:flex;flex-direction:column;z-index:2}.brand{display:flex;gap:11px;align-items:center;padding:4px 10px 28px}.brandmark{width:34px;height:34px;background:var(--lime);color:#131519;display:grid;place-items:center;border-radius:10px;font-weight:900;font-size:18px}.brand b{font-size:15px;letter-spacing:.08em}.brand small{display:block;color:#969aa4;font-size:10px;margin-top:1px}.workspace{background:#23262d;border:1px solid #383c45;border-radius:11px;padding:10px 12px;margin:0 8px 20px;color:#fff;display:flex;justify-content:space-between;align-items:center}.workspace span{color:#969aa4;font-size:11px;display:block}.workspace strong{font-size:12px}.nav-label{color:#7e838d;text-transform:uppercase;letter-spacing:.09em;font-size:10px;padding:0 12px 8px}.nav{display:grid;gap:3px}.nav button{color:#bfc3cc;text-align:left;background:transparent;padding:10px 12px;border-radius:9px;display:flex;gap:11px;align-items:center}.nav button:hover,.nav button.active{background:#292d35;color:#fff}.nav button.active{box-shadow:inset 3px 0 0 var(--lime)}.nav i{font-style:normal;width:18px;text-align:center;color:#9ca2ae}.nav button.active i{color:var(--lime)}.bottom{margin-top:auto;border-top:1px solid #30343b;padding:14px 8px 0;color:#9ca2ae}.user{display:flex;gap:10px;align-items:center}.avatar{width:32px;height:32px;border-radius:50%;background:#ffb88a;color:#212329;display:grid;place-items:center;font-weight:800}.main{margin-left:256px;flex:1;padding:24px 34px 48px;max-width:1500px}.topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px}.crumb{color:var(--muted);font-size:13px}.crumb b{color:var(--ink)}.top-actions{display:flex;gap:10px;align-items:center}.search{background:#fff;border:1px solid var(--line);border-radius:9px;padding:9px 12px;color:var(--muted);min-width:210px}.iconbtn{width:37px;height:37px;border-radius:10px;background:#fff;border:1px solid var(--line)}.primary{background:var(--dark);color:#fff;padding:10px 15px;border-radius:9px;font-weight:700}.primary:hover{background:#30343c}.lime{background:var(--lime);color:var(--dark)}h1{font-size:34px;line-height:1.05;margin:0 0 8px;letter-spacing:-.04em}h2{font-size:19px;margin:0 0 16px;letter-spacing:-.02em}h3{font-size:15px;margin:0 0 7px}.muted{color:var(--muted)}.eyebrow{text-transform:uppercase;letter-spacing:.11em;font-size:10px;color:var(--muted);font-weight:700}.grid{display:grid;gap:16px}.metrics{grid-template-columns:repeat(4,1fr);margin:26px 0}.card{background:var(--panel);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:18px}.metric .value{font-size:28px;font-weight:800;letter-spacing:-.04em;margin:8px 0 3px}.trend{font-size:12px;color:#38834b}.layout-2{grid-template-columns:1.35fr .9fr}.layout-3{grid-template-columns:repeat(3,1fr)}.section-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.link{background:none;color:#59616e;padding:0}.link:hover{color:#111}.insight{background:#f0f5d7;border-color:#d7e4a4;min-height:190px}.insight .spark{font-size:32px;margin:8px 0;color:#7b951a}.list{display:grid;gap:10px}.list-row{display:flex;gap:11px;align-items:flex-start;padding:11px 0;border-bottom:1px solid var(--line)}.list-row:last-child{border:0}.dot{width:8px;height:8px;border-radius:50%;background:#b4bac5;margin-top:7px;flex:none}.dot.l{background:#9ebd1d}.dot.o{background:#ed984a}.date{font-size:11px;color:var(--muted);white-space:nowrap}.tag{display:inline-flex;padding:4px 8px;border-radius:999px;font-size:11px;background:#eef0f3;color:#515762;margin:3px 3px 0 0}.tag.green{background:var(--green);color:#286b36}.tag.blue{background:var(--blue);color:#455d9e}.tag.orange{background:var(--orange);color:#9b5e26}.tag.purple{background:var(--purple);color:#6945a3}.page{display:none}.page.active{display:block}.subnav{display:flex;gap:8px;border-bottom:1px solid var(--line);margin:0 0 20px;overflow:auto}.subnav button{background:transparent;padding:10px 12px;color:var(--muted);white-space:nowrap;border-bottom:2px solid transparent}.subnav button.active{color:var(--ink);border-color:var(--dark);font-weight:700}.toolbar{display:flex;gap:10px;justify-content:space-between;align-items:center;margin-bottom:18px}.input{background:#fff;border:1px solid var(--line);border-radius:9px;padding:10px 12px;color:var(--ink);outline:none}.input:focus{border-color:#9ba3ad}.filters{display:flex;gap:8px}.knowledge-grid{grid-template-columns:repeat(3,1fr)}.knowledge-card{min-height:150px}.kicon{font-size:25px;margin-bottom:13px}.knowledge-card p{color:var(--muted);margin:0 0 12px}.ai-wrap{display:grid;grid-template-columns:1.45fr .75fr;gap:16px;align-items:start}.chat{min-height:550px;display:flex;flex-direction:column}.messages{flex:1;padding:6px 0 20px;display:grid;gap:18px}.msg{display:flex;gap:10px;max-width:88%}.msg.you{margin-left:auto;flex-direction:row-reverse}.msg-bubble{background:#f1f2f4;border-radius:4px 14px 14px 14px;padding:13px 15px}.msg.you .msg-bubble{background:var(--dark);color:#fff;border-radius:14px 4px 14px 14px}.msg small{display:block;color:var(--muted);font-size:10px;margin-bottom:3px}.msg.you small{text-align:right}.ai-form{display:flex;gap:8px;border-top:1px solid var(--line);padding-top:15px}.ai-form textarea{resize:none;flex:1;border:1px solid var(--line);border-radius:10px;padding:12px;height:48px;outline:none}.quick{display:flex;flex-wrap:wrap;gap:7px;margin:12px 0}.quick button{background:#f1f2f4;border:1px solid var(--line);padding:7px 9px;border-radius:8px;font-size:12px;color:#4f5661}.sources{display:grid;gap:10px}.source{padding:11px;border:1px solid var(--line);border-radius:10px}.source b{font-size:12px}.source small{display:block;color:var(--muted);margin-top:3px}.calendar{display:grid;grid-template-columns:repeat(7,1fr);gap:8px}.day{min-height:112px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px}.day.mutedday{background:#fafafa;color:#bbb}.daynum{font-weight:800;margin-bottom:8px}.event{font-size:11px;padding:7px;border-radius:7px;margin-top:5px;background:var(--blue);color:#3c558f}.event.green{background:var(--green);color:#34723e}.event.orange{background:var(--orange);color:#8b582b}.event.purple{background:var(--purple);color:#6945a3}.table{width:100%;border-collapse:collapse}.table th,.table td{text-align:left;padding:12px 9px;border-bottom:1px solid var(--line);font-size:13px}.table th{color:var(--muted);font-size:11px;font-weight:600}.progress{height:7px;background:#eef0f2;border-radius:10px;overflow:hidden}.progress i{display:block;height:100%;background:var(--dark);border-radius:10px}.empty{padding:30px;text-align:center;color:var(--muted)}.toast{position:fixed;right:26px;bottom:25px;background:var(--dark);color:#fff;padding:13px 16px;border-radius:10px;box-shadow:var(--shadow);display:none;z-index:5}.toast.show{display:block;animation:fade 3s both}@keyframes fade{0%{opacity:0;transform:translateY(8px)}10%,80%{opacity:1;transform:none}100%{opacity:0}}
@media(max-width:1050px){.sidebar{width:220px}.main{margin-left:220px;padding:22px}.metrics{grid-template-columns:repeat(2,1fr)}.layout-2,.ai-wrap{grid-template-columns:1fr}.knowledge-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:720px){.sidebar{width:66px;padding:14px 8px}.brand{padding:4px 8px 22px}.brand>div:not(.brandmark),.workspace,.nav-label,.nav button span,.bottom .user>div{display:none}.brandmark{margin:auto}.nav button{justify-content:center;padding:11px}.main{margin-left:66px;padding:18px 14px}.topbar{align-items:flex-start}.top-actions .search{display:none}h1{font-size:29px}.metrics,.knowledge-grid,.layout-3{grid-template-columns:1fr}.calendar{grid-template-columns:repeat(2,1fr)}.day{min-height:100px}}

:root{--accent:#6550ea}html[data-theme=dark]{color-scheme:dark;--bg:#11131a;--panel:#1c202b;--ink:#eef0fa;--muted:#a6afc3;--line:#323849;--blue:#293754;--green:#224438;--orange:#503b2b;--purple:#3a2d54;--shadow:0 12px 40px #0002}
button:focus-visible,a:focus-visible{outline:3px solid #9278ff;outline-offset:3px}button{border:1px solid var(--line)}.search,.input,.iconbtn,.day{background:var(--panel);color:var(--ink)}.hero{background:linear-gradient(120deg,#27213c,#51437c);border-radius:20px;color:#fff;padding:30px;position:relative;overflow:hidden}.hero:after{content:'✳';position:absolute;right:35px;top:15px;color:#b7a6ff;font-size:120px;opacity:.4}.hero p{max-width:65%;color:#ded8ef}.hero .eyebrow{color:#c4b4ff}.hero button{position:relative;z-index:1}.card{line-height:1.6}.insight{background:var(--panel);border-color:var(--line)}.click{cursor:pointer;transition:transform .15s}.click:hover{transform:translateY(-3px);border-color:#9278ff}.tag{background:var(--purple);color:var(--ink)}.tag.green,.tag.blue,.tag.orange{color:var(--ink)}.head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:24px 0}.bodytext{white-space:pre-wrap;overflow-wrap:anywhere}.source{font-size:11px;overflow-wrap:anywhere;color:var(--muted)}a{color:#9278ff}.notice{background:var(--purple);padding:14px 18px;border-radius:10px;margin:18px 0}.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.tablewrap{overflow:auto}.calendar{grid-template-columns:repeat(7,minmax(0,1fr))}.event{width:100%;text-align:left}.main{width:calc(100% - 256px);max-width:none}.toolbar{flex-wrap:wrap}.toolbar input{flex:1}.filters{flex-wrap:wrap}.row{display:flex;justify-content:space-between;gap:14px;border-bottom:1px solid var(--line);padding:15px 0}.task{display:flex;gap:12px;align-items:center}.task input{width:18px;height:18px;accent-color:#9278ff}.task.done{text-decoration:line-through;color:var(--muted)}dialog{border:1px solid var(--line);background:var(--panel);color:var(--ink);border-radius:18px;padding:26px;width:min(750px,94vw);max-height:90vh;box-shadow:0 20px 100px #0006}dialog::backdrop{background:#0008;backdrop-filter:blur(4px)}dialog .close{float:right}dialog label{display:block;font-size:12px;color:var(--muted);margin:14px 0 5px}dialog input,dialog select,dialog textarea{width:100%;padding:11px;border:1px solid var(--line);border-radius:9px;background:var(--bg);color:var(--ink)}dialog textarea{min-height:180px;resize:vertical}.formgrid{display:grid;grid-template-columns:1fr 1fr;gap:0 15px}.result{display:block;text-align:left;width:100%;padding:14px;background:var(--bg);color:var(--ink);border-radius:10px;margin-top:8px}.result small{display:block;color:var(--muted)}.mobile{display:none}.workspace span:last-child{display:none}.sidebar{overflow:auto}.timeline .card{margin-bottom:16px;border-left:4px solid #9278ff}#alerts{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);z-index:100;background:var(--ink);color:var(--panel);padding:12px 18px;border-radius:10px}#alerts:empty{display:none}.topbar{position:sticky;top:0;z-index:10;background:var(--bg);padding:12px 0}.primary{background:#6550ea}.primary.lime{background:#d9f65d;color:#15171c}input,select,textarea{font:inherit}small{color:var(--muted)}
@media(max-width:1050px){.main{width:calc(100% - 220px)}.grid.three{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:720px){.sidebar{width:256px;transform:translateX(-100%);visibility:hidden}.main{width:100%;margin:0;padding:12px 16px}.sidebar .brand>div,.sidebar .nav button span,.workspace,.nav-label,.bottom .user>div{display:block}.sidebar .nav button{justify-content:flex-start}.mobile{display:block}body.menu .sidebar{visibility:visible;transform:none;box-shadow:0 0 0 100vmax #0008}.grid.three,.formgrid{grid-template-columns:1fr}.topbar{gap:8px;flex-wrap:wrap}.top-actions{flex-wrap:wrap}.hero:after{display:none}.hero p{max-width:100%}.calendar{gap:3px}.day{padding:4px;min-height:80px}.event{font-size:9px;padding:4px;overflow-wrap:anywhere}.metrics{grid-template-columns:1fr 1fr}.crumb{display:none}.search{min-width:0}.toolbar select{max-width:100%}}

.day{min-width:0}.calendar>small{min-width:0}.calendar .event{max-width:100%;white-space:normal}
@media(max-width:720px){.head{flex-wrap:wrap}.head>div{min-width:0}.head button{max-width:100%}}
button{background:var(--panel);color:var(--ink);border-radius:9px;padding:8px 13px}button:not([class]):hover{border-color:#9278ff}.nav button{border-color:transparent}.iconbtn{padding:0}.danger{background:transparent;color:#d64545;border-color:#e3a5a5}.danger:hover{background:#d645451a}.del{background:transparent;border-color:transparent;color:var(--muted);padding:4px 9px}.del:hover{color:#d64545;border-color:var(--line)}.formactions{display:flex;justify-content:space-between;gap:10px;margin-top:18px}
@media(max-width:720px){.sidebar{z-index:20}.sidebar .brand>.brandmark{display:grid;margin:0}.top-actions .search{display:inline-block}.kbd{display:none}}

/* --- общая база: вход, профиль и лента изменений --- */
.gate{min-height:100vh;display:grid;place-items:center;padding:24px}
.gatecard{width:min(420px,100%)}
.gatecard .brandmark{margin-bottom:14px}
.gatecard b{display:block;letter-spacing:.1em;font-size:13px;margin-bottom:6px}
.gatecard label{display:block;font-size:12px;color:var(--muted);margin:14px 0 5px}
.gatecard input{width:100%;padding:11px;border:1px solid var(--line);border-radius:9px;background:var(--bg);color:var(--ink)}
.gatecard input:focus{outline:none;border-color:#9278ff}
.gatecard button{width:100%;margin-top:18px;padding:12px}
.gateerror{color:#e06363;font-size:13px;margin:12px 0 0}
.gateerror:empty{display:none}
.bottom .user{margin-bottom:12px}
.bottom .avatar{flex:none}
.bottom b{color:#fff;font-size:12px}
.bottom button{width:100%;background:transparent;color:#bfc3cc;border-color:#3a3f49}
.bottom button:hover{background:#292d35;color:#fff}
.timeline .card:first-child{border-left-color:#9ebd1d}
[hidden]{display:none !important}
.notice.error{background:#f4dada;color:#7a2424}
html[data-theme=dark] .notice.error{background:#4a2626;color:#ffdada}
.notice ul{margin:8px 0 0;padding-left:20px}
button.tag{cursor:pointer;border:1px solid transparent}
button.tag:hover{border-color:#9278ff}
.ai-wrap .formactions{margin-top:16px}
.card label{display:block;font-size:12px;color:var(--muted);margin:12px 0 5px}
.card .formgrid select{width:100%}
.gaterow{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:14px}
.gaterow .task{margin:0;font-size:13px;color:var(--ink)}
.gaterow .task input{width:16px;height:16px;margin-right:8px;accent-color:#9278ff}
.link{background:none;border:0;color:#6550ea;padding:0;font-size:13px;cursor:pointer}
.link:hover{text-decoration:underline}
.gatehint{font-size:12px;margin:14px 0 0;text-align:center}

/* --- файлы в записях --- */
.filesblock{margin-top:22px;border-top:1px solid var(--line);padding-top:16px}
.filesblock h3{margin:0 0 10px}
.files{display:grid;gap:8px;margin-bottom:12px}
.filerow{display:flex;align-items:center;gap:12px;padding:8px;border:1px solid var(--line);border-radius:10px}
.filerow .thumb{width:46px;height:46px;border-radius:8px;object-fit:cover;flex:none;background:var(--bg)}
.filerow .thumb.kind{display:grid;place-items:center;font-size:11px;font-weight:700;color:var(--muted)}
.filemeta{flex:1;min-width:0;overflow-wrap:anywhere}
.filemeta b{font-size:13px}
.filerow button{flex:none}
#fileinput{max-width:100%}
#filestatus{display:block;margin-top:6px}

/* --- брендбук: фирменные шрифты для живых образцов --- */
@font-face{font-family:'Unbounded';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/unbounded-500-cyrillic.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Unbounded';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/unbounded-500-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+2000-206F,U+2122,U+2191,U+2193,U+2212,U+2215}
@font-face{font-family:'Unbounded';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/unbounded-700-cyrillic.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Unbounded';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/unbounded-700-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+2000-206F,U+2122,U+2191,U+2193,U+2212,U+2215}
@font-face{font-family:'Golos Text';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/golostext-400-cyrillic.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Golos Text';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/golostext-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+2000-206F,U+2122,U+2191,U+2193,U+2212,U+2215}
@font-face{font-family:'Golos Text';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/golostext-500-cyrillic.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Golos Text';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/golostext-500-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+2000-206F,U+2122,U+2191,U+2193,U+2212,U+2215}
@font-face{font-family:'Golos Text';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/golostext-600-cyrillic.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Golos Text';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/golostext-600-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+2000-206F,U+2122,U+2191,U+2193,U+2212,U+2215}

/* --- брендбук: блоки --- */
.brandcard{margin-bottom:16px}
.brandmeta{font-size:11px;margin:16px 0 0}
.brandtext p{margin:0 0 10px}
.brandtext ul{margin:0 0 10px;padding-left:20px}
.brandtext li{margin-bottom:4px}
.brandlogo{margin-bottom:16px}
.logoframes{display:grid;grid-template-columns:2fr 1fr 2fr;gap:12px}
.logoframe{background:#141414;border-radius:16px;padding:26px;display:grid;place-items:center;min-height:120px}
.logoframe.light{background:#fdfdfd}
.logoframe img{max-width:100%;max-height:64px}
.swatches{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px}
.swatch{display:block;text-align:left;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--panel);color:var(--ink)}
.swatch:hover{border-color:#9278ff}
.swatch .chip{display:block;height:48px;border-radius:8px;margin-bottom:10px;border:1px solid var(--line)}
.swatch b{font-size:13px;display:block}
.swatch code{font-size:12px;color:var(--muted)}
.swatch small{display:block;margin-top:4px;line-height:1.35}
.fontsample{padding:16px 0;border-bottom:1px solid var(--line)}
.fontsample:last-child{border-bottom:0;padding-bottom:0}
.sampletext{font-size:26px;line-height:1.25;margin-bottom:8px;overflow-wrap:anywhere}
@media(max-width:720px){.logoframes{grid-template-columns:1fr}.sampletext{font-size:20px}}

/* --- брендбук слайдами (16:9, фирменный стиль) --- */
.deckbar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.deckbtns{display:flex;gap:8px;flex-wrap:wrap}
.deck{display:grid}
.slide{display:none;aspect-ratio:16/9;container-type:size;background:#141414;color:#fdfdfd;border-radius:18px;
  padding:5cqw 6cqw;overflow:hidden;position:relative;font-family:'Golos Text',ui-sans-serif,sans-serif}
.slide.is-current{display:flex;flex-direction:column}
.slidehead{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.slidelabel{font-size:1.5cqw;letter-spacing:.18em;text-transform:uppercase;color:#f6bd3a;font-weight:600}
.slidemark{width:3.4cqw;opacity:.9}
.slidebody{flex:1;display:flex;flex-direction:column;justify-content:center;min-height:0}
.slidetitle{font-family:'Unbounded',ui-sans-serif,sans-serif;font-weight:700;font-size:4.6cqw;line-height:1.1;
  margin:0 0 2.5cqw;letter-spacing:-.01em;color:#fdfdfd}
.slidelead{font-size:2.3cqw;line-height:1.45;margin:0 0 1.6cqw;color:#fdfdfd;max-width:78%}
.slidelist{margin:0;padding:0;list-style:none;display:grid;gap:1.4cqw}
.slidelist li{font-size:2.1cqw;line-height:1.35;padding-left:3cqw;position:relative;color:#e8e8e8}
.slidelist li:before{content:'';position:absolute;left:0;top:.55em;width:1.6cqw;height:.22cqw;background:#f6bd3a}
.slidefoot{display:flex;justify-content:space-between;font-size:1.4cqw;color:#5c5c5c;letter-spacing:.06em}
.slidecover{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:1.6cqw}
.coverlogo{width:26cqw;margin-bottom:2cqw}
.coverlogo.mark{width:9cqw}
.covertitle{font-family:'Unbounded',ui-sans-serif,sans-serif;font-weight:700;font-size:7.5cqw;margin:0;
  color:#f6bd3a;letter-spacing:-.02em}
.coversub{font-size:2.1cqw;color:#9a9a9a;margin:0}
.slidelogos{flex-direction:row;gap:2cqw;align-items:stretch}
.sframe{flex:1;background:#1b1b1b;border:1px solid rgba(253,253,253,.1);border-radius:2cqw;display:grid;place-items:center;padding:3cqw}
.sframe.light{background:#fdfdfd}
.sframe img{max-width:100%;max-height:12cqw}
.sframe img.mark{max-height:9cqw}
.sswatches{display:grid;grid-template-columns:repeat(4,1fr);gap:1.8cqw}
.sswatch span{display:block;height:7cqw;border-radius:1.2cqw;border:1px solid rgba(253,253,253,.12);margin-bottom:.9cqw}
.sswatch b{display:block;font-size:1.7cqw;color:#fdfdfd}
.sswatch code{display:block;font-size:1.5cqw;color:#f6bd3a;margin:.2cqw 0}
.sswatch small{display:block;font-size:1.3cqw;color:#9a9a9a;line-height:1.3}
.sfont{padding:2cqw 0;border-bottom:1px solid rgba(253,253,253,.1)}
.sfont:last-child{border-bottom:0}
.sfontsample{font-size:4cqw;line-height:1.2;margin-bottom:1cqw;overflow-wrap:anywhere}
.sfontmeta{font-size:1.6cqw;color:#9a9a9a;letter-spacing:.04em}

@media print{
  @page{size:280mm 157.5mm;margin:0}
  body{background:#fff}
  .sidebar,.topbar,.deckbar,#alerts,.main>div>p.muted{display:none !important}
  .main{margin:0 !important;width:100% !important;padding:0 !important}
  .slide{display:flex !important;flex-direction:column;border-radius:0;break-after:page;page-break-after:always;
    width:100%;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .slide:last-child{break-after:auto;page-break-after:auto}
}

/* --- брендбук: галереи материалов --- */
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px}
.gallery figure{margin:0}
.gallery img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:10px;border:1px solid var(--line);background:var(--bg);display:block}
.gallery figcaption{font-size:12px;color:var(--muted);margin-top:6px}
.gallery .shotmissing img,figure.shotmissing img{opacity:.25}
.sgallery{display:grid;gap:1.6cqw;grid-template-columns:repeat(3,1fr)}
.sgallery.cols-1{grid-template-columns:1fr}
.sgallery.cols-2{grid-template-columns:repeat(2,1fr)}
.sgallery figure{margin:0;min-height:0}
.sgallery img{width:100%;height:22cqw;object-fit:cover;border-radius:1.2cqw;border:1px solid rgba(253,253,253,.12);display:block}
.sgallery.cols-1 img{height:40cqw;object-fit:contain;background:#1b1b1b}
.sgallery.cols-2 img{height:32cqw}
.sgallery figcaption{font-size:1.4cqw;color:#9a9a9a;margin-top:.7cqw}

/* ==========================================================================
   ФИРМЕННЫЙ СТИЛЬ ADERVIS
   Палитра и шрифты из брендбука. Этот слой идёт последним и перекрывает
   служебные цвета, с которыми приложение начиналось.
   ========================================================================== */

:root{
  --gold:#f6bd3a;
  --gold-soft:#ffd673;
  --gold-bg:rgba(246,189,58,.12);
  --ink-on-gold:#141414;
  --c-video:#ef4444; --c-design:#8b5cf6; --c-photo:#f6bd3a; --c-ai:#22c55e;
  --font-display:'Eurostile Extd','Unbounded',ui-sans-serif,sans-serif;
  --font-ui:'TT Fors','Golos Text',ui-sans-serif,sans-serif;

  /* светлая тема: та же палитра, вывернутая */
  --bg:#f4f4f5; --panel:#fff; --ink:#141414; --muted:#5c5c5c; --line:rgba(20,20,20,.12);
  --dark:#141414; --shadow:0 18px 48px rgba(20,20,20,.08);
  --blue:#eef1f6; --green:#e8f3ea; --orange:#f8eee0; --purple:#f2ece0;
}

html[data-theme=dark]{
  --bg:#141414; --panel:#1b1b1b; --ink:#fdfdfd; --muted:#9a9a9a;
  --line:rgba(253,253,253,.10); --shadow:0 24px 64px rgba(0,0,0,.5);
  --blue:#232323; --green:#1f2a22; --orange:#2a231a; --purple:#232323;
}

body{font-family:var(--font-ui)}
h1,h2,h3,.value,.covertitle,.slidetitle{font-family:var(--font-display);letter-spacing:-.01em}
.eyebrow,.slidelabel{letter-spacing:.14em}

/* --- боковое меню --- */
.sidebar{background:#0f0f0f;border-right:1px solid var(--line)}
html:not([data-theme=dark]) .sidebar{background:#141414}
.brandmark{background:var(--gold);color:var(--ink-on-gold)}
.brand small,.workspace span,.bottom small{color:#8a8a8a}
.workspace{background:#1b1b1b;border-color:#2a2a2a}
.nav button{color:#bdbdbd;border-color:transparent}
.nav button:hover{background:#1f1f1f;color:#fdfdfd}
.nav button.active{background:#1f1f1f;color:#fdfdfd;box-shadow:inset 3px 0 0 var(--gold)}
.nav button.active i{color:var(--gold)}
.bottom{border-top-color:#2a2a2a}
.bottom button{border-color:#2f2f2f;color:#bdbdbd}
.bottom button:hover{background:#1f1f1f;color:#fdfdfd}
.avatar{background:var(--gold);color:var(--ink-on-gold)}

/* --- кнопки и ссылки --- */
.primary,.primary.lime{background:var(--gold);color:var(--ink-on-gold);font-weight:600;border-color:transparent}
.primary:hover,.primary.lime:hover{background:var(--gold-soft);box-shadow:0 0 28px rgba(246,189,58,.28)}
.primary:disabled{opacity:.6}
button:not([class]):hover,.iconbtn:hover,.swatch:hover,button.tag:hover,.click:hover{border-color:var(--gold)}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
a,.link{color:#c8952a}
html[data-theme=dark] a,html[data-theme=dark] .link{color:var(--gold)}
.task input{accent-color:var(--gold)}
.gatecard input:focus,.input:focus,dialog input:focus,dialog select:focus,dialog textarea:focus{border-color:var(--gold);outline:none}
.danger{color:#d64545;border-color:rgba(214,69,69,.45)}

/* --- поверхности --- */
.card{border-radius:16px}
.numbermark{color:var(--gold);font-size:42px}
.timeline .card{border-left:4px solid var(--gold)}
.timeline .card:first-child{border-left-color:var(--gold-soft)}
.notice{background:var(--gold-bg);border:1px solid rgba(246,189,58,.28)}
.tag{background:var(--gold-bg);color:#8a6410}
html[data-theme=dark] .tag{color:var(--gold-soft)}
.tag.green{background:rgba(34,197,94,.14);color:#2f7f4d}
.tag.blue{background:rgba(139,92,246,.14);color:#6a4bbd}
.tag.orange{background:rgba(239,68,68,.12);color:#b03b3b}
html[data-theme=dark] .tag.green{color:#7fd8a0}
html[data-theme=dark] .tag.blue{color:#c0a8ff}
html[data-theme=dark] .tag.orange{color:#ff9d9d}
.dot.l{background:var(--gold)}
.dot.o{background:var(--c-video)}

/* --- главный баннер --- */
.hero{background:#1b1b1b;border:1px solid var(--line);color:#fdfdfd;
  background-image:radial-gradient(120% 140% at 88% 8%,rgba(246,189,58,.18),transparent 46%)}
.hero:after{content:'';position:absolute;right:-6%;top:-32%;width:38%;height:190%;
  background:url(brand/icon.svg) no-repeat center/contain;opacity:.10}
.hero p{color:#c9c9c9;max-width:62%}
.hero .eyebrow{color:var(--gold)}
.hero button{background:var(--gold);color:var(--ink-on-gold);border-color:transparent;font-weight:600}
.hero button:hover{background:var(--gold-soft)}
.hero button[data-page=cases],.hero button[data-page=competitors]{background:transparent;color:#fdfdfd;border:1px solid rgba(253,253,253,.28)}
.hero button[data-page=cases]:hover,.hero button[data-page=competitors]:hover{border-color:var(--gold);background:rgba(246,189,58,.08)}

/* --- вход --- */
.gate{background:#141414}
.gatecard{background:#1b1b1b;border:1px solid rgba(253,253,253,.10);color:#fdfdfd;box-shadow:0 30px 80px rgba(0,0,0,.55)}
.gatecard .muted,.gatecard label,.gatehint{color:#9a9a9a}
.gatecard b{color:#fdfdfd}
.gatecard input{background:#141414;border-color:rgba(253,253,253,.16);color:#fdfdfd}
.gaterow .task{color:#fdfdfd}
.gatecard .link{color:var(--gold)}

/* --- брендбук --- */
.swatch .chip{height:56px}
.logoframe{background:#141414}
.logoframe.light{background:#fdfdfd}
.sampletext{font-size:30px}

/* --- нейроцепочка --- */
.chain{display:flex;align-items:stretch;gap:10px;margin-bottom:14px;overflow-x:auto;padding-bottom:6px}
.link-node{flex:1 1 0;min-width:190px;text-align:left;background:var(--panel);border:1px solid var(--line);
  border-radius:16px;padding:16px;display:flex;flex-direction:column;gap:6px;position:relative;transition:.2s}
.link-node:hover{border-color:var(--gold);transform:translateY(-2px)}
.link-node .nodenum{position:absolute;right:14px;top:12px;font-size:11px;color:var(--muted);
  border:1px solid var(--line);border-radius:999px;width:22px;height:22px;display:grid;place-items:center}
.link-node b{font-family:var(--font-display);font-size:15px}
.nodevalue{font-family:var(--font-display);font-size:30px;line-height:1;letter-spacing:-.02em;color:var(--ink)}
.nodevalue small{font-family:var(--font-ui);font-size:11px;color:var(--muted);display:block;margin-top:5px;letter-spacing:0}
.noderows{display:grid;gap:3px;margin-top:4px}
.noderows span{font-size:12px;color:var(--muted);line-height:1.3}
.link-node.ok{border-left:3px solid var(--gold)}
.link-node.warn{border-left:3px solid #ef9a4a}
.link-node.empty{border-left:3px solid var(--line)}
.link-node.empty .nodevalue{color:var(--muted)}
.chainarrow{align-self:center;color:var(--gold);font-size:20px;flex:none}
.chainloop{border:1px dashed var(--line);border-radius:12px;padding:10px 14px;margin-bottom:22px;
  font-size:12px;color:var(--muted);position:relative}
.chainloop:before{content:'↺';color:var(--gold);margin-right:8px;font-size:15px}
.gapcard{text-align:left;display:block}
.gapcard b{display:block;margin-bottom:6px}
.gapcard .gaplink{color:var(--gold);font-size:12px}
@media(max-width:720px){
  .chain{flex-direction:column;overflow:visible}
  .link-node{min-width:0}
  .chainarrow{transform:rotate(90deg);align-self:flex-start;margin-left:18px}
}

/* --- единый набор иконок --- */
.ic{flex:none}
.nav i{width:20px;height:20px;display:grid;place-items:center;color:#9a9a9a}
.nav button.active i{color:var(--gold)}
.search{display:inline-flex;align-items:center;gap:9px}
.search .kbd{font-size:11px;color:var(--muted);border:1px solid var(--line);border-radius:6px;padding:2px 6px}
.primary{display:inline-flex;align-items:center;justify-content:center;gap:8px}
.iconbtn{display:inline-grid;place-items:center;padding:0}
.del{display:inline-grid;place-items:center;padding:6px}
dialog .close{width:34px;height:34px;border-radius:10px;background:var(--bg);border:1px solid var(--line)}
/* фирменный знак в пустых состояниях */
.empty:before{content:'';display:block;width:44px;height:44px;margin:0 auto 12px;opacity:.3;
  background:url(brand/icon.svg) no-repeat center/contain}


/* --- графики --- */
.chartcard{margin-bottom:0}
.chartnote{font-size:12px;margin:0 0 10px}
.chart{width:100%;height:auto;display:block;overflow:visible}
.chart .gridline{stroke:var(--line);stroke-width:1}
.chart .axisline{stroke:var(--line);stroke-width:1}
.chart .axis{fill:var(--muted);font-size:11px;font-family:var(--font-ui)}
.chart .rowlabel{font-size:12px}
.chart .value{fill:var(--ink);font-size:12px;font-family:var(--font-ui);font-weight:600}
.chart .serielabel{fill:var(--ink);font-size:12px;font-family:var(--font-ui)}
.chart .serie circle{transition:r .12s}
.chart .serie:hover circle{r:6}
.chart rect{transition:opacity .12s}
.chart rect:hover{opacity:.82}
.spark{display:block;margin-top:10px;width:132px;height:34px}
@media(max-width:720px){.chart .serielabel,.chart .rowlabel{font-size:14px}}

/* --- схема нейроцепочки --- */
.mapcard{padding:10px 14px 4px;margin-bottom:14px}
.chainmap{width:100%;height:auto;display:block;overflow:visible}
.cnode rect{fill:var(--bg);stroke:var(--line);stroke-width:1.5;transition:.15s}
.cnode.on rect{stroke:var(--gold)}
.cnode:hover rect{stroke:var(--gold);fill:var(--gold-bg)}
.cnode{cursor:pointer}
.cnode:focus-visible rect{stroke:var(--gold);stroke-width:2.5}
.cnum{fill:var(--ink);font-family:var(--font-display);font-size:30px;font-weight:700}
.cnode.off .cnum{fill:var(--muted)}
.cunit{fill:var(--muted);font-size:12px;font-family:var(--font-ui)}
.ctitle{fill:var(--ink);font-size:14px;font-family:var(--font-display)}
.carrow line,.carrow path{stroke:var(--line);stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.carrow.on line,.carrow.on path{stroke:var(--gold)}
.cloop{stroke:var(--line);stroke-width:1.5;fill:none;stroke-dasharray:6 6;stroke-linecap:round}
.cloop.head{stroke:var(--gold);stroke-dasharray:none;stroke-width:2;stroke-linejoin:round}
.cloopname{fill:var(--muted);font-size:12px;font-family:var(--font-ui)}
@media(max-width:860px){.mapcard{display:none}}

/* --- публикация в канал --- */
.publishrow{flex-wrap:wrap;gap:10px;align-items:center;margin-top:18px;border-top:1px solid var(--line);padding-top:16px}
.previewbox{max-height:260px;overflow:auto;font-size:13px;line-height:1.5;background:var(--bg);margin:10px 0 0}

/* --- правки черновика и выбор записей --- */
.rewrites{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:12px 0 4px;font-size:12px}
.chip{background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:5px 11px;font-size:12px;color:var(--ink)}
.chip:hover{border-color:var(--gold);color:var(--ink)}
.chip:disabled{opacity:.5}
.pickbox{max-height:44vh;overflow:auto;border:1px solid var(--line);border-radius:12px;padding:10px;margin-top:10px}
.pickrow{display:flex;gap:10px;align-items:flex-start;padding:7px 4px;border-bottom:1px solid var(--line)}
.pickrow:last-child{border-bottom:0}
.pickrow input{margin-top:3px;width:16px;height:16px;accent-color:var(--gold);flex:none}
.pickrow b{font-weight:600;font-size:13px}
@media(max-width:720px){.chip{padding:9px 14px;font-size:13px}.rewrites{gap:8px}}

/* --- деньги и решения --- */
.table .minus{color:#d64545}
.decision .measure{font-size:13px;margin:8px 0 0;padding:8px 10px;border-left:2px solid var(--gold);background:var(--gold-bg);border-radius:0 8px 8px 0}
.decision .outcome{font-size:13px;margin:8px 0 0;color:var(--muted)}
.decision h2{font-size:16px}

/* --- точка безубыточности --- */
.bezone{border:1px solid var(--line);border-left:3px solid var(--line);border-radius:12px;padding:14px}
.bezone.ok{border-left-color:#059669}
.bezone.under{border-left-color:var(--gold)}
.bezone .value{font-size:30px}
.bezone .value small{font-size:12px;font-weight:400;color:var(--muted);font-family:var(--font-ui);display:block;margin-top:4px}
.bezone p{margin:6px 0 0;font-size:13px}
.bezone .small{font-size:12px;line-height:1.4}
.plus{color:#059669}
.minus{color:#d64545}
.ecorow{border-bottom:1px solid var(--line);padding:12px 0}
.ecorow:last-of-type{border-bottom:0}
.ecorow b{display:block;margin-bottom:6px;font-family:var(--font-display)}
.ecorow label{display:block;font-size:12px;color:var(--muted);margin-top:8px}
.ecorow input{width:100%;padding:9px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--ink);margin-top:4px}

/* --- полнота брендбука --- */
.progresscard{margin-bottom:16px}
.progresscard .progress{height:8px;background:var(--line);border-radius:10px;overflow:hidden;flex:none}
.progresscard .progress i{display:block;height:100%;background:var(--gold);border-radius:10px}
.progresscard .chip{margin:3px 2px 0 0}
.blockbtns{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.blockbtns .chip.danger{border-color:transparent;padding:6px 8px}
.blockbtns .chip.danger:hover{border-color:rgba(214,69,69,.45)}
@media(max-width:720px){
  .blockbtns .chip{min-height:38px;min-width:38px;padding:8px 12px}
  .blockbtns .chip.danger{padding:8px 10px}
  .progresscard .chip{min-height:38px}
}

/* --- чертежи брендбука --- */
.figure{width:100%;height:auto;display:block;overflow:visible}
.figure .fzone{fill:none;stroke:var(--gold);stroke-width:1.5;stroke-dasharray:7 6}
.figure .fmark{fill:none;stroke:var(--line);stroke-width:1.5}
.figure .fdim{stroke:var(--gold);stroke-width:1.5}
.figure .flabel{fill:var(--ink);font-size:13px;font-family:var(--font-ui);font-weight:600}
.figure .fnote{fill:var(--muted);font-size:12px;font-family:var(--font-ui)}
.figure .fnote.good{fill:#059669}
.figure .fnote.bad{fill:#d64545}
.figure .fcell{fill:var(--bg);stroke:var(--line);stroke-width:1}
.figure .fslash{stroke:#d64545;stroke-width:2.5;stroke-linecap:round;opacity:.85}
/* сами ошибки: знак искажается прямо на чертеже */
.figure .fimg.stretch{transform:scaleX(1.45);transform-origin:center;transform-box:fill-box}
.figure .fimg.recolor{filter:hue-rotate(155deg) saturate(2.2)}
.figure .fimg.shadow{filter:drop-shadow(0 4px 3px rgba(0,0,0,.6)) drop-shadow(0 0 2px #fff)}
.figure .fimg.rotate{transform:rotate(-17deg);transform-origin:center;transform-box:fill-box}
.figure .fcell.busy{fill:url(#busy)}
.figure .fcell.frame{stroke:var(--ink);stroke-width:5}
/* чертёж на слайде */
.sfigure .figure{max-height:62cqh}
.slidenote{font-size:1.6cqw;color:#9a9a9a;margin:1.4cqw 0 0}

/* --- страницы элементов --- */
.iconsheet .icongroup{margin-bottom:18px}
.icongrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:10px;margin-top:8px}
.iconcell{display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 6px;border:1px solid var(--line);border-radius:10px;background:var(--bg)}
.iconcell span{font-size:10px;color:var(--muted);letter-spacing:.04em}
.iconcell svg{color:var(--ink)}
.uikit{display:grid;gap:14px}
.uirow{display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding-bottom:14px;border-bottom:1px solid var(--line)}
.uirow:last-of-type{border-bottom:0}
.uilabel{flex:0 0 120px;font-size:12px;color:var(--muted);letter-spacing:.06em;text-transform:uppercase}
.uikit .input{min-width:160px}
.uikit .uifocus{border-color:var(--gold);box-shadow:0 0 0 2px rgba(246,189,58,.22)}
.uikit .uierror{border-color:#d64545}
.uikit .task{margin:0;display:flex;align-items:center;gap:8px}
.uikit button:disabled{opacity:.5;cursor:not-allowed}
@media(max-width:720px){.uilabel{flex:1 0 100%}}

/* --- разделы брендбука и паттерны --- */
.toc{margin-bottom:14px}
.tocrow{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.tocrow .chip{display:inline-flex;align-items:center;gap:6px;text-decoration:none}
.tocrow .chip b{color:var(--muted);font-weight:600;font-size:11px}
.sectionhead{font-family:var(--font-display);font-size:18px;margin:26px 0 12px;padding-bottom:8px;
  border-bottom:1px solid var(--line);display:flex;align-items:baseline;gap:10px;scroll-margin-top:80px}
.sectionhead small{font-size:12px}
.brandtext.clipped{max-height:132px;overflow:hidden;-webkit-mask-image:linear-gradient(#000 70%,transparent);mask-image:linear-gradient(#000 70%,transparent)}
.more{margin-top:8px}
.patterns{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
.patterncell{margin:0}
.patterncell svg{width:100%;height:auto;display:block;border-radius:10px;border:1px solid var(--line)}
.patterncell figcaption{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:8px;font-size:12px}
.patterncell figcaption b{font-size:13px}

/* Кликабельная строка таблицы: заявки открываются прямо из списка. */
.table tr.clickrow{cursor:pointer}
.table tr.clickrow:hover td{background:var(--purple)}
.table tr.clickrow:focus-visible{outline:3px solid #9278ff;outline-offset:-3px}

/* --- Навигация и плотность -------------------------------------------
   Меню сгруппировано, поэтому пункты сделаны компактнее: иначе четыре
   заголовка групп выталкивают «Настройки» за край экрана. */
.nav{gap:1px}
.nav button{padding:8px 12px}
.nav .navgroup{color:#71767f;text-transform:uppercase;letter-spacing:.11em;font-size:9.5px;font-weight:700;padding:15px 12px 6px}
.nav .navgroup:first-child{padding-top:2px}

/* Шапка обзора: приветствие не должно занимать треть экрана. */
.hero.compact{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;padding:22px 26px}
.hero.compact h1{font-size:30px;margin:6px 0 6px}
.hero.compact p{max-width:none;margin:0}
.hero.compact:after{font-size:88px;right:24px;top:-6px}
.heroactions{display:flex;gap:8px;flex:none;position:relative;z-index:1}

/* Плитки обзора кликабельны: цифра ведёт туда, где её можно разобрать. */
.metric.click{text-align:left;width:100%;display:block}
.metric.click:hover{border-color:#9278ff}

/* Таблицы: 12px сверху и снизу на каждой строке — это полтора экрана
   воздуха на двадцати строках. */
.table th,.table td{padding:9px 10px}
.table th{letter-spacing:.06em;text-transform:uppercase}
.table td{vertical-align:top}

/* Меню длиннее экрана: прокручивается само, а знак сверху и пользователь
   снизу остаются на месте. Иначе «Настройки» просто срезались краем. */
.sidebar{overflow:hidden}
.sidebar .brand,.sidebar .workspace,.sidebar .nav-label,.sidebar .bottom{flex:none}
.nav{overflow-y:auto;min-height:0;flex:1;scrollbar-width:thin;padding-bottom:6px}
.nav button{padding:7px 12px}
.nav .navgroup{padding:13px 12px 5px}

/* --- Телефон: шапка обзора и пустые состояния -------------------------
   На 390px флекс-шапка зажимала текст в половину ширины и разваливала
   его на шесть строк. Складываем в столбец. */
@media(max-width:720px){
  .hero.compact{flex-direction:column;align-items:stretch;gap:14px;padding:18px 18px 20px}
  .hero.compact h1{font-size:26px;margin:4px 0 6px}
  .heroactions{width:100%}
  .heroactions button{flex:1}
}

/* Пустое состояние занимало по двести точек на фразу в одну строку.
   Знак остаётся, но перестаёт быть баннером. */
.empty{padding:20px 16px}
.empty:before{width:26px;height:26px;margin-bottom:8px;opacity:.22}
.card.empty{padding:22px 18px}
.card.empty h2{margin-bottom:8px}

/* Отметки в списках: квадрат в 18 точек пальцем не берётся. Сам ярлык и
   есть область касания, поэтому тянем его до нормы целиком. */
.task{min-height:44px;cursor:pointer}
.task input{width:22px;height:22px;flex:none}

/* --- Тон статусов ------------------------------------------------------
   Слово остаётся на месте, цвет только помогает найти нужную строку
   взглядом. Пары проверены на контраст в обеих темах. */
:root{--red:#fadcdc;--ink-good:#1d6b38;--ink-bad:#8f2020;--ink-warn:#8a5320;--ink-work:#33508f}
html[data-theme=dark]{--red:#4a2b33;--ink-good:#8fe0ac;--ink-bad:#ffb3b3;--ink-warn:#ffcb95;--ink-work:#a8c4ff}
.tag.good{background:var(--green);color:var(--ink-good)}
.tag.bad{background:var(--red);color:var(--ink-bad)}
.tag.warn{background:var(--orange);color:var(--ink-warn)}
.tag.work{background:var(--blue);color:var(--ink-work)}
.tag.idle{background:var(--bg);color:var(--muted);box-shadow:inset 0 0 0 1px var(--line)}
.tag.off{background:transparent;color:var(--muted);box-shadow:inset 0 0 0 1px var(--line)}

/* Цифры в колонках и плитках — табличные, иначе разряды не встают друг
   под другом и столбец читается рвано. */
.table td,.metric .value,.chart .value,.chart .axis{font-variant-numeric:tabular-nums}

/* Пороги безубыточности занимали узкую плитку слева и полкарточки
   пустоты справа: сетка была жёстко на три колонки при одном направлении.
   Теперь плитки растягиваются по числу направлений. */
.bezgrid{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}

/* Меню «Создать»: подпись объясняет, что это, чтобы не открывать форму
   ради выяснения. Пункт текущего раздела помечен и стоит первым. */
.createlist{display:grid;gap:8px;margin-top:6px}
.createitem{display:block;text-align:left;width:100%;padding:12px 14px;border-radius:11px;
  background:var(--bg);border:1px solid var(--line);color:var(--ink);min-height:44px}
.createitem:hover{border-color:#9278ff}
.createitem b{display:block;font-size:14px}
.createitem small{color:var(--muted)}
.createitem.here{border-color:#9278ff;box-shadow:inset 3px 0 0 #9278ff}

/* --- Карта связей ------------------------------------------------------
   Цвета узлов заданы токенами: на светлом нужны тёмные, на тёмном
   светлые, иначе кружки пропадают в фоне. */
:root{--g-knowledge:#b45309;--g-content:#0369a1;--g-decision:#6d28d9;--g-lead:#b91c1c;
  --g-brand:#0f766e;--g-money:#4d5666;--g-hub:#9278ff}
html[data-theme=dark]{--g-knowledge:#f0a73b;--g-content:#4ab3ee;--g-decision:#b291ff;
  --g-lead:#ff8a8a;--g-brand:#4fd6c3;--g-money:#aab3c4;--g-hub:#b9a7ff}

.graphwrap{background:var(--panel);border:1px solid var(--line);border-radius:14px;
  box-shadow:var(--shadow);padding:14px 16px 16px}
.graphwrap.full{position:fixed;inset:0;z-index:60;border-radius:0;border:0;
  display:flex;flex-direction:column;padding:14px 18px 10px}
.graphbar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:10px}
.glegends{display:flex;gap:6px;flex-wrap:wrap}
.glegend{display:inline-flex;align-items:center;gap:6px;font-size:11px;color:var(--muted);
  padding:4px 9px;border-radius:999px;background:var(--bg);border:1px solid var(--line)}
.glegend:before{content:'';width:9px;height:9px;border-radius:50%;background:currentColor}
.glegend b{color:var(--ink);font-variant-numeric:tabular-nums}
.glegend.knowledge{color:var(--g-knowledge)}.glegend.content{color:var(--g-content)}
.glegend.decision{color:var(--g-decision)}.glegend.lead{color:var(--g-lead)}
.glegend.brand{color:var(--g-brand)}.glegend.money{color:var(--g-money)}
.glegend.hub{color:var(--g-hub)}
.gtools{display:flex;gap:6px}
.gtools button{min-width:44px;min-height:38px;padding:8px 12px;border-radius:9px;
  background:var(--bg);border:1px solid var(--line);color:var(--ink)}
.gtools button:hover{border-color:#9278ff}

.graphview{height:min(66vh,680px);overflow:hidden;border-radius:11px;background:var(--bg);
  cursor:grab;touch-action:none}
.graphwrap.full .graphview{flex:1;height:auto}
.graphview.grabbing{cursor:grabbing}
.graphview svg{width:100%;height:100%;display:block}

.glink{stroke:var(--line);stroke-width:1.4}
.glink.lit{stroke:var(--g-hub);stroke-width:2.2}
.glink.dim,.glink.faded{stroke-opacity:.18}
.gnode{cursor:pointer}
.gnode circle:not(.ghit){stroke:var(--panel);stroke-width:2.5}
.gnode text{font-size:13px;fill:var(--ink);font-family:var(--font-ui),inherit;pointer-events:none}
.gnode.knowledge circle:not(.ghit){fill:var(--g-knowledge)}
.gnode.content circle:not(.ghit){fill:var(--g-content)}
.gnode.decision circle:not(.ghit){fill:var(--g-decision)}
.gnode.lead circle:not(.ghit){fill:var(--g-lead)}
.gnode.brand circle:not(.ghit){fill:var(--g-brand)}
.gnode.money circle:not(.ghit){fill:var(--g-money)}
.gnode.hub circle:not(.ghit){fill:none;stroke:var(--g-hub);stroke-width:2.5}
.gnode.hub text{font-weight:700}
.gnode:hover circle:not(.ghit),.gnode:focus-visible circle:not(.ghit){stroke:#9278ff;stroke-width:3.5}
.gnode:focus-visible{outline:none}
.gnode.dim,.gnode.faded{opacity:.2}
.gnode.focus circle:not(.ghit){stroke:#9278ff;stroke-width:4}
.graphnote{margin:10px 0 0;font-size:13px}
.graphlist{margin-top:8px;font-size:13px}
.graphlist summary{cursor:pointer;color:var(--muted);min-height:44px;display:flex;align-items:center}
.graphlist ul{margin:0;padding-left:18px;max-height:220px;overflow:auto}
.graphlist li{margin-bottom:6px}

@media(max-width:720px){
  .graphview{height:58vh}
  .gnode text{font-size:17px}
  .graphbar{gap:8px}
}

/* Кружок в 8 точек пальцем не берётся: под каждым узлом лежит прозрачная
   область попадания, поэтому промахнуться сложно и на телефоне. */
.gnode circle.ghit{fill:transparent;stroke:none}
.gnode circle:not(.ghit){pointer-events:none}
/* Липкая верхняя панель перекрывала то, к чему проматывали. */
.graphwrap,.card,.head{scroll-margin-top:84px}

/* Подпись, которой не хватило места, ждёт наведения — иначе в скоплениях
   надписи налезают друг на друга и не читается ни одна. */
.gnode text.off{opacity:0}
.gnode:hover text.off,.gnode:focus-visible text.off{opacity:1}
.gnode:hover text,.gnode:focus-visible text{paint-order:stroke;stroke:var(--bg);stroke-width:4px;font-weight:700}

/* Чертёж тянулся на всю ширину карточки: на широком мониторе текст в нём
   раздувался вдвое и вылезал за край. Ограничиваем ширину — рисунок
   остаётся в своём кегле и читается одинаково на любом экране. */
.figure{max-width:880px;margin-left:auto;margin-right:auto}
.sfigure .figure{max-width:none}

/* --- Ширина колонки содержимого --------------------------------------
   На широком мониторе колонка растягивалась на 1660 точек: строки
   становились непрочитываемо длинными, а карточки — разреженными.
   Ограничиваем и центрируем, полотно карты этим не связано. */
@media(min-width:1051px){
  .main{max-width:1360px;margin-right:auto}
}
@media(min-width:1680px){
  .main{margin-left:max(256px,calc((100vw - 1360px) / 2))}
}

/* --- Типографическая шкала --------------------------------------------
   Размеры были выбраны на глаз: 34 / 19 / 15 / 14 / 13 / 12 / 11 / 10 —
   восемь ступеней без системы, соседние почти неразличимы. Шкала с
   постоянным шагом: каждая ступень заметно отличается от соседней. */
:root{
  --t-micro:11px;  /* надзаголовки, метки */
  --t-small:12.5px;/* пояснения, даты */
  --t-body:14px;   /* основной текст */
  --t-lead:16px;   /* подзаголовок страницы, ввод */
  --t-h3:18px;     /* заголовок внутри карточки */
  --t-h2:22px;     /* заголовок карточки и блока */
  --t-h1:32px;     /* заголовок страницы */
  --t-display:40px;/* крупное число в плитке */
}
h1{font-size:var(--t-h1);line-height:1.08}
h2{font-size:var(--t-h2);line-height:1.2;margin-bottom:14px}
h3{font-size:var(--t-h3);line-height:1.3}
.eyebrow{font-size:var(--t-micro)}
.head > div > .muted,.subtitle{font-size:var(--t-lead)}
.metric .value{font-size:var(--t-display)}
.metric .eyebrow{font-size:var(--t-micro)}
.metric small,.card small,.date,.source{font-size:var(--t-small)}
.sectionhead{font-size:var(--t-h2)}

/* --- Карточка темы брендбука ------------------------------------------
   Тринадцать одинаковых карточек подряд, и в каждой шапке четыре кнопки
   спорят с названием. Управление проявляется при наведении и при
   переходе табом, а название получает надзаголовок с разделом. */
.blockhead .blockbtns{opacity:0;transition:opacity .15s}
.card:hover .blockhead .blockbtns,
.blockhead .blockbtns:focus-within{opacity:1}
@media(hover:none){.blockhead .blockbtns{opacity:1}}

/* Полнота и оглавление — одной полосой вместо двух карточек. */
.brandbar{display:grid;grid-template-columns:1.6fr 1fr;gap:24px;align-items:start}
.brandbar .tocrow{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.brandbar .progress{margin:8px 0}
.brandbar-right{border-left:1px solid var(--line);padding-left:24px}
@media(max-width:860px){
  .brandbar{grid-template-columns:1fr;gap:16px}
  .brandbar-right{border-left:0;border-top:1px solid var(--line);padding:16px 0 0}
}

/* Строка «Обновил…» повторялась под каждой из тринадцати тем и читалась
   как шум. Нужна она редко — показываем вместе с управлением. */
.brandmeta{opacity:0;transition:opacity .15s;margin:14px 0 0;font-size:var(--t-micro)}
.card:hover .brandmeta,.card:focus-within .brandmeta{opacity:1}
@media(hover:none){.brandmeta{opacity:1}}

/* Брендбук длиной в шесть экранов: заголовок раздела держится у верхней
   кромки, пока раздел не кончится, — видно, где находишься. */
.sectionhead{position:sticky;top:64px;z-index:6;background:var(--bg);
  padding:10px 0 8px;margin:26px 0 12px;border-bottom:1px solid var(--line)}

/* Системная кнопка выбора файла подписана языком браузера — у половины
   пользователей это «Choose Files». Прячем её и даём свою подпись, но
   input остаётся в потоке: таб и скринридер работают как прежде. */
.offscreen{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0}
.fileadd{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:12px}
.filebtn{display:inline-flex;align-items:center;min-height:44px;padding:10px 16px;border-radius:9px;
  background:var(--bg);border:1px solid var(--line);color:var(--ink);cursor:pointer;font-weight:600}
.filebtn:hover{border-color:#9278ff}
.fileadd:focus-within .filebtn{outline:3px solid #9278ff;outline-offset:3px}

/* Доступ читается иначе, чем достоверность: «Внутреннее» — контур со
   штрихом, «Публичное» — сплошная заливка. Слова остаются на месте. */
.tag.closed{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink);opacity:.72}
.tag.open{background:var(--blue);color:var(--ink-work)}

/* Метки прижаты к низу карточки: раньше они висели сразу под текстом,
   и в ряду карточки выглядели неровными. */
.tagrow{margin-top:auto;padding-top:14px;display:flex;flex-wrap:wrap;gap:4px}
.tagrow .tag{margin:0}
.grid .card.click{display:flex;flex-direction:column}

/* Крупное число со знаком рубля переносилось на вторую строку после того,
   как ступень выросла до 40: «630 000» и отдельно «₽». Не переносим и
   даём числу ужиматься по ширине плитки. */
.metric .value{white-space:nowrap;font-size:clamp(24px,2.4vw,var(--t-display))}

/* Порог безубыточности: число слева, пояснения справа. Плитка на всю
   ширину с текстом в левом углу выглядела пустой. */
.bezone{display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:center}
.bezfigure{min-width:132px}
.bezfigure .value{font-size:var(--t-display);font-weight:800;letter-spacing:-.04em;line-height:1;margin:6px 0 4px}
.bezfacts p{margin:0 0 6px}
.bezfacts p:last-child{margin-bottom:0}
@media(max-width:560px){.bezone{grid-template-columns:1fr;gap:10px}}

/* Отбор заявок: выбранная метка видна не только цветом, но и рамкой. */
.leadbar{margin-bottom:6px}
.chip.on{background:var(--dark);color:#fff;border-color:var(--dark)}
.chip.on b{color:#fff}
.chip b{font-variant-numeric:tabular-nums;opacity:.7;margin-left:4px}

/* --- Палитра направлений и услуг --------------------------------------
   Значения взяты с сайта adervis.ru (css/style.css), а не придуманы:
   у услуг там четыре собственных цвета, у CRM — градиент со свечением.
   Приложение подхватывает их тем же способом — через data-dir. */
:root{
  --gold-soft:#ffd673;
  --gold-bg:rgba(246,189,58,.10);
  --glow-gold:0 0 48px rgba(246,189,58,.28);

  --c-video:#f52424;   /* видео */
  --c-design:#7733ff;  /* дизайн */
  --c-photo:#f5b72b;   /* фото */
  --c-ai:#22cc54;      /* ИИ-контент */

  --c-crm-1:#6c00ff;
  --c-crm-2:#9b4dff;
  --crm-gradient:linear-gradient(120deg,var(--c-crm-1) 0%,var(--c-crm-2) 100%);
  --glow-crm:0 0 48px rgba(155,77,255,.38);

  /* Stock — золото капсулы из его логотипа: градиент #f6bd3a → #c8901f.
     Зелёный #87e64b на портале Stock — это цвет Envato, им помечены файлы
     площадки; фирменным цветом Stock он не является. */
  --c-stock-1:#f6bd3a;
  --c-stock-2:#c8901f;
  --stock-gradient:linear-gradient(120deg,var(--c-stock-1) 0%,var(--c-stock-2) 100%);
  --glow-stock:0 0 48px rgba(200,144,31,.32);

  /* Направления бизнеса берут цвет своего продукта. Медиа — единственное,
     у которого своего цвета пока нет нигде; до решения держим нейтральный
     и не выдаём его за фирменный. */
  --c-studio:#f6bd3a;
  --c-crm:#9b4dff;
  --c-stock:#c8901f;   /* бронза: тёмный конец капсулы, иначе два золота не различить */
  --c-media:#8d95a6;
}
html[data-theme=light]{
  --c-studio:#a87908;
  --c-photo:#a8760d;
  --c-crm:#6c00ff;
  --c-stock:#8a5f10;
  --c-media:#5d6575;
  --glow-gold:0 0 32px rgba(246,189,58,.22);
}

/* Вместе с цветом направление несёт и цвет текста поверх него: золото и
   зелёный светлые — на них тёмный, фиолетовый и серый тёмные — на них
   светлый. Иначе подпись на плашке пропадает. */
[data-dir="Студия"]{--dir:var(--c-studio);--dir-ink:#0d0d0d}
[data-dir="CRM"]{--dir:var(--c-crm);--dir-ink:#fdfdfd}
[data-dir="Stock"]{--dir:var(--c-stock);--dir-ink:#0d0d0d}
[data-dir="Медиа"]{--dir:var(--c-media);--dir-ink:#fdfdfd}
[data-dir="video"]{--dir:var(--c-video)}
[data-dir="design"]{--dir:var(--c-design)}
[data-dir="photo"]{--dir:var(--c-photo)}
[data-dir="ai"]{--dir:var(--c-ai)}

/* Метка направления окрашивается своим цветом, но остаётся читаемой:
   заливка слабая, текст и точка — насыщенные. */
.tag[data-dir]{background:color-mix(in srgb,var(--dir) 14%,transparent);
  color:var(--dir);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--dir) 32%,transparent)}
.tag[data-dir]:before{content:'';width:7px;height:7px;border-radius:50%;
  background:var(--dir);margin-right:6px;flex:none}

/* Узел направления на карте носит цвет своего продукта. */
.gnode[data-dir] circle:not(.ghit){stroke:var(--dir)}
.gnode[data-dir].hub circle:not(.ghit){stroke:var(--dir)}
.gnode[data-dir] text{fill:var(--dir)}

/* Карточка направления: цветная полоса сверху и цветное число. Градиент
   только здесь, на крупной плашке — в мелочи он превращается в грязь. */
.dircard{position:relative;overflow:hidden;padding-top:26px}
.dirstripe{position:absolute;inset:0 0 auto;height:5px;
  background:linear-gradient(90deg,var(--dir),color-mix(in srgb,var(--dir) 45%,transparent))}
.dircard .numbermark{color:var(--dir);font-weight:800}
.dircard:hover{border-color:color-mix(in srgb,var(--dir) 55%,var(--line))}

/* Значок в метке доступа идёт перед словом и не спорит с ним по весу. */
.tag .ic{margin-right:5px;opacity:.85;flex:none}
/* Ключ иконки под названием — для того, кто ищет её в коде. */
.iconcell code{display:block;font-size:9.5px;color:var(--muted);opacity:.65;margin-top:2px;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
/* Клетка иконки одинаковой высоты: длинная подпись не должна её ломать. */
.iconcell{min-height:96px;justify-content:flex-start}
.iconcell span{line-height:1.25}

/* Страница продукта: акцент показан в деле, ядро рядом для сравнения. */
.productsheet{display:grid;gap:14px}
.prodplate{height:96px;border-radius:14px;display:grid;place-items:center;
  background:linear-gradient(120deg,var(--dir),color-mix(in srgb,var(--dir) 55%,#000));
  box-shadow:0 0 44px color-mix(in srgb,var(--dir) 34%,transparent)}
.prodplate span{font-family:var(--font-display),inherit;font-size:22px;font-weight:800;
  letter-spacing:.04em;color:var(--dir-ink,#0d0d0d)}
.prodrow{display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  padding:12px;border:1px solid var(--line);border-radius:12px}
.prodbtn{background:var(--dir);color:var(--dir-ink,#0d0d0d)}
.prodbtn:hover{background:color-mix(in srgb,var(--dir) 82%,#000)}
.prodchip{border-color:var(--dir);color:var(--dir)}
.prodbar{flex:1;min-width:120px;height:6px;border-radius:99px;background:var(--bg);overflow:hidden}
.prodbar i{display:block;height:100%;width:64%;border-radius:99px;
  background:linear-gradient(90deg,var(--dir),color-mix(in srgb,var(--dir) 40%,transparent))}

/* --- Типографика по ролям ---------------------------------------------
   Раньше одно правило набирало широким акцидентным шрифтом все h2 и все
   крупные числа. Заголовки карточек разъезжались на три строки,
   «630 000 ₽» не помещалось в плитку. Теперь у каждой гарнитуры своя
   работа: Eurostile — короткие крупные строки, TT Fors — всё остальное. */
:root{
  --w-display:900;     /* Eurostile Black — заголовок страницы */
  --w-display-2:500;   /* Eurostile Medium — заголовок раздела */
  --w-strong:700;      /* TT Fors Bold */
  --w-text:400;        /* TT Fors Regular */
}
body{font-family:var(--font-ui);font-weight:var(--w-text);line-height:1.55;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}

/* Акцидентный шрифт — только там, где строка короткая. */
h1,.sectionhead,.hero h1,.covertitle,.slidetitle{
  font-family:var(--font-display);font-weight:var(--w-display);letter-spacing:-.005em}
.head > h2,.head > div > h2,.head h2:only-child{
  font-family:var(--font-display);font-weight:var(--w-display-2);letter-spacing:0}

/* Заголовки карточек и всё, что бывает длинным, — текстовым шрифтом. */
.card h2,.card h3,h3,dialog h2,.blockhead h2,.gapcard b,.link-node b,.ecorow b,.ctitle{
  font-family:var(--font-ui);font-weight:var(--w-strong);letter-spacing:-.01em}
.card > h2{font-size:var(--t-h3);line-height:1.3}
.blockhead h2{font-size:var(--t-h2)}

/* Числа — текстовым шрифтом, табличными цифрами и плотнее: широкий
   акцидентный на числах делал их вдвое шире. */
.value,.nodevalue,.cnum,.bezfigure .value,.metric .value{
  font-family:var(--font-ui);font-weight:var(--w-strong);
  font-variant-numeric:tabular-nums;letter-spacing:-.025em}

/* Надзаголовки — капсом с разрядкой, иначе мелкий капс слипается. */
.eyebrow{font-family:var(--font-ui);font-weight:var(--w-strong);letter-spacing:.12em}

/* Длинный текст держим в читаемой длине строки. */
.brandtext,.bodytext,.card > p,.notice{max-width:72ch}

/* Слайды набирались прямыми именами шрифтов, мимо переменных: фирменные
   Eurostile и TT Fors туда не попадали, даже когда были загружены. */
.slide{font-family:var(--font-ui)}
.slidetitle,.covertitle{font-family:var(--font-display)}

/* Образцы типографики в брендбуке — теми же ролями, что и интерфейс. */
.typesheet{display:grid;gap:4px}
.typerow{display:grid;grid-template-columns:minmax(0,1fr) 230px;gap:24px;align-items:center;
  padding:16px 0;border-bottom:1px solid var(--line)}
.typerow:last-of-type{border-bottom:0}
.tsample{margin:0;min-width:0;overflow-wrap:anywhere}
.tdisplay{font-family:var(--font-display);font-weight:var(--w-display);font-size:var(--t-h1);line-height:1.08}
.tsection{font-family:var(--font-display);font-weight:var(--w-display-2);font-size:var(--t-h2)}
.tcard{font-family:var(--font-ui);font-weight:var(--w-strong);font-size:var(--t-h3);line-height:1.3}
.tnum{font-family:var(--font-ui);font-weight:var(--w-strong);font-size:var(--t-display);
  font-variant-numeric:tabular-nums;letter-spacing:-.025em;white-space:nowrap}
.tbody{font-family:var(--font-ui);font-size:var(--t-body);line-height:1.55;max-width:60ch}
.teyebrow{font-family:var(--font-ui);font-weight:var(--w-strong);font-size:var(--t-micro);
  text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}
.typemeta{display:grid;gap:2px;font-size:var(--t-small)}
.typemeta span{color:var(--muted)}
.typemeta code{font-family:ui-monospace,Menlo,monospace;font-size:11px;color:var(--muted);opacity:.8}
@media(max-width:720px){.typerow{grid-template-columns:1fr;gap:8px}}

/* Заголовок внутри карточки — всегда текстовым шрифтом. Правило шапки
   раздела оказалось специфичнее и перебивало его в карточках брендбука. */
.card .head h2,.card h2,.card .blockhead h2{font-family:var(--font-ui);font-weight:var(--w-strong);letter-spacing:-.01em}

/* Липкий заголовок раздела встаёт ровно под панелью: её высоту меряет
   приложение, а не угадывает стиль — панель меняется с кеглем и экраном. */
.sectionhead{top:var(--topbar-h,68px)}

/* --- Живой лист иконок ------------------------------------------------
   Каждая клетка — кнопка. Контур и заливка лежат друг на друге: при
   нажатии контур уходит, заливка вырастает с лёгкой пружиной, при выборе
   остаётся. Цвет — от выбранного продукта, иначе от текста. */
.iconsheet{--acc:var(--dir,var(--ink))}
.iconbar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;
  padding:0 0 14px;margin-bottom:6px;border-bottom:1px solid var(--line)}
.iconbar-right{display:flex;gap:6px;flex-wrap:wrap}
.icongroup{margin-top:18px}
.icongrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:8px;margin-top:10px}

.iconsheet .iconcell{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;
  min-height:104px;padding:16px 8px 10px;border-radius:14px;cursor:pointer;
  background:var(--panel);border:1px solid var(--line);color:var(--ink);
  transition:transform .18s cubic-bezier(.34,1.56,.64,1),border-color .15s,background-color .15s,color .15s,box-shadow .2s}
.iconsheet .iconcell:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--acc) 45%,var(--line));
  color:var(--acc)}
.iconsheet .iconcell:active{transform:scale(.93);transition-duration:.08s}
.iconsheet .iconcell:focus-visible{outline:3px solid #9278ff;outline-offset:2px}
.iconsheet .iconcell.picked{color:var(--acc);border-color:var(--acc);
  background:color-mix(in srgb,var(--acc) 9%,var(--panel));
  box-shadow:0 0 0 1px var(--acc),0 10px 28px -12px color-mix(in srgb,var(--acc) 55%,transparent)}

.icwrap{position:relative;width:26px;height:26px;display:grid;place-items:center}
.icwrap .ic{grid-area:1/1;transition:opacity .16s,transform .22s cubic-bezier(.34,1.56,.64,1)}
.icwrap .ic[data-weight=fill]{opacity:0;transform:scale(.55)}
.iconcell:active .icwrap .ic[data-weight=regular],
.iconcell.picked .icwrap .ic[data-weight=regular]{opacity:0;transform:scale(1.25)}
.iconcell:active .icwrap .ic[data-weight=fill],
.iconcell.picked .icwrap .ic[data-weight=fill]{opacity:1;transform:scale(1)}

.iconsheet .icname{font-size:12px;line-height:1.25;text-align:center}
.iconsheet .iconcell code{font-size:9.5px;opacity:.6}
.iconfoot{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:18px 0 6px;
  padding:12px 14px;border-radius:12px;background:var(--bg)}
.iconfoot a.chip{text-decoration:none}

/* Кто попросил систему поменьше движения — получает смену состояния
   без пружины и сдвигов. */
@media (prefers-reduced-motion: reduce){
  .iconsheet .iconcell,.icwrap .ic{transition:none}
  .iconsheet .iconcell:hover,.iconsheet .iconcell:active{transform:none}
}

/* Комплект для соцсетей в брендбуке. */
.socgroup{margin-top:18px}
.socgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px;margin-top:10px}
.socgrid.wide{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.soccell{margin:0}
.soccell a{display:block;border-radius:12px;overflow:hidden;border:1px solid var(--line);background:#090909;
  transition:transform .18s cubic-bezier(.34,1.56,.64,1),border-color .15s}
.soccell a:hover{transform:translateY(-2px);border-color:var(--gold)}
.soccell a:focus-visible{outline:3px solid #9278ff;outline-offset:2px}
.soccell img{display:block;width:100%;height:auto}
.soccell figcaption{display:flex;justify-content:space-between;gap:8px;margin-top:6px;font-size:var(--t-small)}
@media (prefers-reduced-motion: reduce){.soccell a{transition:none}.soccell a:hover{transform:none}}

/* Логотипы продукта в брендбуке: каждый на своём фоне, по клику скачивается. */
.logogrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.logoitem{margin:0}
.logoplate{display:grid;place-items:center;height:150px;border-radius:12px;padding:20px;border:1px solid var(--line);
  transition:transform .18s cubic-bezier(.34,1.56,.64,1),border-color .15s}
.logoplate:hover{transform:translateY(-2px);border-color:var(--gold)}
.logoplate img{max-width:100%;max-height:100%}
.logoitem figcaption{display:grid;gap:2px;margin-top:6px;font-size:var(--t-small)}
@media (prefers-reduced-motion: reduce){.logoplate{transition:none}.logoplate:hover{transform:none}}

/* «Изменить» — единственное действие над темой, прятать его до наведения
   нельзя: мышью неочевидно, что оно вообще есть. Скрываются только
   второстепенные ↑ ↓ × — они и правда нужны редко. */
.blockhead .blockbtns{opacity:1}
.blockhead .blockbtns > .chip{opacity:0;transition:opacity .15s}
.card:hover .blockhead .blockbtns > .chip,
.blockhead .blockbtns:focus-within > .chip{opacity:1}
@media(hover:none){.blockhead .blockbtns > .chip{opacity:1}}

/* Кто попросил систему поменьше движения — получает смену состояний без
   подъёмов, пружин и плавных появлений по всему приложению. */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;
    transition-duration:.01ms !important;scroll-behavior:auto !important}
  .click:hover,.metric.click:hover,.dircard:hover{transform:none !important}
}

/* Узел рекламы на карте связей: расход по каналу. */
.gnode.ad circle:not(.ghit){fill:var(--g-money)}
.glegend.ad{color:var(--g-money)}
.adtable td.minus{font-weight:700}

/* --- Кампании -----------------------------------------------------------
   Карточка отвечает на три вопроса сверху вниз: что это и в каком статусе,
   сколько потрачено из бюджета, что принесло. Полоса бюджета — в цвете
   направления; перерасход красным и словом, не только цветом. */
.campaign{display:flex;flex-direction:column;gap:10px}
.campaignhead{display:flex;justify-content:space-between;align-items:center;gap:8px}
.campaign h2{margin:0}
.campaigngoal{margin:0;font-size:var(--t-small)}
.budgetbar{height:8px;border-radius:99px;background:var(--bg);overflow:hidden;box-shadow:inset 0 0 0 1px var(--line)}
.budgetbar i{display:block;height:100%;border-radius:99px;background:var(--dir,var(--gold));transition:width .3s}
.budgetbar.over i{background:#d64545}
.budgetline{margin:0;font-variant-numeric:tabular-nums}
.campaignnums{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:10px 0;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.campaignnums span{display:grid;gap:2px}
.campaignnums b{font-size:20px;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.campaignnums small{font-size:11px;color:var(--muted)}
.campaignnums .minus b{color:#d64545}
.campaignwarn{margin:0;font-size:var(--t-small);font-weight:700}
.utmcopy{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;min-height:36px}
.utmset{border:1px solid var(--line);border-radius:12px;padding:6px 14px 12px;margin:16px 0 4px}
.utmset legend{padding:0 6px;font-size:12px;font-weight:700;color:var(--muted)}
.utmpreview{margin:12px 0 4px;padding:10px 12px;border-radius:9px;background:var(--bg);overflow-wrap:anywhere}
.utmpreview code{font-family:ui-monospace,Menlo,monospace;font-size:12px}

/* --- Контент-план ---------------------------------------------------------
   Сверху — площадка (вкладки листаются пальцем, страница вбок не едет),
   под ней её карточка: форматы, лимиты, аккаунт и парсер. Доска идёт по
   статусам слева направо — так же, как материал движется к выходу. */
.nettabs{display:flex;gap:8px;overflow-x:auto;padding:2px 2px 10px;margin:8px 0 14px;scrollbar-width:thin}
.nettab{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;min-height:40px;padding:8px 14px;
  border-radius:999px;background:var(--panel);border:1px solid var(--line);color:var(--ink);transition:border-color .15s,transform .15s}
.nettab:hover{border-color:var(--gold)}
.nettab:active{transform:scale(.97)}
.nettab b{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.nettab.on{background:var(--dark);border-color:var(--dark);color:#fff}
.nettab.on b{color:var(--gold)}
.netpanel{margin-bottom:18px}
.netpanelhead{display:flex;gap:14px;align-items:flex-start}
.netpanelhead h2{margin:0 0 2px}
.netpanelhead p{margin:0}
.neticon{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--bg);border:1px solid var(--line);color:var(--gold);flex:none}
.netfacts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:16px 0 0}
.netfacts div{border-top:1px solid var(--line);padding-top:10px}
.netfacts dt{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:700}
.netfacts dd{margin:4px 0 0;overflow-wrap:anywhere}
.netfacts dd .chip{margin-left:6px}
.feedbar{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:center;margin:16px 0 0}
.feedbar .primary{display:inline-flex;align-items:center;gap:8px}
.feedpanel{margin-top:16px;border-top:1px solid var(--line);padding-top:14px}
.feedhead{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.feednote{font-size:var(--t-small,12px);margin:8px 0 10px}
.feedlist{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.feedrow{display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px 12px;
  border:1px solid var(--line);border-radius:10px}
.feedrow.done{opacity:.72}
.feedviews{display:grid;text-align:right}
.feedviews b{font-size:17px;font-variant-numeric:tabular-nums}
.feedviews small{font-size:10px}
.feedtext{display:grid;gap:2px;min-width:0}
.feedtext a{color:var(--ink);font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.feedtext a:hover{color:var(--gold)}
.feedact .tag{display:inline-flex;gap:4px;align-items:center}
.plantools{justify-content:flex-start}
.plantools .input{max-width:420px}
.seg{display:flex;gap:6px}
.seg .chip{min-height:36px;padding:6px 14px}

.board{display:grid;grid-template-columns:repeat(5,minmax(210px,1fr));gap:12px;overflow-x:auto;padding-bottom:6px;align-items:start}
.boardcol{background:var(--bg);border:1px solid var(--line);border-radius:14px;padding:10px;display:grid;gap:8px;min-width:0}
.boardcol header{display:flex;justify-content:space-between;align-items:center;padding:2px 4px 4px}
.boardcol header span{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.boardempty{text-align:center;margin:10px 0;font-size:12px}
.pcard{padding:12px;display:grid;gap:8px;border-left:3px solid var(--dir,var(--line))}
.pcard h3{margin:0;font-size:14px;line-height:1.35;overflow-wrap:anywhere}
.pcardhead,.pcardfoot{display:flex;justify-content:space-between;align-items:center;gap:8px}
.pcardhead small,.pcardfoot small{font-size:11px}
.netmark{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:700;color:var(--muted)}
.movebtns{display:flex;gap:4px;flex:none}
.movebtn{min-width:36px;min-height:36px;padding:2px 8px}
.counter{display:block;margin-top:4px;font-variant-numeric:tabular-nums}
.counter.over{color:#d64545;font-weight:700}
.nethint{display:flex;gap:6px;align-items:flex-start;font-size:12px;color:var(--muted);margin:10px 0 0}
.nethint svg{flex:none;margin-top:2px}
.calhead{justify-content:flex-start}
.calhead h2{margin:0;min-width:180px;text-align:center}
.day.today{border-color:var(--gold)}
.event{display:flex;gap:5px;align-items:flex-start;text-align:left}
.event svg{flex:none;margin-top:1px}
.event.done{opacity:.6}
@media(max-width:1050px){.netfacts{grid-template-columns:1fr 1fr}}
@media(max-width:720px){
  .board{grid-template-columns:1fr;overflow:visible}
  .netfacts{grid-template-columns:1fr}
  .feedrow{grid-template-columns:52px minmax(0,1fr)}
  .feedact{grid-column:2}
  .plantools .input{max-width:none}
}

/* --- Воронка --------------------------------------------------------------
   Ширина полосы — доля от входа, справа — сколько дошло от прошлого шага.
   Потери подписаны словом. Полоса темнеет к сделке: чем дальше, тем ценнее. */
.funnelcard{margin:16px 0}
.funnelcard h2{margin:0 0 12px}
.funnel{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.fstep{display:grid;grid-template-columns:minmax(120px,190px) minmax(0,1fr) 110px;gap:14px;align-items:center}
.fname{display:grid;gap:1px}
.fname small{font-size:11px}
.fbarwrap{display:flex;align-items:center;gap:10px;min-width:0}
.fbar{height:30px;border-radius:8px;background:var(--gold);min-width:6px;transition:width .3s}
.fstep:nth-child(2) .fbar{background:color-mix(in srgb,var(--gold) 82%,var(--ink))}
.fstep:nth-child(3) .fbar{background:color-mix(in srgb,var(--gold) 66%,var(--ink))}
.fstep:nth-child(n+4) .fbar{background:color-mix(in srgb,var(--gold) 50%,var(--ink))}
.fnum{font-size:18px;font-variant-numeric:tabular-nums;white-space:nowrap}
.fconv{display:grid;text-align:right}
.fconv b{font-variant-numeric:tabular-nums}
.fconv small{font-size:10px}
.funnelnote{margin:12px 0 0;font-size:var(--t-small,12px)}
.leadboard{grid-template-columns:repeat(5,minmax(200px,1fr))}
.boardcol.lost{opacity:.85}
.lcard{padding:12px;display:grid;gap:6px;border-left:3px solid var(--dir,var(--line))}
.lcard h3{margin:0;font-size:14px}
.lreq{margin:0;font-size:12px}
.head .seg{margin-left:auto}

/* --- Метрики с целями ---------------------------------------------------- */
.kpigrid{grid-template-columns:repeat(4,minmax(0,1fr))}
.kpi{display:flex;flex-direction:column;gap:4px}
.kpi small{flex:1}
.kpibar{height:6px;border-radius:99px;background:var(--bg);overflow:hidden;box-shadow:inset 0 0 0 1px var(--line)}
.kpibar i{display:block;height:100%;border-radius:99px;background:#d64545}
.kpibar.ok i{background:#2e9e5b}
.kpi.ok .value::after{content:' ✓';font-size:.6em;color:#2e9e5b}
.kpiset{align-self:flex-start;margin-top:6px;min-height:36px}

/* --- Поиск клиентов ------------------------------------------------------ */
.finder{grid-template-columns:repeat(2,minmax(0,1fr));margin-bottom:8px}
.finder form h2{margin:0 0 4px}
.finder form label{display:block;font-size:12px;color:var(--muted);margin:10px 0 4px}
.finder .input{width:100%}
.orglist{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:6px;max-height:420px;overflow:auto}
.orgrow{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:10px}
.orgrow div{display:grid;gap:2px;min-width:0}
.orgrow small{overflow-wrap:anywhere}
.sitefound{margin-top:14px;display:grid;gap:4px}
.contacticons{white-space:nowrap}
.contacticons span{display:inline-flex;margin-right:6px;color:var(--muted)}
.inlinerow{display:flex;gap:8px;align-items:stretch}
.inlinerow input{flex:1}
.inlinerow button{display:inline-flex;gap:6px;align-items:center;white-space:nowrap}
.linkbtn{background:none;border:0;padding:0;color:inherit;font-weight:700;text-decoration:underline;cursor:pointer}
@media(max-width:1050px){.kpigrid{grid-template-columns:repeat(2,minmax(0,1fr))}.finder{grid-template-columns:1fr}}
@media(max-width:720px){
  .fstep{grid-template-columns:1fr 64px;gap:4px 10px}
  .fname{grid-column:1 / -1}
  .leadboard{grid-template-columns:1fr}
  .inlinerow{flex-direction:column}
  .head .seg{margin-left:0}
}

/* --- Лид-магниты: обещание крупно, ниже — кому, взамен и платный шаг. */
.magnet{display:flex;flex-direction:column;gap:10px}
.magnet h2{margin:0}
.magnetpromise{margin:0;font-size:15px;line-height:1.45}
.magnetfacts{display:grid;gap:6px;margin:0;font-size:13px}
.magnetfacts div{display:grid;grid-template-columns:70px minmax(0,1fr);gap:8px}
.magnetfacts dt{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.06em;padding-top:2px}
.magnetfacts dd{margin:0}
.magnet .campaignnums{margin-top:auto}
.metric .value.small{font-size:18px;line-height:1.25}

/* Кнопка действия в шапке раздела не переносится по словам. */
.head > .primary{white-space:nowrap;flex:none}

/* Первое сообщение компании и связи кампании с публикацией. */
.pitchset{border:1px solid var(--line);border-radius:12px;padding:6px 14px 14px;margin:18px 0 4px}
.pitchset legend{padding:0 6px;font-size:12px;font-weight:700;color:var(--muted)}
.pitchset .formactions{flex-wrap:wrap;justify-content:flex-start}
.pitchset .formactions button{display:inline-flex;gap:6px;align-items:center}
.pitchlinks{margin-top:8px;font-size:13px;overflow-wrap:anywhere}
.promoted{display:inline-flex;gap:5px;align-items:center;font-size:12px}
.gnode.magnet circle:not(.ghit){fill:var(--g-magnet)}
.glegend.magnet{color:var(--g-magnet)}
:root{--g-magnet:#be185d}
html[data-theme=dark]{--g-magnet:#f472b6}
.pitchset .pitchsent{border-color:var(--gold)}

/* --- На сегодня: список дел, собранный из данных. Просроченное —
   сверху, с красной полосой и словом «просрочено», не только цветом. */
.todaycard{margin:16px 0}
.todaylist{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.todayrow{width:100%;display:grid;grid-template-columns:32px minmax(0,1fr) auto;gap:12px;align-items:center;text-align:left;
  padding:10px 12px;border:1px solid var(--line);border-left:3px solid var(--line);border-radius:10px;background:var(--panel);min-height:52px}
.todayrow:hover{border-color:var(--gold)}
.todayrow.late{border-left-color:#d64545}
.todayicon{display:grid;place-items:center;width:32px;height:32px;border-radius:9px;background:var(--bg);color:var(--muted)}
.todaytext{display:grid;gap:1px;min-width:0}
.todaytext b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.todaytext small{font-size:12px}
.todaywhen{font-size:12px;color:var(--muted);white-space:nowrap}
.todayrow.late .todaywhen{color:#d64545;font-weight:700}
.todayempty{margin:4px 0 0}
.duetoday{color:var(--ink);font-weight:700}
.lcard small svg{vertical-align:-2px}
@media(max-width:720px){.todayrow{grid-template-columns:28px minmax(0,1fr)}.todaywhen{grid-column:2}}

/* Импорт списка компаний и итоги недели. */
.headactions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;flex:none}
.headactions button{display:inline-flex;gap:6px;align-items:center;white-space:nowrap}
.imppreview p{margin:12px 0 6px}
.implist{margin:0;padding-left:18px;display:grid;gap:3px;font-size:13px}
.weekcard{margin:16px 0}
.weektext{margin:0;white-space:pre-wrap;font:inherit;font-size:14px;line-height:1.6;background:var(--bg);border-radius:10px;padding:14px 16px}
.weekcard .head button{display:inline-flex;gap:6px;align-items:center}

/* Причина отказа и «кто отвечает». */
.lostfield[hidden]{display:none}
.ratebar{display:inline-block;vertical-align:middle;width:70px;height:6px;border-radius:99px;background:var(--bg);overflow:hidden;box-shadow:inset 0 0 0 1px var(--line);margin-right:6px}
.ratebar i{display:block;height:100%;background:var(--gold)}
.niches td{white-space:nowrap}
.niches td:first-child{white-space:normal}
.pitchgaps{display:block;margin-top:6px}

/* Строка задачи: высота нажатия уже даёт сама метка (44px) — лишний
   отступ строки делал список вдвое длиннее. */
.row:has(> .task){padding:2px 0}
.task{align-items:center}
/* На телефоне у воронки остаётся только процент — подпись «от прошлого
   шага» ломалась в три строки; смысл понятен из первой строки «вход». */
@media(max-width:720px){
  .fconv small{display:none}
  .fstep:first-child .fconv small{display:inline}
  .fconv{align-self:center}
}

/* --- Ключевые фразы: набор = сегмент. Фразы видны сразу, без открытия
   карточки; минус-фразы — отдельной строкой и со знаком минус, не только
   другим цветом. */
.adtabs{margin:-8px 0 18px}
.kwset{display:flex;flex-direction:column;gap:10px}
.kwset h2{margin:0}
.kwnote{margin:0;font-size:13px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.kwlist{display:flex;flex-wrap:wrap;gap:5px}
.kw{font-size:12px;line-height:1.3;padding:3px 8px;border-radius:7px;background:var(--bg);border:1px solid var(--line);overflow-wrap:anywhere}
.kwlist.minus .kw{color:var(--muted);border-style:dashed}
.kw.more{color:var(--muted);background:transparent}
.kwactions{display:flex;gap:6px;flex-wrap:wrap;margin-top:auto}
.kwactions .chip{display:inline-flex;gap:5px;align-items:center;min-height:36px}

/* Объявления внутри набора фраз. */
.adtexts{display:grid;gap:6px;border-top:1px solid var(--line);padding-top:10px}
.adtextshead{display:flex;justify-content:space-between;align-items:center;gap:8px}
.adtextshead .chip{min-height:36px}
.adtext{border:1px solid var(--line);border-radius:10px;padding:9px 11px;display:grid;gap:4px;background:var(--bg)}
.adtext.off{opacity:.6}
.adtexttop{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}
.adtexttop b{font-size:14px;line-height:1.3}
.adtext p{margin:0;font-size:13px;line-height:1.4}
.adtextbtns{display:flex;flex-wrap:wrap;gap:5px;margin-top:2px}
.adtextbtns .chip{display:inline-flex;gap:4px;align-items:center;min-height:36px;padding:4px 10px;font-size:12px}
.salesfield[hidden]{display:none}

/* Площадки ключевых фраз и второй заголовок Директа. */
.kwplatforms{margin:0 0 12px}
.kwwarn{margin:0;font-size:12px;font-weight:700}
.adtexttop .title2{font-weight:400;color:var(--muted)}

/* --- Навигация ------------------------------------------------------------
   Группы по работе сворачиваются; счётчик у пункта — сколько дел ждёт в
   разделе, красный — если есть просроченное. У свёрнутой группы счётчик
   переезжает на её заголовок, чтобы дела не прятались вместе с пунктами. */
.nav{gap:0}
.navsection{display:grid;gap:2px}
.navsection.solo{margin-bottom:6px}
.nav .navgroup{display:flex;align-items:center;gap:6px;width:100%;background:transparent;border:0;border-radius:8px;
  color:#8a8f98;text-transform:uppercase;letter-spacing:.11em;font-size:10px;font-weight:700;padding:12px 12px 5px;cursor:pointer;text-align:left}
.nav .navgroup:hover{color:#fdfdfd}
.nav .navgroup span{flex:1}
.nav .navgroup svg{transition:transform .18s;opacity:.7}
.navsection.closed .navgroup svg{transform:rotate(-90deg)}
.navsection.closed .navitems{display:none}
.navitems{display:grid;gap:2px}
.nav button[data-page]{position:relative}
.nav button[data-page] span{flex:1}
.navbadge{min-width:20px;height:20px;padding:0 6px;border-radius:99px;background:#2a2a2a;color:#e6e6e6;font-size:11px;font-weight:700;
  display:inline-grid;place-items:center;font-variant-numeric:tabular-nums;line-height:1}
.navbadge.late{background:#d64545;color:#fff}
.navbadge[hidden]{display:none}
.nav .navgroup .navbadge{letter-spacing:0}

/* Нижняя панель — только на телефоне: главные разделы под большим пальцем. */
.tabbar{display:none}
@media(max-width:720px){
  .tabbar{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;z-index:15;
    background:var(--panel);border-top:1px solid var(--line);padding:4px 4px calc(4px + env(safe-area-inset-bottom))}
  .tabbar button{display:grid;justify-items:center;gap:2px;background:transparent;border:0;border-radius:10px;padding:6px 2px;
    color:var(--muted);font-size:11px;min-height:52px;position:relative}
  .tabbar button.active{color:var(--ink)}
  .tabbar button.active i{color:var(--gold)}
  .tabbar i{display:grid;place-items:center;height:22px}
  .tabbar .navbadge{position:absolute;top:2px;left:calc(50% + 6px);min-width:18px;height:18px;font-size:10px}
  .main{padding-bottom:84px}
  #alerts{bottom:calc(76px + env(safe-area-inset-bottom))}
}
/* Воздух между группами меню: заголовок группы — начало нового блока,
   а не продолжение предыдущего. */
.navsection + .navsection{margin-top:6px;padding-top:4px;border-top:1px solid #232323}
.nav .navgroup{padding:10px 12px 6px}
.tabbar span{white-space:nowrap}

/* Логотипы в плашке. Процентная высота в ячейке сетки не работает: у ячейки
   нет своей высоты, и квадратный знак вырастал до натурального размера,
   закрывая подписи. Предел — высота плашки без отступов (150 − 2 × 20). */
.logoplate{overflow:hidden}
.logoplate img{max-width:100%;max-height:110px;width:auto;height:auto;object-fit:contain;display:block}

/* ИИ в рекламе: выбор предложенного и варианты объявлений. */
.aichip{border-color:color-mix(in srgb,var(--gold) 55%,var(--line))}
.adheadbtns{display:flex;gap:6px;flex-wrap:wrap}
.aiwait{display:flex;gap:8px;align-items:center}
.aipick{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:0 14px;max-height:36vh;overflow:auto;margin-bottom:6px}
.aiad{border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin:10px 0;display:grid;gap:4px}
.aiad.warn{border-color:#d64545}
.aiad p{margin:0}
.aiad .chip{justify-self:start;min-height:36px;margin-top:4px}

/* Статистика ВКонтакте по месяцам. Провал — красным и словом в подсказке. */
.vkstats{margin:16px 0}
.vkstats .head button{display:inline-flex;gap:6px;align-items:center;margin-left:auto}
.vktiles{margin:12px 0 18px}
.monthbars .bar{fill:var(--gold)}
.monthbars .lowbar{fill:#d64545;opacity:.75}
.vknotes{margin:10px 0 0;padding-left:18px;display:grid;gap:4px;font-size:13px}

/* ИИ для контента: идеи и план — списком с галочками. */
.netchecks{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:0 12px}
.labelrow{display:flex;justify-content:space-between;align-items:flex-end;gap:8px}
.labelrow .chip{display:inline-flex;gap:5px;align-items:center;min-height:36px;margin-bottom:4px}
.aipostgaps{display:block;margin-top:4px}
.headactions .aichip{display:inline-flex;gap:6px;align-items:center}
.aiplanlist{display:grid;gap:6px;max-height:52vh;overflow:auto;margin:8px 0}
.aiplanrow{display:grid;grid-template-columns:22px minmax(0,1fr);gap:10px;align-items:start;padding:10px 12px;border:1px solid var(--line);border-radius:10px;cursor:pointer;margin:0}
dialog label.aiplanrow{margin:0;color:var(--ink);font-size:13px}
.aiplanrow input{width:18px;height:18px;margin-top:2px;accent-color:var(--gold)}
.aiplanrow span{display:flex;flex-wrap:wrap;gap:4px 6px;align-items:center}
.aiplanrow b{flex-basis:100%;font-size:14px}
.aiplanrow span > small:last-child{flex-basis:100%}

/* Строка с галочкой в окнах (подбор фраз, площадки): галочка слева,
   текст справа — а не поле ввода во всю ширину. */
dialog label.checkitem,.checkitem{display:flex;gap:10px;align-items:flex-start;margin:0;padding:7px 2px;min-height:36px;
  font-size:13px;color:var(--ink);cursor:pointer}
dialog .checkitem input,.checkitem input,dialog .aiplanrow input{width:18px;height:18px;flex:none;margin-top:1px;accent-color:var(--gold)}
.checkitem span{display:inline-flex;gap:5px;align-items:center}

/* На телефоне кнопки шапки раздела переносятся под заголовок, а не
   растягивают страницу вбок. */
@media(max-width:720px){.head{flex-wrap:wrap}.head > .headactions{flex:1 1 100%;justify-content:flex-start}}

/* --- Анкета ---------------------------------------------------------------
   Вариант — крупная плашка под палец; отмеченный подсвечен золотом и
   галочкой, а не только цветом. Поле уточнения появляется у отмеченного. */
.surveyprogress{display:grid;gap:10px;margin-bottom:8px;position:sticky;top:var(--topbar-h,68px);z-index:5}
.sprow{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;align-items:baseline}
.sblock{margin-top:8px}
.sqlist{display:grid;gap:12px}
.sq{display:grid;gap:8px;border-left:3px solid var(--line)}
.sq.answered{border-left-color:var(--gold)}
.sq h3{margin:0;font-size:16px;line-height:1.4}
.sqhead{display:flex;gap:8px;align-items:center}
.sqnum{font-size:12px;font-weight:700;color:var(--muted);font-variant-numeric:tabular-nums}
.sqstar{font-size:11px;font-weight:700;color:var(--gold);border:1px solid color-mix(in srgb,var(--gold) 50%,var(--line));border-radius:99px;padding:1px 8px}
.sqsaved{margin-left:auto;font-size:12px}
.sqhint{margin:0;font-size:13px}
.sqopts{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:8px}
.sqopt{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0;padding:10px 12px;min-height:44px;border:1px solid var(--line);
  border-radius:10px;cursor:pointer;background:var(--bg);font-size:14px;line-height:1.35;transition:border-color .12s,background .12s}
.sqopt:hover{border-color:var(--gold)}
.sqopt input[type=checkbox]{width:20px;height:20px;flex:none;accent-color:var(--gold);margin:0}
.sqopt span{flex:1;min-width:0}
.sqopt:has(input[type=checkbox]:checked){border-color:var(--gold);background:color-mix(in srgb,var(--gold) 12%,var(--panel))}
.sqmore{display:none;flex-basis:100%;width:100%;padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--ink);font:inherit}
.sqopt:has(input[type=checkbox]:checked) .sqmore{display:block}
.sqfreelabel{font-size:12px;color:var(--muted);margin:2px 0 -4px}
.sqfree,.sqother{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink);font:inherit;min-height:44px}
.sqfree{resize:vertical}
@media(max-width:720px){.sqopts{grid-template-columns:1fr}.surveyprogress{top:0}}
.sqopt input[type=checkbox]{align-self:center;position:relative;top:0}
.sqopt > span{align-self:center}

/* План развития: готовое приглушено, ближайшее подсвечено золотом. */
.timeline .roadstage.done{border-left-color:var(--line);opacity:.8}
.timeline .roadstage.next{border-left-color:var(--gold)}

/* --- Диалоги --------------------------------------------------------------
   Список слева, переписка справа; на телефоне — по очереди. Высота — по окну:
   прокручиваются список и сообщения, а не вся страница. Свои сообщения —
   золотом, ответы бота — пунктиром: видно, где писал человек. */
.dialogs{display:grid;grid-template-columns:minmax(250px,340px) minmax(0,1fr);gap:16px;
  height:max(460px,calc(100dvh - var(--dlg-top,220px) - 24px))}
.dlglist{display:flex;flex-direction:column;gap:10px;padding:14px;min-height:0}
.dlglist .filters{gap:6px}
.dlgitems{flex:1;overflow:auto;display:grid;align-content:start;gap:2px;margin:0 -6px;padding:0 6px}
.dlgitem{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:10px;align-items:center;text-align:left;width:100%;
  padding:10px;border:1px solid transparent;border-radius:10px;background:transparent;color:var(--ink)}
.dlgitem:hover{border-color:var(--line);background:var(--bg)}
.dlgitem.on{border-color:var(--gold);background:var(--gold-bg)}
.dlgch{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--bg);color:var(--muted)}
.dlgtext{min-width:0;display:grid;line-height:1.35}
.dlgtext b,.dlgtext small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dlgtext small i{font-style:normal}
.dlgitem.unread .dlgtext small{color:var(--ink)}
.dlgmeta{display:grid;justify-items:end;gap:4px}
.dlgmeta small{font-size:11px;white-space:nowrap}
.dlgun{min-width:20px;height:20px;padding:0 6px;border-radius:99px;background:var(--gold);color:var(--ink-on-gold);font-size:11px;display:grid;place-items:center}
.dlgwaiting{width:9px;height:9px;border-radius:50%;background:var(--gold)}
.dlgchat{display:flex;flex-direction:column;padding:0;min-height:0;overflow:hidden}
.dlgnone{align-items:center;justify-content:center}
.dlghead{display:flex;gap:12px;align-items:center;padding:12px 16px;border-bottom:1px solid var(--line)}
.dlgwho{flex:1;min-width:0;display:grid;line-height:1.35}
.dlgwho b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dlgwho small{display:flex;gap:5px;align-items:center;white-space:nowrap;overflow:hidden}
.dlgtools{display:flex;gap:6px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.dlgtools .tag{margin:0}
.dlgtools .chip{display:inline-flex;gap:5px;align-items:center}
.dlgback{display:none}
.dlgmsgs{flex:1;overflow:auto;padding:16px;display:flex;flex-direction:column;gap:8px;background:var(--bg)}
.dlgwait{margin:auto;text-align:center}
.dlgday{text-align:center;margin:8px 0 2px}
.dlgday span{font-size:11px;color:var(--muted);background:var(--panel);border:1px solid var(--line);border-radius:99px;padding:2px 10px}
.bubble{max-width:min(560px,82%);padding:9px 12px;border-radius:14px 14px 14px 4px;background:var(--panel);border:1px solid var(--line);align-self:flex-start;line-height:1.45}
.bubble p{margin:0;white-space:pre-wrap;overflow-wrap:anywhere}
.bubble small{display:block;margin-top:3px;font-size:11px}
.bubble .ic{vertical-align:-2px}
.bubble.out{align-self:flex-end;border-radius:14px 14px 4px 14px;background:var(--gold-bg);border-color:color-mix(in srgb,var(--gold) 40%,var(--line))}
.bubble.out small{text-align:right}
.bubble.out.auto{background:var(--panel);border-style:dashed;border-color:var(--line)}
.bubble.tap{background:transparent;border-style:dashed;font-size:13px}
.bubble.tap p{color:var(--muted)}
.briefmsg{align-self:stretch;max-width:none;border-color:var(--gold);border-radius:12px}
.briefmsg > b{display:flex;gap:6px;align-items:center}
.briefmsg .netfacts{margin:8px 0}
.dlgform{border-top:1px solid var(--line);padding:10px 16px 12px;display:grid;gap:8px}
.dlgquick{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px;scrollbar-width:thin}
.dlgquick .chip{white-space:nowrap;flex:none;display:inline-flex;gap:5px;align-items:center}
.dlgcompose{display:flex;gap:8px;align-items:flex-end}
.dlgcompose textarea{flex:1;min-width:0;min-height:46px;max-height:200px;resize:vertical;padding:11px 12px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink);font:inherit}
.dlgcompose textarea:focus{border-color:var(--gold);outline:none}
.dlgcompose .primary{display:inline-flex;gap:6px;align-items:center;min-height:46px}
.dlghint{font-size:12px}
.dlgempty{max-width:680px;text-align:left}
.dlgempty h2{margin-bottom:8px}

/* окна «Скрипты», «Тексты бота», «Каналы» */
.scriptpick,.scriptlist{display:grid;gap:6px;margin-bottom:6px}
.scriptitem{display:grid;gap:3px;text-align:left;width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink)}
.scriptitem:hover{border-color:var(--gold)}
.scriptitem small,.scriptrow small{display:block;line-height:1.4}
.scriptitem .tag{justify-self:start}
.scriptrow{display:flex;gap:12px;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid var(--line)}
.scriptrow > div{min-width:0}
.scriptrow .chip{flex:none}
dialog label.checkrow{display:flex;gap:10px;align-items:flex-start;color:var(--ink);font-size:14px;cursor:pointer}
dialog label.checkrow input{width:18px;height:18px;flex:none;margin:2px 0 0;accent-color:var(--gold)}
.channelcard{border:1px solid var(--line);border-radius:12px;padding:14px 16px;margin-top:12px}
.channelcard h3{display:flex;gap:8px;align-items:center}
.channelcard .inlinerow{margin-top:8px}
.channelcard code,.steps code{background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:1px 6px;font-size:13px}
.steps{margin:6px 0;padding-left:20px}
.steps li{margin:4px 0}
.btnlink{display:inline-flex;gap:6px;align-items:center;padding:10px 15px;border-radius:9px;background:var(--gold);color:var(--ink-on-gold) !important;font-weight:600;text-decoration:none}

@media(max-width:900px){
  .dialogs{grid-template-columns:minmax(0,1fr)}
  .dialogs.open .dlglist,.dialogs:not(.open) .dlgchat{display:none}
  #view:has(.dialogs.open) > .head{display:none}
  .dlgback{display:grid;place-items:center;flex:none}
  .dlgtools .tag{display:none}
}
@media(max-width:720px){
  /* снизу — нижняя панель разделов */
  .dialogs{height:max(360px,calc(100dvh - var(--dlg-top,160px) - 84px - env(safe-area-inset-bottom)))}
  .dlgtools .chip span{display:none}
  .briefmsg .netfacts{grid-template-columns:1fr 1fr}
  .dlghead{padding:10px 12px;gap:8px}
  .dlgmsgs{padding:12px}
  .dlgform{padding:8px 12px 10px}
  .dlgcompose .primary span{display:none}
  .dlgcompose .primary{width:46px;justify-content:center;padding:0}
  .bubble{max-width:88%}
  .dlghint{display:none}
}

/* Поле ключа: символы скрыты, но браузер не принимает его за пароль от
   приложения и не подставляет туда сохранённый пароль. */
.secretfield{-webkit-text-security:disc;text-security:disc;font-family:monospace}
.secretfield::placeholder{font-family:var(--font-ui)}

/* --- Брифы и КП -----------------------------------------------------------
   Цепочка шагов наверху, вкладки рабочей области, смета таблицей с полями.
   КП — документ: на экране превью, при печати — A4 без интерфейса. */
.bfchain{display:flex;flex-wrap:wrap;gap:6px;list-style:none;padding:0;margin:0 0 18px}
.bfchain li{display:flex;gap:8px;align-items:center;padding:6px 12px 6px 6px;border:1px solid var(--line);border-radius:99px;background:var(--panel);font-size:13px}
.bfchain li b{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:var(--gold-bg);color:var(--ink);font-size:12px}
.bfcard h2{margin:8px 0 10px}
.bfcard .late{color:var(--bad,#d64545)}
.bfdots{display:flex;gap:4px;margin-bottom:10px}
.bfdots i{flex:1;height:4px;border-radius:2px;background:var(--line)}
.bfdots i.on{background:var(--gold)}
.bfhead .linkbtn{display:inline-flex;gap:6px;align-items:center}
.bfstages{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.bfnext{max-width:760px}
.bftabs{margin:16px 0}
.bftabs .navbadge{position:static;display:inline-grid;margin-left:4px;vertical-align:1px}
.bftabs small{margin-left:4px}
.bftext{width:100%;min-height:340px;resize:vertical;font:inherit;line-height:1.5}
.bflist{margin:0;padding-left:18px}
.bflist li{margin:4px 0}
.bfqs{margin:10px 0;padding-left:22px;display:grid;gap:12px}
.bfq{display:grid;gap:6px}
.bfqrow{display:flex;gap:8px;align-items:center}
.bfqrow .input{flex:1;min-width:0}
.bfq.done .bfqrow .input{opacity:.75}
.bfq textarea{width:100%;resize:vertical}
.bftable td{vertical-align:middle;padding:6px}
.bftable .input{width:100%;min-width:0;padding:7px 9px}
.bftable td:first-child{min-width:220px}
.bftable select.input{min-width:150px}
.bfnum{width:84px}
.bfsum{white-space:nowrap;font-variant-numeric:tabular-nums}
.bfgroup th{background:var(--bg);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.bfset{max-width:560px;margin-top:10px}
.bftotal{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:baseline;padding:12px 0;border-top:1px solid var(--line)}
.bftotal b{font-size:20px;font-variant-numeric:tabular-nums}
.bfplan{margin:10px 0;padding-left:22px;display:grid;gap:12px}
.bfplan li{display:grid;gap:6px}
.bfplanrow{display:flex;gap:8px;align-items:center}
.bfplanrow .input:first-child{flex:1;min-width:0}
.bfdays{width:76px}
.bfdates{white-space:nowrap;min-width:110px}
.bftalk{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.bfstep.now{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold)}
.bfstep.past{opacity:.7}
.bfmsg{white-space:pre-wrap;font:inherit;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin:8px 0;overflow-wrap:anywhere}
.bfkp{align-items:start}
.bfkp textarea{width:100%;resize:vertical}
.kppreview{padding:0;overflow:hidden}
.kpdoc{background:#fff;color:#141414;padding:28px 30px;font-size:13px;line-height:1.5}
.kpdoc h1,.kpdoc h2{font-family:var(--font-display);color:#141414}
.kptop{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-bottom:14px;border-bottom:3px solid #f6bd3a}
.kptop img{height:30px}
.kptop div{display:grid;text-align:right}
.kptop span{color:#5c5c5c;font-size:12px}
.kptitle{font-size:24px;margin:18px 0 4px;letter-spacing:-.01em}
.kpfor{margin:0 0 6px;color:#5c5c5c}
.kpdoc section{margin-top:16px;break-inside:avoid}
.kpdoc h2{font-size:15px;margin:0 0 6px;text-transform:uppercase;letter-spacing:.06em}
.kpdoc ul{margin:0;padding-left:18px}
.kpdoc li{margin:3px 0}
.kptable{width:100%;border-collapse:collapse}
.kptable td{padding:8px 0;border-bottom:1px solid #e5e5e5;vertical-align:top}
.kptable small{color:#5c5c5c}
.kpprice{text-align:right;white-space:nowrap;font-weight:700;padding-left:16px !important}
.kpfoot{display:grid;gap:2px;margin-top:22px;padding-top:12px;border-top:1px solid #e5e5e5}
.kpfoot small{color:#5c5c5c}
#kpprint{display:none}
@page kp{size:A4 portrait;margin:14mm 12mm}
@media print{
  body.printkp > *:not(#kpprint){display:none !important}
  body.printkp #kpprint{display:block}
  body.printkp{background:#fff}
  #kpprint .kpdoc{page:kp;padding:0;-webkit-print-color-adjust:exact;print-color-adjust:exact}
}
@media(max-width:900px){.bftalk{grid-template-columns:1fr}.bfkp{grid-template-columns:1fr}}
@media(max-width:720px){
  .bftable thead{display:none}
  .bftable tr{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:8px 0;border-bottom:1px solid var(--line)}
  .bftable td{padding:0;border:0}
  .bftable td:first-child{grid-column:1/-1;min-width:0}
  .bftable .bfgroup th{display:block}
  .bfnum{width:auto}
  .bfplanrow{flex-wrap:wrap}
  .kpdoc{padding:18px}
}
.bfnext{display:grid;grid-template-columns:minmax(0,1fr) 180px;gap:0 14px;max-width:760px;margin-bottom:4px}
.bfnext label{display:block;font-size:12px;color:var(--muted);margin:0 0 4px}
.bfnext .input{width:100%}
@media(max-width:720px){.bfnext{grid-template-columns:1fr}}

.dlgaway{font-size:11px;color:var(--muted);border:1px dashed var(--line);border-radius:99px;padding:0 6px;white-space:nowrap}
.todaycard .linkbtn{display:inline-flex;gap:6px;align-items:center;min-height:40px}

/* ==========================================================================
   НАВИГАЦИЯ 2.0 — «пульт студии»
   У каждой группы свой цвет из брендбука (цвета направлений): золото —
   продажи, красный — реклама, фиолетовый — контент, зелёный — аналитика,
   голубой — компания, серый — система. Цвет живёт в плитке иконки,
   подсветке активного пункта и в метке группы над заголовком раздела.
   Меню сворачивается в полосу иконок; профиль внизу — с кнопками-иконками.
   ========================================================================== */
:root{--tone-gold:#f6bd3a;--tone-red:#ef4444;--tone-violet:#8b5cf6;--tone-green:#22c55e;--tone-sky:#38bdf8;--tone-gray:#9ca3af}
.tone-gold{--acc:var(--tone-gold)}.tone-red{--acc:var(--tone-red)}.tone-violet{--acc:var(--tone-violet)}
.tone-green{--acc:var(--tone-green)}.tone-sky{--acc:var(--tone-sky)}.tone-gray{--acc:var(--tone-gray)}

.sidebar{width:268px;padding:16px 12px 14px;gap:10px;background:#0e0e0f;
  background-image:radial-gradient(120% 40% at 0% 0%,rgba(246,189,58,.08),transparent 60%)}
html:not([data-theme=dark]) .sidebar{background-color:#121213}
.sidebar .brand{padding:2px 4px 6px;gap:10px}
.sidebar .brand>div:not(.brandmark){flex:1;min-width:0}
.railbtn{width:30px;height:30px;padding:0;display:grid;place-items:center;border-radius:9px;background:transparent;border:1px solid #2a2a2c;color:#8f8f94;transition:transform .2s}
.railbtn:hover{color:#fff;border-color:#3a3a3e;background:#1b1b1d}
.navsearch{display:flex;align-items:center;gap:9px;width:100%;padding:9px 11px;border-radius:11px;background:#18181a;border:1px solid #262628;color:#8f8f94;font-size:13px;text-align:left}
.navsearch span{flex:1}
.navsearch kbd{font:600 10px/1 var(--font-ui);color:#77777c;border:1px solid #2f2f32;border-radius:6px;padding:3px 5px}
.navsearch:hover{color:#e8e8ea;border-color:#3a3a3e}

.nav{gap:2px;padding-right:2px}
.navsection{gap:1px}
.navsection + .navsection{margin-top:4px;padding-top:6px;border-top:1px solid #1d1d20}
.nav .navgroup{text-transform:none;letter-spacing:0;font-size:12px;font-weight:600;color:#8a8a90;padding:8px 10px 6px;gap:8px}
.nav .navgroup .navdot{width:7px;height:7px;border-radius:50%;background:var(--acc);box-shadow:0 0 0 3px color-mix(in srgb,var(--acc) 18%,transparent);flex:none}
.nav button[data-page]{position:relative;padding:5px 8px;gap:10px;border-radius:11px;color:#c4c4c9;border:0}
.nav button[data-page] .navtile{width:30px;height:30px;flex:none;display:grid;place-items:center;border-radius:9px;
  background:color-mix(in srgb,var(--acc) 13%,transparent);color:var(--acc)}
.nav button[data-page]:hover{background:#19191b;color:#fff}
.nav button[data-page]:hover .navtile{background:color-mix(in srgb,var(--acc) 22%,transparent)}
.nav button[data-page].active{color:#fff;box-shadow:none;
  background:linear-gradient(90deg,color-mix(in srgb,var(--acc) 22%,transparent),color-mix(in srgb,var(--acc) 4%,transparent) 85%)}
.nav button[data-page].active::before{content:'';position:absolute;left:-12px;top:8px;bottom:8px;width:3px;border-radius:0 3px 3px 0;background:var(--acc)}
.nav button[data-page].active .navtile{background:var(--acc);color:#141414}
.nav button[data-page] .navbadge{background:color-mix(in srgb,var(--acc) 26%,#1b1b1d);color:#fff}
.nav button[data-page] .navbadge.late{background:#d64545}

.sidebar .bottom{border-top:1px solid #1d1d20;padding:12px 4px 0;display:grid;gap:10px}
.sidebar .bottom .user{margin:0;gap:10px;min-width:0}
.sidebar .bottom .who{display:grid;min-width:0}
.sidebar .bottom .who b,.sidebar .bottom .who small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.useracts{display:flex;gap:6px}
.useracts .sbact{flex:1;height:36px;padding:0;display:grid;place-items:center;border-radius:10px;background:#18181a;border:1px solid #262628;color:#a3a3a8;width:auto}
.useracts .sbact:hover{color:#fff;border-color:#3a3a3e;background:#1f1f22}
.useracts .sbact.active{color:var(--gold);border-color:color-mix(in srgb,var(--gold) 40%,#262628)}
.useracts .sbact.out:hover{color:#ff8a8a;border-color:#5a2a2a;background:#2a1414}

/* свёрнутое меню — полоса иконок (только на компьютере) */
@media(min-width:721px){
  body.rail .sidebar{width:76px;padding-left:10px;padding-right:10px}
  body.rail .sidebar .brand{flex-direction:column;padding:2px 0 6px}
  body.rail .sidebar .brand>div:not(.brandmark),body.rail .navsearch span,body.rail .navsearch kbd,
  body.rail .nav button[data-page] span,body.rail .nav .navgroup span,body.rail .nav .navgroup svg,
  body.rail .nav .navgroup .navbadge,body.rail .sidebar .bottom .who{display:none}
  body.rail .railbtn{transform:rotate(180deg)}
  body.rail .navsearch{justify-content:center;padding:9px 0}
  body.rail .nav .navgroup{justify-content:center;padding:8px 0 4px}
  body.rail .nav button[data-page]{justify-content:center;padding:5px 0}
  body.rail .nav button[data-page] .navbadge{position:absolute;top:0;right:2px;min-width:17px;height:17px;font-size:10px;padding:0 4px}
  body.rail .nav button[data-page].active::before{left:-10px}
  body.rail .sidebar .bottom .user{justify-content:center}
  body.rail .useracts{flex-direction:column}
  body.rail .main{margin-left:76px;width:calc(100% - 76px)}
}
@media(min-width:1680px){body.rail .main{margin-left:max(76px,calc((100vw - 1360px) / 2))}}
@media(min-width:721px) and (max-width:1050px){.sidebar{width:236px}.main{margin-left:236px;width:calc(100% - 236px)}}

/* метка группы над заголовком раздела — вместо одинакового «ADERVIS DIGITAL» */
.pagehead .pagegroup{display:inline-flex;align-items:center;gap:6px;padding:4px 11px 4px 7px;margin-bottom:10px;border-radius:99px;
  font-size:12px;font-weight:600;background:color-mix(in srgb,var(--acc) 14%,transparent);color:color-mix(in srgb,var(--acc) 72%,var(--ink))}
html[data-theme=dark] .pagehead .pagegroup{color:var(--acc)}

/* кнопки-иконки: корзина в строке, на карточке, крестик в поиске и уведомлении */
.rowacts{width:46px;text-align:right;padding-right:6px !important}
.rowact,.cardx{width:34px;height:34px;padding:0;display:inline-grid;place-items:center;border-radius:9px;background:transparent;border:1px solid transparent;color:var(--muted);opacity:0;transition:opacity .12s,color .12s,background .12s}
tr:hover .rowact,tr:focus-within .rowact,.rowact:focus-visible,.bfcard:hover .cardx,.bfcard:focus-within .cardx,.cardx:focus-visible{opacity:1}
.rowact:hover,.cardx:hover{color:#ef4444;background:color-mix(in srgb,#ef4444 12%,transparent);border-color:color-mix(in srgb,#ef4444 30%,transparent)}
@media(hover:none){.rowact,.cardx{opacity:1}}
.bfcard{position:relative}
.cardx{position:absolute;top:12px;right:12px}
.searchwrap{position:relative;display:flex;align-items:center;flex:1;min-width:0}
.searchwrap > svg{position:absolute;left:12px;color:var(--muted);pointer-events:none}
.searchwrap > .input{width:100%;padding-left:38px;padding-right:38px}
.searchx{position:absolute;right:5px;width:30px;height:30px;padding:0;display:grid;place-items:center;border-radius:8px;border:0;background:transparent;color:var(--muted)}
.searchx:hover{color:var(--ink);background:var(--bg)}
.searchx[hidden]{display:none}
#alerts:not(:empty){display:flex;align-items:center;gap:10px;padding-right:8px}
.toastx{width:28px;height:28px;padding:0;display:grid;place-items:center;border-radius:8px;border:0;background:transparent;color:inherit;opacity:.65}
.toastx:hover{opacity:1;background:rgba(127,127,127,.18)}
button.danger{display:inline-flex;align-items:center;gap:7px}
@media(max-width:720px){.tabbar button.active i{color:var(--acc)}}
.nav .navgroup .navdot{font-style:normal}
.rowact,.cardx{width:36px;height:36px}
@media(max-width:720px){.rowacts{display:none}}
@media(min-width:721px){#menu{display:none}
  body.rail .useracts .sbact{flex:none;width:100%;height:36px}}

/* --- Главная 2.0: приветствие, быстрые действия, цветные карточки ------- */
.eyebrow{text-transform:none;letter-spacing:0;font-size:12px;font-weight:600}
.homehero .herodate{margin:0 0 6px;color:var(--gold);font-size:13px;font-weight:600}
.homehero .herodate::first-letter{text-transform:uppercase}
.homehero h1{margin-bottom:6px}
.heroactions{display:flex;gap:8px;flex-wrap:wrap}
.heroactions button{display:inline-flex;align-items:center;gap:7px}
.ghostbtn{background:rgba(255,255,255,.06);color:#fdfdfd;border:1px solid rgba(255,255,255,.18)}
.ghostbtn:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.3)}
.quickacts{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin:16px 0 4px}
.quickact{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:var(--panel);border:1px solid var(--line);color:var(--ink);text-align:left;font-weight:600;min-height:52px}
.quickact i{width:32px;height:32px;flex:none;display:grid;place-items:center;border-radius:9px;background:color-mix(in srgb,var(--acc) 15%,transparent);color:color-mix(in srgb,var(--acc) 80%,var(--ink))}
html[data-theme=dark] .quickact i{color:var(--acc)}
.quickact:hover{border-color:color-mix(in srgb,var(--acc) 55%,var(--line))}
.quickact:hover i,html[data-theme=dark] .quickact:hover i{background:var(--acc);color:#141414}
.metric .metrichead{display:flex;align-items:center;gap:10px;color:var(--muted)}
.metric .metrichead .mlabel{flex:1;font-size:13px;font-weight:600;color:var(--ink)}
.metric .metrichead > svg{opacity:.45;transition:opacity .15s}
.metric:hover .metrichead > svg{opacity:1}
.metric .mtile{width:32px;height:32px;flex:none;display:grid;place-items:center;border-radius:9px;background:color-mix(in srgb,var(--acc) 15%,transparent);color:color-mix(in srgb,var(--acc) 80%,var(--ink))}
html[data-theme=dark] .metric .mtile{color:var(--acc)}
.metric.click:hover{border-color:color-mix(in srgb,var(--acc) 55%,var(--line))}
.todayli{display:flex;gap:6px;align-items:stretch}
.todayli .todayrow{flex:1;min-width:0}
.todayli .todayicon{background:color-mix(in srgb,var(--acc) 15%,transparent);color:color-mix(in srgb,var(--acc) 80%,var(--ink))}
html[data-theme=dark] .todayli .todayicon{color:var(--acc)}
.todaysnooze{width:44px;flex:none;padding:0;display:grid;place-items:center;border-radius:10px;background:var(--panel);border:1px solid var(--line);color:var(--muted)}
.todaysnooze:hover{color:var(--ink);border-color:var(--gold)}
@media(max-width:1180px){.quickacts{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:720px){.quickacts{grid-template-columns:repeat(2,minmax(0,1fr))}}
.hero .heroactions .ghostbtn{background:rgba(255,255,255,.07);color:#fdfdfd;border:1px solid rgba(255,255,255,.2);box-shadow:none}
.hero .heroactions .ghostbtn:hover{background:rgba(255,255,255,.14);border-color:var(--gold)}
.metric .metrichead > svg{flex:none}
.metric .metrichead .mlabel{min-width:0;line-height:1.3}

/* ==========================================================================
   ОБЛИК 2026 — глубина, фактура, фирменный знак
   Фон — тонкая точечная сетка, как монтажный стол; панели с подсветкой
   верхнего края и мягкой тенью; верхняя панель — матовое стекло. Главный
   экран открывает крупный золотой шеврон ADERVIS — узнаваемый знак студии.
   ========================================================================== */
html[data-theme=dark]{--bg:#09090a;--panel:#131315;--line:rgba(255,255,255,.075);--muted:#8f8f97;--ink:#f4f4f5;
  --lift:0 1px 0 rgba(255,255,255,.05) inset,0 18px 40px -28px rgba(0,0,0,.9)}
html:not([data-theme=dark]){--bg:#eceef2;--panel:#fff;--line:rgba(16,18,24,.08);--muted:#5b616d;--ink:#121318;
  --lift:0 1px 2px rgba(16,18,24,.05),0 16px 36px -24px rgba(16,18,24,.28)}
body{background-color:var(--bg);background-image:radial-gradient(color-mix(in srgb,var(--ink) 9%,transparent) 1px,transparent 1.2px);background-size:24px 24px}
.card{border-radius:18px;box-shadow:var(--lift)}
.click{transition:transform .18s ease,border-color .18s,box-shadow .18s}
.click:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--acc,var(--gold)) 50%,var(--line));
  box-shadow:var(--lift),0 0 0 4px color-mix(in srgb,var(--acc,var(--gold)) 10%,transparent)}
.topbar{background:color-mix(in srgb,var(--bg) 72%,transparent);-webkit-backdrop-filter:blur(16px) saturate(1.4);backdrop-filter:blur(16px) saturate(1.4);
  border-bottom:1px solid var(--line);margin-left:-34px;margin-right:-34px;padding-left:34px;padding-right:34px}
@media(max-width:1050px){.topbar{margin-left:-22px;margin-right:-22px;padding-left:22px;padding-right:22px}}
@media(max-width:720px){.topbar{margin-left:-16px;margin-right:-16px;padding-left:16px;padding-right:16px}}
h1{letter-spacing:-.01em}

/* главный экран: командный центр с шевроном */
.cmd{position:relative;overflow:hidden;display:flex;align-items:flex-end;justify-content:space-between;gap:24px;
  padding:34px 34px 30px;border-radius:24px;color:#fdfdfd;isolation:isolate;
  background:radial-gradient(90% 140% at 100% 0%,rgba(246,189,58,.22),transparent 55%),
             radial-gradient(60% 120% at 0% 100%,rgba(139,92,246,.14),transparent 60%),#0f0f10;
  border:1px solid rgba(246,189,58,.22);box-shadow:0 30px 60px -40px rgba(246,189,58,.45)}
.cmdmark{position:absolute;right:-40px;top:-70px;width:340px;height:auto;opacity:.16;z-index:-1;filter:drop-shadow(0 0 40px rgba(246,189,58,.6));pointer-events:none}
.cmdmain{min-width:0}
.cmddate{display:inline-flex;align-items:center;gap:7px;padding:5px 11px;border-radius:99px;font-size:13px;font-weight:600;color:var(--gold);
  background:rgba(246,189,58,.1);border:1px solid rgba(246,189,58,.25)}
.cmddate::first-letter{text-transform:uppercase}
.cmd h1{font-size:clamp(30px,3.6vw,46px);line-height:1.05;margin:14px 0 10px;color:#fff}
.cmd p{margin:0;color:#c8c8cd;max-width:560px}
.cmdchips{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.cmdchip{display:inline-flex;align-items:baseline;gap:6px;padding:6px 12px;border-radius:12px;font-size:13px;color:#e6e6ea;
  background:color-mix(in srgb,var(--acc) 14%,rgba(255,255,255,.03));border:1px solid color-mix(in srgb,var(--acc) 35%,transparent)}
.cmdchip b{font-family:var(--font-display);font-size:18px;color:var(--acc)}
.cmdacts{flex:none}
@media(max-width:720px){.cmd{flex-direction:column;align-items:stretch;padding:24px 20px}.cmdmark{width:220px;right:-50px;top:-40px}}

/* быстрые действия — тактильные кнопки */
.quickact{min-height:58px;border-radius:14px;box-shadow:var(--lift);position:relative}
.quickact > svg:last-child{margin-left:auto;opacity:0;color:var(--acc);transition:opacity .15s}
.quickact:hover > svg:last-child{opacity:1}
.quickact:hover{background:color-mix(in srgb,var(--acc) 7%,var(--panel))}

/* «Пульс» — одна панель с крупными цифрами вместо четырёх одинаковых карточек */
.pulse{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding:0;margin:16px 0;overflow:hidden}
.pulse .metric{display:grid;align-content:start;gap:4px;text-align:left;padding:20px 22px 22px;border:0;border-radius:0;background:transparent;box-shadow:none;color:var(--ink);
  border-left:1px solid var(--line);position:relative}
.pulse .metric:first-child{border-left:0}
.pulse .metric::after{content:'';position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--acc);opacity:0;transition:opacity .18s}
.pulse .metric:hover{transform:none;box-shadow:none;background:color-mix(in srgb,var(--acc) 6%,transparent)}
.pulse .metric:hover::after{opacity:1}
.pulse .metric .value{font-family:var(--font-display);font-size:clamp(28px,2.8vw,40px);margin:12px 0 2px}
@media(max-width:1050px){.pulse{grid-template-columns:repeat(2,minmax(0,1fr))}.pulse .metric:nth-child(3){border-left:0}
  .pulse .metric:nth-child(n+3){border-top:1px solid var(--line)}}
@media(max-width:520px){.pulse{grid-template-columns:1fr}.pulse .metric{border-left:0}.pulse .metric + .metric{border-top:1px solid var(--line)}}

/* «На сегодня» — лента дня: цветная полоса раздела и метка времени */
.todaycard{border-radius:20px}
.todayli .todayrow{border-left:3px solid var(--acc);border-radius:12px;background:color-mix(in srgb,var(--acc) 4%,var(--panel))}
.todayli .todayrow.late{border-left-color:#ef4444;background:color-mix(in srgb,#ef4444 6%,var(--panel))}
.todaywhen{padding:3px 9px;border-radius:99px;font-size:12px;font-weight:600;background:color-mix(in srgb,var(--acc) 14%,transparent);color:color-mix(in srgb,var(--acc) 80%,var(--ink))}
.todayrow.late .todaywhen{background:color-mix(in srgb,#ef4444 15%,transparent);color:#ef4444}
html[data-theme=dark] .todaywhen{color:var(--acc)}
html[data-theme=dark] .todayrow.late .todaywhen{color:#ff7b7b}
@media(min-width:1051px){body:not(.rail) .main{margin-left:268px;width:calc(100% - 268px)}}
@media(min-width:1680px){body:not(.rail) .main{margin-left:max(268px,calc((100vw - 1360px) / 2))}}
.cmd::before{content:"";position:absolute;right:-40px;top:-70px;width:340px;height:340px;z-index:-1;pointer-events:none;opacity:.16;
  background:url(brand/icon.svg) center/contain no-repeat;filter:drop-shadow(0 0 40px rgba(246,189,58,.6))}
@media(max-width:720px){.cmd::before{width:220px;height:220px;right:-50px;top:-40px}}
/* ряды цифр во всех разделах — одной панелью с тонкими разделителями */
.grid.metrics{gap:1px;background:var(--line);border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:var(--lift)}
.grid.metrics > .card{border:0;border-radius:0;box-shadow:none;background:var(--panel)}
.grid.metrics > .card.click:hover{transform:none;box-shadow:none;background:color-mix(in srgb,var(--acc,var(--gold)) 6%,var(--panel))}
.grid.metrics .value{font-family:var(--font-display)}

/* --- Доска заявок: цветные столбцы, перетаскивание ---------------------- */
.leadboard .boardcol{background:color-mix(in srgb,var(--acc) 5%,var(--bg));border:1px solid var(--line);border-top:3px solid var(--acc);border-radius:16px;padding:10px;gap:10px;transition:background .15s,border-color .15s}
.leadboard .boardcol header{gap:8px;justify-content:flex-start;flex-wrap:wrap}
.leadboard .boardcol header b{font-size:14px}
.leadboard .coldot{width:8px;height:8px;border-radius:50%;background:var(--acc);box-shadow:0 0 0 3px color-mix(in srgb,var(--acc) 20%,transparent)}
.leadboard .colcount{font-size:12px;font-weight:700;padding:1px 8px;border-radius:99px;background:color-mix(in srgb,var(--acc) 18%,transparent);color:color-mix(in srgb,var(--acc) 75%,var(--ink))}
html[data-theme=dark] .leadboard .colcount{color:var(--acc)}
.leadboard .colsum{margin-left:auto;font-size:12px;font-weight:600;color:var(--muted);font-variant-numeric:tabular-nums}
.leadboard .boardcol.over{background:color-mix(in srgb,var(--acc) 14%,var(--bg));border-color:var(--acc);border-style:dashed;border-top-style:solid}
.leadboard .boardempty{border:1px dashed var(--line);border-radius:12px;padding:16px 8px;text-align:center;font-size:12px}
.leadboard .lcard{position:relative;border-left:0;border-radius:14px;padding:12px 12px 10px;gap:8px;cursor:grab}
.leadboard .lcard:active{cursor:grabbing}
.leadboard .lcard.dragging{opacity:.4;transform:rotate(1.5deg)}
.leadboard .lcard .cardx{top:8px;right:8px;width:30px;height:30px}
.leadboard .lcard:hover .cardx,.leadboard .lcard:focus-within .cardx{opacity:1}
.lhead{display:flex;gap:10px;align-items:center;padding-right:28px;min-width:0}
.lhead > div{min-width:0;display:grid}
.lhead h3{margin:0;font-size:14px;line-height:1.25;overflow-wrap:anywhere}
.lavatar{width:34px;height:34px;flex:none;border-radius:11px;display:grid;place-items:center;font-size:12px;font-weight:700;
  background:color-mix(in srgb,var(--acc) 18%,var(--panel));color:color-mix(in srgb,var(--acc) 80%,var(--ink))}
html[data-theme=dark] .lavatar{color:var(--acc)}
.lnext{display:inline-flex;gap:5px;align-items:center;justify-self:start;font-size:12px;padding:3px 9px;border-radius:99px;background:var(--bg);color:var(--muted)}
.lnext.now{background:color-mix(in srgb,var(--gold) 16%,transparent);color:color-mix(in srgb,var(--gold) 70%,var(--ink))}
.lnext.late{background:color-mix(in srgb,#ef4444 14%,transparent);color:#ef4444}
.lamount{font-family:var(--font-display);font-size:14px}
.leadboard .movebtn{width:30px;height:30px;padding:0;display:inline-grid;place-items:center}
@media(hover:none){.leadboard .lcard .cardx{opacity:1}}

/* --- Диалоги: аватары с каналом ------------------------------------------ */
.ch-tg{--ch:#2aabee}.ch-vk{--ch:#0077ff}.ch-ig{--ch:#e1306c}
.dlgitem{grid-template-columns:40px minmax(0,1fr) auto}
.dlgava{position:relative;width:38px;height:38px;flex:none;border-radius:50%;display:grid;place-items:center;font-size:13px;font-weight:700;
  background:color-mix(in srgb,var(--ch,var(--gold)) 16%,var(--panel));color:color-mix(in srgb,var(--ch,var(--gold)) 75%,var(--ink))}
html[data-theme=dark] .dlgava{color:color-mix(in srgb,var(--ch,var(--gold)) 70%,#fff)}
.dlgava i{position:absolute;right:-3px;bottom:-3px;width:17px;height:17px;border-radius:50%;display:grid;place-items:center;
  background:var(--ch,var(--gold));color:#fff;border:2px solid var(--panel)}
.dlgava.big{width:42px;height:42px;font-size:14px}
.dlgitem.on .dlgava{box-shadow:0 0 0 2px var(--gold)}
.dlgitem.unread .dlgtext b{color:var(--ink)}
.dlgitem.unread .dlgtext small{font-weight:600}
.dlglist .searchwrap{flex:none}

/* --- Брифы и КП: карточки сделок --------------------------------------- */
.bfpulse{margin:0 0 16px}
.bfpulse .metric{cursor:default}
.bfpulse .metric .mlabel{color:color-mix(in srgb,var(--acc) 70%,var(--ink))}
html[data-theme=dark] .bfpulse .metric .mlabel{color:var(--acc)}
.bfgrid{align-items:stretch}
.bfcard{display:grid;gap:10px;align-content:start;border-top:3px solid var(--acc)}
.bfcard .lhead h2{margin:2px 0 0;font-size:17px;line-height:1.25}
.bfsteps{display:grid;grid-template-columns:repeat(6,1fr);gap:4px}
.bfsteps i{height:6px;border-radius:3px;background:var(--line)}
.bfsteps i.done{background:color-mix(in srgb,var(--acc) 55%,var(--line))}
.bfsteps i.now{background:var(--acc);box-shadow:0 0 0 3px color-mix(in srgb,var(--acc) 18%,transparent)}
.bfsteps i.off{background:color-mix(in srgb,#ef4444 35%,var(--line))}
.bfstage{display:flex;gap:8px;align-items:baseline;margin:0}
.bfstage b{color:color-mix(in srgb,var(--acc) 75%,var(--ink))}
html[data-theme=dark] .bfstage b{color:var(--acc)}
.bfprice{display:grid;gap:2px}
.bfprice b{font-family:var(--font-display);font-size:22px;line-height:1.15}
.bfmeta{display:flex;gap:14px;flex-wrap:wrap;color:var(--muted);font-size:12px;border-top:1px solid var(--line);padding-top:10px;margin-top:2px}
.bfmeta span{display:inline-flex;gap:5px;align-items:center}
.pulse .metric{min-width:0}
.pulse .metric .value{max-width:100%;overflow:hidden;text-overflow:ellipsis}
.bfpulse .metric .value{font-size:clamp(22px,2.1vw,32px)}

/* --- ADERVIS CRM -------------------------------------------------------- */
.okdot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--tone-green);margin-left:4px}
.crmtag{display:inline-block;padding:0 7px;border-radius:99px;font-size:11px;font-weight:600;background:color-mix(in srgb,var(--tone-sky) 18%,transparent);color:color-mix(in srgb,var(--tone-sky) 70%,var(--ink))}
.crmstat{display:grid;gap:4px;padding:12px 14px;border-radius:12px;background:var(--bg);border:1px solid var(--line)}
.crmstat svg{color:var(--tone-green);vertical-align:-2px}
.crmlinks{list-style:none;margin:8px 0 14px;padding:0;display:grid;gap:6px}
.crmlinks li{display:grid;grid-template-columns:120px minmax(0,1fr) auto;gap:10px;align-items:center;padding:8px 10px;border:1px solid var(--line);border-radius:10px}
.crmlinks li span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}
.crmlinks .chip{display:inline-flex;gap:5px;align-items:center}
@media(max-width:720px){.crmlinks li{grid-template-columns:1fr auto}.crmlinks li span{display:none}}
#crmbody h3{margin:20px 0 4px}
#crmbody .formactions{margin-top:12px}

/* --- Контент-план: ритм, таблица по неделям, превью поста ------------- */
.aichip.strong{background:color-mix(in srgb,var(--tone-violet) 20%,var(--panel));border-color:color-mix(in srgb,var(--tone-violet) 55%,var(--line));font-weight:600}
.planpulse{display:grid;grid-template-columns:minmax(290px,1.1fr) minmax(250px,1fr) minmax(250px,1fr);padding:0;margin:4px 0 16px;overflow:hidden}
.planpulse>div{padding:18px 20px;min-width:0}
.planpulse>div+div{border-left:1px solid var(--line)}
.rhead{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:10px}
.rhead b{font-size:13px}
.rhead small{font-size:11px;white-space:nowrap}
.rgrid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px}
.rgrid>small{text-align:center;font-size:10px}
.rday{position:relative;height:40px;padding:5px 6px;border-radius:9px;border:1px solid var(--line);background:var(--bg);display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;color:var(--ink);min-width:0}
.rday b{font-size:11px;font-weight:600;line-height:1}
.rday.wknd{background:transparent;border-style:dashed}
.rday.past{opacity:.5}
.rday.today{border-color:var(--tone-violet);box-shadow:0 0 0 2px color-mix(in srgb,var(--tone-violet) 30%,transparent)}
.rday:hover{border-color:color-mix(in srgb,var(--tone-violet) 65%,var(--line))}
.rday[data-action=newpday]:hover::after{content:'+';position:absolute;inset:0;display:grid;place-items:center;font-size:18px;font-weight:600;color:var(--tone-violet)}
.rdots{display:flex;flex-wrap:wrap;gap:3px}
.rdots i{width:8px;height:8px;border-radius:50%;border:2px solid var(--rt);background:transparent}
.rdots i.done{background:var(--rt)}
.rdots em{font-size:10px;line-height:8px;font-style:normal;color:var(--muted)}
.pstats{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-content:start}
.pstats>div{display:grid;gap:2px;align-content:start;min-width:0}
.pstats span{font-size:12px;color:var(--muted)}
.pstats b{font-family:var(--font-display);font-size:30px;line-height:1.1}
.pstats small{font-size:11px}
.pstats .warn b{color:var(--tone-red)}
.rubbar{display:flex;gap:3px;height:12px;border-radius:99px;overflow:hidden}
.rubbar i{background:var(--rt);min-width:6px}
.rubbar i.norub{background:var(--line)}
.rubbar.mini{height:6px;width:min(150px,28%);margin-left:auto;flex:none}
.rubbar.mini i{flex:1;min-width:0}
.rubmix ul{list-style:none;margin:12px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:7px 14px}
.rubmix li{display:flex;align-items:center;gap:7px;font-size:12px;min-width:0}
.rubmix li i{width:10px;height:10px;border-radius:3px;background:var(--rt);flex:none}
.rubmix li b{margin-left:auto;font-variant-numeric:tabular-nums}
.rubmix li.zero{color:var(--muted)}
.rubmix li.zero i{opacity:.35}
@media(max-width:1250px){.planpulse{grid-template-columns:1fr 1fr}.rubmix{grid-column:1/-1;border-left:0!important;border-top:1px solid var(--line)}}
@media(max-width:760px){.planpulse{grid-template-columns:1fr}.planpulse>div+div{border-left:0;border-top:1px solid var(--line)}}

.ptable{display:grid;gap:14px}
.ptweek{border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--panel)}
.ptweek.now{border-color:color-mix(in srgb,var(--tone-violet) 55%,var(--line))}
.ptweek header{display:flex;align-items:center;flex-wrap:wrap;gap:6px 12px;padding:12px 16px;background:var(--bg)}
.ptweek.now header{background:color-mix(in srgb,var(--tone-violet) 10%,var(--bg))}
.ptweek header h3{margin:0;font-size:15px}
.ptwcount{font-size:12px;color:var(--muted)}
.ptrow{display:grid;grid-template-columns:70px 150px minmax(0,1.3fr) minmax(0,.8fr) 92px 124px 112px;gap:14px;align-items:center;padding:12px 14px 12px 18px;border-top:1px solid var(--line);position:relative;background:var(--panel);cursor:pointer}
.ptrow::before{content:'';position:absolute;left:0;top:10px;bottom:10px;width:3px;border-radius:0 3px 3px 0;background:var(--rt)}
.ptrow:hover,.ptrow:focus-visible{background:color-mix(in srgb,var(--tone-violet) 5%,var(--panel))}
.ptrow.isdone{background:color-mix(in srgb,var(--bg) 40%,var(--panel))}
.ptrow.isdone h3{color:var(--muted)}
.pthead{cursor:default;background:transparent;border:0;padding:0 14px 0 18px;font-size:11px;color:var(--muted)}
.pthead::before{display:none}
.ptwhen{display:flex;flex-direction:column;line-height:1.15}
.ptwhen .wd{font-size:11px;color:var(--muted)}
.ptwhen b{font-family:var(--font-display);font-size:26px;line-height:1.05}
.ptwhen small{font-size:11px;white-space:nowrap}
.ptrow.istoday .ptwhen b{color:var(--tone-violet)}
.ptnet{display:flex;gap:9px;align-items:center;min-width:0}
.ptnet .neticon{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:var(--bg);border:1px solid var(--line);flex:none}
.ptnet>span:last-child{min-width:0}
.ptnet b{display:block;font-size:13px}
.ptnet small{display:block;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ptmain{min-width:0}
.ptmain h3{margin:4px 0 2px;font-size:14px;line-height:1.3;overflow-wrap:anywhere}
.ptmain p{margin:0;font-size:12px;color:var(--muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ptmain p.notext{display:flex;gap:5px;align-items:center;color:color-mix(in srgb,var(--tone-violet) 75%,var(--ink))}
.rub{display:inline-block;padding:1px 8px;border-radius:99px;font-size:11px;font-weight:600;white-space:nowrap;background:color-mix(in srgb,var(--rt) 18%,transparent);color:color-mix(in srgb,var(--rt) 62%,var(--ink))}
.ptvis{display:flex;gap:6px;align-items:flex-start;font-size:12px;min-width:0}
.ptvis span{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.ptvis svg{flex:none;margin-top:2px;color:var(--muted)}
.ptgoal{display:grid;gap:3px;justify-items:start}
.ptgoal small{font-size:11px}
.goal{font-size:11px;font-weight:600;padding:2px 8px;border-radius:6px;border:1px solid var(--line);white-space:nowrap}
.goal.g1{border-color:color-mix(in srgb,var(--tone-sky) 45%,var(--line))}
.goal.g2{background:color-mix(in srgb,var(--tone-gold) 20%,transparent);border-color:color-mix(in srgb,var(--tone-gold) 50%,var(--line))}
.ptstat{display:grid;gap:5px;justify-items:start}
.pst{font-size:12px;font-weight:600;white-space:nowrap}
.pst.s3{color:color-mix(in srgb,var(--tone-sky) 70%,var(--ink))}
.pst.s4{color:var(--tone-green)}
.pdots{display:flex;gap:3px}
.pdots i{width:14px;height:4px;border-radius:2px;background:var(--line)}
.pdots i.on{background:var(--tone-violet)}
.ptrow.isdone .pdots i.on{background:var(--tone-green)}
.ptstat small{font-size:11px}
.ptact{display:flex;gap:2px;justify-content:flex-end}
.ptrow .rowact{opacity:0}
.ptrow:hover .rowact,.ptrow:focus-within .rowact,.ptrow .rowact:focus-visible{opacity:1}
.ptrow .rowact:not(.del):hover{color:var(--tone-violet);background:color-mix(in srgb,var(--tone-violet) 12%,transparent);border-color:color-mix(in srgb,var(--tone-violet) 30%,transparent)}
.ptrow .rowact.ai{opacity:1;color:var(--tone-violet)}
@media(hover:none){.ptrow .rowact{opacity:1}}
@media(max-width:1350px){.ptrow{grid-template-columns:64px 140px minmax(0,1fr) 92px 120px 112px}.ptvis,.pthead span:nth-child(4){display:none}}
@media(max-width:980px){
  .pthead{display:none}
  .ptrow{grid-template-columns:52px minmax(0,1fr) auto;grid-template-areas:"when net act" "when main main" "when vis vis" "when stat goal";gap:8px 12px;align-items:start}
  .ptwhen{grid-area:when}.ptnet{grid-area:net}.ptmain{grid-area:main}.ptvis{grid-area:vis;display:flex}.ptgoal{grid-area:goal;justify-items:end}.ptstat{grid-area:stat}.ptact{grid-area:act}
  .ptstat{grid-auto-flow:column;align-items:center;justify-content:start;gap:8px}
  .ptvis small.muted{display:none}
  .rubbar.mini{display:none}}

dialog.wide{width:min(1160px,96vw)}
.pfwrap{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:26px;align-items:start}
.pfwrap>form{min-width:0}
.ppreview{position:sticky;top:0;min-width:0}
dialog textarea.short{min-height:84px}
.pvcard{border:1px solid var(--line);border-radius:14px;background:var(--bg);overflow:hidden;margin-top:8px}
.pvhead{display:flex;gap:10px;align-items:center;padding:12px 14px}
.pvhead img{width:36px;height:36px;border-radius:50%;background:#15171c;padding:7px;flex:none}
.pvhead>span:not(.rub){min-width:0}
.pvhead b{display:block;font-size:13px}
.pvhead small{display:block;font-size:11px}
.pvhead .rub{margin-left:auto}
.pvtext{padding:0 14px 12px;font-size:13px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere;max-height:380px;overflow:auto}
.pvmore{display:block;margin-top:4px;color:var(--tone-sky);font-weight:600}
.pvmedia{display:grid;place-items:center;gap:8px;text-align:center;padding:22px 18px;min-height:150px;margin:0 0 12px;color:var(--muted);font-size:12px;
  background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--tone-violet) 9%,var(--panel)) 0 12px,var(--panel) 12px 24px)}
.pvcta{margin:0 14px 12px;padding:8px 12px;border-radius:10px;background:color-mix(in srgb,var(--tone-gold) 16%,transparent);font-size:12px;display:flex;gap:7px;align-items:center}
.pvfoot{padding:9px 14px;border-top:1px solid var(--line);font-size:11px;color:var(--muted);display:flex;gap:6px;align-items:center}
@media(max-width:900px){.pfwrap{grid-template-columns:1fr}.ppreview{position:static}}

.writelist{list-style:none;padding:0;margin:12px 0 0;display:grid;gap:6px}
.writelist li{display:grid;grid-template-columns:22px minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px 12px;border:1px solid var(--line);border-radius:10px}
.writelist b{display:block;font-size:13px}
.writelist small{display:block}
.writelist .w-ok .wst{color:var(--tone-green)}
.writelist .w-err .wst{color:var(--tone-red)}
.writelist .w-run{border-color:var(--tone-violet)}
.writelist .w-run .wst svg{animation:wspin 1.1s linear infinite}
@keyframes wspin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.writelist .w-run .wst svg{animation:none}}

/* --- скачать смету ------------------------------------------------------ */
.dlpair{display:inline-flex}
.dlpair>button:first-child{border-top-right-radius:0;border-bottom-right-radius:0}
.dlpair>button:last-child{border-top-left-radius:0;border-bottom-left-radius:0;margin-left:-1px;font-weight:600}
.smtable th{text-align:left;font-size:12px;color:#5c5c5c;font-weight:600;padding:6px 0;border-bottom:1px solid #cfcfcf}
.smtable th:not(:first-child){text-align:right}
.smtable .smgroup td{padding-top:16px;font-weight:700;border-bottom:1px solid #cfcfcf}
.smtable .smtotal td{font-weight:700;border-top:2px solid #1b1e24;border-bottom:0;padding-top:10px}
.smtable td.kpprice{white-space:nowrap;padding-left:16px}

.smtable .smsub td{font-weight:700;border-bottom:1px solid #cfcfcf;padding-bottom:10px}
.bfsubs{display:flex;gap:8px;align-items:center;margin-top:30px}
.bfsubs input{width:18px;height:18px;flex:none}

/* --- бриф → ADERVIS CRM -------------------------------------------------- */
.crmpush{display:grid;gap:10px;margin:6px 0 12px}
.crmpush>div{display:grid;grid-template-columns:90px minmax(0,1fr);gap:12px;padding:10px 12px;border:1px solid var(--line);border-radius:10px}
.crmpush dt{color:var(--muted);font-size:12px}
.crmpush dd{margin:0;overflow-wrap:anywhere}
.bfcrmnote{display:flex;gap:6px;align-items:center;margin:-4px 0 10px}
.bfcrmnote svg{color:var(--tone-green)}

/* --- вшить работу в стоимость ------------------------------------------- */
.bfrowacts{white-space:nowrap}
.bftable .fold{width:30px;height:30px;padding:0;display:inline-grid;place-items:center;border-radius:8px;background:transparent;border:1px solid transparent;color:var(--muted)}
.bftable .fold:hover{color:var(--ink);background:var(--bg)}
.bftable .fold.on{color:var(--tone-gold);border-color:color-mix(in srgb,var(--tone-gold) 45%,var(--line))}
.bftable tr.folded td:first-child input{font-style:italic;color:var(--muted)}
.bftable tr.folded td:first-child::after{content:'вшито в стоимость';display:block;font-size:11px;color:var(--tone-gold);margin-top:2px}

.caseok{display:flex;gap:8px;align-items:center;margin-top:12px}
.caseok input{width:18px;height:18px;flex:none}
.kpdoc ol{margin:0 0 8px;padding-left:20px}
.kpdoc ul{margin-bottom:8px}
.kpdoc li{margin:2px 0}
.kpdoc h3{font-size:14px;margin:14px 0 6px}

/* --- КП-ссылка ------------------------------------------------------------ */
.kplinkbox{display:flex;justify-content:space-between;align-items:center;gap:14px;margin:18px 0 6px;padding:14px 16px;border-radius:14px;border:1px solid color-mix(in srgb,var(--tone-gold) 45%,var(--line));background:color-mix(in srgb,var(--tone-gold) 8%,var(--panel))}
.kplinkbox b{display:flex;gap:6px;align-items:center}
.kplinkbox small{display:block;margin-top:2px}
.kplinkbox .primary{flex:none}
.kplinkrow{display:flex;gap:8px;align-items:center;margin:4px 0 8px}
.kplinkrow .input{flex:1;min-width:0}
.kpmedia{list-style:none;padding:0;margin:10px 0;display:grid;gap:8px}
.kpmedia li{display:grid;grid-template-columns:96px minmax(0,1fr) auto;gap:12px;align-items:center;padding:8px;border:1px solid var(--line);border-radius:12px}
.kpthumb{width:96px;height:54px;object-fit:cover;border-radius:8px;display:grid;place-items:center;background:var(--bg)}
.kpmeta{display:grid;gap:6px}
.kpmeta .input{padding:7px 10px}
@media(max-width:720px){.kplinkbox{flex-direction:column;align-items:stretch}.kpmedia li{grid-template-columns:64px minmax(0,1fr) auto}.kpthumb{width:64px;height:40px}}

/* пояснение к строке сметы: клиент видит его на странице КП */
.bftable .bfhint{margin-top:6px;font-size:13px;color:var(--muted)}

/* логотип Hub ADERVIS: золотая плашка с «U»-капсулой и надпись ADERVIS / HUB */
.brandmark img{width:64%;height:auto;display:block}
.brandword img{height:30px;width:auto;display:block}
.gatecard .gateword{height:56px;width:auto;display:block;margin:4px 0 14px}

/* плашка на карточке брифа: что клиент сделал с КП-ссылкой */
.kpbadge{display:inline-flex;align-items:center;gap:6px;margin:2px 0 8px;padding:5px 10px;border-radius:999px;font-size:12px;font-weight:600;background:var(--chip,#eef0f3);color:var(--muted);max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kpbadge.tone-gold{background:rgba(246,189,58,.16);color:#8a6100}
.kpbadge.tone-green{background:rgba(40,160,90,.14);color:#1f7a3a}
.kpbadge.tone-violet{background:rgba(101,80,234,.13);color:#5140c4}
html[data-theme=dark] .kpbadge.tone-gold{color:#f6bd3a}
html[data-theme=dark] .kpbadge.tone-green{color:#5fd38d}
html[data-theme=dark] .kpbadge.tone-violet{color:#a99cff}

/* кнопка «фон шапки» у примера в окне КП-ссылки */
.kpmedia .kpmcover{background:none;border:1px solid var(--line);border-radius:9px;width:34px;height:34px;display:grid;place-items:center;color:var(--muted)}
.kpmedia .kpmcover.on{background:var(--gold);border-color:var(--gold);color:#141414}

/* КП-ссылка: проверка перед отправкой */
.kpchecks{list-style:none;padding:0;margin:4px 0 14px;display:grid;gap:6px}
.kpchecks li{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:10px;font-size:13px;background:var(--panel2,#f6f7f9)}
.kpchecks li span{flex:1}
.kpchecks li.ok svg{color:#1f9d55}
.kpchecks li.warn{background:rgba(246,189,58,.14)}
.kpchecks li.warn svg{color:#c98a00}
.kpchecks button{padding:5px 12px;border-radius:8px;background:var(--dark,#141414);color:#fff;font-weight:600;font-size:12px}
html[data-theme=dark] .kpchecks li{background:#23262d}
html[data-theme=dark] .kpchecks li.warn{background:rgba(246,189,58,.12)}
.kpmedia .kpmacts{display:flex;flex-direction:column;gap:6px;align-items:center}
.kpchecks li{padding:6px 12px}
.kpmsg{width:100%;font:inherit;font-size:14px;line-height:1.5;resize:vertical}

/* голосовая сводка по клиенту */
.bfvoice{display:grid;gap:8px;margin:0 0 12px}
.bfvoice audio{width:100%;max-width:560px}
.bfvoice details p{margin:6px 0 0;line-height:1.55}

/* как клиент читал КП */
.kpeng{display:block;margin-top:4px;font-size:12px;color:var(--muted)}
.kpvisits{margin:10px 0;padding:10px 14px;border:1px solid var(--line);border-radius:12px}
.kpvisits p{margin:0 0 6px}
.kpvisits ul{margin:0;padding-left:18px;font-size:13px;color:var(--muted)}

/* сайт adervis.ru */
.sitestats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:0 0 16px}
.sitestat{display:grid;gap:4px}
.sitestat b{font-size:26px;letter-spacing:-.03em}
.sitestat.tone-green b{color:#2f8a4a}.sitestat.tone-gold b{color:#b07d10}.sitestat.tone-red b{color:#c2413a}
.sitecols{grid-template-columns:repeat(2,minmax(0,1fr));margin-bottom:16px}
.sitelist{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:8px}
.sitelist li{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:baseline;padding-bottom:8px;border-bottom:1px solid var(--line)}
.sitelist li:last-child{border:0}
.sitelist li.done{color:var(--muted);text-decoration:line-through}
.siteask{display:flex;gap:8px;margin:8px 0}
.siteask .input{flex:1}
@media (max-width:900px){.sitestats{grid-template-columns:repeat(2,minmax(0,1fr))}.sitecols{grid-template-columns:1fr}}