/* UI-001..009: dark chrome, blue board, compact operational columns. */
:root {
  color-scheme:dark; font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:16px; color:#ecedf0; background:#1d1f22;
  --surface:#25272b; --card:#333539; --muted:#b5bcc7; --border:#484c54; --accent:#83b6ff;
}
* { box-sizing:border-box }
[hidden] { display:none !important }
body { margin:0 }
button,input,textarea,select { font:inherit }
button,a,input,textarea,summary { touch-action:manipulation }
button,summary { min-height:44px }
button { border:1px solid var(--border); border-radius:9px; background:#34373e; color:#f1f3f7; padding:10px 14px; cursor:pointer; font-weight:600 }
button:hover { background:#454a55 }
button:disabled { opacity:.55; cursor:wait }
button.primary { background:#8dbbff; color:#102848; border-color:#8dbbff }
button.danger { color:#ffb5b1 }
a { color:#a6ccff }
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible,.stage-column:focus-visible { outline:3px solid #f6cb69; outline-offset:2px }
h1,h2,h3,p { margin-top:0 }
h1 { font-size:1.55rem; line-height:1.2; margin-bottom:8px }
h2 { font-size:1.05rem }
h3 { font-size:1rem; line-height:1.4 }
.muted,.fine,.metadata { color:var(--muted); line-height:1.5 }
.fine { font-size:.8rem }
.eyebrow { font-size:.7rem; font-weight:750; letter-spacing:.08em; color:#bec9db; margin:0 0 6px }
.brandmark { display:grid; place-items:center; width:52px; height:52px; background:#4079b9; color:white; border-radius:12px; font-weight:800; margin-bottom:24px }
.brandmark.small { width:32px; height:32px; border-radius:7px; margin:0; font-size:.85rem }
.unlock { width:min(100% - 40px,420px); margin:8vh auto }
.unlock h1 { font-size:2rem }
.unlock form { margin-top:24px }
.unlock input { display:block; width:100%; letter-spacing:.5em; font-size:1.5rem; margin:8px 0 14px }
.unlock button { width:100% }
input,textarea,select { border:1px solid #6d7480; border-radius:8px; padding:11px; color:#edf1f8; background:#202226; max-width:100%; min-height:44px }
input[type=checkbox] { width:24px; height:24px; min-height:24px; accent-color:#8dbbff; flex-shrink:0 }
label { display:block; font-size:.875rem; font-weight:600 }
textarea { display:block; width:100%; min-height:110px; margin:8px 0 }
label input:not([type=checkbox]),label select { display:block; margin-top:6px }
label input[type=checkbox] { vertical-align:middle; margin-right:8px }
.error { color:#ffb4af; font-size:.9rem; line-height:1.5; min-height:24px; margin-top:12px }
.topbar { height:62px; padding:0 20px; display:flex; align-items:center; gap:14px; border-bottom:1px solid #424851; background:#25272b }
.wordmark { display:flex; align-items:center; gap:9px; color:#fff; text-decoration:none; font-weight:700 }
.private-label { font-size:.75rem; color:var(--muted); margin-left:auto }
.shell { position:relative }
#workspace-menu { position:relative; background:#22252b; border-bottom:1px solid #3c4655 }
#workspace-menu>summary { padding:13px 20px; font-weight:650; color:#d4e4ff; cursor:pointer }
aside { padding:16px 20px; max-height:65dvh; overflow:auto }
aside h2 { margin:0 0 12px }
nav,.secondary-nav { display:flex; flex-wrap:wrap; gap:8px }
nav button { display:flex; align-items:center; gap:10px }
nav button[aria-current=page],[data-view][aria-current=page] { border-color:#8dbbff; background:#2c4666 }
.secondary-nav { border-top:1px solid var(--border); margin-top:15px; padding-top:15px }
.count { border-radius:6px; padding:2px 6px; background:#444a53; color:#d9e0eb; font-size:.75rem; font-weight:500 }
main { padding:18px 20px 0; min-width:0; background:#086da6; min-height:calc(100dvh - 108px) }
.view-heading { display:flex; align-items:center; justify-content:space-between; gap:12px }
.view-heading h1 { color:#fff }
#view-description { font-size:.82rem; color:#e0edf5; max-width:860px; margin-bottom:10px }
.readiness-panel { font-size:.8rem; margin:0 0 10px; background:#0a5885; border-color:#3d86ac }
.readiness-panel summary { padding:10px 12px; min-height:40px }
.notice { background:#273545; border:1px solid #546d89; padding:12px; border-radius:8px; font-size:.82rem; line-height:1.5; color:#e0e8f1 }
.readiness-panel .notice { margin:0 10px 10px }
#filter-label { color:#e2edf8; font-size:.75rem; margin:0 0 12px }
#filter { display:block; width:min(100%,400px); margin-top:4px; background:#154f75; border-color:#6593b4; color:white }
#filter::placeholder { color:#cad8e6 }
.kanban { display:flex; align-items:flex-start; gap:12px; overflow-x:auto; overflow-y:hidden; padding:0 0 20px; min-height:55dvh; scroll-padding-left:0; overscroll-behavior-x:contain; scroll-snap-type:x proximity }
.stage-column { flex:0 0 310px; max-height:calc(100dvh - 170px); overflow-y:auto; background:#191b1f; border-radius:11px; padding:8px; scroll-snap-align:start; scrollbar-width:thin; overscroll-behavior-y:contain }
.column-heading { display:flex; align-items:center; gap:10px; padding:6px 6px 12px; position:sticky; top:-8px; background:#191b1f; z-index:1 }
.column-heading h2 { font-size:.85rem; margin:0; flex:1; line-height:1.4 }
.column-empty { font-size:.85rem; color:#aeb8c6; padding:12px 6px; margin:0; line-height:1.5 }
.column-cards { display:flex; flex-direction:column; gap:8px }
.card { background:#313338; border:1px solid #464a51; border-radius:8px; padding:16px; overflow-wrap:anywhere }
.stage-column .card { padding:11px; border:0; box-shadow:0 1px 2px #0005 }
.card h3 { margin-bottom:6px; font-size:.95rem }
.card p { margin-bottom:8px }
.card .company { color:#d2d9e4; font-size:.78rem; font-weight:600 }
.card .metadata { font-size:.75rem; margin-bottom:4px }
.card .summary { font-size:.8rem; line-height:1.5 }
.stage-column .summary { display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden }
.badge { display:inline-block; border-radius:5px; background:#454a53; padding:4px 7px; font-size:.7rem; color:#e2e6ef; line-height:1.5 }
.badge.running { background:#254b3a; color:#bbefcf }
.card-evidence { font-size:.7rem; color:#c0ccdc }
.actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px }
.card .actions { gap:6px; margin-top:9px }
.card .actions button { font-size:.76rem; padding:9px 10px }
.cards { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:14px }
.empty { padding:24px; background:#25272b; border:1px solid #545b65; border-radius:9px; line-height:1.5 }
#content:not(.board-content) { padding:12px 0 30px }
#content:not(.board-content)>.card { margin-bottom:12px }
#content form { max-width:800px; background:#25272b; padding:16px; border-radius:10px; margin-bottom:20px }
#content form>label { margin:14px 0 }
#content form>button { margin:8px 12px 8px 0 }
pre { white-space:pre-wrap; overflow-wrap:anywhere; font-size:.8rem; line-height:1.6; max-width:100%; background:#202226; padding:12px; border-radius:7px }
details { border:1px solid #464b55; border-radius:8px; margin-bottom:12px }
details>summary { padding:12px; cursor:pointer; line-height:1.4; font-size:.875rem; font-weight:600 }
details>p,details>pre,details>label,details>button,details>a,details>ul { margin-left:12px; margin-right:12px }
details>label { margin-bottom:14px }
blockquote { overflow-wrap:anywhere; margin:8px 0; padding:10px; border-left:3px solid #83b6ff }
.history { padding-left:20px; line-height:1.6; font-size:.85rem }
.history li { margin-bottom:12px }
.application-record { overflow-wrap:anywhere; margin:16px 0; border-top:1px solid var(--border); padding-top:16px }
.record-answer,.record-document { border-bottom:1px solid var(--border); padding:10px 0; margin-bottom:12px }
.record-answer h4,.record-document h4 { margin:0 0 8px }
.record-hash { font: .75rem/1.6 monospace; overflow-wrap:anywhere }
.record-document a { display:inline-block; min-height:44px; padding:10px 0 }
.review-check { display:flex; align-items:center; gap:10px; padding:12px 0 }
.review-check input { width:24px }
progress { width:100%; height:8px; accent-color:#8fc864; margin:10px 0 12px }
progress::-webkit-progress-bar { background:#44484f; border-radius:9px }
progress::-webkit-progress-value { background:#8fc864; border-radius:9px }
.available-item { color:#c9e5b8 }
.pending-item { color:#c0c8d3 }
.availability { border-top:1px solid var(--border); padding-top:20px; margin-top:20px }
.availability h3 { margin-bottom:0 }
.availability p { font-size:.85rem; line-height:1.5 }
.skip { position:absolute; left:-9999px }
.skip:focus { left:12px; top:8px; z-index:10; background:#25272b; padding:12px }
#feedback { color:#fff; font-size:.875rem; line-height:1.5; padding-bottom:12px; margin:0 }
#feedback:empty { display:none }
/* UI-005/009: stable header, independently scrollable body, reachable decisions. */
dialog { border:1px solid #515762; background:#202226; color:#edf1f7; width:min(760px,100% - 40px); max-width:none; height:min(900px,94dvh); max-height:94dvh; padding:0; border-radius:14px; overflow:hidden }
dialog[open] { display:flex; flex-direction:column }
dialog::backdrop { background:#000b }
.dialog-top { flex-shrink:0; display:flex; align-items:center; gap:14px; padding:12px 16px; background:#2b2d32; border-bottom:1px solid #464b55 }
.dialog-top>div { min-width:0 }
.dialog-top .eyebrow { font-size:.68rem; margin:0 0 3px }
#detail-context { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; margin:0; font-size:.85rem }
#detail { padding:20px; overflow-y:auto; overscroll-behavior:contain; flex:1; min-height:0; scroll-padding-bottom:24px }
#detail h2 { font-size:1.3rem; line-height:1.4; overflow-wrap:anywhere }
#detail .summary { white-space:pre-wrap; line-height:1.6; overflow-wrap:anywhere }
#detail section { margin-bottom:20px }
#detail-actions { flex-shrink:0; position:relative; padding:12px 16px max(12px,env(safe-area-inset-bottom)); border-top:1px solid #464b55; background:#2b2d32; display:flex; flex-wrap:wrap; align-items:center; gap:8px; max-height:40dvh; overflow-y:auto }
#detail-actions>.fine { flex-basis:100%; margin:0; font-size:.72rem }
#detail-actions>.error { flex-basis:100%; margin:0; min-height:0 }
#detail-actions>.error:empty { display:none }
#detail-actions .actions { margin:0 }
.decision-menu { margin:0; border:0 }
.decision-menu summary { padding:11px }
.decision-menu[open] { flex-basis:100%; background:#202226 }
.decision-menu button { margin:0 8px 10px }
.dialog-top button { flex-shrink:0 }
@media(min-width:1000px) {
  .shell { display:grid; grid-template-columns:238px minmax(0,1fr) }
  #workspace-menu { border-right:1px solid #41454e }
  aside { max-height:none; padding:10px 14px }
  nav,.secondary-nav { flex-direction:column }
  nav button { justify-content:space-between }
  .secondary-nav button { text-align:left }
  main { min-height:calc(100dvh - 62px) }
}
@media(max-width:600px) {
  .topbar { height:56px; padding:0 14px; gap:10px }
  .private-label { font-size:.65rem }
  .wordmark { font-size:.9rem }
  #workspace-menu>summary { padding:11px 14px }
  main { padding:14px 12px 0; min-height:calc(100dvh - 100px) }
  h1 { font-size:1.2rem }
  .view-heading button { padding:8px 10px; font-size:.8rem }
  .view-heading .eyebrow { font-size:.65rem }
  .stage-column { flex-basis:calc(100vw - 68px); max-width:330px; max-height:calc(100dvh - 160px) }
  .kanban { gap:10px; min-height:60dvh }
  .readiness-panel { margin-bottom:8px }
  #view-description { font-size:.78rem; line-height:1.4 }
  dialog { width:100%; height:100dvh; max-height:100dvh; max-width:100%; margin:0; border:0; border-radius:0 }
  .dialog-top { padding:max(10px,env(safe-area-inset-top)) 12px 10px }
  #detail { padding:18px 16px }
  #detail-actions { padding:10px 12px max(12px,env(safe-area-inset-bottom)) }
  #detail-actions .actions { width:100% }
  #detail-actions .actions button { flex:1; min-width:125px }
  .card .actions button { min-height:44px }
  #content form { padding:12px }
  #content form>button { width:100%; margin:6px 0 }
  .unlock { margin-top:7vh }
}
@media(prefers-reduced-motion:reduce) { * { scroll-behavior:auto } }