/* VIS-001: tokens das salas (Shiro, Kon, Tsuki, Kinari) usados na referência envio-de-imagens.
   O nome visual-v03.css permanece por compatibilidade com o carregador do Dojo.
   O acento da referência (--ink) é o --accent do Dojo. */

:root[data-theme="shiro"] {
  color-scheme: light;
  --ground: #eaeef0;
  --surface: #f5f8f9;
  --raised: #ffffff;
  --sunken: #dde4e7;
  --hover: #e3e9ec;
  --line: #c9d3d7;
  --line-soft: #dce3e6;
  --text: #141b1e;
  --text-2: #465359;
  --text-3: #5f6e74;
  --accent: #c23e1b;
  --accent-lo: #e2542e;
  --accent-hi: #e2542e;
  --accent-wash: #fbeae3;
  --line-accent: #efc0ae;
  --ink-fg: #ffffff;
  --selection: #2858c7;
  --selection-soft: #e8effd;
  --status-ink: #ffffff;
  --pend: #8f6210;
  --pend-2: #61430b;
  --pend-soft: #f5e7ca;
  --pend-line: #dabb79;
  --ok: #2b6e4c;
  --ok-2: #1d4933;
  --ok-soft: #d3e8dc;
  --ok-line: #8cbfa6;
  --stop: #a02443;
  --stop-2: #761b32;
  --stop-soft: #f3d4dc;
  --stop-line: #d992a4;
  --sh1: 0 1px 2px rgba(16, 26, 30, 0.06), 0 2px 6px rgba(16, 26, 30, 0.05);
  --sh2: 0 2px 4px rgba(16, 26, 30, 0.07), 0 12px 28px rgba(16, 26, 30, 0.1);
  --sh3: 0 8px 16px rgba(16, 26, 30, 0.1), 0 32px 64px rgba(16, 26, 30, 0.2);
  --scrim: rgba(14, 24, 28, 0.46);
  --node-style: #2a6e7a;
  --node-character: #386a86;
  --node-location: #6c5984;
  --node-scene: #54618c;
}

:root[data-theme="kinari"] {
  color-scheme: light;
  --ground: #eeeae0;
  --surface: #f5f2ea;
  --raised: #faf8f3;
  --sunken: #e3ded1;
  --hover: #e8e3d7;
  --line: #cfc8b8;
  --line-soft: #ded8ca;
  --text: #27241f;
  --text-2: #57524a;
  --text-3: #6a645a;
  --accent: #2f7a87;
  --accent-lo: #235e69;
  --accent-hi: #235e69;
  --accent-wash: #dce9e8;
  --line-accent: #9cc3c6;
  --ink-fg: #ffffff;
  --selection: #2858c7;
  --selection-soft: #e6ecf6;
  --status-ink: #ffffff;
  --pend: #8f6210;
  --pend-2: #61430b;
  --pend-soft: #f1e3c0;
  --pend-line: #d6b873;
  --ok: #2b6e4c;
  --ok-2: #1d4933;
  --ok-soft: #d5e5d2;
  --ok-line: #8fb99d;
  --stop: #a02443;
  --stop-2: #761b32;
  --stop-soft: #f0d5d3;
  --stop-line: #d49a9b;
  --sh1: 0 1px 2px rgba(39, 36, 31, 0.06), 0 2px 6px rgba(39, 36, 31, 0.05);
  --sh2: 0 2px 4px rgba(39, 36, 31, 0.07), 0 12px 28px rgba(39, 36, 31, 0.1);
  --sh3: 0 8px 16px rgba(39, 36, 31, 0.1), 0 32px 64px rgba(39, 36, 31, 0.2);
  --scrim: rgba(30, 27, 22, 0.46);
  --node-style: #2a6e7a;
  --node-character: #386a86;
  --node-location: #6c5984;
  --node-scene: #54618c;
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme]) {
    color-scheme: light;
    --ground: #eaeef0;
    --surface: #f5f8f9;
    --raised: #ffffff;
    --sunken: #dde4e7;
    --hover: #e3e9ec;
    --line: #c9d3d7;
    --line-soft: #dce3e6;
    --text: #141b1e;
    --text-2: #465359;
    --text-3: #5f6e74;
    --accent: #c23e1b;
    --accent-lo: #e2542e;
    --accent-hi: #e2542e;
    --accent-wash: #fbeae3;
    --line-accent: #efc0ae;
    --ink-fg: #ffffff;
    --selection: #2858c7;
    --selection-soft: #e8effd;
    --status-ink: #ffffff;
    --pend: #8f6210;
    --pend-2: #61430b;
    --pend-soft: #f5e7ca;
    --pend-line: #dabb79;
    --ok: #2b6e4c;
    --ok-2: #1d4933;
    --ok-soft: #d3e8dc;
    --ok-line: #8cbfa6;
    --stop: #a02443;
    --stop-2: #761b32;
    --stop-soft: #f3d4dc;
    --stop-line: #d992a4;
    --sh1: 0 1px 2px rgba(16, 26, 30, 0.06), 0 2px 6px rgba(16, 26, 30, 0.05);
    --sh2: 0 2px 4px rgba(16, 26, 30, 0.07), 0 12px 28px rgba(16, 26, 30, 0.1);
    --sh3: 0 8px 16px rgba(16, 26, 30, 0.1), 0 32px 64px rgba(16, 26, 30, 0.2);
    --scrim: rgba(14, 24, 28, 0.46);
    --node-style: #2a6e7a;
    --node-character: #386a86;
    --node-location: #6c5984;
    --node-scene: #54618c;
  }
}

/* Sistema escuro sem sala escolhida: a tinta (--accent) é a da sala Sumi, então o texto sobre ela é escuro
   (sem isto o botão primário ficava branco sobre cinza-claro, 1,5:1 — auditoria-077). */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) { --ink-fg: #0b1a1e; --status-ink: #0b1a1e; }
}

:root[data-theme="kon"],
:root[data-theme="tsuki"] {
  color-scheme: dark;
  --ink-fg: #0b1a1e;
  --selection: #9ab8ff;
  --selection-soft: #182942;
  --status-ink: #0b1a1e;
  --pend: #e2b057;
  --pend-2: #ecc785;
  --pend-soft: #2e2312;
  --pend-line: #6d5326;
  --ok: #6cc094;
  --ok-2: #91d3b0;
  --ok-soft: #14281d;
  --ok-line: #2e5d44;
  --stop: #e76e8c;
  --stop-2: #f19cb1;
  --stop-soft: #301219;
  --stop-line: #6f283a;
  --sh1: 0 1px 2px rgba(0, 0, 0, 0.44), 0 2px 6px rgba(0, 0, 0, 0.36);
  --sh2: 0 2px 4px rgba(0, 0, 0, 0.46), 0 12px 28px rgba(0, 0, 0, 0.44);
  --sh3: 0 8px 16px rgba(0, 0, 0, 0.5), 0 32px 64px rgba(0, 0, 0, 0.58);
  --scrim: rgba(6, 4, 2, 0.68);
  --node-style: #62a4b1;
  --node-character: #6da0be;
  --node-location: #a28ebb;
  --node-scene: #8797c4;
}

:root[data-theme="kon"] {
  --ground: #0e1114; --surface: #14171c; --raised: #1c2027; --sunken: #090a0d; --hover: #232832;
  --line: #2a313c; --line-soft: #21262e;
  --text: #e9eaed; --text-2: #abb1ba; --text-3: #828b99;
  --accent: #3f84dd; --accent-lo: #6fa3e8; --accent-hi: #6fa3e8; --accent-wash: #182435; --line-accent: #2f527e;
}
:root[data-theme="tsuki"] {
  --ground: #22262d; --surface: #292e36; --raised: #313741; --sunken: #1b1e24; --hover: #3a414c;
  --line: #434a56; --line-soft: #363c46;
  --text: #e6e8ec; --text-2: #b3b9c3; --text-3: #a0a8b5;
  --accent: #a99be6; --accent-lo: #c0b5f0; --accent-hi: #c0b5f0; --accent-wash: #34304a; --line-accent: #665c94;
}

/* VIS-001 — estética de envio-de-imagens, adaptada à aplicação real.
   A referência é a fonte das medidas; navegação, consentimentos e dados continuam no Dojo.
   Uma regra por componente: este arquivo substitui a camada v03 acumulada. */
:root {
  --top:56px; --rail:256px; --r:10px; --r-s:8px; --r-l:14px; --r-node:10px;
  --gutter-page:40px; --leading-reference:1.625; --dur-fast:100ms;
  --page-max:1280px; --voice-max:768px; --reference-input:32px;
}
body { font-size:var(--text-base); }
::selection { background:var(--selection-soft); color:var(--text); }
#app { height:100dvh; grid-template-rows:var(--top) auto minmax(0,1fr); grid-template-areas:"brand top" "rail etapas" "rail main"; }
.brand { padding:0 var(--sp-4); gap:var(--sp-2); border-color:var(--line-soft); }
.brand-name { font-size:var(--text-base); font-weight:600; }
.brand-sub { font-size:var(--text-2xs); letter-spacing:.2em; }
.brand-tile { display:grid; place-items:center; flex:none; width:32px; height:32px; border-radius:8px; background:var(--accent); }
.brand-ring { width:14px; height:14px; border-radius:50%; border:2px solid var(--ink-fg); }
.top { height:var(--top); padding:0 var(--sp-4); gap:var(--sp-3); background:color-mix(in srgb,var(--ground) 95%,transparent); border-color:var(--line); }
.rail-toggle-top .nav-label { display:none; }
.proj-pick { padding:0; font-size:var(--text-base); color:var(--text-2); flex:none; }
.proj-pick svg { display:none; }
.crumb-sep { color:var(--text-3); }
.top .project-name { min-width:0; max-width:280px; }
.project-name-button { padding:var(--gap-1) var(--gap-2); }
.project-name-button h1 { font-size:var(--text-base); font-weight:600; }
.project-name-button svg { opacity:0; width:12px; height:12px; }
.project-name-button:hover svg,.project-name-button:focus-visible svg { opacity:1; }
.busca-trigger { display:flex; align-items:center; gap:var(--sp-2); flex:1 1 280px; min-width:100px; max-width:448px; height:32px; margin-inline:auto; padding:0 var(--sp-3); border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--text-3); font:inherit; cursor:pointer; white-space:nowrap; }
.busca-trigger span { overflow:hidden; text-overflow:ellipsis; }
.busca-trigger kbd { margin-left:auto; padding:0 var(--gap-2); border:1px solid var(--line); border-radius:4px; background:var(--raised); font:400 var(--text-2xs) var(--f-mono); color:var(--text-2); }
.top > .spacer { display:none; }
.model-pick { min-width:0; height:28px; border-radius:8px; gap:var(--gap-2); padding:0 var(--sp-2); background:var(--ground); }
.model-pick .mn { font-size:var(--text-xs); }
.seletores-slot { display:inline-flex; gap:var(--sp-2); align-items:center; min-width:0; }
.top .sofia-pill { display:inline-flex; gap:var(--gap-2); width:auto; height:28px; padding:0 var(--sp-3); border:1px solid var(--line); background:var(--ground); border-radius:8px; color:var(--text); }
.top .sofia-pill svg { width:14px; height:14px; color:var(--selection); }
.top .sofia-pill[aria-pressed="true"] { background:var(--raised); border-color:var(--line); }
.sofia-pill-label { font-size:var(--text-sm); font-weight:500; }
.avatar-btn { width:28px; height:28px; background:var(--hover); color:var(--text); border:0; font-family:var(--f-sans); }
.rail { padding:var(--sp-2); gap:var(--sp-2); border-color:var(--line-soft); }
.rail .nav { height:32px; padding:0 var(--sp-2); gap:var(--sp-2); color:var(--text-2); border-radius:8px; }
.rail .nav-label { font-size:var(--text-base); }
.rail .nav[aria-current="page"] { background:var(--raised); color:var(--text); font-weight:500; border-color:transparent; box-shadow:none; }
.rail .nav-ico { color:inherit; }
.rail .nav-count { background:transparent; font-size:var(--text-2xs); }
.rail .nav-count.alert { background:var(--pend-soft); border:1px solid var(--pend-line); color:var(--pend); }
.rail-children { margin:0; padding:0; border:0; display:flex; flex-direction:column; gap:var(--sp-1); }
.rail-children[hidden] { display:none; }
#app[data-rail="open"] .rail .rail-group > .rail-primary { height:32px; padding:0 var(--sp-2); background:transparent; color:var(--text-3); border:0; box-shadow:none; }
#app[data-rail="open"] .rail-primary .nav-label { font:500 var(--text-2xs) var(--f-mono); letter-spacing:.1em; text-transform:uppercase; }
#app[data-rail="open"] .rail-primary .nav-ico { display:none; }
#app[data-rail="open"] .rail-primary .rail-chevron { opacity:0; }
#app[data-rail="open"] .rail-primary:hover .rail-chevron,#app[data-rail="open"] .rail-primary:focus-visible .rail-chevron { opacity:1; }
.rail-group:has([data-nav="grupo-configuracoes"]) { margin-top:auto; }
#app[data-rail="open"] .rail-primary[data-nav="grupo-configuracoes"] .nav-ico { display:block; width:14px; height:14px; }
#app[data-rail="open"] .rail-primary[data-nav="grupo-configuracoes"] .nav-label { font:500 var(--text-sm) var(--f-sans); letter-spacing:normal; text-transform:none; }
#app[data-rail="open"] .rail-primary[data-nav="grupo-configuracoes"] .rail-chevron { opacity:1; }
.rail-foot { margin:0 calc(var(--sp-2) * -1) calc(var(--sp-2) * -1); padding:var(--sp-2); }
.rail-foot summary { padding:var(--sp-2); font-size:var(--text-base); }
#app[data-rail="closed"] { grid-template-columns:48px minmax(0,1fr); }
#app[data-rail="closed"] .rail { padding:var(--sp-2); gap:var(--sp-2); }
#app[data-rail="closed"] .rail .nav { width:32px; padding:0; }
#app[data-rail="closed"] .rail-group > .rail-primary { display:flex; }
#app[data-rail="closed"] .rail-group:not(:has([data-nav="grupo-configuracoes"])) > .rail-children { display:flex; }
#app[data-rail="closed"] .rail .nav .nav-count { right:-4px; top:-4px; }
#app[data-rail="closed"] .rail .dept-dot { position:absolute; bottom:2px; right:2px; }
.work { overflow:auto; }
.work > .view:not(:has(.atelier)):not(:has(#cvViewport)) { flex:none; width:100%; max-width:var(--page-max); margin-inline:auto; padding:var(--sp-8) var(--gutter-page); }
.work > .view:not(:has(.atelier)):not(:has(#cvViewport)) > .view-head,
.work > .view:not(:has(.atelier)):not(:has(#cvViewport)) > .dept-head { padding:0 0 var(--sp-7); }
.work > .view:not(:has(.atelier)):not(:has(#cvViewport)) > .view-body { padding:var(--sp-8) 0 0; overflow:visible; }
.view-head h2 { font-size:var(--text-h1); font-weight:600; letter-spacing:-.025em; margin:var(--sp-2) 0; }
.view-head p { font-size:var(--text-base); color:var(--text-3); line-height:var(--leading-reference); margin:0; max-width:72ch; }
.eyebrow { font-size:var(--text-xs); letter-spacing:.2em; }
.view-head .eyebrow { color:var(--accent); }
.view-head .eyebrow,.dept-head .eyebrow { display:block; }
.view-head > .vh { flex:1 1 0; }
.view-actions { padding-bottom:0; gap:var(--sp-2); max-width:400px; }
.card,.asset,.board { background:var(--surface); border-radius:14px; box-shadow:none; }
.card { border-color:color-mix(in srgb,var(--text) 10%,transparent); }
.panel { padding:var(--sp-4); }
.panel > h3 { font-size:var(--text-h5); font-weight:600; }
.panel > .sub { font-size:var(--text-base); line-height:var(--leading-reference); }
.stack { gap:var(--sp-6); }
.stack-sm { gap:var(--sp-2); }
.field { gap:var(--sp-3); }
.field label { font-size:var(--text-base); font-weight:500; }
.hint,.sub { font-size:var(--text-base); line-height:var(--leading-reference); }
.hint { color:var(--text-3); }
.btn { min-height:32px; padding:var(--gap-2) var(--sp-3); font-size:var(--text-base); border-radius:10px; background:var(--ground); gap:var(--gap-2); box-shadow:none; }
.btn:hover { background:var(--sunken); border-color:var(--line); }
.btn.sm { min-height:28px; padding:var(--sp-1) var(--gap-3); font-size:var(--text-sm); border-radius:8px; }
:root[data-theme] .btn.primary,:root:not([data-theme]) .btn.primary { background:var(--accent); color:var(--ink-fg); border-color:transparent; }
.btn.primary:hover { background:color-mix(in srgb,var(--accent) 80%,transparent); border-color:transparent; }
.btn.ok { color:var(--status-ink); }
.btn.pend { color:var(--status-ink); }
.btn.ghost { background:transparent; border-color:transparent; }
.btn.ghost:hover { background:var(--sunken); border-color:transparent; }
.btn.danger { color:var(--stop); background:var(--stop-soft); border-color:transparent; }
.input,.select,.area { border-radius:10px; border-color:var(--line); background:transparent; font-size:var(--text-base); padding:var(--gap-2) var(--gap-3); }
.input,.select { min-height:32px; }
:root:not([data-theme="shiro"]):not([data-theme="kinari"]) .input,:root:not([data-theme="shiro"]):not([data-theme="kinari"]) .select { background:color-mix(in srgb,var(--line) 30%,transparent); }
.pill { min-height:20px; font-size:var(--text-xs); padding:0 var(--sp-2); display:inline-flex; align-items:center; gap:var(--sp-1); border-radius:999px; }
.empty { max-width:448px; margin-inline:auto; padding:var(--sp-8) var(--sp-8); gap:var(--sp-3); border-radius:14px; background:color-mix(in srgb,var(--surface) 50%,transparent); }
.empty h4 { font-size:var(--text-h4); font-weight:600; color:var(--text); }
.empty p { font-size:var(--text-base); line-height:var(--leading-reference); }
.project-filters { display:flex; flex-wrap:wrap; gap:var(--sp-4); margin-bottom:var(--sp-6); align-items:center; }
.project-search { display:flex; align-items:center; position:relative; flex:1 1 220px; min-width:0; }
.project-search svg { position:absolute; left:12px; width:16px; height:16px; color:var(--text-3); pointer-events:none; }
.project-search .input { width:100%; height:36px; padding-left:36px; }
.project-seg { display:flex; flex-wrap:wrap; gap:var(--sp-1); padding:var(--sp-1); background:color-mix(in srgb,var(--sunken) 40%,transparent); border:1px solid var(--line); border-radius:10px; }
.project-seg .btn.sm { padding-inline:var(--sp-3); border:0; background:transparent; color:var(--text-3); }
.project-seg .btn.sm[aria-pressed="true"] { background:var(--ground); color:var(--text); box-shadow:0 1px 2px #0000001f; }
.project-filters .select { height:36px; }
.project-info { display:flex; justify-content:space-between; gap:var(--sp-2); margin-bottom:var(--sp-6); }
.project-info .hint { margin:0; max-width:768px; color:var(--text-3); }
.project-info .hint:last-child { flex:none; font-family:var(--f-mono); font-size:var(--text-sm); }
.boards-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--sp-4); }
.board { padding:var(--sp-5); gap:var(--sp-4); cursor:default; }
.board[data-active="1"] { border-color:var(--line); box-shadow:none; }
.board:hover { transform:none; box-shadow:none; border-color:color-mix(in srgb,var(--accent) 40%,transparent); }
.board-body { padding:0; gap:var(--sp-2); }
.board h3 { font-size:var(--text-base); font-weight:600; line-height:var(--leading-tight); }
.project-title { padding:0; border:0; text-align:left; font:inherit; color:inherit; background:transparent; cursor:pointer; }
.board .d { font-size:var(--text-base); line-height:var(--leading-reference); color:var(--text-3); -webkit-line-clamp:3; }
.board-meta { margin:0; padding:0; gap:var(--sp-1); }
.board-meta .pill { font-family:var(--f-mono); font-size:var(--text-2xs); text-transform:uppercase; letter-spacing:.04em; }
.project-updated { margin:0; font:400 var(--text-sm) var(--f-mono); color:var(--text-3); }
.project-card-head { display:flex; align-items:flex-start; gap:var(--sp-2); }
.project-card-head > .board-meta { flex:1; }
.project-card-actions { display:flex; align-items:center; gap:var(--sp-1); }
.project-open { width:24px; height:24px; }
.project-open svg { width:16px; height:16px; }
.plan-workspace { flex:none; width:100%; max-width:var(--page-max); padding:var(--sp-8) var(--gutter-page); margin-inline:auto; overflow:visible; }
.plan-navigation { display:flex; flex-direction:column; align-items:flex-start; gap:var(--sp-3); background:transparent; padding:0 0 var(--sp-6); margin-bottom:var(--sp-7); border-color:var(--line); }
.plan-navigation > strong { display:block; font-size:var(--text-base); font-weight:600; }
.plan-navigation > .row { display:flex; width:fit-content; gap:var(--sp-1); padding:var(--sp-1); margin:0; background:color-mix(in srgb,var(--sunken) 50%,transparent); border-radius:10px; }
.plan-navigation > .row .btn { min-height:24px; border:0; background:transparent; color:var(--text-3); font-size:var(--text-base); }
.plan-navigation > .row .btn[aria-current="page"] { background:var(--ground); color:var(--text); box-shadow:var(--sh1); }
.plan-navigation > .hint { font-size:var(--text-base); color:var(--text-3); margin:0; line-height:var(--leading-normal); }
.plan-content { overflow:visible; }
.plan-content .view-head { padding:0; border:0; margin-bottom:var(--sp-6); }
.plan-content .view-head h2 { font-size:var(--text-h2); margin:0 0 var(--sp-2); }
.plan-content .view-body { padding:0; overflow:visible; }
.plan-content > .view { flex:none; }
.review-grid { grid-template-columns:repeat(auto-fill,minmax(min(240px,100%),1fr)); gap:var(--sp-4); }
.asset { border-top-width:1px; }
.asset[data-status] { border-top-width:1px; border-top-color:var(--line); }
.asset-media { aspect-ratio:4/3; }
.asset-body { padding:var(--sp-4); }
.asset-body { display:flex; flex-direction:column; gap:var(--sp-2); }
.asset-body > .asset-meta { order:-1; margin:0; }
.asset-body > .asset-title { margin:0; }
.asset-meta > .pill:not(.ok):not(.pend):not(.stop) { border:0; padding:0; background:transparent; color:var(--text-3); }
.asset-meta > .pill { font:400 var(--text-2xs) var(--f-mono); text-transform:uppercase; letter-spacing:.05em; }
.asset-version { font:400 var(--text-2xs) var(--f-mono); text-transform:uppercase; color:var(--text-3); }
.asset-text { aspect-ratio:4/3; overflow:auto; padding:var(--sp-4); font-size:var(--text-base); line-height:var(--leading-reference); color:var(--text-3); background:color-mix(in srgb,var(--sunken) 60%,transparent); }
.asset-foot { gap:var(--sp-2); }
:root[data-theme] .asset-foot .btn.ok { background:var(--accent); color:var(--ink-fg); border-color:transparent; }
.vstrip { background:transparent; border-color:var(--line-soft); padding:var(--sp-2) var(--sp-4); }
.vstrip .vchip { border-radius:8px; }
.asset-body h3 { font-size:var(--text-base); font-weight:600; }
.asset-meta { font-family:var(--f-mono); font-size:var(--text-2xs); }
.asset-foot { padding:var(--sp-3) var(--sp-4); background:color-mix(in srgb,var(--sunken) 50%,transparent); }
.dept-head { gap:var(--sp-4); border:0; }
.dept-head h2 { margin:var(--sp-2) 0; font-size:var(--text-h2); font-weight:600; letter-spacing:-.025em; }
.dept-head p { margin:0; font-size:var(--text-base); line-height:var(--leading-reference); }
.dept-badge { width:36px; height:36px; border-radius:8px; background:var(--accent-wash); color:var(--accent); }
.dept-badge svg { width:16px; height:16px; }
.order-box { border-radius:14px; background:var(--surface); }
.order-box textarea { font-size:var(--text-base); min-height:96px; padding:var(--sp-4); }
.order-bar { padding:var(--gap-3) var(--sp-4); background:color-mix(in srgb,var(--sunken) 40%,transparent); }
.order-bar .hint { color:var(--text); }
.order-bar .btn.primary { min-height:28px; font-size:var(--text-sm); padding:var(--sp-1) var(--gap-3); }
.department-view > .view-body { padding-top:var(--sp-3) !important; }
.department-view > .view-body > .stack { gap:var(--sp-8); }
.dept-head .eyebrow,.review-view .eyebrow { color:var(--text-3); }
.dept-badge { border:0; }
.department-view .order-box + .hint { margin-bottom:0; }
.visual-tip { display:flex; align-items:center; gap:var(--sp-3); padding:var(--sp-2) var(--sp-3); margin-block:var(--sp-3); background:var(--selection-soft); border:1px solid color-mix(in srgb,var(--selection) 40%,transparent); border-radius:10px; color:var(--text-2); }
.visual-tip > svg { width:16px; height:16px; flex:none; color:var(--selection); }
.visual-tip p { margin:0; flex:1; font-size:var(--text-base); line-height:var(--leading-reference); }
.visual-tip .btn { color:var(--selection); flex:none; }
.atelier > .visual-tip { margin:0 0 var(--sp-7); }
.review-view > .visual-tip { margin:0 0 var(--sp-6); }
.review-view > .view-head { padding:0 !important; margin-bottom:var(--sp-6); }
.review-view > .view-body { padding:0 !important; }
.review-view .view-head .ux-ajuda { color:var(--text-3); font-size:var(--text-xs); }
.review-filters { gap:var(--gap-2); }
.review-view #producaoPainel { order:1; }
.review-view .review-grid,.review-view .empty { order:2; }
.plan-content #tlBody > .empty { width:100%; max-width:none; padding-block:calc(var(--sp-6) * 2); }
#tlFinal { margin-top:var(--sp-6); padding:var(--sp-5); gap:var(--sp-4); }
#tlFinal > h3 { margin:0; font-size:var(--text-base); }
#tlFinal > p { margin:0; color:var(--text-3); line-height:var(--leading-reference); }
#tlFinal .row { flex-wrap:wrap; gap:var(--sp-3); align-items:flex-end; }
#tlFinal .row > label { display:flex; flex-direction:column; gap:var(--sp-2); min-width:0; flex:1 1 160px; }
#tlFinal select,#tlFinal input[type="number"] { min-height:32px; max-width:100%; border:1px solid var(--line); border-radius:8px; padding:var(--sp-1) var(--sp-2); background:var(--ground); color:var(--text); font:inherit; }
#tlFinal fieldset { min-width:0; border:1px solid var(--line); border-radius:10px; padding:var(--sp-4); gap:var(--sp-3); }
#tlFinal legend { font-size:var(--text-base); padding-inline:var(--sp-2); }
.work .card input:not([class]):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),.work .card select:not([class]),.work .card textarea:not([class]) { min-height:32px; max-width:100%; border:1px solid var(--line); border-radius:8px; padding:var(--sp-1) var(--sp-2); background:var(--ground); color:var(--text); font:inherit; }
.metrics { gap:var(--sp-4); }
.metric { padding:var(--sp-5); }
.metric .v { font-family:var(--f-sans); font-size:var(--text-h1); font-weight:600; margin-top:var(--sp-3); }
.metric .d { font-size:var(--text-sm); line-height:var(--leading-reference); }
.metric .eyebrow { font-size:var(--text-2xs); letter-spacing:.18em; }
.metric .d { font-size:var(--text-sm); }
.profile-box { background:var(--surface); border-color:var(--line); border-radius:14px; padding:var(--sp-6); }
.profile-titulo { margin:var(--sp-2) 0; font-size:var(--text-h5); font-weight:600; }
.perfil-secoes { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--sp-6); padding:var(--sp-4) 0 0; }
.perfil-secao h4 { margin:0 0 var(--sp-2); font-size:var(--text-base); font-weight:600; }
.perfil-secao p { margin:0; font-size:var(--text-base); color:var(--text-3); line-height:var(--leading-reference); }
.hermes-tabs { width:fit-content; max-width:100%; gap:var(--sp-1); padding:var(--sp-1); background:color-mix(in srgb,var(--sunken) 50%,transparent); border-radius:10px; }
.hermes-tabs .btn { border:0; background:transparent; color:var(--text-3); }
:root[data-theme] .hermes-tabs .btn.primary,:root:not([data-theme]) .hermes-tabs .btn.primary { background:var(--ground); color:var(--text); box-shadow:var(--sh1); }
.conn { padding:var(--sp-5); border-radius:14px; background:var(--surface); align-items:start; }
.conn-badge { width:40px; height:40px; border:0; background:var(--hover); }
.conn[data-on="0"] { border-style:solid; }
.conn-main { min-width:0; }
.conn .caps { margin-top:var(--sp-3); gap:var(--sp-2); }
.conn .caps .cap { border:0; border-radius:8px; font-family:var(--f-sans); font-size:var(--text-sm); letter-spacing:normal; text-transform:none; }
.conn-models { margin-top:var(--sp-3); gap:var(--gap-2); }
.conn-models .pill { min-height:24px; border-radius:8px; background:var(--ground); font-size:var(--text-xs); text-transform:none; }
.conn-name .pill { font:400 var(--text-2xs) var(--f-mono); text-transform:uppercase; }
.conn-name strong { font-size:var(--text-base); }
.conn-url { font-size:var(--text-xs); }
.ajustes-layout { display:grid; grid-template-columns:200px minmax(0,1fr); align-items:start; gap:var(--sp-6); }
.ajustes-indice { position:sticky; top:var(--sp-4); display:flex; flex-direction:column; gap:var(--sp-1); }
.ajustes-indice a { color:var(--text-3); padding:var(--sp-2) var(--sp-3); border-radius:8px; text-decoration:none; }
.ajustes-indice a:hover { background:var(--raised); color:var(--text); }
.ajuste-secao { scroll-margin-top:var(--sp-4); }
.ajustes-layout .panel { padding:var(--sp-6); }
.ajustes-layout .panel > h3 { margin:0 0 var(--sp-3); }
.ajustes-layout .panel > h3 + .sub { margin:0 calc(var(--sp-6) * -1) var(--sp-6); padding:0 var(--sp-6) var(--sp-5); border-bottom:1px solid var(--line); }
.ajustes-indice a { padding-block:var(--gap-2); }
.esteira { gap:var(--sp-2); }
.esteira-item { min-height:54px; padding:var(--sp-3) var(--sp-4); background:var(--ground); border-radius:10px; gap:var(--sp-3); }
.esteira-item strong,.esteira-item .hint { font-size:var(--text-base); }
.esteira-n { width:24px; height:24px; font-size:var(--text-xs); background:transparent; }
.briefing-card { padding:var(--sp-5); background:var(--surface); border:1px solid var(--line); border-radius:14px; }
.briefing-card > p { max-width:var(--voice-max); line-height:var(--leading-reference); }
.atelier { padding:var(--sp-8) var(--gutter-page) 0; width:100%; max-width:var(--page-max); margin-inline:auto; }
.atelier > .leitura-bar-ghost { margin:0; padding:0; justify-content:flex-end; max-width:none; }
.atelier-controles { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:var(--sp-2); padding:var(--sp-3) 0 0; }
.atelier-toolbar { display:flex; align-items:center; gap:var(--sp-4); flex-wrap:wrap; }
.atelier-toolbar > .leitura-bar { margin:0; padding:0; margin-left:auto; }
.atelier-toolbar .atelier-controles { padding:0; margin-left:auto; }
.atelier-toolbar > .autonomy-controls { padding:0; }
.atelier-toolbar > .autonomy-controls[open] { flex-basis:100%; }
.autonomy-controls > summary.btn { background:transparent; border:0; list-style:none; padding-inline:0; color:var(--text); }
.autonomy-controls > summary.btn::-webkit-details-marker { display:none; }
.stream { padding:var(--sp-6) 0 var(--sp-8); }
.stream-in { max-width:var(--voice-max); padding:0; gap:var(--sp-6); }
.say { font-size:var(--text-base); line-height:var(--leading-reference); }
.said { background:var(--surface); border-color:var(--line); padding:var(--sp-2) var(--sp-3); }
.av.sofia { background:transparent; color:var(--selection); border-color:color-mix(in srgb,var(--selection) 50%,transparent); }
.composer-wrap { border:0; background:color-mix(in srgb,var(--ground) 95%,transparent); padding:var(--sp-2) 0 var(--sp-4); }
.composer { max-width:var(--voice-max); padding:0; }
.cbox { background:var(--surface); border-radius:14px; box-shadow:none; }
.cbox textarea { min-height:64px; }
.cbar { padding:var(--sp-2) var(--sp-3); }
:root[data-theme] .send,:root:not([data-theme]) .send { background:var(--accent); color:var(--ink-fg); width:32px; height:32px; border-radius:8px; }
.gatecard { background:var(--surface); border-radius:14px; box-shadow:none; }
.gatecard .gate-note,.gatecard .gate-head,.gatecard .gate-title,.gatecard .q-block { padding-inline:var(--sp-4); }
.gate-ask { font-style:normal; font-size:var(--text-base); }
.slate { height:4px; background-image:none; }
.opt { padding:var(--sp-3); border-radius:8px; }
.opt-label { font-size:var(--text-base); }
.opt-detail { font-size:var(--text-sm); line-height:var(--leading-reference); }
.sofia-drawer { top:calc(var(--top) + 16px); right:16px; bottom:16px; width:380px; max-width:calc(100vw - 32px); border:1px solid var(--line); border-radius:14px; background:var(--raised); overflow:hidden; box-shadow:var(--sh3); }
.sofia-drawer-head { padding:var(--sp-3) var(--sp-4); }
.sofia-drawer-autonomy { padding:var(--sp-2) var(--sp-4); }
.sofia-panel-avatar { display:grid; place-items:center; width:24px; height:24px; border-radius:50%; border:1px solid var(--selection); color:var(--selection); font-size:var(--text-xs); }
.sofia-drawer-head strong { font-size:var(--text-base); }
.sofia-drawer-head .pill { font-size:var(--text-xs); background:var(--surface); color:var(--text-2); }
.sofia-drawer .stream-in { padding-inline:var(--sp-4); }
.sofia-drawer .composer-wrap { padding:var(--sp-3); border-top:1px solid var(--line); background:var(--raised); }
.sofia-drawer .composer { padding:0; }
.sofia-drawer .say { font-size:var(--text-base); }
.sofia-modelos { display:flex; gap:var(--sp-2); flex-wrap:wrap; padding-bottom:var(--sp-3); }
.sofia-modelos .model-pick { flex:1; max-width:100%; }
.cv-node { border-radius:10px; background:var(--surface); }
.cv-node:hover { box-shadow:var(--sh2); }
.cv-node-head { padding:var(--gap-2) var(--sp-2); gap:var(--gap-2); }
.cv-node-head svg { width:14px; height:14px; }
.cv-node-head .cv-title { font-size:var(--text-sm); font-weight:600; height:22px; padding:var(--gap-1) var(--sp-1); }
.cv-node-body { padding:var(--sp-2); gap:var(--sp-2); }
.cv-empty { max-height:calc(100% - 32px); overflow:auto; }
#salvamentoCanvas { display:flex; gap:var(--sp-2); align-items:center; padding:var(--sp-1) var(--sp-6); }
#salvamentoCanvas .hint { margin:0; font-size:var(--text-sm); }
.faixa-etapas { grid-area:etapas; display:flex; align-items:center; gap:var(--sp-3); min-height:48px; min-width:0; padding:var(--sp-2) var(--sp-4); background:var(--surface); border-bottom:1px solid var(--line); }
.faixa-etapas[hidden],.etapas-segmentos[hidden],.etapas-situacao[hidden],.controles-projeto[hidden] { display:none; }
.etapas-segmentos { display:flex; flex:none; min-width:0; max-width:40%; }
.project-stage-bar { padding:0; border:0; background:transparent; min-width:0; flex:1 1 0; width:100%; max-width:100%; }
.project-stage-bar { display:flex; align-items:center; gap:var(--sp-2); }
.project-stage-bar .stage-note { position:relative; font-size:var(--text-sm); }
.project-stage-bar .stage-note > summary { display:grid; place-items:center; width:24px; height:28px; cursor:pointer; list-style:none; color:var(--text-3); }
.project-stage-bar .stage-note > summary::-webkit-details-marker { display:none; }
.project-stage-bar .stage-note > summary svg { width:14px; height:14px; }
.project-stage-bar .stage-note > p { position:absolute; z-index:80; width:min(320px,calc(100vw - 32px)); top:28px; right:0; padding:var(--sp-4); background:var(--raised); border:1px solid var(--line); border-radius:10px; box-shadow:var(--sh2); white-space:normal; }
.project-stage-bar .stage-note:not([open]) > p { display:none; }
.project-stage-bar .etapas-lista { display:flex; align-items:center; list-style:none; margin:0; padding:0; gap:var(--sp-1); overflow-x:auto; min-width:0; }
.project-stage-bar .etapas-lista li,.project-stage-bar .etapas-lista li[data-current="true"] { display:flex; flex-direction:row; align-items:center; flex:none; min-width:0; gap:var(--sp-1); }
.project-stage-bar .stage-link { display:flex; gap:var(--sp-1); min-height:28px; width:auto; height:28px; padding:var(--sp-1); border:0; border-radius:8px; background:transparent; flex:none; }
.project-stage-bar .stage-link:hover { background:var(--hover); }
.project-stage-bar .stage-dot { display:block; width:12px; height:6px; border:0; border-radius:999px; background:var(--line); font-size:0; color:transparent; }
.project-stage-bar .stage-link[aria-current] .stage-dot { width:24px; background:var(--selection); }
.project-stage-bar li[data-stage-state="concluida"] .stage-dot { background:var(--ok); }
.project-stage-bar li[data-stage-state="erro"] .stage-dot { background:var(--stop); }
.project-stage-bar li[data-stage-state="aguardando_decisao"] .stage-dot { background:var(--pend); }
.project-stage-bar .stage-copy { display:none; align-items:center; flex-direction:row; gap:var(--sp-2); white-space:nowrap; }
.project-stage-bar .stage-link[aria-current] .stage-copy { display:flex; }
.project-stage-bar .stage-copy strong { font-size:var(--text-sm); font-weight:600; color:var(--text); }
.project-stage-bar .stage-copy > span:not(.stage-fraction) { display:none; }
.project-stage-bar .stage-copy > .stage-fraction { font:400 var(--text-xs) var(--f-mono); color:var(--text-3); }
.project-stage-bar .stage-copy,.project-stage-bar .stage-link[aria-current] .stage-copy { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
.stage-current { display:flex; align-items:center; gap:var(--sp-2); min-height:28px; padding:var(--sp-1); border:0; background:transparent; color:var(--text); font:600 var(--text-base) var(--f-sans); white-space:nowrap; cursor:pointer; }
.stage-current > span { font:400 var(--text-xs) var(--f-mono); color:var(--text-3); }
.project-stage-bar li > .btn { font-size:var(--text-xs); padding:var(--sp-1); }
.etapas-situacao { display:flex; flex:1; min-width:0; }
.etapas-situacao #situacaoProducaoProjeto { display:flex; align-items:center; gap:var(--sp-2); width:100%; min-width:0; }
.etapas-situacao .hint { margin:0; font-size:var(--text-sm); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.etapas-situacao .btn { margin-left:auto; flex:none; }
.project-finance { display:flex; flex-direction:row; gap:var(--sp-2); flex-wrap:nowrap; align-items:center; max-width:none; }
.project-finance .model-pick { font:400 var(--text-xs) var(--f-mono); padding:var(--sp-1); border:0; background:transparent; }
.faixa-recolher { margin-left:auto; flex:none; }
.controles-projeto { display:flex; flex-wrap:wrap; gap:var(--sp-2); padding:var(--sp-1) var(--sp-4); justify-content:flex-end; }
.controles-projeto .stage-note { margin-right:auto; font-size:var(--text-xs); color:var(--text-3); }
.controles-projeto #barraEtapasProjeto { display:none; }
.controles-projeto:empty { display:none; }
#app[data-faixa="closed"] #controlesProjeto { display:none; }
#app[data-faixa="closed"] .faixa-etapas > :not(.faixa-recolher) { display:none; }
#app[data-faixa="closed"] .faixa-etapas { min-height:28px; padding-block:var(--sp-1); }
.cv-view > .view-head { padding:var(--sp-6); align-items:flex-end; }
.cv-view > .view-head h2 { font-size:var(--text-h2); }
.cv-view > .view-head > .vh { flex:1 1 320px; max-width:400px; }
.cv-view > .view-head > .view-actions { flex:1 1 400px; max-width:none; }
.cv-view .btn.primary.pend { background:var(--pend); color:var(--status-ink); }
.cv-workspace-toolbar { display:flex; align-items:center; gap:var(--sp-3); flex-wrap:wrap; min-height:48px; padding:var(--sp-2) var(--sp-6); border-bottom:1px solid var(--line); }
.cv-workspace-toolbar .cv-boards { padding:0; gap:var(--sp-1); }
.cv-workspace-toolbar .cv-board-tab { min-height:28px; border-radius:8px; }
.cv-workspace-toolbar #salvamentoCanvas { padding:0; margin-left:auto; }
.cv-workspace-toolbar .cv-guia { margin:0; padding:0; border:0; background:transparent; color:var(--text-3); }
.cv-workspace-toolbar .cv-guia[open] { flex-basis:100%; padding:var(--sp-3); background:var(--surface); border-radius:10px; }
.busca-rapida { position:fixed; inset:0; z-index:1000; display:flex; justify-content:center; align-items:flex-start; padding-top:12vh; background:var(--scrim); }
.busca-rapida-painel { width:min(560px,calc(100vw - 32px)); padding:var(--sp-3); display:flex; flex-direction:column; gap:var(--sp-2); background:var(--raised); border:1px solid var(--line); border-radius:14px; box-shadow:var(--sh3); }
.busca-rapida-painel input { width:100%; height:40px; padding:0 var(--sp-3); border:1px solid var(--line); border-radius:10px; background:var(--surface); color:var(--text); font:inherit; }
.busca-rapida-lista { list-style:none; padding:0; margin:0; max-height:50vh; overflow:auto; }
.busca-rapida-item { width:100%; display:flex; justify-content:space-between; gap:var(--sp-3); padding:var(--gap-3) var(--sp-3); border:0; border-radius:8px; background:transparent; color:var(--text); text-align:left; font:inherit; cursor:pointer; }
.busca-rapida-item:hover { background:var(--hover); }
.ir-conversa { display:block; position:sticky; bottom:8px; margin:var(--sp-2) auto 0; }
.ir-conversa[hidden] { display:none; }
.menu,.modal,.popover { border-radius:14px; }
@media (max-width:1279px) {
  .boards-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .top .busca-trigger { max-width:280px; }
  .project-filters { align-items:stretch; }
  .project-search { flex-basis:100%; }
}
@media (max-width:1023px) {
  :root { --gutter-page:24px; }
  .top .project-name { max-width:160px; }
  .top { gap:var(--sp-2); }
  .perfil-secoes { grid-template-columns:1fr; }
  .ajustes-layout { grid-template-columns:1fr; }
  .ajustes-indice { position:static; flex-direction:row; flex-wrap:wrap; }
  .project-info { flex-direction:column; }
  .faixa-etapas .project-finance { flex:1 1 100%; }
}
@media (max-width:700px) {
  #app { grid-template-columns:0 minmax(0,1fr); grid-template-areas:"top top" "etapas etapas" "main main"; }
  #app[data-rail="closed"] { grid-template-columns:0 minmax(0,1fr); }
  .brand { display:none; }
  .top { height:56px; flex-wrap:nowrap; gap:var(--gap-2); padding-inline:var(--sp-3); }
  .top .proj-pick,.top .crumb-sep { display:none; }
  .top .project-name { flex:1; max-width:none; }
  .top .busca-trigger { flex:none; min-width:28px; width:28px; height:28px; padding:var(--gap-2); border:0; background:transparent; }
  .top .busca-trigger span,.top .busca-trigger kbd,.top .sofia-pill-label { display:none; }
  .top #roomPick .mn,.top #roomPick > svg { display:none; }
  .top #roomPick { width:28px; padding:var(--gap-2); border:0; }
  .top .sofia-pill { width:28px; padding:var(--gap-2); border:0; }
  #app[data-rail="open"] .rail { position:fixed; inset:56px auto 0 0; width:256px; z-index:60; box-shadow:var(--sh3); }
  #app[data-rail="closed"] .rail { display:none; }
  .boards-grid { grid-template-columns:1fr; }
  .work > .view:not(:has(.atelier)):not(:has(#cvViewport)),.plan-workspace { padding-block:var(--sp-6); }
  .view-head h2 { font-size:var(--text-h2); }
  .view-actions { width:100%; max-width:100%; justify-content:flex-start; }
  .view-head > .vh { flex-basis:100%; }
  .atelier { padding-top:var(--sp-6); }
  .input,.select,.area,.cbox textarea { font-size:var(--text-h5); }
  .stream-in,.composer { width:100%; }
  .sofia-drawer { top:72px; bottom:16px; }
  .etapas-situacao #situacaoProducaoProjeto { flex-wrap:wrap; }
  #app[data-view="canvas"] .faixa-etapas { flex-wrap:wrap; }
  #app[data-view="canvas"] .etapas-segmentos { flex:1 1 100%; }
  .faixa-etapas { padding-inline:var(--sp-3); flex-wrap:wrap; }
  .etapas-segmentos { flex:1 1 100%; max-width:100%; }
  .etapas-situacao { flex:1 1 100%; }
  .etapas-situacao .hint { white-space:normal; }
  .conn { grid-template-columns:auto minmax(0,1fr); }
  .conn-side { grid-column:2; flex-wrap:wrap; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
}

/* VIS-002 — superfície de trabalho ampla; consultas por demanda. */
#app[data-faixa="closed"] .faixa-etapas { display:none; }
.top .faixa-recolher { margin:0; color:var(--text-2); flex:none; width:32px; height:32px; padding:var(--gap-2); border-color:transparent; }
.top .faixa-recolher > span { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.top .faixa-recolher[aria-expanded="true"] { background:var(--hover); }
.cv-view > .view-head { padding:var(--gap-3) var(--sp-4); align-items:center; gap:var(--sp-3); }
.cv-view > .view-head > .vh { flex:0 0 auto; max-width:none; }
.cv-heading { display:flex; align-items:center; gap:var(--gap-3); }
.cv-view > .view-head h2 { margin:0; font-size:var(--text-h4); }
.cv-view > .view-head > .view-actions { flex:1 1 auto; width:auto; align-items:center; gap:var(--gap-2); }
.cv-orientacao { position:relative; }
.cv-orientacao > summary { list-style:none; cursor:pointer; color:var(--text-2); }
.cv-orientacao > summary::-webkit-details-marker { display:none; }
.cv-orientacao-body { position:absolute; top:calc(100% + var(--gap-2)); left:0; width:min(360px,calc(100vw - 48px)); z-index:45; padding:var(--gap-4); border:1px solid var(--line); border-radius:var(--r-s); background:var(--raised); box-shadow:var(--sh3); font-size:var(--text-sm); }
.cv-orientacao-body p { margin:var(--gap-2) 0 0; }
.cv-workspace-toolbar { min-height:40px; padding:var(--gap-2) var(--sp-4); gap:var(--sp-2); }
.atelier { padding-top:var(--sp-3); }
.atelier-toolbar { position:relative; width:100%; max-width:var(--voice-max); margin-inline:auto; gap:var(--gap-2); justify-content:flex-end; }
.atelier-toolbar > .autonomy-controls,.atelier-toolbar > .autonomy-controls[open] { flex:0 1 auto; position:static; }
.atelier-toolbar > .leitura-bar { margin:0; border:0; }
.atelier-toolbar .atelier-utility { display:inline-flex; align-items:center; gap:var(--gap-2); min-height:32px; padding:var(--gap-2) var(--gap-3); border:1px solid transparent; border-radius:var(--r-s); background:transparent; color:var(--text-2); font-size:var(--text-sm); text-decoration:none; }
.atelier-toolbar .atelier-utility:hover,.atelier-toolbar details[open] > .atelier-utility { background:var(--hover); border-color:var(--line); color:var(--text); }
.atelier-toolbar .atelier-utility svg { width:14px; height:14px; color:currentColor; }
.atelier-toolbar .autonomy-popover,.atelier-failure-popover { position:absolute; top:calc(100% + var(--gap-2)); right:0; z-index:50; width:min(440px,100%); max-height:min(60dvh,520px); overflow:auto; overscroll-behavior:contain; padding:var(--gap-4); background:var(--raised); border:1px solid var(--line); border-radius:var(--r-s); box-shadow:var(--sh3); }
.atelier-toolbar .autonomy-bar { margin:0; padding:0; border:0; box-shadow:none; background:transparent; flex-direction:column; gap:var(--sp-3); }
.atelier-toolbar .autonomy-item { align-items:flex-start; }
.atelier-toolbar .autonomy-txt .hint { max-width:none; font-size:var(--text-sm); line-height:var(--leading-reference); }
.atelier-toolbar .ux-falhas { margin:0; padding:0; border:0; background:transparent; }
.atelier-toolbar .atelier-failure { display:flex; align-items:center; gap:var(--gap-2); min-height:32px; padding:var(--gap-2) var(--gap-3); font-size:var(--text-sm); border-color:var(--stop-line); color:var(--stop); background:var(--stop-soft); list-style:none; cursor:pointer; }
.atelier-failure::-webkit-details-marker { display:none; }
.atelier-failure-popover > p { margin:0 0 var(--sp-3); }
#diagnosticoGeracaoAtelie:empty,#diagnosticoGeracaoAtelie[hidden] { display:none; }
.atelier .cbar { flex-wrap:wrap; gap:var(--gap-2); }
.atelier .cbar .atelier-controles { display:flex; flex-wrap:nowrap; align-items:center; gap:var(--gap-2); padding:0; margin:0; min-width:0; max-width:calc(100% - 38px); }
.atelier-controles .model-pick { min-height:32px; max-width:220px; padding:var(--gap-2) var(--gap-3); }
.atelier-controles .model-pick .mn { min-width:0; overflow:hidden; text-overflow:ellipsis; }
.atelier-controles .model-pick .pv { flex:none; }
.atelier-controles #modelPick .pv { max-width:84px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.atelier .cbar .send { flex:none; }
.atelier .cbar .chint:empty { display:none; }
@media (max-width:700px) {
  .top .faixa-recolher { width:28px; padding:var(--gap-2); border:0; }
  .top .faixa-recolher > span { display:none; }
  .cv-view > .view-head { padding:var(--gap-2) var(--sp-3); gap:var(--gap-2); }
  .cv-view > .view-head > .vh { flex:0 0 auto; }
  .cv-view > .view-head > .view-actions { flex:1 1 100%; width:100%; }
  .cv-view .cv-action-group { padding-right:var(--gap-2); }
  .cv-workspace-toolbar { padding-inline:var(--sp-3); }
  .cv-view > .view-head { position:relative; }
  .cv-orientacao { position:static; }
  .cv-orientacao-body { left:var(--sp-3); right:var(--sp-3); width:auto; }
  .atelier { padding-top:var(--sp-2); }
  .atelier-toolbar { justify-content:flex-start; gap:var(--gap-1); }
  .atelier-toolbar .atelier-utility { padding-inline:var(--gap-2); font-size:var(--text-xs); }
  .atelier .cbar .spacer { display:none; }
  .atelier .cbar .chint { flex-basis:100%; }
  .atelier .cbar .atelier-controles { margin-left:auto; flex:1 1 auto; }
  .atelier-controles .model-pick { max-width:50%; }
  .atelier-controles .model-pick .pv { display:none; }
  .atelier .cbar .icon-btn { flex:none; }
}

/* VIS-002A — aviso lateral e seletores discretos no compositor. */
.atelier { position:relative; }
.atelier-failure-dock { position:absolute; top:var(--sp-3); left:max(var(--sp-3),calc((100% - var(--voice-max)) / 2 - 52px)); z-index:50; }
.atelier-failure-dock .ux-falhas { position:relative; margin:0; padding:0; border:0; background:transparent; }
.atelier-failure-dock .atelier-failure { position:relative; display:flex; align-items:center; justify-content:center; width:36px; height:36px; padding:var(--gap-2); color:var(--stop); background:var(--raised); border:1px solid var(--stop-line); border-radius:50%; list-style:none; cursor:pointer; }
.atelier-failure-dock .atelier-failure:hover,.atelier-failure-dock details[open] > .atelier-failure { background:var(--stop-soft); }
.atelier-failure-dock .atelier-failure-count { position:absolute; top:-4px; right:-6px; display:grid; place-items:center; min-width:18px; height:18px; padding:0 var(--gap-1); border-radius:999px; background:var(--raised); border:1px solid var(--stop-line); color:var(--stop); font-size:var(--text-2xs); line-height:var(--leading-tight); }
.atelier-failure-dock .atelier-failure-popover { left:calc(100% + var(--gap-3)); right:auto; top:0; width:min(440px,calc(100vw - 96px)); max-height:min(60dvh,520px); }
.atelier-failure-head { display:flex; align-items:center; justify-content:space-between; gap:var(--gap-3); margin-bottom:var(--sp-2); }
.atelier-failure-head strong { font-size:var(--text-base); }
.atelier-controles .model-pick { min-height:28px; height:28px; max-width:184px; padding:0 var(--gap-2); border-color:transparent; background:transparent; color:var(--text-2); border-radius:var(--r-s); }
.atelier-controles .model-pick .mn { font-size:var(--text-xs); }
.atelier-controles #modelPick .pv { max-width:52px; padding:0; background:transparent; color:var(--text-3); font-size:var(--text-2xs); }
.atelier-controles .model-pick:hover { background:var(--hover); border-color:var(--line); color:var(--text); }
.atelier-controles .model-pick:focus-visible { background:var(--hover); }
@media (max-width:1023px) {
  .atelier-failure-dock { left:var(--gutter-page); }
  .atelier:has(.atelier-failure-dock:not([hidden]):not(:empty)) .atelier-toolbar { padding-left:44px; min-height:36px; }
  .atelier-failure-dock .atelier-failure-popover { top:calc(100% + var(--gap-2)); left:0; width:min(440px,calc(100vw - 2 * var(--gutter-page))); }
}
@media (max-width:700px) {
  .atelier-failure-dock { top:var(--sp-2); }
  .atelier .cbar .atelier-controles { gap:var(--gap-1); }
}

/* Modo é uma configuração ocasional; modelo permanece próximo do envio. */
.modo-icon { display:none; }
.atelier-modo { display:flex; align-items:center; flex:none; }
.atelier #modoPick { display:flex; align-items:center; justify-content:center; width:28px; height:28px; min-width:28px; padding:var(--gap-2); border-color:transparent; background:transparent; color:var(--text-3); }
.atelier #modoPick > .mn,.atelier #modoPick > svg { display:none; }
.atelier #modoPick .modo-icon { display:flex; }
.atelier #modoPick:hover,.atelier #modoPick:focus-visible { color:var(--text); background:var(--hover); }
.atelier #modoPick[data-modo="autonoma"] { color:var(--pend); background:var(--pend-soft); border-color:var(--pend-line); }
.atelier #modoPick[data-modo="rapida"] { color:var(--selection); }
.atelier .cbar .atelier-controles { flex:0 1 auto; max-width:184px; }
.atelier-controles #modelPick { max-width:100%; }
.atelier > .stream { padding-top:var(--sp-3); }
.sofia-convite { margin-top:var(--sp-7); }
.atelier .sofia-convite { margin-top:0; }
@media (max-width:700px) {
  .atelier > .stream { padding-top:var(--sp-2); }
  .atelier .cbar .atelier-controles { margin-left:auto; flex:1 1 0; max-width:184px; }
}

/* Auditoria 20/10/2026: no celular, 64% dos alvos de toque do Canvas ficavam abaixo de 40x36 px (a maioria, o botão pequeno `.btn.sm`, 28 px de
   altura). Em telas estreitas os botões pequenos ganham altura de toque; o desktop não muda. Fica aqui porque esta folha carrega depois e define o 28 px. */
@media (max-width: 720px) {
  .btn.sm, .btn.ghost.sm, .btn.primary.sm { min-height: 40px; }
  .cv-board-tab.add, button.switch { min-width: 40px; min-height: 40px; }
  button.project-title { min-height: 40px; }
}


/* Auditoria 20/10/2026: no celular as barras do Canvas somavam ~64% da altura (cabeçalho, custo, Orientações, ferramentas, abas, status de salvamento).
   Aqui as ferramentas dividem a linha com Orientações, o espaço entre faixas encolhe e o status de salvamento fica na linha das abas. */
@media (max-width: 720px) {
  .cv-view > .view-head { flex-wrap: nowrap; padding-top: var(--sp-2); padding-bottom: var(--sp-2); gap: var(--sp-2); align-items: center; }
  .view-head .vh.cv-heading { flex: 0 0 auto; }
  .view-head .view-actions.cv-toolbar { flex: 1 1 0; min-width: 0; justify-content: flex-end; gap: var(--sp-1); }
  .view-head .cv-toolbar .btn.sm, .cv-heading .btn.sm { padding-inline: var(--sp-2); }
  .cv-workspace-toolbar { gap: var(--sp-1); padding-block: var(--sp-1); }
  .cv-workspace-toolbar #salvamentoCanvas { flex: 1 1 0; min-width: 0; font-size: var(--text-xs); text-align: right; }
}
@media (max-width: 720px) { .cv-toolbar .rot-longo, .cv-heading .rot-longo { display: none; } .cv-toolbar .btn.sm:has(> .rot-longo) { min-width: 40px; justify-content: center; } }

/* Auditoria 20/10/2026: a gaveta da Sofia (380 px, fixa) cobria os botões da barra do Canvas em 1440 px. Em telas largas o conteúdo cede o espaço dela. */
@media (min-width: 1100px) {
  body.sofia-aberta .project-work > .work, body.sofia-aberta .faixa-etapas { padding-right: 380px; }
}

/* 062 (20/10/2026): o custo do cabeçalho agora traz a composição IA/mídia; a linha de custos quebra em vez de alargar a página. */
.project-finance { flex-wrap: wrap; min-width: 0; max-width: 100%; }
.project-finance .project-cost { min-width: 0; max-width: 100%; white-space: normal; overflow-wrap: anywhere; text-align: left; }

/* Composição de custos legível; a faixa quebra antes de transbordar a área útil. */
.faixa-etapas{flex-wrap:wrap;}
@media(min-width:601px) and (max-width:1440px){
 .faixa-etapas .project-finance{flex:1 1 100%;min-width:0;max-width:100%;flex-wrap:wrap;}
 .faixa-etapas .project-cost{flex:1 1 180px;min-width:0;max-width:100%;overflow-wrap:anywhere;}
}
