/* ============================================================
   Kinmat app flow v2
   Light surfaces as the base, brand colour as accent.
   Type, palette and components follow the v2 landing and the ZÚA brand kit.
   Copy rule: no em dashes.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Instrument+Sans:ital,wght@0,400..700;1,400..700&display=swap');
@font-face{font-family:'Olive Display';src:url('../assets/fonts/olivedisplay-medium.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Olive Display';src:url('../assets/fonts/olivedisplay-semibold.woff2') format('woff2');font-weight:600;font-display:swap}

:root{
  /* brand */
  --teal:#276361; --lime:#D0FF71; --lav:#B18CE5; --paper:#F2EFEB; --dark:#1F302D;
  --teal-d:#1d4d4b; --teal-t:#E2EDEB; --lav-t:#F0E9FB; --lime-t:#EEFBD2;
  /* surfaces */
  --app:#F2EFEB; --side:#FFFFFF; --base:#F2EFEB; --card:#FFFFFF; --elev:#FBFAF8;
  /* text */
  --t1:#1F302D; --t2:#454f4b; --t3:#6d7a75;
  /* quotes */
  --qbg:#F7F5F1;
  /* status */
  --ok-bg:#D0FF71; --ok-tx:#1F302D;
  --shift-bg:#FFF0D4; --shift-tx:#8A5A12; --shift-bd:#E8A93B;
  --em-bg:#F0E9FB; --em-tx:#6B4BA3;
  --draft-bg:#ECE8E1; --draft-tx:#6b746f;
  --active-bg:#E1EEEC; --active-tx:#1f5a57;
  /* lines */
  --b1:rgba(31,48,45,.10); --b2:rgba(31,48,45,.17); --b3:rgba(31,48,45,.28);
  /* radius */
  --r-sm:8px; --r-md:12px; --r-lg:16px; --r-xl:22px; --pill:100px;
  --font:'Instrument Sans',Helvetica,Arial,sans-serif;
  --disp:'Olive Display','Instrument Sans',sans-serif;
  --side-w:238px;
  --sh:0 1px 2px rgba(31,48,45,.04),0 8px 24px rgba(31,48,45,.05);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--font);font-size:15px;line-height:1.6;background:var(--app);color:var(--t1);-webkit-font-smoothing:antialiased}
::selection{background:var(--lime);color:var(--dark)}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
input,textarea,select,button{font-family:var(--font)}

/* ---------- typography ---------- */
h1{font-size:clamp(25px,2.7vw,32px);font-weight:700;line-height:1.18;letter-spacing:-.015em}
h2{font-size:22px;font-weight:700;line-height:1.28}
h3{font-size:16.5px;font-weight:700;line-height:1.35}
.lbl{font-family:var(--disp);font-size:10.5px;font-weight:600;text-transform:uppercase;letter-spacing:.13em;color:var(--t3)}
.lbl.teal{color:var(--teal)} .lbl.lav{color:#8B67C7} .lbl.lime{color:var(--teal)}
.sub{font-size:15px;color:var(--t2);margin-top:8px;max-width:68ch}
.dim{color:var(--t2)} .fine{font-size:12.5px;color:var(--t3);line-height:1.55}
strong,b{color:var(--t1);font-weight:600}

/* ---------- shell ---------- */
.shell{display:flex;min-height:100vh}
.side{width:var(--side-w);flex-shrink:0;background:var(--side);border-right:1px solid var(--b1);padding:22px 12px 26px;position:sticky;top:0;height:100vh;overflow-y:auto;display:flex;flex-direction:column}
.side .brand{display:flex;align-items:center;gap:9px;padding:2px 10px 22px}
.side .brand img{height:25px;width:auto}
.navgroup{margin-top:16px}
.navgroup .lbl{display:block;padding:8px 12px 7px}
.navlink{display:flex;align-items:center;gap:10px;font-size:13.5px;font-weight:500;color:var(--t2);padding:9px 12px;border-radius:var(--r-sm);transition:background-color .15s,color .15s}
.navlink:hover{background:var(--paper);color:var(--t1)}
.navlink.on{background:var(--teal);color:var(--lime);font-weight:600}
.navlink svg{width:16px;height:16px;flex-shrink:0;stroke:currentColor;stroke-width:1.75;fill:none;stroke-linecap:round;stroke-linejoin:round}
.navlink .dot{margin-left:auto;width:7px;height:7px;border-radius:50%;background:var(--shift-bd);animation:pulse 1.8s infinite}
.side .foot{margin-top:auto;padding:16px 12px 0;border-top:1px solid var(--b1)}
.side .foot p{font-size:11.5px;color:var(--t3);line-height:1.55}
.side .foot b{color:var(--teal)}

.main{flex:1;min-width:0;background:var(--base);display:flex;flex-direction:column}
.topbar{position:sticky;top:0;z-index:20;background:rgba(242,239,235,.9);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--b1);padding:13px 30px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.ctx{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:12.5px;color:var(--t2)}
.ctx .tagline{font-family:var(--disp);font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.11em;color:var(--t3)}
.ctxchip{background:var(--card);border:1px solid var(--b1);border-radius:var(--pill);padding:5px 13px;font-size:12px;color:var(--t1)}
.ctxchip.edit{color:var(--teal);font-weight:600;border-color:rgba(39,99,97,.3)}
.topbar .right{margin-left:auto;display:flex;align-items:center;gap:10px}
.demo{font-family:var(--disp);font-size:9.5px;font-weight:600;text-transform:uppercase;letter-spacing:.1em;background:var(--draft-bg);color:var(--draft-tx);border-radius:var(--pill);padding:5px 11px}
.avatar{width:29px;height:29px;border-radius:50%;background:var(--lav);color:var(--dark);display:flex;align-items:center;justify-content:center;font-size:12.5px;font-weight:700;flex-shrink:0}
.page{padding:36px 30px 104px;max-width:940px;width:100%}
.page.wide{max-width:1140px}
.back{display:inline-flex;align-items:center;gap:6px;font-family:var(--disp);font-size:10.5px;font-weight:600;text-transform:uppercase;letter-spacing:.11em;color:var(--teal);margin-bottom:18px}
.back:hover{color:var(--t1)}

@media(max-width:900px){
  .shell{display:block}
  .side{width:100%;height:auto;position:static;border-right:none;border-bottom:1px solid var(--b1);padding:12px 16px;flex-direction:row;align-items:center;gap:6px;overflow-x:auto}
  .side .brand{padding:0 10px 0 0}
  .navgroup{margin:0;display:flex;gap:4px}
  .navgroup .lbl{display:none}
  .navlink{white-space:nowrap;padding:8px 11px}
  .navlink span{display:none}
  .navlink.on span{display:inline}
  .side .foot{display:none}
  .topbar{padding:12px 18px}
  .hide-sm{display:none}
  .page{padding:24px 18px 96px}
}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;font-family:var(--disp);font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.1em;border-radius:var(--pill);padding:12px 24px;border:none;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,background-color .15s}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:var(--teal);color:var(--lime)}
.btn-primary:hover{box-shadow:0 8px 22px rgba(39,99,97,.28)}
.btn-lime{background:var(--lime);color:var(--dark)}
.btn-lime:hover{box-shadow:0 8px 22px rgba(208,255,113,.5)}
.btn-secondary{background:var(--lav);color:var(--dark)}
.btn-secondary:hover{box-shadow:0 8px 22px rgba(177,140,229,.35)}
.btn-outline{background:transparent;color:var(--teal);border:1.5px solid rgba(39,99,97,.35)}
.btn-outline:hover{background:var(--teal-t)}
.btn-quiet{background:var(--card);color:var(--t1);border:1px solid var(--b2)}
.btn-quiet:hover{background:var(--elev)}
.btn-sm{font-size:11px;padding:9px 16px}
.btn-wide{width:100%}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.row.gap-sm{gap:7px}
.spread{display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap}

/* ---------- cards ---------- */
.card{background:var(--card);border:1px solid var(--b1);border-radius:var(--r-lg);padding:20px 22px;box-shadow:var(--sh);transition:border-color .15s,transform .15s ease}
.card.flat{box-shadow:none}
.card.elev{background:var(--elev)}
.card.pad{padding:26px 28px}
.card.dashed{background:transparent;border:1.5px dashed rgba(39,99,97,.4);box-shadow:none}
.card h3+p{margin-top:6px}
.card p{font-size:14px;color:var(--t2);line-height:1.6}
.grid{display:grid;gap:14px}
.g2{grid-template-columns:repeat(auto-fit,minmax(min(100%,330px),1fr))}
.g3{grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr))}
.g4{grid-template-columns:repeat(auto-fit,minmax(min(100%,175px),1fr))}
.stack{display:grid;gap:12px}
.sec{margin-top:40px}
.sec>.lbl{display:block;margin-bottom:13px}

/* ---------- badges ---------- */
.badge{display:inline-flex;align-items:center;gap:5px;font-family:var(--disp);font-weight:600;font-size:10px;text-transform:uppercase;letter-spacing:.09em;padding:5px 11px;border-radius:var(--pill);flex-shrink:0}
.badge.ok{background:var(--ok-bg);color:var(--ok-tx)}
.badge.shift{background:var(--shift-bg);color:var(--shift-tx);animation:pulse 1.9s infinite}
.badge.em{background:var(--em-bg);color:var(--em-tx)}
.badge.draft{background:var(--draft-bg);color:var(--draft-tx)}
.badge.active{background:var(--active-bg);color:var(--active-tx)}
@keyframes pulse{50%{opacity:.62}}

/* ---------- ask box ---------- */
.ask{background:var(--card);border:1px solid var(--b2);border-radius:var(--r-xl);padding:8px 8px 8px 20px;display:flex;align-items:center;gap:12px;margin-top:20px;box-shadow:0 14px 34px rgba(31,48,45,.09)}
.ask input{flex:1;min-width:0;font-size:15.5px;background:transparent;border:none;color:var(--t1);padding:14px 0}
.ask input::placeholder{color:var(--t3)}
.ask input:focus{outline:none}
.ask:focus-within{border-color:var(--teal);box-shadow:0 0 0 3px rgba(39,99,97,.18),0 14px 34px rgba(31,48,45,.09)}
.coverage{font-size:12.5px;color:var(--t3);margin-top:12px}
.coverage b{color:var(--teal);font-weight:600}
.suggest{display:flex;flex-direction:column;gap:7px;background:var(--card);border:1px solid var(--b1);border-radius:var(--r-lg);padding:17px 19px;box-shadow:var(--sh);transition:transform .15s ease,box-shadow .15s ease}
.suggest:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(31,48,45,.1)}
.suggest .q{font-size:14.5px;font-weight:600;color:var(--t1);line-height:1.4}
.suggest .lbl{font-size:9.5px}

/* ---------- answer ---------- */
.question{font-size:15px;color:var(--t2);background:var(--card);border:1px solid var(--b1);border-left:3px solid var(--teal);border-radius:0 var(--r-md) var(--r-md) 0;padding:14px 18px}
.conclusion{font-size:clamp(22px,2.5vw,29px);font-weight:700;line-height:1.24;letter-spacing:-.015em;color:var(--t1)}
.sowhat{background:var(--paper);border:1px solid var(--b1);border-radius:var(--r-md);padding:18px 20px;margin-top:20px}
.sowhat .lbl{display:block;color:var(--teal);margin-bottom:8px}
.sowhat p{font-size:15px;color:var(--t1);line-height:1.6}
.conf{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:20px;font-size:12.5px;color:var(--t3)}

/* quote / receipt cards */
.quote{background:var(--qbg);border-left:3px solid var(--lime);border-radius:0 var(--r-md) var(--r-md) 0;padding:14px 18px}
.quote:nth-of-type(even){border-left-color:var(--lav)}
.quote p{font-size:14.5px;font-style:italic;color:var(--t1);line-height:1.6}
.quote .who{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:12px;color:var(--t3);margin-top:9px}
.quote .who a{color:var(--teal);font-weight:600;border-bottom:1.5px solid var(--lime)}
.quote .who a:hover{border-color:var(--teal)}
.quote .spk{display:block;font-family:var(--disp);font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.11em;color:var(--t3);margin-bottom:6px;font-style:normal}
.quote.hl{background:var(--lime-t);border-left-color:var(--teal)}
.quote.hl .spk{color:var(--teal)}

/* honesty block */
.gap-block{background:var(--elev);border:1.5px dashed var(--b3);border-radius:var(--r-lg);padding:18px 20px;margin-top:22px}
.gap-block .lbl{display:block;color:var(--t2);margin-bottom:7px}
.gap-block p{font-size:14px;color:var(--t2);line-height:1.6}

/* market split */
.split{display:grid;gap:9px;margin-top:14px}
.split .r{display:grid;grid-template-columns:minmax(80px,110px) 1fr auto;gap:12px;align-items:center;font-size:13px}
.split .r .m{color:var(--t1);font-weight:600}
.split .r .bar{height:8px;border-radius:99px;background:var(--paper);border:1px solid var(--b1);overflow:hidden}
.split .r .bar i{display:block;height:100%;border-radius:99px;background:var(--teal)}
.split .r .bar.lav i{background:var(--lav)}
.split .r .n{color:var(--t3);font-size:12px}

/* ---------- metrics ---------- */
.metric{background:var(--card);border:1px solid var(--b1);border-radius:var(--r-lg);padding:18px 20px;box-shadow:var(--sh)}
.metric .k{font-family:var(--disp);font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.11em;color:var(--t3);margin-bottom:7px}
.metric .v{font-size:30px;font-weight:700;color:var(--teal);line-height:1}
.metric .v.lime{color:var(--teal)}
.metric .n{font-size:12.5px;color:var(--t3);margin-top:7px;line-height:1.45}

/* ---------- theme cards ---------- */
.theme{background:var(--card);border:1px solid var(--b1);border-radius:var(--r-lg);padding:22px;display:flex;flex-direction:column;gap:11px;box-shadow:var(--sh);transition:transform .18s ease,box-shadow .18s ease}
.theme:hover{transform:translateY(-4px);box-shadow:0 16px 36px rgba(31,48,45,.11)}
.theme img.ic{width:44px;height:44px}
.theme h3{font-size:17px}
.theme p{font-size:14px;color:var(--t2);line-height:1.55}
.theme .top-insight{font-size:13.5px;color:var(--t1);font-weight:500;border-left:2.5px solid var(--lime);padding-left:12px;line-height:1.5}
.theme.brandcard{background:var(--lav);border-color:var(--lav)}
.theme.brandcard p{color:var(--dark)}
.theme.brandcard .top-insight{border-left-color:var(--dark);color:var(--dark)}
.theme.brandcard .foot{color:rgba(31,48,45,.7)}
.theme .foot{margin-top:auto;font-size:11.5px;color:var(--t3)}

/* ---------- list rows ---------- */
.rowcard{background:var(--card);border:1px solid var(--b1);border-radius:var(--r-lg);padding:16px 19px;display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap;box-shadow:var(--sh);transition:transform .15s ease,box-shadow .15s ease}
.rowcard:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(31,48,45,.09)}
.rowcard .t{font-size:14.5px;font-weight:600;color:var(--t1);line-height:1.4}
.rowcard .m{font-size:12.5px;color:var(--t3);margin-top:4px}

/* ---------- timeline ---------- */
.tl{border-left:2px solid var(--b1);margin:20px 0 0 7px;padding-left:26px;display:grid;gap:24px}
.tl .ev{position:relative}
.tl .ev::before{content:"";position:absolute;left:-33px;top:5px;width:12px;height:12px;border-radius:50%;background:var(--teal);border:2.5px solid var(--base)}
.tl .ev.warn::before{background:var(--shift-bd)}
.tl .ev .d{font-family:var(--disp);font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.11em;color:var(--t3)}
.tl .ev p{font-size:14px;color:var(--t2);margin-top:5px;line-height:1.6}
.shiftbox{background:var(--shift-bg);border:1.5px solid rgba(232,169,59,.55);border-radius:var(--r-lg);padding:18px 20px;margin-top:14px}
.shiftbox h4{font-size:15px;font-weight:700;color:var(--shift-tx);line-height:1.4}
.shiftbox .quote{background:#fff;border-left-color:var(--shift-bd);margin-top:14px}

/* ---------- forms ---------- */
.field{margin-top:18px}
.field label{font-family:var(--disp);font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.12em;color:var(--teal);display:block;margin-bottom:7px}
.field input,.field textarea,.field select{width:100%;font-size:14.5px;color:var(--t1);background:var(--paper);border:1.5px solid var(--b1);border-radius:var(--r-md);padding:13px 15px;transition:border-color .15s}
.field textarea{resize:vertical;min-height:88px;line-height:1.6}
.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:var(--teal)}
.field .help{font-size:12.5px;color:var(--t3);margin-top:7px}
.chips{display:flex;gap:7px;flex-wrap:wrap;margin-top:10px}
.chips span{font-size:12.5px;background:var(--paper);border:1px solid var(--b1);border-radius:var(--pill);padding:6px 13px;color:var(--t1)}
.chips span.add{border-style:dashed;color:var(--t3)}
.steps{display:flex;gap:6px;margin-bottom:22px}
.steps i{width:32px;height:4px;border-radius:4px;background:var(--b1)}
.steps i.on{background:var(--teal)}
.code{font-family:ui-monospace,'SF Mono',Menlo,monospace;font-size:12.5px;background:var(--dark);color:var(--lime);border-radius:var(--r-md);padding:15px 17px;overflow-x:auto;white-space:pre;line-height:1.6}

/* ---------- toggles ---------- */
.toggle{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 0;border-bottom:1px solid var(--b1)}
.toggle:last-child{border-bottom:none}
.toggle .t{font-size:14.5px;font-weight:600;color:var(--t1)}
.toggle .m{font-size:12.5px;color:var(--t3);margin-top:3px;max-width:62ch}
.sw{width:42px;height:23px;border-radius:99px;background:var(--b2);position:relative;flex-shrink:0}
.sw::after{content:"";position:absolute;top:3px;left:3px;width:17px;height:17px;border-radius:50%;background:#fff;transition:.15s;box-shadow:0 1px 3px rgba(0,0,0,.2)}
.sw.on{background:var(--teal)}
.sw.on::after{left:22px;background:var(--lime)}

/* ---------- decoration ---------- */
.deco{position:absolute;pointer-events:none;user-select:none;z-index:0}
.pos{position:relative;overflow:hidden}
.hero-note{font-size:12.5px;color:var(--t3);margin-top:12px}

/* ---------- public share page ---------- */
.public{background:radial-gradient(120% 140% at 70% -10%,#2f7a6b 0%,var(--teal) 42%,var(--dark) 100%);min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:44px 22px 70px;position:relative;overflow:hidden}
.public .sheet{width:100%;max-width:730px;position:relative;z-index:2}
.public .kmark{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:22px}
.public .kmark img{height:26px}
.public .kmark .lbl{color:var(--lime)}
.public .panel{background:#fff;border-radius:var(--r-xl);padding:32px 34px;box-shadow:0 30px 80px rgba(0,0,0,.34)}
.public .outro{text-align:center;margin-top:26px;font-size:13.5px;color:rgba(255,255,255,.75);line-height:1.65}
.public .outro a{color:var(--lime);font-weight:600}
@media(max-width:600px){.public .panel{padding:24px 20px}}

/* ---------- hub (index) ---------- */
.hub .wrap{max-width:1080px;margin:0 auto;padding:56px 24px 90px}
.hub .head{display:flex;align-items:center;gap:14px;margin-bottom:20px}
.hub .head img{height:30px}
.hub h1{font-size:clamp(31px,4vw,46px)}
.hub .lede{font-size:18px;color:var(--t2);max-width:70ch;margin-top:16px;line-height:1.6}
.hub .cards{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(min(100%,305px),1fr));margin-top:40px}
.hub .sc{background:var(--card);border:1px solid var(--b1);border-radius:var(--r-xl);padding:26px;display:flex;flex-direction:column;gap:10px;box-shadow:var(--sh);transition:transform .2s ease,box-shadow .2s ease}
.hub .sc:hover{transform:translateY(-4px);box-shadow:0 18px 44px rgba(31,48,45,.13)}
.hub .sc .n{font-family:var(--disp);font-size:10.5px;font-weight:600;text-transform:uppercase;letter-spacing:.12em;color:#8B67C7}
.hub .sc h3{font-size:19.5px}
.hub .sc p{font-size:14.5px;color:var(--t2);line-height:1.55}
.hub .sc .promise{font-size:13px;color:var(--teal);font-weight:600;border-left:2.5px solid var(--lime);padding-left:12px;line-height:1.5;margin-top:auto}
.hub .note{background:var(--card);border:1.5px dashed var(--teal);border-radius:var(--r-xl);padding:26px 28px;margin-top:36px}
.hub .note p{font-size:14.5px;color:var(--t2);line-height:1.65}
.hub .note p+p{margin-top:10px}

/* ---------- specificity fixes (these elements live inside .card) ---------- */
.card .conclusion{font-size:clamp(22px,2.5vw,29px);font-weight:700;line-height:1.24;letter-spacing:-.015em;color:var(--t1)}
.card .conf{font-size:12.5px;color:var(--t3)}
.card .fine{font-size:12.5px;color:var(--t3);line-height:1.55}
.card .sub{font-size:15px;color:var(--t2)}
.card .top-insight{font-size:13.5px;color:var(--t1)}
.card .sowhat p{font-size:15px;color:var(--t1)}
.card .quote p{font-size:14.5px;color:var(--t1)}
.card .gap-block p{font-size:14px;color:var(--t2)}
.card .shiftbox p{color:var(--shift-tx)}
.card .toggle .m,.card .rowcard .m{font-size:12.5px;color:var(--t3)}
.public .panel .conclusion{font-size:clamp(22px,2.5vw,28px);font-weight:700;color:var(--t1)}

/* ============================================================
   TOOL components (co-creation workshop, Sep 17 2026)
   ============================================================ */

/* answer + evidence rail (ref: Consensus) */
.two{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:26px;align-items:start}
.rail{position:sticky;top:86px;display:grid;gap:12px}
.rail .box{background:var(--card);border:1px solid var(--b1);border-radius:var(--r-lg);padding:16px 18px;box-shadow:var(--sh)}
.rail .box>.lbl{display:block;margin-bottom:10px}
.rail .box p{font-size:13px;color:var(--t2);line-height:1.55}
.rail .mini{font-size:13px;color:var(--t1);padding:9px 0;border-bottom:1px solid var(--b1);line-height:1.45}
.rail .mini:last-child{border-bottom:none;padding-bottom:0}
.rail .mini i{display:block;font-style:normal;font-size:11.5px;color:var(--t3);margin-top:3px}
.dl{display:grid;gap:8px;font-size:13px}
.dl div{display:grid;grid-template-columns:96px 1fr;gap:10px}
.dl dt{color:var(--t3)} .dl dd{color:var(--t1);font-weight:500}
@media(max-width:1080px){.two{grid-template-columns:1fr}.rail{position:static}}

/* scope line: where the answer is reading from (ref: WGSN) */
.scope{display:flex;align-items:center;gap:9px;flex-wrap:wrap;font-size:12.5px;color:var(--t3);background:var(--elev);border:1px dashed var(--b2);border-radius:var(--pill);padding:8px 16px}
.scope b{color:var(--teal);font-weight:600}

/* prompt starters (ref: Maria's pre-searches) */
.starters{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))}
.starter{background:var(--card);border:1px solid var(--b1);border-radius:var(--r-md);padding:13px 15px;font-size:13.5px;color:var(--t1);line-height:1.45;display:flex;gap:9px;align-items:flex-start;box-shadow:var(--sh);transition:transform .15s ease,box-shadow .15s ease}
.starter:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(31,48,45,.1)}
.starter .ic{width:22px;height:22px;flex-shrink:0;border-radius:50%;background:var(--lime-t);display:flex;align-items:center;justify-content:center;font-size:11px;color:var(--teal);font-weight:700}
.tagrow{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}
.tagrow a{font-size:12.5px;background:var(--card);border:1px solid var(--b1);border-radius:var(--pill);padding:6px 13px;color:var(--t2)}
.tagrow a:hover{border-color:var(--teal);color:var(--teal)}
.tagrow a.on{background:var(--teal);color:var(--lime);border-color:var(--teal)}

/* verdict (ref: Julian's review tool) */
.verdict{display:grid;gap:14px}
.vd{border-radius:var(--r-lg);padding:18px 20px;border:1px solid}
.vd.sup{background:var(--lime-t);border-color:rgba(39,99,97,.3)}
.vd.con{background:var(--shift-bg);border-color:rgba(232,169,59,.55)}
.vd.non{background:var(--elev);border-color:var(--b2);border-style:dashed}
.vd h4{font-size:15.5px;font-weight:700;line-height:1.4;color:var(--t1)}
.vd p{font-size:14px;color:var(--t2);line-height:1.6;margin-top:6px}
.vd .quote{background:rgba(255,255,255,.75);margin-top:12px}
.vdhead{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.stepper{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}
.stepper span{font-family:var(--disp);font-size:10.5px;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--t3);background:var(--card);border:1px solid var(--b1);border-radius:var(--pill);padding:7px 14px}
.stepper span.on{background:var(--teal);color:var(--lime);border-color:var(--teal)}
.paste{background:var(--card);border:1.5px solid var(--b2);border-radius:var(--r-lg);padding:18px 20px;box-shadow:var(--sh)}
.paste textarea{width:100%;min-height:120px;font-size:14.5px;line-height:1.6;color:var(--t1);background:var(--paper);border:1px solid var(--b1);border-radius:var(--r-md);padding:14px 16px;resize:vertical}
.paste textarea:focus{outline:none;border-color:var(--teal)}

/* report types (ref: Emilio's report formats) */
.reptypes{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(min(100%,255px),1fr))}
.reptype{background:var(--card);border:1px solid var(--b1);border-radius:var(--r-lg);padding:20px;box-shadow:var(--sh);display:flex;flex-direction:column;gap:9px;transition:transform .18s ease,box-shadow .18s ease,border-color .15s}
.reptype:hover{transform:translateY(-3px);box-shadow:0 14px 32px rgba(31,48,45,.11)}
.reptype.on{border-color:var(--teal);background:var(--teal-t)}
.reptype h3{font-family:var(--disp);font-size:14.5px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;line-height:1.3}
.reptype p{font-size:13.5px;color:var(--t2);line-height:1.5}
.reptype .who{margin-top:auto;font-size:11.5px;color:var(--t3)}
.reptype img{width:34px;height:34px}

/* report cover + body (editorial) */
.cover{background:var(--dark);color:#fff;border-radius:var(--r-xl);padding:38px 40px;position:relative;overflow:hidden}
.cover .lbl{color:var(--lime)}
.cover h1,.cover h2{color:#fff;margin-top:12px;font-size:clamp(26px,3vw,36px);line-height:1.18;letter-spacing:-.015em;max-width:32ch}
.cover p{color:rgba(255,255,255,.8);font-size:15.5px;line-height:1.6;margin-top:14px;max-width:62ch}
.cover .meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:22px}
.cover .meta span{font-size:12px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);border-radius:var(--pill);padding:5px 12px;color:#fff}
.cover img.deco{top:-30px;right:-70px;width:250px;opacity:.3}
.rec{background:var(--card);border:1px solid var(--b1);border-radius:var(--r-lg);padding:22px 24px;box-shadow:var(--sh);display:grid;gap:12px}
.rec .n{width:32px;height:32px;border-radius:50%;background:var(--teal);color:var(--lime);font-weight:700;font-size:14px;display:flex;align-items:center;justify-content:center}
.rec h3{font-size:19px;line-height:1.3}
.rec .do{font-size:14.5px;color:var(--t1);line-height:1.6}
.rec .why{font-size:13.5px;color:var(--t2);line-height:1.55;border-left:2.5px solid var(--lav);padding-left:13px}

/* evidence library (ref: Natalia's clips) */
.clip{background:var(--card);border:1px solid var(--b1);border-radius:var(--r-lg);padding:16px 18px;box-shadow:var(--sh);display:grid;gap:10px;position:relative}
.clip.sel{border-color:var(--teal);background:var(--teal-t)}
.clip .top{display:flex;gap:10px;align-items:flex-start;justify-content:space-between}
.clip .cb{width:20px;height:20px;border-radius:5px;border:1.5px solid var(--b3);background:#fff;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:12px;color:transparent}
.clip.sel .cb{background:var(--teal);border-color:var(--teal);color:var(--lime)}
.orig{font-size:15px;font-style:italic;color:var(--t1);line-height:1.6}
.trans{font-size:13.5px;color:var(--t2);line-height:1.55;border-left:2.5px solid var(--lime);padding-left:12px}
.clip .who{display:flex;gap:8px;flex-wrap:wrap;align-items:center;font-size:12px;color:var(--t3)}
.clip .who a{color:var(--teal);font-weight:600;border-bottom:1.5px solid var(--lime)}
.jrg{background:var(--lav-t);color:#5B3C94;font-size:11.5px;border-radius:var(--pill);padding:3px 10px;font-weight:600}
.tray{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);z-index:60;background:var(--dark);color:#fff;border-radius:var(--pill);padding:11px 14px 11px 22px;display:flex;align-items:center;gap:14px;box-shadow:0 18px 44px rgba(0,0,0,.3);font-size:13.5px}
.tray b{color:var(--lime)}
@media(max-width:900px){.tray{left:12px;right:12px;transform:none;justify-content:space-between;border-radius:var(--r-lg)}}

/* markets */
.mkt{width:100%;border-collapse:collapse;font-size:13.5px;background:var(--card);border:1px solid var(--b1);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh)}
.mkt th,.mkt td{text-align:left;padding:13px 16px;border-bottom:1px solid var(--b1);vertical-align:top}
.mkt th{font-family:var(--disp);font-size:10.5px;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--t3);background:var(--elev)}
.mkt tr:last-child td{border-bottom:none}
.mkt td b{color:var(--t1)}
.mkt .yes{color:var(--teal);font-weight:600}
.mkt .no{color:#8A5A12;font-weight:600}
.wrapx{overflow-x:auto}

/* researchers */
.rcards{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr))}
.rcard{background:var(--card);border:1px solid var(--b1);border-radius:var(--r-lg);padding:16px;box-shadow:var(--sh);text-align:left}
.rcard img{width:62px;height:62px;border-radius:50%;object-fit:cover;margin-bottom:12px}
.rcard .nm{font-size:14.5px;font-weight:700;color:var(--t1)}
.rcard .rl{font-size:12.5px;color:var(--t3);margin-top:3px;line-height:1.45}
.rcard .cn{margin-top:9px;font-size:11.5px;color:var(--teal);font-weight:600;font-family:var(--disp);text-transform:uppercase;letter-spacing:.08em}

/* editorial topic page */
.ed{max-width:70ch}
.ed h2{margin-top:34px;font-size:24px}
.ed p{font-size:16px;line-height:1.75;color:var(--t2);margin-top:14px}
.ed p b,.ed p strong{color:var(--t1)}
.pull{font-size:clamp(19px,2.2vw,25px);font-weight:700;line-height:1.35;color:var(--t1);border-left:4px solid var(--lime);padding-left:20px;margin:30px 0}
.pull span{display:block;font-size:13px;font-weight:500;color:var(--t3);margin-top:10px;font-family:var(--font)}
.figure{margin:28px 0;background:var(--card);border:1px solid var(--b1);border-radius:var(--r-lg);padding:20px 22px;box-shadow:var(--sh)}
.figure .cap{font-size:12.5px;color:var(--t3);margin-top:12px}
.toc{background:var(--elev);border:1px solid var(--b1);border-radius:var(--r-lg);padding:18px 20px}
.toc a{display:block;font-size:14px;color:var(--t1);padding:7px 0;border-bottom:1px solid var(--b1)}
.toc a:last-child{border-bottom:none}
.toc a:hover{color:var(--teal)}
.toc a i{font-style:normal;color:var(--t3);margin-right:9px;font-family:var(--disp);font-size:11px}

/* signals / trends */
.signal{background:var(--card);border:1px solid var(--b1);border-left:3px solid var(--lav);border-radius:0 var(--r-lg) var(--r-lg) 0;padding:18px 20px;box-shadow:var(--sh);display:grid;gap:9px}
.signal h3{font-size:16.5px;line-height:1.35}
.signal p{font-size:13.5px;color:var(--t2);line-height:1.55}
.signal .str{display:flex;gap:6px;align-items:center;font-size:11.5px;color:var(--t3);font-family:var(--disp);text-transform:uppercase;letter-spacing:.08em}
.signal .str i{width:26px;height:5px;border-radius:9px;background:var(--b1);display:block}
.signal .str i.on{background:var(--lav)}

/* briefing hero */
.brief{background:linear-gradient(180deg,#fff 0%,var(--elev) 100%);border:1px solid var(--b1);border-radius:var(--r-xl);padding:34px 36px;box-shadow:var(--sh);position:relative;overflow:hidden}
.brief h1{font-size:clamp(26px,3vw,36px);max-width:26ch}
.brief .lede{font-size:17px;color:var(--t2);line-height:1.65;margin-top:16px;max-width:64ch}
.brief img.deco{top:-50px;right:-80px;width:300px;opacity:.16}
.five{display:grid;gap:10px;margin-top:24px}
.five div{display:flex;gap:13px;align-items:baseline;font-size:15px;color:var(--t1);line-height:1.5}
.five div>b{font-family:var(--disp);font-size:12px;color:var(--teal);flex-shrink:0;width:22px}
.five div span b{font-family:var(--font);font-size:inherit;color:var(--t1);width:auto}
.newsrow{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr))}
.news{background:var(--card);border:1px solid var(--b1);border-radius:var(--r-lg);padding:17px 19px;box-shadow:var(--sh);display:grid;gap:8px}
.news .d{font-family:var(--disp);font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.11em;color:var(--lav)}
.news .t{font-size:14.5px;font-weight:600;color:var(--t1);line-height:1.4}
.news p{font-size:13px;color:var(--t2);line-height:1.5}

/* misc */
.inline-note{font-size:13px;color:var(--t3);line-height:1.55;margin-top:10px}
.sep{height:1px;background:var(--b1);margin:34px 0}
.center{text-align:center}

/* ---------- accessibility pass (Codex review, Sep 17) ---------- */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,
[tabindex]:focus-visible,summary:focus-visible{outline:3px solid var(--teal);outline-offset:2px;border-radius:6px}
.navlink:focus-visible{outline-color:var(--lime)}
.skip{position:absolute;left:-9999px;top:0;background:var(--teal);color:var(--lime);font-family:var(--disp);font-size:12px;
  text-transform:uppercase;letter-spacing:.1em;padding:12px 18px;border-radius:0 0 var(--r-md) 0;z-index:200}
.skip:focus{left:0}
.mkt caption{text-align:left;font-size:12.5px;color:var(--t3);padding:12px 16px;caption-side:bottom;line-height:1.5}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
button.sw{border:none;padding:0;cursor:pointer;-webkit-appearance:none;appearance:none}

/* ---------- volver al índice de prueba (flotante) ---------- */
.volver{position:fixed;right:24px;bottom:24px;z-index:80;display:inline-flex;align-items:center;gap:8px;
  background:var(--dark);color:var(--lime);font-family:var(--disp);font-size:11px;font-weight:600;
  text-transform:uppercase;letter-spacing:.1em;padding:12px 18px;border-radius:var(--pill);
  box-shadow:0 12px 30px rgba(31,48,45,.32);transition:transform .15s ease,box-shadow .15s ease}
.volver:hover{transform:translateY(-2px);box-shadow:0 16px 36px rgba(31,48,45,.4)}
.volver svg{width:13px;height:13px;stroke:currentColor;stroke-width:2.2;fill:none;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:900px){
  .volver{right:14px;bottom:14px;font-size:10px;padding:11px 15px}
  .volver .largo{display:none}
  .tray{bottom:74px}
}

/* ---------- puerta con clave (gate.js) ---------- */
html.kinmat-cerrado body{visibility:hidden}
html.kinmat-cerrado #puerta{visibility:visible}
#puerta[hidden]{display:none}
#puerta{position:fixed;inset:0;z-index:500;background:radial-gradient(120% 140% at 70% -10%,#2f7a6b 0%,var(--teal) 42%,var(--dark) 100%);
  display:flex;align-items:center;justify-content:center;padding:24px}
#puerta .caja{background:#fff;border-radius:var(--r-xl);padding:34px 36px;max-width:430px;width:100%;box-shadow:0 30px 80px rgba(0,0,0,.34)}
#puerta img{height:26px;margin-bottom:22px}
#puerta h1{font-size:23px;line-height:1.25}
#puerta p{font-size:14.5px;color:var(--t2);line-height:1.6;margin-top:10px}
#puerta label{font-family:var(--disp);font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.12em;
  color:var(--teal);display:block;margin:22px 0 7px}
#puerta input{width:100%;font-family:var(--font);font-size:15.5px;color:var(--t1);background:var(--paper);
  border:1.5px solid var(--b2);border-radius:var(--r-md);padding:13px 15px}
#puerta input:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px rgba(39,99,97,.18)}
#puerta .btn{margin-top:16px;width:100%}
#puerta .mal{font-size:13.5px;color:#8A5A12;background:var(--shift-bg);border-radius:var(--r-md);padding:10px 13px;margin-top:14px;display:none}
#puerta .mal.ver{display:block}
#puerta .fina{font-size:12.5px;color:var(--t3);margin-top:16px;line-height:1.5}
.cerrar{display:inline-flex;align-items:center;gap:6px;font-family:var(--disp);font-size:10.5px;font-weight:600;
  text-transform:uppercase;letter-spacing:.11em;color:var(--t3);background:none;border:none;cursor:pointer;padding:0}
.cerrar:hover{color:var(--teal)}

/* ============================================================
   v3 (Sep 24 feedback): a home that lands you, a shorter menu
   ============================================================ */
.navgroup.ws{margin-top:auto;padding-top:14px;border-top:1px solid var(--b1)}
.side .foot{margin-top:14px}
@media(max-width:900px){.navgroup.ws{margin-top:0;padding-top:0;border-top:none}}

/* home */
.welcome{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:28px;align-items:start}
@media(max-width:1080px){.welcome{grid-template-columns:1fr}}
.studybar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:16px}
.studychip{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;color:var(--teal);background:var(--teal-t);border:1px solid rgba(39,99,97,.25);border-radius:var(--pill);padding:6px 13px}
.studychip i{width:7px;height:7px;border-radius:50%;background:var(--teal);display:block}
.studychip.next{color:var(--t3);background:transparent;border-style:dashed;border-color:var(--b2);font-weight:500}
.studychip.next i{background:var(--b2)}
.askcard{background:var(--dark);color:#fff;border-radius:var(--r-xl);padding:26px 26px 22px;box-shadow:0 20px 50px rgba(31,48,45,.22)}
.askcard .lbl{color:var(--lime)}
.askcard h2{color:#fff;font-size:22px;margin-top:8px}
.askcard .ask{margin-top:16px;box-shadow:none;border-color:transparent}
.askcard .chips span{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.14);color:#fff;cursor:pointer}
.askcard .chips span:hover{border-color:var(--lime)}
.askcard .fine{color:rgba(255,255,255,.6);margin-top:12px}
.tools{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr))}
.tool{background:var(--card);border:1px solid var(--b1);border-radius:var(--r-xl);padding:24px;box-shadow:var(--sh);display:flex;flex-direction:column;gap:10px;transition:transform .18s ease,box-shadow .18s ease}
.tool:hover{transform:translateY(-3px);box-shadow:0 16px 34px rgba(31,48,45,.11)}
.tool .ico{width:42px;height:42px;border-radius:12px;background:var(--lime);display:flex;align-items:center;justify-content:center}
.tool .ico svg{width:20px;height:20px;stroke:var(--dark);stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.tool.alt .ico{background:var(--lav)}
.tool h3{font-size:19px}
.tool p{font-size:14.5px;color:var(--t2);line-height:1.55}
.tool .eg{font-size:13.5px;color:var(--t1);background:var(--paper);border-radius:var(--r-md);padding:11px 14px;font-style:italic}
.tool .go{margin-top:auto;font-family:var(--disp);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--teal)}
.path{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr));counter-reset:paso}
.paso{background:var(--card);border:1px solid var(--b1);border-radius:var(--r-lg);padding:18px;display:flex;flex-direction:column;gap:7px;position:relative}
.paso::before{counter-increment:paso;content:counter(paso);width:28px;height:28px;border-radius:50%;background:var(--teal);color:var(--lime);font-weight:700;font-size:13px;display:flex;align-items:center;justify-content:center;margin-bottom:4px}
.paso b{font-size:15px}
.paso span{font-size:13.5px;color:var(--t2);line-height:1.5}
.paso a{margin-top:auto;font-family:var(--disp);font-size:10.5px;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--teal)}
.paso.done{background:var(--elev)}
.paso.done::before{content:"\2713";background:var(--lime);color:var(--dark)}
.topics{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr))}
.topiccard{background:var(--card);border:1px solid var(--b1);border-radius:var(--r-lg);padding:16px 18px;display:flex;flex-direction:column;gap:6px;transition:border-color .15s,transform .15s ease}
.topiccard:hover{border-color:var(--teal);transform:translateY(-2px)}
.topiccard b{font-size:15.5px}
.topiccard span{font-size:13px;color:var(--t2);line-height:1.45}
.topiccard i{font-style:normal;font-size:11.5px;color:var(--t3);margin-top:auto}
.doors{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));margin-top:14px}
.door{display:flex;gap:12px;align-items:center;background:var(--elev);border:1px dashed var(--b2);border-radius:var(--r-lg);padding:14px 16px;font-size:14px;color:var(--t1)}
.door:hover{border-color:var(--teal);border-style:solid}
.door img{width:34px;height:34px;flex-shrink:0}
.door small{display:block;font-size:12.5px;color:var(--t3);margin-top:2px}
.sub-note{background:var(--lime-t);border:1px solid rgba(39,99,97,.2);border-radius:var(--r-lg);padding:18px 20px;display:flex;gap:16px;align-items:flex-start;flex-wrap:wrap}
.sub-note b{font-size:15px}
.sub-note p{font-size:14px;color:var(--t2);line-height:1.6;margin-top:4px;max-width:70ch}

/* review: a deck goes in, slide-by-slide read comes out */
.drop{border:2px dashed rgba(39,99,97,.4);border-radius:var(--r-xl);background:var(--card);padding:28px;display:flex;gap:20px;align-items:center;flex-wrap:wrap}
.drop .file{display:flex;gap:14px;align-items:center;flex:1;min-width:240px}
.drop .doc{width:52px;height:64px;border-radius:8px;background:var(--dark);color:var(--lime);font-family:var(--disp);font-size:10px;font-weight:600;display:flex;align-items:flex-end;justify-content:center;padding-bottom:8px;flex-shrink:0}
.drop .file b{font-size:15.5px;display:block}
.drop .file span{font-size:13px;color:var(--t3)}
.tally{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.tally span{font-size:13px;font-weight:600;border-radius:var(--pill);padding:6px 13px}
.tally .t-ok{background:var(--lime);color:var(--dark)}
.tally .t-bad{background:var(--shift-bg);color:var(--shift-tx)}
.tally .t-na{background:var(--draft-bg);color:var(--draft-tx)}
.slide{display:grid;grid-template-columns:120px minmax(0,1fr);gap:18px;align-items:start}
.slide .thumb{aspect-ratio:16/10;border-radius:10px;background:var(--card);border:1px solid var(--b2);padding:10px;font-size:10px;line-height:1.35;color:var(--t2);box-shadow:var(--sh);overflow:hidden}
.slide .thumb b{display:block;font-size:9px;color:var(--t3);font-family:var(--disp);letter-spacing:.1em;text-transform:uppercase;margin-bottom:4px}
.fix{margin-top:12px;background:#fff;border:1px solid var(--b1);border-radius:var(--r-md);padding:12px 14px;font-size:13.5px}
.fix .lbl{display:block;margin-bottom:5px}
@media(max-width:640px){.slide{grid-template-columns:1fr}.slide .thumb{max-width:200px}}

/* ============================================================
   v1 · Miro feedback, Oct 7
   Rule: the pill shape belongs to actions only (buttons).
   Links are underlined text. Indicators are text with a dot or a
   small square tag. Uppercase labels never read smaller than body.
   ============================================================ */

/* 2 · labels */
.lbl{font-size:12.5px;letter-spacing:.11em}
h2.lbl{font-size:13px}
.ctx .tagline,.news .d,.metric .k,.tl .ev .d,.quote .spk,.field label{font-size:11.5px}
.tool .go,.paso a{font-size:12px}
.five div>b{font-size:13px}

/* 1 · links, not pills */
.ctxchip{background:none;border:none;border-radius:0;padding:0;font-size:13.5px;color:var(--t1)}
.ctx{gap:6px 14px}
.ctxchip+.ctxchip:not(.edit)::before{content:"\00B7";margin-right:14px;color:var(--t3)}
.ctxchip.edit{color:var(--teal);font-weight:600;text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1.5px;margin-left:4px}
.demo{background:none;padding:0;border-radius:0;font-size:11px;color:var(--t3)}
.studybar{gap:6px 22px}
.studychip{background:none;border:none;border-radius:0;padding:0;font-size:13.5px}
.studychip.next{border:none}
.textlink{color:var(--teal);font-weight:600;text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1.5px}

/* 1 · indicators: square tags, not pills */
.badge{border-radius:5px}
.chips span{border-radius:6px}
.tally{gap:6px 20px}
.tally span{background:none!important;padding:0;border-radius:0;color:var(--t1)!important;display:inline-flex;align-items:center;gap:8px}
.tally span::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--b2)}
.tally .t-ok::before{background:#8fd12c}
.tally .t-bad::before{background:#E0913A}
.tally .t-na::before{background:var(--b3)}

/* 1 · filters read as tabs */
.tagrow{gap:4px 18px;border-bottom:1px solid var(--b1)}
.tagrow a{background:none;border:none;border-radius:0;padding:8px 0;margin-bottom:-1px;border-bottom:2px solid transparent;font-size:14px}
.tagrow a.on{background:none;color:var(--teal);border-bottom-color:var(--teal);font-weight:600}

/* 3, 4, 5 · Home */
.welcome-meta{display:block;margin-bottom:14px}
.welcome{gap:48px;align-items:start}
.welcome h1{margin-top:0}
.welcome .sub{margin-top:26px}
.welcome .sub+.sub{margin-top:12px}

/* 6, 7 · Ask card */
.askcard h2{margin-top:10px}
.ask.tall{flex-direction:column;align-items:stretch;padding:16px 16px 12px 18px;gap:10px;border-radius:var(--r-lg)}
.ask.tall textarea{width:100%;min-height:128px;resize:vertical;font:inherit;font-size:15.5px;line-height:1.5;background:transparent;border:none;color:var(--t1)}
.ask.tall textarea::placeholder{color:var(--t3)}
.ask.tall textarea:focus{outline:none}
.ask.tall .btn{align-self:flex-end}
.askcard .tries{margin-top:18px}
.askcard .tries .lbl{color:rgba(255,255,255,.6);font-size:11.5px}
.askcard .tries a{display:block;color:#fff;font-size:14.5px;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.12)}
.askcard .tries a:hover{color:var(--lime)}
.askcard .tries a::after{content:" \2192";color:var(--lime)}

/* 8 · privacy */
.privacy{display:flex;gap:12px;align-items:flex-start;margin-top:14px;font-size:13.5px;color:var(--t2);line-height:1.55}
.privacy svg{width:18px;height:18px;flex-shrink:0;margin-top:2px;stroke:var(--teal);stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.privacy b{color:var(--t1)}
.toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,16px);background:var(--dark);color:#fff;font-size:14px;padding:11px 18px;border-radius:12px;opacity:0;pointer-events:none;transition:.2s;z-index:60;max-width:calc(100% - 32px)}
.toast.on{opacity:1;transform:translate(-50%,0)}

/* v1 app states */
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.drop .file{cursor:pointer}
.thinking{display:none;align-items:center;gap:12px;margin-top:16px;font-size:14.5px;color:var(--teal);font-weight:600}
.thinking.htmx-request{display:flex}
.thinking .dots{display:inline-flex;gap:5px}
.thinking .dots i{width:7px;height:7px;border-radius:50%;background:var(--teal);animation:blink 1.2s infinite both}
.thinking .dots i:nth-child(2){animation-delay:.2s}.thinking .dots i:nth-child(3){animation-delay:.4s}
@keyframes blink{0%,80%,100%{opacity:.25}40%{opacity:1}}
.htmx-request .btn[type=submit],button[disabled]{opacity:.55;cursor:progress}
.saved-ok{font-size:14px;color:var(--t2)}
.side .foot .signout{display:inline-block;margin-top:10px;font-size:12.5px;color:var(--t3);text-decoration:underline;text-underline-offset:3px}
#puerta label{margin-top:14px}
.illustrative{font-size:13.5px;color:#6b4a12;background:var(--shift-bg);border-radius:10px;padding:10px 14px;line-height:1.5}
.illustrative.page-note{margin:16px clamp(16px,4vw,44px) 0}
.ev-filters{display:flex;flex-wrap:wrap;gap:10px;align-items:end;margin-top:20px}
.ev-filters label{display:grid;gap:5px;font-size:12px;color:var(--t3)}
.ev-filters select,.ev-filters input{font:inherit;font-size:14px;padding:9px 12px;border:1px solid var(--b2);border-radius:10px;background:var(--card);color:var(--t1);min-width:180px}
.ev-list{display:grid;gap:12px;margin-top:20px}
.ev-list .quote{background:var(--card);border:1px solid var(--b1);border-radius:14px;padding:16px 18px}
.ev-list .quote:target,.ev-list .quote.hl{border-color:var(--teal);box-shadow:0 0 0 3px rgba(39,99,97,.15)}
.ev-codes{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.ev-codes span{font-size:11.5px;background:var(--paper);border-radius:6px;padding:3px 8px;color:var(--t2)}
.ev-context{margin-top:12px;border-left:2px solid var(--b2);padding-left:12px;font-size:13.5px;color:var(--t2);display:grid;gap:6px}
.ev-context b{color:var(--t1);font-weight:600}
.pager{display:flex;gap:16px;align-items:center;margin-top:20px;font-size:14px}
