/* Castrum Alexandria: Orders and Court. Same look as the Keep dashboard on the host. */
:root {
  --bg: #07040a; --gold: #e0b050; --gold-d: #8a6a28; --red: #b3261e; --red-b: #ff4a3d;
  --parch: #efe2c0; --dim: #8c7a52; --ok: #7fd36b; --warn: #ffb347; --line: rgba(224,176,80,.28);
  --mono: ui-monospace, "JetBrains Mono", SFMono-Regular, Menlo, Consolas, monospace;
  --serif: Georgia, "Times New Roman", serif;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { min-height: 100%; background: radial-gradient(ellipse at 50% 40%, #1c0c10 0%, var(--bg) 70%) fixed; color: var(--gold);
  font: 13px/1.45 var(--mono); overflow-x: hidden; }
body::before { content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 70;
  background: repeating-linear-gradient(0deg, rgba(0,0,0,.18) 0 1px, transparent 1px 3px); }
[hidden] { display: none !important; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; text-align: inherit; }
:focus-visible { outline: 1px solid var(--gold); outline-offset: 2px; }
svg.ic { width: 1.4em; height: 1.4em; stroke: currentColor; fill: none; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; flex: none; vertical-align: -.25em; }
#i-jcross path, #i-cross path { fill: var(--jfill, currentColor); stroke: var(--jstroke, none); stroke-width: var(--jsw, .5); stroke-linejoin: round; }
.defs { position: absolute; width: 0; height: 0; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.shell { display: grid; grid-template-columns: 236px minmax(0, 1fr); min-height: 100vh; max-width: 1800px; margin: 0 auto; }
.side { position: sticky; top: 0; align-self: start; height: 100vh; display: flex; flex-direction: column; gap: 16px; padding: 16px 14px; border-right: 1px solid var(--line); background: linear-gradient(180deg, rgba(40,16,20,.5), rgba(7,4,10,.6)); overflow-y: auto; }
.main { padding: 16px 18px; display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.brand { display: flex; align-items: center; gap: 10px; }
.brand svg.mark { width: 40px; height: 40px; --jfill: var(--red); --jstroke: var(--gold); --jsw: .4; stroke: none; fill: none; filter: drop-shadow(0 0 6px rgba(255,74,61,.6)); }
.brand h1 { font: 600 15px/1.15 var(--serif); letter-spacing: .22em; background: linear-gradient(180deg, #f6dc8e, #e0b050 55%, #a8782a); -webkit-background-clip: text; background-clip: text; color: transparent; filter: drop-shadow(0 0 10px rgba(224,176,80,.35)); }
.brand small, .sub { display: block; color: var(--dim); letter-spacing: .26em; font-size: 9px; margin-top: 4px; text-transform: uppercase; }
.sidenote { border-top: 1px solid var(--line); padding-top: 10px; color: var(--dim); letter-spacing: .26em; font-size: 9px; text-transform: uppercase; }
nav.navs { display: flex; flex-direction: column; gap: 6px; }
.navbtn { display: flex; gap: 10px; align-items: center; padding: 10px 12px; border: 1px solid var(--line); letter-spacing: .2em; font-size: 11px; color: var(--dim); transition: .2s; text-transform: uppercase; min-height: 40px; width: 100%; }
.navbtn:hover { color: var(--gold); border-color: var(--gold); }
.navbtn.on { color: #1a0c06; background: var(--gold); border-color: var(--gold); box-shadow: 0 0 14px rgba(224,176,80,.45); }
.navbtn .count { margin-left: auto; opacity: .75; font-size: 10px; }
a.navbtn { text-decoration: none; }
.side-actions { display: flex; flex-direction: column; gap: 8px; }
.side-actions .btn { width: 100%; }
.status { display: flex; flex-direction: column; gap: 6px; align-items: flex-start; }
.clock { margin-top: auto; border-top: 1px solid var(--line); padding-top: 12px; }
.clock b { font-size: 20px; letter-spacing: .12em; color: var(--parch); font-weight: 600; }
.clock small { display: block; color: var(--dim); letter-spacing: .2em; font-size: 9px; margin-top: 2px; }

/* chips, pills, buttons */
.chip, .pill, .badge { display: inline-flex; gap: 6px; align-items: center; padding: 3px 10px; border: 1px solid var(--line); font-size: 10px; letter-spacing: .16em; color: var(--gold); background: none; text-transform: uppercase; }
.pill i { width: 8px; height: 8px; transform: rotate(45deg); background: var(--red-b); display: inline-block; }
.pill.on i { background: var(--ok); }
.pill.off { color: var(--red-b); border-color: var(--red); }
.pill.on { color: var(--parch); }
button.chip { cursor: pointer; min-height: 30px; }
button.chip:hover { border-color: var(--gold); background: rgba(224,176,80,.08); }
.chip.on { background: var(--gold); color: #1a0c06; border-color: var(--gold); }
.btn { display: inline-flex; gap: 6px; align-items: center; justify-content: center; border: 1px solid var(--line); padding: 8px 16px; letter-spacing: .2em; font-size: 11px; color: var(--gold); text-transform: uppercase; min-height: 36px; transition: .15s; }
.btn:hover { border-color: var(--gold); background: rgba(224,176,80,.08); }
.btn.primary { border-color: var(--gold); color: var(--parch); }
.btn.primary:hover { background: var(--gold); color: #1a0c06; }
.btn.ghost { color: var(--dim); }
.btn.danger { border-color: var(--red); color: var(--red-b); }
.btn.danger:hover { background: var(--red); color: #fff; }

/* forms */
input, select, textarea { font: inherit; color: var(--parch); background: rgba(0,0,0,.4); border: 1px solid var(--line); padding: 9px 10px; width: 100%; min-height: 38px; border-radius: 0; }
input:focus, select:focus, textarea:focus { border-color: var(--gold); outline: none; }
select option { background: #1c0c10; color: var(--parch); }
textarea { resize: vertical; }
label { display: block; font-size: 10px; color: var(--dim); margin: 12px 0 4px; letter-spacing: .24em; text-transform: uppercase; }
.chk { display: inline-flex; align-items: center; gap: 8px; margin: 0; letter-spacing: .1em; font-size: 11px; color: var(--gold); white-space: nowrap; }
.chk input { width: auto; min-height: 0; accent-color: var(--gold); }
.err { color: var(--red-b); min-height: 1.2em; margin: 6px 0 0; font-size: 12px; letter-spacing: .06em; }
.hint { color: var(--dim); font-size: 11px; letter-spacing: .08em; margin: 8px 0 0; }
.meta { color: var(--dim); font-size: 11px; margin-left: auto; letter-spacing: .08em; }

/* filters */
.filters { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.chips { display: flex; gap: 6px; flex-wrap: wrap; }
.filters select { width: auto; min-width: 170px; }
.filters input[type=search] { width: 220px; }

.banner { padding: 8px 12px; border: 1px solid var(--warn); color: var(--warn); background: rgba(255,179,71,.07); font-size: 12px; letter-spacing: .06em; }
.agent-notes .banner.ok { border-color: var(--ok); color: var(--ok); background: rgba(127,211,107,.07); }
.agent-notes .banner.bad { border-color: var(--red-b); color: var(--red-b); background: rgba(179,38,30,.12); }
.agent-notes { display: flex; flex-direction: column; gap: 6px; }

/* panels: corner brackets */
.lane, .agent-group, dialog, .login-card { position: relative; border: 1px solid var(--line); background: linear-gradient(180deg, rgba(40,16,20,.55), rgba(10,5,8,.7)); }
.lane::before, .agent-group::before, dialog::before, .login-card::before, .lane::after, .agent-group::after, dialog::after, .login-card::after { content: ""; position: absolute; width: 12px; height: 12px; border: 2px solid var(--gold); pointer-events: none; }
.lane::before, .agent-group::before, dialog::before, .login-card::before { top: -1px; left: -1px; border-right: 0; border-bottom: 0; }
.lane::after, .agent-group::after, dialog::after, .login-card::after { bottom: -1px; right: -1px; border-left: 0; border-top: 0; }

/* board */
.lane-tabs { display: none; }
.board { display: grid; grid-template-columns: repeat(6, minmax(160px, 1fr)); gap: 14px; overflow-x: auto; align-items: start; padding-bottom: 6px; }
.lane { min-height: 160px; display: flex; flex-direction: column; padding: 12px 10px 10px; }
.lane.over { border-color: var(--gold); background: rgba(224,176,80,.06); }
.lane-head { display: flex; align-items: center; gap: 8px; padding: 0 2px 10px; }
.lane-head h3 { font: 600 11px/1 var(--mono); letter-spacing: .3em; text-transform: uppercase; color: var(--gold); flex: 1; }
.lane-head .count { color: var(--dim); font-size: 11px; letter-spacing: .1em; }
.lane-head button { border: 1px solid var(--line); color: var(--dim); width: 26px; height: 26px; font-size: 16px; line-height: 1; text-align: center; }
.lane-head button:hover { color: var(--gold); border-color: var(--gold); }
.cards { display: flex; flex-direction: column; gap: 8px; min-height: 50px; }
.empty { color: var(--dim); font-size: 11px; letter-spacing: .2em; text-align: center; padding: 14px 4px; text-transform: uppercase; }
.card { display: block; border: 1px solid var(--line); border-left: 3px solid var(--line); padding: 9px 10px; cursor: pointer; text-align: left; color: var(--parch); width: 100%; background: rgba(0,0,0,.25); transition: .15s; }
.card:hover { border-color: var(--gold); background: rgba(224,176,80,.06); }
.card.high { border-left-color: var(--warn); }
.card.urgent { border-left-color: var(--red-b); }
.card.dragging { opacity: .4; }
.card.flash { animation: flash 3s ease-out; }
@keyframes flash { 0% { background: rgba(224,176,80,.35); box-shadow: 0 0 14px rgba(224,176,80,.6); } 100% { background: rgba(0,0,0,.25); box-shadow: none; } }
.card .t { font-weight: 600; margin: 0 0 6px; overflow-wrap: anywhere; letter-spacing: .03em; }
.card .badges { display: flex; gap: 5px; flex-wrap: wrap; }
.badge { padding: 1px 7px; color: var(--dim); font-size: 9px; }
.badge.who-me { color: var(--parch); }
.badge.who-alexandria { color: var(--gold); border-color: var(--gold); }
.badge.who-team { color: var(--red-b); border-color: var(--red); }
.badge.late { color: var(--red-b); border-color: var(--red-b); }
.card .when { color: var(--dim); font-size: 10px; margin-top: 6px; letter-spacing: .1em; }

/* dialogs */
dialog { color: var(--parch); padding: 18px; width: min(660px, calc(100vw - 24px)); max-height: calc(100vh - 24px); overflow: auto; margin: auto; }
dialog::backdrop { background: rgba(4,2,6,.82); }
.dlg-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.dlg-head h2, #actWrap h3 { font: 600 11px/1 var(--mono); letter-spacing: .3em; color: var(--gold); text-transform: uppercase; }
.grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 12px; }
.dlg-actions { display: flex; gap: 8px; align-items: center; margin-top: 14px; flex-wrap: wrap; }
#actWrap { margin-top: 18px; border-top: 1px dashed var(--line); padding-top: 12px; }
.act { list-style: none; margin: 10px 0; padding: 0; display: flex; flex-direction: column; gap: 8px; max-height: 280px; overflow: auto; }
.act li { background: rgba(0,0,0,.3); border: 1px solid var(--line); padding: 8px 10px; font-size: 12px; }
.act li.who-alexandria { border-color: var(--gold); }
.act li.who-owner { border-color: var(--red); }
.act .h { color: var(--dim); font-size: 10px; margin-bottom: 3px; text-transform: uppercase; letter-spacing: .16em; }
.act .b { white-space: pre-wrap; overflow-wrap: anywhere; color: var(--parch); }
.cmt-row { display: flex; justify-content: space-between; align-items: center; margin-top: 8px; gap: 8px; }

.toast { position: fixed; left: 50%; bottom: 18px; transform: translateX(-50%); background: #14080c; border: 1px solid var(--gold); color: var(--parch); padding: 10px 16px; max-width: calc(100vw - 32px); opacity: 0; pointer-events: none; transition: opacity .2s; z-index: 90; letter-spacing: .06em; }
.toast.show { opacity: 1; }

/* login */
.login { min-height: 100vh; display: grid; place-items: center; padding: 16px; }
.login-card { width: min(380px, 100%); padding: 28px 24px; text-align: center; }
.login-card svg.mark { width: 84px; height: 84px; --jfill: var(--red); --jstroke: var(--gold); --jsw: .4; stroke: none; filter: drop-shadow(0 0 14px rgba(179,38,30,.9)); animation: pulse 4s ease-in-out infinite; }
.login-card h1 { font: 600 22px/1 var(--serif); letter-spacing: .3em; color: var(--gold); margin-top: 10px; }
.login-card label { text-align: left; }
.login-card .btn { width: 100%; margin-top: 14px; }
@keyframes pulse { 50% { opacity: .65; filter: drop-shadow(0 0 28px rgba(255,74,61,1)); } }

/* court helpers */
.agents-bar { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; justify-content: space-between; margin-bottom: 12px; }
.agents-actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.agents-actions input[type=search] { width: 240px; }
.brief-row { display: flex; align-items: center; gap: 10px; margin-top: 8px; }
.brief-row input[type=file] { padding: 6px; }
.badge.gw-running { color: var(--ok); border-color: var(--ok); }
.badge.new { color: var(--gold); border-color: var(--gold); }
.meander { height: 10px; opacity: .75; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='10' viewBox='0 0 20 10'%3E%3Cpath d='M0 9.500H3V2.500H17V9.500H11V5.500H8V9.500' fill='none' stroke='%23e0b050' stroke-width='1.100'/%3E%3C/svg%3E") repeat-x center; }
footer { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; border-top: 1px solid var(--line); padding-top: 8px; color: var(--dim); font-size: 10px; letter-spacing: .25em; margin-top: auto; }
footer span { display: flex; gap: 6px; align-items: center; }

@media (max-width: 860px) {
  .shell { grid-template-columns: 1fr; }
  .side { position: static; height: auto; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 10px; border-right: 0; border-bottom: 1px solid var(--line); padding: 10px 12px; }
  .brand h1 { font-size: 13px; }
  .brand small, .sidenote { display: none; }
  nav.navs { flex-direction: row; order: 3; width: 100%; }
  .navbtn { justify-content: center; }
  .navbtn .lbl { display: inline; }
  .side-actions { flex-direction: row; margin-left: auto; }
  .side-actions .btn { width: auto; }
  .status { flex-direction: row; order: 4; }
  .clock { margin: 0 0 0 auto; border: 0; padding: 0; text-align: right; }
  .clock b { font-size: 16px; }
  .main { padding: 12px; }
  .filters select, .filters input[type=search] { width: 100%; }
  .lane-tabs { display: flex; gap: 6px; overflow-x: auto; }
  .lane-tabs button { flex: none; border: 1px solid var(--line); color: var(--dim); padding: 6px 12px; font-size: 10px; letter-spacing: .16em; text-transform: uppercase; min-height: 34px; }
  .lane-tabs button.on { color: #1a0c06; background: var(--gold); border-color: var(--gold); }
  .board { display: block; overflow-x: hidden; }
  .lane { display: none; }
  .lane.show { display: flex; }
  .grid { grid-template-columns: 1fr; }
  .agents-actions { width: 100%; }
  .agents-actions input[type=search] { flex: 1; width: auto; }
  footer { font-size: 9px; letter-spacing: .15em; }
}
@media (prefers-reduced-motion: reduce) { .card.flash, .login-card svg.mark, .sd.busy { animation: none; } .toast { transition: none; } }

/* ---- from the first build ---- */
.view{display:none}.view.on{display:grid}
#v-keep{grid-template-columns:minmax(240px,1fr) minmax(320px,1.4fr) minmax(240px,1fr);gap:14px;align-items:start}
.col{display:flex;flex-direction:column;gap:14px;min-width:0}
.panel{position:relative;border:1px solid var(--line);background:linear-gradient(180deg,rgba(40,16,20,.55),rgba(10,5,8,.7));padding:14px 14px 12px}
.panel::before,.panel::after{content:"";position:absolute;width:12px;height:12px;border:2px solid var(--gold)}
.panel::before{top:-1px;left:-1px;border-right:0;border-bottom:0}
.panel::after{bottom:-1px;right:-1px;border-left:0;border-top:0}
.panel h2{font:600 11px/1 ui-monospace,monospace;letter-spacing:.3em;color:var(--gold);margin-bottom:12px;display:flex;justify-content:space-between;align-items:center;gap:8px}
.panel h2 span{color:var(--dim);letter-spacing:.2em}
.panel h2 .l{display:flex;gap:8px;align-items:center;color:var(--gold)}
.m{display:block;width:100%;padding:6px 8px;margin:0 -8px 4px;width:calc(100% + 16px);border:1px solid transparent;transition:.15s}
.m:hover{border-color:var(--line);background:rgba(224,176,80,.06)}
.m .row{display:flex;justify-content:space-between;gap:8px;font-size:11px;letter-spacing:.14em;color:var(--dim);align-items:center}
.m .row .t{display:flex;gap:8px;align-items:center}
.m .row .t .ic{color:var(--gold)}
.m .row b{color:var(--parch);font-weight:500;letter-spacing:.05em}
.bar{height:6px;margin-top:5px;background:rgba(224,176,80,.1);position:relative;overflow:hidden}
.bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--gold-d),var(--gold));transition:width .8s ease}
.bar i.hot{background:linear-gradient(90deg,#7a1612,var(--red-b))}
.bar::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 9px,rgba(7,4,10,.85) 9px 10px)}
.tiles{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:8px}
.tile{border:1px solid var(--line);padding:8px 10px;display:block;transition:.15s}
button.tile:hover{border-color:var(--gold);background:rgba(224,176,80,.06)}
.tile small{display:flex;gap:6px;align-items:center;color:var(--dim);letter-spacing:.2em;font-size:10px}
.tile b{font-size:15px;color:var(--parch);font-weight:500}
.center{align-items:center;text-align:center}
#orbwrap{position:relative;width:100%;max-width:520px;aspect-ratio:1;cursor:pointer;-webkit-tap-highlight-color:transparent}
#orb{width:100%;height:100%;display:block}
#cross{position:absolute;inset:0;margin:auto;width:26%;height:auto;aspect-ratio:1;pointer-events:none;animation:pulse 4s ease-in-out infinite;--jfill:var(--red);--jstroke:var(--gold);--jsw:.35;filter:drop-shadow(0 0 14px rgba(179,38,30,.9))}

#nimbus{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;fill:none;stroke:var(--gold);filter:drop-shadow(0 0 6px rgba(224,176,80,.5))}
#nimbus circle{stroke-width:.9}#nimbus circle.thin{stroke-width:.35;opacity:.7}
#nimbus .arms path{stroke-width:2.600;stroke-linecap:butt;stroke:var(--gold);opacity:.85}
.meander{height:10px;opacity:.75;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='10' viewBox='0 0 20 10'%3E%3Cpath d='M0 9.500H3V2.500H17V9.500H11V5.500H8V9.500' fill='none' stroke='%23e0b050' stroke-width='1.100'/%3E%3C/svg%3E") repeat-x center}
.brand h1{background:linear-gradient(180deg,#f6dc8e,#e0b050 55%,#a8782a);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none;filter:drop-shadow(0 0 10px rgba(224,176,80,.35))}
@keyframes pulse{50%{opacity:.6;filter:drop-shadow(0 0 28px rgba(255,74,61,1))}}
.name{font:600 26px/1 Georgia,serif;letter-spacing:.5em;margin:6px 0 6px .5em;color:var(--parch);text-shadow:0 0 18px rgba(224,176,80,.6)}
.sub{letter-spacing:.35em;font-size:11px;color:var(--dim)}
.oath{margin-top:14px;max-width:520px;font:italic 14px/1.5 Georgia,serif;color:var(--gold);min-height:42px;transition:opacity .6s}
.chips{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:14px}
.chip{display:inline-flex;gap:6px;align-items:center;padding:3px 10px;border:1px solid var(--line);font-size:10px;letter-spacing:.2em;color:var(--gold)}
.chip.red{border-color:var(--red);color:var(--red-b)}
button.chip:hover{border-color:var(--gold);background:rgba(224,176,80,.08)}
button.chip.on{background:var(--gold);color:#1a0c06}
.svc{display:flex;align-items:center;gap:10px;padding:8px 6px;border-bottom:1px dashed var(--line);width:100%;transition:.15s}
button.svc:hover{background:rgba(224,176,80,.06)}
.svc:last-child{border:0}
.svc .ic{width:20px;height:20px;color:var(--ok)}
.svc.down .ic{color:var(--red-b);animation:blink 1s infinite}
@keyframes blink{50%{opacity:.25}}
.svc span{letter-spacing:.14em;color:var(--parch)}
.svc em{margin-left:auto;font-style:normal;color:var(--dim);font-size:11px}
.log{display:flex;flex-direction:column;gap:4px;font-size:11.5px}
.log div{color:var(--dim);display:flex;gap:8px;align-items:center;min-width:0}
.log div b{color:var(--gold);font-weight:500}
.log div span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.log div.warn{color:var(--red-b)}.log div.warn b{color:var(--red-b)}
.log div.good .ic{color:var(--ok)}
#minilog{height:170px;justify-content:flex-end;overflow:hidden}
/* walls */
#v-walls{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.fort{text-align:left;display:block;width:100%}
.fort .top{display:flex;gap:12px;align-items:center}
.fort .top .ic{width:38px;height:38px;color:var(--ok)}
.fort.down .top .ic{color:var(--red-b);animation:blink 1s infinite}
.fort h3{font:600 15px/1.2 Georgia,serif;letter-spacing:.18em;color:var(--parch)}
.fort small{color:var(--dim);letter-spacing:.2em;font-size:10px}
.fort svg.sp{width:100%;height:56px;margin-top:10px;display:block}
.fort .st{display:flex;justify-content:space-between;color:var(--dim);font-size:11px;margin-top:6px;letter-spacing:.1em}
.fort .st b{color:var(--parch);font-weight:500}
/* chronicle */
#v-chron{grid-template-columns:1fr;gap:14px}
#biglog{max-height:62vh;overflow:auto;gap:7px;font-size:12.5px}
.empty{color:var(--dim);letter-spacing:.2em;padding:10px 0;display:flex;gap:8px;align-items:center}
/* modal */
#modal{display:none;position:fixed;inset:0;z-index:80;background:rgba(4,2,6,.8);align-items:center;justify-content:center;padding:16px}
#modal.on{display:flex}
#modal .box{width:min(860px,100%)}
#chart{width:100%;height:auto;display:block;touch-action:none}
.rng{display:flex;gap:8px;margin-bottom:10px;flex-wrap:wrap}
#tip{color:var(--parch);min-height:1.5em;font-size:12px;letter-spacing:.1em;margin-top:6px}
#v-agents,#v-routines,#v-approve{grid-template-columns:1fr}
#v-routines,#v-approve{max-width:900px;margin:0 auto;width:100%}
.ceo{display:flex;gap:14px;align-items:center;justify-content:center;margin:0 auto 14px;max-width:560px;width:100%}
.grp{margin-bottom:14px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
.ag{display:block;width:100%;border:1px solid var(--line);padding:10px 12px;transition:.15s;background:rgba(0,0,0,.25)}
.ag:hover{border-color:var(--gold);background:rgba(224,176,80,.06)}
.ag .hd{display:flex;gap:10px;align-items:center}
.ag .hd .ic{width:26px;height:26px;color:var(--gold)}
.ag h3{font:600 13px/1.2 Georgia,serif;letter-spacing:.12em;color:var(--parch)}
.ag .stt{margin-left:auto;display:flex;gap:6px;align-items:center;font-size:9px;letter-spacing:.2em;color:var(--dim)}
.sd{width:8px;height:8px;transform:rotate(45deg);background:var(--dim)}
.sd.idle{background:var(--ok)}.sd.working{background:var(--gold);box-shadow:0 0 8px var(--gold);animation:blink 1.4s infinite}
.sd.waiting{background:#ffb347}.sd.blocked{background:var(--red-b);box-shadow:0 0 8px var(--red-b)}
.ag .more{display:none;margin-top:8px;color:var(--dim);font-size:11px;line-height:1.5}
.ag.open .more{display:block}.ag .more b{color:var(--parch);font-weight:500}
.ceo .ag{border-color:var(--gold);box-shadow:0 0 18px rgba(224,176,80,.18)}
.rt{display:flex;gap:12px;align-items:center;padding:10px 4px;border-bottom:1px dashed var(--line)}
.rt:last-child{border:0}.rt .txt{flex:1}.rt .txt b{color:var(--parch);font-weight:500;display:block}.rt .txt small{color:var(--dim);letter-spacing:.1em}

/* ---- merged dashboard glue ---- */
#alarm { position: sticky; top: 0; background: var(--red); color: #fff; text-align: center; padding: 6px; letter-spacing: .3em; font-size: 12px; z-index: 60; }
.main > .view { min-width: 0; }
#v-keep { align-items: start; }
#v-orders.on { display: block; }
#v-orders .filters { margin-bottom: 14px; }
.chips.left { justify-content: flex-start; margin: 0; }
.chips.spaced { margin-bottom: 12px; }
.subline { letter-spacing: .35em; font-size: 11px; color: var(--dim); text-align: center; }
.hid { display: none; }
.ag { display: block; width: 100%; border: 1px solid var(--line); padding: 0; background: rgba(0,0,0,.25); transition: .15s; }
.ag:hover { border-color: var(--gold); background: rgba(224,176,80,.06); }
.ag .aghd { display: flex; gap: 10px; align-items: center; width: 100%; padding: 10px 12px; }
.ag .aghd svg.ic { width: 26px; height: 26px; color: var(--gold); }
.ag .more { padding: 0 12px 10px; }
.ag .more > div { margin-top: 3px; overflow-wrap: anywhere; }
.ag .more pre { white-space: pre-wrap; overflow-wrap: anywhere; font: inherit; font-size: 11px; background: rgba(0,0,0,.4); border: 1px solid var(--line); padding: 8px 10px; max-height: 260px; overflow: auto; margin: 6px 0 0; color: var(--parch); }
.ag summary { cursor: pointer; color: var(--gold); font-size: 10px; text-transform: uppercase; letter-spacing: .2em; margin-top: 6px; }
.cell { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.specialists { margin-left: 12px; padding-left: 10px; border-left: 1px solid var(--gold-d); display: flex; flex-direction: column; gap: 8px; }
.specialists .cap { color: var(--dim); font-size: 9px; letter-spacing: .3em; }
.ceo .ag { border-color: var(--gold); box-shadow: 0 0 18px rgba(224,176,80,.18); }
.sd.idle { background: var(--ok); }
.sd.blocked { background: var(--red-b); box-shadow: 0 0 8px var(--red-b); }
.sd.working { background: var(--gold); box-shadow: 0 0 8px var(--gold); animation: blink 1.4s infinite; }
.agents-grid { display: grid; }
#orbwrap { max-width: 460px; }
@media (max-width: 860px) {
  #v-keep { grid-template-columns: 1fr; }
  #v-keep .center { order: -1; }
}
@media (min-width: 861px) and (max-width: 1280px) { #v-keep { grid-template-columns: 1fr; } #v-keep .center { order: -1; } }
.navs .tools { display: flex; gap: 6px; }
.navs .tools .navbtn { flex: 1; justify-content: center; padding: 8px; }
.navbtn kbd { margin-left: auto; opacity: .55; font-size: 9px; font-family: var(--mono); }
.navbtn.on kbd { opacity: .8; }

dialog .grid { grid-template-columns: repeat(2, 1fr); gap: 0 12px; }
@media (max-width: 860px) { dialog .grid { grid-template-columns: 1fr; } }
.dimsm { color: var(--dim); }

:root { --live: #3ddc84; }
.ag .aghd .nm { display: flex; flex-direction: column; gap: 3px; min-width: 0; text-align: left; }
.ag .aghd .cur { color: var(--dim); font-size: 10px; letter-spacing: .06em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
.ag .stt.working { color: var(--gold); }
.ag .stt.waiting, .ag .stt.stalled { color: #ffb347; }
.ag .stt.offline { color: var(--red-b); }
.sd.working { background: var(--gold); box-shadow: 0 0 8px var(--gold); animation: blink 1.4s infinite; }
.sd.idle { background: var(--ok); }
.sd.waiting, .sd.stalled { background: #ffb347; box-shadow: 0 0 6px #ffb347; }
.sd.offline { background: var(--red-b); box-shadow: 0 0 8px var(--red-b); }
.ag.is-working { border-color: var(--gold); }
.rt .acts { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.rt.stack { flex-direction: column; align-items: stretch; gap: 8px; }
.rt.stack .top { display: flex; gap: 12px; align-items: flex-start; }
.rt.stack input { width: 100%; }
.rt .why { color: var(--parch); font-size: 12px; line-height: 1.5; overflow-wrap: anywhere; }
.chip.ok { border-color: var(--live); color: var(--live); }
.chip.warn { border-color: #ffb347; color: #ffb347; }
.panel .rowtop { display: flex; justify-content: flex-end; margin-bottom: 8px; }
[hidden] { display: none !important; }
.subh { margin: 14px 0 4px; font-size: 10px; letter-spacing: .3em; color: var(--dim); }
.rt .txt small { display: block; margin-top: 2px; }
.rt .why { display: block; margin-top: 6px; }

/* >>> castrum-layout v1: fill the screen, scale with screen size >>> */
:root { --z: 1; --vh: calc(100vh / var(--z)); }
@media (min-width: 2000px) { :root { --z: 1.2; } }
@media (min-width: 2400px) { :root { --z: 1.4; } }
@media (min-width: 2800px) { :root { --z: 1.6; } }
@media (min-width: 3400px) { :root { --z: 1.9; } }
body { zoom: var(--z); }
.login { min-height: var(--vh); }
dialog { max-height: calc(var(--vh) - 24px); }
@media (min-width: 861px) {
  .shell { max-width: none; min-height: var(--vh); }
  .side { height: var(--vh); }
  .main { min-height: var(--vh); }
  .main > .view.on { flex: 1 1 auto; }

  /* the keep */
  #v-keep { align-items: stretch; }
  #v-keep > .col { min-height: 0; }
  #v-keep > .col > .panel { flex: 0 0 auto; }
  #v-keep > .col:first-child > .panel:first-child, #v-keep > .col:last-child > .panel:last-child { flex: 1 1 auto; display: flex; flex-direction: column; }
  #v-keep > .col:first-child > .panel:first-child > .m { flex: 1 1 auto; display: flex; flex-direction: column; justify-content: center; }
  #v-keep > .col:first-child > .panel:first-child .m .row { font-size: 12px; }
  #v-keep > .col:first-child > .panel:first-child .bar { height: 9px; margin-top: 8px; }
  #v-keep > .col:first-child > .panel:first-child .tiles { flex: 2 1 auto; grid-auto-rows: 1fr; }
  #v-keep > .col:first-child > .panel:first-child .tile { display: flex; flex-direction: column; justify-content: center; gap: 4px; }
  #v-keep > .col:first-child > .panel:first-child .tile b { font-size: 18px; }
  #v-keep > .col.center { justify-content: center; }
  #orbwrap { max-width: min(100%, calc(var(--vh) - 250px)); }
  #minilog { flex: 1 1 170px; height: auto; min-height: 170px; flex-direction: column-reverse; justify-content: flex-end; gap: 7px; font-size: 12px; }
  .name { font-size: clamp(26px, 2.2vw / var(--z), 40px); }
  .oath { font-size: 15px; }

  /* the walls */
  #v-walls { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); grid-auto-rows: minmax(180px, 1fr); }
  #v-walls .fort { display: flex; flex-direction: column; }
  #v-walls .fort svg.sp { flex: 1 1 56px; height: auto; min-height: 56px; }

  /* chronicle, routines, leave: one panel that fills the page */
  #v-chron > .panel, #v-routines > .panel, #v-approve > .panel { display: flex; flex-direction: column; min-height: 0; }
  #biglog { flex: 1 1 0; max-height: none; min-height: 200px; }
  #v-routines, #v-approve { max-width: none; margin: 0; }
  #v-approve .hint { margin-top: auto; padding-top: 12px; }

  /* orders */
  #v-orders.on { display: flex; flex-direction: column; }
  #v-orders .board { flex: 1 1 auto; align-items: stretch; }

  /* court */
  #v-agents.on { display: flex; flex-direction: column; }
  #v-agents .grid { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
}
@media (min-width: 861px) and (max-width: 1280px) {
  #v-keep > .col > .panel, #v-keep > .col:first-child > .panel:first-child, #v-keep > .col:last-child > .panel:last-child { flex: 0 0 auto; }
  #orbwrap { max-width: min(100%, 420px); }
}
/* <<< castrum-layout <<< */
.card.kb { border-left-style: dashed; border-left-color: var(--gold-d); cursor: pointer; }
.card.kb .t { white-space: normal; }
.kbprev { color: var(--parch); opacity: .8; font-size: 11px; line-height: 1.45; margin-top: 6px; white-space: pre-wrap; overflow-wrap: anywhere; }
.lane-head button.kbarch { width: auto; height: 26px; padding: 0 8px; font-size: 9px; letter-spacing: .16em; text-transform: uppercase; }
.badge.kbtag { color: var(--gold); border-color: var(--gold-d); }
.kbnote { color: var(--parch); white-space: pre-wrap; overflow-wrap: anywhere; margin: 12px 0; font-size: 12.5px; line-height: 1.55; max-height: calc(var(--vh) - 320px); overflow: auto; }
#kbDlg { width: min(900px, calc(100vw - 24px)); }
#kbTitle { white-space: normal; overflow-wrap: anywhere; line-height: 1.5; text-transform: none; letter-spacing: .08em; font-size: 13px; }


/* inbox (read-only file browsing) */
#inbList{margin-top:6px}
#inbList .m{text-align:left}
#inbList .m .row a,#inbList button.m .inb-dir{color:var(--parch);text-decoration:none;font-weight:600;letter-spacing:.05em;overflow-wrap:anywhere}
#inbList .m .row a:hover{color:var(--gold)}
#inbList button.m .row b{color:var(--dim)}
#inbList .m .row small{color:var(--dim);font-size:10px;letter-spacing:.12em;white-space:nowrap}

/* markdown rendering (cards, role text, briefs, inbox docs) */
.mdtext p{margin:4px 0;font-size:12.5px;line-height:1.5;overflow-wrap:anywhere}
.mdtext h2,.mdtext h3,.mdtext h4,.mdtext h5{color:var(--gold);letter-spacing:.1em;text-transform:uppercase;margin:10px 0 3px}
.mdtext h2{font-size:13px}.mdtext h3{font-size:12.5px}.mdtext h4,.mdtext h5{font-size:11.5px}
.mdtext ul,.mdtext ol{margin:4px 0 4px 20px;padding:0}
.mdtext li{margin:2px 0;font-size:12.5px;line-height:1.5;overflow-wrap:anywhere}
.mdtext code{background:rgba(224,176,80,.1);border:1px solid var(--line);padding:0 4px;font-size:11px;overflow-wrap:anywhere}
.mdtext pre{background:rgba(0,0,0,.3);border:1px solid var(--line);padding:8px;overflow-x:auto;margin:6px 0}
.mdtext pre code{background:none;border:0;padding:0;white-space:pre}
.mdtext a{color:var(--gold);text-decoration:underline}
.mdtext strong{color:var(--gold)}
.mdtext .inb-link,.inb-link{background:none;border:0;padding:0;color:var(--parch);font-weight:600;letter-spacing:.05em;cursor:pointer;text-align:left;font-size:inherit}
.inb-link:hover{color:var(--gold)}
#inbDlgBody{max-height:60vh;overflow:auto;padding:4px 2px}
.brief-md,.role-md{margin-top:2px}
