/* janonismo.com — riso poster system
   Two ink drums: riso blue + a spot colour per playbook (--spot), printed on cool white paper. */

@font-face{font-family:"Archivo";font-style:normal;font-display:swap;font-weight:100 900;font-stretch:62% 125%;
  src:url(/assets/fonts/archivo-latin-wdth-normal.woff2) format("woff2-variations");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Archivo";font-style:normal;font-display:swap;font-weight:100 900;font-stretch:62% 125%;
  src:url(/assets/fonts/archivo-latin-ext-wdth-normal.woff2) format("woff2-variations");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Marker";font-style:normal;font-display:swap;font-weight:400;
  src:url(/assets/fonts/permanent-marker-latin-400-normal.woff2) format("woff2")}

:root{
  --paper:#F1F2F4;
  --card:#FBFBFC;
  --ink:#1C1F4A;
  --blue:#2B4BFF;
  --spot:#FF4FA3;
  --grey:#585C70;
  --line:#D5D6E0;
  --ok:#0E7A4B;
  --no:#B3261E;
  --measure:44rem;
  --wide:72rem;
  --gut:clamp(16px,4vw,40px);
  --r:10px;
  --f:"Archivo",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:5rem}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--f);font-size:1.0625rem;line-height:1.6;
  text-rendering:optimizeLegibility;overflow-x:hidden}
img,svg{max-width:100%;display:block}
a{color:var(--blue);text-decoration-thickness:1.5px;text-underline-offset:.18em}
a:hover{color:var(--ink)}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px;border-radius:2px}
p{margin:0 0 1rem}
h1,h2,h3,h4{margin:0;line-height:1.08;font-weight:800}
h3{font-size:1.35rem;font-stretch:80%;margin:2.25rem 0 .75rem}
h4{font-size:1.05rem;font-stretch:90%;margin:1.75rem 0 .5rem}
ul,ol{margin:0 0 1rem;padding:0}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.muted{color:var(--grey)}
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:#fff;padding:.6rem 1rem;z-index:99}
.skip:focus{left:8px;top:8px}
.row{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center}

/* ---------- header */
.top{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:1rem;padding:.6rem var(--gut);
  background:color-mix(in srgb,var(--paper) 92%,transparent);backdrop-filter:blur(6px);border-bottom:1px solid var(--line)}
.brand{font-weight:900;font-stretch:62%;font-size:1.6rem;letter-spacing:.01em;color:var(--ink);text-decoration:none;line-height:1}
.topnav{display:none;gap:1.25rem;margin-left:auto}
.topnav a{color:var(--ink);text-decoration:none;font-weight:600;font-stretch:90%}
.topnav a:hover,.topnav a[aria-current]{color:var(--blue);text-decoration:underline}
.tools{display:flex;gap:.5rem;align-items:center;margin-left:auto}
.chip{display:inline-flex;align-items:center;gap:.4rem;border:1.5px solid var(--ink);background:transparent;color:var(--ink);
  font:600 .875rem/1.15 var(--f);font-stretch:90%;padding:.45rem .7rem;border-radius:999px;cursor:pointer;max-width:12rem;white-space:nowrap}
.chip .cl-long{overflow:hidden;text-overflow:ellipsis;min-width:0}
.chip .dot{width:.55rem;height:.55rem;border-radius:50%;background:var(--line);flex:none}
.chip.set .dot{background:var(--spot)}
.langsel select{font:600 .875rem var(--f);color:var(--ink);background:transparent;border:1.5px solid var(--ink);border-radius:999px;padding:.4rem .6rem;max-width:7.5rem}
.menu-btn{font:600 .875rem var(--f);background:var(--ink);color:var(--paper);border:0;border-radius:999px;padding:.5rem .8rem;cursor:pointer}
.top.open .topnav{display:flex;flex-direction:column;position:absolute;left:0;right:0;top:100%;background:var(--paper);padding:1rem var(--gut) 1.5rem;border-bottom:2px solid var(--ink);gap:.9rem;font-size:1.2rem}
@media (max-width:640px){.country-chip{max-width:7.5rem}.langsel select{max-width:5.2rem}}
@media (min-width:1180px){
  .topnav{display:flex}
  .menu-btn{display:none}
  .tools{margin-left:1rem}
}

/* ---------- overprint (the one loud thing) */
.ovp{position:relative;display:inline-block;font-weight:900;font-stretch:62%;line-height:.86;letter-spacing:-.005em;
  font-size:clamp(4.2rem,19vw,13.5rem);color:var(--blue);margin:0;isolation:isolate}
.ovp::after{content:attr(data-t);content:attr(data-t) / "";position:absolute;left:.035em;top:.028em;width:100%;color:var(--spot);mix-blend-mode:multiply;z-index:2;pointer-events:none}
.ovp.mid{font-size:clamp(3rem,11vw,6.5rem)}
@media (prefers-reduced-motion:no-preference){
  .ovp::after{animation:reg 900ms cubic-bezier(.2,.8,.2,1) 1 both}
  @keyframes reg{from{transform:translate(-.05em,.04em);opacity:0}to{transform:none;opacity:1}}
}
.stamp{font-family:"Marker",cursive;color:var(--stamp,var(--spot));font-size:clamp(1.5rem,4.6vw,2.6rem);transform:rotate(-4deg);
  display:inline-block;margin:.4rem 0 1.2rem;line-height:1.1}

/* ---------- page structures */
.home-hero,.pb-hero,.page-head{padding:clamp(2.5rem,7vw,5.5rem) var(--gut) 2rem;max-width:var(--wide);margin:0 auto}
.lead{font-size:clamp(1.2rem,2.4vw,1.5rem);line-height:1.45;max-width:38rem;font-stretch:95%}
.kicker{font-weight:700;font-stretch:85%;color:var(--grey);margin:0 0 .6rem}
.tribute{color:var(--grey);font-size:.95rem;max-width:38rem}
.intro{font-size:1.125rem}
.home-sec{max-width:var(--wide);margin:0 auto;padding:2.5rem var(--gut)}
.sec-h{font-size:clamp(1.9rem,5vw,2.8rem);font-stretch:70%;font-weight:900;margin:0 0 1rem;line-height:1}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;min-height:44px;padding:.65rem 1.1rem;border-radius:999px;
  background:var(--ink);color:var(--paper);border:2px solid var(--ink);font:700 1rem/1.1 var(--f);font-stretch:90%;text-decoration:none;cursor:pointer}
.btn:hover{background:var(--blue);border-color:var(--blue);color:#fff}
.btn.ghost{background:transparent;color:var(--ink)}
.btn.ghost:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.btn.small{min-height:38px;padding:.45rem .85rem;font-size:.9rem}
.btn[disabled]{opacity:.5;cursor:wait}

/* learn */
.learn{list-style:none;display:grid;gap:1px;background:var(--line);border:1px solid var(--line);counter-reset:l}
.learn li{background:var(--paper);padding:1.2rem 1.2rem 1.4rem;counter-increment:l;display:flex;flex-direction:column;gap:.3rem}
.learn li::before{content:counter(l);font-weight:900;font-stretch:62%;font-size:2.4rem;line-height:1;color:var(--blue)}
.learn strong{font-size:1.3rem;font-stretch:80%}
@media (min-width:760px){.learn{grid-template-columns:repeat(4,1fr)}}

/* cards — each one a little riso poster */
.cards{list-style:none;display:grid;gap:1.25rem;grid-template-columns:minmax(0,1fr)}
@media (min-width:700px){.cards{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1080px){.cards{grid-template-columns:repeat(3,1fr)}}
.card a{display:flex;flex-direction:column;height:100%;padding:1.4rem 1.4rem 1.2rem;border:2px solid var(--ink);border-radius:var(--r);
  background:var(--card);color:var(--ink);text-decoration:none;position:relative;overflow:hidden;box-shadow:6px 6px 0 var(--spot);transition:transform .15s,box-shadow .15s}
.card a:hover{transform:translate(-2px,-2px);box-shadow:8px 8px 0 var(--spot)}
.card-name{overflow-wrap:anywhere;font-size:2.2rem;font-weight:900;font-stretch:62%;line-height:.95;margin:0 0 1rem}
.card-n{font-size:3.4rem;font-weight:900;font-stretch:62%;color:var(--blue);line-height:.9;margin:0;mix-blend-mode:multiply}
.card-nl{color:var(--grey);font-size:.95rem;margin:.2rem 0 1rem}
.card-k{font-weight:700;margin:0 0 .4rem}
.card-line{font-size:.97rem;margin:0 0 1.2rem;flex:1}
.card-cta{font-weight:700;text-decoration:underline;text-underline-offset:.2em;color:var(--blue)}

.split{display:grid;gap:1.25rem}
@media (min-width:900px){.split{grid-template-columns:repeat(3,1fr)}}
.panel{border-top:3px solid var(--ink);padding-top:1rem}
.panel .sec-h{font-size:1.8rem}
.stance{max-width:var(--wide)}
.stance p{font-size:1.2rem;max-width:var(--measure)}

/* ---------- playbook layout */
.pb-grid{max-width:var(--wide);margin:0 auto;padding:0 var(--gut) 4rem;display:block}
.toc{position:sticky;top:3.6rem;z-index:10;margin:0 calc(var(--gut)*-1) 1rem;background:var(--paper);border-bottom:1px solid var(--line)}
.toc details{padding:.5rem var(--gut)}
.toc summary{font-weight:700;cursor:pointer;list-style:none;display:flex;justify-content:space-between}
.toc summary::after{content:"+";font-weight:900}
.toc details[open] summary::after{content:"–"}
.toc ol{list-style:none;margin:.6rem 0 .4rem;columns:2;column-gap:1rem}
.toc a{display:block;padding:.3rem 0;color:var(--ink);text-decoration:none;font-size:.95rem;font-stretch:90%}
.toc a.on{color:var(--blue);font-weight:700}
@media (min-width:1000px){
  .pb-grid{display:grid;grid-template-columns:13rem minmax(0,var(--measure));gap:4rem;justify-content:center}
  .toc{top:5rem;align-self:start;margin:0;border:0;background:none}
  .toc details{padding:0}
  .toc summary{pointer-events:none;color:var(--grey);font-weight:600}
  .toc summary::after,.toc details[open] summary::after{content:none}
  .toc ol{columns:1;border-left:2px solid var(--line)}
  .toc a{padding:.32rem 0 .32rem .9rem;margin-left:-2px;border-left:2px solid transparent}
  .toc a.on{border-left-color:var(--spot)}
}
.sec{padding:2.5rem 0 1rem;border-top:1px solid var(--line)}
.sec:first-child{border-top:0;padding-top:0}

.s30{border:2px solid var(--ink);border-radius:var(--r);background:var(--card);padding:1.3rem 1.4rem;font-size:1.15rem;box-shadow:6px 6px 0 var(--spot)}

.stats{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem 1rem;margin:1.5rem 0}
.stat dt{font-weight:900;font-stretch:62%;font-size:clamp(2.6rem,9vw,4.2rem);line-height:.9;color:var(--blue)}
.stat dd{margin:.35rem 0 0;color:var(--grey);font-size:.95rem;line-height:1.35}

.timeline{list-style:none;border-left:3px solid var(--ink);margin-left:.4rem}
.timeline li{display:grid;gap:.15rem;padding:0 0 1rem 1.1rem;position:relative}
.timeline li::before{content:"";position:absolute;left:-.5rem;top:.45rem;width:.75rem;height:.75rem;border-radius:50%;background:var(--spot);border:2px solid var(--ink)}
.tl-d{font-weight:800;font-stretch:80%}
@media (min-width:640px){.timeline li{grid-template-columns:6.5rem 1fr;gap:1rem}}

.layers{list-style:none;display:grid;gap:.6rem}
.layer{display:grid;gap:.2rem;padding:.9rem 1rem;border-left:6px solid var(--blue);background:var(--card)}
.layer:nth-child(2){border-left-color:color-mix(in srgb,var(--blue) 50%,var(--spot))}
.layer:nth-child(3){border-left-color:var(--spot)}
.caveat{margin-top:1.4rem;padding:1rem 1.1rem;border:1.5px dashed var(--grey);border-radius:var(--r);color:var(--grey);font-size:.98rem}

.tdl{display:grid;gap:.9rem;margin:0 0 1rem}
.tdl dt,.fronts dt,.roles dt,.rules dt,.limits dt{font-weight:800;font-stretch:85%}
.tdl dd,.fronts dd,.roles dd,.rules dd,.limits dd{margin:.15rem 0 0}
.fronts{display:grid;gap:1px;background:var(--ink);border:2px solid var(--ink);margin:0 0 1rem}
.fronts div{background:var(--card);padding:1rem 1.1rem}
.fronts dt{font-size:1.25rem;font-weight:900;font-stretch:70%}
@media (min-width:700px){.fronts{grid-template-columns:repeat(3,1fr)}}
.roles{display:grid;gap:1rem}
@media (min-width:640px){.roles{grid-template-columns:1fr 1fr}}
.rules{display:grid;gap:1rem}
@media (min-width:640px){.rules{grid-template-columns:1fr 1fr}}
.rules div{padding-top:.6rem;border-top:3px solid var(--ink)}
.limits{display:grid;gap:1rem}
.limits div{padding:.9rem 1rem;background:var(--ink);color:var(--paper);border-radius:var(--r)}

.steps,.cycle,.formula{list-style:none;counter-reset:s;display:grid;gap:.7rem}
.steps li,.cycle li,.formula li{counter-increment:s;display:grid;grid-template-columns:2.4rem 1fr;gap:.2rem .7rem;align-items:start}
.steps li::before,.cycle li::before,.formula li::before{content:counter(s);grid-row:span 2;width:2.2rem;height:2.2rem;border-radius:50%;
  background:color-mix(in srgb,var(--spot) 45%,#fff);color:var(--ink);font-weight:900;display:grid;place-items:center;font-stretch:80%}
.cycle strong,.formula strong,.steps strong{font-stretch:85%}
.cycle span,.formula span,.steps span{grid-column:2}
@media (min-width:700px){.cycle{grid-template-columns:1fr 1fr;gap:1rem 2rem}}
.loop{font-weight:800;font-stretch:80%;color:var(--blue);display:flex;align-items:center;gap:.5rem}
.loop::before{content:"↺";font-size:1.6rem;line-height:1}

.rhythm{list-style:none;display:grid;gap:.4rem}
.rhythm li{display:grid;grid-template-columns:5.5rem 1fr;gap:.8rem;padding:.55rem 0;border-bottom:1px solid var(--line)}
.r-t{font-weight:900;font-stretch:70%;font-size:1.15rem;color:var(--blue)}
.note{color:var(--grey);font-size:.97rem}

.bul{list-style:none;display:grid;gap:.45rem}
.bul li{padding-left:1.3rem;position:relative}
.bul li::before{content:"";position:absolute;left:0;top:.62em;width:.6rem;height:.6rem;background:var(--spot);border-radius:2px}
.bul.ticks li::before{background:var(--blue);border-radius:50%}

.stack{list-style:none;display:grid;gap:.8rem}
.tool{border:1.5px solid var(--ink);border-radius:var(--r);padding:1rem 1.1rem;background:var(--card)}
.tool-h{display:flex;justify-content:space-between;gap:1rem;align-items:baseline;margin-bottom:.3rem}
.tool p{margin:0}
.cost{font-size:.85rem;font-weight:700;background:var(--paper);border:1px solid var(--line);border-radius:999px;padding:.15rem .55rem;white-space:nowrap}
.swap{margin-top:.6rem!important;padding:.55rem .75rem;background:color-mix(in srgb,var(--spot) 18%,var(--card));border-radius:6px;font-weight:600;font-size:.95rem}
.logcols{font-weight:600}

.msg{background:var(--card);border:2px solid var(--ink);border-radius:16px 16px 16px 3px;padding:1rem 1.15rem;box-shadow:6px 6px 0 var(--spot);max-width:34rem;margin:.5rem 0 1.2rem}
.msg p{margin:0;white-space:pre-wrap}
.msg.big{min-height:12rem;font-size:1.05rem}

/* country panel */
.country-panel{margin:1.5rem 0;padding:1rem 1.1rem;border:2px dashed var(--ink);border-radius:var(--r)}
.country-panel.on{border-style:solid;background:var(--card)}
.cp-hint{margin:0;display:flex;flex-wrap:wrap;gap:.6rem;align-items:center}
.cp-title{font-size:1.4rem;font-weight:900;font-stretch:70%;margin:0 0 .6rem;display:flex;gap:.6rem;align-items:center;flex-wrap:wrap}
.cp-grid{display:grid;gap:.8rem}
@media (min-width:640px){.cp-grid{grid-template-columns:1fr 1fr}}
.cp-grid h5{margin:0 0 .25rem;font-size:.95rem;font-stretch:90%}
.cp-grid p{margin:0}
.pills{display:flex;flex-wrap:wrap;gap:.35rem;list-style:none;margin:0}
.pills li{border:1.5px solid var(--ink);border-radius:999px;padding:.1rem .6rem;font-size:.9rem;font-weight:600}
.pills li:first-child{background:color-mix(in srgb,var(--spot) 38%,#fff)}
.law{margin-top:1.4rem;border-top:3px solid var(--ink);padding-top:.8rem}
.law ul{list-style:none;display:grid;gap:.7rem}
.law li strong{display:block;font-stretch:85%}

/* practice: generator */
.gen-grid{display:grid;gap:1.4rem}
@media (min-width:860px){.gen-grid{grid-template-columns:1fr 1fr}}
.gen-form{display:flex;flex-wrap:wrap;gap:.8rem}
.field{display:flex;flex-direction:column;gap:.3rem;width:100%;border:0;padding:0;margin:0}
.field.half{width:calc(50% - .45rem)}
@media (max-width:480px){.field.half{width:100%}}
.field>span,.field legend{font-weight:700;font-size:.92rem;font-stretch:90%}
input,select,textarea{font:inherit;font-size:1rem;color:var(--ink);background:var(--card);border:1.5px solid var(--ink);border-radius:8px;padding:.6rem .7rem;width:100%;min-height:44px}
textarea{resize:vertical}
.seg{display:flex;flex-direction:row;flex-wrap:wrap;gap:.4rem 1rem;align-items:center}
.seg legend{width:100%;margin-bottom:.3rem}
.seg label{display:flex;gap:.4rem;align-items:center}
.seg input,.check input,.opt input,.phase input{width:auto;min-height:0}
.out-h{font-weight:700;margin:0}

/* scenarios */
.scen-box{border:2px solid var(--ink);border-radius:var(--r);background:var(--card);padding:1.2rem}
.scen-step{color:var(--grey);font-weight:700;font-size:.9rem;margin:0 0 .5rem}
.scen-s{font-size:1.2rem;font-weight:700;font-stretch:92%;line-height:1.35;margin:0 0 1rem}
.scen-o{display:grid;gap:.5rem;margin:0 0 1rem}
.scen-o button{text-align:left;font:inherit;color:var(--ink);background:var(--paper);border:1.5px solid var(--ink);border-radius:8px;padding:.75rem .9rem;cursor:pointer;min-height:44px}
.scen-o button:hover:not([disabled]){background:#fff;border-color:var(--blue)}
.scen-o button.ok{background:color-mix(in srgb,var(--ok) 14%,#fff);border-color:var(--ok)}
.scen-o button.no{background:color-mix(in srgb,var(--no) 10%,#fff);border-color:var(--no)}
.scen-o button[disabled]{cursor:default}
.scen-fb{padding:.8rem .9rem;border-left:5px solid var(--ok);background:var(--paper);margin:0 0 1rem}
.scen-fb.no{border-left-color:var(--no)}

/* plan */
.progress{display:flex;gap:1rem;align-items:center;flex-wrap:wrap;position:sticky;top:calc(var(--hdr,64px) + 2.6rem);background:var(--paper);padding:.6rem 0;z-index:5}
@media (min-width:1000px){.progress{top:var(--hdr,64px)}}
.progress p{margin:0;font-weight:700}
.bar{flex:1;min-width:10rem;height:14px;border:2px solid var(--ink);border-radius:999px;overflow:hidden;background:var(--card)}
.bar span{display:block;height:100%;width:0;background:var(--spot);transition:width .25s}
.phases{list-style:none}
.phase h3{margin-top:1.6rem}
.phase ul{list-style:none;display:grid;gap:.3rem}
.phase label{display:flex;gap:.7rem;align-items:flex-start;padding:.45rem .2rem;cursor:pointer;border-radius:6px}
.phase label:hover{background:var(--card)}
.phase input{appearance:none;flex:none;width:1.4rem;height:1.4rem;border:2px solid var(--ink);border-radius:5px;background:var(--card);margin-top:.12rem;display:grid;place-items:center;cursor:pointer;padding:0}
.phase input:checked{background:color-mix(in srgb,var(--spot) 45%,#fff)}
.phase input:checked::after{content:"✓";font-weight:900;font-size:.95rem;line-height:1;color:var(--ink)}
.phase input:checked+span{text-decoration:line-through;text-decoration-thickness:2px;color:var(--grey)}

/* quiz */
.q{border:0;padding:0;margin:0 0 1.6rem}
.q legend{font-weight:800;font-stretch:90%;font-size:1.1rem;margin-bottom:.6rem;line-height:1.35}
.opt{display:flex;gap:.6rem;align-items:flex-start;padding:.55rem .7rem;border:1.5px solid var(--line);border-radius:8px;margin-bottom:.4rem;cursor:pointer;background:var(--card)}
.opt:hover{border-color:var(--ink)}
.opt input{margin-top:.2rem;accent-color:var(--blue)}
.opt input,.check input,.phase input{flex:none;width:1.15em;height:1.15em}
.opt.ok{border-color:var(--ok);background:color-mix(in srgb,var(--ok) 12%,#fff)}
.opt.no{border-color:var(--no);background:color-mix(in srgb,var(--no) 8%,#fff)}
.why{margin:.4rem 0 0;padding:.7rem .9rem;background:var(--paper);border-left:4px solid var(--blue)}
.score{font-weight:800;margin:0}

/* people, voices */
.people{list-style:none;display:grid;gap:1rem}
@media (min-width:640px){.people{grid-template-columns:1fr 1fr}}
.people li{border-top:3px solid var(--ink);padding-top:.7rem}
.people p{margin:0 0 .3rem}
.who{font-weight:900;font-stretch:75%;font-size:1.25rem}
.who.big{font-size:2rem}
.role{color:var(--grey);font-weight:600;font-size:.95rem}
.src{font-size:.9rem}
.voices{list-style:none;display:grid;gap:1.4rem}
.voices blockquote{margin:0;font-size:1.2rem;font-stretch:92%;font-weight:600;line-height:1.4;padding-left:1rem;border-left:5px solid var(--spot)}
.voices blockquote p{margin:0}
.cite{margin:.4rem 0 0 1.3rem;color:var(--grey);font-size:.92rem}

.two{display:grid;gap:1.5rem}
@media (min-width:760px){.two{grid-template-columns:1fr 1fr}}
.two h3{margin-top:0}
.swaplist div{padding:.7rem .9rem;border:1.5px solid var(--ink);border-radius:8px;background:var(--card)}

.srcs{list-style:none;display:grid;gap:.45rem;font-size:.97rem}
.end{padding-top:2rem}
.next{margin-top:1.4rem;font-weight:700}

/* compare */
.cmp-wrap{max-width:var(--wide);margin:0 auto 4rem;padding:0 var(--gut);overflow-x:auto;-webkit-overflow-scrolling:touch}
.cmp{border-collapse:separate;border-spacing:.9rem 0;margin:0 -.9rem;font-size:.97rem;table-layout:auto;width:calc(100% + 1.8rem)}
.cmp th,.cmp td{text-align:left;vertical-align:top}
.cmp thead th{border-bottom:4px solid var(--spot);font-size:1.4rem;font-weight:900;font-stretch:65%;line-height:1;padding:.2rem 0 .6rem}
.cmp thead th a{color:var(--ink);text-decoration:none;display:block}
.cmp thead th .muted{display:block;font-size:.8rem;font-weight:600;font-stretch:90%;margin-top:.3rem}
.cmp tr.ax th{font-weight:800;font-stretch:78%;font-size:1.05rem;color:var(--blue);padding:1.3rem 0 .35rem;border-top:2px solid var(--ink)}
.cmp tr.vals td{padding:0 0 .4rem;line-height:1.45}
.cmp td::before{content:attr(data-label);display:none;font-weight:800;font-stretch:78%;font-size:.8rem;color:var(--grey);margin-bottom:.15rem}
@media (max-width:700px){
  .cmp{font-size:.9rem;border-spacing:.7rem 0;margin:0 -.7rem;width:calc(100% + 1.4rem)}
  .cmp thead th{font-size:1.1rem}
  .cmp td::before{display:block}
  .cmp th[data-pb],.cmp td[data-pb]{min-width:9.5rem}
}
/* coach */
.coach{max-width:var(--measure);margin:0 auto 4rem;padding:0 var(--gut)}
.coach-form,.coach-follow,.contact{display:flex;flex-wrap:wrap;gap:.9rem}
.coach-thread{margin:2rem 0}
.turn{margin:0 0 1.4rem}
.turn.me{background:var(--card);border:1.5px solid var(--line);border-radius:var(--r);padding:.8rem 1rem;font-size:.97rem;color:var(--grey);white-space:pre-wrap}
.turn.ai{border-left:5px solid var(--spot);padding-left:1.1rem}
.turn.ai h2,.turn.ai h3{font-size:1.35rem;font-stretch:80%;margin:1.4rem 0 .5rem}
.turn.ai ul,.turn.ai ol{padding-left:1.3rem}
.turn.ai li{margin-bottom:.35rem}
.typing{color:var(--grey);font-weight:700}
@media (prefers-reduced-motion:no-preference){.typing::after{content:"";display:inline-block;width:1.2em;animation:dots 1.2s steps(4) infinite;overflow:hidden;vertical-align:bottom}
@keyframes dots{0%{content:""}25%{content:"."}50%{content:".."}75%{content:"..."}}}

/* contact */
.contact{max-width:var(--measure);margin:0 auto 4rem;padding:0 var(--gut)}
.check{display:flex;gap:.6rem;align-items:flex-start}
.check input{margin-top:.35rem}
.hp{position:absolute;left:-9999px}
.form-status{width:100%;font-weight:700}

.prose{max-width:var(--measure);margin:0 auto 4rem;padding:0 var(--gut)}
.prose .sec-h{margin-top:2.4rem;font-size:2rem}
.author{border:2px solid var(--ink);border-radius:var(--r);padding:1.3rem;background:var(--card);box-shadow:6px 6px 0 var(--spot)}

.langs{list-style:none;display:grid;gap:.5rem;margin-top:2rem;font-size:1.3rem}

/* country dialog */
.country-dlg{border:2px solid var(--ink);border-radius:var(--r);padding:0;width:min(30rem,calc(100vw - 2rem));height:min(40rem,85vh);height:min(40rem,85dvh);max-height:none;overflow:hidden;background:var(--paper);color:var(--ink)}
.country-dlg[open]{display:flex;flex-direction:column}
.country-dlg::backdrop{background:rgba(28,31,74,.45)}
.country-in{display:flex;flex-direction:column;gap:.8rem;padding:1.1rem;flex:1 1 auto;min-height:0;margin:0}
.country-dlg h2:focus{outline:none}
.dlg-head{display:flex;justify-content:space-between;align-items:center}
.dlg-head h2{font-size:1.6rem;font-stretch:70%;font-weight:900}
.x{font:900 1.8rem/1 var(--f);background:none;border:0;cursor:pointer;color:var(--ink);width:44px;height:44px}
.country-list{list-style:none;overflow:auto;-webkit-overflow-scrolling:touch;margin:0;padding:0;flex:1 1 auto;min-height:6rem;border-top:1px solid var(--line)}
.country-list button{width:100%;text-align:left;font:inherit;background:none;border:0;border-bottom:1px solid var(--line);padding:.65rem .3rem;cursor:pointer;color:var(--ink);display:flex;justify-content:space-between;gap:.5rem}
.country-list button:hover,.country-list button:focus-visible{background:var(--card)}
.country-list button[aria-selected=true]{font-weight:800}
.country-list .meta{color:var(--grey);font-size:.85rem}

/* footer */
.foot{border-top:2px solid var(--ink);margin-top:2rem}
.foot-in{max-width:var(--wide);margin:0 auto;padding:2rem var(--gut) 3rem;font-size:.95rem;max-width:var(--wide)}
.foot-in p{max-width:var(--measure)}
.foot-brand{font-weight:900;font-stretch:62%;font-size:2.4rem;line-height:1;color:var(--blue)}

/* print */
@media print{
  .top,.toc,.foot,.country-dlg,.gen,.scen,.end,.btn,.country-panel{display:none!important}
  body{background:#fff;font-size:11pt}
  .pb-grid{display:block;padding:0}
  .sec{break-inside:auto;border:0}
  .ovp{font-size:60pt}
  .card a,.s30,.msg,.author{box-shadow:none}
  a{color:var(--ink)}
  .phase input{border-width:1px}
}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

/* hero figure: the case's headline number, printed as a second sheet */
.pb-hero{position:relative}
.hero-n{display:none}
@media (min-width:1180px){
  .hero-n{display:flex;flex-direction:column;align-items:flex-end;position:absolute;right:var(--gut);bottom:2.5rem;max-width:22rem;text-align:right;margin:0}
  .hn{position:relative;white-space:nowrap;font-weight:900;font-stretch:62%;font-size:9rem;line-height:.85;color:var(--spot);mix-blend-mode:multiply}
  .hn::after{content:attr(data-t);white-space:nowrap;position:absolute;left:-.03em;top:-.03em;color:var(--blue);mix-blend-mode:multiply;opacity:.9}
  .hnl{font-weight:700;font-stretch:85%;color:var(--grey);margin-top:.6rem}
}
.tool-h{flex-wrap:wrap;gap:.3rem .8rem}
.cost{white-space:normal}
.pb-body,.pb-body *{min-width:0;overflow-wrap:break-word}
.srcs a{overflow-wrap:anywhere}
.page-head .ovp{margin-bottom:.35em}
.wrap{max-width:var(--wide);margin:0 auto 4rem;padding:0 var(--gut)}
.wrap>.contact{max-width:var(--measure);margin:0;padding:0}
.coach,.prose{max-width:var(--wide)}
.coach>*,.prose>*{max-width:var(--measure)}
.cmp-pick-l{font-weight:700;margin:1.5rem 0 .5rem}
.cmp-pick{display:flex;flex-wrap:wrap;gap:.45rem}
.pbchip{max-width:none}
.pbchip[aria-pressed=true]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.pbchip[aria-pressed=true] .dot{background:var(--spot)}
@media (min-width:701px){.cmp th[data-pb],.cmp td[data-pb]{min-width:12rem}}
.cmp [data-off]{display:none}
.cl-short{display:none}
@media (max-width:640px){.cl-long{display:none}.cl-short{display:inline}.country-chip{max-width:none}.langsel select{max-width:none}}
.builtby{display:flex;flex-wrap:wrap;align-items:center;gap:1rem;margin:2.4rem 0;padding:1rem 1.2rem;border:2px solid var(--ink);border-radius:var(--r);background:var(--card);box-shadow:6px 6px 0 var(--spot)}
.builtby p{margin:0;font-size:1.2rem}
/* library */
.lib-filters{display:flex;flex-wrap:wrap;gap:.8rem;max-width:var(--measure)}
.field.third{width:calc(33.33% - .55rem)}
@media (max-width:560px){.field.third{width:100%}}
.lib-count{font-weight:700;margin:1rem 0}
.res-list{list-style:none;display:grid;gap:1rem;max-width:var(--measure)}
.res{border-top:2px solid var(--ink);padding-top:.7rem}
.res>a{font-weight:800;font-stretch:88%;font-size:1.1rem}
.res-meta{color:var(--grey);font-size:.9rem;margin:.2rem 0 .3rem}
.res p{margin:0 0 .3rem}
.orgs{max-width:var(--wide)}
@media (min-width:900px){.orgs{grid-template-columns:repeat(3,1fr)}}
.foot-by{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem .7rem;font-size:1.05rem}

[hidden]{display:none!important}
.ovp{overflow-wrap:anywhere;hyphens:manual;padding-bottom:.1em}
.toc details[open] ol{max-height:55vh;overflow:auto}
@media (min-width:1000px){.toc details ol{display:block!important;max-height:none}.toc summary{cursor:default}}
.country-list .empty{padding:.8rem .3rem;color:var(--grey)}
.country-list button[aria-pressed=true]{font-weight:800}
.country-list .sugg{background:var(--card)}
.dlg-foot{display:flex;justify-content:space-between;gap:.5rem;flex-wrap:wrap}
.q.unanswered legend{color:var(--no)}
.scen-step:focus{outline:none}

html:not(.js) .top{flex-wrap:wrap}
html:not(.js) .topnav{display:flex;flex-wrap:wrap;gap:.5rem 1rem;width:100%;order:3}
html:not(.js) .menu-btn,html:not(.js) .country-chip{display:none}
.nojs-langs{display:flex;gap:.5rem;font-weight:700}

/* coach plan output */
.turn.ai.has-plan{border-left:0;padding-left:0}
.plan-out{display:grid;gap:1.6rem}
.po-head{border:2px solid var(--ink);border-radius:var(--r);background:var(--card);padding:1.3rem 1.4rem;box-shadow:6px 6px 0 var(--spot)}
.po-kicker{margin:0 0 .6rem;font-weight:700;color:var(--grey);display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}
.pbchip.on{background:var(--ink);color:var(--paper);text-decoration:none}
.pbchip.on .dot{background:var(--spot)}
.po-headline{font-weight:900;font-stretch:68%;font-size:clamp(1.7rem,4.6vw,2.5rem);line-height:1.02;margin:0}
.po-why{margin:.7rem 0 0;color:var(--grey)}
.po-sec h3{margin:0 0 .7rem;font-size:1.35rem;font-stretch:75%;font-weight:900}
.po-two{display:grid;gap:1.4rem}
@media (min-width:720px){.po-two{grid-template-columns:1fr 1fr}}
.po-tools{list-style:none;display:grid;gap:.7rem;grid-template-columns:repeat(auto-fill,minmax(14rem,1fr))}
.po-tools li{display:flex;flex-direction:column;gap:.25rem;border:1.5px solid var(--ink);border-radius:var(--r);padding:.8rem .9rem;background:var(--card)}
.po-fn{align-self:flex-start;font-size:.78rem;font-weight:800;font-stretch:85%;padding:.1rem .55rem;border-radius:999px;background:color-mix(in srgb,var(--spot) 38%,#fff)}
.po-tools strong{font-stretch:85%;font-size:1.05rem}
.po-tools li>span:last-child{font-size:.93rem;color:var(--grey)}
.po-team{list-style:none;display:grid;gap:.6rem}
.po-team li{display:grid;gap:.1rem;padding-left:.8rem;border-left:4px solid var(--blue)}
.po-rhythm{list-style:none;display:grid;gap:.1rem}
.po-rhythm li{display:grid;grid-template-columns:5.5rem 1fr;gap:.7rem;padding:.45rem 0;border-bottom:1px solid var(--line)}
.po-missions{list-style:none;counter-reset:m;display:grid;gap:1.2rem}
@media (min-width:900px){.po-missions{grid-template-columns:repeat(3,1fr)}}
.po-missions>li{counter-increment:m;display:flex;flex-direction:column}
.po-missions>li .msg{flex:1;margin:.5rem 0 .7rem;max-width:none}
.po-mt{font-weight:900;font-stretch:75%;font-size:1.2rem;margin:0;display:flex;gap:.5rem;align-items:baseline}
.po-mt::before{content:counter(m);display:inline-grid;place-items:center;width:1.8rem;height:1.8rem;border-radius:50%;background:color-mix(in srgb,var(--spot) 45%,#fff);font-size:1rem;flex:none}
.po-meta{display:flex;flex-wrap:wrap;gap:.2rem .9rem;margin:.3rem 0 0;font-size:.88rem;color:var(--grey);font-weight:600}
.po-weeks{list-style:none;display:grid;gap:0;border-left:3px solid var(--ink);margin-left:.4rem}
.po-weeks>li{position:relative;padding:0 0 1.1rem 1.2rem}
.po-weeks>li::before{content:"";position:absolute;left:-.55rem;top:.3rem;width:.8rem;height:.8rem;border-radius:50%;background:var(--spot);border:2px solid var(--ink)}
.po-wl{font-weight:900;font-stretch:75%;font-size:1.1rem;margin:0}
.po-wf{margin:.1rem 0 .3rem;font-weight:600}
.po-weeks ul{margin:0;padding-left:1.1rem}
.po-check{list-style:none;display:grid;gap:.35rem}
.po-check label{display:flex;gap:.6rem;align-items:flex-start;cursor:pointer}
.po-check input{width:auto;min-height:0;margin-top:.3rem;accent-color:var(--blue)}
.po-risks{list-style:none;display:grid;gap:.6rem}
.po-risks li{display:grid;grid-template-columns:1fr auto 1fr;gap:.8rem;align-items:start;padding:.7rem .9rem;background:var(--card);border-radius:var(--r);border:1px solid var(--line)}
.po-risk{font-weight:700}
.po-arrow{font-weight:900;color:var(--blue)}
@media (max-width:560px){.po-risks li{grid-template-columns:1fr}.po-arrow{display:none}}
@media print{.coach-page .page-head,.coach-form,.coach-follow,.turn.me,.po-actions,.po-missions .row{display:none!important}.po-head{box-shadow:none}.coach>*{max-width:none}}
.coach>.coach-thread{max-width:62rem}
.turn.ai .plan-out ul,.turn.ai .plan-out ol{padding-left:0}
.turn.ai .plan-out .po-weeks ul{padding-left:1.1rem}
.turn.ai .plan-out li{margin-bottom:0}

/* stickers */
.sticker img{display:block;width:100%;height:auto;filter:drop-shadow(2px 3px 0 rgba(28,31,74,.18))}
.card a{padding-top:1.4rem}
.card-st{position:absolute;right:.6rem;top:.6rem;width:5.8rem;pointer-events:none;z-index:1}
.card:has(.card-st) .kicker,.card:has(.card-st) .card-name{padding-right:5.2rem}
.card-name.long{font-size:1.75rem;overflow-wrap:normal}
.hero-st{display:block;width:8.5rem;margin:0 0 .6rem}
@media (min-width:1180px){.hero-st{position:absolute;right:var(--gut);top:2rem;width:13rem;margin:0}}
@media (prefers-reduced-motion:no-preference){.card a:hover .card-st{transform:rotate(-4deg) scale(1.04);transition:transform .2s}}

.stamp{transform:rotate(-3deg);transform-origin:0 100%;margin:.5rem 0 1.4rem}
@media (min-width:1180px){.hn{padding-bottom:.14em}}
/* home */
.home-hero{position:relative}
.home-h1{font-weight:500;font-size:clamp(1.25rem,2.5vw,1.6rem);line-height:1.4;max-width:40rem;margin:0 0 1.2rem}
.home-hero .kicker{margin-bottom:.4rem}
.news{margin:2rem 0 0;border:2px solid var(--ink);border-radius:var(--r);background:var(--card);padding:1rem 1.1rem;display:grid;gap:.5rem;max-width:34rem;box-shadow:6px 6px 0 var(--blue)}
.news-h{font-weight:900;font-stretch:72%;font-size:1.35rem;line-height:1.1;margin:0 0 .2rem}
.news-l{font-weight:700;color:var(--ink);text-decoration:none;display:flex;gap:.5rem;align-items:baseline}
.news-l::before{content:"";flex:none;width:.7rem;height:.7rem;border-radius:50%;background:var(--spot);transform:translateY(.05rem)}
.news-l:hover{text-decoration:underline;color:var(--blue)}
@media (min-width:1180px){.news{position:absolute;right:var(--gut);top:clamp(2.5rem,7vw,5.5rem);width:22rem;margin:0}.home-hero .home-h1{max-width:calc(100% - 25rem)}}
@media (max-width:700px){.learn{grid-template-columns:1fr 1fr}.learn li span{display:none}.learn li{padding:.9rem}}
/* playbook */
.tomorrow{margin-top:1.4rem;border:2px solid var(--ink);border-radius:var(--r);background:var(--card);padding:1.1rem 1.3rem;box-shadow:6px 6px 0 var(--blue)}
.tomorrow h3{margin:0 0 .7rem}
.tomorrow .steps{margin-bottom:1rem}
details.more{margin-top:1rem}
details.more>summary{cursor:pointer;font-weight:700;color:var(--blue);list-style:none;display:inline-flex;gap:.4rem;align-items:center;min-height:44px}
details.more>summary::before{content:"+";font-weight:900}
details.more[open]>summary::before{content:"–"}
details.more>summary::-webkit-details-marker,.phase summary::-webkit-details-marker{display:none}
.phase summary{cursor:pointer;list-style:none;display:flex;gap:.6rem;align-items:baseline}
.phase summary h3{display:inline;margin:1.4rem 0 .4rem}
.phase summary::after{content:"+";font-weight:900;color:var(--blue);margin-left:auto}
.phase details[open] summary::after{content:"–"}
.law summary{cursor:pointer;font-weight:800;font-stretch:85%;font-size:1.15rem;list-style:none;min-height:44px;display:flex;align-items:center;gap:.5rem}
.law summary::before{content:"+";color:var(--blue);font-weight:900}
.law[open] summary::before{content:"–"}
.tag{display:inline-block;font-size:.75rem;font-weight:800;padding:.05rem .45rem;border-radius:999px;border:1.5px solid var(--grey);color:var(--grey);margin-right:.35rem;vertical-align:.1em}
.cp-data{margin:.8rem 0 0;font-size:.85rem;color:var(--grey)}
@media (max-width:999px){.toc{position:sticky;top:var(--hdr,56px);z-index:15}}
@media (max-width:1179px){.hero-n{display:block;margin:0 0 1rem}.hn{display:block;font-weight:900;font-stretch:62%;font-size:3.5rem;line-height:.9;color:var(--blue)}.hnl{display:block;color:var(--grey);font-weight:700}}
@media (max-width:700px){.gen-grid{display:flex;flex-direction:column}.gen-out{order:-1;position:sticky;top:calc(var(--hdr,56px) + 3rem);z-index:2;background:var(--paper);padding-bottom:.5rem}.gen-out .msg{max-height:30vh;overflow:auto;margin-bottom:.6rem}}
/* language disclosure */
.langsel{position:relative}
.langsel>summary{list-style:none;cursor:pointer;font:600 .875rem var(--f);border:1.5px solid var(--ink);border-radius:999px;padding:.45rem .7rem;min-height:36px;display:flex;align-items:center;gap:.3rem}
.langsel>summary::-webkit-details-marker{display:none}
.langsel>summary::after{content:"▾";font-size:.7rem}
.langsel ul{list-style:none;position:absolute;right:0;top:calc(100% + .4rem);background:var(--paper);border:2px solid var(--ink);border-radius:var(--r);padding:.4rem;min-width:12rem;z-index:30;box-shadow:4px 4px 0 var(--spot)}
.langsel li a{display:block;padding:.55rem .7rem;color:var(--ink);text-decoration:none;border-radius:6px}
.langsel li a:hover,.langsel li a[aria-current]{background:var(--card);font-weight:700}
@media (min-width:1180px){.home-hero .ovp{font-size:min(10rem,calc((min(100vw,72rem) - 2 * var(--gut) - 24rem) / 4.6))}}
.home-hero .ovp,.page-head .ovp{display:table}

/* ---- "Do outro lado": case studies, not models ---- */
.other-sec{border-top:2px dashed var(--ink);padding-top:2.2rem}
.other-sec .intro{max-width:46rem}
.card.other a{background:repeating-linear-gradient(135deg,transparent 0 10px,color-mix(in srgb,var(--ink) 5%,transparent) 10px 11px),var(--card);box-shadow:6px 6px 0 color-mix(in srgb,var(--ink) 30%,transparent)}
.card.other a:hover{box-shadow:8px 8px 0 color-mix(in srgb,var(--ink) 45%,transparent)}
.card.other .card-n{color:var(--ink)}
.other-flag{display:inline-block;margin:.2rem 0 .8rem;padding:.3rem .7rem;border:2px solid var(--ink);border-radius:999px;font-weight:800;font-size:.95rem;background:repeating-linear-gradient(135deg,var(--card) 0 8px,color-mix(in srgb,var(--ink) 9%,var(--card)) 8px 9px)}
.pb.other .ovp::after{color:#8B90A3}
.lessons{display:grid;gap:1.2rem;margin-top:1rem}
/* lessons: one readable column (3 columns were ~170px wide beside the TOC) */
.ls-col{border:2px solid var(--ink);border-radius:var(--r);background:var(--card);padding:1.1rem 1.2rem}
.ls-col h3{margin-top:0;font-size:1.25rem}
.ls-ok{box-shadow:6px 6px 0 var(--blue)}
.ls-never{box-shadow:6px 6px 0 #D7263D}
.ls-never h3{color:#B3122A}
.ls-counter{box-shadow:6px 6px 0 #00A95C}
.ls-col .tdl dt,.ls-col .tdl strong{font-weight:800}

/* ---- country picker v2 ---- */
.country-chip{display:inline-flex;align-items:center;gap:.4rem}
.country-chip .globe{flex:none}
.country-chip .dot{display:none}
.country-chip.set{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.dlg-why{margin:0 0 .9rem;font-size:.95rem;line-height:1.45;color:var(--ink)}
.dlg-now{display:flex;align-items:center;justify-content:space-between;gap:.6rem;flex-wrap:wrap;margin:0 0 .9rem;padding:.7rem .85rem;border:2px solid var(--ink);border-radius:10px;background:var(--card);box-shadow:4px 4px 0 var(--spot)}
.dlg-now p{margin:0;font-weight:700}
.country-list .meta.alt{color:var(--ink);font-weight:700;font-size:.8rem;background:color-mix(in srgb,var(--spot) 30%,#fff);border-radius:999px;padding:.1rem .5rem;align-self:center}
.toast{position:fixed;left:50%;bottom:1.2rem;transform:translate(-50%,1rem);opacity:0;z-index:60;width:min(34rem,calc(100vw - 2rem));
  background:var(--ink);color:var(--paper);border-radius:12px;padding:.85rem 1.1rem;box-shadow:6px 6px 0 var(--spot);transition:opacity .2s,transform .2s}
.toast.on{opacity:1;transform:translate(-50%,0)}
.toast p{margin:0}
.toast a{color:var(--paper);font-weight:800;text-underline-offset:.2em}
@media (prefers-reduced-motion:reduce){.toast{transition:none}}

/* ---- toolkit tabs ---- */
.tabs{display:flex;gap:.4rem;margin:1.4rem 0 .4rem;border-bottom:2px solid var(--ink);overflow-x:auto;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tabs [role=tab]{font:inherit;font-weight:800;font-stretch:85%;font-size:1.05rem;padding:.6rem 1rem;border:2px solid var(--ink);border-bottom:0;border-radius:10px 10px 0 0;background:transparent;color:var(--ink);cursor:pointer;white-space:nowrap;margin-bottom:-2px}
.tabs [role=tab][aria-selected=true]{background:var(--ink);color:var(--paper)}
.tabs [role=tab]:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.tabs:not([hidden]) ~ .tk-pane > h3:first-child{margin-top:1rem}

/* ---- quiz stepper ---- */
.quiz.stepper .q{animation:qin .22s ease-out}
.q-nav{display:flex;align-items:center;justify-content:space-between;gap:.6rem;margin:1rem 0}
.q-count{margin:0;font-weight:700;color:var(--grey)}
.q.answered .opt{cursor:default}
@keyframes qin{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:none}}

/* ---- voices: swipe on small screens ---- */
@media (max-width:640px){
  .voices{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:1rem;padding-bottom:.6rem}
  .voices li{flex:0 0 86%;scroll-snap-align:start}
}

/* ---- signature motion: the two riso inks come into register, the stamp lands ---- */
@media (prefers-reduced-motion:no-preference){
  .pb-hero .ovp::after,.home-hero .ovp::after{animation:register .7s cubic-bezier(.2,.8,.2,1) .1s both}
  .pb-hero .stamp,.home-hero .stamp{animation:stamp .45s cubic-bezier(.3,1.6,.5,1) .55s both}
  .pb-hero .sticker{animation:peel .5s ease-out .35s both}
  .quiz.stepper .q{animation:qin .22s ease-out}
}
@keyframes register{from{transform:translate(.16em,-.1em);opacity:.25}to{transform:none;opacity:1}}
@keyframes stamp{from{transform:rotate(-14deg) scale(1.7);opacity:0}to{transform:rotate(-3deg) scale(1);opacity:1}}
@keyframes peel{from{transform:rotate(-10deg) scale(.85);opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.quiz.stepper .q{animation:none}}
@media (max-width:640px){
  .tabs{gap:.25rem}
  .tabs [role=tab]{flex:1 1 0;padding:.55rem .4rem;font-size:.95rem;text-align:center}
  .pb .people:not(.orgs){display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:1rem;padding-bottom:.6rem}
  .pb .people:not(.orgs) li{flex:0 0 80%;scroll-snap-align:start}
}
.pb-hero,.home-hero{overflow-x:clip}

/* ---- moves (jogadas) on playbook pages ---- */
.moves{list-style:none;display:grid;gap:1.2rem;margin:1rem 0 0;padding:0}
@media (min-width:900px){.moves{grid-template-columns:repeat(2,1fr)}}
.move{border:2px solid var(--ink);border-radius:var(--r);background:var(--card);padding:1.1rem 1.2rem 1rem;box-shadow:6px 6px 0 var(--spot);display:flex;flex-direction:column}
.move h3{margin:0 0 .4rem;font-size:1.35rem;line-height:1.1}
.move > p{margin:0 0 .7rem}
.mv-when{margin:0 0 .7rem;display:grid;gap:.35rem;font-size:.95rem}
.mv-when div{display:grid;grid-template-columns:auto 1fr;gap:.5rem}
.mv-when dt{font-weight:800}
.mv-when dd{margin:0}
.move details{margin:0 0 .9rem;flex:1}
.move summary{cursor:pointer;font-weight:700;color:var(--blue)}
.mv-steps{margin:.6rem 0;padding-left:1.2rem}
.mv-steps li{margin:.25rem 0}
.mv-steps .wk{display:inline-block;font-size:.78rem;font-weight:800;background:color-mix(in srgb,var(--spot) 30%,#fff);border-radius:999px;padding:0 .45rem;margin-right:.25rem}
.kit-add{align-self:flex-start}
.kit-add .ka-on{display:none}
.kit-add[aria-pressed=true]{background:var(--spot);color:var(--ink);border-color:var(--ink)}
.kit-add[aria-pressed=true] .ka-on{display:inline}.kit-add[aria-pressed=true] .ka-off{display:none}
.kit-add[aria-pressed=true]::before{content:"✓ "}
.kit-bar{position:fixed;left:50%;bottom:1rem;transform:translateX(-50%);z-index:55;display:flex;align-items:center;gap:.8rem;
  background:var(--ink);color:var(--paper);border-radius:999px;padding:.45rem .5rem .45rem 1.1rem;box-shadow:5px 5px 0 var(--spot);max-width:calc(100vw - 2rem)}
.kit-bar p{margin:0;font-weight:700;font-size:.95rem;white-space:nowrap}
.kit-bar .btn{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.kbadge{display:inline-grid;place-items:center;min-width:1.3em;height:1.3em;margin-left:.3em;border-radius:999px;background:var(--blue);color:#fff;font-size:.75em;font-weight:800;padding:0 .3em;vertical-align:.1em}

/* ---- kit page ---- */
.kit{max-width:var(--wide);margin:0 auto;padding:0 var(--gut) 4rem}
.kit-sec{margin:2.4rem 0}
.kit-empty{border:2px dashed var(--ink);border-radius:var(--r);padding:1.6rem;text-align:left;max-width:40rem}
.kit-ctx{display:flex;flex-wrap:wrap;gap:1rem}
.kit-moves,.kit-team,.kit-tools,.kit-msgs{list-style:none;padding:0;margin:0;display:grid;gap:.7rem}
.kit-moves li,.kit-team li{display:flex;justify-content:space-between;align-items:center;gap:.8rem;flex-wrap:wrap;border:2px solid var(--ink);border-left:10px solid var(--spot);border-radius:10px;background:var(--card);padding:.6rem .8rem}
.kit-moves li div,.kit-team li div{display:flex;flex-direction:column;gap:.1rem;min-width:12rem;flex:1}
.kit-team input{font:inherit;padding:.45rem .6rem;border:1.5px solid var(--ink);border-radius:8px;background:var(--paper);min-width:10rem}
.kit-tools{grid-template-columns:repeat(auto-fill,minmax(15rem,1fr))}
.kit-tools li{border:2px solid var(--ink);border-radius:10px;background:var(--card);padding:.7rem .85rem;display:flex;flex-direction:column;gap:.2rem}
.kit-msgs{grid-template-columns:repeat(auto-fill,minmax(19rem,1fr))}
.kit-msgs .muted{margin:0 0 .2rem}
.kit-prog{font-weight:800}
.kit-cal{list-style:none;padding:0;margin:0;border-left:3px solid var(--ink);margin-left:.4rem}
.kc-w{position:relative;padding:0 0 1.1rem 1.2rem}
.kc-w::before{content:"";position:absolute;left:-.55rem;top:.35rem;width:.8rem;height:.8rem;border-radius:50%;background:var(--paper);border:3px solid var(--ink)}
.kc-w.dday::before{background:var(--blue)}
.kc-w h3{margin:0 0 .4rem;font-size:1.1rem}
.kc-w ul{list-style:none;padding:0;margin:0;display:grid;gap:.3rem}
.kc-w label{display:flex;gap:.5rem;align-items:flex-start;cursor:pointer;padding:.35rem .5rem;border-radius:8px;border-left:5px solid var(--spot);background:var(--card)}
.kc-w input{margin-top:.25rem;accent-color:var(--blue)}
.kc-w input:checked + span{text-decoration:line-through;opacity:.6}
.kc-w em{font-style:normal;font-size:.85rem}
@media print{.kit-export,.kit-bar,.kit-add,.kit-moves button{display:none!important}.kit-team input{border:0;border-bottom:1px solid #000;border-radius:0}}
.rest{border:2px dashed var(--ink);border-radius:var(--r);padding:1.1rem 1.2rem;background:var(--card)}.rest .layers li{border-left-color:var(--blue)}.rest .src{font-size:.85rem;margin-left:.3rem}
.lever-f{display:flex;flex-wrap:wrap;gap:.45rem;margin:1rem 0 1.4rem}
.lever-f .chip[aria-pressed=true]{background:var(--ink);color:var(--paper)}
.cat-g{margin:0 0 2.4rem}
.cat-h{font-size:1.5rem;font-stretch:85%;margin:0 0 .9rem;display:flex;align-items:baseline;gap:.5rem}
.cat-h .muted{font-size:1rem;font-weight:700}
.kc-w input[type=checkbox]{appearance:auto;-webkit-appearance:checkbox;width:1.15rem;height:1.15rem;min-width:0;flex:none;padding:0;margin:.2rem 0 0;border:0;box-shadow:none}
.kc-w label span{flex:1}
.kc-w em{display:block}
@media (max-width:640px){.mv-when div{grid-template-columns:1fr;gap:0}}
.kit-bar .btn{white-space:nowrap}
.stamp-note,.title-note{font-size:.9rem;line-height:1.4;color:var(--grey);max-width:36rem;margin:-.9rem 0 1.2rem}
.title-note{margin:.2rem 0 .8rem}
@media (min-width:1180px){.pb-hero:has(.hero-st) .ovp{max-width:calc(100% - 15rem)}}

/* ---- channels cheat sheets ---- */
.chn-toc{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:1rem}
.chn-toc .chip{text-decoration:none}
.chn-g{margin:2.2rem 0}
.chn-list{list-style:none;padding:0;margin:0;display:grid;gap:.8rem}
.chn details{border:2px solid var(--ink);border-radius:var(--r);background:var(--card)}
.chn details[open]{box-shadow:6px 6px 0 var(--blue)}
.chn>details>summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:minmax(10rem,14rem) 1fr auto;gap:.3rem 1.2rem;align-items:baseline;padding:.9rem 1.1rem}
.chn>details>summary::-webkit-details-marker{display:none}
.chn>details>summary::after{content:"+";font-weight:900;font-size:1.3rem;grid-column:3;grid-row:1}
.chn>details[open]>summary::after{content:"−"}
.chn-n{font-weight:900;font-stretch:85%;font-size:1.2rem}
.chn-b{color:var(--ink);opacity:.85}
.chn-mine{grid-column:1/-1;justify-self:start;font-size:.8rem;font-weight:800;background:var(--blue);color:#fff;border-radius:999px;padding:.1rem .6rem}
.chn.mine details{border-color:var(--blue)}
@media (max-width:640px){.chn>details>summary{grid-template-columns:1fr auto}.chn-b{grid-column:1/-1}}
.chn-body{padding:0 1.1rem 1.1rem;border-top:1.5px solid var(--line)}
.chn-body h3{font-size:1.05rem;margin:1.1rem 0 .4rem}
.chn-play{border-bottom:1.5px dashed var(--line);padding-bottom:.8rem;margin-bottom:.8rem}
.chn-dont .bul li::before{background:#D7263D}
.chn-facts{margin-top:.6rem}
.chn-used a{margin-right:.6rem}

/* ---- start from zero ---- */
.st-sec{margin:2.4rem 0}
.vtypes{list-style:none;padding:0;display:grid;gap:1rem}
@media (min-width:900px){.vtypes{grid-template-columns:repeat(2,1fr)}}
.vt{border:2px solid var(--ink);border-radius:var(--r);background:var(--card);padding:1rem 1.15rem}
.vt h3{margin:0 0 .4rem}
.vt h4{margin:.4rem 0 .2rem}
.vt-ex{display:flex;flex-wrap:wrap;gap:.35rem;margin:.6rem 0 0}
.vt-ex .chip{text-decoration:none;font-size:.85rem}
.st-c{margin:1.8rem 0}
.st-legal{border:2px dashed var(--ink);border-radius:10px;padding:.8rem 1rem;margin:0 0 1rem;background:var(--card);font-size:.95rem}
.st-legal h4{margin:0 0 .4rem}
.st-legal p{margin:.3rem 0}
.ex-list{list-style:none;padding:0;margin:0;display:grid;gap:.8rem}
@media (min-width:900px){.ex-list{grid-template-columns:repeat(2,1fr)}}
.ex{border-top:3px solid var(--ink);padding-top:.7rem}
.ex h4{margin:.2rem 0 .35rem;font-size:1.15rem}
.ex p{margin:0 0 .4rem}
.ex-k{font-size:.85rem;color:var(--grey);margin:0}
.ex .tag{display:inline-block;font-weight:800;color:var(--ink);background:color-mix(in srgb,var(--blue) 18%,#fff);border-radius:999px;padding:0 .5rem}
.ex .src{font-size:.85rem}
.risk-note{border:2px solid #B3122A;border-left-width:8px;border-radius:10px;background:#fff1f1;padding:.75rem .9rem;font-weight:600;color:#6b0a19;margin:.6rem 0 1rem}
.fd-ex{border:2px dashed var(--ink);border-radius:10px;background:var(--card);padding:.8rem 1rem;margin:1rem 0}
.fd-ex p{margin:.2rem 0}
.fd-list{list-style:none;padding:0;display:grid;gap:1rem}
.fd-list li{border-top:3px solid var(--ink);padding-top:.6rem}
.fd-list p{margin:.25rem 0}
.gloss div{scroll-margin-top:6rem}
.fund-hint{font-size:.95rem;margin:0 0 1rem;padding:.55rem .8rem;border-left:5px solid var(--blue);background:var(--card);border-radius:6px}

.topnav a{white-space:nowrap}
@media (min-width:1180px) and (max-width:1439px){.topnav{gap:.9rem}.cl-long{display:none}.cl-short{display:inline}}
.stat .kind{display:block;margin-top:.35rem;font-size:.75rem;color:var(--grey)}
.stat .kind::before{content:"";display:inline-block;width:.5em;height:.5em;border-radius:50%;margin-right:.35em;vertical-align:.05em;background:currentColor;opacity:.6}
.stat .k-official::before{background:var(--spot,#333);opacity:1}

/* QA fixes, 26 Oct night */
.pb-hero{container-type:inline-size}
/* single-word hero titles never break mid-word: size them to fit */
.pb-hero .ovp.one{overflow-wrap:normal;word-break:normal;font-size:min(13.5rem,calc(100cqi / (var(--n,9) * .5)))!important}
@media (min-width:1180px){.pb-hero:has(.hero-st) .ovp.one{font-size:min(13.5rem,calc((100cqi - 15rem) / (var(--n,9) * .5)))!important}}
@media (max-width:360px){.tools{gap:.3rem}.tools .chip{padding-left:.55rem;padding-right:.55rem}.menu-btn{padding:.5rem .65rem}}
/* ---- js-fix (kit import prompt, message variables, late weeks, quiz check, kit-bar clearance) ---- */
/* m5: the fixed kit bar must not cover the last footer line */
body:has(.kit-bar:not([hidden])){padding-bottom:80px}
/* M3 quiz: explicit "Check answer" */
.q-act{margin:.5rem 0 0}
/* M1 shared-kit prompt */
.kit-imp{border:2px solid var(--ink);border-radius:var(--r,14px);background:var(--card);box-shadow:6px 6px 0 var(--spot);padding:1.1rem 1.2rem;margin:1.4rem 0 0;max-width:46rem}
.kit-imp .sec-h{margin:0 0 .4rem}
.kit-imp .sec-h:focus{outline:none}
.kit-imp p{margin:0 0 .8rem}
.kit-imp-cc{border-top:1.5px solid var(--line);margin-top:1rem;padding-top:.9rem}
.kit-imp-cc p{margin:0 0 .6rem}
/* M5 message variables */
.kit-vars{margin:0 0 1.2rem}
.kit-vars>p{width:100%;margin:0}
@media (max-width:700px){.kit-vars .field.third{width:calc(50% - .5rem)}}
@media (max-width:420px){.kit-vars .field.third{width:100%}}
mark.kit-blank{background:color-mix(in srgb,var(--spot) 28%,#fff);color:var(--ink);border:1.5px dashed var(--ink);border-radius:4px;padding:0 .2em;font-weight:700}
@media print{.kit-vars{display:none}mark.kit-blank{background:none}}
/* M2 calendar: weeks already gone */
.kc-w.late::before{background:var(--no);border-color:var(--no)}
.kc-late{display:inline-block;font-size:.8rem;font-weight:800;color:#fff;background:var(--no);border-radius:999px;padding:.05rem .55rem;vertical-align:.12em;margin-left:.2rem}
.kc-w.past>h3{opacity:.65}

/* ===== Creative pass, 26 Oct night: read in layers ===== */
/* folds: every playbook chapter shows its title and one line; the rest opens on demand */
.fold{padding:0;border-top:2px solid var(--ink)}
.fold-d>summary{list-style:none}
.fold-d>summary::-webkit-details-marker{display:none}
.fold-s{display:grid;grid-template-columns:1fr auto;column-gap:1rem;align-items:center;cursor:pointer;padding:1.15rem 0;-webkit-tap-highlight-color:transparent}
.fold-s .sec-h{margin:0;grid-column:1;font-size:clamp(1.7rem,4.6vw,2.6rem)}
.fold-t{grid-column:1;margin-top:.35rem;color:var(--grey);font-size:.98rem;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;max-width:var(--measure)}
.fold-d[open]>.fold-s .fold-t{display:none}
.fold-i{grid-column:2;grid-row:1 / span 2;position:relative;width:2.6rem;height:2.6rem;border:2px solid var(--ink);border-radius:50%;background:var(--spot);box-shadow:3px 3px 0 var(--ink);transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.fold-i::before,.fold-i::after{content:"";position:absolute;left:50%;top:50%;width:1rem;height:2.5px;margin:-1.25px 0 0 -.5rem;background:var(--ink);border-radius:2px}
.fold-i::after{transform:rotate(90deg);transition:transform .25s}
.fold-d[open]>.fold-s .fold-i{background:var(--card);transform:rotate(180deg)}
.fold-d[open]>.fold-s .fold-i::after{transform:rotate(0)}
.fold-s:hover .fold-i{box-shadow:4px 4px 0 var(--ink)}
.fold-s:focus-visible{outline:3px solid var(--blue);outline-offset:4px;border-radius:6px}
.fold-b{padding:.4rem 0 2.2rem}
@media (prefers-reduced-motion:no-preference){.fold-d[open]>.fold-b{animation:foldin .35s cubic-bezier(.2,.8,.2,1)}}
@keyframes foldin{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.fold-all{margin-top:.9rem;font:700 .85rem var(--f);background:none;border:1.5px solid var(--ink);border-radius:999px;padding:.35rem .8rem;color:var(--ink);cursor:pointer}
@media print{.fold-i,.fold-t,.fold-all{display:none!important}.fold-d>.fold-b{display:block!important}}

/* 30 seconds as cards you swipe */
.s30-cards{list-style:none;margin:.4rem calc(-1 * var(--gut)) 0;padding:.3rem var(--gut) 1rem;display:flex;gap:.9rem;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 var(--gut);-webkit-overflow-scrolling:touch;scrollbar-width:none}
.s30-cards::-webkit-scrollbar{display:none}
.s30-c{flex:0 0 min(84%,24rem);scroll-snap-align:start;position:relative;border:2px solid var(--ink);border-radius:var(--r);background:var(--card);padding:1.1rem 1.2rem 1.3rem;box-shadow:6px 6px 0 var(--spot);min-height:12rem;display:flex;flex-direction:column;gap:.5rem}
.s30-c p{margin:0;font-size:1.16rem;line-height:1.42;font-weight:500}
.s30-n{font-weight:900;font-stretch:62%;font-size:3.2rem;line-height:.8;color:var(--blue);text-shadow:.05em .04em 0 var(--spot)}
.s30-tools{margin:.2rem 0 0}
@media (min-width:900px){.s30-cards{display:grid;grid-template-columns:1fr 1fr;overflow:visible;margin:.4rem 0 0;padding:0 0 1rem}.s30-c{min-height:0}}
.rest-l .layer strong{display:block;margin-bottom:.15rem}
/* rails: on phones, sequences and decks scroll sideways instead of down */
@media (max-width:899px){
  .moves,.pb .timeline,.pb .cycle{display:flex!important;overflow-x:auto;scroll-snap-type:x mandatory;gap:.9rem;margin-left:calc(-1 * var(--gut));margin-right:calc(-1 * var(--gut));padding:.3rem var(--gut) 1.1rem;scroll-padding:0 var(--gut);scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .moves::-webkit-scrollbar,.pb .timeline::-webkit-scrollbar,.pb .cycle::-webkit-scrollbar{display:none}
  .move{flex:0 0 min(86%,23rem);scroll-snap-align:start}
  .pb .timeline{border-left:0!important;list-style:none}
  .pb .timeline li{flex:0 0 min(72%,18rem);scroll-snap-align:start;display:block!important;border:2px solid var(--ink);border-radius:var(--r);background:var(--card);padding:.9rem 1rem 1rem;margin:0!important;position:relative}
  .pb .timeline li::before{position:static!important;display:block;margin:0 0 .5rem}
  .pb .timeline .tl-d{display:block;font-size:1.25rem;margin-bottom:.25rem}
  .pb .cycle li{flex:0 0 min(62%,15rem);scroll-snap-align:start;border:2px solid var(--ink);border-radius:var(--r);background:var(--card);padding:.9rem 1rem;align-content:start}
  .rail-hint{display:block}
}
.rail-hint{display:none}
/* the sticker wall: every case slapped on the cover, like a laptop lid */
.wall{margin:1.4rem calc(-1 * var(--gut)) .6rem;overflow:hidden}
.wall ul{padding-left:calc(var(--gut) + .4rem)!important;padding-right:var(--gut)!important}
@media (min-width:900px){.wall{margin:2rem 0 0}.wall ul{padding-left:1rem!important}}
.wall ul{list-style:none;margin:0;padding:1.2rem .6rem 1.6rem;display:grid;grid-auto-flow:column;grid-template-rows:repeat(2,auto);gap:0;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.wall ul::-webkit-scrollbar{display:none}
.wall-i{width:6.6rem;margin:-.9rem -.6rem 0 0;transform:translateY(var(--dy)) rotate(var(--r));scroll-snap-align:start;position:relative;z-index:1}
.wall-i:nth-child(odd){margin-left:1.6rem}
.wall-i a{display:block;position:relative;text-decoration:none;color:var(--ink);border-radius:12px;outline-offset:2px}
.wall-i img{display:block;width:100%;height:auto;filter:drop-shadow(3px 4px 0 rgba(28,31,74,.28))}
.wall-l{position:absolute;left:50%;bottom:-.6rem;transform:translateX(-50%) rotate(calc(var(--r) * -1));white-space:nowrap;background:var(--ink);color:var(--paper);font:700 .72rem/1.2 var(--f);padding:.25rem .5rem;border-radius:6px;opacity:0;pointer-events:none;transition:opacity .15s}
.wall-l b{display:block;font-weight:900;font-stretch:75%;font-size:.95rem}
.wall-i a:hover,.wall-i a:focus-visible{z-index:5}
.wall-i:hover,.wall-i:focus-within{z-index:5}
.wall-i a:hover .wall-l,.wall-i a:focus-visible .wall-l{opacity:1}
@media (hover:hover){.wall-i a{transition:transform .18s cubic-bezier(.2,.8,.2,1)}.wall-i a:hover{transform:rotate(calc(var(--r) * -1)) scale(1.12)}}
@media (min-width:900px){
  .wall ul{grid-auto-flow:row;grid-template-rows:none;grid-template-columns:repeat(auto-fill,minmax(8.6rem,1fr));overflow:visible;padding:1.4rem 1rem 2rem}
  .wall-i{width:auto;margin:-1.1rem -.7rem 0 0}.wall-i:nth-child(odd){margin-left:0}
  .wall-i:nth-child(even){margin-top:.2rem}
}
@media (prefers-reduced-motion:no-preference){
  .js .wall-i{animation:slap .42s cubic-bezier(.3,1.5,.5,1) both;animation-delay:calc(.45s + var(--i) * 55ms)}
}
@keyframes slap{from{opacity:0;transform:translateY(calc(var(--dy) - 14px)) rotate(calc(var(--r) * 2.4)) scale(1.35)}to{opacity:1;transform:translateY(var(--dy)) rotate(var(--r)) scale(1)}}

/* home cards: on phones, each category is a deck you swipe */
@media (max-width:699px){
  .cat-g .cards,.other-sec .cards{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:.9rem;margin:0 calc(-1 * var(--gut));padding:.3rem var(--gut) 1.1rem;scroll-padding:0 var(--gut);scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .cat-g .cards::-webkit-scrollbar,.other-sec .cards::-webkit-scrollbar{display:none}
  .cat-g .card,.other-sec .card{flex:0 0 min(80%,20rem);scroll-snap-align:start}
  .card-line,.card-cta{display:none}
  .card a{padding:1.1rem 1.1rem 1rem}
}
/* start page: one tab per country */
.st-c{margin:0;border-top:1.5px solid var(--ink)}
.st-c:last-of-type{border-bottom:1.5px solid var(--ink)}
.st-cs{list-style:none;display:grid;grid-template-columns:1fr auto;column-gap:1rem;align-items:center;padding:.95rem 0;cursor:pointer}
.st-cs::-webkit-details-marker{display:none}
.st-cn{font-weight:900;font-stretch:70%;font-size:1.5rem;line-height:1.05}
.st-cc{grid-column:1;font-weight:700;font-size:.9rem;color:var(--blue)}
.st-cl{grid-column:1;font-size:.88rem;color:var(--grey);line-height:1.35}
.st-cs .fold-i{grid-column:2;grid-row:1 / span 3;width:2.2rem;height:2.2rem}
.st-c[open] .fold-i{background:var(--card);transform:rotate(180deg)}.st-c[open] .fold-i::after{transform:rotate(0)}
.st-cb{padding:.2rem 0 1.4rem}
/* library: filters in one row, entries scan fast */
.lib-filters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem}
.lib-filters .field{margin:0}
.lib-filters select{font-size:.9rem;padding-left:.5rem;padding-right:1.4rem}
@media (max-width:699px){.res p:not(.res-meta){display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}}
@media (min-width:900px){.res-list{max-width:none;grid-template-columns:1fr 1fr;gap:1.2rem 2rem}}
/* inner page heads: a stamp and three stickers instead of an empty half */
.page-head.ph-has-art{position:relative}
.ph-stamp{margin:.3rem 0 1rem}
.ph-art{display:none}
@media (min-width:1000px){
  .page-head.ph-has-art{min-height:22rem}
  .page-head.ph-has-art .lead{max-width:min(36rem,calc(100% - 22rem))}
  .ph-art{display:block;position:absolute;right:var(--gut);top:clamp(2.5rem,7vw,5rem);width:20rem;height:19rem}
  .ph-st{position:absolute;width:10.5rem}
  .ph-st img{width:100%;height:auto;display:block;filter:drop-shadow(3px 4px 0 rgba(28,31,74,.25))}
  .ph-st0{left:0;top:1.5rem;transform:rotate(-8deg);z-index:2}
  .ph-st1{right:0;top:0;transform:rotate(6deg)}
  .ph-st2{left:5rem;top:8.5rem;transform:rotate(-2deg);z-index:3}
}
@media (prefers-reduced-motion:no-preference) and (min-width:1000px){
  .ph-st{animation:peel .5s cubic-bezier(.3,1.4,.5,1) both}.ph-st0{animation-delay:.35s}.ph-st1{animation-delay:.5s}.ph-st2{animation-delay:.65s}
}
@media (min-width:1000px){
  .page-head.ph-has-art{max-width:var(--wide);margin-left:auto;margin-right:auto}
  .page-head.ph-has-art .ovp{max-width:calc(100% - 21rem)}
  .page-head.ph-has-art .row,.page-head.ph-has-art .lever-f{max-width:calc(100% - 21rem)}
}
/* design QA fixes (B1–B12) */
@media (min-width:1000px){.toc details[open] ol{max-height:none;overflow:visible;columns:auto}}
.langsel>summary{white-space:nowrap}
@media (max-width:360px){.country-chip .cl-short,.country-chip .cl-long{display:none}.country-chip{padding:.45rem .55rem}}
body:has(.kit-bar:not([hidden])) .toast{bottom:5.4rem}
.vt-ex .chip{max-width:none;white-space:normal}
.moves,.pb .timeline,.s30-cards{align-items:flex-start}
.s30-c{min-height:0}
@media (max-width:899px){
  .move details{flex:0 0 auto}
  .pb .cycle li{flex-basis:min(78%,17rem);grid-template-columns:1fr}
  .pb .cycle li::before{grid-row:auto;margin-bottom:.4rem}
  .pb .cycle span{grid-column:1}
}
@media (min-width:900px){.s30-cards{grid-template-columns:repeat(3,1fr)}.s30-cards:has(.s30-c:nth-child(4)){grid-template-columns:repeat(2,1fr)}}
.st-sec.fold{margin:0}
/* caveat folded to one line */
.caveat-d>summary{list-style:none;cursor:pointer;display:block;padding-right:1.6rem;position:relative}
.caveat-d>summary::-webkit-details-marker{display:none}
.caveat-d>summary::after{content:"+";position:absolute;right:0;top:0;font-weight:900;color:var(--ink)}
.caveat-d[open]>summary::after{content:"–"}
.caveat-d>summary strong{color:var(--ink)}
.caveat-d p{margin:.6rem 0 0}
/* other side lessons: "never copy" open, the rest on demand */
.ls-col{border:2px solid var(--ink);border-radius:var(--r);background:var(--card);padding:0 1rem;margin:0 0 .8rem}
.ls-s{list-style:none;display:grid;grid-template-columns:1fr auto auto;gap:.8rem;align-items:center;padding:.9rem 0;cursor:pointer}
.ls-s::-webkit-details-marker{display:none}
.ls-s h3{margin:0;font-size:1.3rem;font-stretch:75%}
.ls-n{font-weight:900;font-stretch:62%;font-size:1.6rem;color:var(--grey)}
.ls-s .fold-i{width:2.1rem;height:2.1rem}
.ls-col[open] .ls-s .fold-i{background:var(--card);transform:rotate(180deg)}.ls-col[open] .ls-s .fold-i::after{transform:rotate(0)}
.ls-col>.tdl{padding-bottom:1rem}
.ls-never{border-color:var(--no);box-shadow:5px 5px 0 var(--no)}
.ls-never .ls-s h3{color:var(--no)}
/* channels: a contact sheet of tiles; the open one takes the whole row */
.chn-list{grid-template-columns:repeat(auto-fill,minmax(min(100%,11rem),1fr));gap:.9rem;align-items:start}
.chn:has(details[open]){grid-column:1/-1}
.chn>details>summary{grid-template-columns:auto 1fr;grid-template-rows:auto auto;gap:.15rem .7rem;align-items:center;padding:.9rem .95rem 1rem}
.chn>details>summary::after{grid-column:2;grid-row:1;justify-self:end;align-self:start}
.chn-m{grid-row:1 / span 2;align-self:start;display:grid;place-items:center;width:2.6rem;height:2.6rem;border:2px solid var(--ink);border-radius:50%;background:var(--spot);box-shadow:3px 3px 0 var(--ink);font-weight:900;font-stretch:62%;font-size:1.5rem;line-height:1;color:var(--ink)}
.chn-g:nth-of-type(6n+2) .chn-m{background:#5EC8E5}.chn-g:nth-of-type(6n+3) .chn-m{background:#FFB000}.chn-g:nth-of-type(6n+4) .chn-m{background:#00A95C}.chn-g:nth-of-type(6n+5) .chn-m{background:#9D7AD2}.chn-g:nth-of-type(6n) .chn-m{background:#FF7477}
.chn-n{grid-column:2;grid-row:1;font-stretch:70%;font-size:1.25rem;line-height:1.05;padding-right:1.2rem}
.chn-b{grid-column:1 / -1;grid-row:3;font-size:.88rem;line-height:1.35;margin-top:.45rem;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.chn details[open] .chn-b{-webkit-line-clamp:unset;display:block}
.chn-mine{grid-column:1 / -1;grid-row:4}
@media (max-width:640px){.chn>details>summary{grid-template-columns:auto 1fr}.chn-b{grid-column:1 / -1}}
@media (max-width:420px){.chn-list{grid-template-columns:1fr 1fr;gap:.6rem}.chn>details>summary{padding:.75rem .7rem .85rem}.chn-n{font-size:1.08rem}.chn-b{font-size:.8rem}}
.chn-list>li{min-width:0}.chn-body{overflow-wrap:anywhere}
.chn-m{font-size:1.15rem;letter-spacing:-.02em}
/* sticker wall v2: one clean strip on phones, three tidy rows on desktop */
.wall{margin:1.2rem calc(-1 * var(--gut)) .2rem;overflow:visible}
.wall ul{display:flex!important;flex-wrap:nowrap;grid-template-rows:none;grid-template-columns:none;grid-auto-flow:initial;overflow-x:auto;overflow-y:hidden;scroll-snap-type:none;
  padding:1.3rem var(--gut) 1.5rem calc(var(--gut) + .4rem)!important;-webkit-mask-image:linear-gradient(90deg,#000 82%,transparent);mask-image:linear-gradient(90deg,#000 82%,transparent)}
.wall-i,.wall-i:nth-child(odd),.wall-i:nth-child(even){flex:0 0 6.2rem;width:6.2rem;margin:0 -1.05rem 0 0!important}
.wall-i:last-child{margin-right:0!important}
.wall-l{display:none}
@media (min-width:900px){
  .wall{margin:1.8rem 0 0}
  .wall ul{flex-wrap:wrap;overflow:visible;-webkit-mask-image:none;mask-image:none;padding:1rem 1.4rem 1.2rem 0!important;row-gap:.2rem}
  .wall-i,.wall-i:nth-child(odd),.wall-i:nth-child(even){flex-basis:7.4rem;width:7.4rem;margin:0 -1.15rem 0 0!important}
  .wall-l{display:block}
}
@media (prefers-reduced-motion:no-preference){.js .wall-i{animation-delay:calc(.35s + var(--i) * 40ms)}}
/* kit poster: the campaign at a glance */
.kit-poster{position:relative;border:2px solid var(--ink);border-radius:var(--r);background:var(--card);padding:1.1rem 1.2rem 1.2rem;box-shadow:8px 8px 0 var(--spot);margin:0 0 1.6rem;overflow:hidden}
.kit-poster::before{content:"";position:absolute;right:-3rem;top:-3rem;width:11rem;height:11rem;border-radius:50% 46% 52% 48%;background:var(--spot);opacity:.18;pointer-events:none}
.kp-k{margin:0 0 .3rem;font-family:"Marker",cursive;color:var(--spot);transform:rotate(-2deg);transform-origin:0 50%;font-size:1.1rem}
.kp-name{margin:0 0 1rem;font-size:clamp(2.2rem,8vw,3.6rem);overflow-wrap:anywhere}
.kp-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.8rem;align-items:start}
.kp-d b,.kp-c b{display:block;font-weight:900;font-stretch:62%;line-height:.85;color:var(--blue)}
.kp-d b{font-size:clamp(3rem,10vw,4.6rem);text-shadow:.04em .03em 0 var(--spot)}
.kp-c b{font-size:clamp(1.8rem,6vw,2.6rem)}
.kp-d span,.kp-c span{display:block;font-size:.8rem;font-weight:700;color:var(--grey);margin-top:.3rem;line-height:1.2}
@media (max-width:520px){.kp-row{grid-template-columns:1fr 1fr 1fr}.kp-d{grid-column:1 / -1}}
/* share buttons */
.sh-b{display:inline-grid;place-items:center;width:2.4rem;height:2.4rem;border:1.5px solid var(--ink);border-radius:50%;background:var(--card);color:var(--ink);cursor:pointer;padding:0;flex:none}
.sh-b:hover{background:var(--ink);color:var(--paper)}
.sh-b:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.fold-s{grid-template-columns:1fr auto auto}
.fold-s .sh-b{grid-column:2;grid-row:1 / span 2;opacity:.55}
.fold-s:hover .sh-b,.fold-d[open]>.fold-s .sh-b{opacity:1}
.fold-i{grid-column:3}
.mv-act{display:flex;gap:.6rem;align-items:center;margin:0}
.share-row{display:flex;flex-wrap:wrap;gap:.45rem;align-items:center;margin:1rem 0}
.share-row .chip{text-decoration:none}
@media print{.sh-b,.share-row{display:none!important}}
/* calmer overprint: one clean letterform with a hard print shadow behind it (no ghost copy on top) */
.ovp::after,.hn::after{content:none!important;display:none!important}
.ovp{text-shadow:.045em .04em 0 var(--spot)}
.pb.other .ovp{text-shadow:.045em .04em 0 #B9BCCB}
@media (prefers-reduced-motion:no-preference){
  .pb-hero .ovp,.home-hero .ovp,.page-head .ovp{animation:inkset .7s cubic-bezier(.2,.8,.2,1) .1s both}
}
@keyframes inkset{from{text-shadow:0 0 0 var(--spot)}to{text-shadow:.045em .04em 0 var(--spot)}}
/* the lockup: digital / DIY / for change! */
.lockup{position:relative;margin:.2rem 0 1.4rem;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;line-height:.8;width:max-content;max-width:100%}
.lk-d{grid-column:1 / -1;font-weight:800;font-stretch:75%;font-size:clamp(1.15rem,3.4vw,1.9rem);letter-spacing:.02em;color:var(--ink);margin:0 0 .35rem .08em;line-height:1}
.lk-diy{grid-column:1;font-weight:900;font-stretch:62%;font-size:clamp(7.5rem,34vw,17rem);line-height:.78;color:var(--blue);text-shadow:.04em .035em 0 var(--spot);letter-spacing:-.01em}
.lk-fc{grid-column:2;align-self:end;font-family:"Marker",cursive;color:var(--spot);font-size:clamp(1.7rem,6.6vw,3.9rem);line-height:1;transform:rotate(-7deg);transform-origin:0 100%;margin:0 0 .45em .15em;white-space:nowrap}
@media (max-width:420px){.lockup{grid-template-columns:1fr}.lk-fc{grid-column:1;margin:.1em 0 0 .3em}}
@media (prefers-reduced-motion:no-preference){
  .lk-diy{animation:inkset .8s cubic-bezier(.2,.8,.2,1) .1s both}
  .lk-fc{animation:lkstamp .45s cubic-bezier(.3,1.6,.5,1) .6s both}
}
@keyframes lkstamp{from{transform:rotate(-16deg) scale(1.7);opacity:0}to{transform:rotate(-7deg) scale(1);opacity:1}}
/* header mark: DIY + for change */
.brand{display:inline-flex;align-items:baseline;gap:.3rem;white-space:nowrap;flex:none}
.br-diy{font-weight:900;font-stretch:62%;font-size:1.75rem;color:var(--blue);text-shadow:.05em .045em 0 var(--spot);line-height:1}
.br-fc{font-family:"Marker",cursive;font-size:.95rem;color:var(--spot);transform:rotate(-6deg);display:inline-block;line-height:1}
@media (max-width:420px){.lk-diy{font-size:clamp(7.5rem,46vw,12rem)}.br-fc{font-size:.82rem}}
@media (max-width:360px){.br-fc{display:none}}
.define{border-left:6px solid var(--spot);background:var(--card);padding:.9rem 1.1rem;margin:0 0 1.2rem;border-radius:0 var(--r) var(--r) 0}
.define h3{margin:0 0 .35rem;font-size:1.25rem;font-stretch:75%}
.define p{margin:0;font-size:1.02rem;line-height:1.5}
