:root{
    --fg:#0B1315; --fg-soft:#54615E; --fg-faint:#8A9793;
    --bg:#FBFCFC; --surface:#FFFFFF; --surface-2:#F3F6F6;
    --line:#E0E6E5;
    --accent:#12796B; --accent-ink:#FFFFFF; --accent-soft:#12796B14;
    --good:#2E7D5B; --warn:#A97514; --thin:#A8502A;
    --shadow:0 1px 0 #FFFFFF, 0 14px 36px -26px #0B131533;
    --mono:ui-monospace,"SF Mono",SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
    --sans:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  }
  @media (prefers-color-scheme:dark){
    :root{
      --fg:#E7EAE8; --fg-soft:#93A09C; --fg-faint:#66736F;
      --bg:#0B1315; --surface:#111B1E; --surface-2:#18262A;
      --line:#22343A;
      --accent:#2FBFA8; --accent-ink:#06211D; --accent-soft:#2FBFA81F;
      --good:#3FBF86; --warn:#D9A441; --thin:#D2704A;
      --shadow:0 18px 44px -30px #000000CC;
    }
  }
  :root[data-theme="dark"]{
    --fg:#E7EAE8; --fg-soft:#93A09C; --fg-faint:#66736F;
    --bg:#0B1315; --surface:#111B1E; --surface-2:#18262A;
    --line:#22343A;
    --accent:#2FBFA8; --accent-ink:#06211D; --accent-soft:#2FBFA81F;
    --good:#3FBF86; --warn:#D9A441; --thin:#D2704A;
    --shadow:0 18px 44px -30px #000000CC;
  }
  :root[data-theme="light"]{
    --fg:#0B1315; --fg-soft:#54615E; --fg-faint:#8A9793;
    --bg:#FBFCFC; --surface:#FFFFFF; --surface-2:#F3F6F6;
    --line:#E0E6E5;
    --accent:#12796B; --accent-ink:#FFFFFF; --accent-soft:#12796B14;
    --good:#2E7D5B; --warn:#A97514; --thin:#A8502A;
    --shadow:0 1px 0 #FFFFFF, 0 14px 36px -26px #0B131533;
  }

  *{box-sizing:border-box;}
  body{
    margin:0; background:var(--bg); color:var(--fg);
    font-family:var(--sans); font-size:16px; line-height:1.55;
    -webkit-font-smoothing:antialiased;
  }
  .wrap{max-width:1180px; margin:0 auto; padding:0 24px;}

  .eyebrow{
    font-family:var(--mono); font-size:11px; letter-spacing:.16em;
    text-transform:uppercase; color:var(--fg-soft);
  }

  /* ── banner ── */
  .notice{
    background:var(--accent-soft); border-bottom:1px solid var(--line);
    font-family:var(--mono); font-size:11px; letter-spacing:.1em;
    text-transform:uppercase; color:var(--fg-soft);
  }
  .notice .wrap{display:flex; gap:12px; align-items:center; padding-block:9px; flex-wrap:wrap;}
  .notice b{color:var(--fg); font-weight:600;}

  /* ── masthead ── */
  header.top{border-bottom:1px solid var(--line);}
  header.top .wrap{display:flex; align-items:center; gap:18px; padding-block:13px; flex-wrap:wrap;}
  .mark{display:flex; align-items:center; gap:12px; margin-right:auto;}
  .mark .logo{width:44px; height:44px; display:block; flex:none;}
  .mark .wm{display:flex; flex-direction:column; line-height:1.08;}
  .mark .cm{
    font-family:var(--mono); font-weight:700; letter-spacing:-.01em;
    font-size:15px; color:var(--fg);
  }
  .mark .me{
    font-family:var(--mono); font-size:10px; letter-spacing:.22em;
    text-transform:uppercase; color:var(--accent);
  }
  nav.top-nav{display:flex; gap:20px; flex-wrap:wrap;}
  nav.top-nav a{
    font-family:var(--mono); font-size:12px; letter-spacing:.06em;
    color:var(--fg-soft); text-decoration:none; padding:4px 0;
    border-bottom:1px solid transparent;
  }
  nav.top-nav a:hover, nav.top-nav a:focus-visible{color:var(--fg); border-bottom-color:var(--accent);}

  /* ── hero ── */
  .hero{padding-block:30px 24px;}
  .hero h1{
    margin:9px 0 0; font-size:clamp(31px,4.6vw,56px); line-height:1.03;
    letter-spacing:-.035em; font-weight:600; text-wrap:balance; max-width:15ch;
  }
  .hero h1 em{font-style:normal; color:var(--accent);}
  .hero .lede{
    margin:14px 0 0; max-width:62ch; color:var(--fg-soft); font-size:16px;
  }

  /* ── KPI board ── */
  .board{
    display:grid; gap:1px; background:var(--line);
    border:1px solid var(--line); margin-top:22px;
    grid-template-columns:repeat(3,1fr);
  }
  .cell{background:var(--surface); padding:20px 20px 18px;}
  .cell .k-label{
    font-family:var(--mono); font-size:11px; letter-spacing:.14em;
    text-transform:uppercase; color:var(--fg-soft); display:block;
  }
  .cell .k-num{
    font-family:var(--mono); font-weight:700; font-variant-numeric:tabular-nums;
    font-size:clamp(27px,3.6vw,44px); letter-spacing:-.04em; line-height:1;
    margin-top:10px; color:var(--fg);
  }
  .cell .k-sub{margin-top:8px; font-size:12.5px; color:var(--fg-soft);}
  .spark{display:block; width:100%; height:28px; margin-top:12px;}

  /* ── sections ── */
  section{padding-block:56px; border-top:1px solid var(--line);}
  .sec-head{display:flex; align-items:baseline; gap:16px; flex-wrap:wrap; margin-bottom:8px;}
  .sec-head h2{
    margin:0; font-size:clamp(22px,2.6vw,30px); letter-spacing:-.02em;
    font-weight:600;
  }
  .sec-head p{margin:0; color:var(--fg-soft); font-size:14px; max-width:52ch;}

  .products{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); margin-top:28px;}
  .prod{background:var(--surface); padding:26px 22px 24px; display:flex; flex-direction:column; gap:12px;}
  .prod .name{
    font-family:var(--mono); font-size:12px; letter-spacing:.2em;
    text-transform:uppercase; color:var(--accent);
  }
  .prod h3{margin:0; font-size:20px; letter-spacing:-.015em; font-weight:600;}
  .prod p{margin:0; font-size:14px; color:var(--fg-soft);}
  .prod ul{margin:4px 0 0; padding-left:0; list-style:none; display:flex; flex-direction:column; gap:7px;}
  .prod li{font-size:13px; color:var(--fg-soft); display:flex; gap:9px; align-items:flex-start;}
  .prod li::before{
    content:""; width:5px; height:5px; margin-top:7px; flex:none;
    background:var(--accent); border-radius:50%;
  }

  /* ── valuation ── */
  .val{
    margin-top:28px; border:1px solid var(--line); background:var(--surface);
    box-shadow:var(--shadow); display:grid; grid-template-columns:1.15fr 1fr;
  }
  .val-main{padding:30px 28px;}
  .val-side{padding:30px 28px; border-left:1px solid var(--line); background:var(--surface-2);}
  .val .car{font-size:21px; font-weight:600; letter-spacing:-.015em; margin:10px 0 4px;}
  .val .specs{
    font-family:var(--mono); font-size:12px; color:var(--fg-soft);
    letter-spacing:.04em; display:flex; gap:8px; flex-wrap:wrap;
  }
  .val .specs span::after{content:" ·"; color:var(--fg-faint);}
  .val .specs span:last-child::after{content:"";}
  .price{
    font-family:var(--mono); font-weight:700; font-variant-numeric:tabular-nums;
    font-size:clamp(34px,5vw,54px); letter-spacing:-.04em; line-height:1;
    margin-top:24px;
  }
  .price small{font-size:.42em; letter-spacing:.12em; color:var(--fg-soft); font-weight:500; margin-right:10px;}
  .interval-label{
    font-family:var(--mono); font-size:11px; letter-spacing:.14em;
    text-transform:uppercase; color:var(--fg-soft); margin-top:26px;
  }
  .dist{display:block; width:100%; height:92px; margin-top:12px;}
  .ticks{
    display:flex; justify-content:space-between; font-family:var(--mono);
    font-size:11px; color:var(--fg-soft); font-variant-numeric:tabular-nums; margin-top:6px;
  }
  .readout{display:flex; flex-direction:column; gap:16px;}
  .readout .row{display:flex; justify-content:space-between; gap:14px; align-items:baseline; border-bottom:1px dotted var(--line); padding-bottom:11px;}
  .readout .rk{font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--fg-soft);}
  .readout .rv{font-family:var(--mono); font-size:14px; font-variant-numeric:tabular-nums; color:var(--fg);}
  .pill{
    display:inline-flex; align-items:center; gap:7px; font-family:var(--mono);
    font-size:11px; letter-spacing:.1em; text-transform:uppercase;
    padding:4px 9px; border:1px solid currentColor; border-radius:2px;
  }
  .pill.good{color:var(--good);} .pill.warn{color:var(--warn);} .pill.thin{color:var(--thin);}
  .note{margin-top:20px; font-size:13px; color:var(--fg-soft); line-height:1.6;}

  /* ── coverage ── */
  .cov{display:grid; grid-template-columns:repeat(6,1fr); gap:1px; background:var(--line); border:1px solid var(--line); margin-top:28px;}
  .cov div{background:var(--surface); padding:18px 16px;}
  .cov .m{font-family:var(--mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--fg-soft);}
  .cov .n{font-family:var(--mono); font-size:22px; font-weight:700; font-variant-numeric:tabular-nums; letter-spacing:-.03em; margin-top:8px;}
  .bar{height:3px; background:var(--line); margin-top:10px;}
  .bar i{display:block; height:100%; background:var(--accent);}

  /* ── feed ── */
  .feed{margin-top:28px; border:1px solid var(--line); background:var(--surface); max-height:260px; overflow-y:auto;}
  .feed .fr{display:grid; grid-template-columns:88px 1fr auto; gap:14px; padding:11px 18px; border-bottom:1px solid var(--line); font-size:13px; align-items:center;}
  .feed .fr:last-child{border-bottom:none;}
  .feed .t{font-family:var(--mono); font-size:11px; color:var(--fg-faint); font-variant-numeric:tabular-nums;}
  .feed .src{font-family:var(--mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--accent);}

  footer{border-top:1px solid var(--line); padding-block:34px 46px; color:var(--fg-soft); font-size:13px;}
  footer .wrap{display:flex; gap:26px; flex-wrap:wrap; align-items:baseline;}
  footer a{color:var(--fg-soft); text-decoration:none; border-bottom:1px solid var(--line);}
  footer a:hover, footer a:focus-visible{color:var(--fg); border-bottom-color:var(--accent);}
  footer .sp{margin-left:auto; font-family:var(--mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase;}

  a:focus-visible, button:focus-visible{outline:2px solid var(--accent); outline-offset:3px;}

  @media (max-width:900px){
    .board, .products{grid-template-columns:1fr;}
    .val{grid-template-columns:1fr;}
    .val-side{border-left:none; border-top:1px solid var(--line);}
    .cov{grid-template-columns:repeat(3,1fr);}
  }
  @media (max-width:560px){
    .cov{grid-template-columns:repeat(2,1fr);}
    .feed .fr{grid-template-columns:70px 1fr; }
    .feed .fr .src{grid-column:2; }
  }
  @media (prefers-reduced-motion:reduce){
    *{animation:none !important; transition:none !important;}
  }
  .page-head{padding-block:30px 6px;}
  .page-head h1{margin:8px 0 0; font-size:clamp(30px,4.2vw,50px); letter-spacing:-.035em;
                font-weight:600; line-height:1.03;}
  .page-head p{margin:12px 0 0; max-width:64ch; color:var(--fg-soft);}

  .board{display:grid; gap:1px; background:var(--line); border:1px solid var(--line);
         margin-top:22px; grid-template-columns:repeat(3,1fr);}
  .cell{background:var(--surface); padding:20px 20px 18px;}
  .cell .k-label{font-family:var(--mono); font-size:11px; letter-spacing:.14em;
                 text-transform:uppercase; color:var(--fg-soft); display:block;}
  .cell .k-num{font-family:var(--mono); font-weight:700; font-variant-numeric:tabular-nums;
               font-size:clamp(27px,3.6vw,44px); letter-spacing:-.04em; line-height:1;
               margin-top:10px; color:var(--fg);}
  .cell .k-sub{margin-top:8px; font-size:12.5px; color:var(--fg-soft);}

  #view-databases section, #view-harvest section{padding-block:44px; border-top:1px solid var(--line); margin-top:44px;}
  #view-databases section:first-of-type{margin-top:36px;}
  .sec-head{display:flex; align-items:baseline; gap:16px; flex-wrap:wrap; margin-bottom:6px;}
  .sec-head h2{margin:0; font-size:clamp(21px,2.4vw,28px); letter-spacing:-.02em; font-weight:600;}
  .sec-head p{margin:0; color:var(--fg-soft); font-size:14px; max-width:54ch;}

  /* channel split */
  .libs{display:grid; grid-template-columns:repeat(2,1fr); gap:1px;
        background:var(--line); border:1px solid var(--line); margin-top:24px;}
  .lib{background:var(--surface); padding:24px 22px; display:flex; flex-direction:column; gap:14px;}
  .lib .name{font-family:var(--mono); font-size:12px; letter-spacing:.2em;
             text-transform:uppercase; color:var(--accent);}
  .lib .big{font-family:var(--mono); font-weight:700; font-variant-numeric:tabular-nums;
            font-size:clamp(28px,3.4vw,40px); letter-spacing:-.04em; line-height:1;}
  .meter{height:6px; background:var(--surface-2); display:flex; overflow:hidden;}
  .meter i{display:block; height:100%;}
  .meter .v{background:var(--accent);}
  .meter .u{background:var(--warn); opacity:.55;}
  .legend{display:flex; gap:18px; flex-wrap:wrap; font-family:var(--mono);
          font-size:11px; letter-spacing:.06em; color:var(--fg-soft);}
  .legend span{display:flex; align-items:center; gap:7px;}
  .legend i{width:9px; height:9px; flex:none;}

  /* import */
  .import{margin-top:24px; border:1px solid var(--line); background:var(--surface);
          box-shadow:var(--shadow); padding:26px 24px;}
  .field{display:flex; flex-direction:column; gap:8px; margin-top:18px;}
  .field label{font-family:var(--mono); font-size:11px; letter-spacing:.14em;
               text-transform:uppercase; color:var(--fg-soft);}
  .field input, .field textarea, .field select{
    font-family:var(--mono); font-size:13px; color:var(--fg); background:var(--bg);
    border:1px solid var(--line); padding:11px 12px; width:100%;
  }
  .field textarea{min-height:132px; resize:vertical; line-height:1.6;}
  .field input::placeholder, .field textarea::placeholder{color:var(--fg-faint);}
  .row2{display:grid; grid-template-columns:2fr 1fr; gap:18px;}
  .drop{border:1px dashed var(--line); background:var(--surface-2); padding:14px 16px;
        font-size:13px; color:var(--fg-soft); margin-top:8px;}
  .actions{display:flex; gap:12px; align-items:center; flex-wrap:wrap; margin-top:20px;}
  .btn{font-family:var(--mono); font-size:12px; letter-spacing:.1em; text-transform:uppercase;
       padding:11px 18px; border:1px solid var(--accent); background:var(--accent);
       color:var(--accent-ink); cursor:pointer;}
  .btn.ghost{background:transparent; color:var(--fg); border-color:var(--line);}
  .btn:hover{filter:brightness(1.08);}
  .hint{font-size:12.5px; color:var(--fg-soft);}

  /* directories */
  .dirs{margin-top:24px; border:1px solid var(--line); background:var(--surface); overflow-x:auto;}
  table{border-collapse:collapse; width:100%; min-width:760px;}
  th{font-family:var(--mono); font-size:10px; letter-spacing:.14em; text-transform:uppercase;
     color:var(--fg-soft); text-align:left; font-weight:500; padding:12px 16px;
     border-bottom:1px solid var(--line); background:var(--surface-2); white-space:nowrap;}
  td{padding:14px 16px; border-bottom:1px solid var(--line); font-size:14px; vertical-align:middle;}
  tr:last-child td{border-bottom:none;}
  td.num{font-family:var(--mono); font-variant-numeric:tabular-nums; text-align:right; white-space:nowrap;}
  .dname{font-weight:600;}
  .dsrc{font-family:var(--mono); font-size:11px; letter-spacing:.06em; color:var(--fg-faint);
        text-transform:uppercase; margin-top:3px;}
  .chip{display:inline-flex; align-items:center; gap:6px; font-family:var(--mono);
        font-size:10.5px; letter-spacing:.1em; text-transform:uppercase;
        padding:3px 8px; border:1px solid currentColor; white-space:nowrap;}
  .chip.email{color:var(--accent);} .chip.wa{color:var(--good);} .chip.both{color:var(--fg-soft);}
  .ratio{font-family:var(--mono); font-variant-numeric:tabular-nums; font-size:13px;}
  .ratio b{font-weight:700;} .ratio span{color:var(--fg-faint);}
  .tbar{height:3px; background:var(--surface-2); margin-top:6px; width:88px;}
  .tbar i{display:block; height:100%; background:var(--accent);}
  .exp{font-family:var(--mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase;
       color:var(--accent); text-decoration:none; border:1px solid var(--line); padding:6px 10px;
       white-space:nowrap; display:inline-block;}
  .exp:hover{border-color:var(--accent);}

  .callout{margin-top:24px; border:1px solid var(--line); border-left:3px solid var(--warn);
           background:var(--surface); padding:18px 20px; font-size:14px; color:var(--fg-soft);}
  .callout b{color:var(--fg);}

  footer{border-top:1px solid var(--line); padding-block:34px 46px; color:var(--fg-soft); font-size:13px; margin-top:44px;}
  footer .wrap{display:flex; gap:26px; flex-wrap:wrap; align-items:baseline;}
  footer a{color:var(--fg-soft); text-decoration:none; border-bottom:1px solid var(--line);}
  footer a:hover{color:var(--fg); border-bottom-color:var(--accent);}
  footer .sp{margin-left:auto; font-family:var(--mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase;}

  a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible{
    outline:2px solid var(--accent); outline-offset:2px;}

  @media (max-width:900px){
    .board{grid-template-columns:1fr;} .libs{grid-template-columns:1fr;} .row2{grid-template-columns:1fr;}
  }
  @media (prefers-reduced-motion:reduce){*{animation:none !important; transition:none !important;}}
  .page-head{padding-block:30px 6px;}
  .page-head h1{margin:8px 0 0; font-size:clamp(30px,4.2vw,50px); letter-spacing:-.035em;
                font-weight:600; line-height:1.03;}
  .page-head p{margin:12px 0 0; max-width:64ch; color:var(--fg-soft);}

  /* harvest cards */
  .rigs{display:grid; grid-template-columns:repeat(2,1fr); gap:1px;
        background:var(--line); border:1px solid var(--line); margin-top:26px;}
  .rig{background:var(--surface); padding:24px 22px; display:flex; flex-direction:column; gap:14px;}
  .rig .name{font-family:var(--mono); font-size:12px; letter-spacing:.2em;
             text-transform:uppercase; color:var(--accent);}
  .rig h3{margin:0; font-size:20px; letter-spacing:-.015em; font-weight:600;}
  .rig p.d{margin:0; font-size:14px; color:var(--fg-soft);}
  .scope{display:flex; gap:10px; flex-wrap:wrap;}
  .scope select{font-family:var(--mono); font-size:12px; color:var(--fg); background:var(--bg);
                border:1px solid var(--line); padding:9px 10px; flex:1; min-width:130px;}
  .runline{display:flex; gap:12px; align-items:center; flex-wrap:wrap;}
  .btn{font-family:var(--mono); font-size:12px; letter-spacing:.1em; text-transform:uppercase;
       padding:11px 18px; border:1px solid var(--accent); background:var(--accent);
       color:var(--accent-ink); cursor:pointer;}
  .btn:hover:not(:disabled){filter:brightness(1.08);}
  .btn:disabled{opacity:.45; cursor:not-allowed;}
  .btn.stop{background:transparent; color:var(--thin); border-color:var(--thin);}
  .state{font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase;
         color:var(--fg-soft); display:flex; align-items:center; gap:8px;}
  .dot{width:8px; height:8px; border-radius:50%; background:var(--fg-faint); flex:none;}
  .state.on .dot{background:var(--accent); animation:pulse 1.4s ease-in-out infinite;}
  .state.on{color:var(--accent);}
  @keyframes pulse{0%,100%{opacity:1;} 50%{opacity:.25;}}

  .prog{height:4px; background:var(--surface-2); overflow:hidden;}
  .prog i{display:block; height:100%; width:0; background:var(--accent); transition:width .35s ease;}
  .counts{display:grid; grid-template-columns:repeat(3,1fr); gap:12px;}
  .counts div{border-top:1px solid var(--line); padding-top:10px;}
  .counts .cl{font-family:var(--mono); font-size:10px; letter-spacing:.12em;
              text-transform:uppercase; color:var(--fg-soft);}
  .counts .cv{font-family:var(--mono); font-size:20px; font-weight:700;
              font-variant-numeric:tabular-nums; letter-spacing:-.03em; margin-top:4px;}

  #view-databases section, #view-harvest section{padding-block:44px; border-top:1px solid var(--line); margin-top:44px;}
  .sec-head{display:flex; align-items:baseline; gap:16px; flex-wrap:wrap; margin-bottom:6px;}
  .sec-head h2{margin:0; font-size:clamp(21px,2.4vw,28px); letter-spacing:-.02em; font-weight:600;}
  .sec-head p{margin:0; color:var(--fg-soft); font-size:14px; max-width:54ch;}

  /* log */
  .log{margin-top:22px; border:1px solid var(--line); background:var(--surface);
       height:300px; overflow-y:auto; font-family:var(--mono); font-size:12.5px;}
  .log .ln{display:grid; grid-template-columns:76px 84px 1fr; gap:14px;
           padding:9px 16px; border-bottom:1px solid var(--line); align-items:baseline;}
  .log .ln:last-child{border-bottom:none;}
  .log .t{color:var(--fg-faint); font-variant-numeric:tabular-nums;}
  .log .src{letter-spacing:.08em; text-transform:uppercase; font-size:10.5px;}
  .log .src.dealer{color:var(--accent);} .log .src.listing{color:var(--good);}
  .log .src.system{color:var(--fg-faint);} .log .src.warn{color:var(--warn);}
  .log .msg{color:var(--fg-soft); word-break:break-word;}
  .log .empty{padding:26px 16px; color:var(--fg-faint); text-align:center;}

  /* sources */
  .srcs{display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
        background:var(--line); border:1px solid var(--line); margin-top:24px;}
  .srcs div{background:var(--surface); padding:18px 16px;}
  .srcs .sn{font-family:var(--mono); font-size:12px; letter-spacing:.08em; color:var(--fg);}
  .srcs .ss{font-family:var(--mono); font-size:10px; letter-spacing:.12em;
            text-transform:uppercase; margin-top:8px; display:flex; align-items:center; gap:7px;}
  .srcs .ss.ok{color:var(--good);} .srcs .ss.slow{color:var(--warn);} .srcs .ss.off{color:var(--fg-faint);}
  .srcs .ss i{width:7px; height:7px; border-radius:50%; background:currentColor; flex:none;}
  .srcs .sm{font-size:12px; color:var(--fg-soft); margin-top:8px;}

  .dirs{margin-top:24px; border:1px solid var(--line); background:var(--surface); overflow-x:auto;}
  table{border-collapse:collapse; width:100%; min-width:700px;}
  th{font-family:var(--mono); font-size:10px; letter-spacing:.14em; text-transform:uppercase;
     color:var(--fg-soft); text-align:left; font-weight:500; padding:12px 16px;
     border-bottom:1px solid var(--line); background:var(--surface-2); white-space:nowrap;}
  td{padding:13px 16px; border-bottom:1px solid var(--line); font-size:14px;}
  tr:last-child td{border-bottom:none;}
  td.num{font-family:var(--mono); font-variant-numeric:tabular-nums; text-align:right; white-space:nowrap;}
  .pill{display:inline-flex; align-items:center; gap:6px; font-family:var(--mono);
        font-size:10.5px; letter-spacing:.1em; text-transform:uppercase;
        padding:3px 8px; border:1px solid currentColor; white-space:nowrap;}
  .pill.done{color:var(--good);} .pill.part{color:var(--warn);} .pill.fail{color:var(--thin);}

  .callout{margin-top:24px; border:1px solid var(--line); border-left:3px solid var(--warn);
           background:var(--surface); padding:18px 20px; font-size:14px; color:var(--fg-soft);}
  .callout b{color:var(--fg);}

  footer{border-top:1px solid var(--line); padding-block:34px 46px; color:var(--fg-soft);
         font-size:13px; margin-top:44px;}
  footer .wrap{display:flex; gap:26px; flex-wrap:wrap; align-items:baseline;}
  footer a{color:var(--fg-soft); text-decoration:none; border-bottom:1px solid var(--line);}
  footer a:hover{color:var(--fg); border-bottom-color:var(--accent);}
  footer .sp{margin-left:auto; font-family:var(--mono); font-size:11px;
             letter-spacing:.1em; text-transform:uppercase;}

  a:focus-visible, button:focus-visible, select:focus-visible{outline:2px solid var(--accent); outline-offset:2px;}

  @media (max-width:900px){ .rigs{grid-template-columns:1fr;} .srcs{grid-template-columns:repeat(2,1fr);} }
  @media (max-width:560px){ .log .ln{grid-template-columns:64px 1fr;} .log .ln .msg{grid-column:1 / -1;} }
  @media (prefers-reduced-motion:reduce){ *{animation:none !important; transition:none !important;} }

  /* ── in-page views: one document, no new tabs ── */
  .view{display:none;}
  .view.active{display:block;}
  nav.top-nav a{cursor:pointer;}
  .stub{padding-block:72px 90px; text-align:left;}
  .stub h1{margin:10px 0 0; font-size:clamp(28px,3.8vw,44px); letter-spacing:-.03em; font-weight:600;}
  .stub p{margin:14px 0 0; max-width:58ch; color:var(--fg-soft);}

  /* ── guide price workbench ── */
  .wb{display:grid; grid-template-columns:300px 1fr; gap:1px; background:var(--line);
      border:1px solid var(--line); margin-top:24px;}
  .wb-controls{background:var(--surface-2); padding:24px 22px; display:flex; flex-direction:column; gap:16px;}
  .wb-result{background:var(--surface); padding:26px 26px 24px;}
  .wb .field{gap:7px; margin:0;}
  .wb .field label{display:flex; justify-content:space-between; gap:10px; align-items:baseline;}
  .wb .tab{font-family:var(--mono); font-variant-numeric:tabular-nums; color:var(--fg); letter-spacing:0;
           text-transform:none; font-size:12px;}
  .wb input[type=range]{-webkit-appearance:none; appearance:none; width:100%; height:3px;
    background:var(--line); padding:0; border:none; outline-offset:6px;}
  .wb input[type=range]::-webkit-slider-thumb{-webkit-appearance:none; appearance:none;
    width:15px; height:15px; border-radius:50%; background:var(--accent); cursor:pointer; border:none;}
  .wb input[type=range]::-moz-range-thumb{width:15px; height:15px; border-radius:50%;
    background:var(--accent); cursor:pointer; border:none;}
  #g-canvas{display:block; width:100%; height:200px; margin-top:14px;}
  #view-guide .price{margin-top:16px;}
  #view-guide .note b{color:var(--fg);}
  #view-guide .pill{font-size:10px; padding:2px 7px; vertical-align:middle;}

  .effects{display:grid; grid-template-columns:repeat(5,1fr); gap:1px; background:var(--line);
           border:1px solid var(--line); margin-top:24px;}
  .eff{background:var(--surface); padding:18px 16px;}
  .eff .el{font-family:var(--mono); font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--fg-soft);}
  .eff .ev{font-family:var(--mono); font-size:19px; font-weight:700; font-variant-numeric:tabular-nums;
           letter-spacing:-.03em; margin-top:8px;}
  .eff .ed{font-size:12px; color:var(--fg-soft); margin-top:7px; line-height:1.45;}

  .wbar{height:4px; background:var(--surface-2); width:78px;}
  .wbar i{display:block; height:100%; background:var(--accent);}

  .reads{display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--line);
         border:1px solid var(--line); margin-top:24px;}
  .read{background:var(--surface); padding:22px 20px;}
  .read .rl{font-family:var(--mono); font-size:11px; letter-spacing:.16em; text-transform:uppercase;
            color:var(--accent); margin-bottom:14px;}
  .read .rn{font-weight:600; font-size:15px; margin-top:10px;}
  .read .rd{font-family:var(--mono); font-size:11px; color:var(--fg-soft); letter-spacing:.04em; margin-top:2px;}
  .read .hint{margin-top:16px; font-size:12.5px; color:var(--fg-soft);}

  @media (max-width:900px){
    .wb{grid-template-columns:1fr;} .effects{grid-template-columns:repeat(2,1fr);}
    .reads{grid-template-columns:1fr;}
  }

  /* ── outreach ── */
  .senders{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line);
           border:1px solid var(--line); margin-top:24px;}
  .sender{background:var(--surface); padding:20px 18px;}
  .sender .sh{display:flex; justify-content:space-between; gap:10px; align-items:center; flex-wrap:wrap;}
  .sender .sn{font-family:var(--mono); font-size:14px; font-variant-numeric:tabular-nums; font-weight:600;}
  .sender .sm{font-size:12.5px; color:var(--fg-soft); margin-top:8px;}
  .sender .cap{margin-top:16px;}
  .sender .cl{font-family:var(--mono); font-size:10px; letter-spacing:.14em;
              text-transform:uppercase; color:var(--fg-soft);}
  .cbar{height:5px; background:var(--surface-2); margin-top:8px;}
  .cbar i{display:block; height:100%; background:var(--accent);}
  .sender .cn{font-family:var(--mono); font-size:11.5px; color:var(--fg-soft);
              font-variant-numeric:tabular-nums; margin-top:7px;}

  .camp{display:grid; grid-template-columns:340px 1fr; gap:1px; background:var(--line);
        border:1px solid var(--line); margin-top:24px;}
  .camp-form{background:var(--surface-2); padding:24px 22px; display:flex; flex-direction:column; gap:16px;}
  .camp-form .field{margin:0; gap:7px;}
  .camp-form .field label{display:flex; justify-content:space-between; align-items:baseline; gap:10px;}
  .camp-form input[type=range]{-webkit-appearance:none; appearance:none; width:100%; height:3px;
    background:var(--line); padding:0; border:none;}
  .camp-form input[type=range]::-webkit-slider-thumb{-webkit-appearance:none; appearance:none;
    width:15px; height:15px; border-radius:50%; background:var(--accent); cursor:pointer;}
  .camp-form input[type=range]::-moz-range-thumb{width:15px; height:15px; border-radius:50%;
    background:var(--accent); cursor:pointer; border:none;}
  .camp-prev{background:var(--surface); padding:26px 24px;}
  .bubble{margin-top:14px; background:var(--accent-soft); border:1px solid var(--line);
          border-left:3px solid var(--accent); padding:16px 18px; font-size:14.5px;
          line-height:1.6; white-space:pre-wrap;}
  .bubble.mail{background:var(--surface-2); border-left-color:var(--fg-faint); font-family:var(--mono); font-size:13px;}

  .queue{display:flex; flex-direction:column; gap:1px; background:var(--line);
         border:1px solid var(--line); margin-top:24px;}
  .draft{background:var(--surface); padding:20px 20px 18px;}
  .draft.settled{opacity:.58;}
  .draft .dh{display:flex; justify-content:space-between; gap:12px; align-items:flex-start; flex-wrap:wrap;}
  .draft .dn{font-weight:600; font-size:15px;}
  .draft .dm{font-family:var(--mono); font-size:11.5px; color:var(--fg-soft); margin-top:3px;}
  .draft .dbody{margin-top:14px; font-size:14px; line-height:1.6; color:var(--fg-soft);
                white-space:pre-wrap; border-left:2px solid var(--line); padding-left:14px;}
  .draft .dbody.editing{color:var(--fg); border-left-color:var(--accent); outline:none;}
  .draft .dact{display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-top:16px;}
  .btn.sm{padding:8px 14px; font-size:11px;}
  .dstat{font-family:var(--mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase;}
  .dstat.good{color:var(--good);} .dstat.muted{color:var(--fg-faint);}

  @media (max-width:900px){
    .senders{grid-template-columns:1fr;} .camp{grid-template-columns:1fr;}
  }

  /* ── trust centre ── */
  .gov{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line);
       border:1px solid var(--line); margin-top:22px;}
  .gv{background:var(--surface); padding:20px 18px;}
  .gv .gl{font-family:var(--mono); font-size:10px; letter-spacing:.14em;
          text-transform:uppercase; color:var(--fg-soft);}
  .gv .gvv{font-family:var(--mono); font-size:17px; font-weight:700; letter-spacing:-.02em;
           margin-top:9px; color:var(--fg);}
  .gv .gd{font-size:12.5px; color:var(--fg-soft); margin-top:9px; line-height:1.5;}

  .pipe{display:grid; grid-template-columns:repeat(5,1fr); gap:1px; background:var(--line);
        border:1px solid var(--line); margin-top:24px;}
  .st{background:var(--surface); padding:20px 18px;}
  .st .stn{font-family:var(--mono); font-size:10px; letter-spacing:.14em;
           text-transform:uppercase; color:var(--fg-soft);}
  .st .stv{font-family:var(--mono); font-size:26px; font-weight:700; letter-spacing:-.035em;
           font-variant-numeric:tabular-nums; margin-top:9px;}
  .stb{height:4px; background:var(--surface-2); margin-top:12px;}
  .stb i{display:block; height:100%; background:var(--accent);}

  @media (max-width:900px){
    .gov{grid-template-columns:repeat(2,1fr);} .pipe{grid-template-columns:repeat(2,1fr);}
  }
  @media (max-width:560px){ .gov{grid-template-columns:1fr;} }

  /* ── governance documents ── */
  .docs{display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--line);
        border:1px solid var(--line); margin-top:24px;}
  .docgroup{background:var(--surface); padding:22px 20px; display:flex; flex-direction:column; gap:2px;}
  .docgroup .rl{font-family:var(--mono); font-size:11px; letter-spacing:.16em;
                text-transform:uppercase; color:var(--accent); margin-bottom:12px;}
  a.doc{display:flex; align-items:center; gap:10px; padding:11px 0; font-size:14px;
        color:var(--fg); text-decoration:none; border-bottom:1px solid var(--line);}
  .docgroup a.doc:last-child{border-bottom:none;}
  a.doc::after{content:"↗"; margin-left:auto; color:var(--fg-faint); font-size:13px;}
  a.doc:hover{color:var(--accent);} a.doc:hover::after{color:var(--accent);}
  .gv .gd a{color:var(--accent); text-decoration:none; border-bottom:1px solid var(--line);}
  @media (max-width:900px){ .docs{grid-template-columns:1fr;} }

  /* ── login gate ── */
  body.locked{overflow:hidden;}
  .login{position:fixed; inset:0; z-index:900; display:grid; grid-template-columns:1.05fr 1fr;
         background:var(--bg);}
  .login.gone{display:none;}
  .login-brand{background:#0B1315; color:#E7EAE8; padding:56px 52px;
               display:flex; flex-direction:column; justify-content:center; gap:26px;
               background-image:radial-gradient(120% 90% at 15% 10%, #14262A 0%, #0B1315 62%);}
  .login-logo{width:76px; height:76px;}
  .login-tag{font-family:var(--mono); font-size:11px; letter-spacing:.24em;
             text-transform:uppercase; color:#2FBFA8;}
  .login-stat{margin:0; font-size:clamp(27px,3.2vw,42px); line-height:1.08;
              letter-spacing:-.035em; font-weight:600; text-wrap:balance;}
  .login-facts{display:flex; gap:34px; flex-wrap:wrap; margin-top:8px;}
  .login-facts div{display:flex; flex-direction:column; gap:5px;}
  .lf-n{font-family:var(--mono); font-size:22px; font-weight:700; letter-spacing:-.03em;
        font-variant-numeric:tabular-nums; color:#E7EAE8;}
  .lf-l{font-family:var(--mono); font-size:10px; letter-spacing:.14em;
        text-transform:uppercase; color:#93A09C;}

  .login-panel{display:flex; align-items:center; justify-content:center; padding:40px 32px;}
  .login-form{width:100%; max-width:352px; display:flex; flex-direction:column; gap:16px;}
  .login-h1{margin:6px 0 0; font-size:32px; letter-spacing:-.03em; font-weight:600;}
  .login-sub{margin:0 0 6px; color:var(--fg-soft); font-size:14px;}
  .login-form .field{margin:0; gap:7px;}
  .login-form input{font-family:var(--sans); font-size:14px;}
  .login-btn{width:100%; justify-content:center; margin-top:4px;}
  .login-forgot summary{cursor:pointer; font-family:var(--mono); font-size:11px;
    letter-spacing:.1em; text-transform:uppercase; color:var(--accent); list-style:none;}
  .login-forgot div{margin-top:10px; font-size:13px; color:var(--fg-soft); line-height:1.55;}
  .login-trust{font-size:12px; color:var(--fg-faint); line-height:1.5; border-top:1px solid var(--line); padding-top:14px;}
  .login-demo{font-family:var(--mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase;
              color:var(--accent); background:var(--accent-soft); padding:9px 11px; text-align:center;}
  nav.top-nav a.signout{color:var(--fg-faint);}
  @media (max-width:860px){
    .login{grid-template-columns:1fr; overflow-y:auto;}
    .login-brand{padding:38px 28px; gap:18px;}
    .login-stat{font-size:26px;}
  }

  /* ── auth: product shot + pricing on the brand panel ── */
  .login-shot{width:100%; max-width:345px; display:block; border:1px solid rgba(255,255,255,.10);
              border-radius:4px; box-shadow:0 26px 60px -34px rgba(0,0,0,.85);}
  .login-price{border-top:1px solid rgba(255,255,255,.12); padding-top:18px; margin-top:4px;}
  .lp-free{font-family:var(--mono); font-size:15px; font-weight:700; letter-spacing:-.01em; color:#2FBFA8;}
  .lp-then{font-family:var(--mono); font-size:12px; letter-spacing:.06em; color:#E7EAE8; margin-top:5px;}
  .lp-note{font-size:12px; color:#93A09C; margin-top:9px; line-height:1.5; max-width:44ch;}
  .login-alt{font-size:13px; color:var(--fg-soft);}
  .login-alt a{color:var(--accent); text-decoration:none; border-bottom:1px solid var(--line);}
  .login-brand{overflow-y:auto;}
  @media (max-width:860px){ .login-shot{max-width:100%;} }

  /* ── auth: tabbed sign-in / sign-up ── */
  .auth-body{overflow:hidden;}
  .login-panel{align-items:flex-start; padding-top:clamp(24px,6vh,64px);}
  .auth-card{width:100%; max-width:392px; display:flex; flex-direction:column; gap:0;}
  .tabs{position:relative; display:flex; gap:4px; margin:14px 0 4px;
        border-bottom:1px solid var(--line);}
  .tab{appearance:none; background:transparent; border:0; cursor:pointer;
       font-family:var(--mono); font-size:12px; letter-spacing:.1em;
       text-transform:uppercase; color:var(--fg-soft); padding:12px 14px;
       transition:color .28s ease;}
  .tab:hover{color:var(--fg);}
  .tab.on{color:var(--fg);}
  .tab-ink{position:absolute; left:0; bottom:-1px; height:2px; width:0;
           background:var(--accent); transition:transform .42s cubic-bezier(.4,0,.15,1),
           width .42s cubic-bezier(.4,0,.15,1);}

  /* Both panes are mounted; the inactive one is lifted out of flow so the card
     height follows whichever is showing, and the switch can be animated. */
  .panes{position:relative; overflow:hidden;}
  .pane{opacity:0; visibility:hidden; transform:translateX(14px);
        transition:opacity .34s ease, transform .42s cubic-bezier(.4,0,.15,1);
        position:absolute; inset:0 0 auto 0; pointer-events:none;}
  .pane.on{opacity:1; visibility:visible; transform:none;
           position:relative; pointer-events:auto;}
  .panes.at-signup #pane-signin{transform:translateX(-14px);}
  .pane .login-h1{margin:16px 0 0; font-size:27px;}
  .pane form{display:flex; flex-direction:column; gap:14px;}

  .login-price{display:flex; gap:10px; align-items:baseline; flex-wrap:wrap;
               border-top:1px solid var(--line); padding-top:14px; margin-top:20px;}
  .login-price .lp-free{font-family:var(--mono); font-size:12px; font-weight:700;
                        letter-spacing:.04em; color:var(--accent);}
  .login-price .lp-then{font-family:var(--mono); font-size:12px; color:var(--fg-soft);}
  .login-trust{margin-top:12px;}

  @media (prefers-reduced-motion:reduce){
    .pane, .tab-ink, .tab{transition:none !important;}
  }
  @media (max-width:860px){
    .auth-body{overflow:auto;}
    .login{grid-template-columns:1fr;}
    .login-panel{order:-1; padding-top:26px;}   /* form first on small screens */
    .login-shot{max-width:100%;}
  }

  /* Each half scrolls independently so nothing is ever unreachable — the page
     itself never scrolls, but a short viewport can still get to the bottom of
     the form. This is the fix for the cut-off switch link. */
  .login{height:100vh; height:100dvh;}
  .login-brand, .login-panel{overflow-y:auto; max-height:100vh; max-height:100dvh;}
  .login-panel{padding-bottom:32px;}
  .login-brand{justify-content:flex-start; padding-top:clamp(20px,4vh,48px);}

  /* ── dashboard: KPIs + guide-price workbench on one screen ── */
  .dash{padding-block:22px 6px;}
  .dash h1{font-size:clamp(26px,3.3vw,40px); margin-top:6px;}
  .dash-board{margin-top:16px;}
  .dash-board .cell{padding:15px 16px 13px;}
  .dash-board .k-num{font-size:clamp(23px,2.9vw,34px); margin-top:7px;}
  .dash-board .k-sub{margin-top:5px; font-size:12px;}
  .dash-actions{margin:16px 0 0; gap:10px;}
  .dash-actions .btn{padding:9px 15px; font-size:11px;}

  .dash-wb{margin-top:18px; grid-template-columns:280px 1fr;}
  .dash-wb .wb-controls{padding:18px 17px; gap:12px;}
  .dash-wb .wb-result{padding:18px 20px 16px;}
  .dash-wb .price{font-size:clamp(28px,3.8vw,42px); margin-top:10px;}
  .dash-wb .interval-label{margin-top:12px;}
  .dash-wb #d-canvas{display:block; width:100%; height:150px; margin-top:8px;}
  .dash-wb .row2{grid-template-columns:1fr 1fr;}
  .dash-wb .field label{font-size:10px;}

  .dash-chips{display:flex; gap:8px; flex-wrap:wrap; margin-top:14px;}
  .dchip{font-family:var(--mono); font-size:11px; letter-spacing:.04em;
         color:var(--fg-soft); border:1px solid var(--line); padding:6px 10px;
         display:inline-flex; gap:6px; align-items:baseline;}
  .dchip b{color:var(--fg); font-weight:700; font-variant-numeric:tabular-nums;}
  .dchip i{font-style:normal; color:var(--accent); text-transform:uppercase;
           letter-spacing:.1em; font-size:9.5px;}

  @media (max-width:900px){ .dash-wb{grid-template-columns:1fr;} }

  /* KPIs stacked down the right so the valuer gets the width it deserves */
  .dash-grid{display:grid; grid-template-columns:minmax(0,1fr) 236px; gap:18px;
             align-items:start; margin-top:18px;}
  .dash-grid .dash-wb{margin-top:0;}
  .dash-side{grid-template-columns:1fr; align-self:stretch;}
  .dash-side .cell{padding:16px 16px 14px;}
  .dash-side .k-num{font-size:30px;}
  @media (max-width:1080px){
    .dash-grid{grid-template-columns:1fr;}
    .dash-side{grid-template-columns:repeat(3,1fr);}
  }
  @media (max-width:760px){ .dash-side{grid-template-columns:1fr;} }

  /* ── usage ── */
  .usage-split{display:grid; grid-template-columns:1fr 280px; gap:1px;
               background:var(--line); border:1px solid var(--line); margin-top:22px;}
  .ucard{background:var(--surface); padding:22px 20px;}
  .spark-row{display:flex; align-items:flex-end; gap:3px; height:52px; margin-top:14px;}
  .ubar{flex:1; display:flex; align-items:flex-end; height:100%;}
  .ubar i{display:block; width:100%; background:var(--accent); opacity:.82;
          transition:opacity .2s ease;}
  .ubar:hover i{opacity:1;}
  @media (max-width:820px){ .usage-split{grid-template-columns:1fr;} }

  /* ── the obvious way to add data ── */
  .add-data{display:flex; align-items:center; gap:20px; flex-wrap:wrap;
            margin-top:24px; padding:22px 24px; text-decoration:none; color:inherit;
            border:1px solid var(--accent); background:var(--accent-soft);
            transition:background .25s ease, transform .25s ease;}
  .add-data:hover{background:transparent; transform:translateY(-1px);}
  .ad-left{display:flex; flex-direction:column; gap:5px; flex:1; min-width:260px;}
  .ad-kicker{font-family:var(--mono); font-size:10px; letter-spacing:.18em;
             text-transform:uppercase; color:var(--accent);}
  .ad-title{font-size:21px; font-weight:600; letter-spacing:-.015em;}
  .ad-sub{font-size:13px; color:var(--fg-soft); max-width:62ch; line-height:1.55;}
  .ad-cta{font-family:var(--mono); font-size:11px; letter-spacing:.1em;
          text-transform:uppercase; padding:12px 20px; background:var(--accent);
          color:var(--accent-ink); white-space:nowrap;}

  /* ── dashboard action buttons ── */
  .dash-actions{gap:8px;}
  .dash-actions .btn{padding:9px 14px; font-size:10.5px;}
  .btn.go{border-color:var(--accent); background:var(--accent); color:var(--accent-ink);}
  /* Sending is not connected yet — these must not look armed. */
  .btn.muted{background:transparent; color:var(--fg-faint); border-color:var(--line);
             border-style:dashed; cursor:pointer;}
  .btn.muted:hover{color:var(--fg-soft); border-color:var(--fg-faint); filter:none;}
  .run-strip{display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-top:12px;}
  .run-strip .prog{height:4px;}

  /* "Open the databases" stays last and reads as a different kind of action —
     it navigates rather than starts work, so it shouldn't look like a trigger. */
  .dash-actions .btn.ghost{
    background:transparent; color:var(--accent); border-color:var(--accent);
    margin-left:6px;
  }
  .dash-actions .btn.ghost:hover{background:var(--accent-soft); filter:none;}

  /* ── listings behind an estimate ── */
  .held{margin-top:22px; border:1px solid var(--line); background:var(--surface);}
  .held-head{display:flex; align-items:baseline; gap:14px; flex-wrap:wrap;
             padding:16px 18px 12px; border-bottom:1px solid var(--line);}
  .held .dirs{border:0;}
  .held tr.dim td{opacity:.55;}
  .held a{color:var(--accent); text-decoration:none;}
  .held a:hover{border-bottom:1px solid var(--accent);}

  /* ── concurrent job stack ── */
  .jobs{display:flex; flex-direction:column; gap:8px; margin-top:14px;}
  .jobs-empty{font-size:12.5px; color:var(--fg-soft);}
  .job{border:1px solid var(--line); background:var(--surface); padding:12px 14px;
       display:flex; flex-direction:column; gap:8px;}
  .job.on{border-left:3px solid var(--accent);}
  .job.ok{border-left:3px solid var(--good);}
  .job.bad{border-left:3px solid var(--thin);}
  .job-top{display:flex; justify-content:space-between; gap:12px; align-items:baseline;}
  .job-name{font-weight:600; font-size:14px;}
  .job-state{font-family:var(--mono); font-size:10px; letter-spacing:.14em;
             text-transform:uppercase; color:var(--fg-soft);}
  .job.on .job-state{color:var(--accent);}
  .job.ok .job-state{color:var(--good);}
  .job.bad .job-state{color:var(--thin);}
  .job .prog{height:3px;}
  .job.on .prog i{animation:jobpulse 1.6s ease-in-out infinite;}
  @keyframes jobpulse{0%,100%{opacity:1;}50%{opacity:.55;}}
  .job-meta{display:flex; gap:14px; flex-wrap:wrap; font-family:var(--mono);
            font-size:11px; color:var(--fg-soft);}
  .job-gain{font-family:var(--mono); font-size:11px; color:var(--good); letter-spacing:.03em;}

  /* ── operator vs dealer level: whose platform this is, stated plainly ── */
  .levelbar{display:flex; align-items:center; gap:0; flex-wrap:wrap; margin-bottom:4px;}
  .lvl{font-family:var(--mono); font-size:10.5px; letter-spacing:.2em;
       text-transform:uppercase; padding:6px 13px; border:1px solid var(--line);
       color:var(--fg-faint); margin-right:-1px;}
  .lvl-on{color:var(--accent-ink); background:var(--accent); border-color:var(--accent);
          font-weight:700;}
  .lvl-tag{font-family:var(--mono); font-size:10.5px; letter-spacing:.16em;
           text-transform:uppercase; color:var(--fg-soft); margin-left:14px;}

  /* level pills are switches for operators, plain state for dealers */
  a.lvl{text-decoration:none; cursor:pointer; transition:color .2s ease, background .2s ease;}
  a.lvl:hover{color:var(--fg); border-color:var(--fg-faint);}
  a.lvl.lvl-on:hover{color:var(--accent-ink); border-color:var(--accent);}
  .lvl-off{opacity:.45; cursor:not-allowed;}

  /* ── usage ticker ── */
  .ticker{margin-left:auto; display:flex; align-items:center; gap:0; flex-wrap:wrap;}
  .ticker .tk{font-family:var(--mono); font-size:10.5px; letter-spacing:.12em;
              text-transform:uppercase; color:var(--fg-faint);
              padding:5px 12px; border:1px solid var(--line); margin-left:-1px;
              display:inline-flex; gap:6px; align-items:baseline; white-space:nowrap;}
  .ticker .tk b{font-size:12px; font-weight:700; color:var(--fg);
                font-variant-numeric:tabular-nums; letter-spacing:-.02em;}
  .ticker .tk:first-child{border-left-color:var(--accent); color:var(--accent);}
  .ticker .tk:first-child b{color:var(--accent);}

  /* ── make → model picker ── */
  .picker{position:relative;}
  .picker-trigger{width:100%; display:flex; align-items:center; justify-content:space-between;
    gap:10px; font-family:var(--mono); font-size:12px; color:var(--fg);
    background:var(--bg); border:1px solid var(--line); padding:11px 12px;
    cursor:pointer; text-align:left; transition:border-color .2s ease;}
  .picker-trigger:hover{border-color:var(--accent);}
  .picker-trigger[disabled]{opacity:.5; cursor:default;}
  .picker-trigger .chev{font-style:normal; color:var(--fg-faint); transition:transform .28s cubic-bezier(.4,0,.15,1);}
  .picker.open .picker-trigger{border-color:var(--accent);}
  .picker.open .chev{transform:rotate(180deg); color:var(--accent);}

  .picker-panel{position:absolute; z-index:60; top:calc(100% + 6px); left:0;
    min-width:420px; display:grid; grid-template-columns:150px 1fr;
    grid-template-areas:"makes models" "foot foot";
    background:var(--surface); border:1px solid var(--accent);
    box-shadow:0 26px 60px -34px rgba(0,0,0,.55);
    opacity:0; visibility:hidden; transform:translateY(-6px) scale(.985);
    transform-origin:top left; pointer-events:none;
    transition:opacity .2s ease, transform .26s cubic-bezier(.4,0,.15,1), visibility .2s;}
  .picker.open .picker-panel{opacity:1; visibility:visible; transform:none; pointer-events:auto;}

  .picker-makes{grid-area:makes; border-right:1px solid var(--line);
    max-height:290px; overflow-y:auto; background:var(--surface-2);}
  .picker-models{grid-area:models; position:relative; max-height:290px; overflow-y:auto;}
  .pmake, .pmodel{width:100%; display:flex; align-items:center; justify-content:space-between;
    gap:10px; background:transparent; border:0; cursor:pointer; text-align:left;
    padding:9px 12px; font-family:var(--sans); font-size:13px; color:var(--fg-soft);
    transition:background .16s ease, color .16s ease, padding-left .18s ease;}
  .pmake i, .pmodel i{font-style:normal; font-family:var(--mono); font-size:10.5px;
    color:var(--fg-faint); font-variant-numeric:tabular-nums;}
  .pmake:hover, .pmake.on{background:var(--surface); color:var(--fg); padding-left:15px;}
  .pmake.on{box-shadow:inset 3px 0 0 var(--accent);}
  .pmake.on i{color:var(--accent);}
  .pmodel:hover{background:var(--accent-soft); color:var(--fg); padding-left:15px;}
  .pmodel:hover i{color:var(--accent);}

  .pmodels{display:none;}
  .pmodels.on{display:block; animation:pslide .26s cubic-bezier(.4,0,.15,1);}
  @keyframes pslide{from{opacity:0; transform:translateX(-7px);} to{opacity:1; transform:none;}}

  .picker-foot{grid-area:foot; border-top:1px solid var(--line); background:var(--surface-2);
    padding:9px 12px; font-family:var(--mono); font-size:10px; letter-spacing:.1em;
    text-transform:uppercase; color:var(--fg-faint);}
  @media (prefers-reduced-motion:reduce){
    .picker-panel, .pmake, .pmodel, .chev{transition:none !important;}
    .pmodels.on{animation:none;}
  }
  @media (max-width:620px){ .picker-panel{min-width:0; width:100%; grid-template-columns:120px 1fr;} }

  /* ── dashboard KPIs: inverted so the numbers carry the page ── */
  .dash-side .cell{background:var(--accent); color:var(--accent-ink);}
  .dash-side .cell .k-label{color:var(--accent-ink); opacity:.72;}
  .dash-side .cell .k-num{color:var(--accent-ink);}
  .dash-side .cell .k-sub{color:var(--accent-ink); opacity:.78;}
  /* Alternate white cells so the stack reads as a set rather than one slab. */
  .dash-side .cell:nth-child(2){background:var(--surface); color:var(--fg);}
  .dash-side .cell:nth-child(2) .k-label{color:var(--fg-soft); opacity:1;}
  .dash-side .cell:nth-child(2) .k-num{color:var(--accent);}
  .dash-side .cell:nth-child(2) .k-sub{color:var(--fg-soft); opacity:1;}

  /* ticks are placed proportionally, so they sit under their gridline */
  .ticks{position:relative; height:18px; display:block; margin-top:4px;}
  .ticks span{position:absolute; transform:translateX(-50%); white-space:nowrap;}

  /* KPIs hold their position: job cards appear in the left column only, and the
     figures stay pinned so a running harvest never shoves them off screen. */
  .dash-main{display:flex; flex-direction:column; gap:14px; min-width:0;}
  .dash-main .jobs{margin-top:0;}
  .dash-main .dash-wb{margin-top:0;}
  .dash-side{position:sticky; top:14px;}
  @media (max-width:1080px){ .dash-side{position:static;} }

  /* Narrower KPI column. The inverted cells were wide enough to push the third
     figure below the fold once job cards were running alongside them; the
     numbers are short, so the width was doing nothing but taking space. */
  .dash-grid{grid-template-columns:minmax(0,1fr) 188px;}
  .dash-side{gap:10px;}
  .dash-side .cell{padding:11px 12px 10px;}
  .dash-side .k-num{font-size:25px; line-height:1.05;}
  .dash-side .k-label{font-size:10px; letter-spacing:.09em;}
  .dash-side .k-sub{font-size:10.5px; line-height:1.32; margin-top:2px;}
  @media (max-width:1180px){ .dash-grid{grid-template-columns:minmax(0,1fr) 168px;} }

  /* KPI tiles: top-aligned and as short as the content allows, so all three are
     on screen without scrolling however many harvests are stacked beside them.
     .board's own 22px top margin was what held them below the valuer. */
  .dash-grid{margin-top:10px;}
  .dash-side{margin-top:0; align-self:start; align-content:start; gap:1px;}
  .dash-side .cell{padding:9px 12px 9px;}
  .dash-side .k-label{font-size:9px; letter-spacing:.1em; margin-bottom:1px;}
  .dash-side .k-num{font-size:23px; line-height:1.02; margin:0;}
  .dash-side .k-sub{font-size:9.5px; line-height:1.25; margin-top:1px;}

  /* Tighten the run-up to the KPIs on the dashboard. The stack above them was
     30px of page padding + a 20px actions margin + the grid's own margin, which
     pushed the figures down the screen for no informational gain. */
  .page-head.dash{padding-block:14px 4px;}
  .dash h1{margin:2px 0 0; font-size:clamp(24px,2.9vw,34px);}
  .page-head.dash .levelbar{margin-bottom:2px;}
  .actions.dash-actions{margin-top:12px;}
  .dash-grid{margin-top:4px;}

  /* Half again as tall — compact was right horizontally, too cramped vertically. */
  .dash-side .cell{padding:22px 13px 21px;}
  .dash-side .k-num{font-size:26px; line-height:1.05;}
  .dash-side .k-sub{font-size:10px; margin-top:3px;}

  /* The valuer leads; the listings we hold are the evidence under it, not the
     way in. A dealer must be able to price a car we have never seen. */
  .wb-lede{margin:2px 0 12px; font-size:11.5px; line-height:1.45; color:var(--fg-soft);}
  .wb-lede em{font-style:normal; color:var(--fg); border-bottom:1px solid var(--accent);}
  .evidence{margin-top:12px; border-top:1px solid var(--line); padding-top:10px;}
  .evidence summary{cursor:pointer; font-size:10.5px; letter-spacing:.06em;
    text-transform:uppercase; color:var(--fg-soft); list-style:none;}
  .evidence summary::-webkit-details-marker{display:none;}
  .evidence summary::before{content:"+ "; color:var(--accent); font-weight:700;}
  .evidence[open] summary::before{content:"– ";}
  .evidence summary:hover{color:var(--fg);}

  /* A further quarter taller again. */
  .dash-side .cell{padding:33px 13px 32px;}
  .dash-side .k-num{font-size:28px;}

  /* A further 10% so the three tiles fill the dashboard on sign-in. */
  .dash-side .cell{padding:37px 13px 36px;}

  /* Sign-in on a phone. The overlay is position:fixed at viewport height, and
     below 860px the two panels stack inside it while each is separately capped
     at 100dvh — so the brand panel sat over the form and hid the sign-in button.
     Let the overlay scroll as one and the panels take their natural height. */
  @media (max-width:860px){
    .login{overflow-y:auto; -webkit-overflow-scrolling:touch;}
    .login-brand, .login-panel{max-height:none; overflow:visible;}
    .login-panel{padding-bottom:40px;}
    .login-brand{padding-bottom:32px;}
    /* The shot is decoration; on a small screen the form matters more. */
    .login-shot{max-width:300px; margin-inline:auto;}
  }