/* ==========================================================================
   artifiziala.eus · PISA 2029 · MAIL atala
   Webgunearen diseinu-sistemaren gainean eraikia (styles.css).
   ========================================================================== */

/* Letra-tipoak bertan ostatatuta: ez da eskaerarik egiten hirugarrenei (Google Fonts). */
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url('../../assets/fonts/ibm-plex-mono-400-latin.woff2') format('woff2');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:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url('../../assets/fonts/ibm-plex-mono-400-latin-ext.woff2') format('woff2');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:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url('../../assets/fonts/ibm-plex-mono-500-latin.woff2') format('woff2');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:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url('../../assets/fonts/ibm-plex-mono-500-latin-ext.woff2') format('woff2');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;}

:root{
  --c-etika:#1d4e6e;
  --c-sarbidea:#2a6f97;
  --c-aztertu:#0e7a86;
  --c-partehartu:#3a8a78;
  --c-sortu:#5b8c4e;

  /* testu zuriarentzako tonu ilunak (kontrastea) */
  --c-etika-deep:#143a55;
  --c-sarbidea-deep:#1f5676;
  --c-aztertu-deep:#0a5f69;
  --c-partehartu-deep:#2b6b5d;
  --c-sortu-deep:#456c3b;

  --c-etika-soft:#eaf1f5;
  --c-sarbidea-soft:#eaf2f7;
  --c-aztertu-soft:#e4f2f3;
  --c-partehartu-soft:#e8f3f0;
  --c-sortu-soft:#eef4ec;

  --ink:#13262e;
  --ink-soft:#4a5e66;
  --ink-mute:#6f8189;
  --surface:#ffffff;
  --surface-2:#f2f6f7;
  --surface-3:#e6eef0;
  --rule:rgba(19,38,46,.13);
  --ok:#1f8a52;
  --ok-soft:#e6f7ed;
  --bad:#c73845;
  --bad-soft:#fdeef0;
  --warn:#b7791f;
  --warn-soft:#fff6e5;

  --font-mono:'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --r-lg:10px;
  --r-md:8px;
  --r-sm:6px;
}

/* ---------- Oinarria ---------- */
.pisa-page main{ background:#fff !important; }
.pisa-page .btn{ border-radius:var(--r-pill); gap:.5rem; }
.pisa-page .btn:focus-visible,
.pisa-page button:focus-visible,
.pisa-page a:focus-visible,
.pisa-page input:focus-visible,
.pisa-page textarea:focus-visible,
.pisa-page select:focus-visible{
  outline:3px solid var(--c-sarbidea);
  outline-offset:2px;
}
.pisa-page .btn-ghost{ border-color:var(--rule); }
.pisa-page .btn-ghost:hover{ border-color:var(--purple); }
.btn-dark{ background:var(--ink); color:#fff; }
.btn-dark:hover{ background:#0a222c; }
.btn[disabled]{ opacity:.45; cursor:not-allowed; transform:none; }

.mono{ font-family:var(--font-mono); }
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0; }

/* JS gabe edukia beti ikusgai: animazioa .js klasea dagoenean bakarrik */
.js .reveal{ opacity:0; transform:translateY(24px); transition:opacity .7s ease-out, transform .7s ease-out; }
.js .reveal.active{ opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){
  .reveal, .js .reveal{ opacity:1; transform:none; transition:none; }
}
/* Grid-eko umeek ez dezatela orria zabaldu (taulak, simulagailuak) */
.comp-main > *, .comp-layout > *, .grid-2 > *, .grid-3 > *, .demo-wrap > *, .model-wrap > *{ min-width:0; }

/* ---------- Hero ---------- */
.pisa-hero{
  position:relative;
  overflow:hidden;
  background:var(--purple-deep);
  color:#fff;
  padding:4.5rem 0 3.5rem;
  isolation:isolate;
}
.pisa-hero::before{
  content:"";
  position:absolute; inset:0;
  background:
    linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
  background-size:40px 40px;
  mask-image:linear-gradient(180deg, #000 30%, transparent 100%);
  z-index:-1;
}
.pisa-hero::after{
  content:"";
  position:absolute; right:-10%; top:-30%;
  width:60vw; height:60vw; max-width:820px; max-height:820px;
  background:radial-gradient(circle, rgba(24,195,189,.22), transparent 60%);
  z-index:-1;
}
.pisa-hero.compact{ padding:3rem 0 2.5rem; }
.pisa-hero .crumbs{
  display:flex; flex-wrap:wrap; gap:.5rem; align-items:center;
  font-size:.9rem; color:rgba(255,255,255,.72); margin-bottom:1.1rem;
}
.pisa-hero .crumbs a:hover{ color:#fff; text-decoration:underline; }
.pisa-hero .crumbs strong{ color:#fff; font-weight:600; }
.pisa-eyebrow{
  display:inline-flex; align-items:center; gap:.6rem;
  font-family:var(--font-mono); font-size:.8rem; letter-spacing:.08em; text-transform:uppercase;
  color:rgba(255,255,255,.85);
  padding:.4rem .8rem; border:1px solid rgba(255,255,255,.2); border-radius:var(--r-pill);
  margin-bottom:1.2rem;
}
.pisa-eyebrow .pulse{
  width:8px; height:8px; border-radius:50%; background:var(--teal);
  box-shadow:0 0 0 0 rgba(24,195,189,.6); animation:pulse 2.2s infinite;
}
@keyframes pulse{ 0%{box-shadow:0 0 0 0 rgba(24,195,189,.6)} 70%{box-shadow:0 0 0 10px rgba(24,195,189,0)} 100%{box-shadow:0 0 0 0 rgba(24,195,189,0)} }
.pisa-hero h1{
  font-family:var(--font-display);
  font-size:clamp(2.4rem, 5.6vw, 5rem);
  line-height:.95; letter-spacing:-.045em;
  max-width:16ch; margin-bottom:1.2rem;
}
.pisa-hero.compact h1{ font-size:clamp(2.1rem, 4.4vw, 3.6rem); max-width:22ch; }
.pisa-hero h1 em{ font-style:normal; color:var(--teal); }
.pisa-hero .lead{ font-size:1.15rem; color:rgba(255,255,255,.84); max-width:62ch; }
.pisa-hero .hero-actions{ display:flex; flex-wrap:wrap; gap:.8rem; margin-top:2rem; }
.pisa-hero .btn-secondary{ border-color:rgba(255,255,255,.4); }
.pisa-hero-grid{ display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr); gap:3rem; align-items:end; }
.hero-meta{ display:flex; flex-wrap:wrap; gap:.5rem; margin-top:1.4rem; }
.hero-meta span{
  font-size:.85rem; font-weight:600; padding:.35rem .7rem; border-radius:var(--r-pill);
  background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.14);
}

/* Hero: 2029 txartela */
.countdown-card{
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.14);
  border-radius:var(--r-lg);
  padding:1.5rem;
  backdrop-filter:blur(6px);
}
.countdown-card .label{ font-family:var(--font-mono); font-size:.75rem; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.7); }
.countdown-big{ font-family:var(--font-display); font-size:clamp(3.5rem, 7vw, 5.5rem); line-height:.9; letter-spacing:-.05em; margin:.4rem 0 .2rem; }
.countdown-big small{ font-size:1.1rem; letter-spacing:0; color:rgba(255,255,255,.75); font-family:var(--font-body); font-weight:500; margin-left:.4rem; }
.comp-bars{ display:grid; gap:.45rem; margin-top:1.2rem; }
.comp-bar{ display:grid; grid-template-columns:1fr auto; gap:.8rem; align-items:center; font-size:.85rem; color:rgba(255,255,255,.85); }
.comp-bar .track{ grid-column:1 / -1; height:6px; border-radius:6px; background:rgba(255,255,255,.12); overflow:hidden; }
.comp-bar .fill{ height:100%; border-radius:6px; }

/* ---------- Azpi-nabigazioa ---------- */
/* Irakurtzean goiburu bakarra: webgunearena gora joaten da eta azpi-nabigazioa geratzen da.
   Mugikorrean alderantziz (goiburuak Menua botoia du eta azpi-nabigazioa ez da itsasten). */
@media (min-width: 901px){
  .pisa-page .site-header{ position:relative; }
}
.pisa-subnav{
  position:sticky; top:0; z-index:40;
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--rule);
}
.pisa-subnav .container{ display:flex; align-items:center; gap:1rem; }
.pisa-subnav .tag{
  flex:none; font-family:var(--font-mono); font-size:.72rem; font-weight:600; letter-spacing:.06em;
  color:#fff; background:var(--ink); padding:.3rem .55rem; border-radius:6px;
}
.pisa-subnav nav{
  display:flex; gap:.2rem; overflow-x:auto; scrollbar-width:none; padding:.55rem 0;
  -webkit-overflow-scrolling:touch;
}
.pisa-subnav nav::-webkit-scrollbar{ display:none; }
.pisa-subnav nav a{
  flex:none; font-size:.9rem; font-weight:600; color:var(--ink-soft);
  padding:.45rem .8rem; border-radius:var(--r-pill); white-space:nowrap;
  transition:background .15s, color .15s;
}
.pisa-subnav nav a:hover{ color:var(--ink); background:var(--surface-3); }
.pisa-subnav nav a.active{ color:#fff; background:var(--purple); }

/* ---------- Atalak ---------- */
.p-section{ padding:6rem 0; }
.p-section.tight{ padding:4rem 0; }
.p-section.alt{ background:var(--surface-2) !important; }
.p-section.ink{ background:var(--ink) !important; color:#fff; }
.p-section.ink .p-head p{ color:rgba(255,255,255,.75); }
.p-head{ max-width:760px; margin-bottom:3.25rem; }
.p-head .kicker{
  display:inline-block; font-family:var(--font-mono); font-size:.78rem; font-weight:600;
  letter-spacing:.08em; text-transform:uppercase; color:var(--purple); margin-bottom:.8rem;
}
.p-section.ink .p-head .kicker{ color:var(--teal); }
.p-head h2{
  font-family:var(--font-display); font-size:clamp(1.9rem, 3.6vw, 3rem);
  line-height:1; letter-spacing:-.04em; margin-bottom:1rem;
}
.p-head p{ color:var(--ink-soft); font-size:1.1rem; line-height:1.7; }
.p-head.center{ margin-inline:auto; text-align:center; }

.prose p{ color:var(--ink-soft); font-size:1.075rem; line-height:1.8; margin-bottom:1.4rem; max-width:68ch; }
.prose p strong{ color:var(--ink); }
.prose h3{ font-family:var(--font-display); font-size:1.45rem; letter-spacing:-.02em; margin:2.75rem 0 1rem; color:var(--ink); }
.prose ul.dots{ list-style:disc; padding-left:1.3rem; display:grid; gap:.7rem; margin:0 0 1.4rem; color:var(--ink-soft); font-size:1.05rem; line-height:1.7; max-width:68ch; }
.prose ol.nums{ list-style:decimal; padding-left:1.3rem; display:grid; gap:.7rem; margin:0 0 1.4rem; color:var(--ink-soft); font-size:1.05rem; line-height:1.7; max-width:68ch; }

/* ---------- Txartelak ---------- */
.p-card{
  background:var(--surface);
  border:1px solid var(--rule);
  border-radius:var(--r-lg);
  padding:2rem;
}
.p-card.soft{ background:var(--surface-2); border-color:transparent; }
.p-card h3{ font-family:var(--font-display); font-size:1.35rem; line-height:1.15; letter-spacing:-.02em; margin-bottom:.8rem; }
.p-card p{ color:var(--ink-soft); line-height:1.7; }
.grid-2{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:1.75rem; }
.grid-3{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:1.75rem; }
.grid-4{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:1.5rem; }
.grid-5{ display:grid; grid-template-columns:repeat(5, minmax(0,1fr)); gap:1.25rem; }
.stack{ display:grid; gap:1.25rem; }

.note{
  border-radius:var(--r-md); padding:1.4rem 1.6rem; background:var(--surface-3);
  border-left:5px solid var(--purple); color:var(--ink);
}
.note.warn{ background:var(--warn-soft); border-left-color:var(--warn); }
.note.ok{ background:var(--ok-soft); border-left-color:var(--ok); }
.note.bad{ background:var(--bad-soft); border-left-color:var(--bad); }
.note strong{ display:block; font-family:var(--font-display); margin-bottom:.2rem; }
.note p{ color:var(--ink-soft); margin:0; line-height:1.7; }

/* Ibilbide txartelak (hub) */
.path-card{
  position:relative; display:flex; flex-direction:column; gap:.7rem;
  background:var(--surface); border:1px solid var(--rule); border-radius:var(--r-lg);
  padding:1.9rem; min-height:100%;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s;
}
.path-card:hover{ transform:translateY(-4px); box-shadow:0 18px 40px rgba(19,38,46,.12); border-color:transparent; }
.path-card .icon{
  width:52px; height:52px; border-radius:14px; display:grid; place-items:center;
  font-size:1.5rem; background:var(--surface-3);
}
.path-card h3{ font-family:var(--font-display); font-size:1.4rem; line-height:1.05; letter-spacing:-.02em; }
.path-card p{ color:var(--ink-soft); font-size:.97rem; flex:1; }
.path-card .go{ font-weight:700; color:var(--purple); display:inline-flex; gap:.35rem; align-items:center; }
.path-card:hover .go{ gap:.6rem; }
.path-card .count{ position:absolute; top:1.3rem; right:1.3rem; font-family:var(--font-mono); font-size:.75rem; color:var(--ink-mute); }
.path-card.feature{ background:var(--ink); color:#fff; border-color:var(--ink); }
.path-card.feature p{ color:rgba(255,255,255,.75); }
.path-card.feature .go{ color:var(--teal); }
.path-card.feature .icon{ background:rgba(255,255,255,.1); }
.path-card.feature .count{ color:rgba(255,255,255,.5); }

/* ---------- Gaitasunak ---------- */
.chip{
  display:inline-flex; align-items:center; gap:.4rem;
  font-size:.78rem; font-weight:700; line-height:1;
  padding:.38rem .65rem; border-radius:var(--r-pill);
  background:var(--surface-3); color:var(--ink);
  white-space:nowrap;
}
.chip::before{ content:""; width:8px; height:8px; border-radius:50%; background:currentColor; opacity:.9; }
.chip.plain::before{ display:none; }
.chip[data-c="etika"]{ background:var(--c-etika-soft); color:#1d4e6e; }
.chip[data-c="sarbidea"]{ background:var(--c-sarbidea-soft); color:#1f6e9c; }
.chip[data-c="aztertu"]{ background:var(--c-aztertu-soft); color:#b72a44; }
.chip[data-c="partehartu"]{ background:var(--c-partehartu-soft); color:#8a5714; }
.chip[data-c="sortu"]{ background:var(--c-sortu-soft); color:#0b746f; }

.comp-card{
  --cc:var(--purple);
  --cs:var(--surface-3);
  display:flex; flex-direction:column;
  border-radius:var(--r-lg); overflow:hidden; background:#fff; border:1px solid var(--rule);
  transition:transform .18s, box-shadow .18s;
}
.comp-card:hover{ transform:translateY(-4px); box-shadow:0 18px 40px rgba(19,38,46,.12); }
.comp-card .top{ background:var(--cc); color:#fff; padding:1.3rem 1.3rem 1.1rem; position:relative; min-height:150px; display:flex; flex-direction:column; justify-content:space-between; }
.comp-card .top .num{ font-family:var(--font-mono); font-size:.75rem; letter-spacing:.08em; opacity:.85; }
.comp-card .top h3{ font-family:var(--font-display); font-size:1.35rem; line-height:1.02; letter-spacing:-.02em; }
.comp-card .top .glyph{ position:absolute; right:1rem; top:.9rem; font-size:1.8rem; opacity:.95; }
.comp-card .body{ padding:1.4rem 1.5rem 1.5rem; display:flex; flex-direction:column; gap:.7rem; flex:1; }
.comp-card .body p{ color:var(--ink-soft); font-size:.95rem; line-height:1.65; flex:1; }
.comp-card .body .go{ font-weight:700; font-size:.9rem; color:var(--ink); }
.comp-card .weight{ font-family:var(--font-mono); font-size:.72rem; color:var(--ink-mute); }
[data-c="etika"]{ --cc:var(--c-etika-deep); --cs:var(--c-etika-soft); }
[data-c="sarbidea"]{ --cc:var(--c-sarbidea-deep); --cs:var(--c-sarbidea-soft); }
[data-c="aztertu"]{ --cc:var(--c-aztertu-deep); --cs:var(--c-aztertu-soft); }
[data-c="partehartu"]{ --cc:var(--c-partehartu-deep); --cs:var(--c-partehartu-soft); }
[data-c="sortu"]{ --cc:var(--c-sortu-deep); --cs:var(--c-sortu-soft); }

/* Proba-saioa: erantzunak ezkutatuta amaierara arte */
.item.silent.done .item-body{ display:none; }
.item.silent.done .item-head::after{
  content:"✓ Erantzuna gordeta"; font-size:.82rem; font-weight:700; color:var(--ok);
}

/* Gaitasun-eredua (diagrama) */
.model-wrap{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:3rem; align-items:center; }
.model-svg{ width:100%; height:auto; max-width:520px; margin-inline:auto; display:block; }
.model-svg text{ font-family:var(--font-body); }
.model-legend{ display:grid; gap:.8rem; }
.model-legend button{
  text-align:left; background:#fff; border:1px solid var(--rule); border-radius:var(--r-md);
  padding:1rem 1.1rem; cursor:pointer; display:grid; gap:.25rem; color:var(--ink);
  transition:border-color .15s, box-shadow .15s;
}
.model-legend button:hover, .model-legend button.on{ border-color:var(--purple); box-shadow:0 8px 20px rgba(19,38,46,.08); }
.model-legend button strong{ font-family:var(--font-display); font-size:1.05rem; display:flex; gap:.5rem; align-items:center; }
.model-legend button span{ color:var(--ink-soft); font-size:.9rem; }
.model-legend .dot{ width:12px; height:12px; border-radius:50%; flex:none; }

/* Maila-progresioa */
.levels{ display:grid; gap:1rem; }
.level{
  display:grid; grid-template-columns:130px minmax(0,1fr); gap:1rem; align-items:start;
  padding:1.3rem 1.5rem; border-radius:var(--r-md); background:var(--surface-2);
}
.level .lv{ display:flex; flex-direction:column; gap:.35rem; }
.level .lv b{ font-family:var(--font-display); font-size:1rem; }
.level .bars{ display:flex; gap:3px; }
.level .bars i{ width:22px; height:6px; border-radius:3px; background:var(--rule); }
.level .bars i.on{ background:var(--purple); }
.level p{ color:var(--ink-soft); font-size:.98rem; line-height:1.7; margin:0; }

/* Taulak */
.p-table-wrap{ overflow-x:auto; border:1px solid var(--rule); border-radius:var(--r-md); }
.p-table{ width:100%; border-collapse:collapse; font-size:.95rem; min-width:560px; }
.p-table th, .p-table td{ text-align:left; padding:1.1rem 1.25rem; line-height:1.6; border-bottom:1px solid var(--rule); vertical-align:top; }
.p-table th{ background:var(--surface-3); font-family:var(--font-display); font-weight:700; color:var(--ink); }
.p-table td{ color:var(--ink-soft); }
.p-table tr:last-child td{ border-bottom:none; }
.p-table td:first-child{ color:var(--ink); font-weight:600; }

/* Akordeoia */
details.acc{ border:1px solid var(--rule); border-radius:var(--r-md); background:#fff; }
details.acc + details.acc{ margin-top:.85rem; }
details.acc summary{
  list-style:none; cursor:pointer; padding:1.2rem 1.4rem; font-weight:700; color:var(--ink);
  display:flex; justify-content:space-between; gap:1rem; align-items:center;
}
details.acc summary::-webkit-details-marker{ display:none; }
details.acc summary::after{ content:"+"; font-family:var(--font-mono); font-size:1.2rem; color:var(--ink-mute); }
details.acc[open] summary::after{ content:"–"; }
details.acc .acc-body{ padding:.2rem 1.4rem 1.5rem; color:var(--ink-soft); line-height:1.7; }
details.acc .acc-body p{ margin-bottom:.9rem; }

/* Fitxak (tabs) */
.p-tabs{ display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:1.75rem; }
.p-tab{
  border:1.5px solid var(--rule); background:#fff; color:var(--ink-soft);
  font-weight:600; font-size:.9rem; padding:.55rem 1rem; border-radius:var(--r-pill); cursor:pointer;
}
.p-tab:hover{ color:var(--ink); border-color:var(--purple-soft); }
.p-tab.active{ background:var(--ink); border-color:var(--ink); color:#fff; }
.p-panel{ display:none; }
.p-panel.active{ display:block; }

/* ---------- Gaitasun-orriaren diseinua ---------- */
.comp-layout{ display:grid; grid-template-columns:240px minmax(0,1fr); gap:4.5rem; align-items:start; }
.comp-toc{ position:sticky; top:96px; display:grid; gap:1rem; }
.comp-toc .p-card{ padding:1.2rem; }
.comp-toc h4{ font-family:var(--font-mono); font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-mute); margin-bottom:.6rem; }
.comp-toc ol{ display:grid; gap:.1rem; counter-reset:toc; }
.comp-toc ol a{ display:block; padding:.4rem .5rem; border-radius:8px; color:var(--ink-soft); font-weight:600; font-size:.92rem; }
.comp-toc ol a:hover{ background:var(--surface-3); color:var(--ink); }
.comp-toc ol a.on{ background:var(--surface-3); color:var(--ink); }
.comp-toc .note{ padding:1.1rem 1.2rem; }
.comp-toc .note p{ font-size:.92rem; line-height:1.6; }
.comp-main{ min-width:0; display:grid; gap:6rem; }
.comp-main > section{ scroll-margin-top:24px; }
.block-title{ display:flex; align-items:baseline; gap:.8rem; margin-bottom:1.75rem; }
.block-title .n{ font-family:var(--font-mono); font-size:.8rem; color:var(--ink-mute); }
.block-title h2{ font-family:var(--font-display); font-size:clamp(1.6rem, 2.8vw, 2.2rem); letter-spacing:-.03em; line-height:1.05; }

.def-box{
  border-radius:var(--r-lg); padding:2.25rem; color:#fff; position:relative; overflow:hidden;
  background:var(--cc, var(--purple));
}
.def-box .label{ font-family:var(--font-mono); font-size:.75rem; letter-spacing:.08em; text-transform:uppercase; opacity:.85; }
.def-box blockquote{ font-family:var(--font-display); font-size:clamp(1.25rem, 2.2vw, 1.7rem); line-height:1.2; letter-spacing:-.02em; margin-top:.6rem; }
.def-box .src{ font-size:.82rem; opacity:.8; margin-top:.8rem; }

.strategy{ display:grid; grid-template-columns:48px minmax(0,1fr); gap:1.2rem; padding:1.5rem; border-radius:var(--r-md); background:var(--surface-2); }
.strategy .ic{ width:48px; height:48px; border-radius:12px; background:#fff; display:grid; place-items:center; font-size:1.35rem; border:1px solid var(--rule); }
.strategy h4{ font-family:var(--font-display); font-size:1.08rem; margin-bottom:.45rem; }
.strategy p{ color:var(--ink-soft); font-size:.97rem; line-height:1.7; margin:0; }

/* Adibide ebatzia */
.worked{ border:1px solid var(--rule); border-radius:var(--r-lg); overflow:hidden; background:#fff; }
.worked-head{ padding:1rem 1.4rem; background:var(--surface-3); display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; align-items:center; }
.worked-head strong{ font-family:var(--font-display); font-size:1.1rem; }
.worked-body{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
.worked-body > div{ padding:1.75rem; }
.worked-body > div + div{ border-left:1px solid var(--rule); background:var(--surface-2); }
.think-steps{ display:grid; gap:1.2rem; counter-reset:step; }
.think-steps li{ position:relative; padding-left:2.4rem; color:var(--ink-soft); font-size:.97rem; line-height:1.7; }
.think-steps li::before{
  counter-increment:step; content:counter(step);
  position:absolute; left:0; top:-.1rem; width:1.7rem; height:1.7rem; border-radius:50%;
  background:var(--ink); color:#fff; font-family:var(--font-mono); font-size:.8rem; display:grid; place-items:center;
}
.think-steps li strong{ color:var(--ink); }

/* ---------- Estimuluak (errealismoa) ---------- */
.stim{ font-family:var(--font-body); color:#13262e; }
.stim-frame{ border:1px solid var(--rule); border-radius:var(--r-md); background:#fff; overflow:hidden; box-shadow:0 1px 0 rgba(0,0,0,.02); }
.stim-cap{ font-family:var(--font-mono); font-size:.7rem; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-mute); margin-bottom:.4rem; display:flex; align-items:center; gap:.4rem; }

/* Sare sozialeko argitalpena */
.post{ max-width:520px; }
.post-head{ display:flex; align-items:center; gap:.7rem; padding:.9rem 1rem .5rem; }
.avatar{ width:40px; height:40px; border-radius:50%; flex:none; display:grid; place-items:center; color:#fff; font-weight:700; font-size:.95rem; }
.post-head .who{ display:flex; flex-direction:column; line-height:1.2; min-width:0; }
.post-head .who b{ font-size:.95rem; display:flex; align-items:center; gap:.3rem; }
.post-head .who span{ font-size:.8rem; color:#5b6b72; }
.verified{ width:15px; height:15px; border-radius:50%; background:#2369a6; color:#fff; font-size:.6rem; display:inline-grid; place-items:center; }
.post-body{ padding:.2rem 1rem .8rem; font-size:.97rem; line-height:1.5; }
.post-body .tagline{ color:#3d6fd6; }
.post-media{ aspect-ratio:16/9; display:grid; place-items:center; color:#fff; font-family:var(--font-display); font-size:1.4rem; text-align:center; padding:1rem; position:relative; }
.post-media .media-label{ position:absolute; left:.6rem; bottom:.6rem; font-family:var(--font-body); font-size:.72rem; font-weight:600; background:rgba(0,0,0,.55); padding:.2rem .5rem; border-radius:6px; }
.post-sponsored{ font-size:.75rem; color:#5b6b72; padding:0 1rem .4rem; }
.post-foot{ display:flex; gap:1.2rem; padding:.6rem 1rem .8rem; border-top:1px solid #eee; font-size:.82rem; color:#5b6b72; }
.post-comments{ border-top:1px solid #eee; padding:.6rem 1rem .8rem; display:grid; gap:.45rem; font-size:.86rem; }
.post-comments p b{ margin-right:.3rem; }

/* Posta elektronikoa */
.email-head{ padding:1rem 1.1rem; border-bottom:1px solid #eee; display:grid; gap:.25rem; font-size:.88rem; }
.email-head .subj{ font-size:1.05rem; font-weight:700; margin-bottom:.3rem; }
.email-head span{ color:#5b6b72; }
.email-head code{ font-family:var(--font-mono); font-size:.82rem; background:#f5f9f9; padding:.05rem .3rem; border-radius:4px; color:#13262e; }
.email-body{ padding:1.1rem; font-size:.95rem; line-height:1.6; display:grid; gap:.7rem; }
.email-btn{ display:inline-block; background:#1c64d6; color:#fff; padding:.55rem 1rem; border-radius:6px; font-weight:600; font-size:.9rem; }

/* Txata */
.chat{ background:#f2f6f7; padding:1rem; display:grid; gap:.55rem; max-width:560px; }
.chat .bubble{ max-width:82%; padding:.6rem .8rem; border-radius:14px; font-size:.93rem; line-height:1.45; background:#fff; box-shadow:0 1px 0 rgba(0,0,0,.04); }
.chat .bubble > b:first-child{ display:block; font-size:.76rem; margin-bottom:.1rem; }
.chat .bubble.me{ justify-self:end; background:#d9f5ea; }
.chat .bubble.sys{ justify-self:center; background:transparent; box-shadow:none; color:#5b6b72; font-size:.8rem; }
.chat .chat-title{ font-weight:700; font-size:.9rem; padding-bottom:.4rem; border-bottom:1px solid rgba(0,0,0,.06); display:flex; justify-content:space-between; }
.chat .chat-title span{ color:#5b6b72; font-weight:500; font-size:.8rem; }

/* Bilaketa-emaitzak */
.serp{ padding:1rem 1.1rem; display:grid; gap:1rem; }
.serp-q{ display:flex; align-items:center; gap:.5rem; border:1px solid #ddd; border-radius:var(--r-pill); padding:.5rem .9rem; font-size:.93rem; }
.serp-r{ display:grid; gap:.1rem; }
.serp-r .url{ font-size:.78rem; color:#44555c; display:flex; align-items:center; gap:.4rem; flex-wrap:wrap; }
.serp-r .ad{ font-weight:700; color:#13262e; font-size:.75rem; }
.serp-r .t{ color:#1a4fc4; font-size:1.05rem; font-weight:500; }
.serp-r .d{ font-size:.88rem; color:#44555c; }
.ai-overview{ background:#eef6f6; border-radius:12px; padding:.9rem 1rem; font-size:.9rem; line-height:1.5; }
.ai-overview .h{ font-weight:700; font-size:.82rem; display:flex; gap:.4rem; align-items:center; margin-bottom:.35rem; }

/* AA txatbota */
.ai-chat{ padding:1rem; display:grid; gap:.8rem; }
.ai-chat .u{ justify-self:end; background:#eaf1f2; padding:.6rem .85rem; border-radius:14px; font-size:.93rem; max-width:85%; }
.ai-chat .a{ display:grid; grid-template-columns:30px minmax(0,1fr); gap:.6rem; font-size:.93rem; line-height:1.55; }
.ai-chat .a .logo{ width:30px; height:30px; border-radius:50%; background:linear-gradient(135deg,#2e97a0,#0b8480); display:grid; place-items:center; color:#fff; font-size:.8rem; }
.ai-chat .a ul{ list-style:disc; padding-left:1.1rem; display:grid; gap:.2rem; }
.ai-chat .disclaimer{ font-size:.72rem; color:#5b6b72; text-align:center; }

/* Artikulua */
.article{ padding:1.3rem 1.4rem; }
.article .outlet{ font-family:var(--font-display); font-weight:800; letter-spacing:-.02em; font-size:1.05rem; padding-bottom:.6rem; border-bottom:3px solid #13262e; margin-bottom:.9rem; display:flex; justify-content:space-between; align-items:baseline; gap:1rem; }
.article .outlet small{ font-family:var(--font-body); font-weight:500; font-size:.75rem; color:#5b6b72; }
.article h4{ font-family:Georgia, 'Times New Roman', serif; font-size:1.45rem; line-height:1.2; margin-bottom:.5rem; }
.article .byline{ font-size:.8rem; color:#5b6b72; margin-bottom:.8rem; }
.article p{ font-family:Georgia, serif; font-size:.98rem; line-height:1.65; margin-bottom:.7rem; color:#1f3640; }

/* Leiho modala (cookie, baimenak) */
.dialog-stim{ max-width:420px; margin-inline:auto; padding:1.2rem 1.2rem 1rem; display:grid; gap:.7rem; border-radius:16px; }
.dialog-stim h5{ font-size:1.02rem; }
.dialog-stim p{ font-size:.88rem; color:#44555c; }
.dialog-stim .row{ display:flex; gap:.5rem; flex-wrap:wrap; }
.dialog-stim .fake-btn{ font-size:.85rem; font-weight:600; padding:.5rem .9rem; border-radius:8px; background:#eaf1f2; }
.dialog-stim .fake-btn.primary{ background:#1c64d6; color:#fff; }
.dialog-stim .perm{ display:flex; justify-content:space-between; font-size:.88rem; padding:.45rem 0; border-bottom:1px solid #eee; }

/* Grafikoa */
.chart-stim{ padding:1rem 1.2rem; }
.chart-stim h5{ font-size:1rem; margin-bottom:.2rem; }
.chart-stim .src{ font-size:.75rem; color:#5b6b72; margin-top:.4rem; }
.chart-stim svg{ width:100%; height:auto; display:block; }

/* Testu hutsa */
.text-stim{ padding:1.1rem 1.2rem; font-size:.97rem; line-height:1.6; }

/* ---------- Ariketa motorra ---------- */
.item{
  border:1px solid var(--rule); border-radius:var(--r-lg); background:#fff; overflow:hidden;
}
.item-head{
  display:flex; justify-content:space-between; align-items:center; gap:.8rem; flex-wrap:wrap;
  padding:.85rem 1.3rem; border-bottom:1px solid var(--rule); background:var(--surface-2);
}
.item-head .left{ display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; }
.item-code{ font-family:var(--font-mono); font-size:.75rem; color:var(--ink-mute); letter-spacing:.04em; }
.item-level{ display:inline-flex; gap:3px; align-items:center; font-size:.75rem; color:var(--ink-mute); }
.item-level i{ width:7px; height:14px; border-radius:2px; background:var(--rule); }
.item-level i.on{ background:var(--ink); }
.item-body{ display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); }
.item-body.single-col{ grid-template-columns:1fr; }
.item-stim{ padding:1.3rem; background:#eef4f5; border-right:1px solid var(--rule); min-width:0; display:grid; gap:.9rem; align-content:start; }
.item-task{ padding:1.3rem; min-width:0; display:flex; flex-direction:column; gap:1rem; }
.item-scenario{ font-size:.95rem; color:var(--ink-soft); }
.item-q{ font-family:var(--font-display); font-size:1.18rem; line-height:1.2; letter-spacing:-.01em; color:var(--ink); }
.item-hint{ font-size:.82rem; color:var(--ink-mute); margin-top:-.5rem; }

.opts{ display:grid; gap:.5rem; }
.opt{
  display:flex; gap:.7rem; align-items:flex-start; text-align:left; width:100%;
  border:1.5px solid var(--rule); background:#fff; border-radius:12px;
  padding:.75rem .9rem; cursor:pointer; color:var(--ink); font-size:.95rem; line-height:1.4;
  transition:border-color .12s, background .12s;
}
.opt:hover:not([disabled]){ border-color:var(--purple); background:var(--surface-3); }
.opt .mark{
  flex:none; width:22px; height:22px; border-radius:50%; border:1.5px solid var(--ink-mute);
  display:grid; place-items:center; font-size:.72rem; font-family:var(--font-mono); color:var(--ink-mute); margin-top:.05rem;
}
.opt.multi .mark{ border-radius:6px; }
.opt.sel{ border-color:var(--ink); background:var(--surface-3); }
.opt.sel .mark{ background:var(--ink); border-color:var(--ink); color:#fff; }
.opt.right{ border-color:var(--ok); background:var(--ok-soft); }
.opt.right .mark{ background:var(--ok); border-color:var(--ok); color:#fff; }
.opt.wrong{ border-color:var(--bad); background:var(--bad-soft); }
.opt.wrong .mark{ background:var(--bad); border-color:var(--bad); color:#fff; }
.opt.missed{ border-style:dashed; border-color:var(--ok); }
.opt[disabled]{ cursor:default; }
.opt-why{ display:none; font-size:.85rem; color:var(--ink-soft); margin:-.2rem 0 .3rem 2.4rem; }
.item.done .opt-why{ display:block; }

/* Sailkatu */
.classify{ display:grid; gap:.55rem; }
.classify-row{
  display:grid; grid-template-columns:minmax(0,1fr) auto; gap:.8rem; align-items:center;
  padding:.65rem .8rem; border:1px solid var(--rule); border-radius:12px; background:#fff;
}
.classify-row .txt{ font-size:.93rem; color:var(--ink); }
.classify-row .txt small{ display:block; color:var(--ink-mute); font-size:.8rem; }
.seg{ display:inline-flex; border:1.5px solid var(--rule); border-radius:var(--r-pill); overflow:hidden; flex-wrap:nowrap; }
.seg button{ border:none; background:#fff; padding:.45rem .75rem; font-size:.82rem; font-weight:600; color:var(--ink-soft); cursor:pointer; white-space:nowrap; }
.seg button + button{ border-left:1.5px solid var(--rule); }
.seg button.sel{ background:var(--ink); color:#fff; }
.seg button.right{ background:var(--ok); color:#fff; }
.seg button.wrong{ background:var(--bad); color:#fff; }
.seg button.missed{ box-shadow:inset 0 0 0 2px var(--ok); color:var(--ok); }
.classify-row .why{ grid-column:1 / -1; font-size:.84rem; color:var(--ink-soft); display:none; border-top:1px dashed var(--rule); padding-top:.45rem; }
.item.done .classify-row .why{ display:block; }

/* Lotu (match) */
.match-row{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:.6rem; align-items:center; padding:.55rem .7rem; border:1px solid var(--rule); border-radius:12px; }
.match-row select{ width:100%; font:inherit; font-size:.9rem; padding:.5rem .6rem; border:1.5px solid var(--rule); border-radius:10px; background:#fff; color:var(--ink); }
.match-row.right{ border-color:var(--ok); background:var(--ok-soft); }
.match-row.wrong{ border-color:var(--bad); background:var(--bad-soft); }
.match-row .fix{ grid-column:1 / -1; font-size:.84rem; color:var(--ok); display:none; }
.match-row.wrong .fix{ display:block; }

/* Ordenatu */
.order-list{ display:grid; gap:.45rem; }
.order-item{ display:grid; grid-template-columns:30px minmax(0,1fr) auto; gap:.6rem; align-items:center; padding:.6rem .7rem; border:1.5px solid var(--rule); border-radius:12px; background:#fff; font-size:.93rem; }
.order-item .pos{ font-family:var(--font-mono); font-size:.8rem; color:var(--ink-mute); text-align:center; }
.order-item .mv{ display:flex; gap:.25rem; }
.order-item .mv button{ width:32px; height:32px; border-radius:8px; border:1.5px solid var(--rule); background:#fff; cursor:pointer; font-size:.9rem; color:var(--ink); }
.order-item .mv button:hover:not([disabled]){ border-color:var(--purple); }
.order-item.right{ border-color:var(--ok); background:var(--ok-soft); }
.order-item.wrong{ border-color:var(--bad); background:var(--bad-soft); }

/* Nabarmendu (highlight) */
.hl-text{ font-size:1rem; line-height:2; color:var(--ink); padding:1rem 1.1rem; background:#fff; border:1px solid var(--rule); border-radius:12px; }
.hl-seg{ cursor:pointer; border-radius:5px; padding:.1rem .1rem; transition:background .12s; box-decoration-break:clone; -webkit-box-decoration-break:clone; }
.hl-seg.target:hover, .hl-seg.plain:hover{ background:#fff3b0; }
.hl-seg.sel{ background:#ffe066; }
.hl-seg.right{ background:#bfeccf; }
.hl-seg.wrong{ background:#f8c5cb; text-decoration:line-through; }
.hl-seg.missed{ box-shadow:inset 0 -3px 0 var(--ok); }
.item.done .hl-seg{ cursor:default; }

/* Erantzun irekia */
.open-area textarea, .p-input, .p-textarea, .p-select{
  width:100%; font:inherit; font-size:.95rem; color:var(--ink);
  border:1.5px solid var(--rule); border-radius:12px; padding:.75rem .9rem; background:#fff;
}
.open-area textarea, .p-textarea{ min-height:120px; resize:vertical; line-height:1.5; }
.open-area .counter{ font-size:.78rem; color:var(--ink-mute); text-align:right; margin-top:.25rem; }
.rubric{ display:none; gap:.5rem; }
.item.revealed .rubric{ display:grid; }
.rubric .model{ padding:.9rem 1rem; background:var(--ok-soft); border-radius:12px; font-size:.92rem; color:var(--ink); }
.rubric .model b{ display:block; font-size:.8rem; font-family:var(--font-mono); letter-spacing:.04em; text-transform:uppercase; color:var(--ok); margin-bottom:.2rem; }
.rubric label{ display:flex; gap:.6rem; align-items:flex-start; font-size:.92rem; color:var(--ink); padding:.5rem .6rem; border-radius:10px; border:1px solid var(--rule); cursor:pointer; }
.rubric label input{ margin-top:.2rem; accent-color:var(--ink); width:16px; height:16px; }

/* Oinak eta feedbacka */
.item-actions{ display:flex; gap:.6rem; flex-wrap:wrap; align-items:center; margin-top:auto; }
.item-feedback{ display:none; border-radius:12px; padding:.9rem 1rem; font-size:.93rem; }
.item.done .item-feedback{ display:block; }
.item-feedback.good{ background:var(--ok-soft); color:#155d38; }
.item-feedback.part{ background:var(--warn-soft); color:#7a4f10; }
.item-feedback.bad{ background:var(--bad-soft); color:#8c2530; }
.item-feedback b{ display:block; font-family:var(--font-display); font-size:1.02rem; margin-bottom:.2rem; }
.item-feedback p{ color:var(--ink); margin:.3rem 0 0; }
.item-feedback .tip{ margin-top:.5rem; font-size:.86rem; color:var(--ink-soft); }

/* ---------- Ariketa-bankua ---------- */
.bank-toolbar{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)) auto; gap:.7rem; align-items:end; padding:1.2rem; border:1px solid var(--rule); border-radius:var(--r-lg); background:var(--surface-2); margin-bottom:1.5rem; }
.bank-toolbar label{ display:grid; gap:.3rem; font-size:.78rem; font-weight:700; color:var(--ink-soft); font-family:var(--font-mono); letter-spacing:.04em; text-transform:uppercase; }
.bank-toolbar select{ font:inherit; font-size:.92rem; text-transform:none; letter-spacing:0; font-family:var(--font-body); font-weight:500; padding:.6rem .7rem; border:1.5px solid var(--rule); border-radius:10px; background:#fff; color:var(--ink); }
.bank-count{ font-size:.9rem; color:var(--ink-soft); margin-bottom:1rem; }
.bank-list{ display:grid; gap:1.5rem; }

/* Proba-saioa */
.exam-bar{
  position:sticky; top:72px; z-index:30;
  display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap;
  padding:.8rem 1.1rem; background:var(--ink); color:#fff; border-radius:var(--r-md); margin-bottom:1.2rem;
}
.exam-bar .timer{ font-family:var(--font-mono); font-size:1.15rem; font-weight:600; }
.exam-bar .timer.low{ color:#ffb3bf; }
.exam-progress{ flex:1; min-width:140px; height:8px; background:rgba(255,255,255,.18); border-radius:8px; overflow:hidden; }
.exam-progress i{ display:block; height:100%; background:var(--teal); width:0; transition:width .3s; }
.exam-nav{ display:flex; justify-content:space-between; gap:.8rem; margin-top:1.2rem; flex-wrap:wrap; }

/* Txostena */
.report{ border-radius:var(--r-lg); border:1px solid var(--rule); overflow:hidden; background:#fff; }
.report-head{ background:var(--ink); color:#fff; padding:1.6rem; display:flex; justify-content:space-between; gap:1.5rem; flex-wrap:wrap; align-items:center; }
.report-head h3{ font-family:var(--font-display); font-size:1.7rem; letter-spacing:-.02em; }
.report-head .score{ font-family:var(--font-display); font-size:3rem; line-height:1; }
.report-head .score small{ font-size:1rem; opacity:.7; }
.report-body{ padding:1.6rem; display:grid; gap:1.4rem; }
.meter-row{ display:grid; grid-template-columns:200px minmax(0,1fr) 120px; gap:1rem; align-items:center; }
.meter-row .name{ font-weight:700; font-size:.93rem; }
.meter{ height:12px; background:var(--surface-3); border-radius:12px; overflow:hidden; position:relative; }
.meter i{ display:block; height:100%; border-radius:12px; }
.meter::before, .meter::after{ content:""; position:absolute; top:0; bottom:0; width:2px; background:#fff; z-index:1; }
.meter::before{ left:40%; }
.meter::after{ left:75%; }
.meter-row .lvl{ font-size:.82rem; font-weight:700; text-align:right; }
.meter-row .lvl.l1{ color:var(--bad); }
.meter-row .lvl.l2{ color:var(--warn); }
.meter-row .lvl.l3{ color:var(--ok); }

/* ---------- Progresioa ---------- */
.progress-strip{ display:grid; grid-template-columns:repeat(5, minmax(0,1fr)); gap:.8rem; }
.progress-cell{ padding:1rem; border-radius:var(--r-md); background:#fff; border:1px solid var(--rule); display:grid; gap:.45rem; }
.progress-cell .nm{ font-size:.82rem; font-weight:700; color:var(--ink); }
.progress-cell .val{ font-family:var(--font-mono); font-size:.8rem; color:var(--ink-mute); }
.progress-cell .meter::before, .progress-cell .meter::after{ display:none; }
.progress-cell .meter{ height:7px; }
.comp-toc [data-progress]{ gap:.9rem; }
.comp-toc .progress-cell{ padding:0; border:0; background:none; gap:.3rem; }
.comp-toc .progress-cell .meter{ height:5px; }
.comp-toc .progress-cell .val{ font-size:.72rem; }

/* ---------- Simulagailu txikiak (widget) ---------- */
.widget{ border:1px solid var(--rule); border-radius:var(--r-lg); overflow:hidden; background:#fff; }
.widget-head{ padding:1.1rem 1.4rem; background:var(--ink); color:#fff; display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; align-items:center; }
.widget-head h3{ font-family:var(--font-display); font-size:1.25rem; letter-spacing:-.01em; }
.widget-head .badge{ font-family:var(--font-mono); font-size:.72rem; letter-spacing:.06em; text-transform:uppercase; padding:.3rem .55rem; border-radius:6px; background:rgba(255,255,255,.12); }
.widget-body{ padding:1.4rem; }
.widget-foot{ padding:1rem 1.4rem; border-top:1px solid var(--rule); background:var(--surface-2); display:flex; gap:.6rem; flex-wrap:wrap; align-items:center; justify-content:space-between; }

/* Feed simulagailua */
.feed-sim{ display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:1.4rem; }
.phone{ max-width:400px; margin-inline:auto; width:100%; border:10px solid #13262e; border-radius:34px; background:#f2f6f7; overflow:hidden; }
.phone-top{ background:#fff; padding:.7rem 1rem; display:flex; justify-content:space-between; align-items:center; font-weight:700; font-size:.9rem; border-bottom:1px solid #eee; }
.phone-feed{ height:520px; overflow-y:auto; padding:.7rem; display:flex; flex-direction:column; gap:.7rem; }
.phone-feed > *, .thread-log > *, .gchat-log > *{ flex-shrink:0; }
.feed-card{ background:#fff; border-radius:14px; overflow:hidden; border:1px solid #eee; animation:slideIn .35s ease; }
@keyframes slideIn{ from{ opacity:0; transform:translateY(8px);} to{ opacity:1; transform:none; } }
.feed-card .fc-media{ height:120px; display:grid; place-items:center; font-size:2.6rem; }
.feed-card .fc-body{ padding:.7rem .8rem; font-size:.88rem; line-height:1.4; }
.feed-card .fc-body small{ display:block; color:#5b6b72; font-size:.74rem; margin-bottom:.2rem; }
.feed-card .fc-actions{ display:flex; gap:.4rem; padding:0 .8rem .7rem; flex-wrap:wrap; }
.feed-card .fc-actions button{ font:inherit; font-size:.78rem; font-weight:600; padding:.35rem .6rem; border-radius:var(--r-pill); border:1.5px solid #dce7e9; background:#fff; cursor:pointer; color:#13262e; }
.feed-card .fc-actions button:hover{ border-color:var(--purple); }
.feed-card .fc-actions button.on{ background:var(--ink); color:#fff; border-color:var(--ink); }
.feed-card .fc-why{ font-size:.75rem; color:#5b6b72; padding:0 .8rem .7rem; display:none; }
.feed-card.show-why .fc-why{ display:block; }
.feed-panel{ display:grid; gap:1rem; align-content:start; }
.feed-stat{ padding:1rem; border-radius:var(--r-md); background:var(--surface-2); }
.feed-stat h4{ font-size:.8rem; font-family:var(--font-mono); letter-spacing:.05em; text-transform:uppercase; color:var(--ink-mute); margin-bottom:.5rem; }
.topic-bars{ display:grid; gap:.35rem; }
.topic-bar{ display:grid; grid-template-columns:90px minmax(0,1fr) 34px; gap:.5rem; align-items:center; font-size:.8rem; }
.topic-bar .tb{ height:8px; border-radius:6px; background:var(--surface-3); overflow:hidden; }
.topic-bar .tb i{ display:block; height:100%; border-radius:6px; transition:width .4s; }
.gauge{ height:10px; border-radius:10px; background:linear-gradient(90deg, var(--ok), #c98a2e, var(--bad)); position:relative; margin-top:.4rem; }
.gauge i{ position:absolute; top:-5px; width:4px; height:20px; background:var(--ink); border-radius:2px; transition:left .4s; }

/* Talde-txata (adarkatua) */
.gchat{ display:grid; grid-template-columns:minmax(0,1fr) 260px; min-height:520px; }
.gchat-main{ display:flex; flex-direction:column; background:#efeae2; min-width:0; }
.gchat-top{ background:#fff; padding:.8rem 1rem; border-bottom:1px solid #e5e5e5; display:flex; gap:.7rem; align-items:center; }
.gchat-top .avatars{ display:flex; }
.gchat-top .avatars .avatar{ width:30px; height:30px; font-size:.7rem; border:2px solid #fff; margin-left:-8px; }
.gchat-top .avatars .avatar:first-child{ margin-left:0; }
.gchat-top b{ font-size:.95rem; }
.gchat-top span{ font-size:.78rem; color:#5b6b72; display:block; }
.gchat-log{ flex:1; padding:1rem; display:flex; flex-direction:column; gap:.5rem; overflow-y:auto; max-height:430px; }
.gmsg{ max-width:78%; padding:.5rem .75rem; border-radius:10px; background:#fff; font-size:.92rem; line-height:1.45; animation:slideIn .3s ease; box-shadow:0 1px 0 rgba(0,0,0,.06); }
.gmsg b{ display:block; font-size:.76rem; }
.gmsg.me{ align-self:flex-end; background:#d9fdd3; }
.gmsg.sys{ align-self:center; background:#fff8d6; font-size:.8rem; color:#6b5a10; text-align:center; }
.gmsg .att{ margin-top:.35rem; border-radius:8px; padding:.6rem; background:#f2f2f2; font-size:.8rem; color:#555; display:flex; gap:.5rem; align-items:center; }
.gchat-choices{ padding:.8rem; background:#f7f7f7; border-top:1px solid #e5e5e5; display:grid; gap:.45rem; }
.gchat-choices button{ text-align:left; font:inherit; font-size:.9rem; border:1.5px solid #ddd; background:#fff; border-radius:12px; padding:.6rem .8rem; cursor:pointer; color:#13262e; }
.gchat-choices button:hover{ border-color:var(--purple); background:var(--surface-3); }
.gchat-side{ padding:1rem; border-left:1px solid var(--rule); display:grid; gap:1rem; align-content:start; background:#fff; }
.gchat-side h4{ font-size:.75rem; font-family:var(--font-mono); letter-spacing:.05em; text-transform:uppercase; color:var(--ink-mute); }
.climate{ display:grid; gap:.5rem; }
.climate-row{ display:grid; gap:.25rem; font-size:.82rem; }
.climate-row .meter::before, .climate-row .meter::after{ display:none; }
.typing{ align-self:flex-start; background:#fff; border-radius:10px; padding:.55rem .8rem; display:flex; gap:4px; }
.typing i{ width:6px; height:6px; border-radius:50%; background:#aaa; animation:blink 1.2s infinite; }
.typing i:nth-child(2){ animation-delay:.2s; } .typing i:nth-child(3){ animation-delay:.4s; }
@keyframes blink{ 0%,80%,100%{ opacity:.3 } 40%{ opacity:1 } }

/* Pribatutasun-ezarpenak */
.privacy-sim{ display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:1.4rem; }
.settings-list{ display:grid; gap:.5rem; }
.setting{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:1rem; align-items:center; padding:.8rem 1rem; border:1px solid var(--rule); border-radius:12px; }
.setting b{ font-size:.93rem; display:block; }
.setting small{ font-size:.8rem; color:var(--ink-mute); }
.switch{ position:relative; width:46px; height:26px; flex:none; }
.switch input{ opacity:0; width:0; height:0; position:absolute; }
.switch span{ position:absolute; inset:0; background:#cfdde0; border-radius:26px; cursor:pointer; transition:background .15s; }
.switch span::after{ content:""; position:absolute; left:3px; top:3px; width:20px; height:20px; border-radius:50%; background:#fff; transition:transform .15s; box-shadow:0 1px 3px rgba(0,0,0,.2); }
.switch input:checked + span{ background:var(--ink); }
.switch input:checked + span::after{ transform:translateX(20px); }
.switch input:focus-visible + span{ outline:3px solid var(--c-sarbidea); outline-offset:2px; }
.setting select{ font:inherit; font-size:.85rem; padding:.35rem .5rem; border-radius:8px; border:1.5px solid var(--rule); background:#fff; color:var(--ink); }
.exposure{ padding:1.2rem; border-radius:var(--r-md); background:var(--surface-2); position:sticky; top:96px; display:grid; gap:.8rem; }
.exposure .big{ font-family:var(--font-display); font-size:2.6rem; line-height:1; }
.exposure ul{ display:grid; gap:.35rem; font-size:.86rem; color:var(--ink-soft); }
.exposure li::before{ content:"→ "; color:var(--ink-mute); }

/* Fitxategi-antolatzailea */
.declutter{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.3fr); gap:1.2rem; }
.file-pool, .folder{ border:2px dashed var(--rule); border-radius:var(--r-md); padding:.8rem; min-height:90px; display:flex; flex-wrap:wrap; gap:.45rem; align-content:flex-start; transition:border-color .15s, background .15s; }
.file-pool.over, .folder.over{ border-color:var(--purple); background:var(--surface-3); }
.folders{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:.7rem; }
.folder{ flex-direction:column; flex-wrap:nowrap; }
.folder-name{ font-weight:700; font-size:.86rem; display:flex; align-items:center; gap:.4rem; margin-bottom:.2rem; width:100%; }
.folder .files{ display:flex; flex-wrap:wrap; gap:.4rem; }
.file{ display:inline-flex; gap:.35rem; align-items:center; padding:.4rem .6rem; border-radius:8px; background:#fff; border:1.5px solid var(--rule); font-size:.8rem; font-family:var(--font-mono); cursor:grab; user-select:none; color:var(--ink); }
.file.picked{ border-color:var(--purple); box-shadow:0 0 0 3px rgba(18,63,80,.2); }
.file.right{ border-color:var(--ok); background:var(--ok-soft); }
.file.wrong{ border-color:var(--bad); background:var(--bad-soft); }

/* Meme / argitalpen editorea */
.editor{ display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:1.4rem; }
.editor canvas{ width:100%; height:auto; border-radius:var(--r-md); border:1px solid var(--rule); display:block; background:#eee; }
.editor-controls{ display:grid; gap:.9rem; align-content:start; }
.editor-controls label{ display:grid; gap:.3rem; font-size:.8rem; font-weight:700; color:var(--ink-soft); }
.swatches{ display:flex; gap:.4rem; flex-wrap:wrap; }
.swatches button{ width:34px; height:34px; border-radius:50%; border:3px solid #fff; box-shadow:0 0 0 1.5px var(--rule); cursor:pointer; }
.swatches button.sel{ box-shadow:0 0 0 2.5px var(--ink); }
.sticker-row{ display:flex; gap:.3rem; flex-wrap:wrap; }
.sticker-row button{ font-size:1.3rem; width:40px; height:40px; border-radius:10px; border:1.5px solid var(--rule); background:#fff; cursor:pointer; }
.sticker-row button.sel{ border-color:var(--ink); background:var(--surface-3); }
.checklist{ display:grid; gap:.4rem; }
.checklist li{ display:flex; gap:.5rem; align-items:flex-start; font-size:.88rem; color:var(--ink-soft); }
.checklist li .st{ flex:none; width:20px; height:20px; border-radius:50%; display:grid; place-items:center; font-size:.7rem; background:var(--surface-3); color:var(--ink-mute); }
.checklist li.ok .st{ background:var(--ok); color:#fff; }
.checklist li.no .st{ background:var(--bad); color:#fff; }

/* AA laguntzaile simulatua */
.ai-assist{ border:1px solid var(--rule); border-radius:var(--r-md); overflow:hidden; }
.ai-assist-head{ padding:.6rem .9rem; background:linear-gradient(135deg,#e6f2f3,#e3f7f6); font-size:.82rem; font-weight:700; display:flex; gap:.4rem; align-items:center; }
.ai-assist-body{ padding:.8rem .9rem; display:grid; gap:.6rem; font-size:.9rem; }
.ai-suggestion{ padding:.6rem .75rem; border-radius:10px; background:var(--surface-2); border:1.5px solid transparent; cursor:pointer; text-align:left; font:inherit; font-size:.88rem; color:var(--ink); }
.ai-suggestion:hover{ border-color:var(--purple); }
.ai-suggestion.sel{ border-color:var(--ink); background:#fff; }

/* ---------- Simulagailu nagusia (mahaigain birtuala) ---------- */
.sim-intro{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:1.25rem; }
.scenario-card{ border:1px solid var(--rule); border-radius:var(--r-lg); overflow:hidden; background:#fff; display:flex; flex-direction:column; }
.scenario-card .sc-top{ padding:1.4rem; color:#fff; min-height:170px; display:flex; flex-direction:column; justify-content:space-between; gap:1rem; }
.scenario-card .sc-top h3{ font-family:var(--font-display); font-size:1.6rem; line-height:1.02; letter-spacing:-.02em; }
.scenario-card .sc-body{ padding:1.3rem 1.4rem; display:grid; gap:.8rem; flex:1; align-content:start; }
.scenario-card .sc-body p{ color:var(--ink-soft); font-size:.95rem; }
.scenario-card .sc-meta{ display:flex; gap:.4rem; flex-wrap:wrap; }
.scenario-card .sc-foot{ padding:1rem 1.4rem 1.4rem; }

.desktop{
  position:relative; border-radius:18px; overflow:hidden; background:#0c2c3a;
  border:1px solid #0a222c; box-shadow:0 30px 60px rgba(20,18,60,.35);
  display:grid; grid-template-rows:auto minmax(0,1fr) auto; height:min(780px, calc(100vh - 150px)); min-height:560px;
}
.desktop-top{ display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:.45rem .9rem; background:#0a222c; color:rgba(255,255,255,.8); font-size:.78rem; font-family:var(--font-mono); }
.desktop-top .task-pill{ display:flex; gap:.5rem; align-items:center; }
.desktop-top .task-pill b{ color:#fff; font-weight:600; }
.desktop-area{ position:relative; min-height:0; background:
  radial-gradient(circle at 20% 20%, rgba(24,195,189,.18), transparent 40%),
  radial-gradient(circle at 80% 70%, rgba(29,78,110,.18), transparent 45%),
  #123f50; padding:.8rem; display:grid; grid-template-columns:minmax(0,1fr); }
.win{ display:none; background:#fff; border-radius:12px; overflow:hidden; box-shadow:0 18px 40px rgba(0,0,0,.35); min-height:0; flex-direction:column; }
.win.active{ display:flex; }
.win-bar{ display:flex; align-items:center; gap:.6rem; padding:.45rem .8rem; background:#e6eef0; border-bottom:1px solid #d5e2e5; font-size:.82rem; font-weight:700; color:#13262e; flex:none; }
.win-bar .dots{ display:flex; gap:5px; }
.win-bar .dots i{ width:10px; height:10px; border-radius:50%; background:#c7d6da; }
.win-bar .dots i:nth-child(1){ background:#ff6b6b; } .win-bar .dots i:nth-child(2){ background:#ffd166; } .win-bar .dots i:nth-child(3){ background:#06d6a0; }
.win-content{ flex:1; min-height:0; overflow:auto; }
.dock{ display:flex; justify-content:center; gap:.5rem; padding:.55rem; background:rgba(19,17,47,.92); }
.dock button{ position:relative; display:flex; flex-direction:column; align-items:center; gap:.15rem; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.08); border-radius:12px; padding:.45rem .8rem; color:#fff; cursor:pointer; font-size:.72rem; font-weight:600; min-width:78px; }
.dock button .ic{ font-size:1.25rem; line-height:1; }
.dock button:hover{ background:rgba(255,255,255,.14); }
.dock button.on{ background:rgba(24,195,189,.25); border-color:rgba(24,195,189,.55); }
.dock .badge-n{ position:absolute; top:-6px; right:-6px; background:#c23a52; color:#fff; font-size:.68rem; font-weight:700; min-width:20px; height:20px; border-radius:10px; display:grid; place-items:center; padding:0 5px; }

/* Txat-aplikazioa */
.app-chat{ display:grid; grid-template-columns:220px minmax(0,1fr); height:100%; min-height:0; }
.app-chat-list{ border-right:1px solid #eee; background:#fafcfc; overflow:auto; }
.app-chat-list .ch{ display:flex; gap:.6rem; align-items:center; padding:.75rem .8rem; border-bottom:1px solid #edf3f4; cursor:pointer; font-size:.86rem; }
.app-chat-list .ch.on{ background:#e6f2f3; }
.app-chat-list .ch .meta{ min-width:0; }
.app-chat-list .ch .meta b{ display:block; }
.app-chat-list .ch .meta span{ display:block; color:#5b6b72; font-size:.76rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.app-chat-thread{ display:flex; flex-direction:column; min-height:0; }
.thread-log{ flex:1; overflow:auto; padding:1rem; display:flex; flex-direction:column; gap:.6rem; background:#f5f9f9; }
.thread-log .bubble{ max-width:88%; padding:.7rem .9rem; border-radius:14px; background:#fff; font-size:.92rem; line-height:1.5; border:1px solid #ebf2f3; }
.thread-log .bubble.me{ align-self:flex-end; background:#dff6ee; border-color:#c9eedf; }
.thread-log .bubble > b:first-child{ display:block; font-size:.76rem; color:#5b6b72; margin-bottom:.15rem; }
.thread-log .bubble .link{ color:#1a4fc4; text-decoration:underline; cursor:pointer; background:none; border:none; font:inherit; padding:0; }
.task-list{ margin-top:.5rem; display:grid; gap:.3rem; }
.task-list li{ display:flex; gap:.45rem; font-size:.86rem; align-items:flex-start; }
.task-list li .tk{ flex:none; width:18px; height:18px; border-radius:5px; border:1.5px solid #bbb; display:grid; place-items:center; font-size:.65rem; margin-top:.1rem; }
.task-list li.done .tk{ background:var(--ok); border-color:var(--ok); color:#fff; }
.composer{ border-top:1px solid #eee; background:#fff; padding:.9rem 1rem; display:grid; gap:.7rem; max-height:55%; overflow:auto; }
.composer h5{ font-size:.9rem; }
.composer .row{ display:grid; gap:.35rem; }
.composer .row > span{ font-size:.78rem; font-weight:700; color:var(--ink-soft); }
.verdicts{ display:flex; gap:.4rem; flex-wrap:wrap; }
.verdicts button{ font:inherit; font-size:.85rem; font-weight:600; padding:.45rem .8rem; border-radius:var(--r-pill); border:1.5px solid var(--rule); background:#fff; cursor:pointer; color:var(--ink); }
.verdicts button.sel{ background:var(--ink); color:#fff; border-color:var(--ink); }
.source-row{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:.4rem; }

/* Nabigatzailea */
.browser{ display:flex; flex-direction:column; height:100%; min-height:0; }
.br-tabs{ display:flex; gap:.25rem; padding:.4rem .5rem 0; background:#dde8ea; overflow-x:auto; flex:none; scrollbar-width:thin; }
.br-tab{ display:flex; align-items:center; gap:.4rem; max-width:210px; min-width:120px; padding:.4rem .6rem; border-radius:10px 10px 0 0; background:#cddcdf; font-size:.78rem; cursor:pointer; color:#13262e; border:none; font-family:inherit; }
.br-tab.on{ background:#fff; }
.br-tab .tt{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; flex:1; text-align:left; }
.br-tab .x{ width:18px; height:18px; border-radius:50%; display:grid; place-items:center; font-size:.8rem; color:#5b6b72; }
.br-tab .x:hover{ background:#dde8ea; }
.br-newtab{ border:none; background:transparent; font-size:1.1rem; padding:0 .6rem; cursor:pointer; color:#13262e; }
.br-bar{ display:flex; gap:.5rem; align-items:center; padding:.45rem .6rem; background:#fff; border-bottom:1px solid #eee; flex:none; }
.br-bar button{ border:none; background:#eef4f5; width:30px; height:30px; border-radius:50%; cursor:pointer; color:#13262e; }
.br-bar button[disabled]{ opacity:.4; cursor:default; }
.br-url{ flex:1; display:flex; align-items:center; gap:.4rem; background:#eef4f5; border-radius:var(--r-pill); padding:.4rem .8rem; font-size:.84rem; min-width:0; }
.br-url input{ border:none; background:transparent; font:inherit; flex:1; min-width:0; color:#13262e; outline:none; }
.br-url .lock{ font-size:.75rem; }
.br-page{ flex:1; overflow:auto; min-height:0; background:#fff; }

/* Bilatzailea (simulatua) */
.se-home{ display:grid; place-items:center; align-content:center; gap:1.2rem; min-height:100%; padding:2rem 1rem; }
.se-logo{ font-family:var(--font-display); font-size:2.6rem; letter-spacing:-.04em; font-weight:800; }
.se-logo span:nth-child(1){ color:#123f50; } .se-logo span:nth-child(2){ color:#0b8480; } .se-logo span:nth-child(3){ color:#c23a52; }
.se-form{ display:flex; gap:.4rem; width:min(560px, 100%); }
.se-form input{ flex:1; font:inherit; font-size:1rem; padding:.75rem 1.1rem; border-radius:var(--r-pill); border:1.5px solid #ddd; min-width:0; }
.se-form button{ font:inherit; font-weight:700; padding:.7rem 1.1rem; border-radius:var(--r-pill); border:none; background:#123f50; color:#fff; cursor:pointer; }
.se-results{ padding:1rem 1.4rem 2rem; display:grid; gap:1.2rem; max-width:760px; }
.se-results .se-form{ width:100%; }
.se-results .info{ font-size:.8rem; color:#5b6b72; }
.se-result{ display:grid; gap:.15rem; }
.se-result .url{ font-size:.78rem; color:#44555c; display:flex; gap:.4rem; align-items:center; flex-wrap:wrap; }
.se-result .fav{ width:20px; height:20px; border-radius:50%; display:grid; place-items:center; font-size:.62rem; color:#fff; font-weight:700; }
.se-result .t{ color:#1a4fc4; font-size:1.08rem; background:none; border:none; font:inherit; text-align:left; padding:0; cursor:pointer; font-weight:500; }
.se-result .t:hover{ text-decoration:underline; }
.se-result .d{ font-size:.88rem; color:#44555c; line-height:1.5; }
.se-result .spons{ font-weight:700; color:#13262e; font-size:.75rem; }
.se-empty{ padding:1rem; background:#f5f9f9; border-radius:12px; font-size:.9rem; color:#44555c; }

/* Web orri simulatuak */
.site{ min-height:100%; }
.site-top{ padding:.9rem 1.4rem; display:flex; justify-content:space-between; align-items:center; gap:1rem; flex-wrap:wrap; }
.site-top .logo{ font-family:var(--font-display); font-weight:800; font-size:1.25rem; letter-spacing:-.02em; }
.site-top nav{ display:flex; gap:.9rem; font-size:.82rem; flex-wrap:wrap; }
.site-top nav button{ background:none; border:none; font:inherit; cursor:pointer; color:inherit; padding:0; text-decoration:underline; text-underline-offset:3px; }
.site-main{ padding:1.4rem; max-width:760px; }
.site-main h1{ font-family:Georgia, serif; font-size:1.8rem; line-height:1.2; margin-bottom:.6rem; color:#13262e; }
.site-main h2{ font-size:1.15rem; margin:1.2rem 0 .4rem; color:#13262e; }
.site-main p{ font-size:.97rem; line-height:1.7; margin-bottom:.8rem; color:#1f3640; }
.site-main .byline{ font-size:.82rem; color:#5b6b72; margin-bottom:1rem; }
.site-main ul{ list-style:disc; padding-left:1.2rem; margin-bottom:.8rem; color:#1f3640; }
.site-main .inline-link{ color:#1a4fc4; text-decoration:underline; background:none; border:none; font:inherit; padding:0; cursor:pointer; }
.site-main blockquote{ border-left:4px solid #ddd; padding-left:.9rem; color:#44555c; font-style:italic; margin:.8rem 0; }
.site-banner{ margin:.8rem 0; padding:.8rem 1rem; border-radius:10px; font-size:.86rem; }
.site-img{ border-radius:10px; aspect-ratio:16/8; display:grid; place-items:center; color:#fff; font-weight:700; font-size:1.1rem; text-align:center; padding:1rem; margin:.6rem 0 1rem; position:relative; }
.site-img .cap{ position:absolute; bottom:.5rem; left:.6rem; right:.6rem; font-size:.72rem; font-weight:500; background:rgba(0,0,0,.45); border-radius:6px; padding:.25rem .45rem; text-align:left; }
.site-foot{ padding:1rem 1.4rem; font-size:.78rem; color:#5b6b72; border-top:1px solid #eee; }
.site.clickbait .site-top{ background:#e11d48; color:#fff; }
.site.clickbait .site-main h1{ font-family:var(--font-display); text-transform:uppercase; letter-spacing:-.01em; }
.ad-slot{ background:#fff7d6; border:1px dashed #d4b200; padding:.7rem; font-size:.8rem; border-radius:8px; margin:.8rem 0; }

/* Irudi-alderantzizko bilaketa */
.revimg{ padding:1.2rem 1.4rem; display:grid; gap:1rem; max-width:760px; }
.revimg .drop{ border:2px dashed #c7d6da; border-radius:12px; padding:1rem; text-align:center; font-size:.9rem; color:#44555c; }
.revimg .match{ display:grid; grid-template-columns:90px minmax(0,1fr); gap:.8rem; align-items:center; padding:.6rem; border:1px solid #eee; border-radius:12px; }
.revimg .thumb{ height:64px; border-radius:8px; display:grid; place-items:center; color:#fff; font-size:1.4rem; }

/* Oharrak aplikazioa */
.notes-app{ padding:1rem; display:grid; gap:.6rem; height:100%; grid-template-rows:auto minmax(0,1fr) auto; }
.notes-app textarea{ width:100%; height:100%; min-height:220px; font:inherit; font-size:.95rem; border:1px solid #eee; border-radius:10px; padding:.8rem; resize:none; line-height:1.6; background:#fffdf3; }
.visited-list{ display:grid; gap:.3rem; font-size:.82rem; }
.visited-list button{ text-align:left; background:#f5f9f9; border:none; padding:.4rem .6rem; border-radius:8px; font:inherit; font-size:.82rem; cursor:pointer; color:#13262e; }

/* AA sortzailea (simulagailuaren 2. fasea) */
.creator{ padding:1.2rem; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:1.2rem; }
.creator .preview-post{ position:sticky; top:0; }

/* Simulagailuaren emaitza */
.sim-result{ margin-top:1.5rem; }
.evidence-list{ display:grid; gap:.45rem; }
.evidence-list li{ display:grid; grid-template-columns:26px minmax(0,1fr); gap:.6rem; font-size:.92rem; color:var(--ink); align-items:start; padding:.55rem .7rem; border-radius:10px; background:var(--surface-2); }
.evidence-list li .st{ width:22px; height:22px; border-radius:50%; display:grid; place-items:center; font-size:.72rem; color:#fff; }
.evidence-list li .st.ok{ background:var(--ok); }
.evidence-list li .st.no{ background:var(--bad); }
.evidence-list li .st.mid{ background:var(--warn); }
.evidence-list li small{ display:block; color:var(--ink-soft); font-size:.84rem; }

/* ---------- Txantiloiak ---------- */
.tpl-grid{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:1.2rem; }
.tpl-card{ border:1px solid var(--rule); border-radius:var(--r-lg); background:#fff; overflow:hidden; display:flex; flex-direction:column; transition:transform .18s, box-shadow .18s; }
.tpl-card:hover{ transform:translateY(-3px); box-shadow:0 16px 36px rgba(19,38,46,.1); }
.tpl-thumb{ aspect-ratio:4/3; background:var(--surface-2); display:grid; place-items:center; padding:1.2rem; position:relative; overflow:hidden; }
.tpl-sheet{ width:62%; aspect-ratio:1/1.414; background:#fff; border-radius:4px; box-shadow:0 10px 24px rgba(19,38,46,.14); padding:9% 8%; display:grid; gap:6%; align-content:start; transform:rotate(-2deg); transition:transform .25s; }
.tpl-card:hover .tpl-sheet{ transform:rotate(0) scale(1.03); }
.tpl-sheet i{ display:block; height:5px; border-radius:3px; background:#e0eaec; }
.tpl-sheet i.h{ height:9px; width:70%; background:var(--cc, var(--purple)); }
.tpl-sheet i.s{ width:55%; }
.tpl-sheet i.box{ height:22px; border:1.5px solid #e0eaec; background:transparent; }
.tpl-thumb .for{ position:absolute; top:.8rem; left:.8rem; }
.tpl-body{ padding:1.2rem 1.3rem; display:grid; gap:.5rem; flex:1; align-content:start; }
.tpl-body h3{ font-family:var(--font-display); font-size:1.2rem; line-height:1.1; letter-spacing:-.01em; }
.tpl-body p{ color:var(--ink-soft); font-size:.92rem; }
.tpl-foot{ padding:0 1.3rem 1.3rem; display:flex; gap:.5rem; flex-wrap:wrap; }
.dl{ display:inline-flex; align-items:center; gap:.4rem; font-size:.85rem; font-weight:700; padding:.5rem .85rem; border-radius:var(--r-pill); border:1.5px solid var(--rule); color:var(--ink); }
.dl:hover{ border-color:var(--ink); }
.dl.pdf{ background:var(--ink); border-color:var(--ink); color:#fff; }
.dl .ext{ font-family:var(--font-mono); font-size:.7rem; opacity:.8; }

/* ---------- Irakasleak ---------- */
.timeline{ display:grid; gap:0; position:relative; }
.tl-item{ display:grid; grid-template-columns:150px 28px minmax(0,1fr); gap:1rem; padding-bottom:1.8rem; position:relative; }
.tl-item .when{ font-family:var(--font-mono); font-size:.82rem; color:var(--ink-mute); text-align:right; padding-top:.15rem; }
.tl-item .node{ position:relative; display:flex; justify-content:center; }
.tl-item .node::before{ content:""; position:absolute; top:0; bottom:-1.8rem; width:2px; background:var(--rule); }
.tl-item:last-child .node::before{ bottom:0; }
.tl-item .node i{ position:relative; width:16px; height:16px; border-radius:50%; background:#fff; border:3px solid var(--purple); margin-top:.15rem; }
.tl-item.key .node i{ background:var(--c-aztertu); border-color:var(--c-aztertu); }
.tl-item h4{ font-family:var(--font-display); font-size:1.15rem; margin-bottom:.25rem; }
.tl-item p{ color:var(--ink-soft); font-size:.95rem; }

.session{ border:1px solid var(--rule); border-radius:var(--r-md); padding:1.1rem 1.2rem; background:#fff; display:grid; gap:.5rem; }
.session .s-top{ display:flex; justify-content:space-between; gap:.6rem; align-items:center; flex-wrap:wrap; }
.session .s-top b{ font-family:var(--font-display); font-size:1.05rem; }
.session p{ color:var(--ink-soft); font-size:.92rem; }
.session .s-links{ display:flex; flex-wrap:wrap; gap:.4rem; }
.session .s-links a{ font-size:.8rem; font-weight:600; color:var(--purple); }
.session .s-links a:hover{ text-decoration:underline; }

/* ---------- Glosarioa ---------- */
.glossary{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:.7rem 1.5rem; }
.glossary div{ padding:.9rem 0; border-bottom:1px solid var(--rule); }
.glossary dt{ font-family:var(--font-display); font-weight:700; color:var(--ink); }
.glossary dt small{ font-family:var(--font-mono); font-weight:400; font-size:.75rem; color:var(--ink-mute); margin-left:.4rem; }
.glossary dd{ color:var(--ink-soft); font-size:.94rem; }
.glossary-search{ max-width:420px; margin-bottom:1.2rem; }

/* ---------- Toast ---------- */
.toast{ position:fixed; left:50%; bottom:1.5rem; transform:translate(-50%, 150%); background:var(--ink); color:#fff; padding:.8rem 1.2rem; border-radius:12px; font-size:.92rem; font-weight:600; z-index:100; transition:transform .3s ease; box-shadow:0 12px 30px rgba(0,0,0,.25); max-width:calc(100% - 2rem); }
.toast.show{ transform:translate(-50%, 0); }

/* ---------- Oina (atal honetakoa) ---------- */
.pisa-disclaimer{ font-size:.82rem; color:var(--ink-mute); max-width:80ch; }
.cta-band{ border-radius:28px; background:var(--ink); color:#fff; padding:clamp(1.8rem, 4vw, 3.2rem); display:grid; grid-template-columns:minmax(0,1fr) auto; gap:2rem; align-items:center; position:relative; overflow:hidden; }
.cta-band::after{ content:""; position:absolute; right:-80px; top:-120px; width:360px; height:360px; background:radial-gradient(circle, rgba(24,195,189,.28), transparent 65%); }
.cta-band h2{ font-family:var(--font-display); font-size:clamp(1.6rem, 3vw, 2.4rem); line-height:1.02; letter-spacing:-.03em; margin-bottom:.5rem; }
.cta-band p{ color:rgba(255,255,255,.75); max-width:58ch; }
.cta-band .btns{ display:flex; gap:.6rem; flex-wrap:wrap; position:relative; z-index:1; }

/* ---------- Liburua ---------- */
.book-band{
  display:grid; grid-template-columns:clamp(190px, 22vw, 260px) minmax(0,1fr); gap:clamp(1.6rem, 3vw, 3rem);
  align-items:center; padding:clamp(1.6rem, 3vw, 2.4rem);
  background:var(--surface-2); border:1px solid var(--rule); border-radius:var(--r-lg);
}
.book-cover{ display:block; border-radius:var(--r-md); overflow:hidden; border:1px solid var(--rule);
  box-shadow:0 10px 30px rgba(19,38,46,.14); transition:transform .18s ease, box-shadow .18s ease; }
.book-cover:hover, .book-cover:focus-visible{ transform:translateY(-4px); box-shadow:0 16px 40px rgba(19,38,46,.22); }
.book-cover img{ display:block; width:100%; height:auto; }
.book-text h3{ font-family:var(--font-display); font-size:clamp(1.4rem, 2.4vw, 1.9rem); letter-spacing:-.02em; line-height:1.12; }
.book-text .book-sub{ font-family:var(--font-mono); font-size:.8rem; letter-spacing:.06em; text-transform:uppercase;
  color:var(--ink-mute); margin:.45rem 0 .2rem; }
.book-text .book-lead{ font-family:var(--font-display); font-size:1.02rem; color:var(--ink-soft); margin:0 0 .9rem; }
.book-text p{ color:var(--ink-soft); }
.book-facts{ display:flex; flex-wrap:wrap; gap:.5rem; list-style:none; margin:1.1rem 0 1.3rem; padding:0; }
.book-facts li{ display:flex; align-items:baseline; gap:.4rem; padding:.45rem .8rem;
  background:#fff; border:1px solid var(--rule); border-radius:var(--r-sm); }
.book-facts b{ font-family:var(--font-display); font-size:1.15rem; color:var(--purple); letter-spacing:-.02em; }
.book-facts span{ font-family:var(--font-mono); font-size:.72rem; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-mute); }
.book-band .btns{ display:flex; gap:.6rem; flex-wrap:wrap; }
@media (max-width: 760px){
  .book-band{ grid-template-columns:1fr; justify-items:center; text-align:center; }
  .book-cover{ max-width:230px; }
  .book-facts, .book-band .btns{ justify-content:center; }
  .book-text p{ text-align:left; }
}

/* ---------- Erantzunkorra ---------- */
@media (max-width: 1100px){
  .pisa-hero-grid, .model-wrap{ grid-template-columns:1fr; }
  .grid-4{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .grid-5{ grid-template-columns:repeat(3, minmax(0,1fr)); }
  .tpl-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .comp-layout{ grid-template-columns:1fr; }
  .comp-toc{ position:static; }
  .comp-toc ol{ display:flex; flex-wrap:wrap; gap:.3rem; }
  .comp-layout{ gap:2.5rem; }
  /* Pantaila txikian aurrerapena ez da edukiaren aurretik pilatzen (hasierako orrian ikusgai dago) */
  .comp-toc .p-card.soft{ display:none; }
  .bank-toolbar{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .feed-sim, .privacy-sim, .editor{ grid-template-columns:1fr; }
  .exposure{ position:static; }
  .gchat{ grid-template-columns:1fr; }
  .gchat-side{ border-left:none; border-top:1px solid var(--rule); }
  .creator{ grid-template-columns:1fr; }
}
@media (max-width: 900px){
  .pisa-subnav{ top:84px; }
  .exam-bar{ top:96px; }
  .item-body{ grid-template-columns:1fr; }
  .item-stim{ border-right:none; border-bottom:1px solid var(--rule); }
  .worked-body{ grid-template-columns:1fr; }
  .worked-body > div + div{ border-left:none; border-top:1px solid var(--rule); }
  .grid-3, .sim-intro{ grid-template-columns:1fr; }
  .progress-strip{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .meter-row{ grid-template-columns:1fr auto; }
  .meter-row .meter{ grid-column:1 / -1; grid-row:2; }
  .app-chat{ grid-template-columns:1fr; grid-template-rows:auto minmax(0,1fr); }
  .app-chat-list{ display:flex; border-right:none; border-bottom:1px solid #eee; overflow-x:auto; }
  .app-chat-list .ch{ border-bottom:none; flex:none; }
  .desktop{ height:calc(100vh - 140px); }
  .cta-band{ grid-template-columns:1fr; }
  .tl-item{ grid-template-columns:24px minmax(0,1fr); }
  .tl-item .when{ grid-column:2; text-align:left; grid-row:1; }
  .tl-item .node{ grid-row:1 / span 2; grid-column:1; }
  .tl-item > div:last-child{ grid-column:2; }
}
@media (max-width: 640px){
  .p-section{ padding:4rem 0; }
  .comp-main{ gap:4.5rem; }
  .pisa-hero{ padding:3rem 0 2.5rem; }
  .grid-2, .grid-4, .tpl-grid, .glossary, .folders, .declutter{ grid-template-columns:1fr; }
  .grid-5{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .bank-toolbar{ grid-template-columns:1fr; }
  .level{ grid-template-columns:1fr; gap:.4rem; }
  .classify-row{ grid-template-columns:1fr; }
  .match-row{ grid-template-columns:1fr; }
  .p-card{ padding:1.3rem; }
  .item-stim, .item-task{ padding:1rem; }
  .dock button{ min-width:0; padding:.4rem .55rem; }
  .dock button .lbl{ display:none; }
  .desktop-area{ padding:.4rem; }
  .desktop{ min-height:520px; }
  .progress-strip{ grid-template-columns:1fr; }
  .exam-bar{ top:84px; }
}

/* ---------- Simulagailuak mugikorrean ---------- */
html:has(body.pisa-page){ scroll-padding-top:72px; }
@media (max-width: 900px){
  html:has(body.pisa-page){ scroll-padding-top:92px; }
  .pisa-subnav{ position:relative; top:auto; }
}
@media (max-width: 640px){
  /* Simulagailuen edukia txikiagoa: pantaila txikian osorik ikusteko */
  .desktop{ zoom:.82; height:calc((100svh - 96px) / .82); min-height:0; border-radius:12px; }
  .phone, .gchat, .stim-frame, .worked .stim-frame{ zoom:.9; }
  .phone{ border-width:6px; border-radius:24px; }
  .phone-feed{ height:min(520px, 62svh); }
  .feed-card .fc-media{ height:80px; font-size:2rem; }

  .desktop-top{ font-family:var(--font-body); font-size:.75rem; padding:.4rem .7rem; }
  .desktop-top .task-pill{ min-width:0; }
  .desktop-top .task-pill b{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .desktop-top .task-pill .role{ display:none; }
  .desktop-top > span:last-child{ flex:none; white-space:nowrap; }
  .desktop-top .rec{ display:none; }

  .composer{ max-height:42%; }
  .se-results{ padding:.9rem .9rem 1.6rem; }
  .se-form button{ padding:.7rem .8rem; flex:none; }
  .se-logo{ font-size:2rem; }
  .site-main{ padding:1rem; }
  .site-main h1{ font-size:1.45rem; }
  .site-img{ aspect-ratio:16/9; font-size:.95rem; }
  .br-tab{ min-width:96px; }
  .gchat-log{ max-height:60svh; }
  .stack > *, .widget, .widget-body{ min-width:0; }
  .setting{ grid-template-columns:1fr; gap:.5rem; }
  .setting select{ max-width:100%; justify-self:start; }
  .gchat-top .avatars .avatar{ line-height:1; }
}

/* ---------- Inprimatzeko ---------- */
@media print{
  .site-header, .site-footer, .pisa-subnav, .hero-actions, .item-actions, .btn, .exam-bar, .dock, .no-print{ display:none !important; }
  .pisa-hero{ background:#fff !important; color:#000 !important; padding:1rem 0 !important; }
  .pisa-hero *{ color:#000 !important; }
  .reveal{ opacity:1 !important; transform:none !important; }
  .p-section{ padding:1rem 0 !important; }
  .report{ border:1px solid #999; }
  .report-head{ background:#fff !important; color:#000 !important; border-bottom:2px solid #000; }
}