/* Dashboard (web/home.html). Colors, radii and type come from the Dispatch
   Kit tokens in /widget/shared/tokens.css. */
@font-face{font-family:"Archivo";src:url(/widget/assets/fonts/archivo-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Archivo";src:url(/widget/assets/fonts/archivo-600.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Saira";src:url(/widget/assets/fonts/saira-800.woff2) format("woff2");font-weight:800;font-display:swap}

*{box-sizing:border-box}
body{margin:0;background:var(--steel);color:var(--ink);font:400 15px/1.45 "Archivo",system-ui,sans-serif}
a{color:var(--amber-hi)}
button,input,select,textarea{font:inherit;color:inherit}
button{min-height:44px;padding:0 14px;border-radius:var(--r-3);border:1px solid var(--amber);background:var(--amber);color:var(--steel-900);font-weight:600;cursor:pointer}
button.ghost{background:transparent;color:var(--ink);border-color:var(--line-2)}
button.danger{border-color:var(--onair);color:var(--onair-hi)}
button:disabled{opacity:.55;cursor:default}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--amber-hi);outline-offset:2px}
input,select,textarea{min-height:44px;width:100%;padding:8px 10px;background:var(--steel-900);border:1px solid var(--line);border-radius:var(--r-2)}
label{display:block;margin:10px 0}
.mute{color:var(--mute)} .small{font-size:13px}
.err{color:var(--onair-hi)} .live{color:var(--go);min-height:1.2em}

.hd{display:flex;flex-wrap:wrap;gap:12px;align-items:center;padding:12px 16px;border-bottom:1px solid var(--line);background:var(--panel)}
.brand{display:inline-flex;align-items:center;min-height:44px;font:800 20px/1 "Saira",sans-serif;letter-spacing:.04em;color:var(--amber);text-decoration:none;text-transform:uppercase}
.hd-shop{display:flex;gap:8px;align-items:center} .hd-shop select{width:auto}
.hd-act{margin-left:auto;display:flex;gap:8px}
.lapsed{margin:0;color:var(--amber-hi);font-size:13px}

.grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(280px,1fr);gap:16px;padding:16px;max-width:1280px;margin:0 auto}
.col-main,.col-rail{display:flex;flex-direction:column;gap:16px;min-width:0}
.panel{background:linear-gradient(var(--panel-2),var(--panel));border:1px solid var(--line);border-radius:var(--r-4);padding:14px 16px}
.panel h2{margin:0 0 10px;font:800 15px/1.2 "Saira",sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-dim)}
.chip{margin:0}

.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.card{display:flex;flex-direction:column;gap:4px;min-height:96px;padding:12px;border:1px solid var(--line-2);border-radius:var(--r-3);background:var(--steel-850);color:var(--ink);text-decoration:none}
.card:hover{border-color:var(--amber-dim)}
.card strong{font-weight:600}
.card .mm,.card .ago{color:var(--mute);font-size:13px}
.card.hero{grid-column:1/-1;border-style:dashed}
.card.add{align-items:center;justify-content:center;border-style:dashed;color:var(--amber-hi)}
.st{font-size:13px} .st-ready{color:var(--go)} .st-processing{color:var(--amber-hi)} .st-failed{color:var(--onair-hi)} .st-none{color:var(--mute)}

.feed,.open,.list{list-style:none;margin:0;padding:0}
.feed li,.open li,.list li{padding:2px 0;border-top:1px solid var(--line-soft)}
.feed li:first-child,.open li:first-child,.list li:first-child{border-top:0}
.fh{display:flex;justify-content:space-between;font-size:12px;color:var(--mute)}
.fb{display:flex;align-items:center;min-height:44px;margin:0;color:var(--ink);text-decoration:none}
a.fb:hover{text-decoration:underline}

.plan-name{margin:0;font:800 22px/1.1 "Saira",sans-serif;color:var(--amber)}
.bar{height:10px;border-radius:var(--r-2);background:var(--steel-900);border:1px solid var(--line);overflow:hidden}
.bar .fill{height:100%;background:var(--amber)}
.btns{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}

.hp-log{max-height:260px;overflow:auto;display:flex;flex-direction:column;gap:6px;padding:4px 0}
.hp-empty{color:var(--mute)}
.hp-m{padding:8px 10px;border-radius:var(--r-3);max-width:92%;white-space:pre-wrap}
.hp-m.user{align-self:flex-end;background:var(--panel-3)}
.hp-m.ai{background:var(--steel-900);color:var(--phos)}
.hp-m.team{background:var(--go-dim)}
.hp-card{border:1px solid var(--line-2);border-radius:var(--r-3);padding:8px}
.hp-card-act{display:flex;gap:8px;margin-top:6px;flex-wrap:wrap;align-items:center}
.hp-status{min-height:1.2em;color:var(--mute);font-size:13px} .hp-status.err{color:var(--onair-hi)}
.hp-row{display:flex;gap:8px}
.talk-row{display:flex;gap:10px;align-items:center;margin-top:8px}
.talk-state{color:var(--mute);font-size:13px}
.hp-esc{margin-top:8px;background:transparent;color:var(--mute);border-color:var(--line)}
.req-matches{list-style:none;margin:0;padding:0}
.req-matches li{display:flex;gap:8px;align-items:center;justify-content:space-between;padding:6px 0}

.dlg{max-width:560px;width:calc(100% - 32px);padding:0;border:1px solid var(--line-2);border-radius:var(--r-4);background:var(--panel);color:var(--ink)}
.dlg::backdrop{background:rgba(0,0,0,.6)}
.dlg-body{padding:16px 18px;max-height:85vh;overflow:auto}
.dlg-hd{display:flex;justify-content:space-between;align-items:center}
.dlg h2{margin:0 0 8px;font:800 18px/1.2 "Saira",sans-serif}
fieldset{border:1px solid var(--line);border-radius:var(--r-3);margin:10px 0;padding:6px 10px}
fieldset label{display:inline-flex;gap:6px;align-items:center;min-height:44px;margin:0 12px 0 0}
fieldset input{width:auto;min-height:0}
.consent{display:flex;gap:10px;align-items:center;min-height:44px} .consent input{width:auto;min-height:0;margin-top:4px}
.req-mark{color:var(--amber)}
.row{display:flex;gap:8px;flex-wrap:wrap} .row input{flex:1 1 160px;width:auto}
.code{font:700 20px/1.2 ui-monospace,monospace;letter-spacing:.12em;color:var(--amber-hi)}

@media (max-width:900px){
  .grid{display:flex;flex-direction:column}
  .col-main,.col-rail{display:contents}
  .chip{order:0} .p-machines{order:1} .p-open{order:2} .p-support{order:3}
  .p-activity{order:4} .p-request{order:5} .p-plan{order:6}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
