/* ============ Tema claro (padrão) ============ */
:root{
  --bg:#f6f5f1; --bg2:#ffffff; --bg3:#efede7; --glass:rgba(250,249,246,.78);
  --line:rgba(24,24,22,.08); --line2:rgba(24,24,22,.15);
  --ink:#1d1d1f; --ink2:#3d3d40; --muted:#76767c; --faint:#a1a1a6;
  --accent:#c4623d; --accent-soft:rgba(196,98,61,.10); --accent-ink:#fff;
  --swarm:#0f766e; --swarm-soft:rgba(15,118,110,.10); --pink:#d6336c; --gold:#d98a04; --blue:#2f6fe4; --red:#d93636; --violet:#6d4ae0;
  --canvas:#fdfcf9; --canvas-edge:rgba(24,24,22,.10);
  --paper:#fffdf8; --paper-frame:#e9e5dc; --paper-ink:#2b2620; --sk:#e1dbcd;
  --hl:rgba(255,204,0,.42); --hl-blend:multiply;
  --shadow:0 1px 2px rgba(0,0,0,.04),0 8px 28px rgba(0,0,0,.06);
  --shadow-lg:0 2px 6px rgba(0,0,0,.05),0 24px 60px rgba(0,0,0,.10);
  --serif:'Fraunces','Iowan Old Style',Georgia,serif;
  --sans:-apple-system,BlinkMacSystemFont,'SF Pro Text','Inter',system-ui,'Segoe UI',sans-serif;
  --display:-apple-system,BlinkMacSystemFont,'SF Pro Display','Inter',system-ui,sans-serif;
  --mono:'SF Mono','JetBrains Mono',ui-monospace,Menlo,monospace;
  --fs:clamp(14px,1.16vw,19px);
  --r:18px;
  color-scheme:light;
}
/* ============ Tema escuro ============ */
:root[data-theme=dark]{
  --bg:#0b0d12; --bg2:#14171f; --bg3:#1c2029; --glass:rgba(14,16,22,.8);
  --line:rgba(255,255,255,.08); --line2:rgba(255,255,255,.15);
  --ink:#f2f2f4; --ink2:#c9cad1; --muted:#8d90a0; --faint:#5d6070;
  --accent:#e58a63; --accent-soft:rgba(229,138,99,.14); --accent-ink:#1a0d07;
  --swarm:#5eead4; --swarm-soft:rgba(94,234,212,.12); --pink:#f472b6; --gold:#fbbf24; --blue:#60a5fa; --red:#f87171; --violet:#a78bfa;
  --canvas:#080a10; --canvas-edge:rgba(255,255,255,.08);
  --paper:#f3eee2; --paper-frame:#2a2d36; --sk:#d7cdb9;
  --hl:rgba(250,204,21,.5);
  --shadow:0 1px 2px rgba(0,0,0,.3),0 10px 30px rgba(0,0,0,.35);
  --shadow-lg:0 20px 60px rgba(0,0,0,.5);
  color-scheme:dark;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:var(--fs);line-height:1.5;-webkit-font-smoothing:antialiased;transition:background .3s,color .3s}
body{overflow:hidden}
a{color:var(--accent);text-decoration:none} a:hover{text-decoration:underline}
b{font-weight:600;color:var(--ink)}
mark{background:var(--hl);color:inherit;padding:0 .2em;border-radius:3px}
s{text-decoration-color:var(--red);text-decoration-thickness:2px}
.mono{font-family:var(--mono);font-size:.88em}
.muted{color:var(--muted)} .small{font-size:.84em}
.c-p{color:var(--pink)!important} .c-g{color:var(--gold)!important} .c-teal{color:var(--swarm)!important}
.label{font:600 .7rem/1.2 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:.5em}
.kbd{display:inline-block;font:500 .78em var(--mono);padding:.12em .5em;border:1px solid var(--line2);border-bottom-width:2px;border-radius:6px;color:var(--ink2);background:var(--bg2)}

/* ============ deck ============ */
#deck{position:fixed;inset:0 0 56px 0}
.slide{position:absolute;inset:0;padding:3.4vh 3.8vw 2vh;display:flex;flex-direction:column;opacity:0;visibility:hidden;transform:translateY(10px) scale(.995);transition:opacity .5s ease,transform .5s cubic-bezier(.2,.7,.2,1),visibility 0s .5s}
.slide.on{opacity:1;visibility:visible;transform:none;transition:opacity .5s ease,transform .5s cubic-bezier(.2,.7,.2,1)}
.head{margin-bottom:2.2vh;flex:none}
.head.row{display:flex;justify-content:space-between;align-items:flex-end;gap:2vw}
.kicker{font:600 .72rem/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin-bottom:.75em;display:flex;gap:.8em;align-items:center;flex-wrap:wrap}
h1,h2,h3{font-family:var(--serif);font-weight:500;margin:0;letter-spacing:-.015em;color:var(--ink)}
h2{font-size:clamp(25px,2.75vw,46px);line-height:1.08}
h1 em,h2 em{font-style:italic;font-weight:400;color:var(--accent)}
.src{flex:none;margin-top:1.3vh;font-size:.68rem;color:var(--faint)}
.paper-link{font:600 .68rem var(--sans);letter-spacing:.02em;text-transform:none;background:var(--bg2);color:var(--ink2);border:1px solid var(--line2);border-radius:99px;padding:.35em .8em;cursor:pointer;box-shadow:var(--shadow)}
.paper-link:hover{border-color:var(--accent);color:var(--accent)}

[data-s]{opacity:0;transform:translateY(8px);transition:opacity .45s,transform .45s;pointer-events:none}
[data-s].vis{opacity:1;transform:none;pointer-events:auto}
[data-only]{display:none}
[data-only].vis{display:flex;animation:fadein .5s ease both}
[data-only].caption.vis,[data-only].sota.vis,[data-only].compare.vis{display:block}
.hide{display:none!important}
@keyframes fadein{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* ============ capa ============ */
.cover-slide,.divider{padding:0}
.bg-swarm{position:absolute;inset:0;width:100%;height:100%;touch-action:none}
.cover{position:relative;z-index:1;margin:auto 0;padding:0 7vw;max-width:1250px;pointer-events:none}
.cover h1{font-size:clamp(40px,5.8vw,96px);line-height:1;margin:.25em 0 .4em}
.cover .sub{font-size:1.25em;color:var(--ink2);max-width:38em;margin:0 0 2em}
.cover .authors{font-size:1.15em;font-weight:600}
.cover .dot{color:var(--accent);margin:0 .45em}
.cover .prof{color:var(--muted);margin-top:.3em}
.cover .hint{margin-top:3em;color:var(--muted);font-size:.85em;display:flex;align-items:center;gap:.6em;flex-wrap:wrap}
.cover .hint .sep{width:22px;height:1px;background:var(--line2)}
.truth{margin-top:1.1em;display:inline-flex;gap:.6em;align-items:center;font-size:.8em;color:var(--ink2);background:var(--glass);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--line);border-radius:99px;padding:.45em 1em}
.truth i{width:8px;height:8px;border-radius:50%;background:var(--swarm);box-shadow:0 0 0 4px var(--swarm-soft)}

/* ============ QR ============ */
.qr-grid{flex:1;min-height:0;display:grid;grid-template-columns:auto minmax(0,1fr);gap:4vw;align-items:center}
.qr-card{background:var(--bg2);border-radius:28px;padding:22px;box-shadow:var(--shadow-lg);display:flex;flex-direction:column;align-items:center;gap:12px}
.qr-card svg{width:min(42vh,340px);height:min(42vh,340px);display:block}
.qr-card svg rect[fill="#000000"]{fill:var(--ink)}
.qr-url{font:500 .9rem var(--mono);color:var(--ink2);word-break:break-all;text-align:center;max-width:340px}
.qr-steps{display:flex;flex-direction:column;gap:2.2vh}
.qr-steps div{display:grid;grid-template-columns:2.4em 1fr;gap:.6em;align-items:start}
.qr-steps em{font:600 1.4em var(--serif);font-style:normal;color:var(--accent)}
.qr-steps b{display:block;font-size:1.2em}
.qr-steps span{color:var(--muted)}
.on-phone{display:none}

/* ============ roteiro ============ */
.roadmap{display:grid;grid-template-columns:1.3fr 1fr;gap:4vw;flex:1;min-height:0}
.road-who{display:flex;align-items:center;gap:.7em;font-weight:600;margin-bottom:1.1em}
.pill{font:600 .68rem var(--sans);letter-spacing:.06em;text-transform:uppercase;padding:.38em .85em;border-radius:99px}
.pill.teal{background:var(--swarm-soft);color:var(--swarm)} .pill.gold{background:rgba(217,138,4,.12);color:var(--gold)}
.road{list-style:none;margin:0;padding:0;counter-reset:r}
.road[start="7"]{counter-reset:r 6}
.road li{counter-increment:r;display:grid;grid-template-columns:3.2em 1fr;padding:1em 0;border-top:1px solid var(--line)}
.road li::before{content:counter(r,decimal-leading-zero);font:500 1.45em var(--serif);color:var(--swarm);grid-row:span 2;line-height:1.1}
.road-col:last-child .road li::before{color:var(--gold)}
.road b{font-size:1.08em} .road span{color:var(--muted);font-size:.92em}
.howto{display:flex;gap:1.6em;align-items:center;background:var(--bg2);border-radius:var(--r);padding:1.1em 1.4em;margin-top:2vh;box-shadow:var(--shadow)}
.howto p{margin:0;color:var(--ink2)}
.mini-sheet{width:56px;height:72px;background:var(--paper);border-radius:5px;padding:9px 8px;display:flex;flex-direction:column;gap:6px;box-shadow:0 0 0 1px var(--line2)}
.mini-sheet i{display:block;height:4px;background:var(--sk);border-radius:2px}
.mini-sheet i.m{background:#f6c445}

/* ============ split / artigo ============ */
.split{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.2fr);gap:2.6vw}
.split.evo{grid-template-columns:minmax(0,.8fr) minmax(0,1.3fr)}
.right{min-height:0;display:flex;flex-direction:column;gap:1.6vh}
.stack{flex-direction:column;gap:1.6vh}
.stack.center{justify-content:center;flex:1}
.paper{position:relative;overflow:hidden;border-radius:var(--r);background:var(--paper-frame);box-shadow:var(--shadow-lg);cursor:zoom-in}
.sheet{position:absolute;left:0;top:0;transform-origin:0 0;background:var(--paper);transition:transform .9s cubic-bezier(.2,.75,.2,1);box-shadow:0 0 0 1px rgba(0,0,0,.06)}
.pg-layer,.mk-layer{position:absolute;inset:0}
.pg-layer canvas{position:absolute;inset:0;width:100%;height:100%}
.sk{position:absolute;display:flex;align-items:center}
.sk i{display:block;width:100%;height:42%;background:var(--sk);border-radius:2px}
.skh{position:absolute;font-family:'Tinos','Times New Roman',serif;font-weight:700;color:var(--paper-ink);white-space:nowrap;line-height:1}
.skh.pg{font-weight:400;color:#8a8170}
.mark{position:absolute;border-radius:2px;transform-origin:left center;animation:draw .6s cubic-bezier(.3,.7,.2,1) both}
.mark.hl{background:var(--hl);mix-blend-mode:multiply}
.mark.st{background:rgba(217,54,54,.07)}
.mark.st::after{content:"";position:absolute;left:0;right:0;top:50%;height:2px;background:#d93636;transform:translateY(-50%)}
@keyframes draw{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.paper-tag{position:absolute;left:10px;top:10px;z-index:3;display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.paper-tag span,.paper-tag button{font:600 .64rem var(--sans);background:rgba(29,29,31,.78);color:#fff;padding:.42em .75em;border-radius:99px;letter-spacing:.01em;border:0;backdrop-filter:blur(8px)}
.paper-tag button{cursor:pointer;background:var(--accent)}
.paper-tag button.ok{background:rgba(29,29,31,.55)}
.paper.drop::after{content:"Solte o PDF aqui";position:absolute;inset:0;display:grid;place-items:center;background:rgba(196,98,61,.88);color:#fff;font:600 1.1rem var(--sans);z-index:5}

/* ============ blocos ============ */
.card{background:var(--bg2);border-radius:var(--r);padding:1em 1.25em;box-shadow:var(--shadow)}
.card.soft{background:var(--bg3);box-shadow:none}
.card p{margin:0;color:var(--ink2)}
.card p+p{margin-top:.6em}
.lead{font-size:1.08em;color:var(--ink2);margin:0}
.statement{font-family:var(--serif);font-size:clamp(23px,2.3vw,38px);line-height:1.22;margin:0;font-weight:400}
.statement b{color:var(--accent);font-weight:500}
.big-line{font-family:var(--serif);font-size:1.3em!important;color:var(--ink)!important;line-height:1.25}
.caption{background:var(--bg2);border-radius:14px;padding:.95em 1.15em;color:var(--ink2);font-size:.98em;box-shadow:var(--shadow);border-left:3px solid var(--accent)}
.caption.flat{border-left-color:var(--violet)}
.caption .small{display:block;margin-top:.5em}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:1.2vw}
.people{display:flex;flex-direction:column;gap:1.2vh}
.person{display:flex;gap:1em;align-items:center;background:var(--bg2);border-radius:var(--r);padding:.95em 1.15em;box-shadow:var(--shadow)}
.person b{display:block;font-size:1.12em}
.person span{color:var(--muted);font-size:.92em}
.ph{flex:none;width:52px;height:52px;border-radius:50%;display:grid;place-items:center;font:600 1rem var(--sans);background:var(--swarm-soft);color:var(--swarm)}
.ph.gold{background:rgba(217,138,4,.12);color:var(--gold)}
.checks{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.85em}
.checks li{position:relative;padding-left:1.8em;color:var(--ink2)}
.checks li::before{content:"";position:absolute;left:0;top:.42em;width:.72em;height:.72em;border-radius:50%;background:var(--swarm);box-shadow:0 0 0 4px var(--swarm-soft)}
.toc-paper{display:flex;flex-direction:column;background:var(--bg2);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow)}
.toc-paper div{padding:.75em 1.1em;border-top:1px solid var(--line);font-family:'Tinos',Georgia,serif;font-size:1.08em;display:flex;gap:.9em;align-items:baseline}
.toc-paper div:first-child{border-top:0}
.toc-paper span{font:600 .8em var(--sans);color:var(--accent);width:1.2em}
.toc-paper em{font:500 .78em var(--sans);color:var(--muted);margin-left:auto;font-style:normal}
.toc-paper div:nth-child(3){background:var(--accent-soft)}
.roots{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:1.2vw}
.root{background:var(--bg2);border-radius:14px;padding:.95em 1.15em;box-shadow:var(--shadow)}
.root p{margin:0;color:var(--muted)}
.roots-lines{grid-column:1/-1;width:100%;height:56px}
.roots-lines path{fill:none;stroke:var(--accent);stroke-width:1.5;stroke-dasharray:4 4;vector-effect:non-scaling-stroke}
.root.pso{grid-column:1/-1;justify-self:center;font:500 1.6em var(--serif);color:var(--accent);padding:.35em 1.5em}
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:1vw}
.stat{background:var(--bg2);border-radius:var(--r);padding:1.1em;text-align:center;box-shadow:var(--shadow)}
.stat b{display:block;font:500 1.75em var(--serif);color:var(--accent)}
.stat span{color:var(--muted);font-size:.9em}
.principles{display:flex;flex-direction:column;background:var(--bg2);border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden}
.principles div{display:grid;grid-template-columns:9.5em 1fr 1fr;gap:1em;padding:.7em 1.1em;border-top:1px solid var(--line);align-items:start}
.principles div:first-child{border-top:0}
.principles div.hd{background:var(--bg3)}
.principles div.hd span{font:600 .68rem var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.principles b{color:var(--swarm)} .principles span{color:var(--ink2);font-size:.95em}
.principles .pso-col{color:var(--accent)}
.results{display:grid;grid-template-columns:1fr 1fr;gap:1.2vw}
.scale{display:grid;grid-template-columns:1fr 1.3fr 1fr;background:var(--bg2);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow)}
.scale div{padding:1em;text-align:center;border-left:1px solid var(--line)}
.scale div:first-child{border-left:0}
.scale b{display:block} .scale span{color:var(--muted);font-size:.88em}
.scale .mid{background:var(--accent-soft)} .scale .mid b{color:var(--accent)}
.quote{font-family:var(--serif);font-style:italic;font-size:clamp(24px,2.5vw,42px);line-height:1.22;margin:0;padding-left:.8em;border-left:3px solid var(--gold);color:var(--ink)}
.eq{font-family:var(--serif);background:var(--bg2);border-radius:14px;padding:.85em 1.15em;color:var(--ink);box-shadow:var(--shadow)}
.small-eq{font-size:1rem;margin-top:.7em;font-family:var(--mono);box-shadow:none;background:var(--bg3)}
.big-eq{font-size:clamp(17px,1.6vw,27px);line-height:1.85}
.t-in{color:var(--blue)} .t-co{color:var(--pink)} .t-so{color:var(--gold)}
.terms{display:flex;flex-direction:column;gap:.55em;color:var(--ink2)}
.terms .sw{display:inline-block;width:.9em;height:.9em;border-radius:4px;margin-right:.6em;vertical-align:-.1em}
.sw.in{background:var(--blue)} .sw.co{background:var(--pink)} .sw.so{background:var(--gold)}
.terms b{margin-right:.4em}
.matrix{margin-top:.8em;display:grid;grid-template-columns:repeat(13,12px);gap:3px}
.matrix i{display:block;width:12px;height:12px;border-radius:3px;background:var(--swarm-soft)}
.matrix i.hot{background:var(--swarm)}

/* ============ simulações ============ */
.sim-box{position:relative;flex:1;min-height:0;background:var(--canvas);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow),inset 0 0 0 1px var(--canvas-edge)}
.sim-box.short{flex:none;height:22vh}
.sim-box canvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:pan-y}
.hud{position:absolute;left:14px;top:12px;font:500 .72rem/1.55 var(--mono);color:var(--muted);pointer-events:none;white-space:pre}
.hud b{color:var(--ink)}
.sim-ui{position:absolute;right:10px;bottom:10px;display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end;max-width:94%}
.tog{display:flex;align-items:center;gap:.45em;background:var(--glass);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--line2);padding:.4em .8em;border-radius:99px;font-size:.8em;cursor:pointer}
.tog input{accent-color:var(--swarm)}
.btn{font:500 .8rem var(--sans);background:var(--bg2);color:var(--ink);border:1px solid var(--line2);padding:.52em 1em;border-radius:99px;cursor:pointer;transition:background .15s,border-color .15s,color .15s;white-space:nowrap}
.btn:hover{border-color:var(--accent);color:var(--accent)}
.btn.primary{background:var(--ink);color:var(--bg);border-color:var(--ink);font-weight:600}
.btn.primary:hover{background:var(--accent);border-color:var(--accent);color:#fff}
.btn.on{background:var(--accent);border-color:var(--accent);color:#fff}
.btn.tiny{font-size:.7rem;padding:.38em .8em}
.sim-ui .btn{background:var(--glass);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.sim-ui .btn.on{background:var(--accent);color:#fff}
.chips{display:flex;gap:4px;flex-wrap:wrap;background:var(--bg2);padding:4px;border-radius:99px;box-shadow:var(--shadow)}
.chips span{font:600 .76rem var(--sans);padding:.42em .8em;border-radius:99px;color:var(--faint);transition:all .25s}
.chips span.on{background:var(--accent);color:#fff}
.chips span.done{color:var(--ink2)}

/* XOR */
.xor{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1.2vw;flex:1;min-height:0}
.xor-map{position:relative;aspect-ratio:1;max-height:46vh;align-self:start;border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow)}
.xor-map canvas{width:100%;height:100%;display:block}
.axis-x,.axis-y{position:absolute;font:600 .72rem var(--mono);color:var(--muted)}
.axis-x{bottom:6px;right:10px} .axis-y{top:8px;left:10px}
.xor-side{display:flex;flex-direction:column;gap:.5em;min-width:0}
.bars{display:grid;grid-template-columns:repeat(13,1fr);gap:3px;height:70px;align-items:center;background:var(--bg2);border-radius:12px;padding:8px;box-shadow:var(--shadow)}
.bars i{display:block;width:100%;border-radius:3px;transition:height .15s}
.mini-chart{width:100%;height:80px;background:var(--bg2);border-radius:12px;display:block;box-shadow:var(--shadow)}
.xor-stat{font:500 .8rem var(--mono);color:var(--ink2);min-height:2.8em}

/* laboratório */
.lab-grid{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.25fr);gap:2.2vw}
.lab-left{min-height:0;display:flex;flex-direction:column;gap:1.4vh}
.lab{min-height:0;display:grid;grid-template-rows:minmax(0,1fr) auto auto;gap:8px}
.lab-canvas{position:relative;border-radius:var(--r);overflow:hidden;background:var(--canvas);min-height:0;box-shadow:var(--shadow),inset 0 0 0 1px var(--canvas-edge)}
.lab-canvas canvas{position:absolute;inset:0;width:100%;height:100%;cursor:crosshair;touch-action:pan-y}
.lab-ctrl{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;font-size:.78rem;color:var(--ink2)}
.lab-ctrl label{display:flex;align-items:center;gap:.4em}
.lab-ctrl input[type=range]{width:76px;accent-color:var(--accent)}
.lab-ctrl output{font-family:var(--mono);min-width:2.8em;color:var(--ink)}
select{background:var(--bg2);color:var(--ink);border:1px solid var(--line2);border-radius:99px;padding:.32em .7em;font:inherit;font-size:.8rem}
.lab-chart{height:78px;position:relative}
.lab-chart canvas{width:100%;height:100%;display:block;background:var(--bg2);border-radius:12px;box-shadow:var(--shadow)}
.legend{position:absolute;right:12px;top:7px;font:500 .66rem var(--sans);display:flex;gap:12px;color:var(--muted)}
.legend i{display:inline-block;width:10px;height:2px;margin-right:4px;vertical-align:middle}
.pseudo{margin:0;font:400 clamp(12px,1.02vw,16px)/1.75 var(--mono);background:var(--bg2);border-radius:var(--r);padding:.9em 1.15em;color:var(--muted);white-space:normal;overflow:auto;box-shadow:var(--shadow)}
.pseudo span{display:block;white-space:pre;border-radius:6px;transition:background .2s,color .2s;padding:0 .35em;margin:0 -.35em}
.pseudo span.on{background:var(--accent-soft);color:var(--ink);box-shadow:inset 3px 0 0 var(--accent)}
.row-btns{display:flex;gap:1em;align-items:center}
.row-btns .btn{flex:none}
.topo svg{width:84px;height:84px;display:block;margin-bottom:.4em}
.topo line{stroke:var(--swarm);stroke-opacity:.35;stroke-width:1}
.topo circle{fill:var(--swarm)}
.presets{display:flex;flex-direction:column;gap:7px}
.presets button{all:unset;cursor:pointer;display:block;background:var(--bg2);border-radius:14px;padding:.62em .95em;transition:box-shadow .15s,background .15s;box-shadow:var(--shadow)}
.presets button b{display:block;font-size:.95em}
.presets button span{color:var(--muted);font-size:.84em}
.presets button.on{box-shadow:0 0 0 2px var(--accent),var(--shadow)}
.presets button.on b{color:var(--accent)}

/* jogo */
.game-grid{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:2.2vw}
.game-side{display:flex;flex-direction:column;gap:1.4vh;min-height:0}
.score{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}
.score div{background:var(--bg2);border-radius:14px;padding:.8em 1em;box-shadow:var(--shadow)}
.score b{display:block;font:500 1.6em var(--serif)}
.score span{font-size:.78em;color:var(--muted)}
.score .you b{color:var(--blue)} .score .sw b{color:var(--swarm)} .score .opt b{color:var(--gold)}
.verdict{font:500 1.3em var(--serif);min-height:1.4em}

/* código */
.tabs{display:flex;gap:4px;background:var(--bg2);padding:4px;border-radius:99px;box-shadow:var(--shadow)}
.tabs button{all:unset;cursor:pointer;font:500 .8rem var(--sans);padding:.45em 1em;border-radius:99px;color:var(--muted)}
.tabs button.on{background:var(--ink);color:var(--bg)}
.code-grid{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:2vw}
.code-wrap{position:relative;min-height:0}
.code{margin:0;height:100%;overflow:auto;background:var(--bg2);border-radius:var(--r);padding:1.1em 1.3em;font:400 clamp(11.5px,.95vw,15.5px)/1.62 var(--mono);color:var(--ink2);box-shadow:var(--shadow)}
.code .ln{display:block;padding-left:3em;position:relative;border-radius:4px;white-space:pre}
.code .ln::before{content:attr(data-n);position:absolute;left:0;width:2em;text-align:right;color:var(--faint)}
.code .ln.hot{background:var(--accent-soft)}
.copy{position:absolute;right:12px;top:10px;z-index:2}
.tk-k{color:#a626a4} .tk-c{color:var(--faint);font-style:italic} .tk-n{color:#c4623d} .tk-s{color:#50a14f} .tk-f{color:#4078f2}
:root[data-theme=dark] .tk-k{color:#c4a7ff} :root[data-theme=dark] .tk-n{color:#fbbf24} :root[data-theme=dark] .tk-f{color:#5eead4}
.code-notes{display:flex;flex-direction:column;gap:1vh;overflow:auto}
.code-notes .cn{background:var(--bg2);border-radius:14px;padding:.75em 1em;box-shadow:var(--shadow);transition:box-shadow .15s}
.code-notes .cn:hover{box-shadow:0 0 0 2px var(--accent),var(--shadow)}
.code-notes .cn b{display:block} .code-notes .cn span{color:var(--muted);font-size:.9em}
.code-notes .cn em{font:600 .68rem var(--sans);color:var(--accent);font-style:normal;text-transform:uppercase;letter-spacing:.06em}

/* linha do tempo */
.timeline-wrap{flex:none;display:flex;flex-direction:column;gap:3vh}
.timeline{position:relative;display:flex;padding:4.5em 0 0;flex:none}
.timeline::before{content:"";position:absolute;left:0;right:0;top:calc(4.5em + 11px);height:2px;background:linear-gradient(90deg,var(--swarm),var(--violet),var(--accent))}
.tl-group{flex:1;display:flex;position:relative;opacity:.15;transition:opacity .5s}
.tl-group.vis{opacity:1}
.tl-group .gname{position:absolute;top:-4.2em;left:0;right:0;font:600 .68rem var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);border-top:1px solid var(--line2);padding-top:.5em}
.tl-node{all:unset;cursor:pointer;flex:1;display:flex;flex-direction:column;align-items:center;gap:.45em;text-align:center}
.tl-node i{width:22px;height:22px;border-radius:50%;background:var(--bg);border:2px solid var(--swarm);transition:transform .2s,background .2s;position:relative;z-index:1}
.tl-node:hover i,.tl-node.sel i{background:var(--accent);border-color:var(--accent);transform:scale(1.2)}
.tl-node b{font:600 1.02rem var(--sans)}
.tl-node span{font-size:.76rem;color:var(--ink2);max-width:9em;line-height:1.25}
.tl-detail{min-height:28vh;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:2vw;background:var(--bg2);border-radius:var(--r);padding:1.3em 1.6em;box-shadow:var(--shadow);font-size:1.1em}
.tl-detail h3{font-size:1.6em;margin-bottom:.3em}
.tl-detail p{margin:.4em 0;color:var(--ink2)}
.tl-detail .who{font:600 .76rem var(--sans);color:var(--accent);letter-spacing:.02em}
.tl-detail .eq{align-self:start;font-family:var(--mono);font-size:.9em;line-height:1.7;background:var(--bg3);box-shadow:none}
.tl-detail .eq .new{color:var(--accent);font-weight:600}
.sota{flex:none;margin-top:3vh}
.sota-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1vw;margin-bottom:.9em}
.sota-grid div{background:var(--bg2);border-radius:14px;padding:.9em 1.05em;box-shadow:var(--shadow);border-top:3px solid var(--accent)}
.sota-grid b{display:block} .sota-grid span{color:var(--muted);font-size:.88em}
.sota p{margin:0}
.timeline-wrap.compact .tl-detail{display:none}

/* aplicação */
.app-grid{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:2.2vw}
.sim-box.map canvas{cursor:copy}
.app-side{display:flex;flex-direction:column;gap:1.4vh;min-height:0}
.ctrl-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:auto;font-size:.85rem}
.uses{flex:1;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:1fr 1fr;gap:1.4vw}
.use{background:var(--bg2);border-radius:var(--r);padding:1.3em 1.4em;display:flex;flex-direction:column;gap:.45em;box-shadow:var(--shadow)}
.use .ico{font-size:1.7em;color:var(--accent);line-height:1}
.use b{font-size:1.15em} .use span{color:var(--ink2)} .use em{margin-top:auto;font:500 .7rem var(--sans);color:var(--muted);font-style:normal}
.pros-cons{flex:none;display:grid;grid-template-columns:1fr 1fr;gap:2vw}
.pc{background:var(--bg2);border-radius:var(--r);padding:1.4em 1.6em;box-shadow:var(--shadow)}
.pc.pro{border-top:3px solid var(--swarm)} .pc.con{border-top:3px solid var(--red)}
.pc ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:1.2em;font-size:1.15em}
.pc li{color:var(--ink2);padding-left:1.4em;position:relative}
.pc.pro li::before{content:"+";position:absolute;left:0;color:var(--swarm);font-weight:700}
.pc.con li::before{content:"−";position:absolute;left:0;color:var(--red);font-weight:700}
.compare{font-size:1.1em;background:var(--bg2);border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden}
.compare table{width:100%;border-collapse:collapse}
.compare th,.compare td{text-align:left;padding:.95em 1.1em;border-bottom:1px solid var(--line)}
.compare tr:last-child td{border-bottom:0}
.compare th{font:600 .72rem var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);background:var(--bg3)}
.compare td:first-child{color:var(--muted);font-size:.9em;width:16%}
.compare td:nth-child(2){color:var(--ink);background:var(--swarm-soft);font-weight:500}
.refs{margin:0;padding-left:1.6em;columns:2;column-gap:3vw;font-size:.8em;color:var(--ink2);overflow:auto}
.refs li{margin-bottom:.7em;break-inside:avoid}

/* ============ barra e camadas ============ */
#bar{position:fixed;left:0;right:0;bottom:0;height:56px;display:flex;align-items:center;gap:16px;padding:0 14px 0 3.8vw;border-top:1px solid var(--line);background:var(--glass);backdrop-filter:saturate(1.6) blur(18px);-webkit-backdrop-filter:saturate(1.6) blur(18px);z-index:20}
.bar-left{display:flex;gap:.8em;align-items:center;min-width:0;flex:0 1 26%;font-size:.8rem;white-space:nowrap;overflow:hidden}
#bar-part{font:600 .64rem var(--sans);letter-spacing:.06em;text-transform:uppercase;padding:.36em .7em;border-radius:99px;background:var(--swarm-soft);color:var(--swarm)}
#bar-part.p2{background:rgba(217,138,4,.12);color:var(--gold)}
#bar-title{color:var(--ink2);overflow:hidden;text-overflow:ellipsis}
.bar-prog{flex:1;display:flex;gap:3px;align-items:center;height:22px}
.bar-prog button{all:unset;cursor:pointer;flex:1;height:4px;border-radius:2px;background:var(--line2);position:relative;overflow:hidden;transition:height .15s}
.bar-prog button:hover{height:8px}
.bar-prog button i{position:absolute;left:0;top:0;bottom:0;background:var(--swarm);transition:width .3s}
.bar-prog button.p2 i{background:var(--gold)}
.bar-right{display:flex;align-items:center;gap:4px}
#bar-step{font:500 .72rem var(--mono);color:var(--muted);margin-right:6px;min-width:3.5em;text-align:right}
.ib{all:unset;cursor:pointer;width:36px;height:36px;display:grid;place-items:center;border-radius:99px;color:var(--ink2);font-size:.95rem}
.ib:hover{background:var(--bg3);color:var(--ink)}
.ib.on{color:var(--accent);background:var(--accent-soft)}
.live-pill{position:fixed;top:12px;left:50%;transform:translateX(-50%);z-index:25;display:none;align-items:center;gap:.6em;background:var(--glass);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--line2);border-radius:99px;padding:.35em .45em .35em .9em;font-size:.8rem;box-shadow:var(--shadow)}
.live-pill.show{display:flex}
.live-pill .dot{width:8px;height:8px;border-radius:50%;background:var(--red);animation:pulse 1.4s infinite}
.live-pill.free .dot{background:var(--faint);animation:none}
.live-pill button{font:600 .74rem var(--sans);border:0;border-radius:99px;padding:.45em .9em;background:var(--ink);color:var(--bg);cursor:pointer}
@keyframes pulse{50%{opacity:.35}}
.drawer{position:fixed;left:0;right:0;bottom:56px;z-index:19;transform:translateY(105%);transition:transform .3s;pointer-events:none}
.drawer.open{transform:none;pointer-events:auto}
.drawer-in{margin:0 auto;max-width:1100px;background:var(--bg2);border-radius:20px 20px 0 0;padding:1em 1.5em 1.2em;box-shadow:var(--shadow-lg)}
#notes-list{margin:0;padding-left:1.2em;font-size:1.05em;color:var(--ink)}
#notes-list li{margin:.25em 0}
.overlay{position:fixed;inset:0;z-index:30;background:rgba(20,20,18,.28);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:none;align-items:center;justify-content:center;padding:4vh 4vw}
.overlay.open{display:flex}
.ov-in{background:var(--bg2);border-radius:22px;padding:1.4em 1.6em;width:min(1100px,100%);max-height:100%;overflow:auto;box-shadow:var(--shadow-lg)}
.ov-in.small{width:min(560px,100%)}
.ov-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:1em;gap:1em}
#toc-list{display:grid;grid-template-columns:1fr 1fr;gap:4px 2vw}
#toc-list button{all:unset;cursor:pointer;display:flex;gap:.8em;align-items:baseline;padding:.6em .8em;border-radius:12px}
#toc-list button:hover{background:var(--bg3)}
#toc-list button.cur{background:var(--accent-soft)}
#toc-list button em{font:500 .75rem var(--mono);color:var(--muted);font-style:normal;width:2em}
#toc-list .grp{grid-column:1/-1;margin-top:.8em}
.keys td{padding:.35em 1em .35em 0;color:var(--ink2)}
#black{position:fixed;inset:0;background:#000;z-index:50;display:none}
#black.on{display:block}

/* leitor do artigo */
#reader{position:fixed;top:0;right:0;bottom:56px;width:min(600px,100%);z-index:28;background:var(--bg2);box-shadow:var(--shadow-lg);transform:translateX(105%);transition:transform .35s cubic-bezier(.2,.7,.2,1);display:flex;flex-direction:column}
#reader.open{transform:none}
.rd-head{display:flex;align-items:center;gap:8px;padding:12px 14px;border-bottom:1px solid var(--line)}
.rd-head b{flex:1;font-size:.9rem}
.rd-pages{display:flex;align-items:center;gap:2px}
.rd-pages span{font:500 .78rem var(--mono);color:var(--muted);min-width:5.2em;text-align:center}
.rd-body{flex:1;min-height:0;overflow:auto;background:var(--paper-frame);padding:14px;-webkit-overflow-scrolling:touch}
.rd-body .paper{border-radius:6px;cursor:default;overflow:visible;box-shadow:var(--shadow)}
.rd-body .sheet{position:relative;transition:none}

/* ============ apresentador ============ */
#presenter{display:none}
body.presenter #deck,body.presenter #bar,body.presenter .drawer,body.presenter #reader{display:none}
body.presenter #presenter{display:grid;position:fixed;inset:0;grid-template-columns:1.4fr 1fr;grid-template-rows:auto 1fr auto;gap:18px;padding:24px 28px}
.pr-top{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;gap:1em;flex-wrap:wrap}
.pr-timer{font:500 2.4rem var(--mono);color:var(--ink)}
.pr-timer.warn{color:var(--gold)} .pr-timer.over{color:var(--red)}
.pr-now{background:var(--bg2);border-radius:22px;padding:1.4em 1.6em;overflow:auto;box-shadow:var(--shadow)}
.pr-now h2{font-size:2rem;margin:.2em 0 .6em}
.pr-now ul{margin:0;padding-left:1.2em;font-size:1.45rem;line-height:1.5}
.pr-now li{margin:.35em 0}
.pr-next{background:var(--bg3);border-radius:22px;padding:1.2em 1.4em;color:var(--muted);overflow:auto}
.pr-next ul{padding-left:1.2em;font-size:1.05rem}
.pr-bottom{grid-column:1/-1;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.pr-bottom .btn{font-size:1rem;padding:.7em 1.4em}
.pr-steps{display:flex;gap:4px;margin-left:auto}
.pr-steps i{width:18px;height:6px;border-radius:3px;background:var(--line2)}
.pr-steps i.on{background:var(--accent)}
.pr-live{display:flex;align-items:center;gap:8px;font-size:.85rem;color:var(--ink2)}
.pr-live input{font:inherit;padding:.4em .7em;border-radius:99px;border:1px solid var(--line2);background:var(--bg2);color:var(--ink);width:9em}

/* ============ celular ============ */
@media (max-width:900px){
  :root{--fs:15px}
  body{overflow:auto}
  #deck{bottom:62px}
  .slide{overflow-y:auto;overflow-x:hidden;padding:22px 16px 26px;-webkit-overflow-scrolling:touch}
  .head.row{flex-direction:column;align-items:flex-start;gap:12px}
  .split,.split.evo,.lab-grid,.app-grid,.code-grid,.roadmap,.pros-cons,.game-grid,.qr-grid{grid-template-columns:1fr;gap:14px}
  .split .paper{height:52vh;flex:none;order:2}
  .split .right{order:1}
  .sim-box{min-height:44vh;flex:none}
  .sim-box.short{height:26vh}
  .lab{grid-template-rows:58vh auto auto}
  .uses{grid-template-columns:1fr;grid-template-rows:none}
  .duo,.results,.trio,.sota-grid,.score{grid-template-columns:1fr}
  .score{grid-template-columns:1fr 1fr 1fr}
  .principles div{grid-template-columns:1fr}
  .timeline{overflow-x:auto;padding-bottom:6px}
  .tl-group{min-width:max-content}
  .tl-node{min-width:70px}
  .tl-detail{grid-template-columns:1fr}
  .refs{columns:1}
  .bar-left{display:none}
  .bar-prog{display:none}
  #bar{height:62px;padding:0 10px;justify-content:space-between}
  #bar-step{margin-right:auto;min-width:0}
  .ib{width:42px;height:42px;font-size:1.05rem}
  .xor{grid-template-columns:1fr}
  .code{height:auto;max-height:60vh}
  .cover h1{font-size:40px}
  .cover{padding:0 22px}
  .qr-card svg{width:200px;height:200px}
  .on-phone{display:block} .on-desk{display:none}
  .drawer{bottom:62px} #reader{bottom:62px;width:100%}
  .live-pill{top:auto;bottom:74px}
  .hud{font-size:.64rem}
}
.qr-steps p{margin:0}
.qr-steps .on-phone{display:none}
@media (max-width:900px){.qr-steps .on-phone{display:grid}}
.drawer{visibility:hidden;transform:translateY(calc(100% + 90px))}
.drawer.open{visibility:visible;transform:none}
@media (max-width:900px){
  .split,.split.evo,.lab-grid,.app-grid,.code-grid,.game-grid,.roadmap,.timeline-wrap,.uses,.pros-cons,.qr-grid{flex:none}
  .right,.lab-left,.app-side,.game-side{min-height:auto}
  .xor-map{max-height:none;width:100%}
  .game-grid .sim-box{min-height:0;height:auto;aspect-ratio:1}
  .slide{padding-bottom:40px}
}
.live-pill{white-space:nowrap}
@media (max-width:900px){.live-pill{left:auto;right:10px;transform:none;bottom:72px;font-size:.72rem}}
/* artigo original embutido: links para o PDF */
a.paper-link{text-decoration:none;display:inline-block}
.paper-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:.6em}
a.btn.tiny{text-decoration:none}
@media (max-width:560px){.rd-head b{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.82rem}}
