/* Functional workspace — sober product UI, not a decorative landing page */
:root{
  --workspace-panel:#ffffff;
  --workspace-subtle:#f7f9fc;
  --workspace-border:#dce4ed;
  --workspace-text:#0b1420;
  --workspace-muted:#62758a;
  --workspace-accent:#087cf0;
  --workspace-accent-soft:#e9f4ff;
  --workspace-danger:#c9364f;
  --workspace-radius:10px;
}
:root[data-theme="dark"]{
  --workspace-panel:#0c131d;
  --workspace-subtle:#080e16;
  --workspace-border:#223244;
  --workspace-text:#edf5fc;
  --workspace-muted:#8ea1b5;
  --workspace-accent:#16bfff;
  --workspace-accent-soft:#09283a;
  --workspace-danger:#ff7186;
}
.functional-page{
  width:min(100%,1760px);
  margin:0 auto;
  padding:24px;
  color:var(--workspace-text)
}
.functional-heading{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
  margin-bottom:18px
}
.functional-heading h1{
  max-width:860px;
  margin:4px 0 8px;
  font-size:clamp(30px,3.4vw,48px);
  line-height:1.02;
  letter-spacing:-.045em;
  font-weight:650
}
.functional-heading p{
  max-width:760px;
  margin:0;
  color:var(--workspace-muted);
  font-size:14px;
  line-height:1.55
}
.eyebrow{
  font-family:"JetBrains Mono",monospace;
  font-size:9px;
  font-weight:600;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--workspace-muted)
}
.functional-actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:8px
}
.functional-actions .btn{min-height:42px}
.workspace-panel{
  min-width:0;
  background:var(--workspace-panel);
  border:1px solid var(--workspace-border);
  border-radius:var(--workspace-radius);
  box-shadow:none
}
.workspace-panel-head{
  min-height:58px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px 14px;
  border-bottom:1px solid var(--workspace-border)
}
.workspace-panel-head strong,
.workspace-panel-head small{display:block}
.workspace-panel-head strong{font-size:13px}
.workspace-panel-head small{
  margin-top:3px;
  color:var(--workspace-muted);
  font-size:10px
}
.count-badge,
.status-chip{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  padding:0 8px;
  border:1px solid var(--workspace-border);
  border-radius:999px;
  color:var(--workspace-muted);
  background:var(--workspace-subtle);
  font-size:9px;
  font-weight:650
}
.workspace-search{
  min-height:42px;
  display:flex;
  align-items:center;
  gap:8px;
  margin:10px;
  padding:0 11px;
  border:1px solid var(--workspace-border);
  border-radius:8px;
  background:var(--workspace-subtle)
}
.workspace-search span{color:var(--workspace-muted)}
.workspace-search input{
  width:100%;
  min-width:0;
  border:0;
  outline:0;
  background:transparent;
  color:var(--workspace-text);
  font-size:12px
}
.process-workspace{
  display:grid;
  grid-template-columns:230px minmax(420px,1fr) 370px;
  gap:12px;
  min-height:calc(100dvh - 175px)
}
.process-catalog{
  display:flex;
  flex-direction:column;
  min-height:0;
  overflow:hidden
}
.process-list{
  flex:1;
  min-height:120px;
  overflow:auto;
  padding:0 8px 10px
}
.process-list-item{
  width:100%;
  min-height:58px;
  display:flex;
  align-items:center;
  gap:10px;
  margin:3px 0;
  padding:9px;
  border:1px solid transparent;
  border-radius:8px;
  background:transparent;
  color:var(--workspace-text);
  text-align:left;
  cursor:pointer
}
.process-list-item:hover,
.process-list-item.active{
  border-color:var(--workspace-border);
  background:var(--workspace-subtle)
}
.process-list-item.active{box-shadow:inset 3px 0 0 var(--workspace-accent)}
.process-list-item>span:last-child{min-width:0}
.process-list-item strong,
.process-list-item small{display:block}
.process-list-item strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:11px
}
.process-list-item small{
  margin-top:4px;
  color:var(--workspace-muted);
  font-size:9px
}
.process-list-icon{
  width:10px;
  height:10px;
  flex:none;
  border-radius:3px;
  background:var(--workspace-accent)
}
.block-palette{
  padding:12px;
  border-top:1px solid var(--workspace-border)
}
.block-palette>span{
  display:block;
  margin-bottom:8px;
  color:var(--workspace-muted);
  font-size:9px;
  font-weight:650;
  text-transform:uppercase;
  letter-spacing:.08em
}
.block-palette-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.block-palette .flow-template{
  min-height:40px;
  margin:0;
  padding:8px;
  border:1px solid var(--workspace-border);
  border-radius:7px;
  background:var(--workspace-subtle);
  color:var(--workspace-text);
  font-size:9px
}
.block-palette .flow-template b{color:var(--workspace-accent)}
.process-canvas{
  height:calc(100dvh - 175px);
  min-height:620px;
  display:grid;
  grid-template-rows:58px minmax(0,1fr)32px;
  padding:0;
  overflow:hidden
}
.process-canvas .flow-toolbar{
  min-height:58px;
  padding:0 14px;
  background:var(--workspace-panel);
  border-bottom:1px solid var(--workspace-border)
}
.process-canvas .flow-viewport{background:var(--workspace-subtle)}
.process-canvas .flow-status{
  background:var(--workspace-panel);
  border-top:1px solid var(--workspace-border)
}
.process-inspector{
  height:calc(100dvh - 175px);
  min-height:620px;
  overflow:hidden
}
.inspector-heading{position:sticky;top:0;z-index:3;background:var(--workspace-panel)}
.inspector-actions{display:flex;gap:5px}
.icon-action,
.card-menu{
  width:34px;
  height:34px;
  border:1px solid var(--workspace-border);
  border-radius:8px;
  background:transparent;
  color:var(--workspace-muted);
  cursor:pointer
}
.icon-action:hover,.card-menu:hover{color:var(--workspace-text);background:var(--workspace-subtle)}
.inspector-close{display:none}
.process-form{
  height:calc(100% - 59px);
  overflow:auto;
  padding:14px
}
.form-section{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  padding:0 0 18px;
  margin:0 0 18px;
  border-bottom:1px solid var(--workspace-border)
}
.form-section-title{
  grid-column:1/-1;
  font-size:10px;
  font-weight:700;
  color:var(--workspace-text)
}
.process-form label,
.drawer-grid label,
.orchestration-edit label{
  display:grid;
  gap:6px;
  color:var(--workspace-muted);
  font-size:9px;
  font-weight:650;
  letter-spacing:.04em;
  text-transform:uppercase
}
.process-form input,
.process-form select,
.process-form textarea,
.drawer-grid input,
.drawer-grid select,
.drawer-grid textarea,
.orchestration-edit input,
.orchestration-edit select,
.orchestration-edit textarea{
  width:100%;
  min-height:42px;
  border:1px solid var(--workspace-border);
  border-radius:8px;
  background:var(--workspace-subtle);
  color:var(--workspace-text);
  padding:9px 10px;
  outline:0;
  font-size:12px;
  text-transform:none;
  letter-spacing:0
}
.process-form textarea,
.drawer-grid textarea,
.orchestration-edit textarea{min-height:92px;resize:vertical}
.process-form input:focus,
.process-form select:focus,
.process-form textarea:focus,
.drawer-grid input:focus,
.drawer-grid select:focus,
.drawer-grid textarea:focus,
.orchestration-edit input:focus,
.orchestration-edit select:focus,
.orchestration-edit textarea:focus{
  border-color:var(--workspace-accent);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--workspace-accent) 12%,transparent)
}
.process-form :disabled{opacity:.55;cursor:not-allowed}
.field-wide{grid-column:1/-1}
.process-form-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px
}
.footer-actions{display:flex;gap:8px}
.process-inspector.expanded{
  position:fixed;
  z-index:80;
  inset:76px 18px 18px auto;
  width:min(720px,calc(100vw - 36px));
  height:auto;
  min-height:0;
  box-shadow:0 24px 80px rgba(0,0,0,.35)
}
.process-inspector.expanded .inspector-close{display:grid}
.process-inspector.expanded .process-form{height:calc(100% - 59px)}
.process-inspector.expanded .form-section{grid-template-columns:1fr 1fr 1fr}
.process-inspector.expanded .field-wide{grid-column:1/-1}
.save-feedback{min-height:18px;color:var(--workspace-muted);font-size:10px}
.blueprint-toolbar,
.toolbox-toolbar{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:12px;
  padding:2px 4px
}
.blueprint-toolbar .workspace-search,
.toolbox-toolbar .workspace-search{flex:1;margin:8px}
.blueprint-summary{display:flex;gap:16px;padding:0 14px}
.blueprint-summary span{color:var(--workspace-muted);font-size:10px}
.blueprint-summary b{color:var(--workspace-text)}
.blueprint-board{
  display:grid;
  grid-template-columns:repeat(4,minmax(250px,1fr));
  gap:10px;
  min-height:calc(100dvh - 260px)
}
.blueprint-lane{
  min-width:0;
  display:flex;
  flex-direction:column;
  border:1px solid var(--workspace-border);
  border-radius:var(--workspace-radius);
  background:var(--workspace-subtle);
  overflow:hidden
}
.blueprint-lane>header{
  min-height:66px;
  display:grid;
  grid-template-columns:32px 1fr 34px;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-bottom:1px solid var(--workspace-border);
  background:var(--workspace-panel)
}
.blueprint-lane header strong,
.blueprint-lane header small{display:block}
.blueprint-lane header strong{font-size:12px}
.blueprint-lane header small{margin-top:3px;color:var(--workspace-muted);font-size:9px}
.lane-index{
  font-family:"JetBrains Mono",monospace;
  color:var(--workspace-muted);
  font-size:9px
}
.blueprint-lane>header>button{
  width:34px;height:34px;border:1px solid var(--workspace-border);border-radius:8px;
  background:transparent;color:var(--workspace-text);cursor:pointer
}
.blueprint-dropzone{
  flex:1;
  min-height:180px;
  padding:10px;
  overflow:auto
}
.blueprint-dropzone.drop-target{
  background:color-mix(in srgb,var(--workspace-accent) 7%,var(--workspace-subtle))
}
.blueprint-card{
  margin:0 0 9px;
  padding:12px;
  border:1px solid var(--workspace-border);
  border-radius:9px;
  background:var(--workspace-panel);
  cursor:grab
}
.blueprint-card:active{cursor:grabbing}
.blueprint-card.dragging{opacity:.35}
.blueprint-card-top,.blueprint-card footer,.tool-record header,.tool-record footer{
  display:flex;align-items:center;justify-content:space-between;gap:8px
}
.priority-dot{width:8px;height:8px;border-radius:50%;background:#7c8da0}
.priority-high{background:#ff9b50}.priority-critical{background:#ff5f73}.priority-low{background:#67b7ff}
.blueprint-card h3{margin:10px 0 6px;font-size:13px;line-height:1.3}
.blueprint-card p{margin:0;color:var(--workspace-muted);font-size:11px;line-height:1.45}
.blueprint-card footer{margin-top:12px;padding-top:10px;border-top:1px solid var(--workspace-border);font-size:9px;color:var(--workspace-muted)}
.workspace-drawer{
  position:fixed;
  inset:0;
  z-index:100
}
.workspace-drawer[hidden]{display:none}
.drawer-backdrop{
  position:absolute;
  inset:0;
  background:rgba(4,8,14,.56);
  backdrop-filter:blur(4px)
}
.drawer-panel{
  position:absolute;
  inset:0 0 0 auto;
  width:min(640px,94vw);
  display:flex;
  flex-direction:column;
  background:var(--workspace-panel);
  border-left:1px solid var(--workspace-border);
  box-shadow:-28px 0 80px rgba(0,0,0,.28)
}
.drawer-head{
  min-height:76px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:16px 20px;
  border-bottom:1px solid var(--workspace-border)
}
.drawer-head h2{margin:4px 0 0;font-size:22px}
.drawer-head>button{width:40px;height:40px;border:1px solid var(--workspace-border);border-radius:8px;background:transparent;color:var(--workspace-text);cursor:pointer}
.drawer-form{display:flex;flex:1;min-height:0;flex-direction:column}
.drawer-grid{
  flex:1;
  overflow:auto;
  display:grid;
  grid-template-columns:1fr 1fr;
  align-content:start;
  gap:12px;
  padding:20px
}
.drawer-footer{
  min-height:70px;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  padding:12px 20px;
  border-top:1px solid var(--workspace-border)
}
.drawer-footer .save-feedback{margin-right:auto}
.toolbox-toolbar{padding-right:12px}
.compact-filter{
  display:flex;
  align-items:center;
  gap:7px;
  color:var(--workspace-muted);
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.06em
}
.compact-filter select{
  min-height:36px;
  border:1px solid var(--workspace-border);
  border-radius:8px;
  background:var(--workspace-subtle);
  color:var(--workspace-text);
  padding:0 9px
}
.tool-catalog{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px
}
.tool-record{
  min-width:0;
  display:flex;
  flex-direction:column;
  padding:14px;
  border:1px solid var(--workspace-border);
  border-radius:var(--workspace-radius);
  background:var(--workspace-panel)
}
.tool-domain{color:var(--workspace-muted);font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.08em}
.tool-title-row{display:flex;justify-content:space-between;gap:10px;margin-top:14px}
.tool-title-row h3{margin:0;font-size:18px}
.tool-title-row p{margin:4px 0 0;color:var(--workspace-muted);font-size:10px}
.tool-purpose{
  min-height:48px;
  margin:14px 0;
  color:var(--workspace-muted);
  font-size:11px;
  line-height:1.5
}
.tool-record dl{margin:0;display:grid;gap:10px}
.tool-record dl div{padding:10px;border:1px solid var(--workspace-border);border-radius:8px;background:var(--workspace-subtle)}
.tool-record dt{color:var(--workspace-muted);font-size:8px;text-transform:uppercase;letter-spacing:.06em}
.tool-record dd{margin:5px 0 0;font-size:10px;line-height:1.4}
.tool-record footer{margin-top:auto;padding-top:14px;color:var(--workspace-muted);font-size:9px}
.tool-record footer a{color:var(--workspace-accent);text-decoration:none}
.empty-workspace{
  grid-column:1/-1;
  min-height:260px;
  display:grid;
  place-items:center;
  align-content:center;
  gap:8px;
  border:1px dashed var(--workspace-border);
  border-radius:var(--workspace-radius);
  color:var(--workspace-muted);
  text-align:center
}
.empty-workspace strong{color:var(--workspace-text)}
.empty-workspace p{margin:0 0 10px;font-size:11px}
.orchestration-workspace{
  display:grid;
  grid-template-columns:minmax(0,1fr) 350px;
  gap:12px;
  min-height:calc(100dvh - 190px)
}
.orchestration-canvas{padding:0;overflow:hidden}
.orchestration-stage{
  height:calc(100dvh - 250px);
  min-height:580px;
  border:0;
  border-radius:0;
  background:var(--workspace-subtle)
}
.orchestration-inspector{height:calc(100dvh - 190px);min-height:640px;overflow:auto}
.orchestration-summary{padding:14px}
.orchestration-summary dl{margin:0;border:0}
.orchestration-summary dl div{display:flex;justify-content:space-between;gap:14px;padding:9px 0;border-bottom:1px solid var(--workspace-border);font-size:10px}
.orchestration-summary dt{color:var(--workspace-muted)}
.orchestration-summary dd{margin:0;font-weight:650;text-align:right}
.orchestration-trigger{margin-top:14px;padding:12px;border:1px solid var(--workspace-border);border-radius:8px;background:var(--workspace-subtle)}
.orchestration-trigger p{margin:5px 0 0;color:var(--workspace-muted);font-size:11px;line-height:1.5}
.orchestration-edit{display:grid;gap:11px;padding:14px;border-top:1px solid var(--workspace-border)}
.orchestration-edit .approval-check{min-height:44px}
.orchestration-world .graph-node{cursor:grab;touch-action:none}
.orchestration-world .graph-node.dragging{cursor:grabbing;z-index:20;box-shadow:0 18px 50px rgba(0,0,0,.3)}
.status-active{border-color:color-mix(in srgb,#3bd28f 38%,var(--workspace-border));color:#24a46f}
.status-approved{border-color:color-mix(in srgb,#62b5ff 38%,var(--workspace-border));color:#2487dc}
.status-retired{opacity:.65}

@media(max-width:1320px){
  .process-workspace{grid-template-columns:220px minmax(0,1fr)}
  .process-inspector{
    position:fixed;
    z-index:90;
    inset:72px 12px 12px auto;
    width:min(620px,calc(100vw - 24px));
    height:auto;
    min-height:0;
    transform:translateX(calc(100% + 24px));
    transition:transform .22s ease;
    box-shadow:0 24px 80px rgba(0,0,0,.34)
  }
  .process-inspector.open{transform:none}
  .process-inspector .inspector-close{display:grid}
  .tool-catalog{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:1100px){
  .blueprint-board{display:flex;overflow-x:auto;padding-bottom:8px;scroll-snap-type:x proximity}
  .blueprint-lane{width:min(360px,78vw);min-height:620px;flex:none;scroll-snap-align:start}
  .orchestration-workspace{grid-template-columns:1fr}
  .orchestration-inspector{height:auto;min-height:0}
  .orchestration-stage{height:620px}
}
@media(max-width:880px){
  .functional-page{width:100%;max-width:100vw;padding:14px}
  .functional-heading{align-items:flex-start;display:grid;gap:14px}
  .functional-heading h1{font-size:clamp(29px,8vw,40px)}
  .functional-actions{justify-content:flex-start;width:100%;overflow-x:auto;flex-wrap:nowrap;padding-bottom:3px}
  .functional-actions .btn{min-width:max-content;min-height:44px}
  .process-workspace{display:grid;grid-template-columns:minmax(0,1fr);min-height:0}
  .process-catalog{max-height:220px}
  .process-list{display:flex;gap:6px;overflow-x:auto;overflow-y:hidden;min-height:68px;padding:0 8px 8px}
  .process-list-item{width:210px;min-width:210px}
  .block-palette{padding:10px}
  .block-palette-grid{display:flex;overflow-x:auto}
  .block-palette .flow-template{min-width:110px;flex:none}
  .process-canvas{height:68dvh;min-height:540px}
  .process-inspector{inset:0;width:100vw;max-width:none;border-radius:0}
  .process-inspector.expanded{inset:0;width:100vw;border-radius:0}
  .process-inspector .process-form{padding-bottom:max(20px,env(safe-area-inset-bottom))}
  .blueprint-toolbar,.toolbox-toolbar{display:grid;grid-template-columns:1fr;padding:4px}
  .blueprint-summary{padding:0 12px 12px;overflow-x:auto}
  .tool-catalog{grid-template-columns:1fr}
  .compact-filter{padding:0 8px}.compact-filter select{flex:1}
  .orchestration-stage{height:66dvh;min-height:520px;overflow:auto}
  .orchestration-world{min-width:1200px}
}
@media(max-width:620px){
  .functional-page{padding:10px}
  .functional-heading h1{font-size:28px;line-height:1.05}
  .functional-heading p{font-size:13px}
  .form-section,.drawer-grid{grid-template-columns:1fr}
  .field-wide{grid-column:auto}
  .process-form-footer{align-items:stretch;display:grid}
  .footer-actions{display:grid;grid-template-columns:1fr 1fr}
  .drawer-panel{width:100vw}
  .drawer-grid{padding:14px}
  .drawer-footer{flex-wrap:wrap;padding:12px 14px}
  .drawer-footer .save-feedback{width:100%;order:-1}
  .blueprint-lane{width:86vw;min-height:440px}
  .orchestration-edit{grid-template-columns:1fr}
}
/* CIE / Briefing 360 */
.intake-page{max-width:1500px}
.intake-workspace{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px
}
.intake-section{overflow:hidden}
.intake-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  padding:16px
}

.intake-grid label{
  display:grid;
  gap:6px;
  color:var(--workspace-muted);
  font-size:9px;
  font-weight:650;
  letter-spacing:.04em;
  text-transform:uppercase
}
.intake-grid input,
.intake-grid textarea{
  width:100%;
  min-height:44px;
  border:1px solid var(--workspace-border);
  border-radius:8px;
  background:var(--workspace-subtle);
  color:var(--workspace-text);
  padding:10px 11px;
  outline:0;
  font-size:12px;
  text-transform:none;
  letter-spacing:0
}
.intake-grid textarea{min-height:118px;resize:vertical;line-height:1.5}
.intake-grid input:focus,
.intake-grid textarea:focus{
  border-color:var(--workspace-accent);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--workspace-accent) 12%,transparent)
}
.intake-save-state[data-state="pending"]{color:#72bfff}
.intake-save-state[data-state="ok"]{color:#4bd49b}
.intake-save-state[data-state="error"]{color:#ff7186}
@media(max-width:980px){
  .intake-workspace{grid-template-columns:1fr}
}
@media(max-width:620px){
  .intake-grid{grid-template-columns:1fr;padding:12px}
  .intake-page .functional-actions{align-items:center}
  .intake-page [data-intake-save]{width:100%}
}
