:root { color-scheme: light; font-family: system-ui, sans-serif; color: #18332f; background: #f4f6f3; }
* { box-sizing: border-box; }
body { margin: 0; }
#developer section, #developer dd, #developer p { overflow-wrap: anywhere; }
#developer nav { display: flex; flex-wrap: wrap; gap: .6rem; }
#developer button { margin: .3rem .4rem .3rem 0; }
#developer input[type=checkbox] { display: inline-block; width: auto; margin-right: .5rem; }
#developer dl { display: grid; grid-template-columns: minmax(7rem, 1fr) minmax(0, 3fr); gap: .6rem 1rem; }
#developer dt { font-weight: 600; }
#developer dd { margin: 0; }
header { display: flex; align-items: center; justify-content: space-between; padding: 1.5rem 5vw; border-bottom: 1px solid #d7dfd9; }
main { max-width: 960px; margin: 4rem auto; padding: 0 1.5rem; }
h1 { font-size: clamp(2rem, 5vw, 3.5rem); margin: .5rem 0 2rem; }
h2 { font-size: 1.2rem; }
.eyebrow { color: #577168; letter-spacing: .1em; }
section { margin: 2rem 0; padding: 1.5rem; background: white; border: 1px solid #d7dfd9; border-radius: 12px; }
button, select { font: inherit; border-radius: 6px; border: 1px solid #73968b; padding: .6rem 1rem; background: white; color: #18332f; }
button { cursor: pointer; }
button:disabled { opacity: .6; cursor: wait; }
button:focus-visible, select:focus-visible { outline: 3px solid #79b9a1; outline-offset: 3px; }
ul { list-style: none; padding: 0; }
li { display: flex; gap: 1rem; align-items: center; justify-content: space-between; padding: 1rem 0; border-top: 1px solid #e2e8e4; }
[hidden] { display: none !important; }
fieldset { border: 1px solid #d7dfd9; border-radius: 8px; padding: 1rem; margin: 1rem 0; min-width: 0; }
label { display: block; margin: .8rem 0; }
input, textarea { display: block; width: 100%; padding: .65rem; font: inherit; color: inherit; border: 1px solid #73968b; border-radius: 6px; }
textarea { min-height: 7rem; resize: vertical; }
label select { display: block; max-width: 100%; }
form > div:last-child { display: flex; flex-wrap: wrap; gap: .6rem; }
.model-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1rem; }
.model-row small { grid-column: 1 / -1; }
pre { white-space: pre-wrap; overflow-wrap: anywhere; font-size: .85rem; }
details { margin-top: 1rem; }
@media (max-width: 600px) { .model-row { grid-template-columns: 1fr; } li { align-items: start; flex-direction: column; } main { margin-top: 2rem; } }

/* The independent console shell; the existing login form keeps its own layout. */
.console-app { background: #f7f8fa; color: #202c2a; font-size: 14px; }
.console-app .sidebar { position: fixed; inset: 0 auto 0 0; width: 216px; padding: 2rem 1.2rem; background: #fff; border-right: 1px solid #e4e8e9; display: flex; flex-direction: column; z-index: 2; }
.brand { color: #263d34; font-size: 1.25rem; letter-spacing: -.04em; text-decoration: none; font-weight: 750; margin-bottom: 1.5rem; }
.brand span { font-weight: 400; }
.console-app .eyebrow { color: #77847f; font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; }
.sidebar nav { display: grid; gap: .4rem; margin-top: .7rem; }
.sidebar nav button { text-align: left; border-color: transparent; padding: .85rem; }
.sidebar nav button[aria-current="page"] { color: #176b53; background: #eaf4ef; font-weight: 650; }
.console-app .account { margin: auto 0 0; padding: 1.2rem 0 0; border: 0; border-top: 1px solid #edf0ee; border-radius: 0; overflow-wrap: anywhere; }
.muted, .console-app small { color: #66766f; line-height: 1.6; }
.account .muted { font-size: .7rem; }
.console-body { margin-left: 216px; min-width: 0; }
.console-app .topbar { min-height: 86px; padding: 1rem 2rem; gap: 1rem; background: #fff; }
.scope-controls { display: flex; align-items: center; gap: 1rem; min-width: 0; }
.scope-controls label { margin: 0; color: #66766f; font-size: .7rem; min-width: 0; }
.scope-controls select { margin-top: .3rem; color: #202c2a; font-size: .9rem; max-width: 260px; }
.role-badge { font-size: .75rem; color: #557769; padding: .4rem .6rem; background: #f0f5f2; border-radius: 20px; white-space: nowrap; }
.console-app main { max-width: 1600px; margin: 0 auto; padding: 2rem; outline: none; }
.console-app h1 { font-size: 1.9rem; font-weight: 650; letter-spacing: -.04em; margin: .4rem 0; }
.console-app h2 { font-size: 1.05rem; margin: 0 0 1rem; }
.console-app h3 { font-size: .95rem; }
.console-app section { border-color: #e2e7e5; }
.console-app button, .console-app select, .console-app input, .console-app textarea { border-color: #d4dcd8; max-width: 100%; }
.console-app button:disabled { cursor: default; opacity: .48; }
.console-app button:hover:not(:disabled) { background: #eef5f2; }
.console-app button.primary { background: #176b53; border-color: #176b53; color: white; }
.console-app button.primary:hover:not(:disabled) { background: #11583f; }
.console-app input:focus-visible, .console-app textarea:focus-visible, .console-app a:focus-visible { outline: 3px solid #79b9a1; outline-offset: 3px; }
.console-app label { font-size: .85rem; }
.console-app input, .console-app textarea, .console-app label select { margin-top: .4rem; }
.console-app textarea { min-height: 8rem; line-height: 1.65; }
.console-app li { overflow-wrap: anywhere; }
.console-app legend { font-weight: 600; padding: 0 .4rem; }
.console-app summary { cursor: pointer; padding: .7rem 0; }
.console-app audio { width: 100%; }
.page-heading { display: flex; align-items: center; justify-content: space-between; }
#status:empty { display: none; }
#status { color: #66766f; line-height: 1.6; }
#agent-workbench { display: grid; grid-template-columns: minmax(0,1fr); gap: 1.5rem; align-items: start; margin-top: 1.5rem; }
#agent-workbench.detail { grid-template-columns: minmax(0,1fr) minmax(300px,380px); }
#agents, #calls { margin: 0; min-width: 0; }
#agent-test { min-width: 0; position: sticky; top: 1.5rem; }
#call-workbench { margin-top: 1.5rem; }
.agent-toolbar, .agent-actions, .call-controls { display: flex; gap: .6rem; flex-wrap: wrap; }
.agent-actions { padding-top: 1rem; border-top: 1px solid #edf0ee; margin-top: 1rem; }
.agent-list li { padding: 1.3rem 0; }
.agent-list .resource-name { display: block; font-size: 1rem; font-weight: 600; margin-bottom: .4rem; }
.agent-list small { display: block; }
.agent-version { border-top: 1px solid #edf0ee; padding: .5rem 0; }
.call-live { margin-bottom: 1.5rem; }
.call-live > select { width: 100%; margin: .5rem 0 1rem; }
.call-live p { line-height: 1.65; }
.call-records li { align-items: start; }
.call-records li span { min-width: 0; flex: 1; }
.call-details { overflow-wrap: anywhere; }
.skip-link { position: fixed; top: -100px; left: 1rem; background: white; padding: 1rem; z-index: 10; }
.skip-link:focus { top: 1rem; }
.confirmation-overlay { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 1rem; background: #152d2466; }
.confirmation-dialog { width: min(100%,460px); max-height: calc(100dvh - 2rem); overflow-y: auto; padding: 1.6rem; background: white; border: 1px solid #d4dcd8; border-radius: 12px; box-shadow: 0 18px 60px #112e2330; }
.confirmation-dialog p { line-height: 1.7; white-space: pre-line; }
.confirmation-actions { display: flex; justify-content: flex-end; gap: .7rem; flex-wrap: wrap; margin-top: 1.5rem; }
@media (max-width: 1150px) { #agent-workbench.detail { grid-template-columns: minmax(0,1fr); } #agent-test { position: static; } .scope-controls { flex-wrap: wrap; } }
@media (max-width: 720px) {
  .console-app .sidebar { position: static; width: auto; padding: 1rem; border-right: 0; border-bottom: 1px solid #e4e8e9; }
  .brand { margin-bottom: .2rem; } .sidebar > .eyebrow { display: none; }
  .sidebar nav { display: flex; flex-wrap: wrap; } .sidebar nav button { padding: .6rem; }
  .console-app .account { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; margin-top: .6rem; padding-top: .6rem; } .account p { margin: 0; } .account .muted { flex: 1; }
  .console-body { margin-left: 0; } .console-app .topbar { padding: 1rem; align-items: start; flex-wrap: wrap; }
  .scope-controls { gap: .7rem; width: 100%; } .scope-controls label { flex: 1; } .scope-controls select { width: 100%; }
  .console-app main { padding: 1.2rem 1rem; } .console-app .model-row { grid-template-columns: minmax(0,1fr); }
  .console-app section { padding: 1rem; } .console-app li { flex-wrap: wrap; } .console-app li > span { width: 100%; }
}

#governance form{display:flex;flex-wrap:wrap;gap:1rem;align-items:end;margin:1.25rem 0}#governance label{display:grid;gap:.4rem;max-width:100%}#governance input,#governance select{max-width:100%;min-width:12rem}#governance .member-list{padding:0;list-style:none}#governance .member-list li{display:flex;justify-content:space-between;gap:1rem;padding:.75rem 0;border-bottom:1px solid var(--border,#ddd);overflow-wrap:anywhere}#governance p{overflow-wrap:anywhere}

.call-filters { display:flex; flex-wrap:wrap; gap:.6rem; margin:1rem 0; }
.call-transcript p { padding:.8rem 1rem; margin:.6rem 0; border:1px solid var(--border, #ddd); border-radius:.6rem; }
.call-transcript strong { display:block; margin-bottom:.4rem; }
.call-transcript span { white-space:pre-wrap; }

#carriers { overflow-wrap:anywhere; }
.carrier-layout { display:grid; grid-template-columns:minmax(170px,240px) minmax(0,1fr); gap:1.5rem; margin-top:1.5rem; }
.carrier-list { min-width:0; border-right:1px solid #e2e7e5; padding-right:1rem; }
.carrier-list button { width:100%; text-align:left; }
.carrier-list button[aria-pressed=true] { color:#176b53; background:#eaf4ef; }
.carrier-list p { font-size:.75rem; color:#66766f; margin:.5rem 0 1.5rem; }
.carrier-detail { min-width:0; }
#carriers p { line-height:1.7; }
#carriers button { margin:.25rem .4rem .25rem 0; }
#carriers article { margin-top:1.1rem; padding:1rem 0; border-top:1px solid #e2e7e5; }
#carriers input[type=checkbox] { display:inline-block; width:auto; margin:.3rem .5rem .3rem 0; }
#carriers label:has(input[type=checkbox]) { display:flex; align-items:center; gap:.5rem; }
#carriers dl { display:grid; grid-template-columns:minmax(7rem,1fr) minmax(0,2fr); gap:.7rem; }
#carriers dd { margin:0; }
#carriers form { padding:1rem; border:1px solid #d7dfd9; border-radius:8px; margin-top:1.5rem; }
@media(max-width:900px) { .carrier-layout { grid-template-columns:minmax(0,1fr); }.carrier-list { border-right:0; border-bottom:1px solid #e2e7e5; padding:0 0 1rem; } }