:root{
  --bg:#070d1f; --bg2:#0b1530; --card:#0f1b3d; --card2:#14234d; --line:#243360; --txt:#eaf0ff; --muted:#9fb0d6;
  --a:#2F7BFF; --a2:#2FE0A0; --grad:linear-gradient(135deg,#2F7BFF,#9B6BFF); --warn:#ffb020; --bad:#ff5d6c; --ok:#2FE0A0;
  --r:18px; --sh:0 10px 30px rgba(0,0,0,.35);
}
body[data-theme="sc"]{ --bg:#050f26; --bg2:#08183a; --card:#0c2250; --card2:#123068; --line:#1f4285; --a:#3b8bff; --a2:#ffffff; --grad:linear-gradient(135deg,#1e63ff,#4fa3ff); --muted:#a9c2f0; }
body[data-theme="pm"]{ --bg:#0e0820; --bg2:#170d33; --card:#1c1140; --card2:#271858; --line:#3d2a7d; --a:#9B6BFF; --a2:#22E3C4; --grad:linear-gradient(135deg,#9B6BFF,#FF4FA3); --muted:#c3b4ee; }
*{box-sizing:border-box} html{scroll-behavior:smooth}
body{margin:0;background:radial-gradient(1200px 600px at 80% -10%,var(--bg2),transparent),var(--bg);color:var(--txt);
  font:16px/1.55 Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;min-height:100vh;display:flex;flex-direction:column}
main:focus,main:focus-visible{outline:none}
main{flex:1;width:100%;max-width:1120px;margin:0 auto;padding:20px 16px 48px;outline:none}
h1,h2,h3,h4{line-height:1.2;margin:0 0 .5em;letter-spacing:-.01em} h1{font-size:clamp(1.8rem,5vw,3rem)} h2{font-size:clamp(1.3rem,3vw,1.7rem);margin-top:1.6em} h3{font-size:1.1rem}
p{margin:.4em 0 .8em} a{color:inherit}
.muted{color:var(--muted)} .small{font-size:.85rem} .center{text-align:center} .warn{color:var(--warn)}
.skip{position:absolute;left:-999px;top:0;background:#fff;color:#000;padding:8px 12px;z-index:99} .skip:focus{left:8px}
:focus-visible{outline:3px solid var(--a2);outline-offset:2px}

.top{position:sticky;top:0;z-index:20;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 16px;background:rgba(7,13,31,.85);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:800;line-height:1.1} .brand small{display:block;font-weight:500;color:var(--muted);font-size:.72rem}
.brand-mark{width:34px;height:34px;border-radius:10px;background:var(--grad);display:inline-block}
.top nav{display:flex;gap:4px;flex-wrap:wrap} .top nav a{text-decoration:none;padding:8px 12px;border-radius:999px;font-weight:600;font-size:.92rem;color:var(--muted)}
.top nav a:hover,.top nav a.on{background:var(--card);color:var(--txt)}
.foot{border-top:1px solid var(--line);padding:18px 16px;text-align:center;color:var(--muted);font-size:.88rem} .foot strong{color:var(--txt)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:10px 20px;border-radius:14px;border:1px solid var(--line);background:var(--card);color:var(--txt);font:inherit;font-weight:700;text-decoration:none;cursor:pointer;transition:transform .12s,filter .12s}
.btn:hover{filter:brightness(1.15)} .btn:active{transform:scale(.97)} .btn[disabled]{opacity:.4;cursor:not-allowed;filter:none}
.btn.primary{background:var(--grad);border-color:transparent;color:#fff;box-shadow:0 6px 20px rgba(47,123,255,.3)} .btn.big{min-height:56px;font-size:1.1rem;padding:12px 28px}
.btn.ghost{background:transparent} .btn.mini{min-height:36px;padding:4px 14px;font-size:.85rem} .btn.danger{border-color:#7a2b35;color:#ff9aa6}
.btns{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0} .btns.c{justify-content:center}
.linkbtn{background:none;border:0;color:var(--muted);text-decoration:underline;cursor:pointer;font:inherit}
.chip{display:inline-block;padding:3px 12px;border-radius:999px;background:var(--card);border:1px solid var(--line);font-size:.8rem;font-weight:700;color:var(--muted)} .chip.ok{color:var(--ok)}
.eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:.76rem;font-weight:800;color:var(--a2);margin:0 0 .6em}

.hero{position:relative;padding:44px 0 26px;overflow:hidden}
.hero h1{max-width:18ch;background:linear-gradient(90deg,#fff,#b9ccff 60%,#c9a8ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.lead{font-size:1.12rem;color:#cfdaf7;max-width:62ch}
.eq{position:absolute;right:0;top:20px;height:180px;display:flex;align-items:flex-end;gap:5px;opacity:.35;pointer-events:none}
.eq i{width:8px;height:var(--h);border-radius:6px;background:var(--grad);animation:eq 1.4s ease-in-out infinite alternate;animation-delay:var(--d)}
@keyframes eq{to{height:calc(var(--h) * .35)}}
.duo{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:18px;margin:18px 0}
.appcard{border-radius:24px;padding:26px;border:1px solid var(--line);box-shadow:var(--sh);position:relative;overflow:hidden}
.appcard.souzachat{background:linear-gradient(160deg,#0c2250,#050f26);border-color:#1f4285}
.appcard.porty{background:linear-gradient(160deg,#2a1560,#0e0820);border-color:#4a2f9a}
.appcard .ic{width:64px;height:64px;margin-bottom:12px} .appcard .ic svg,.apphead .ic svg{width:100%;height:100%;filter:drop-shadow(0 6px 14px rgba(0,0,0,.4))}
.appcard h2{margin:0 0 4px;font-size:1.8rem} .tema{color:var(--a2);font-weight:700;font-size:.9rem;margin:0 0 10px}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin:26px 0}
.steps div{display:flex;gap:12px;align-items:flex-start;padding:16px;border-radius:var(--r);background:var(--card);border:1px solid var(--line)} .steps b{flex:none;width:34px;height:34px;border-radius:50%;background:var(--grad);display:grid;place-items:center} .steps p{margin:0}

.apphead{display:flex;gap:22px;align-items:flex-start;padding:34px 0 10px;flex-wrap:wrap} .apphead .ic{width:92px;height:92px;flex:none}
.apphead>div:last-child{flex:1;min-width:260px}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(310px,1fr));gap:18px;margin:18px 0}
.panel{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:22px;box-shadow:var(--sh)} .panel h2{margin-top:0}
.narrow{max-width:760px;margin:20px auto}
.bul{padding-left:1.2em;margin:.4em 0} .bul li{margin:.4em 0}
.feat{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:8px} .feat li{display:flex;flex-direction:column;padding:10px 12px;border-radius:12px;background:var(--card2)} .feat span{color:var(--muted);font-size:.88rem}
.tag{display:inline-block;font-size:.72rem;padding:3px 10px;border-radius:999px;vertical-align:middle;font-weight:800;margin-right:6px} .tag.done{background:rgba(47,224,160,.18);color:var(--ok)} .tag.todo{background:rgba(255,176,32,.18);color:var(--warn)}
.cta{margin:32px 0;padding:34px 20px;text-align:center;border-radius:24px;background:var(--grad)} .cta p{color:#fff;opacity:.9} .cta .btn.primary{background:#fff;color:#0a1230;box-shadow:none}

/* questionário */
.quiz{background:var(--card);border:1px solid var(--line);border-radius:24px;padding:22px;box-shadow:var(--sh)}
.qtop{display:flex;justify-content:space-between;align-items:center;gap:8px;font-weight:700;margin-bottom:10px}
.progress{height:12px;border-radius:99px;background:var(--card2);overflow:hidden} .progress i{display:block;height:100%;background:var(--grad);border-radius:99px;transition:width .3s}
.pmeta{font-size:.84rem;color:var(--muted);margin:6px 0 18px}
.qt{font-size:clamp(1.35rem,4vw,1.9rem);margin-bottom:.7em}
.opts{display:grid;gap:10px;margin:14px 0}
.opt{display:flex;align-items:center;gap:14px;padding:16px;border-radius:16px;background:var(--card2);border:2px solid transparent;cursor:pointer;font-weight:600;min-height:58px;transition:border-color .12s,background .12s}
.opt:hover{border-color:var(--line)} .opt.on{border-color:var(--a);background:color-mix(in srgb,var(--a) 20%,var(--card2))}
.opt input{position:absolute;opacity:0;pointer-events:none} .opt .mark{flex:none;width:24px;height:24px;border-radius:50%;border:2px solid var(--muted);display:grid;place-items:center}
.opt input[type=checkbox]+.mark{border-radius:7px} .opt.on .mark{background:var(--a);border-color:var(--a)} .opt.on .mark::after{content:"";width:8px;height:8px;border-radius:50%;background:#fff} .opt input[type=checkbox]+.mark::after{border-radius:2px}
.opt:focus-within{outline:3px solid var(--a2)}
.inp,textarea,.cmt textarea{width:100%;padding:14px;border-radius:14px;border:2px solid var(--line);background:var(--bg);color:var(--txt);font:inherit;margin-top:8px} textarea{resize:vertical}
.cmt{margin-top:14px;color:var(--muted)} .cmt summary{cursor:pointer;font-weight:700}
.nav{justify-content:space-between;margin-top:22px} .nav .btn{flex:1;min-width:130px}
.review{list-style:none;padding:0;margin:14px 0;display:grid;gap:8px} .review li{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:12px 14px;border-radius:14px;background:var(--card2)}
.review div{display:flex;flex-direction:column} .review span{color:var(--a2);font-size:.92rem;overflow-wrap:anywhere} .review span.warn{color:var(--warn)}
.thanks .check{width:88px;height:88px;margin:0 auto 14px;border-radius:50%;background:var(--grad);display:grid;place-items:center;animation:pop .5s cubic-bezier(.2,1.6,.4,1)} .check svg{width:48px;height:48px} @keyframes pop{from{transform:scale(0)}}
.note{padding:12px 16px;border-radius:14px;background:rgba(255,176,32,.12);border:1px solid rgba(255,176,32,.4);color:#ffd98a;margin:14px 0}

/* resultados */
.rhead{display:flex;justify-content:space-between;align-items:flex-end;gap:10px;flex-wrap:wrap;padding-top:16px}
.tabs{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0 18px;padding:5px;background:var(--card);border-radius:16px;border:1px solid var(--line)} .tabs a{flex:1;text-align:center;padding:10px 14px;border-radius:12px;text-decoration:none;font-weight:700;color:var(--muted);white-space:nowrap} .tabs a.on{background:var(--grad);color:#fff}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin:8px 0 16px} .kpi{padding:18px;border-radius:var(--r);background:var(--card);border:1px solid var(--line)} .kpi b{display:block;font-size:2rem;line-height:1.1} .kpi span{color:var(--muted);font-size:.85rem}
.qlist{display:grid;gap:16px} .qcard{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:18px;break-inside:avoid}
.qcard h4{display:flex;gap:10px;font-size:1.05rem} .qcard h4 span{flex:none;background:var(--grad);color:#fff;border-radius:8px;padding:1px 8px;font-size:.85rem;height:fit-content}
.charts{display:grid;grid-template-columns:minmax(0,1fr) 150px;gap:16px;align-items:center;margin:10px 0}
.bars{display:grid;gap:8px} .brow{display:grid;grid-template-columns:minmax(90px,170px) 1fr minmax(80px,auto);gap:10px;align-items:center;font-size:.88rem}
.btrack{height:16px;border-radius:99px;background:var(--card2);overflow:hidden;display:block} .btrack i{display:block;height:100%;border-radius:99px;min-width:2px} .bval{text-align:right;font-variant-numeric:tabular-nums;color:var(--muted)}
.pie{width:150px;height:150px} .pie-empty{width:150px;height:150px;border-radius:50%;border:2px dashed var(--line);display:grid;place-items:center;color:var(--muted);font-size:.8rem}
.tbl{width:100%;border-collapse:collapse;font-size:.9rem;margin:8px 0} .tbl th,.tbl td{padding:8px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top} .tbl .num{text-align:right;white-space:nowrap}
.sw{display:inline-block;width:12px;height:12px;border-radius:4px;margin-right:8px;vertical-align:-1px}
details.open{margin-top:8px;background:var(--card2);border-radius:12px;padding:8px 12px} details.open summary{cursor:pointer;font-weight:700} details.open ul{margin:8px 0;padding-left:1.1em} details.open li{margin:4px 0;overflow-wrap:anywhere}
.cmp{margin:14px 0} .legend{display:flex;gap:16px;margin-bottom:8px;font-size:.9rem}
.tools{margin-top:34px;padding:18px;border:1px dashed var(--line);border-radius:var(--r)}
.report .rtitle{padding:10px 0 14px;border-bottom:2px solid var(--line)} .rep{break-inside:auto}
#toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);background:#fff;color:#0a1230;padding:12px 18px;border-radius:12px;font-weight:700;opacity:0;pointer-events:none;transition:.25s;z-index:50;max-width:90vw}
#toast.show{opacity:1;transform:translate(-50%,0)}

@media (max-width:640px){ .charts{grid-template-columns:1fr} .piewrap{display:grid;place-items:center} .brow{grid-template-columns:1fr auto;grid-template-areas:"l v" "t t"} .blabel{grid-area:l}.btrack{grid-area:t}.bval{grid-area:v}
  .top{flex-direction:column;align-items:flex-start} .eq{opacity:.15} .apphead .ic{width:68px;height:68px} .tabs a{flex:1 1 45%} }
@media (prefers-reduced-motion:reduce){ *{animation:none!important;transition:none!important} }
@media print{
  body,body[data-theme]{--bg:#fff;--bg2:#fff;--card:#fff;--card2:#f1f4fa;--line:#cfd6e6;--txt:#10162b;--muted:#4a5572;--a2:#1a4fc4;background:#fff!important;color:#10162b}
  .top,.foot,.tabs,.noprint,.tools,#toast,.rhead .chip{display:none!important} main{max-width:none;padding:0}
  .panel,.qcard,.kpi{box-shadow:none} .pie-empty{border-color:#999} .kpi b{color:#10162b}
  .qcard h4 span{background:#1a4fc4!important;-webkit-print-color-adjust:exact;print-color-adjust:exact} .btrack i,.sw,.pie,.progress i{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  details.open:not([open])>*:not(summary){display:block} h2{break-after:avoid}
}
