@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&family=UnifrakturCook:wght@700&display=swap');

:root{
  --cab-ink:#0a0908;
  --cab-ink-2:#171411;
  --cab-paper:#eee5d4;
  --cab-paper-2:#f7f1e3;
  --cab-paper-3:#fffaf0;
  --cab-line:rgba(10,9,8,.18);
  --cab-line-strong:rgba(10,9,8,.38);
  --cab-muted:#6f665b;
  --cab-ash:#a69c8d;
  --cab-bone:#fff9eb;
  --cab-good:#34463a;
  --cab-warn:#7b5b2f;
  --cab-danger:#6f3732;
  --cab-shadow:0 18px 45px rgba(20,15,10,.11);
  --cab-serif:'Cormorant Garamond',Georgia,'Times New Roman',serif;
  --cab-mono:'IBM Plex Mono','Courier New',monospace;
  --cab-gothic:'UnifrakturCook','Cormorant Garamond',Georgia,serif;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body.cabinet-page{
  margin:0;
  min-width:320px;
  min-height:100vh;
  overflow-x:hidden;
  color:var(--cab-ink);
  font-family:var(--cab-serif);
  background:
    radial-gradient(circle at 86% -8%,rgba(255,255,255,.82),transparent 24rem),
    linear-gradient(135deg,var(--cab-paper-2),var(--cab-paper));
}
body.cabinet-page::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:1000;
  pointer-events:none;
  opacity:.18;
  mix-blend-mode:multiply;
  background-image:
    repeating-linear-gradient(12deg,rgba(8,7,6,.09) 0 1px,transparent 1px 9px),
    repeating-linear-gradient(-18deg,rgba(8,7,6,.05) 0 1px,transparent 1px 12px);
}
button,input,select,textarea{font:inherit}
button,a{touch-action:manipulation}
button{color:inherit}
a{color:inherit}
[hidden]{display:none!important}

.cab-skip{
  position:fixed;
  left:-999px;
  top:10px;
  z-index:1200;
  padding:10px 14px;
  background:var(--cab-bone);
  border:1px solid var(--cab-ink);
}
.cab-skip:focus{left:10px}

.demo-ribbon{
  position:fixed;
  z-index:900;
  inset:0 0 auto 0;
  min-height:30px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:6px 18px;
  color:rgba(255,249,235,.82);
  background:#050403;
  border-bottom:1px solid rgba(255,249,235,.18);
  font:600 9px/1.3 var(--cab-mono);
  letter-spacing:.16em;
  text-align:center;
  text-transform:uppercase;
}

.cab-shell{
  min-height:100vh;
  display:grid;
  grid-template-columns:272px minmax(0,1fr);
  padding-top:30px;
}

.cab-sidebar{
  position:fixed;
  inset:30px auto 0 0;
  z-index:300;
  width:272px;
  display:flex;
  flex-direction:column;
  color:var(--cab-bone);
  background:
    radial-gradient(circle at 72% 11%,rgba(255,255,255,.10),transparent 8rem),
    linear-gradient(180deg,#080706,#15110e 70%,#090807);
  border-right:1px solid rgba(255,249,235,.16);
  box-shadow:18px 0 50px rgba(0,0,0,.16);
}
.cab-brand{
  min-height:90px;
  display:flex;
  align-items:center;
  gap:13px;
  padding:20px 22px 18px;
  border-bottom:1px solid rgba(255,249,235,.13);
  text-decoration:none;
}
.cab-brand img{
  width:42px;
  height:42px;
  padding:8px;
  border:1px solid rgba(255,249,235,.52);
  border-radius:50%;
  filter:grayscale(1) invert(1);
  box-shadow:0 0 0 6px rgba(255,255,255,.025);
}
.cab-brand strong{
  display:block;
  font:700 25px/1 var(--cab-gothic);
  letter-spacing:.04em;
}
.cab-brand small{
  display:block;
  margin-top:5px;
  color:rgba(255,249,235,.52);
  font:500 9px/1.3 var(--cab-mono);
  letter-spacing:.15em;
  text-transform:uppercase;
}

.cab-nav{
  flex:1;
  overflow:auto;
  padding:17px 12px 22px;
}
.nav-group{margin-bottom:18px}
.nav-group-title{
  display:block;
  padding:0 12px 7px;
  color:rgba(255,249,235,.38);
  font:600 8px/1 var(--cab-mono);
  letter-spacing:.18em;
  text-transform:uppercase;
}
.cab-nav-button{
  width:100%;
  min-height:39px;
  display:grid;
  grid-template-columns:25px 1fr auto;
  align-items:center;
  gap:8px;
  padding:8px 11px;
  color:rgba(255,249,235,.70);
  background:transparent;
  border:1px solid transparent;
  border-radius:2px;
  cursor:pointer;
  text-align:left;
  font:600 10px/1.25 var(--cab-mono);
  letter-spacing:.055em;
  transition:.16s ease;
}
.cab-nav-button:hover,
.cab-nav-button:focus-visible{
  color:var(--cab-bone);
  border-color:rgba(255,249,235,.22);
  background:rgba(255,255,255,.045);
  outline:none;
}
.cab-nav-button.is-active{
  color:var(--cab-ink);
  background:var(--cab-paper);
  border-color:var(--cab-paper);
  box-shadow:inset 3px 0 0 var(--cab-ink);
}
.nav-symbol{
  width:23px;
  height:23px;
  display:grid;
  place-items:center;
  border:1px solid currentColor;
  border-radius:50%;
  font:600 9px/1 var(--cab-mono);
}
.nav-count{
  min-width:19px;
  min-height:19px;
  display:grid;
  place-items:center;
  padding:2px 5px;
  color:var(--cab-bone);
  background:var(--cab-danger);
  border-radius:999px;
  font:600 8px/1 var(--cab-mono);
}
.cab-nav-button.is-active .nav-count{color:var(--cab-bone)}

.sidebar-foot{
  padding:14px 14px 17px;
  border-top:1px solid rgba(255,249,235,.13);
}
.sidebar-plan{
  padding:13px;
  border:1px solid rgba(255,249,235,.17);
  background:rgba(255,255,255,.035);
}
.sidebar-plan span{
  display:block;
  color:rgba(255,249,235,.46);
  font:600 8px/1 var(--cab-mono);
  letter-spacing:.13em;
  text-transform:uppercase;
}
.sidebar-plan strong{display:block;margin:7px 0 2px;font-size:19px}
.sidebar-plan small{color:rgba(255,249,235,.56);font:500 9px/1.4 var(--cab-mono)}
.sidebar-resource{
  height:4px;
  margin-top:10px;
  background:rgba(255,255,255,.12);
  overflow:hidden;
}
.sidebar-resource i{display:block;width:38%;height:100%;background:var(--cab-bone)}

.cab-main{
  grid-column:2;
  min-width:0;
  min-height:100vh;
}
.cab-topbar{
  position:sticky;
  top:30px;
  z-index:220;
  min-height:72px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:13px clamp(18px,3vw,38px);
  background:rgba(247,241,227,.88);
  border-bottom:1px solid var(--cab-line);
  backdrop-filter:blur(18px);
}
.topbar-left,.topbar-right{display:flex;align-items:center;gap:12px}
.mobile-menu{
  display:none;
  width:40px;
  height:40px;
  border:1px solid var(--cab-line-strong);
  background:transparent;
  cursor:pointer;
  font:600 14px/1 var(--cab-mono);
}
.breadcrumb{
  display:flex;
  flex-direction:column;
  gap:4px;
}
.breadcrumb small{
  color:var(--cab-muted);
  font:600 8px/1 var(--cab-mono);
  letter-spacing:.16em;
  text-transform:uppercase;
}
.breadcrumb strong{font-size:20px;line-height:1}
.top-balance{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:42px;
  padding:7px 12px;
  border:1px solid var(--cab-line);
  background:rgba(255,255,255,.45);
}
.top-balance span{display:block;color:var(--cab-muted);font:600 8px/1 var(--cab-mono);text-transform:uppercase;letter-spacing:.12em}
.top-balance strong{display:block;margin-top:4px;font:600 15px/1 var(--cab-mono)}
.top-icon-button{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border:1px solid var(--cab-line);
  background:rgba(255,255,255,.45);
  cursor:pointer;
  font:600 12px/1 var(--cab-mono);
}
.user-menu{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:42px;
  padding:5px 7px 5px 5px;
  border:1px solid var(--cab-line);
  background:rgba(255,255,255,.45);
}
.user-avatar{
  width:31px;
  height:31px;
  display:grid;
  place-items:center;
  color:var(--cab-bone);
  background:var(--cab-ink);
  border-radius:50%;
  font:600 9px/1 var(--cab-mono);
}
.user-menu strong{display:block;font-size:14px;line-height:1}
.user-menu small{display:block;margin-top:4px;color:var(--cab-muted);font:500 8px/1 var(--cab-mono)}

.cab-content{padding:clamp(22px,3vw,38px);max-width:1600px;margin:0 auto}
.cab-panel{animation:panel-in .25s ease both}
@keyframes panel-in{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.panel-heading{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
  margin-bottom:24px;
}
.panel-kicker{
  display:block;
  margin-bottom:8px;
  color:var(--cab-muted);
  font:600 9px/1 var(--cab-mono);
  letter-spacing:.16em;
  text-transform:uppercase;
}
.panel-heading h1{
  margin:0;
  font-size:clamp(36px,4vw,60px);
  line-height:.9;
  letter-spacing:-.035em;
}
.panel-heading h1:focus{outline:none}
.panel-heading p{
  max-width:590px;
  margin:10px 0 0;
  color:var(--cab-muted);
  font-size:17px;
  line-height:1.35;
}
.heading-actions{display:flex;gap:9px;flex-wrap:wrap;justify-content:flex-end}

.cab-button{
  min-height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:10px 14px;
  border:1px solid var(--cab-ink);
  background:transparent;
  cursor:pointer;
  text-decoration:none;
  font:600 9px/1.1 var(--cab-mono);
  letter-spacing:.09em;
  text-transform:uppercase;
  transition:.14s ease;
}
.cab-button:hover,.cab-button:focus-visible{transform:translateY(-1px);box-shadow:4px 4px 0 rgba(10,9,8,.12);outline:none}
.cab-button.dark{color:var(--cab-bone);background:var(--cab-ink)}
.cab-button.light{color:var(--cab-ink);background:var(--cab-paper-3)}
.cab-button.soft{border-color:var(--cab-line-strong);background:rgba(255,255,255,.35)}
.cab-button.danger{color:var(--cab-danger);border-color:var(--cab-danger)}
.cab-button.small{min-height:34px;padding:8px 10px;font-size:8px}
.cab-button:disabled{opacity:.44;cursor:not-allowed;transform:none;box-shadow:none}

.metric-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  margin-bottom:14px;
}
.metric-card{
  position:relative;
  min-height:132px;
  padding:17px;
  overflow:hidden;
  background:rgba(255,250,240,.66);
  border:1px solid var(--cab-line);
  box-shadow:var(--cab-shadow);
}
.metric-card.dark{color:var(--cab-bone);background:var(--cab-ink)}
.metric-label{color:var(--cab-muted);font:600 8px/1 var(--cab-mono);letter-spacing:.14em;text-transform:uppercase}
.metric-card.dark .metric-label{color:rgba(255,249,235,.48)}
.metric-value{display:block;margin-top:13px;font:600 clamp(25px,2.3vw,37px)/.9 var(--cab-mono);letter-spacing:-.05em}
.metric-note{display:block;margin-top:10px;color:var(--cab-muted);font:500 10px/1.35 var(--cab-mono)}
.metric-card.dark .metric-note{color:rgba(255,249,235,.54)}
.metric-mark{position:absolute;right:11px;bottom:-13px;color:rgba(10,9,8,.05);font:700 74px/1 var(--cab-gothic)}
.metric-card.dark .metric-mark{color:rgba(255,255,255,.06)}
.metric-trend{color:var(--cab-good)}
.metric-card.dark .metric-trend{color:#b8c9bb}

.overview-grid{
  display:grid;
  grid-template-columns:minmax(0,1.55fr) minmax(300px,.85fr);
  gap:14px;
  align-items:start;
}
.stack{display:grid;gap:14px}
.cab-card{
  background:rgba(255,250,240,.67);
  border:1px solid var(--cab-line);
  box-shadow:var(--cab-shadow);
}
.card-head{
  min-height:58px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;
  padding:13px 16px;
  border-bottom:1px solid var(--cab-line);
}
.card-head h2,.card-head h3{margin:0;font-size:22px;line-height:1}
.card-head small{display:block;margin-top:5px;color:var(--cab-muted);font:500 8px/1 var(--cab-mono);letter-spacing:.08em;text-transform:uppercase}
.card-body{padding:16px}
.section-link{
  border:0;
  border-bottom:1px solid currentColor;
  padding:3px 0;
  background:transparent;
  cursor:pointer;
  color:var(--cab-muted);
  font:600 8px/1 var(--cab-mono);
  letter-spacing:.08em;
  text-transform:uppercase;
}

.nest-card{
  position:relative;
  overflow:hidden;
  color:var(--cab-bone);
  background:
    linear-gradient(90deg,rgba(5,4,3,.96),rgba(12,10,8,.88)),
    url('raven-night-office.webp') center/cover;
  border-color:#080706;
}
.nest-card::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:repeating-linear-gradient(12deg,rgba(255,255,255,.035) 0 1px,transparent 1px 8px);
}
.nest-card .card-head,.nest-card .card-body{position:relative;z-index:2}
.nest-card .card-head{border-color:rgba(255,249,235,.17)}
.nest-card .card-head small{color:rgba(255,249,235,.47)}
.status-pill{
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-height:25px;
  padding:5px 8px;
  border:1px solid currentColor;
  border-radius:999px;
  font:600 7px/1 var(--cab-mono);
  letter-spacing:.09em;
  text-transform:uppercase;
}
.status-pill::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;box-shadow:0 0 0 4px rgba(255,255,255,.06)}
.status-pill.good{color:#c5d2c7}
.status-pill.warn{color:#ddc99d}
.status-pill.muted{color:var(--cab-muted)}
.nest-top{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}
.nest-title span{display:block;color:rgba(255,249,235,.47);font:600 8px/1 var(--cab-mono);text-transform:uppercase;letter-spacing:.14em}
.nest-title strong{display:block;margin-top:8px;font-size:34px;line-height:.95}
.nest-price{text-align:right}
.nest-price strong{display:block;font:600 24px/1 var(--cab-mono)}
.nest-price small{display:block;margin-top:5px;color:rgba(255,249,235,.47);font:500 8px/1.3 var(--cab-mono)}
.resource-chips{display:flex;flex-wrap:wrap;gap:7px;margin:21px 0 18px}
.resource-chip{padding:8px 9px;border:1px solid rgba(255,249,235,.20);background:rgba(255,255,255,.035);font:500 9px/1 var(--cab-mono)}
.usage-row{margin-top:12px}
.usage-top{display:flex;justify-content:space-between;gap:12px;margin-bottom:7px;color:rgba(255,249,235,.62);font:500 8px/1 var(--cab-mono)}
.usage-track{height:6px;background:rgba(255,255,255,.12);overflow:hidden}
.usage-track i{display:block;height:100%;background:var(--cab-bone)}

.agent-list{display:grid;gap:9px}
.agent-row{
  display:grid;
  grid-template-columns:47px minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  padding:11px;
  border:1px solid var(--cab-line);
  background:rgba(255,255,255,.30);
}
.agent-seal{
  width:45px;
  height:45px;
  display:grid;
  place-items:center;
  color:var(--cab-bone);
  background:var(--cab-ink);
  border:1px solid var(--cab-ink);
  border-radius:50%;
  font:700 17px/1 var(--cab-gothic);
  box-shadow:inset 0 0 0 4px rgba(255,255,255,.06);
}
.agent-row h3{margin:0;font-size:18px;line-height:1}
.agent-row p{margin:6px 0 0;color:var(--cab-muted);font:500 9px/1.35 var(--cab-mono)}
.agent-meta{text-align:right}
.agent-meta strong{display:block;color:var(--cab-good);font:600 8px/1 var(--cab-mono);text-transform:uppercase}
.agent-meta small{display:block;margin-top:5px;color:var(--cab-muted);font:500 8px/1 var(--cab-mono)}

.approval-list{display:grid;gap:8px}
.approval-item{padding:12px;border:1px solid var(--cab-line);background:rgba(255,255,255,.30)}
.approval-item.is-resolved{opacity:.5}
.approval-kicker{display:flex;justify-content:space-between;gap:10px;color:var(--cab-warn);font:600 7px/1 var(--cab-mono);text-transform:uppercase;letter-spacing:.1em}
.approval-item h3{margin:9px 0 5px;font-size:17px;line-height:1.05}
.approval-item p{margin:0;color:var(--cab-muted);font:500 9px/1.4 var(--cab-mono)}
.approval-actions{display:flex;gap:6px;margin-top:11px;flex-wrap:wrap}

.activity-list{display:grid}
.activity-row{display:grid;grid-template-columns:54px 11px minmax(0,1fr) auto;gap:8px;align-items:start;padding:11px 0;border-bottom:1px solid var(--cab-line)}
.activity-row:last-child{border-bottom:0}
.activity-row time{color:var(--cab-muted);font:500 8px/1.3 var(--cab-mono)}
.activity-dot{width:7px;height:7px;margin-top:2px;background:var(--cab-ink);border-radius:50%;box-shadow:0 0 0 4px rgba(10,9,8,.07)}
.activity-copy strong{display:block;font-size:15px;line-height:1}
.activity-copy small{display:block;margin-top:5px;color:var(--cab-muted);font:500 8px/1.35 var(--cab-mono)}
.activity-cost{font:600 9px/1 var(--cab-mono)}

/* Fleet */
.fleet-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}
.agent-card{position:relative;overflow:hidden;min-height:275px;padding:18px;background:rgba(255,250,240,.70);border:1px solid var(--cab-line);box-shadow:var(--cab-shadow)}
.agent-card.dark{color:var(--cab-bone);background:var(--cab-ink)}
.agent-card-top{display:flex;justify-content:space-between;gap:14px;align-items:flex-start}
.agent-card .agent-seal{width:57px;height:57px;font-size:21px}
.agent-card.dark .agent-seal{color:var(--cab-ink);background:var(--cab-paper);border-color:var(--cab-paper)}
.agent-card h2{margin:21px 0 5px;font-size:27px;line-height:.95}
.agent-role{color:var(--cab-muted);font:600 8px/1 var(--cab-mono);letter-spacing:.12em;text-transform:uppercase}
.agent-card.dark .agent-role{color:rgba(255,249,235,.47)}
.agent-card p{min-height:45px;margin:13px 0;color:var(--cab-muted);font-size:15px;line-height:1.35}
.agent-card.dark p{color:rgba(255,249,235,.62)}
.agent-stats{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--cab-line);border-bottom:1px solid var(--cab-line)}
.agent-card.dark .agent-stats{border-color:rgba(255,249,235,.16)}
.agent-stats span{padding:10px 5px;text-align:center;border-right:1px solid var(--cab-line)}
.agent-card.dark .agent-stats span{border-color:rgba(255,249,235,.16)}
.agent-stats span:last-child{border-right:0}
.agent-stats b{display:block;font:600 15px/1 var(--cab-mono)}
.agent-stats small{display:block;margin-top:5px;color:var(--cab-muted);font:500 7px/1 var(--cab-mono);text-transform:uppercase}
.agent-card.dark .agent-stats small{color:rgba(255,249,235,.44)}
.agent-card-actions{display:flex;gap:7px;margin-top:15px;flex-wrap:wrap}
.agent-add{display:grid;place-items:center;text-align:center;border-style:dashed;cursor:pointer;background:rgba(255,255,255,.22)}
.agent-add-inner{max-width:220px}
.add-mark{width:54px;height:54px;display:grid;place-items:center;margin:0 auto 14px;border:1px solid var(--cab-ink);border-radius:50%;font:400 27px/1 var(--cab-mono)}
.agent-add h2{margin:0 0 8px}
.agent-add p{min-height:0;margin:0}

/* Kanban */
.kanban-wrap{overflow-x:auto;padding-bottom:7px}
.kanban-board{min-width:1060px;display:grid;grid-template-columns:repeat(4,1fr);gap:10px;align-items:start}
.kanban-column{padding:10px;background:rgba(10,9,8,.035);border:1px solid var(--cab-line)}
.kanban-column-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:4px 3px 12px;font:600 8px/1 var(--cab-mono);letter-spacing:.12em;text-transform:uppercase}
.kanban-column-head b{min-width:19px;height:19px;display:grid;place-items:center;color:var(--cab-bone);background:var(--cab-ink);border-radius:999px;font-size:8px}
.kanban-cards{display:grid;gap:8px}
.kanban-card{padding:12px;background:var(--cab-paper-3);border:1px solid var(--cab-line);box-shadow:0 8px 20px rgba(10,9,8,.06)}
.kanban-card .task-label{display:flex;justify-content:space-between;gap:8px;color:var(--cab-muted);font:600 7px/1 var(--cab-mono);text-transform:uppercase;letter-spacing:.08em}
.kanban-card h3{margin:10px 0 8px;font-size:17px;line-height:1.05}
.kanban-card p{margin:0;color:var(--cab-muted);font:500 8px/1.4 var(--cab-mono)}
.task-footer{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:11px;padding-top:9px;border-top:1px solid var(--cab-line)}
.task-owner{display:flex;align-items:center;gap:6px;color:var(--cab-muted);font:500 7px/1 var(--cab-mono)}
.task-owner i{width:20px;height:20px;display:grid;place-items:center;color:var(--cab-bone);background:var(--cab-ink);border-radius:50%;font-style:normal}
.task-cost{font:600 8px/1 var(--cab-mono)}

/* Tables and feature cards */
.data-table{width:100%;border-collapse:collapse;background:rgba(255,250,240,.65);border:1px solid var(--cab-line);box-shadow:var(--cab-shadow)}
.data-table th,.data-table td{padding:13px 14px;text-align:left;border-bottom:1px solid var(--cab-line);vertical-align:middle}
.data-table th{color:var(--cab-muted);background:rgba(10,9,8,.035);font:600 7px/1 var(--cab-mono);letter-spacing:.12em;text-transform:uppercase}
.data-table tbody tr:last-child td{border-bottom:0}
.table-title strong{display:block;font-size:16px;line-height:1}
.table-title small{display:block;margin-top:5px;color:var(--cab-muted);font:500 8px/1.3 var(--cab-mono)}
.table-mono{font:600 9px/1.3 var(--cab-mono)}
.row-actions{display:flex;justify-content:flex-end;gap:6px}
.schedule-state{display:inline-flex;align-items:center;gap:6px;font:600 7px/1 var(--cab-mono);text-transform:uppercase}
.schedule-state::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--cab-good)}
.schedule-state.paused::before{background:var(--cab-ash)}

.feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.feature-card{min-height:218px;padding:17px;background:rgba(255,250,240,.68);border:1px solid var(--cab-line);box-shadow:var(--cab-shadow)}
.feature-card-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.feature-symbol{width:39px;height:39px;display:grid;place-items:center;color:var(--cab-bone);background:var(--cab-ink);font:600 10px/1 var(--cab-mono)}
.feature-card h2{margin:17px 0 8px;font-size:24px;line-height:.95}
.feature-card p{margin:0;color:var(--cab-muted);font-size:14px;line-height:1.4}
.feature-meta{display:flex;gap:6px;flex-wrap:wrap;margin-top:16px}
.feature-meta span{padding:6px 7px;border:1px solid var(--cab-line);font:500 7px/1 var(--cab-mono);text-transform:uppercase}
.feature-footer{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:15px;padding-top:12px;border-top:1px solid var(--cab-line)}
.feature-footer small{color:var(--cab-muted);font:500 7px/1.35 var(--cab-mono)}

.lab-banner{
  position:relative;
  overflow:hidden;
  min-height:250px;
  display:grid;
  grid-template-columns:minmax(0,1.3fr) minmax(280px,.7fr);
  margin-top:14px;
  color:var(--cab-bone);
  background:var(--cab-ink);
  border:1px solid var(--cab-ink);
}
.lab-copy{padding:clamp(22px,3vw,38px);position:relative;z-index:2}
.lab-copy span{color:rgba(255,249,235,.47);font:600 8px/1 var(--cab-mono);text-transform:uppercase;letter-spacing:.16em}
.lab-copy h2{max-width:650px;margin:13px 0 12px;font-size:clamp(30px,3vw,46px);line-height:.93}
.lab-copy p{max-width:670px;margin:0 0 20px;color:rgba(255,249,235,.62);font-size:16px;line-height:1.4}
.lab-steps{display:grid;align-content:center;gap:7px;padding:22px;background:rgba(255,255,255,.035);border-left:1px solid rgba(255,249,235,.16)}
.lab-step{display:grid;grid-template-columns:27px 1fr;gap:9px;align-items:center;padding:9px;border:1px solid rgba(255,249,235,.13);font:500 8px/1.3 var(--cab-mono)}
.lab-step b{width:25px;height:25px;display:grid;place-items:center;border:1px solid rgba(255,249,235,.4);border-radius:50%;font-size:8px}

/* Knowledge, billing, control */
.split-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(300px,.7fr);gap:13px;align-items:start}
.storage-hero{padding:20px;color:var(--cab-bone);background:var(--cab-ink)}
.storage-top{display:flex;justify-content:space-between;gap:20px;align-items:flex-start}
.storage-top h2{margin:0;font-size:32px;line-height:.95}
.storage-top strong{font:600 24px/1 var(--cab-mono)}
.storage-top small{display:block;margin-top:5px;color:rgba(255,249,235,.48);font:500 8px/1 var(--cab-mono)}
.storage-track{height:12px;margin:24px 0 10px;background:rgba(255,255,255,.11);overflow:hidden}
.storage-track i{display:block;width:38%;height:100%;background:var(--cab-paper)}
.storage-legend{display:flex;flex-wrap:wrap;gap:13px;color:rgba(255,249,235,.58);font:500 8px/1 var(--cab-mono)}
.storage-legend b{color:var(--cab-bone)}
.source-list{display:grid;gap:8px}
.source-row{display:grid;grid-template-columns:38px minmax(0,1fr) auto;gap:10px;align-items:center;padding:11px;border:1px solid var(--cab-line);background:rgba(255,255,255,.28)}
.source-icon{width:36px;height:36px;display:grid;place-items:center;color:var(--cab-bone);background:var(--cab-ink);font:600 8px/1 var(--cab-mono)}
.source-row strong{display:block;font-size:16px;line-height:1}
.source-row small{display:block;margin-top:5px;color:var(--cab-muted);font:500 8px/1.3 var(--cab-mono)}
.source-state{text-align:right;font:600 7px/1.4 var(--cab-mono);text-transform:uppercase;color:var(--cab-good)}

.a2a-contract{padding:18px;color:var(--cab-bone);background:var(--cab-ink)}
.contract-parties{display:grid;grid-template-columns:1fr 52px 1fr;align-items:center;gap:10px;text-align:center}
.contract-party{padding:13px;border:1px solid rgba(255,249,235,.16)}
.contract-party strong{display:block;font-size:19px;line-height:1}
.contract-party small{display:block;margin-top:6px;color:rgba(255,249,235,.48);font:500 8px/1 var(--cab-mono)}
.contract-link{width:50px;height:1px;background:rgba(255,249,235,.42);position:relative}
.contract-link::before,.contract-link::after{content:"";position:absolute;top:-3px;width:7px;height:7px;border:1px solid var(--cab-bone);border-radius:50%}
.contract-link::before{left:0}.contract-link::after{right:0}
.contract-terms{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:14px}
.contract-term{padding:10px;border:1px solid rgba(255,249,235,.13)}
.contract-term span{display:block;color:rgba(255,249,235,.44);font:600 7px/1 var(--cab-mono);text-transform:uppercase;letter-spacing:.1em}
.contract-term strong{display:block;margin-top:6px;font-size:15px;line-height:1.15}

.billing-hero{display:grid;grid-template-columns:minmax(280px,.8fr) minmax(0,1.2fr);color:var(--cab-bone);background:var(--cab-ink);border:1px solid var(--cab-ink);box-shadow:var(--cab-shadow)}
.balance-block{padding:clamp(22px,3vw,38px);border-right:1px solid rgba(255,249,235,.16)}
.balance-block span{color:rgba(255,249,235,.45);font:600 8px/1 var(--cab-mono);letter-spacing:.14em;text-transform:uppercase}
.balance-block strong{display:block;margin:15px 0 8px;font:600 clamp(39px,5vw,64px)/.85 var(--cab-mono);letter-spacing:-.07em}
.balance-block p{margin:0;color:rgba(255,249,235,.55);font:500 9px/1.4 var(--cab-mono)}
.balance-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:22px}
.spend-breakdown{padding:clamp(22px,3vw,34px)}
.spend-breakdown h2{margin:0 0 18px;font-size:28px;line-height:1}
.spend-row{display:grid;grid-template-columns:minmax(130px,.6fr) minmax(120px,1fr) 75px;gap:12px;align-items:center;margin:13px 0}
.spend-row span{font:500 9px/1.2 var(--cab-mono)}
.spend-bar{height:7px;background:rgba(255,255,255,.1);overflow:hidden}
.spend-bar i{display:block;height:100%;background:var(--cab-paper)}
.spend-row strong{text-align:right;font:600 10px/1 var(--cab-mono)}

.audit-list{display:grid}
.audit-row{display:grid;grid-template-columns:72px 34px minmax(0,1fr) auto;gap:11px;align-items:start;padding:13px 0;border-bottom:1px solid var(--cab-line)}
.audit-row:last-child{border-bottom:0}
.audit-row time{color:var(--cab-muted);font:500 8px/1.4 var(--cab-mono)}
.audit-icon{width:31px;height:31px;display:grid;place-items:center;color:var(--cab-bone);background:var(--cab-ink);font:600 8px/1 var(--cab-mono)}
.audit-copy strong{display:block;font-size:16px;line-height:1.05}
.audit-copy small{display:block;margin-top:5px;color:var(--cab-muted);font:500 8px/1.4 var(--cab-mono)}
.audit-cost{font:600 9px/1 var(--cab-mono)}

/* Dialog and toast */
.cab-dialog{width:min(560px,calc(100% - 26px));padding:0;border:1px solid var(--cab-ink);background:var(--cab-paper-2);box-shadow:0 35px 100px rgba(0,0,0,.42)}
.cab-dialog::backdrop{background:rgba(5,4,3,.76);backdrop-filter:blur(5px)}
.dialog-head{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:17px 19px;color:var(--cab-bone);background:var(--cab-ink)}
.dialog-head h2{margin:0;font-size:26px;line-height:1}
.dialog-close{width:34px;height:34px;border:1px solid rgba(255,249,235,.35);color:var(--cab-bone);background:transparent;cursor:pointer;font:500 13px/1 var(--cab-mono)}
.dialog-body{padding:20px}
.dialog-body p{margin:0 0 18px;color:var(--cab-muted);font-size:15px;line-height:1.4}
.field{display:grid;gap:7px;margin-bottom:13px}
.field label{font:600 8px/1 var(--cab-mono);text-transform:uppercase;letter-spacing:.12em}
.field input,.field select,.field textarea{width:100%;min-height:43px;padding:10px 11px;border:1px solid var(--cab-line-strong);background:var(--cab-paper-3);outline:none}
.field textarea{min-height:88px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{box-shadow:0 0 0 2px rgba(10,9,8,.12)}
.dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}
.cab-toast{
  position:fixed;
  z-index:1100;
  right:22px;
  bottom:22px;
  width:min(370px,calc(100% - 44px));
  padding:14px 16px;
  color:var(--cab-bone);
  background:var(--cab-ink);
  border:1px solid rgba(255,249,235,.24);
  box-shadow:0 18px 55px rgba(0,0,0,.3);
  opacity:0;
  transform:translateY(12px);
  pointer-events:none;
  transition:.2s ease;
}
.cab-toast.is-visible{opacity:1;transform:none}
.cab-toast strong{display:block;font-size:17px;line-height:1}
.cab-toast span{display:block;margin-top:6px;color:rgba(255,249,235,.58);font:500 8px/1.45 var(--cab-mono)}
.mobile-scrim{display:none}

@media (max-width:1180px){
  .metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .overview-grid,.split-grid{grid-template-columns:1fr}
  .fleet-grid,.feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lab-banner{grid-template-columns:1fr}
  .lab-steps{border-left:0;border-top:1px solid rgba(255,249,235,.16)}
  .billing-hero{grid-template-columns:1fr}
  .balance-block{border-right:0;border-bottom:1px solid rgba(255,249,235,.16)}
}

@media (max-width:900px){
  .cab-shell{grid-template-columns:1fr}
  .cab-sidebar{transform:translateX(-105%);transition:.2s ease;box-shadow:24px 0 80px rgba(0,0,0,.35)}
  body.is-menu-open .cab-sidebar{transform:none}
  .cab-main{grid-column:1}
  .mobile-menu{display:grid;place-items:center}
  .mobile-scrim{display:block;position:fixed;z-index:280;inset:30px 0 0;background:rgba(5,4,3,.58);opacity:0;pointer-events:none;transition:.2s ease}
  body.is-menu-open .mobile-scrim{opacity:1;pointer-events:auto}
  body.is-menu-open{overflow:hidden}
  .top-balance{display:none}
  .cab-topbar{top:30px}
  .fleet-grid,.feature-grid{grid-template-columns:1fr 1fr}
}

@media (max-width:640px){
  .demo-ribbon{font-size:7px;letter-spacing:.11em}
  .cab-topbar{min-height:62px;padding:10px 13px}
  .breadcrumb strong{font-size:17px}
  .top-icon-button{display:none}
  .user-menu{border:0;background:transparent;padding:0}
  .user-menu>span:last-child{display:none}
  .cab-content{padding:20px 12px 36px}
  .panel-heading{align-items:flex-start;flex-direction:column;margin-bottom:18px}
  .panel-heading h1{font-size:39px}
  .panel-heading p{font-size:15px}
  .heading-actions{width:100%;justify-content:flex-start}
  .heading-actions .cab-button{flex:1 1 auto}
  .metric-grid{grid-template-columns:1fr 1fr;gap:8px}
  .metric-card{min-height:112px;padding:13px}
  .metric-value{font-size:22px}
  .metric-note{font-size:8px}
  .card-head{padding:12px}
  .card-body{padding:12px}
  .nest-top{flex-direction:column}
  .nest-price{text-align:left}
  .agent-row{grid-template-columns:42px minmax(0,1fr)}
  .agent-seal{width:40px;height:40px}
  .agent-meta{grid-column:2;text-align:left}
  .fleet-grid,.feature-grid{grid-template-columns:1fr}
  .data-table,.data-table tbody,.data-table tr,.data-table td{display:block;width:100%}
  .data-table thead{display:none}
  .data-table tr{padding:12px;border-bottom:1px solid var(--cab-line)}
  .data-table td{padding:5px 0;border:0}
  .data-table td::before{content:attr(data-label);display:block;margin-bottom:4px;color:var(--cab-muted);font:600 7px/1 var(--cab-mono);text-transform:uppercase;letter-spacing:.1em}
  .row-actions{justify-content:flex-start;margin-top:6px}
  .storage-top{flex-direction:column}
  .contract-parties{grid-template-columns:1fr}
  .contract-link{width:1px;height:29px;margin:auto}
  .contract-link::before,.contract-link::after{left:-3px}
  .contract-link::before{top:0}.contract-link::after{top:auto;bottom:0}
  .contract-terms{grid-template-columns:1fr}
  .spend-row{grid-template-columns:1fr 63px}
  .spend-bar{grid-column:1/-1;grid-row:2}
  .audit-row{grid-template-columns:54px 29px minmax(0,1fr)}
  .audit-cost{grid-column:3}
  .activity-row{grid-template-columns:46px 8px minmax(0,1fr)}
  .activity-cost{grid-column:3}
  .cab-toast{right:12px;bottom:12px;width:calc(100% - 24px)}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}
}
