/* Painel — fundo claro e limpo, rótulos pequenos em fonte monoespaçada, destaque verde, bordas finas, modo escuro. */
:root{color-scheme:light;
  --bg-0:oklch(99.5% 0 0);--bg-1:oklch(97.6% 0 0);--bg-2:oklch(95.6% 0 0);--bg-3:oklch(93% 0 0);
  --fg:oklch(17% 0 0);--fg-muted:oklch(43% 0 0);--fg-dim:oklch(55% 0 0);--fg-faint:oklch(69% 0 0);
  --line:oklch(91% 0 0);--line-strong:oklch(83% 0 0);
  --green:#26C1DD;--green-strong:oklch(55% .105 213);--green-soft:oklch(96.5% .03 213);--green-border:oklch(86% .07 213);--green-ink:#04222a;
  --danger:oklch(55% .22 22);--amber:oklch(62% .16 75);--blue:oklch(52% .16 240);
  --font-display:'Space Grotesk','Geist',system-ui,sans-serif;--font-sans:'Geist',system-ui,-apple-system,'Segoe UI',sans-serif;--font-mono:'Geist Mono',ui-monospace,'SF Mono',Menlo,monospace;
  --bad:var(--danger);--ok:var(--green-strong);--warn:var(--amber);--muted:var(--fg-dim);--in:var(--bg-0);--top:var(--green)}
[data-theme=dark]{color-scheme:dark;
  --bg-0:oklch(10.5% 0 0);--bg-1:oklch(14% 0 0);--bg-2:oklch(17.5% 0 0);--bg-3:oklch(22% 0 0);
  --fg:oklch(98.5% 0 0);--fg-muted:oklch(74% 0 0);--fg-dim:oklch(60% 0 0);--fg-faint:oklch(46% 0 0);
  --line:oklch(24.5% 0 0);--line-strong:oklch(32% 0 0);
  --green:#26C1DD;--green-strong:oklch(80% .12 213);--green-soft:oklch(76% .12 213/.1);--green-border:oklch(76% .12 213/.35);--green-ink:#04222a;
  --danger:oklch(69% .2 22);--amber:oklch(81% .16 75)}
[data-brand]{--green:var(--brand);--green-ink:var(--brand-ink);--green-strong:color-mix(in oklab,var(--brand) 68%,#000);--green-soft:color-mix(in oklab,var(--brand) 9%,#fff);--green-border:color-mix(in oklab,var(--brand) 35%,#fff)}
[data-brand][data-theme=dark]{--green-strong:color-mix(in oklab,var(--brand) 72%,#fff);--green-soft:color-mix(in srgb,var(--brand) 12%,transparent);--green-border:color-mix(in srgb,var(--brand) 38%,transparent)}
.swatches{display:flex;flex-wrap:wrap;gap:10px;margin:6px 0 18px}.sw{width:44px;height:44px;border:2px solid var(--line-strong);cursor:pointer;padding:0}.sw.on{outline:3px solid var(--fg);outline-offset:2px}
*{box-sizing:border-box}html,body{margin:0}
body{font:14px/1.55 var(--font-sans);color:var(--fg);background:var(--bg-0);-webkit-font-smoothing:antialiased}
a{color:var(--green-strong);text-decoration:none}a:hover{text-decoration:underline}
h1,h2,h3{margin:0;font-family:var(--font-display);letter-spacing:-.02em;font-weight:600}h3{font-size:16px}
code{background:var(--bg-2);border:1px solid var(--line);padding:1px 6px;font:12px var(--font-mono);color:var(--fg)}
hr{border:0;border-top:1px solid var(--line);margin:20px 0}[hidden]{display:none!important}
.grow{flex:1}.sub{color:var(--fg-muted);font-size:13.5px}.ic{vertical-align:-3px;flex:none}.mono{font-family:var(--font-mono)}
.kick,.lb,label{font:500 11px var(--font-mono);letter-spacing:.07em;text-transform:uppercase}

/* ---- estrutura ---- */
.app{display:flex;min-height:100vh}
.side{width:256px;flex:none;background:var(--bg-1);border-right:1px solid var(--line);display:flex;flex-direction:column;position:sticky;top:0;height:100vh;overflow:auto;transition:margin .2s}
.app.collapsed .side{margin-left:-256px}
.ws{display:flex;gap:12px;align-items:center;padding:20px 20px 14px}.wsa{width:36px;height:36px;background:var(--green);color:var(--green-ink);display:grid;place-items:center;font:700 12px var(--font-display);flex:none;letter-spacing:.02em}
.wst{min-width:0}.wst b{display:block;font:600 15px var(--font-display);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wst .m{display:flex;gap:6px;align-items:center;font:11px var(--font-mono);color:var(--fg-dim);white-space:nowrap}
.tag{border:1px solid var(--green-border);color:var(--green-strong);font:500 10px var(--font-mono);letter-spacing:.06em;padding:0 5px;text-transform:uppercase;line-height:1.6}.tag.gray{border-color:var(--line-strong);color:var(--fg-dim)}
.sl{font-size:12.5px;color:var(--fg-dim);padding:16px 20px 6px}
.si{display:flex;align-items:center;gap:12px;margin:1px 8px;padding:8px 12px;width:calc(100% - 16px);border-radius:4px;color:var(--fg);font:14px var(--font-sans);background:none;border:0;cursor:pointer;text-align:left;text-decoration:none;line-height:1.3}
.si .ic{color:var(--fg-dim)}.si:hover{background:var(--bg-2);text-decoration:none}.si.on{background:var(--green-soft);color:var(--green-strong);font-weight:500}.si.on .ic{color:var(--green-strong)}
.si .chev{margin-left:auto;transition:transform .2s}.sg.open .chev{transform:rotate(180deg)}
.sgi{display:none;margin:2px 8px 6px 30px;border-left:1px solid var(--line);padding-left:6px}.sg.open .sgi{display:block}
.sgi a{display:block;padding:6px 12px;font-size:13.5px;color:var(--fg-muted);border-radius:4px;text-decoration:none}.sgi a:hover{background:var(--bg-2);color:var(--fg)}.sgi a.on{color:var(--green-strong);background:var(--green-soft);font-weight:500}
.sfoot{margin-top:auto;padding-top:12px}.sfoot .mi{display:flex;gap:10px;align-items:center;padding:8px 20px;font:12px var(--font-mono);color:var(--fg-muted);background:none;border:0;cursor:pointer;width:100%;text-align:left;text-decoration:none}.sfoot .mi:hover{color:var(--fg)}
.sfoot .sep{border-top:1px solid var(--line);margin:8px 0 0}.sfoot .th{display:flex;gap:12px;align-items:center;padding:12px 20px;font-size:14px;background:none;border:0;border-bottom:1px solid var(--line);cursor:pointer;width:100%;color:var(--fg);font-family:inherit}
.usr{display:flex;gap:12px;align-items:center;padding:14px 16px 16px 20px}.usr .u{flex:1;min-width:0}.usr b{display:block;font:500 14px var(--font-sans);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.usr span{font:11px var(--font-mono);color:var(--fg-dim);display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.av{width:36px;height:36px;background:var(--bg-3);color:var(--fg);display:grid;place-items:center;font:600 12px var(--font-display);flex:none;border-radius:2px}
.main{flex:1;min-width:0;display:flex;flex-direction:column}
/* barra de aviso: desce do topo, fica um tempo e sobe */
.notice{position:fixed;top:0;left:0;right:0;z-index:60;background:oklch(52% .2 25);color:#fff;padding:12px 48px 12px 20px;display:flex;gap:14px;align-items:center;justify-content:center;font-size:14px;flex-wrap:wrap;text-align:center;box-shadow:0 6px 20px rgb(0 0 0/.25);transform:translateY(-105%);transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.notice.in{transform:none}
.notice .btn{height:30px;background:#fff;color:oklch(45% .2 25);border-color:#fff}
.notice .x{position:absolute;right:14px;top:50%;transform:translateY(-50%);background:none;border:0;color:#fff;opacity:.75;cursor:pointer;font-size:14px;padding:6px}.notice .x:hover{opacity:1}
.bc{height:56px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:14px;padding:0 20px;position:sticky;top:0;background:var(--bg-0);z-index:20}
.bc .bcn{font:11.5px var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--fg-muted);display:flex;gap:8px;align-items:center;min-width:0;overflow:hidden;white-space:nowrap}.bcn a{color:var(--fg-muted)}.bcn b{color:var(--fg);font-weight:500}.bcn .s{color:var(--fg-faint)}
.iconbtn{width:32px;height:32px;display:inline-grid;place-items:center;border:1px solid var(--line);background:var(--bg-0);color:var(--fg);cursor:pointer;border-radius:2px;position:relative;text-decoration:none}.iconbtn:hover{background:var(--bg-2);text-decoration:none}.iconbtn .dot{position:absolute;top:5px;right:5px;width:7px;height:7px;background:var(--danger);border-radius:50%}
.bc .vsep{width:1px;height:20px;background:var(--line)}
.content{padding:36px 40px 90px;width:100%;max-width:1260px;margin:0 auto}
.menu{position:relative;display:inline-block}
.menu>div{display:none;position:absolute;right:0;top:calc(100% + 6px);z-index:70;background:var(--bg-0);border:1px solid var(--line-strong);box-shadow:0 12px 32px -8px oklch(0% 0 0/.25);min-width:220px;padding:5px 0;text-align:left;border-radius:3px}
.menu.open>div{display:block}.menu.up>div{top:auto;bottom:calc(100% + 6px)}.menu.left>div{right:auto;left:0}
.menu>div button,.menu>div a{display:block;width:100%;text-align:left;background:none;border:0;color:var(--fg);padding:8px 16px;font:13.5px var(--font-sans);cursor:pointer;text-decoration:none;white-space:nowrap}
.menu>div button:hover,.menu>div a:hover{background:var(--bg-2);text-decoration:none}.menu .red{color:var(--danger)!important}

/* ---- cabeçalhos ---- */
.ph,.top{display:flex;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:28px}.ph h1,.top h1{font:600 30px/1.1 var(--font-display);letter-spacing:-.025em}
.ph .kick{display:block;color:var(--green-strong);margin-bottom:8px}.ph .sub{margin-top:6px}.acts{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.sh{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 20px}.sh h2{font:600 22px var(--font-display);flex:1}

/* ---- botões ---- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:36px;padding:0 16px;border-radius:999px;border:1px solid var(--green);background:var(--green);color:var(--green-ink);font:500 13.5px var(--font-sans);cursor:pointer;text-decoration:none;white-space:nowrap;line-height:1}
.btn:hover{background:var(--green-strong);border-color:var(--green-strong);text-decoration:none;color:var(--green-ink)}.btn:disabled{opacity:.5;cursor:default}
.btn.ghost{background:transparent;color:var(--fg);border-color:var(--line-strong)}.btn.ghost:hover{background:var(--bg-2);color:var(--fg)}
.btn.ok{background:var(--green)}
.btn.bad{background:transparent;color:var(--danger);border-color:color-mix(in oklch,var(--danger) 45%,transparent)}.btn.bad:hover{background:color-mix(in oklch,var(--danger) 10%,transparent);color:var(--danger)}
.btn.warn{background:transparent;color:var(--amber);border-color:color-mix(in oklch,var(--amber) 50%,transparent)}.btn.warn:hover{background:color-mix(in oklch,var(--amber) 12%,transparent);color:var(--amber)}
.btn.sq{border-radius:2px;background:transparent;color:var(--fg);border-color:var(--fg);height:48px;width:100%;font-size:15px}.btn.sq:hover{background:var(--fg);color:var(--bg-0)}
.btn.sm{height:28px;padding:0 12px;font-size:12.5px}.btn.lg{height:44px;padding:0 22px;font-size:15px}

/* ---- formulários ---- */
label{display:block;color:var(--fg-muted);margin:0 0 7px}
label.chk,.chk{display:flex;gap:10px;align-items:center;font:14px var(--font-sans);letter-spacing:0;text-transform:none;color:var(--fg);margin:0}
input,select,textarea{width:100%;height:40px;padding:0 14px;border:1px solid var(--line-strong);border-radius:2px;background:var(--bg-0);color:var(--fg);font:14px var(--font-sans)}
textarea{height:auto;padding:10px 14px;min-height:96px;resize:vertical}select{padding-right:10px}
input[type=checkbox],input[type=radio]{width:16px;height:16px;padding:0;accent-color:var(--green)}input[type=color]{padding:3px;cursor:pointer}input[type=file]{height:auto;padding:8px 10px}
input:focus,select:focus,textarea:focus{outline:2px solid color-mix(in oklch,var(--green) 40%,transparent);outline-offset:0;border-color:var(--green)}
::placeholder{color:var(--fg-faint)}input[readonly]{background:var(--bg-2);color:var(--fg-muted)}
.hint,.f>p.sub{font:11.5px/1.5 var(--font-mono);color:var(--fg-dim);margin:6px 0 0}
.f{margin-bottom:16px}.row{display:flex;gap:16px;flex-wrap:wrap}.row>*{flex:1;min-width:150px}.req{color:var(--green-strong)}
.ig{display:flex}.ig>span{display:grid;place-items:center;padding:0 12px;background:var(--bg-2);border:1px solid var(--line-strong);border-right:0;color:var(--fg-muted);font:12px var(--font-mono);white-space:nowrap}.ig>input{border-radius:0}

/* ---- abas ---- */
.tabs,.sub-tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);overflow-x:auto;margin-bottom:26px}
.tabs a,.sub-tabs a{padding:12px 16px;color:var(--fg-dim);font-size:14px;border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap;text-decoration:none;background:none}
.tabs a:hover,.sub-tabs a:hover{color:var(--fg)}.tabs a.on,.sub-tabs a.on{color:var(--green-strong);border-color:var(--green)}

/* ---- cartões, seções, faixa de métricas ---- */
.card{background:var(--bg-1);border:1px solid var(--line);padding:22px;margin-bottom:18px}.card>h2{font-size:18px;margin-bottom:8px}
.grid{display:grid;gap:18px}.g2{grid-template-columns:repeat(auto-fit,minmax(340px,1fr))}.g3{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));background:var(--bg-1);margin:0 0 26px}
.strip>div{padding:22px 22px 20px;border-left:1px solid var(--line)}.strip>div:first-child{border-left:0}.strip .l{font:11px var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--fg-muted)}
.strip .v{font:500 34px/1 var(--font-display);margin:12px 0 8px;letter-spacing:-.02em}.strip .s{font:11px var(--font-mono);color:var(--fg-faint)}.strip .v small{font-size:16px;color:var(--fg-dim)}
.sec{border:1px solid var(--line);background:var(--bg-1);margin-bottom:22px}
.sec-h{padding:24px 26px 20px;display:flex;gap:18px;align-items:flex-start;flex-wrap:wrap}.sec-h>div:first-child{flex:1;min-width:240px}
.sec-h .k{font:11px var(--font-mono);color:var(--green-strong);letter-spacing:.04em}.sec-h .n{display:inline-block;border:1px solid var(--line-strong);padding:0 5px;color:var(--fg-dim);margin-right:8px;line-height:1.5}
.sec-h h2{font:600 20px var(--font-display);margin:8px 0 6px}.sec-h p{color:var(--fg-muted);margin:0;max-width:640px}
.sec-b{border-top:1px solid var(--line);padding:24px 26px}.sec-f{border-top:1px solid var(--line);padding:12px 26px;font:12px var(--font-mono);color:var(--fg-muted);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;background:var(--bg-0)}
.cells{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));border-top:1px solid var(--line)}.cells>div{padding:20px 24px;border-left:1px solid var(--line)}.cells>div:first-child{border-left:0}
.sec-b .save,.savebar{display:flex;justify-content:flex-end;gap:10px;margin-top:8px}
table{width:100%;border-collapse:collapse}th{text-align:left;font:500 11px var(--font-mono);letter-spacing:.07em;text-transform:uppercase;color:var(--fg-muted);padding:10px 12px;border-bottom:1px solid var(--line)}
td{padding:13px 12px;border-top:1px solid var(--line);vertical-align:middle}.tw{overflow-x:auto}tr:hover td{background:color-mix(in oklch,var(--bg-2) 45%,transparent)}
.pill{display:inline-flex;align-items:center;gap:5px;font:500 10.5px var(--font-mono);letter-spacing:.05em;text-transform:uppercase;padding:2px 7px;border:1px solid var(--line-strong);color:var(--fg-muted);background:transparent;border-radius:2px;white-space:nowrap;line-height:1.5}
.pill.ok{color:var(--green-strong);border-color:var(--green-border);background:var(--green-soft)}.pill.warn{color:var(--amber);border-color:color-mix(in oklch,var(--amber) 45%,transparent);background:color-mix(in oklch,var(--amber) 9%,transparent)}
.pill.bad{color:var(--danger);border-color:color-mix(in oklch,var(--danger) 45%,transparent);background:color-mix(in oklch,var(--danger) 8%,transparent)}.pill.p{color:var(--blue);border-color:color-mix(in oklch,var(--blue) 40%,transparent);background:color-mix(in oklch,var(--blue) 8%,transparent)}
.bar{height:6px;background:var(--bg-3);overflow:hidden;border-radius:99px}.bar i{display:block;height:100%;background:var(--green)}
.empty{text-align:center;color:var(--fg-dim);padding:40px 10px;font:13px var(--font-mono)}
.es{text-align:center;padding:60px 10px}.es>.ic{color:var(--fg-faint);margin-bottom:16px}.es h3{font:500 16px var(--font-sans);margin-bottom:6px;letter-spacing:0}.es p{font:12px var(--font-mono);color:var(--fg-dim);max-width:460px;margin:0 auto 18px}.es .acts{justify-content:center}
.note{border:1px solid var(--green-border);background:var(--green-soft);color:var(--fg);padding:12px 16px;font-size:14px;margin-bottom:18px}.note.warn{border-color:color-mix(in oklch,var(--amber) 45%,transparent);background:color-mix(in oklch,var(--amber) 9%,transparent)}.note a{font-weight:500}
.chart{display:flex;align-items:flex-end;gap:3px;height:130px;padding-top:6px}.chart div{flex:1;background:var(--green);min-height:2px}
.stars{color:var(--amber);letter-spacing:2px}.big{font:500 2.4rem var(--font-display)}
.code{background:var(--bg-0);border:1px solid var(--line);padding:12px;font:12px/1.6 var(--font-mono);overflow:auto;white-space:pre;max-height:280px}
.pin{font:500 2.6rem/1 var(--font-mono);letter-spacing:.22em;background:var(--bg-0);border:1px dashed var(--line-strong);padding:20px;text-align:center}
.thumb{width:100%;height:80px;border:1px dashed var(--line-strong);object-fit:cover;background:var(--bg-0);display:block;margin-bottom:8px}
.win{font:600 2rem var(--font-display);text-align:center;padding:26px;background:var(--green);color:var(--green-ink);margin:14px 0;min-height:100px;display:grid;place-items:center}
.meter{height:6px;background:linear-gradient(90deg,var(--danger),var(--amber),var(--green));position:relative;margin:12px 0 8px}.meter i{position:absolute;top:-5px;width:4px;height:16px;background:var(--fg);transform:translateX(-2px)}

/* ---- listas, linhas de configuração, blocos ---- */
.rowlist{border:1px solid var(--line);background:var(--bg-1);margin-bottom:20px}.rowlist>.gitem,.rowlist>.cfgrow{border-top:1px solid var(--line)}.rowlist>:first-child{border-top:0}
.gitem{display:flex;gap:18px;align-items:center;padding:18px 22px}.gitem>.ic{width:38px;height:38px;color:var(--green-strong)}.gitem .g{flex:1;min-width:0}.gitem .g b{display:block;font-weight:500;font-size:14.5px}.gitem .g .sub{display:block}
.cfgrow{display:flex;align-items:center;gap:16px;padding:18px 22px}.cfgrow .g{flex:1;min-width:0}.cfgrow b{display:block;font-weight:500}.cfgrow .sub{display:block}
.ck{display:flex;align-items:center;gap:20px;padding:18px 22px;border-top:1px solid var(--line)}.ck:first-child{border-top:0}
.ck .dot{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--line-strong);color:var(--fg-faint);flex:none}.ck.done .dot{background:var(--green);border-color:var(--green);color:var(--green-ink)}.ck .t{flex:1}.ck.done .t{color:var(--fg-muted)}
.blk{display:flex;align-items:center;gap:16px;background:var(--bg-1);border:1px solid var(--line);padding:24px 26px;margin-bottom:10px;cursor:pointer}.blk:hover{border-color:var(--line-strong);background:var(--bg-2)}
.blk .g{flex:1}.blk b{display:block;font:600 16px var(--font-display);margin-bottom:2px}.blk .ed{color:var(--fg-faint)}.blk:hover .ed{color:var(--green-strong)}
.mod{display:flex;gap:14px;align-items:flex-start;border:1px solid var(--line-strong);padding:16px 18px;margin-bottom:10px;cursor:pointer;background:var(--bg-0)}.mod.on{border-color:var(--green);background:var(--green-soft)}
.mod b{display:block;font-weight:500}.mod .g{flex:1}
.qrow{display:flex;gap:14px;align-items:center;background:var(--bg-0);border:1px solid var(--line);padding:14px 18px;margin-bottom:8px}.qrow .g{flex:1;min-width:0}
.qcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;margin-bottom:12px}
.qcard{display:flex;gap:16px;align-items:center;border:1px solid var(--line);padding:20px;background:var(--bg-0)}.qcard>.ic{color:var(--fg-faint);width:30px;height:30px}.qcard b{display:block;font-weight:500}.qcard span{font:11px var(--font-mono);color:var(--green-strong)}
.potential{display:flex;gap:16px;align-items:center;border:1px solid var(--line);border-left:2px solid var(--green);padding:18px 22px;margin-bottom:14px;background:var(--bg-1)}.potential .sq{width:30px;height:30px;background:var(--green);color:var(--green-ink);display:grid;place-items:center;flex:none}
.icat{border:1px solid var(--line);margin-bottom:18px;background:var(--bg-1)}.icat>.ih{display:flex;gap:14px;align-items:center;padding:18px 22px;border-bottom:1px solid var(--line)}
.icat .it{display:flex;gap:16px;align-items:center;padding:16px 22px;border-top:1px solid var(--line)}.icat>.ih+.it{border-top:0}.icat .it .g{flex:1;min-width:0}.icat .it b{display:block;font-weight:500}
.tico{width:40px;height:40px;background:var(--green-soft);color:var(--green-strong);display:grid;place-items:center;flex:none;border-radius:50%;border:1px solid var(--green-border)}
.tag-free{color:var(--green-strong);font:12px var(--font-mono);display:inline-flex;align-items:center;gap:4px}

/* ---- pessoas ---- */
.people{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:32px;align-items:start}.people .pr{position:sticky;top:76px}
.pcs{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:14px}
.pc{background:var(--bg-1);border:1px solid var(--line);padding:16px 18px;display:flex;flex-direction:column;gap:10px}.pc.sel{border-color:var(--green);background:var(--green-soft)}
.pc-top{display:flex;gap:12px;align-items:center}.pc .g{flex:1;min-width:0}.pc .g b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}.pc .em{font:11.5px var(--font-mono);color:var(--fg-dim);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}
.pc-st{display:flex;gap:8px;align-items:center;justify-content:space-between}.tags{display:flex;gap:5px;flex-wrap:wrap}
.cnt{display:flex;justify-content:space-between;align-items:center;width:100%;text-align:left;background:var(--bg-1);color:var(--fg);border:1px solid var(--line);border-left:2px solid var(--line-strong);padding:11px 14px;margin-bottom:6px;font:13.5px var(--font-sans);cursor:pointer}
.cnt:hover{background:var(--bg-2)}.cnt.on{background:var(--green-soft);border-color:var(--green-border);border-left-color:var(--green)}.cnt b{font:500 13px var(--font-mono)}.cnt.ok{border-left-color:var(--green)}.cnt.warn{border-left-color:var(--amber)}.cnt.bad{border-left-color:var(--danger)}
.grp{font:500 11px var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--fg-dim);margin:18px 2px 8px}
.selbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;background:var(--fg);color:var(--bg-0);padding:8px 14px;margin-bottom:14px;position:sticky;top:66px;z-index:6}
.selbar .btn{background:transparent;color:var(--bg-0);border-color:color-mix(in oklch,var(--bg-0) 40%,transparent)}.selbar .btn:hover{background:color-mix(in oklch,var(--bg-0) 18%,transparent)}
.batch{border:1px solid var(--line);margin-bottom:12px;background:var(--bg-1)}.batch>summary{padding:16px 20px;cursor:pointer;display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-weight:500}
.batch .bd{padding:0 20px 16px}.link{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:8px 0;border-top:1px solid var(--line);font-size:13px}.link code{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:none;border:0;color:var(--fg-dim);padding:0}
.design{display:grid;grid-template-columns:minmax(0,1fr) 440px;gap:22px;align-items:start}.design .pv{position:sticky;top:76px}.pv iframe{width:100%;height:720px;border:1px solid var(--line);background:#0f1020}
.evcard{display:flex;flex-direction:column;gap:12px;cursor:pointer;transition:border-color .15s}.evcard:hover{border-color:var(--green)}

/* ---- modal ---- */
dialog{border:1px solid var(--line-strong);border-radius:4px;padding:0;width:min(620px,94vw);max-height:92vh;background:var(--bg-0);color:var(--fg);box-shadow:0 30px 80px oklch(0% 0 0/.4)}
dialog.wide{width:min(920px,96vw)}dialog::backdrop{background:oklch(0% 0 0/.55);backdrop-filter:blur(3px)}
.mh{padding:24px 28px 4px;position:relative}.mh h2{font:600 21px var(--font-display);padding-right:36px}.mh .sub{margin-top:4px;font:12px var(--font-mono);color:var(--fg-dim)}
.mh .x{position:absolute;right:16px;top:16px;width:30px;height:30px;background:none;border:1px solid var(--line);color:var(--fg-muted);cursor:pointer;font-size:15px;line-height:1;border-radius:2px}.mh .x:hover{background:var(--bg-2);color:var(--fg)}
.mb{padding:18px 28px 26px;overflow:auto;max-height:76vh}.mf{display:flex;gap:10px;justify-content:flex-end;align-items:center;margin-top:20px}

/* ---- avisos ---- */
#toasts{position:fixed;right:18px;bottom:18px;display:flex;flex-direction:column;gap:8px;z-index:99}
.toast{background:var(--fg);color:var(--bg-0);padding:11px 16px;box-shadow:0 8px 24px oklch(0% 0 0/.3);max-width:360px;font:12.5px/1.5 var(--font-mono);border-left:3px solid var(--green)}.toast.bad{border-left-color:var(--danger)}

/* ---- login dividido ---- */
.lg{display:grid;grid-template-columns:1.05fr 1fr;min-height:100vh}
.lg-l{background:oklch(7% 0 0);color:#eee;padding:40px 48px;display:flex;flex-direction:column;position:relative;overflow:hidden}
.lg-l:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 79px,oklch(100% 0 0/.035) 79px 80px);pointer-events:none}
.lg-l>*{position:relative}.lg-top{font:12px var(--font-mono);letter-spacing:.14em;color:oklch(80% 0 0);display:flex;gap:10px;align-items:center}.lg-top i{width:10px;height:10px;background:oklch(45% 0 0)}
.lg-mid{margin:auto 0;max-width:520px}.lg-mid .k{font:11.5px var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:oklch(72% 0 0);display:flex;gap:10px;align-items:center;margin-bottom:26px}.lg-mid .k:before{content:"";width:7px;height:7px;background:var(--green);border-radius:50%}
.lg-mid h1{font:600 clamp(48px,7vw,84px)/.98 var(--font-display);letter-spacing:-.04em;color:#f4f4f4}.lg-mid h1 em{font-style:normal;color:var(--green)}.lg-mid h1 s{text-decoration:none;color:oklch(70% 0 0)}
.lg-mid p{color:oklch(68% 0 0);max-width:440px;margin:26px 0 30px;font-size:15px}
.lg-st{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid oklch(100% 0 0/.25);padding-top:16px}.lg-st div{padding-left:16px;border-left:1px solid oklch(100% 0 0/.25)}.lg-st div:first-child{padding-left:0;border-left:0}
.lg-st .l{font:10.5px var(--font-mono);letter-spacing:.1em;color:oklch(60% 0 0);text-transform:uppercase}.lg-st .v{font:600 22px var(--font-display);color:oklch(90% 0 0);margin-top:6px}.lg-st .v.g{color:var(--green)}
.lg-foot{display:flex;justify-content:space-between;font:11.5px var(--font-mono);letter-spacing:.08em;color:oklch(68% 0 0);text-transform:uppercase}
.lg-r{background:var(--bg-0);padding:40px 56px;display:flex;flex-direction:column}.lg-r .back{align-self:flex-end;font:12px var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--fg-muted)}
.lg-f{margin:auto 0;width:100%;max-width:400px}.lg-f .k{font:11.5px var(--font-mono);letter-spacing:.08em;color:var(--fg-dim);text-transform:uppercase}.lg-f .k b{color:var(--green-strong);font-weight:400;margin-right:8px}
.lg-f h2{font:600 clamp(36px,4vw,50px)/1.05 var(--font-display);letter-spacing:-.035em;margin:18px 0 14px}.lg-f h2 i{font-style:normal;color:var(--fg-dim)}.lg-f>p{color:var(--fg-muted);margin:0 0 30px}
.lg-f .f label{display:flex;justify-content:space-between}.lg-f input{height:48px}.lg-f .lnk{font:12px var(--font-mono);text-transform:none;letter-spacing:0;color:var(--fg-dim);background:none;border:0;cursor:pointer;padding:0}
.lg-f .fine{font-size:12.5px;color:var(--fg-dim);margin-top:26px}

@media(max-width:960px){
  .lg{grid-template-columns:1fr}.lg-l{display:none}.lg-r{padding:28px 22px}
  .side{position:fixed;left:0;top:0;bottom:0;z-index:90;margin-left:-256px;transition:margin .2s}.app.navopen .side{margin-left:0}.app.collapsed .side{margin-left:-256px}.app.navopen.collapsed .side{margin-left:0}
  .content{padding:24px 22px 70px}.people{grid-template-columns:1fr}.people .pr{position:static;order:-1}.design{grid-template-columns:1fr}.design .pv{position:static}
  .gitem{flex-wrap:wrap}.ck{padding:16px 14px;gap:14px}.strip>div{border-left:0;border-top:1px solid var(--line)}.strip>div:first-child{border-top:0}.bc{padding:0 12px}
}

/* ---- botões em estilo "brutalista": borda grossa, cor chapada, sombra curta ---- */
:root{--bk:#111}[data-theme=dark]{--bk:#f4f4f4}
.btn,.btn.ghost,.btn.bad,.btn.warn,.btn.ok{border:2px solid var(--bk);border-radius:0;box-shadow:2px 2px 0 var(--bk);font-weight:600;color:#111;transition:transform .08s,box-shadow .08s,background .15s}
.btn{background:var(--green)}.btn:hover{background:var(--green);border-color:var(--bk);color:#111;transform:translate(-1px,-1px);box-shadow:3px 3px 0 var(--bk)}
.btn:active{transform:translate(2px,2px);box-shadow:0 0 0 var(--bk)}
.btn.ghost{background:#fff}.btn.ghost:hover{background:#f2f2f2;color:#111}
.btn.bad{background:#ff7a7a}.btn.bad:hover{background:#ff6262;color:#111}
.btn.warn{background:#ffc94d}.btn.warn:hover{background:#ffbd26;color:#111}
.btn.sq{border-radius:0;height:48px;background:var(--green);color:#111;border-color:var(--bk)}.btn.sq:hover{background:var(--green);color:#111}
.btn:disabled{transform:none;box-shadow:none}
.btn.sm{box-shadow:2px 2px 0 var(--bk)}
.selbar .btn{box-shadow:none;color:var(--bg-0);background:transparent;border-color:color-mix(in oklch,var(--bg-0) 45%,transparent)}.selbar .btn:hover{transform:none;background:color-mix(in oklch,var(--bg-0) 18%,transparent);color:var(--bg-0);box-shadow:none}
.notice .btn{background:#fff;color:oklch(45% .2 25);border-color:#fff;box-shadow:none}.notice .btn:hover{background:#fff;transform:none;box-shadow:none;color:oklch(45% .2 25)}

.btn,.btn.sm,.btn.lg,.notice .btn,.selbar .btn{border-radius:0}

/* ---- seleções (checkbox / radio) no mesmo estilo dos botões ---- */
input[type=checkbox],input[type=radio]{-webkit-appearance:none;appearance:none;width:20px;height:20px;min-width:20px;padding:0;margin:0;flex:none;border:2px solid var(--bk);background:var(--bg-0);display:inline-grid;place-content:center;cursor:pointer;border-radius:0;box-shadow:1px 1px 0 var(--bk);vertical-align:middle}
input[type=radio]{border-radius:50%}
input[type=checkbox]:checked,input[type=radio]:checked{background:var(--green)}
input[type=checkbox]:checked::after{content:'';width:5px;height:10px;border:solid #111;border-width:0 2.5px 2.5px 0;transform:rotate(45deg) translate(-1px,-1px)}
input[type=radio]:checked::after{content:'';width:8px;height:8px;border-radius:50%;background:#111}
input[type=checkbox]:focus,input[type=radio]:focus{outline:none;border-color:var(--bk)}
input[type=checkbox]:focus-visible,input[type=radio]:focus-visible{outline:2px solid var(--green);outline-offset:2px}
input[type=checkbox]:disabled,input[type=radio]:disabled{opacity:.45;cursor:default}

.permgrp{border-top:1px solid var(--line);padding:12px 0 4px}.permgrp .k{font:500 11px var(--font-mono);text-transform:uppercase;letter-spacing:.08em;color:var(--fg-dim);margin-bottom:8px}
.permgrp .chk{margin-bottom:12px}#modal.wide .mb{max-height:70vh;overflow:auto}

/* ---- celular: sem rolagem lateral e com respiro nas laterais ---- */
html,body{max-width:100%;overflow-x:hidden}
.main,.content{min-width:0}.content>*{min-width:0;max-width:100%}
.tw{overflow-x:auto;max-width:100%}
@media(max-width:960px){
  .content{padding:22px 22px 80px}
  .ph{flex-wrap:wrap;gap:14px}.ph .grow{flex:1 1 100%}.ph .acts{width:100%;flex-wrap:wrap}
  .sec-h,.sec-b,.sec-f{padding-left:20px;padding-right:20px}
  .qrow{flex-wrap:wrap}.qrow .g{flex:1 1 100%}
  .strip{grid-template-columns:1fr 1fr}.strip>div{padding:18px 20px}
  #modal{max-width:calc(100vw - 28px)}
  .bc{padding:0 16px}.nblink{max-width:100%}
  code,.mono,.sub{overflow-wrap:anywhere}
}
@media(max-width:960px){
  .content a,.content label,.content p,.content b{overflow-wrap:anywhere}
  .chk{max-width:100%;min-width:0}.chk>span{min-width:0}
  .acts{flex-wrap:wrap}.ck,.gitem,.cfgrow{flex-wrap:wrap}.ck .acts,.gitem .acts{width:100%}
  input,select,textarea{max-width:100%}
  .ig{flex-wrap:wrap}.ig input{min-width:0}
}
@media(max-width:960px){.icat .it{flex-wrap:wrap;padding:16px 20px}.icat .it .g{flex:1 1 60%}.icat .it>.btn,.icat .it>.tag-free{flex:none}}

/* iPhone: campos com menos de 16px fazem o Safari dar zoom ao tocar e a página parece rolar para os lados */
@media (max-width:960px){input,select,textarea{font-size:16px!important}}
html,body{overflow-x:hidden;overflow-x:clip}
#app,.app,.main,.lg,.lg-r{max-width:100vw}

/* barras de rolagem discretas: sem setinhas e sem "botões" dentro das caixas */
*{scrollbar-width:thin;scrollbar-color:var(--line-strong) transparent}
*::-webkit-scrollbar{width:8px;height:8px}*::-webkit-scrollbar-button{display:none;width:0;height:0}
*::-webkit-scrollbar-track{background:transparent}*::-webkit-scrollbar-thumb{background:var(--line-strong);border-radius:0}
.tabs,.tw,#modal .mb{scrollbar-width:none}.tabs::-webkit-scrollbar,.tw::-webkit-scrollbar,#modal .mb::-webkit-scrollbar{display:none}

/* Pessoas: uma pessoa por linha */
.pcs{display:flex;flex-direction:column;gap:8px}
.pc{flex-direction:row;flex-wrap:wrap;align-items:center;gap:8px 16px;padding:12px 16px}
.pc-top{display:contents}
.pc-top>input[type=checkbox]{order:0}.pc-top>.av{order:1}.pc-top>.g{order:2;flex:1 1 240px}.pc .tags{order:3;flex:0 1 auto;justify-content:flex-end}.pc-st{order:4;flex:0 0 auto}.pc-top>.menu{order:5}
.pc .g b,.pc .em{white-space:normal;overflow:visible}
@media(max-width:700px){.pc-top>.g{flex-basis:calc(100% - 130px)}.pc .tags{flex:1 1 100%;justify-content:flex-start}}

.design .pv iframe{width:100%;border:0;overflow:hidden;display:block;background:transparent}
.audf .row{align-items:flex-end}.audf .f{margin-bottom:12px}.tw table td{vertical-align:top}

.nbadge{margin-left:auto;min-width:20px;height:20px;padding:0 6px;display:inline-flex;align-items:center;justify-content:center;background:var(--danger);color:#fff;font:600 11px var(--font-mono)}

.stickbar{position:sticky;bottom:0;z-index:20;display:flex;align-items:center;gap:10px;padding:12px 16px;margin-top:16px;background:var(--bg-1);border:2px solid var(--line-strong)}.stickbar .sp{flex:1}.stickbar.dirty{border-color:var(--amber);background:var(--bg-2)}.stickbar.dirty #dirtymsg{color:var(--amber)}

.av.avb{border:0;padding:0;cursor:pointer;overflow:hidden;position:relative}.av.avb img{width:100%;height:100%;object-fit:cover;display:block}.av.avb:hover:after{content:'📷';position:absolute;inset:0;display:grid;place-items:center;background:rgba(0,0,0,.55);font-size:14px}

.lg-top img{height:30px;width:auto;display:block}

.lg-mob{display:none;height:30px;width:auto;margin:0 0 18px}@media(max-width:860px){.lg-mob{display:block}}
.lay{display:grid;gap:10px}.lay-o{border:1px solid var(--line);padding:10px 12px;cursor:pointer}

.gsep{display:flex;align-items:center;gap:12px;margin:18px 0 14px;color:var(--fg-dim);font:12px var(--font-mono,monospace);text-transform:uppercase}.gsep:before,.gsep:after{content:'';flex:1;border-top:1px solid var(--line)}
.gbtn{display:flex;align-items:center;justify-content:center;gap:10px;text-decoration:none}
.lg-f .gbtn{background:transparent!important;color:var(--fg,#111)!important;border:2px solid currentColor}
.sb .menu>div,.side .menu>div{min-width:200px;max-width:calc(100vw - 24px)}

.wsa.img{background:transparent;padding:0;overflow:visible}.wsa.img img{width:100%;height:100%;object-fit:contain;display:block}