/* ============================================================================
   Onigiri · Documentación — hoja de estilo compartida (docs.getonigiri.com)
   Sitio estático servido desde public/docs/ vía rewrites. Reusa los tokens del
   diseño aprobado (mismos que landing/legales). Layout tipo Mintlify: barra
   superior fija · sidebar de secciones · columna de contenido · TOC "en esta
   página" · prev/next. Claro por defecto; oscuro con [data-theme="dark"].
   ========================================================================== */
:root{
  --red:#C8102E;--red-deep:#A00D26;--red-tint:#FBE8EA;
  --ink:#1A1A1A;--ink-2:#56565E;--ink-3:#8C8C95;
  --line:#E9E7E3;--line-2:#F1EFEC;--bg:#fff;--bg-2:#F7F6F4;--bg-3:#FBFAF9;
  --code-bg:#F6F5F3;--code-ink:#3A3A42;
  --f-ui:'Zen Kaku Gothic New',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --f-round:'Fredoka',sans-serif;--f-mono:'JetBrains Mono',ui-monospace,monospace;
  --sidebar-w:266px;--toc-w:220px;--topbar-h:64px;--maxw:1180px;--r-pill:999px;
  --shadow:0 1px 2px rgba(26,26,26,.04),0 8px 24px rgba(26,26,26,.06);
  --shadow-red:0 14px 34px rgba(200,16,46,.30);
}
[data-theme="dark"]{
  --red:#F6516F;--red-deep:#FF7E93;--red-tint:#2A1614;
  --ink:#F3F1EE;--ink-2:#B6B4BC;--ink-3:#7E7C86;
  --line:#2A2A31;--line-2:#232329;--bg:#161619;--bg-2:#1C1C21;--bg-3:#1F1F25;
  --code-bg:#1F1F26;--code-ink:#D6D4DC;
  --shadow:0 1px 2px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.4);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--topbar-h) + 20px)}
body{margin:0;font-family:var(--f-ui);color:var(--ink);background:var(--bg);
  font-size:16px;line-height:1.68;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:var(--red-deep);text-decoration:none}a:hover{text-decoration:underline}
img{max-width:100%}

/* ---------- barra superior ------------------------------------------------ */
.doc-topbar{position:sticky;top:0;z-index:40;height:var(--topbar-h);border-bottom:1px solid var(--line);
  background:color-mix(in srgb,var(--bg) 86%,transparent);backdrop-filter:blur(14px) saturate(1.4)}
.doc-topbar-inner{display:flex;align-items:center;gap:22px;height:100%;max-width:var(--maxw);margin:0 auto;padding:0 28px}
.doc-brand{display:flex;align-items:center;gap:11px;flex-shrink:0;color:var(--ink)}
.doc-brand .wm{font-family:var(--f-round);font-weight:600;font-size:23px;letter-spacing:-.01em;line-height:1;color:var(--ink)}
.doc-brand .wm .rg{color:inherit}
.doc-brand .wm small{display:block;font-family:var(--f-ui);font-weight:500;font-size:8.5px;
  letter-spacing:.16em;color:var(--ink-3);margin-top:2px}
.doc-sitelinks{display:flex;align-items:center;gap:2px;margin-left:6px}
.doc-sitelinks a{display:inline-flex;align-items:center;padding:9px 14px;border-radius:var(--r-pill);
  font-weight:600;font-size:14.5px;color:var(--ink-2);line-height:1;white-space:nowrap}
.doc-sitelinks a:hover{background:var(--bg-2);color:var(--ink);text-decoration:none}
.doc-top-spacer{flex:1}
.doc-search{position:relative;flex:0 1 300px;max-width:300px}
.doc-search input{width:100%;font-family:var(--f-ui);font-size:13.5px;color:var(--ink);
  background:var(--bg-2);border:1px solid var(--line);border-radius:10px;padding:8px 12px 8px 34px}
.doc-search input::placeholder{color:var(--ink-3)}
.doc-search input:focus{outline:none;border-color:var(--red);background:var(--bg)}
.doc-search svg{position:absolute;left:11px;top:50%;transform:translateY(-50%);width:15px;height:15px;color:var(--ink-3)}
.doc-search .kbd{position:absolute;right:9px;top:50%;transform:translateY(-50%);font-family:var(--f-mono);
  font-size:11px;color:var(--ink-3);border:1px solid var(--line);border-radius:6px;padding:1px 6px}
.doc-search-out{position:absolute;top:calc(100% + 8px);left:0;right:0;background:var(--bg);
  border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:6px;display:none;max-height:60vh;overflow:auto}
.doc-search-out.on{display:block}
.doc-search-out a{display:block;padding:9px 11px;border-radius:8px;color:var(--ink);font-size:13.5px}
.doc-search-out a small{display:block;color:var(--ink-3);font-size:12px}
.doc-search-out a:hover,.doc-search-out a.act{background:var(--bg-2);text-decoration:none}
.doc-search-out .empty{padding:12px;color:var(--ink-3);font-size:13px;text-align:center}
.doc-search-out mark{background:var(--red-tint);color:var(--red-deep);border-radius:3px;padding:0 1px;font-weight:600}
.doc-top-links{display:flex;align-items:center;gap:4px}
.doc-top-links a{font-size:13.5px;font-weight:600;color:var(--ink-2);padding:7px 12px;border-radius:8px}
.doc-top-links a:hover{color:var(--ink);background:var(--bg-2);text-decoration:none}
.doc-toggle{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;
  border:1px solid var(--line);border-radius:9px;background:var(--bg-2);color:var(--ink-2);cursor:pointer}
.doc-toggle:hover{color:var(--ink);border-color:var(--ink-3)}
.doc-toggle svg{width:17px;height:17px}
[data-theme="dark"] .doc-toggle .ic-moon,[data-theme="light"] .doc-toggle .ic-sun{display:none}
.doc-cta{font-family:var(--f-ui);font-size:14.5px;font-weight:700;color:#fff;background:var(--red);
  border-radius:var(--r-pill);padding:11px 18px;box-shadow:var(--shadow-red);white-space:nowrap}
.doc-cta:hover{background:var(--red-deep);transform:translateY(-1px);text-decoration:none}
.doc-hamburger{display:none;width:36px;height:36px;border:1px solid var(--line);border-radius:9px;
  background:var(--bg-2);color:var(--ink);cursor:pointer;align-items:center;justify-content:center}
.doc-hamburger svg{width:18px;height:18px}

/* ---------- rejilla principal --------------------------------------------- */
.doc-layout{max-width:1400px;margin:0 auto;display:grid;
  grid-template-columns:var(--sidebar-w) minmax(0,1fr) var(--toc-w);gap:0;align-items:start}

/* ---------- sidebar ------------------------------------------------------- */
.doc-sidebar{position:sticky;top:var(--topbar-h);height:calc(100vh - var(--topbar-h));overflow-y:auto;
  padding:30px 20px 60px 26px;border-right:1px solid var(--line)}
.doc-sidebar .sec{margin:0 0 26px}
.doc-sidebar .sec-t{font-size:11.5px;font-weight:800;letter-spacing:.11em;text-transform:uppercase;
  color:var(--ink-3);margin:0 0 9px;padding:0 10px}
.doc-sidebar a{display:flex;align-items:center;gap:9px;font-size:14px;font-weight:500;color:var(--ink-2);
  padding:7px 10px;border-radius:9px;line-height:1.35}
.doc-sidebar a:hover{color:var(--ink);background:var(--bg-2);text-decoration:none}
.doc-sidebar a.act{color:var(--red-deep);background:var(--red-tint);font-weight:700}
.doc-sidebar a .di{width:16px;height:16px;flex-shrink:0;opacity:.8}
.doc-sidebar a.act .di{opacity:1}

/* ---------- columna de contenido ------------------------------------------ */
.doc-main{min-width:0;padding:38px 52px 90px}
.doc-crumb{font-size:13px;color:var(--ink-3);margin:0 0 18px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.doc-crumb a{color:var(--ink-3)}.doc-crumb a:hover{color:var(--ink-2)}
.doc-crumb .sep{opacity:.5}
.doc-content{max-width:760px}
.doc-content .eyebrow{font-size:12px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--red);margin:0 0 12px}
.doc-content h1{font-weight:900;font-size:clamp(30px,4.4vw,42px);letter-spacing:-.03em;line-height:1.08;margin:0 0 6px}
.doc-content .sub{font-size:18px;color:var(--ink-2);margin:0 0 8px;line-height:1.55}
.doc-content h2{font-weight:800;font-size:24px;letter-spacing:-.02em;margin:52px 0 4px;padding-top:6px;scroll-margin-top:80px}
.doc-content h3{font-weight:700;font-size:18px;letter-spacing:-.01em;margin:34px 0 2px;scroll-margin-top:80px}
.doc-content h2 .anchor,.doc-content h3 .anchor{position:relative;opacity:0;margin-left:8px;color:var(--ink-3);font-weight:400;transition:opacity .12s;cursor:pointer}
.doc-content h2:hover .anchor,.doc-content h3:hover .anchor{opacity:1}
.doc-content h2 .anchor:hover,.doc-content h3 .anchor:hover{color:var(--red)}
/* touch: sin hover, el ancla se muestra tenue para poder tocarla */
@media (hover:none){ .doc-content h2 .anchor,.doc-content h3 .anchor{opacity:.4} }
.doc-content .anchor.copied{color:var(--red)}
.doc-content .anchor.copied::after{content:"enlace copiado";position:absolute;left:50%;top:-27px;transform:translateX(-50%);
  white-space:nowrap;font-size:11px;font-weight:600;color:#fff;background:var(--ink);padding:3px 8px;border-radius:6px;font-family:var(--f-ui)}
.doc-content p{margin:14px 0;color:var(--ink-2)}
.doc-content ul,.doc-content ol{margin:14px 0;padding-left:24px;color:var(--ink-2)}
.doc-content li{margin:7px 0}
.doc-content li::marker{color:var(--ink-3)}
.doc-content strong{color:var(--ink);font-weight:700}
.doc-content a{font-weight:600}
.doc-content hr{border:none;border-top:1px solid var(--line);margin:40px 0}
.doc-content code{font-family:var(--f-mono);font-size:.87em;background:var(--code-bg);color:var(--code-ink);
  border:1px solid var(--line);border-radius:6px;padding:1.5px 6px}
.doc-content pre{background:var(--code-bg);border:1px solid var(--line);border-radius:12px;padding:16px 18px;
  overflow-x:auto;margin:18px 0}
.doc-content pre code{background:none;border:none;padding:0;font-size:13px;line-height:1.6;color:var(--code-ink)}

/* fórmulas destacadas (definiciones de métricas) */
.formula{font-family:var(--f-mono);font-size:14.5px;color:var(--ink);background:var(--bg-2);
  border:1px solid var(--line);border-left:3px solid var(--red);border-radius:10px;padding:14px 18px;margin:18px 0;line-height:1.7;overflow-x:auto}
.formula .op{color:var(--ink-3)}

/* tablas */
.doc-content table{width:100%;border-collapse:collapse;margin:20px 0;font-size:14px}
.doc-content th{text-align:left;font-weight:700;color:var(--ink);border-bottom:1.5px solid var(--line);padding:10px 12px;background:var(--bg-3)}
.doc-content td{border-bottom:1px solid var(--line-2);padding:10px 12px;color:var(--ink-2);vertical-align:top}
.doc-content tr:last-child td{border-bottom:none}
.doc-table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:12px;margin:20px 0}
.doc-table-wrap table{margin:0}

/* callouts */
.callout{display:flex;gap:13px;border-radius:12px;padding:15px 18px;margin:20px 0;font-size:14.5px;line-height:1.6;border:1px solid var(--line);background:var(--bg-2)}
.callout .ci{flex-shrink:0;display:inline-flex;align-items:flex-start;padding-top:1px;color:var(--ink-2)}
.callout .ci svg{width:19px;height:19px}
.callout.note .ci{color:#3B78D0}.callout.tip .ci{color:#2E9E5B}
.callout.warn .ci{color:#C08419}.callout.key .ci{color:var(--red)}
[data-theme="dark"] .callout.note .ci{color:#7FB0F0}[data-theme="dark"] .callout.tip .ci{color:#6FC58C}
[data-theme="dark"] .callout.warn .ci{color:#E0B45E}
.callout p{margin:0;color:var(--ink-2)}.callout p+p{margin-top:8px}
.callout b{color:var(--ink)}
.callout.note{border-color:#CFE0F5;background:color-mix(in srgb,#EAF2FD 60%,var(--bg))}
.callout.tip{border-color:#CDE9D6;background:color-mix(in srgb,#E9F7EE 60%,var(--bg))}
.callout.warn{border-color:#F5DDB0;background:color-mix(in srgb,#FDF3DF 60%,var(--bg))}
.callout.key{border-color:#F5D2D7;background:var(--red-tint)}
[data-theme="dark"] .callout.note{border-color:#25405e;background:#182130}
[data-theme="dark"] .callout.tip{border-color:#255036;background:#16241b}
[data-theme="dark"] .callout.warn{border-color:#5c4620;background:#241c10}

/* rejilla de tarjetas (hub / getting-started) */
.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px;margin:26px 0}
.doc-card{display:block;border:1px solid var(--line);border-radius:14px;padding:20px;background:var(--bg);transition:border-color .14s,transform .14s,box-shadow .14s}
.doc-card:hover{border-color:var(--red);transform:translateY(-2px);box-shadow:var(--shadow);text-decoration:none}
.doc-card .ic{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:10px;
  background:var(--red-tint);color:var(--red-deep);margin-bottom:13px}
.doc-card .ic svg{width:20px;height:20px}
.doc-card h4{margin:0 0 5px;font-size:16px;font-weight:800;color:var(--ink);letter-spacing:-.01em}
.doc-card p{margin:0;font-size:13.5px;color:var(--ink-2);line-height:1.5}
.doc-card .go{margin-top:11px;font-size:13px;font-weight:700;color:var(--red-deep);display:inline-flex;gap:5px;align-items:center}

/* pasos numerados */
.steps{margin:24px 0;counter-reset:step;padding:0;list-style:none}
.steps>li{position:relative;padding:0 0 22px 46px;counter-increment:step}
.steps>li::before{content:counter(step);position:absolute;left:0;top:-2px;width:30px;height:30px;
  display:flex;align-items:center;justify-content:center;border-radius:50%;background:var(--red);color:#fff;
  font-family:var(--f-round);font-weight:600;font-size:15px}
.steps>li::after{content:"";position:absolute;left:14px;top:32px;bottom:2px;width:2px;background:var(--line)}
.steps>li:last-child{padding-bottom:0}.steps>li:last-child::after{display:none}
.steps>li strong{display:block;color:var(--ink);font-size:15.5px;margin-bottom:2px}
.steps>li p{margin:4px 0 0}

/* prev / next */
.doc-prevnext{max-width:760px;display:flex;gap:14px;margin-top:56px;padding-top:26px;border-top:1px solid var(--line)}
.doc-prevnext a{flex:1;border:1px solid var(--line);border-radius:12px;padding:14px 18px;color:var(--ink)}
.doc-prevnext a:hover{border-color:var(--red);text-decoration:none;background:var(--bg-2)}
.doc-prevnext a.nx{text-align:right}
.doc-prevnext .lb{font-size:12px;color:var(--ink-3);font-weight:600}
.doc-prevnext .tt{font-size:15px;font-weight:700;color:var(--ink);margin-top:2px}

.doc-feedback{max-width:760px;margin-top:28px;font-size:13.5px;color:var(--ink-3)}
.doc-feedback a{color:var(--red-deep);font-weight:600}

/* "Copiar página" (arriba del contenido) */
.doc-copy{position:relative;display:flex;justify-content:flex-end;margin:0 0 4px}
.doc-copy-main,.doc-copy-caret{display:inline-flex;align-items:center;gap:7px;height:34px;
  border:1px solid var(--line);background:var(--bg);color:var(--ink-2);font-family:var(--f-ui);
  font-size:13px;font-weight:600;cursor:pointer}
.doc-copy-main{border-radius:9px 0 0 9px;padding:0 13px}
.doc-copy-caret{border-radius:0 9px 9px 0;border-left:none;padding:0 8px}
.doc-copy-main svg,.doc-copy-caret svg{width:15px;height:15px}
.doc-copy-main:hover,.doc-copy-caret:hover{background:var(--bg-2);color:var(--ink);border-color:var(--ink-3)}
.doc-copy.open .doc-copy-caret{background:var(--bg-2);color:var(--ink)}
.doc-copy-menu{position:absolute;top:calc(100% + 6px);right:0;min-width:196px;background:var(--bg);
  border:1px solid var(--line);border-radius:11px;box-shadow:var(--shadow);padding:5px;display:none;z-index:30}
.doc-copy.open .doc-copy-menu{display:block}
.doc-copy-menu button{display:flex;align-items:center;gap:9px;width:100%;text-align:left;padding:8px 10px;
  border:none;background:none;border-radius:7px;color:var(--ink);font-family:var(--f-ui);font-size:13px;font-weight:500;cursor:pointer}
.doc-copy-menu button:hover{background:var(--bg-2)}
.doc-copy-menu button svg{width:15px;height:15px;color:var(--ink-3);flex:none}

/* Encuesta "¿Te sirvió esta página?" */
.doc-survey{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  max-width:760px;margin-top:44px;padding-top:22px;border-top:1px solid var(--line)}
.doc-survey .q{font-size:14px;font-weight:700;color:var(--ink)}
.doc-survey .q.done{font-weight:500;color:var(--ink-2)}
.doc-survey .btns{display:flex;gap:8px}
.doc-survey .btns button{display:inline-flex;align-items:center;gap:7px;padding:7px 15px;border:1px solid var(--line);
  border-radius:9px;background:var(--bg);color:var(--ink-2);font-family:var(--f-ui);font-size:13px;font-weight:600;cursor:pointer}
.doc-survey .btns button svg{width:15px;height:15px}
.doc-survey .btns button:hover{border-color:var(--ink);color:var(--ink);background:var(--bg-2)}
.doc-survey .btns button svg{transform-box:fill-box;transform-origin:center}
.doc-survey .btns button[data-v="yes"]:hover svg{animation:oni-thumbup .5s ease}
.doc-survey .btns button[data-v="no"]:hover svg{animation:oni-thumbdown .5s ease}
@keyframes oni-thumbup{30%{transform:translateY(-1.5px) rotate(-16deg) scale(1.14)}60%{transform:rotate(5deg)}100%{transform:none}}
@keyframes oni-thumbdown{30%{transform:translateY(1.5px) rotate(16deg) scale(1.14)}60%{transform:rotate(-5deg)}100%{transform:none}}
@media(prefers-reduced-motion:reduce){.doc-survey .btns button svg{animation:none!important}}
/* Íconos animados al hover (geometría Lucide + CSS) — solo en nav, tarjetas y callouts; nada se mueve solo */
[data-icon] .dr{stroke-dasharray:48;stroke-dashoffset:0}
[data-icon] .spin{transform-box:fill-box;transform-origin:center}
[data-icon] .eye{transform-box:fill-box;transform-origin:center}
[data-icon="gauge"] .needle{transform-box:view-box;transform-origin:12px 17px}
:is(.doc-sidebar a,.doc-card,.callout):hover [data-icon] .dr{animation:oni-draw .6s ease}
:is(.doc-sidebar a,.doc-card,.callout):hover [data-icon] .spin{animation:oni-spin .9s cubic-bezier(.4,0,.2,1)}
:is(.doc-sidebar a,.doc-card,.callout):hover [data-icon="lock"]{animation:oni-wobble .9s cubic-bezier(.4,0,.2,1)}
:is(.doc-sidebar a,.doc-card,.callout):hover [data-icon="rocket"]{animation:oni-launch .7s ease}
:is(.doc-sidebar a,.doc-card,.callout):hover [data-icon="arrow"]{animation:oni-nudge .5s ease}
:is(.doc-sidebar a,.doc-card,.callout):hover [data-icon="bulb"]{animation:oni-pop .5s ease}
:is(.doc-sidebar a,.doc-card,.callout):hover :is([data-icon="ruler"],[data-icon="building"],[data-icon="target"],[data-icon="link"],[data-icon="wall"]){animation:oni-pop .5s ease}
:is(.doc-sidebar a,.doc-card,.callout):hover :is([data-icon="scale"],[data-icon="cone"]){animation:oni-wobble .9s cubic-bezier(.4,0,.2,1)}
:is(.doc-sidebar a,.doc-card,.callout):hover [data-icon="external"]{animation:oni-out .5s ease}
:is(.doc-sidebar a,.doc-card,.callout):hover [data-icon="arrows"]{animation:oni-swap .6s ease}
:is(.doc-sidebar a,.doc-card,.callout):hover :is([data-icon="message"],[data-icon="alert"]){animation:oni-wobble .6s cubic-bezier(.4,0,.2,1)}
:is(.doc-sidebar a,.doc-card,.callout):hover [data-icon="upload"] .up{animation:oni-up .5s ease}
:is(.doc-sidebar a,.doc-card,.callout):hover [data-icon="bot"] .eye{animation:oni-blink .5s ease}
:is(.doc-sidebar a,.doc-card,.callout):hover [data-icon="layers"] .l1{animation:oni-lift1 .6s cubic-bezier(.4,0,.2,1)}
:is(.doc-sidebar a,.doc-card,.callout):hover [data-icon="layers"] .l2{animation:oni-lift2 .6s cubic-bezier(.4,0,.2,1)}
:is(.doc-sidebar a,.doc-card,.callout):hover [data-icon="plug"] .pa{animation:oni-unplug-a .5s ease}
:is(.doc-sidebar a,.doc-card,.callout):hover [data-icon="plug"] .pb{animation:oni-unplug-b .5s ease}
:is(.doc-sidebar a,.doc-card,.callout):hover [data-icon="gauge"] .needle{animation:oni-sweep .7s cubic-bezier(.4,0,.2,1)}
@keyframes oni-draw{from{stroke-dashoffset:48}to{stroke-dashoffset:0}}
@keyframes oni-spin{to{transform:rotate(360deg)}}
@keyframes oni-wobble{30%{transform:rotate(-4deg) scale(1.04)}60%{transform:rotate(2deg) scale(.99)}100%{transform:none}}
@keyframes oni-launch{30%{transform:translate(1.5px,-2px) rotate(4deg)}100%{transform:none}}
@keyframes oni-nudge{40%{transform:translateX(2.5px)}100%{transform:none}}
@keyframes oni-pop{30%{transform:scale(1.14)}55%{transform:scale(.97)}100%{transform:none}}
@keyframes oni-out{40%{transform:translate(2px,-2px)}100%{transform:none}}
@keyframes oni-swap{25%{transform:translateX(-2.5px)}70%{transform:translateX(2.5px)}100%{transform:none}}
@keyframes oni-up{40%{transform:translateY(-2px)}100%{transform:none}}
@keyframes oni-blink{0%,100%{transform:scaleY(1)}45%,55%{transform:scaleY(.12)}}
@keyframes oni-lift1{40%{transform:translateY(-3px)}100%{transform:none}}
@keyframes oni-lift2{40%{transform:translateY(-1.5px)}100%{transform:none}}
@keyframes oni-unplug-a{40%{transform:translate(-1.5px,1.5px)}100%{transform:none}}
@keyframes oni-unplug-b{40%{transform:translate(1.5px,-1.5px)}100%{transform:none}}
@keyframes oni-sweep{30%{transform:rotate(-32deg)}70%{transform:rotate(8deg)}100%{transform:none}}
@media(prefers-reduced-motion:reduce){:is(.doc-sidebar a,.doc-card,.callout):hover [data-icon],:is(.doc-sidebar a,.doc-card,.callout):hover [data-icon] *{animation:none!important}}
.doc-survey-no{width:100%;display:flex;flex-direction:column;gap:9px}
.doc-survey-no textarea{width:100%;font-family:var(--f-ui);font-size:13.5px;color:var(--ink);background:var(--bg-2);
  border:1px solid var(--line);border-radius:9px;padding:9px 11px;resize:vertical}
.doc-survey-no textarea:focus{outline:none;border-color:var(--red);background:var(--bg)}
.doc-survey-no .send{align-self:flex-start;font-size:13px;font-weight:700;color:#fff;background:var(--red);border-radius:9px;padding:8px 15px}
.doc-survey-no .send:hover{background:var(--red-deep);text-decoration:none}

/* ---------- TOC "en esta página" ------------------------------------------ */
.doc-toc{position:sticky;top:var(--topbar-h);height:calc(100vh - var(--topbar-h));overflow-y:auto;padding:38px 22px 60px 8px}
.doc-toc .toc-t{font-size:11.5px;font-weight:800;letter-spacing:.11em;text-transform:uppercase;color:var(--ink-3);margin:0 0 12px}
.doc-toc a{display:block;font-size:13px;color:var(--ink-3);padding:5px 0 5px 12px;border-left:2px solid var(--line);line-height:1.4}
.doc-toc a.lvl-3{padding-left:24px}
.doc-toc a:hover{color:var(--ink-2);text-decoration:none}
.doc-toc a.act{color:var(--red-deep);border-left-color:var(--red);font-weight:600}
/* "Actualizado el …": flag discreto al pie del riel (no toca el contenido) */
.doc-updated{display:flex;align-items:center;gap:7px;margin-top:22px;padding-top:15px;border-top:1px solid var(--line);font-size:12px;color:var(--ink-3);line-height:1.3}
.doc-updated .i{display:flex;flex:none;color:var(--ink-3)}
.doc-updated .i svg{width:14px;height:14px}
.doc-updated .cog{transform-box:fill-box;transform-origin:center}
.doc-updated:hover .cog{animation:oni-cogspin 1.4s ease-in-out}
@keyframes oni-cogspin{from{transform:rotate(0)}to{transform:rotate(180deg)}}
@media(prefers-reduced-motion:reduce){.doc-updated:hover .cog{animation:none}}

/* ---------- responsive ---------------------------------------------------- */
.doc-scrim{position:fixed;inset:0;background:rgba(26,26,26,.4);z-index:35;opacity:0;pointer-events:none;transition:opacity .2s}
.doc-scrim.on{opacity:1;pointer-events:auto}
@media(max-width:1120px){
  .doc-layout{grid-template-columns:var(--sidebar-w) minmax(0,1fr)}
  .doc-toc{display:none}
  .doc-main{padding:34px 40px 80px}
  .doc-sitelinks{display:none}
}
@media(max-width:860px){
  .doc-layout{grid-template-columns:1fr}
  .doc-hamburger{display:inline-flex}
  .doc-topbar-inner{gap:14px;padding:0 18px}
  .doc-sitelinks{display:none}
  .doc-search{flex-basis:auto;max-width:none;flex:1}
  .doc-search .kbd{display:none}
  .doc-sidebar{position:fixed;top:var(--topbar-h);left:0;bottom:0;width:min(84vw,320px);z-index:36;background:var(--bg);
    transform:translateX(-100%);transition:transform .22s ease;box-shadow:var(--shadow)}
  .doc-sidebar.on{transform:translateX(0)}
  .doc-main{padding:28px 22px 70px}
  .doc-content h1{font-size:30px}
}