:root{
  --bg:#15120e; --bg2:#1c1813; --panel:#211c16; --panel2:#29231b; --line:#3a3127; --line2:#4a3f31;
  --ink:#efe6d6; --ink2:#c9bba3; --mute:#8e816c; --amber:#e3a547; --amber2:#f2c178; --amber-bg:rgba(227,165,71,.12);
  --green:#8fbf7a; --green-bg:rgba(143,191,122,.12); --red:#e07a62; --red-bg:rgba(224,122,98,.12);
  --blue:#86a9d6; --blue-bg:rgba(134,169,214,.12);
  --serif:'Newsreader',Georgia,serif; --sans:'IBM Plex Sans',system-ui,sans-serif; --mono:'IBM Plex Mono',ui-monospace,monospace;
  --r:8px;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.5 var(--sans)}
a{color:var(--amber2);text-decoration:none} a:hover{text-decoration:underline}
h1,h2,h3{font-family:var(--serif);font-weight:500;letter-spacing:.01em;margin:0 0 .5em}
h1{font-size:28px} h2{font-size:21px;margin-top:1.2em} h3{font-size:17px}
.mono{font-family:var(--mono)} .mute{color:var(--mute)} .small{font-size:12.5px} .right{text-align:right}
.nowrap{white-space:nowrap}

/* каркас */
.top{display:flex;align-items:center;gap:22px;padding:12px 24px;border-bottom:1px solid var(--line);background:var(--bg2);position:sticky;top:0;z-index:20}
.brand{font-family:var(--serif);font-size:19px;color:var(--amber2);white-space:nowrap}
.brand b{color:var(--ink);font-weight:500}
.top nav{display:flex;gap:4px;flex-wrap:wrap}
.top nav a{color:var(--ink2);padding:6px 11px;border-radius:6px}
.top nav a.on{background:var(--amber-bg);color:var(--amber2)}
.top nav a:hover{text-decoration:none;background:var(--panel2)}
.top .sp{flex:1}
main{padding:22px 24px 80px;max-width:1500px;margin:0 auto}

/* проект */
.phead{display:flex;align-items:flex-end;gap:18px;flex-wrap:wrap;margin-bottom:10px}
.phead h1{margin:0}
.phead .dom{color:var(--mute);font-family:var(--mono);font-size:13px}
.tabs{display:flex;gap:2px;border-bottom:1px solid var(--line);margin:14px 0 20px;flex-wrap:wrap}
.tabs a{padding:8px 14px;color:var(--ink2);border-bottom:2px solid transparent;margin-bottom:-1px}
.tabs a.on{color:var(--amber2);border-color:var(--amber)}
.tabs a:hover{text-decoration:none;color:var(--ink)}

/* полоса этапов */
.stages{display:grid;grid-template-columns:repeat(9,1fr);gap:4px;margin:6px 0 4px}
.stg{padding:7px 8px;border-radius:6px;background:var(--panel);border:1px solid var(--line);font-size:12px;color:var(--mute);min-width:0}
.stg b{display:block;font-weight:500;color:var(--ink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stg.past{border-color:var(--line2)} .stg.past b{color:var(--mute)}
.stg.cur{background:var(--amber-bg);border-color:var(--amber);color:var(--amber2)} .stg.cur b{color:var(--ink)}
.stg.cyc{border-style:dashed}

/* карточки, панели */
.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;margin-bottom:16px}
.panel h3{margin-bottom:10px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media (max-width:1000px){.grid2,.grid3{grid-template-columns:1fr}.stages{grid-template-columns:repeat(3,1fr)}}
.kpi{display:flex;gap:26px;flex-wrap:wrap}
.kpi div{min-width:110px} .kpi b{display:block;font:500 22px var(--serif);color:var(--ink)} .kpi span{color:var(--mute);font-size:12px}

/* таблицы */
table.t{width:100%;border-collapse:collapse}
.t th{font-weight:500;text-align:left;color:var(--mute);font-size:12px;padding:7px 8px;border-bottom:1px solid var(--line);white-space:nowrap}
.t td{padding:7px 8px;border-bottom:1px solid var(--line);vertical-align:top}
.t tr:hover td{background:rgba(255,255,255,.015)}
.t td.num,.t th.num{text-align:right;font-family:var(--mono);font-size:13px}

/* метки */
.tag{display:inline-block;padding:1px 7px;border-radius:10px;font-size:11.5px;border:1px solid var(--line2);color:var(--ink2);white-space:nowrap;margin:1px 2px 1px 0}
.tag.blk{border-color:var(--red);color:var(--red);background:var(--red-bg)}
.tag.drv{border-color:var(--amber);color:var(--amber2);background:var(--amber-bg)}
.tag.trd{border-color:var(--blue);color:var(--blue);background:var(--blue-bg)}
.tag.ok{border-color:var(--green);color:var(--green);background:var(--green-bg)}
.tag.w{font-family:var(--mono)}
.score{font-family:var(--mono);color:var(--amber2)}

/* кнопки и формы */
button,.btn{font:inherit;background:var(--panel2);color:var(--ink);border:1px solid var(--line2);border-radius:6px;padding:6px 12px;cursor:pointer;display:inline-block}
button:hover,.btn:hover{border-color:var(--amber);text-decoration:none}
button.primary,.btn.primary{background:var(--amber);color:#1b1407;border-color:var(--amber);font-weight:500}
button.primary:hover{background:var(--amber2)}
button.ghost{background:transparent}
button.danger{border-color:var(--red);color:var(--red);background:transparent}
button.sm{padding:3px 8px;font-size:12.5px}
input,select,textarea{font:inherit;background:var(--bg2);color:var(--ink);border:1px solid var(--line2);border-radius:6px;padding:6px 9px;width:100%}
textarea{min-height:64px;resize:vertical;line-height:1.45}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--amber)}
input[type=checkbox]{width:auto;accent-color:var(--amber)}
label{display:block;color:var(--ink2);font-size:12.5px;margin:10px 0 4px}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.row > *{flex:0 0 auto}
.f{display:grid;grid-template-columns:repeat(12,1fr);gap:0 12px}
.c1{grid-column:span 1}.c2{grid-column:span 2}.c3{grid-column:span 3}.c4{grid-column:span 4}.c6{grid-column:span 6}.c8{grid-column:span 8}.c12{grid-column:span 12}
@media (max-width:800px){.f > *{grid-column:span 12}}
.check{display:flex;gap:9px;align-items:flex-start;padding:5px 0;color:var(--ink)}
.check input{margin-top:3px}

/* предупреждения */
.note{padding:10px 14px;border-radius:var(--r);border:1px solid var(--line2);background:var(--panel2);margin-bottom:14px}
.note.warn{border-color:var(--amber);background:var(--amber-bg)}
.note.bad{border-color:var(--red);background:var(--red-bg)}
.note.good{border-color:var(--green);background:var(--green-bg)}
.note ul{margin:6px 0 0;padding-left:20px}

/* полоса часов */
.bar{height:8px;background:var(--bg2);border-radius:4px;overflow:hidden;border:1px solid var(--line);position:relative}
.bar i{display:block;height:100%;background:var(--amber)}
.bar i.over{background:var(--red)}
.bar i.r{background:var(--line2)}
.barwrap{display:flex;align-items:center;gap:10px}
.barwrap .bar{flex:1}

/* доска */
.board{display:grid;grid-template-columns:repeat(5,minmax(200px,1fr));gap:12px;align-items:start}
@media (max-width:1100px){.board{grid-template-columns:1fr 1fr}}
.col{background:var(--bg2);border:1px solid var(--line);border-radius:var(--r);padding:10px;min-height:120px}
.col h4{margin:0 0 8px;font:500 13px var(--sans);color:var(--ink2);display:flex;justify-content:space-between}
.card{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:8px 10px;margin-bottom:8px;cursor:pointer}
.card:hover{border-color:var(--amber)}
.card .ttl{color:var(--ink);margin-bottom:4px}
.card .meta{font-size:12px;color:var(--mute);display:flex;gap:8px;flex-wrap:wrap}
.card.over{border-left:3px solid var(--red)}

/* модальное окно */
.modal{position:fixed;inset:0;background:rgba(10,8,5,.7);display:none;align-items:flex-start;justify-content:center;z-index:50;overflow:auto;padding:40px 16px}
.modal.on{display:flex}
.dlg{background:var(--panel);border:1px solid var(--line2);border-radius:10px;width:min(980px,100%);padding:20px 22px}
.dlg h2{margin-top:0}
.dlg .acts{display:flex;gap:8px;justify-content:flex-end;margin-top:16px;flex-wrap:wrap}
.hist{font-size:12px;color:var(--mute);max-height:140px;overflow:auto;border-top:1px solid var(--line);margin-top:12px;padding-top:8px}
.toast{position:fixed;right:20px;bottom:20px;background:var(--panel2);border:1px solid var(--amber);padding:10px 14px;border-radius:8px;z-index:60;max-width:460px;display:none;white-space:pre-line}
.toast.err{border-color:var(--red)}
.toast.on{display:block}

/* дорожная карта */
.rm td,.rm th{text-align:center}
.rm td.w,.rm th.w{text-align:left}
.cell{width:30px;height:24px;border-radius:5px;border:1px solid var(--line2);background:transparent;padding:0;cursor:pointer}
.cell.on{background:var(--amber);border-color:var(--amber)}
.rm tr.off td{opacity:.45}
.rm select{width:auto;padding:3px 6px}
.rm input.reason{min-width:240px;padding:4px 7px}

/* справочник */
.lib-nav{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:12px}
.lib-nav a{padding:4px 10px;border:1px solid var(--line2);border-radius:14px;color:var(--ink2);font-size:12.5px}
.lib-nav a.on{border-color:var(--amber);color:var(--amber2);background:var(--amber-bg)}
.prose{max-width:900px;font-size:14.5px;line-height:1.6}
.prose table{border-collapse:collapse;margin:10px 0;font-size:13px}
.prose th,.prose td{border:1px solid var(--line);padding:5px 8px;vertical-align:top}
.prose code{font-family:var(--mono);background:var(--bg2);padding:1px 4px;border-radius:4px;font-size:12.5px}
.prose h3{margin-top:1.2em}

.login{max-width:360px;margin:12vh auto}
.empty{color:var(--mute);padding:14px 0}
details summary{cursor:pointer;color:var(--ink2)}
button:disabled{opacity:.4;cursor:not-allowed}
button.primary:disabled:hover{background:var(--amber)}
.row > input,.row > select.grow{flex:1 1 auto;width:auto;min-width:0}