/* PCIPE — base visual comum a todos os módulos (tokens, botões, barra superior). */
/* Paleta B — grafite com detalhes em oliva (cor da logomarca #AEBB73).
   --pri = ação (botões principais); --acc = destaque (etapa atual, módulo ativo, obra);
   --red = SOMENTE alerta (não atende, redutora, excluir); verde e âmbar = situação. */
:root{
  --bg:#F3F4F3; --surface:#FFFFFF; --ink:#24282B; --muted:#646B6F; --line:#D9DDDC; --chip:#E9ECEA;
  --pri:#3B4349; --pri-ink:#FFFFFF; --pri-soft:#EEF0E6; --acc:#9AA864; --acc-soft:#EEF1E1;
  --red:#B4473A; --red-soft:#F8E7E3; --green:#4C7A35; --green-soft:#E7F0DF; --amber:#9A6A1A; --amber-soft:#F7EEDA;
  --focus:#6F7D3C; --navy:#3B4349;
  --f-display:"Barlow Condensed","Arial Narrow",Arial,sans-serif; --f-body:"Barlow","Segoe UI",Roboto,Arial,sans-serif; --f-mono:"IBM Plex Mono",ui-monospace,Consolas,monospace;
  --gutter:max(16px,env(safe-area-inset-left,0px)); --app-max:1120px;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#15181A; --surface:#1E2225; --ink:#E6E9E7; --muted:#9BA3A6; --line:#30363A; --chip:#272C2F;
  --pri:#C3CE8A; --pri-ink:#15181A; --pri-soft:#2A2F22; --acc:#9AA864; --acc-soft:#2A2F22;
  --red:#E07A6C; --red-soft:#3A2220; --green:#7FB862; --green-soft:#1D2B18; --amber:#E2AE55; --amber-soft:#33281A; --focus:#C3CE8A; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#15181A; --surface:#1E2225; --ink:#E6E9E7; --muted:#9BA3A6; --line:#30363A; --chip:#272C2F;
  --pri:#C3CE8A; --pri-ink:#15181A; --pri-soft:#2A2F22; --acc:#9AA864; --acc-soft:#2A2F22;
  --red:#E07A6C; --red-soft:#3A2220; --green:#7FB862; --green-soft:#1D2B18; --amber:#E2AE55; --amber-soft:#33281A; --focus:#C3CE8A; color-scheme:dark}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--f-body)}
img{max-width:100%}

/* Botões */
.btn{all:unset;box-sizing:border-box;cursor:pointer;font-family:var(--f-body);font-weight:600;font-size:17px;border-radius:12px;padding:14px 22px;min-height:54px;display:inline-flex;align-items:center;justify-content:center;gap:8px;text-align:center;line-height:1.2}
.btn:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.btn.pri{background:var(--pri);color:var(--pri-ink)}
.btn.pri:hover{filter:brightness(1.12)}
.btn.sec{border:1.5px solid var(--line);color:var(--ink);background:var(--surface)}
.btn.sec:hover{border-color:var(--muted)}
.btn.ghost{color:var(--muted);padding-inline:12px}
.btn.ghost:hover{color:var(--ink)}
.btn.sm{min-height:42px;padding:8px 14px;font-size:15px}
.btn[disabled]{opacity:.45;pointer-events:none}
a.btn{text-decoration:none}

/* Barra superior comum */
.appbar{position:sticky;top:0;z-index:20;background:var(--surface);border-bottom:1px solid var(--line);padding-top:env(safe-area-inset-top,0px)}
.appbar-in{max-width:calc(var(--app-max) + 2*var(--gutter));margin:0 auto;padding:8px var(--gutter);display:flex;align-items:center;gap:8px 18px;flex-wrap:wrap;min-height:64px}
.ab-brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);flex:none}
.ab-brand img{height:44px;width:auto;border-radius:4px;display:block}
.ab-brand b{display:block;font-family:var(--f-display);font-weight:700;font-size:22px;line-height:1;letter-spacing:.02em}
.ab-brand small{display:block;font-size:12px;color:var(--muted);font-weight:500;margin-top:2px;white-space:nowrap}
.ab-mods{display:flex;gap:4px;flex:0 1 auto;min-width:0;overflow-x:auto;scrollbar-width:none}
.ab-mods::-webkit-scrollbar{display:none}
.ab-mods a{font-weight:600;font-size:15.5px;color:var(--muted);text-decoration:none;padding:10px 14px;border-radius:10px;white-space:nowrap;display:flex;align-items:center;gap:8px}
.ab-mods a:hover{color:var(--ink);background:var(--bg)}
.ab-mods a[aria-current="page"]{color:var(--ink);background:var(--acc-soft);box-shadow:inset 0 -3px 0 var(--acc)}
.ab-mods a:focus-visible{outline:2px solid var(--focus);outline-offset:-2px}
.ab-mods a .ab-n{font-family:var(--f-mono);font-size:11.5px;font-weight:500;color:var(--muted)}
.ab-obra{display:flex;flex-direction:column;justify-content:center;text-decoration:none;color:var(--ink);border:1.5px solid var(--line);border-left:4px solid var(--acc);border-radius:10px;padding:4px 12px;max-width:260px;min-width:0;line-height:1.15}
.ab-obra small{font-family:var(--f-mono);font-size:10.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.ab-obra b{font-size:14.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ab-obra:hover{border-color:var(--muted);border-left-color:var(--acc)}
.ab-user{display:flex;gap:6px;align-items:center;flex-wrap:wrap;justify-content:flex-end;margin-left:auto}
.ab-user .who{color:var(--muted);font-size:14px;margin-right:4px;max-width:130px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ab-tema{all:unset;cursor:pointer;width:38px;height:38px;border-radius:10px;display:grid;place-items:center;font-size:18px;color:var(--muted);flex:none;margin-left:auto}
.ab-tema:hover{background:var(--bg);color:var(--ink)}.ab-tema:focus-visible{outline:2px solid var(--focus)}
.ab-tema+.ab-user{margin-left:0}
.ab-user .off{color:var(--amber)}
.ab-brand small{display:none}
@media (max-width:1500px){.ab-mods a{padding:10px 9px;font-size:15px}}
@media (min-width:761px){.appbar-in{flex-wrap:nowrap}.ab-user{flex-wrap:nowrap;flex:none}.ab-obra{flex:0 1 auto}}
@media (min-width:761px) and (max-width:1100px){.ab-brand b{display:none}.ab-user .who{max-width:90px}}
/* Menu da conta (tela de obras) */
.ab-conta{position:relative}
.ab-conta summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:6px;padding:8px 10px;border-radius:10px;color:var(--muted);font-size:14px}
.ab-conta summary::-webkit-details-marker{display:none}
.ab-conta summary::after{content:"▾";font-size:12px}
.ab-conta summary:hover,.ab-conta[open] summary{background:var(--bg);color:var(--ink)}
.ab-conta summary .who{margin:0}.ab-conta summary small{font-family:var(--f-mono);font-size:11px}
.ab-conta-in{position:absolute;right:0;top:calc(100% + 6px);z-index:50;background:var(--surface);border:1.5px solid var(--line);border-radius:12px;padding:6px;display:grid;gap:2px;min-width:170px;box-shadow:0 8px 24px rgba(0,0,0,.12)}
.ab-conta-in .btn{justify-content:flex-start;width:100%}
@media (max-width:760px){
  .appbar-in{gap:6px 10px;padding-block:6px}
  .ab-brand img{height:36px}.ab-brand small{display:none}
  .ab-mods{order:3;flex-basis:100%;margin-inline:-6px}
  .ab-user .who{display:none}
  .ab-obra{order:4;flex-basis:100%;max-width:none;flex-direction:row;align-items:baseline;gap:8px;padding:6px 10px}
  .ab-user .btn.sm{min-height:38px;padding:6px 10px;font-size:14px}
  .ab-user{gap:2px}
}
@media print{.appbar{display:none}}