.console{display:grid;grid-template-columns:236px minmax(0,1fr);flex:1;min-height:0}
.side{border-right:1px solid var(--line);background:var(--white);display:flex;flex-direction:column;min-height:0}
.side-nav{padding:12px 10px;display:flex;flex-direction:column;gap:2px}
.side-nav button{display:flex;align-items:center;gap:8px;padding:8px 11px;border-radius:var(--r-s);
  font-size:13px;font-weight:500;color:var(--ink-2);text-align:left;width:100%}
.side-nav button:hover{background:var(--paper-2)}
.side-nav button[aria-current="page"]{background:var(--ink);color:var(--white)}
.side-nav .pill{margin-left:auto;font-size:10.5px;padding:1px 6px;border-radius:100px;background:var(--paper-3);color:var(--ink-3)}
.side-nav button[aria-current="page"] .pill{background:rgba(255,255,255,.18);color:#fff}
.side-foot{margin-top:auto;padding:14px;border-top:1px solid var(--line);font-size:12px}
.side-foot .k{font-size:10.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-3);margin-bottom:5px}
.capline{font-size:15px;letter-spacing:-.02em} .capline b{font-weight:600}
.capline span{color:var(--ink-4);font-size:12px}
.side-foot .s{margin-top:7px;font-size:11.5px;color:var(--ink-4);line-height:1.45}
.main{overflow:auto;min-width:0;background:var(--paper)}
.view-head{padding:20px 24px 14px;border-bottom:1px solid var(--line);background:var(--white)}
.view-head h1{font-size:19px;letter-spacing:-.035em}
.view-head p{font-size:12.5px;color:var(--ink-3);margin-top:5px;max-width:70ch;line-height:1.55}
.who{display:flex;align-items:center;gap:7px}
.who select{padding:5px 9px;border:1px solid var(--line);border-radius:var(--r-s);font-size:12.5px;background:var(--white)}
.avatar{width:25px;height:25px;border-radius:50%;background:var(--ink);color:#fff;display:flex;align-items:center;
  justify-content:center;font-size:10.5px;font-weight:600;letter-spacing:.02em}
tr.row{cursor:pointer}
tr.row.sel td{background:var(--accent-soft)}
.st{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:550}
.st:before{content:'';width:6px;height:6px;border-radius:50%;background:currentColor}
.st.needs{color:var(--warn)} .st.approved{color:var(--ok)} .st.rejected{color:var(--bad)} .st.blocked{color:var(--ink-4)}
.drawer{border-top:1px solid var(--line);background:var(--paper-2);padding:18px 24px}
.drawer h3{font-size:14px;margin-bottom:3px}
.drawer .sub{font-size:12px;color:var(--ink-3);margin-bottom:14px}
.kv{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:10px;margin-bottom:14px}
.kv div{background:var(--white);border:1px solid var(--line);border-radius:var(--r-s);padding:9px 11px}
.kv .k{font-size:10px;text-transform:uppercase;letter-spacing:.07em;color:var(--ink-3);margin-bottom:3px}
.kv .v{font-size:13px;font-weight:550;word-break:break-word}
.kv .p{font-size:10.5px;color:var(--ink-4);margin-top:3px}
.bars{display:flex;align-items:flex-end;gap:5px;height:104px;padding:16px 24px 0}
.bars div{flex:1;background:var(--accent);border-radius:3px 3px 0 0;min-height:2px;position:relative}
.bars div.over{background:var(--bad)}
.barlabels{display:flex;gap:5px;padding:6px 24px 16px;font-size:9.5px;color:var(--ink-4)}
.barlabels span{flex:1;text-align:center}
.matrix td.y{color:var(--ok);font-weight:600} .matrix td.n{color:var(--ink-4)}
.deny{background:var(--bad-soft);border:1px solid #F0D2CE;border-radius:var(--r-s);padding:10px 12px;
  font-size:12.5px;color:#8A2C1F;margin:0 24px 16px}
@media (max-width:820px){ .console{grid-template-columns:1fr;grid-template-rows:auto 1fr} .side{border-right:0;border-bottom:1px solid var(--line)} .side-nav{flex-direction:row;overflow:auto} .side-foot{display:none} }