/* Agent-facing app chrome. Brand tokens from the BKN brand book. */
:root{--navy:#142538;--ivory:#F5F2EC;--blue:#0055FF;--stone:#D5D5D2;--paper:#FBFAF7;--mute:#5d6672;--ok:#1d7a46;--warn:#9a6700;--err:#b42318;
  --serif:'Tinos','Liberation Serif',Georgia,serif;--sans:'Arimo','Liberation Sans',Helvetica,Arial,sans-serif}
*{box-sizing:border-box}
body{margin:0;font-family:var(--sans);font-size:15px;line-height:1.5;color:var(--navy);background:var(--ivory)}
a{color:var(--blue)}
h1,h2,h3{font-family:var(--serif);font-weight:400;margin:0 0 .4em}
h1{font-size:34px}h2{font-size:26px}h3{font-size:20px}
.top{display:flex;align-items:center;gap:16px;background:var(--navy);color:var(--ivory);padding:12px 24px;flex-wrap:wrap}
.top .brand img{height:22px;width:auto;display:block}
.top .app{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:#9aa6b4;border-left:1px solid #3a4a5c;padding-left:16px}
.top nav{margin-left:auto;display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.top nav a,.top nav .link{color:var(--ivory);text-decoration:none;font-size:14px}
.top nav form{margin:0}
.wrap{max-width:1280px;margin:0 auto;padding:28px 16px 80px}
.wide{max-width:none}
.narrow{max-width:440px;margin:40px auto}
.card{background:var(--paper);border:1px solid var(--stone);padding:24px;margin-bottom:20px}
.muted{color:var(--mute)}
.small{font-size:13px}
.eyebrow{font-size:12px;letter-spacing:.22em;font-weight:700;color:var(--blue);text-transform:uppercase;margin-bottom:6px}
.error{color:var(--err)}.ok{color:var(--ok)}.warn{color:var(--warn)}
.notice{border-left:4px solid var(--blue);background:#eef3ff;padding:12px 16px;margin:0 0 16px}
.notice.warn{border-color:#e0a800;background:#fff8e1;color:#5c4400}
.notice.err{border-color:var(--err);background:#fdecea;color:var(--err)}
.stack{display:flex;flex-direction:column;gap:14px}
.row{display:flex;gap:14px;flex-wrap:wrap;align-items:flex-end}
.row>label{flex:1;min-width:140px}
label{display:flex;flex-direction:column;gap:4px;font-size:13px;font-weight:600;color:var(--navy)}
label.inline{flex-direction:row;align-items:center;gap:8px;font-weight:400}
input,select,textarea{font:inherit;font-weight:400;padding:9px 10px;border:1px solid #b9bcb7;background:#fff;color:var(--navy);border-radius:0;width:100%}
input[type=checkbox]{width:auto}
textarea{min-height:90px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:2px solid var(--blue);outline-offset:-1px}
.btn{display:inline-block;background:var(--navy);color:var(--ivory);border:0;padding:11px 18px;font:inherit;font-weight:700;letter-spacing:.06em;cursor:pointer;text-decoration:none}
.btn.blue{background:var(--blue);color:#fff}
.btn.ghost{background:transparent;color:var(--navy);border:1px solid var(--navy)}
.btn.small{padding:6px 10px;font-size:13px}
.btn[disabled]{opacity:.5;cursor:default}
button.link{background:none;border:0;padding:0;font:inherit;cursor:pointer;color:var(--blue)}
table.list{width:100%;border-collapse:collapse;background:var(--paper)}
.list th{font-size:11px;letter-spacing:.14em;text-transform:uppercase;text-align:left;color:var(--mute);padding:8px;border-bottom:2px solid var(--navy);white-space:nowrap}
.list td{padding:8px;border-bottom:1px solid var(--stone);vertical-align:top}
.list td.num,.list th.num{text-align:right;white-space:nowrap}
.list tr.out td{color:#8a8f96}
.list tr.out td.ad{text-decoration:line-through}
.tablewrap{overflow-x:auto}
.steps{display:flex;gap:6px;margin-bottom:22px;flex-wrap:wrap}
.steps a,.steps span{font-size:12px;letter-spacing:.12em;text-transform:uppercase;padding:6px 10px;border:1px solid var(--stone);text-decoration:none;color:var(--mute)}
.steps .on{background:var(--navy);color:var(--ivory);border-color:var(--navy)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.kpis div{background:var(--paper);border:1px solid var(--stone);padding:12px}
.kpis b{display:block;font-family:var(--serif);font-size:26px;font-weight:400}
.kpis span{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute)}
.chart svg{width:100%;height:auto;display:block}
.flag{display:inline-block;background:#fff3cd;color:#5c4400;font-size:12px;padding:2px 6px;margin-top:4px}
.reasons{font-size:12px;color:var(--mute)}
.htmx-indicator{display:none}
.htmx-request .htmx-indicator,.htmx-request.htmx-indicator{display:inline}
.htmx-request .hide-busy{display:none}
.pill{display:inline-block;font-size:11px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;padding:2px 7px;border:1px solid var(--navy)}
.pill.published{background:var(--ok);border-color:var(--ok);color:#fff}
.pill.draft{color:var(--mute);border-color:var(--stone)}
.pill.pending{background:#fff3cd;border-color:#e0a800}
/* preview */
.preview{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:20px;align-items:start}
.preview iframe{width:100%;height:calc(100vh - 150px);border:1px solid var(--stone);background:#2a3442}
.side{position:sticky;top:12px;display:flex;flex-direction:column;gap:14px;max-height:calc(100vh - 40px);overflow:auto}
.chatlog{display:flex;flex-direction:column;gap:8px;max-height:340px;overflow:auto}
.msg{padding:8px 10px;font-size:14px}
.msg.agent{background:#e7edf9;align-self:flex-end;max-width:90%}
.msg.assistant{background:#fff;border:1px solid var(--stone);max-width:95%}
.msg .v{font-size:11px;color:var(--mute)}
.linkbox{display:flex;gap:6px}
.linkbox input{font-size:12px}
details summary{cursor:pointer;font-weight:700}
@media (max-width:900px){.preview,.grid2{grid-template-columns:1fr}.kpis{grid-template-columns:1fr 1fr}.preview iframe{height:70vh}}