:root {
  color-scheme: dark;
  --portal-bg: #0e120d;
  --portal-bg-2: #15180f;
  --portal-panel: #1c1b13;
  --portal-panel-2: #242117;
  --portal-ink: #eee3c8;
  --portal-muted: #a89e86;
  --portal-gold: #d8ab53;
  --portal-gold-2: #f0cf7a;
  --portal-rust: #a95432;
  --portal-green: #527052;
  --portal-line: rgba(214, 178, 102, .2);
  --portal-line-soft: rgba(238, 227, 200, .09);
  --portal-shadow: 0 28px 80px rgba(0, 0, 0, .48);
  --font-display: Cinzel, Georgia, serif;
  --font-ui: "Barlow Condensed", system-ui, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: var(--font-ui); color: var(--portal-ink); background: var(--portal-bg); -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--portal-gold-2); outline-offset: 3px; }

.landing-body { overflow-x: hidden; background: radial-gradient(circle at 74% 4%, rgba(112, 84, 38, .18), transparent 26%), var(--portal-bg); }
.site-header { position: sticky; z-index: 50; top: 0; height: 78px; display: flex; align-items: center; justify-content: space-between; padding: 0 max(4vw, 28px); border-bottom: 1px solid var(--portal-line-soft); background: rgba(14, 18, 13, .88); backdrop-filter: blur(20px); }
.portal-brand { display: inline-flex; align-items: center; gap: 12px; }
.portal-brand > span:last-child { display:grid; align-content:center; min-height:42px; }
.portal-mark { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; border: 1px solid #8f6d31; background: radial-gradient(circle, #292416 43%, #11140e 45%); box-shadow: inset 0 0 0 4px #15170f, 0 0 24px rgba(216,171,83,.08); }
.portal-mark svg { width: 28px; fill: none; stroke: var(--portal-gold); stroke-width: 1.6; }
.portal-mark img { width: 100%; height: 100%; display: block; padding:1px; object-fit: contain; object-position:center; }
.portal-brand strong { display: block; font: 700 16px/1 var(--font-display); letter-spacing: .01em; color: #f4dfaa; }
.portal-brand small { display: block; margin-top: 5px; color: #9c8a66; font-size: 10px; letter-spacing: .24em; text-transform: uppercase; }
.portal-brand.compact .portal-mark { width: 34px; height: 34px; }
.portal-brand.compact > span:last-child { min-height:34px; }
.portal-brand.compact strong { font-size: 13px; }
.site-nav { display: flex; align-items: center; gap: 28px; color: #b8ad96; font-size: 14px; font-weight: 600; letter-spacing: .04em; }
.site-nav > a:not(.portal-button):hover { color: #f2d999; }
.nav-divider { width: 1px; height: 20px; background: var(--portal-line); }
.nav-toggle { display: none; border: 1px solid var(--portal-line); border-radius: 5px; padding: 8px 12px; color: var(--portal-ink); background: var(--portal-panel); cursor: pointer; }

.portal-button { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: 14px; padding: 0 20px; border: 1px solid var(--portal-line); border-radius: 3px; color: #e6d7b8; font-weight: 700; letter-spacing: .045em; transition: transform .18s ease, filter .18s ease, border-color .18s ease; }
.portal-button:hover { transform: translateY(-2px); border-color: rgba(235,195,112,.48); }
.portal-button:disabled, .portal-button[aria-disabled="true"] { cursor: not-allowed; transform: none; filter: grayscale(.75); opacity: .58; }
.portal-button.primary { color: #21180b; border-color: #d7a84f; background: linear-gradient(180deg, #efcc77, #bd8736); box-shadow: inset 0 1px #fff3bd, 0 10px 34px rgba(164,108,38,.22); }
.portal-button.primary:hover { filter: brightness(1.08); }
.portal-button.quiet { background: rgba(255,255,255,.025); }
.portal-button.small { min-height: 36px; padding: 0 15px; color: #20180c; background: linear-gradient(#e8c56f,#bd8737); }
.portal-kicker { color: #d9ad58; font-size: 12px; font-weight: 700; letter-spacing: .22em; }

.hero-section { position: relative; min-height: 710px; display: grid; grid-template-columns: minmax(380px, .84fr) minmax(520px, 1.16fr); align-items: center; gap: clamp(30px, 5vw, 80px); padding: 76px max(5vw, 32px) 96px; overflow: hidden; }
.hero-section::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .13; background-image: repeating-linear-gradient(0deg, transparent 0 35px, #ab8b4b 36px), repeating-linear-gradient(90deg, transparent 0 35px, #ab8b4b 36px); mask-image: linear-gradient(90deg, #000, transparent 46%); transform: perspective(700px) rotateX(62deg) scale(1.3) translateY(32%); }
.hero-section::after { content: ""; position: absolute; width: 640px; height: 640px; border-radius: 50%; right: -100px; top: -250px; background: radial-gradient(circle, rgba(180,126,48,.16), transparent 66%); }
.hero-copy, .hero-visual { position: relative; z-index: 2; }
.hero-copy h1 { margin: 20px 0 22px; max-width: 680px; font: 700 clamp(43px, 5.4vw, 78px)/1.03 var(--font-display); letter-spacing: -.045em; color: #efe3c5; text-wrap: balance; }
.hero-copy h1 em { color: #dcb35f; font-style: normal; text-shadow: 0 6px 30px rgba(203,154,68,.14); }
.hero-copy > p { max-width: 615px; margin: 0; color: #aea58f; font-size: 19px; line-height: 1.55; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 31px; }
.hero-proof { display: flex; gap: 1px; margin-top: 42px; border: 1px solid var(--portal-line-soft); width: fit-content; background: var(--portal-line-soft); }
.hero-proof div { min-width: 126px; padding: 13px 18px; background: rgba(16,19,13,.88); }
.hero-proof strong { display: block; color: #ecd18e; font: 700 18px var(--font-display); }
/* #968d79 sobre el #2b2c23 de la tarjeta daba 4,29:1, por debajo del 4,5:1 que
   WCAG 2.2 AA exige al texto normal. Se sube el claro lo justo (4,63:1)
   conservando el tono: la etiqueta sigue leyéndose como secundaria. */
.hero-proof span { display: block; margin-top: 3px; color: #9b9380; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
.hero-visual { min-width: 0; perspective: 1100px; }
.hero-v2 { min-height: 760px; background: radial-gradient(circle at 72% 42%,rgba(8,92,91,.15),transparent 27%); }
.hero-v2 .hero-visual { padding: 34px 0 16px; }
.brand-orbit { position: absolute; z-index: -1; width: 72%; aspect-ratio: 1; right: 11%; top: 50%; transform: translateY(-50%); opacity: .14; filter: blur(.2px) drop-shadow(0 0 45px rgba(220,179,95,.28)); }
.brand-orbit::before, .brand-orbit::after { content:""; position:absolute; inset:-7%; border:1px solid rgba(220,179,95,.35); border-radius:50%; }
.brand-orbit::after { inset:-15%; border-style:dashed; animation: portal-orbit 42s linear infinite; }
.brand-orbit img { width:100%; height:100%; object-fit:contain; }
@keyframes portal-orbit { to { transform: rotate(360deg); } }
.map-frame { position: relative; padding: 41px 8px 8px; border: 1px solid #8b6b31; background: #11130e; box-shadow: var(--portal-shadow), inset 0 0 0 4px #242016; transform: rotateY(-7deg) rotateX(2deg); }
.map-frame::before, .map-frame::after { content: ""; position: absolute; width: 38px; height: 38px; border-color: #d1a24d; opacity: .65; }
.map-frame::before { left: -5px; top: -5px; border-left: 2px solid; border-top: 2px solid; }
.map-frame::after { right: -5px; bottom: -5px; border-right: 2px solid; border-bottom: 2px solid; }
.map-frame img { width: 100%; aspect-ratio: 16/10; display: block; object-fit: cover; object-position: center; background: #0c100f; opacity: 1; transition: opacity .35s; }
.map-frame-top { position: absolute; left: 15px; right: 15px; top: 12px; display: flex; justify-content: space-between; color: #b69b66; font-size: 10px; font-weight: 700; letter-spacing: .12em; }
.live-dot { color: #85b17b; }
.live-dot::before { content: ""; display: inline-block; width: 6px; height: 6px; margin-right: 6px; border-radius: 50%; background: #7bb870; box-shadow: 0 0 10px #7bb870; }
.map-coordinate { position: absolute; left: 21px; bottom: 18px; padding: 6px 9px; border: 1px solid rgba(219,178,92,.3); color: #d5c195; background: rgba(12,14,10,.85); font-size: 10px; letter-spacing: .08em; }
.floating-card { position: absolute; z-index: 4; display: flex; align-items: center; gap: 10px; min-width: 190px; padding: 12px 14px; border: 1px solid rgba(223,181,89,.35); background: rgba(26,25,17,.94); box-shadow: 0 16px 38px #0008; }
.floating-card > span { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; color: #e1b65c; background: #312818; }
.floating-card strong, .floating-card small { display: block; }
.floating-card strong { color: #e6d7b6; font-size: 13px; }
.floating-card small { color: #817967; font-size: 10px; margin-top: 2px; }
.floating-card-a { left: -35px; bottom: 42px; }
.floating-card-b { right: -18px; top: 62px; }
.media-skeleton { overflow: hidden; }
.media-skeleton img { opacity: 0; }
.media-skeleton::marker { display: none; }
.media-skeleton > img + * { visibility: hidden; }
.media-skeleton::after { content: ""; position: absolute; z-index: 1; inset: 0; background: linear-gradient(100deg, #171a13 20%, #29271c 38%, #171a13 56%); background-size: 300% 100%; animation: portal-shimmer 1.25s infinite; }
@keyframes portal-shimmer { to { background-position: -140% 0; } }

.trust-strip { min-height: 74px; display: flex; align-items: center; justify-content: center; gap: clamp(16px,3.2vw,48px); padding: 18px 30px; border-block: 1px solid var(--portal-line-soft); color: #948b78; background: #11140e; font: 700 12px var(--font-display); letter-spacing: .13em; }
.trust-strip i { width: 5px; height: 5px; transform: rotate(45deg); background: #8b6d37; }
.portal-section { max-width: 1320px; margin: 0 auto; padding: 112px 42px; }
.section-heading { max-width: 780px; margin-bottom: 46px; }
.section-heading.compact { max-width: none; text-align: center; }
.section-heading h2, .showcase-copy h2, .status-copy h2, .final-cta h2 { margin: 14px 0 16px; color: #eadfc5; font: 700 clamp(31px,4vw,51px)/1.12 var(--font-display); letter-spacing: -.035em; }
.section-heading p, .showcase-copy > p, .status-copy > p { color: #9f9784; font-size: 18px; line-height: 1.55; }
.feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.feature-card { position: relative; min-height: 285px; padding: 28px; overflow: hidden; border: 1px solid var(--portal-line-soft); background: linear-gradient(145deg, rgba(31,30,21,.92), rgba(20,22,16,.92)); transition: transform .2s, border-color .2s; }
.feature-card:hover { transform: translateY(-4px); border-color: rgba(218,174,86,.35); }
.feature-card.featured { grid-column: span 2; background: linear-gradient(135deg, rgba(74,59,29,.55), rgba(21,27,18,.95)); }
.feature-number { position: absolute; right: 20px; top: 16px; color: rgba(226,187,104,.17); font: 700 40px var(--font-display); }
.feature-icon { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid rgba(218,174,86,.28); color: #d9ae58; background: rgba(218,174,86,.06); font-size: 20px; }
.feature-card h3 { margin: 22px 0 12px; color: #e5d7b9; font: 700 19px/1.3 var(--font-display); }
.feature-card p { color: #9b9482; font-size: 15px; line-height: 1.55; }
.feature-card ul { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; margin: 22px 0 0; padding: 0; list-style: none; }
.feature-card li { padding-top: 10px; border-top: 1px solid var(--portal-line-soft); color: #b7a987; font-size: 12px; }
.feature-grid-v2 .feature-card { min-height: 300px; }
.feature-grid-v2 .feature-card:last-child { background: linear-gradient(145deg,rgba(26,50,44,.64),rgba(20,22,16,.92)); }
.showcase-section { display: grid; grid-template-columns: 1.12fr .88fr; align-items: center; gap: clamp(45px,7vw,110px); padding: 102px max(5vw,42px); background: linear-gradient(90deg, #151910, #1a1810); border-block: 1px solid var(--portal-line-soft); }
.showcase-media { position: relative; min-width: 0; padding: 8px; border: 1px solid #74582b; background: #0b0e0b; box-shadow: var(--portal-shadow); }
.showcase-media img { width: 100%; display: block; opacity: 1; transition: opacity .35s; }
.showcase-seal { position: absolute; right: -25px; bottom: -25px; width: 82px; height: 82px; display: grid; place-items: center; text-align: center; border: 1px solid #a37b35; border-radius: 50%; color: #d7ab54; background: #17180f; box-shadow: inset 0 0 0 6px #252116, 0 14px 30px #0008; font: 700 10px/1.5 var(--font-display); letter-spacing: .1em; }
.showcase-v2 { background: radial-gradient(circle at 8% 50%,rgba(18,102,96,.12),transparent 32%),linear-gradient(90deg,#151910,#1a1810); }
/* El voladizo de 31 px es decorativo y en escritorio cae dentro del relleno de
   la sección. En pantallas estrechas la sección casi no tiene relleno, así que
   el emblema asomaba 10 px por el borde derecho y provocaba scroll horizontal
   en la portada, en los cinco idiomas. El voladizo se calcula ahora contra el
   ancho disponible en vez de ser un número fijo. */
.showcase-emblem { position:absolute; right:-31px; bottom:-31px; width:94px!important; height:94px; object-fit:contain; filter:drop-shadow(0 15px 22px #000b); }
@media (max-width: 760px) {
  .showcase-emblem { right:-10px; bottom:-10px; width:66px!important; height:66px; }
}
.capability-list { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin-top: 32px; background: var(--portal-line-soft); }
.capability-list > div { position: relative; min-height: 94px; padding: 18px 15px 15px 54px; background: #171a12; }
.capability-list span { position: absolute; left: 16px; top: 19px; color: #d4aa56; font-size: 23px; }
.capability-list strong, .capability-list small { display: block; }
.capability-list strong { color: #d9ccb0; font-size: 14px; }
.capability-list small { color: #968d79; margin-top: 4px; }
.workflow-section { max-width: 1420px; }
.workflow-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; margin: 44px 0 0; padding: 0; background: var(--portal-line-soft); list-style: none; }
.workflow-grid li { min-height: 220px; padding: 30px 25px; background: #161910; }
.workflow-grid li > span { width: 36px; height: 36px; display: grid; place-items: center; transform: rotate(45deg); border: 1px solid #8d6c33; color: #e0b55e; font: 700 13px var(--font-display); }
.workflow-grid li > span::first-line { transform: rotate(-45deg); }
.workflow-grid strong { display: block; margin-top: 32px; color: #dfd2b6; font: 700 16px var(--font-display); }
.workflow-grid p { color: #8f8877; line-height: 1.5; }
.team-forge-section { max-width:1440px; margin:0 auto; padding:50px 42px 118px; scroll-margin-top:76px; }
.team-forge-heading { display:grid; grid-template-columns:minmax(360px,.9fr) minmax(420px,1.1fr); align-items:end; gap:70px; max-width:1260px; margin:0 auto 32px; }
.team-forge-heading h2 { max-width:720px; margin:12px 0 0; color:#efe2c2; font:700 clamp(31px,4vw,54px)/1.08 var(--font-display); letter-spacing:-.045em; text-wrap:balance; }
.team-forge-heading>p { max-width:650px; margin:0; color:#afa58f; font-size:17px; line-height:1.6; }
.team-forge-portrait { position:relative; max-width:1320px; margin:0 auto; overflow:hidden; border:1px solid rgba(221,180,89,.5); background:#11130e; box-shadow:0 35px 90px #000b,inset 0 0 0 4px rgba(13,15,10,.85); }
.team-forge-portrait::before { content:""; position:absolute; z-index:1; inset:10px; pointer-events:none; border:1px solid rgba(255,221,139,.15); }
.team-forge-portrait::after { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(180deg,transparent 62%,rgba(8,9,7,.7)); }
.team-forge-portrait img { width:100%; height:auto; display:block; object-fit:contain; filter:saturate(.96) contrast(1.03); }
.team-forge-portrait figcaption { position:absolute; z-index:2; right:22px; bottom:18px; padding:6px 9px; color:#e9cd87; border:1px solid rgba(224,180,82,.34); background:rgba(10,12,9,.76); font-size:10px; letter-spacing:.08em; text-transform:uppercase; }
.team-forge-roles { position:relative; z-index:3; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; max-width:1120px; margin:-38px auto 0; }
.team-forge-roles article { min-height:170px; padding:24px 26px; border:1px solid rgba(211,170,83,.35); background:linear-gradient(145deg,rgba(43,34,20,.97),rgba(16,20,14,.97)); box-shadow:0 20px 48px #0009; }
.team-forge-roles article::before { content:""; display:block; width:42px; height:2px; margin-bottom:16px; background:linear-gradient(90deg,#d6a746,transparent); }
.team-forge-roles .ai-role { border-color:rgba(93,153,119,.44); background:linear-gradient(145deg,rgba(23,52,38,.96),rgba(15,20,15,.98)); }
.team-forge-roles .ai-role::before { background:linear-gradient(90deg,#76a977,transparent); }
.team-forge-roles span,.team-forge-roles strong { display:block; }
.team-forge-roles span { color:#d3a64c; font-size:10px; font-weight:700; letter-spacing:.12em; }
.team-forge-roles .ai-role span { color:#8fbd91; }
.team-forge-roles strong { margin:8px 0; color:#f0ddb0; font:700 22px var(--font-display); }
.team-forge-roles p { margin:0; color:#ada38c; font-size:14px; line-height:1.55; }
.status-section { display: grid; grid-template-columns: .8fr 1.2fr; align-items: center; gap: 80px; }
/* 24 px de alto mínimo (WCAG 2.2 SC 2.5.8). `inline-flex` en vez de `block`
   para no ensanchar el enlace a toda la línea y volver pulsable el hueco. */
.text-link { display: inline-flex; align-items: center; min-height: 24px; color: #e0b45c; font-weight: 700; font-size: 16px; }
.text-link:hover { color: #f1d487; }
.status-board { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; padding: 1px; background: var(--portal-line-soft); }
.status-board > div { min-height: 92px; display: flex; flex-direction: column; justify-content: center; gap: 9px; padding: 16px 20px; background: #171a12; }
.status-board span { width: fit-content; padding: 3px 7px; border: 1px solid; font-size: 9px; font-weight: 700; letter-spacing: .12em; }
.status-board strong { color: #cec3aa; font-size: 14px; }
.status-ready { color: #8fc18a; border-color: rgba(104,162,97,.4)!important; background: rgba(84,137,80,.09); }
.status-next { color: #d4ae62; border-color: rgba(187,145,68,.4)!important; background: rgba(187,145,68,.08); }
.support-section { position:relative; display:grid; grid-template-columns:150px minmax(0,1fr) minmax(230px,.42fr); align-items:center; gap:38px; margin-top:54px; margin-bottom:54px; padding-top:52px; padding-bottom:52px; border:1px solid #80612d; background:radial-gradient(circle at 8%,rgba(16,113,103,.17),transparent 28%),radial-gradient(circle at 82%,rgba(165,112,39,.16),transparent 30%),#181b13; box-shadow:inset 0 0 0 5px #10140f,var(--portal-shadow); }
.support-section::before { content:""; position:absolute; inset:11px; pointer-events:none; border:1px solid rgba(219,180,96,.08); }
.support-seal { position:relative; z-index:1; }
.support-seal img { width:138px; height:138px; display:block; object-fit:contain; filter:drop-shadow(0 18px 20px #0008); }
.support-copy,.support-action { position:relative; z-index:1; }
.support-copy h2 { margin:13px 0 12px; color:#eadfc5; font:700 clamp(28px,3.4vw,42px)/1.12 var(--font-display); letter-spacing:-.035em; }
.support-copy p { max-width:680px; margin:0; color:#9f9784; font-size:17px; line-height:1.55; }
.support-action { display:grid; gap:12px; }
.support-action small { color:#887f6c; line-height:1.4; text-align:center; }
.paypal-button { width:100%; min-height:52px; border-radius:4px; }
.about-landing { grid-template-columns:140px minmax(0,1fr); }
.about-landing-copy { position:relative; z-index:1; }
.about-landing-copy h2 { margin:10px 0; color:#eadfc5; font:700 clamp(27px,3.2vw,40px)/1.12 var(--font-display); letter-spacing:-.035em; }
.about-landing-copy>p { max-width:690px; margin:0; color:#a59c88; font-size:16px; line-height:1.5; }
.landing-creators { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-top:18px; }
.landing-creators article { padding:13px; border:1px solid rgba(209,170,83,.21); background:linear-gradient(135deg,rgba(142,95,29,.13),rgba(40,78,54,.1)); }
.landing-creators small,.landing-creators strong,.landing-creators span { display:block; }
/* 8 px en versales y con `letter-spacing` es ilegible en pantalla; el cargo de
   cada persona del equipo se leía peor que su nombre. 10 px lo mantiene como
   rótulo secundario sin dejar de ser legible. */
.landing-creators small { color:#c99f4b; font-size:10px; font-weight:700; letter-spacing:.12em; }
.landing-creators strong { margin:4px 0; color:#e8d6ab; font:700 14px var(--font-display); }
.landing-creators span { color:#8f8775; font-size:11px; line-height:1.35; }
.about-landing .support-action { display:grid; grid-template-columns:1fr auto; align-items:center; gap:5px 18px; margin-top:18px; padding:18px; border:1px solid rgba(210,169,80,.22); background:rgba(10,14,11,.34); }
.about-landing .support-action p { margin:0; color:#9d947f; font-size:13px; line-height:1.4; }
.about-landing .support-action .portal-kicker,.about-landing .support-action p { grid-column:1; }
.about-landing .support-action .paypal-button { grid-column:2; grid-row:1 / span 2; }
.about-landing .support-action>small { grid-column:1 / -1; color:#766f60; }
.donation-campaign { grid-column:1 / -1; display:grid; gap:9px; margin-top:8px; padding:14px; border:1px solid rgba(215,172,78,.25); background:linear-gradient(110deg,rgba(147,91,26,.17),rgba(48,91,58,.13)); text-align:left; }
.donation-campaign>div { display:flex; align-items:end; justify-content:space-between; gap:14px; }
.donation-campaign span { color:#d1a84d; font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.donation-campaign strong { color:#f0d78f; font:700 15px var(--font-display); white-space:nowrap; }
.donation-campaign>i { height:12px; overflow:hidden; border:1px solid rgba(226,184,87,.3); border-radius:12px; background:#12130d; box-shadow:inset 0 2px 5px #0008; }
.donation-campaign>i>b { display:block; width:0; height:100%; border-radius:inherit; background:linear-gradient(90deg,#a35e28,#eebc4d 65%,#77ab70); box-shadow:0 0 18px rgba(228,179,65,.46); transition:width .7s ease; }
.about-landing .support-action .donation-campaign p { grid-column:auto; margin:0; color:#a79b80; font-size:11px; }
.final-cta { max-width: 1320px; min-height: 240px; margin: 20px auto 110px; padding: 48px; display: flex; align-items: center; justify-content: space-between; gap: 40px; border: 1px solid #81622e; background: radial-gradient(circle at 80%,rgba(148,102,36,.16),transparent 40%), #1d1c13; box-shadow: inset 0 0 0 5px #15170f; }
.final-cta h2 { max-width: 750px; font-size: clamp(27px,3.4vw,43px); }
.final-cta > div:last-child { display: flex; flex-direction: column; gap: 9px; min-width: 250px; }
.site-footer { min-height: 180px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 34px; padding: 38px max(5vw,32px); border-top: 1px solid var(--portal-line-soft); color: #928a77; background: #0a0d0a; }
.site-footer nav { display: flex; gap: 20px; color: #968b74; }
/* WCAG 2.2 SC 2.5.8 pide 24x24 px de objetivo. Estos enlaces medían 19 px de
   alto: son navegación autónoma, no enlaces en mitad de una frase, así que no
   les vale la excepción de los objetivos «en línea». Se les da altura sin
   separarlos más entre sí. */
.site-footer nav a { display: inline-flex; align-items: center; min-height: 24px; }
.site-footer nav a:hover { color: #d7b368; }
.site-footer > small { grid-column: 1/-1; text-align: center; }

/* Authentication */
.auth-body { min-height: 100vh; display: grid; place-items: center; padding: 30px; overflow-x: hidden; background: radial-gradient(circle at 10% 0, rgba(120,85,37,.2), transparent 32%), radial-gradient(circle at 100% 100%,rgba(62,92,57,.14),transparent 36%), #0d110d; }
.auth-body::before { content: ""; position: fixed; inset: 0; opacity: .08; pointer-events: none; background-image: linear-gradient(#d2aa5a 1px, transparent 1px), linear-gradient(90deg,#d2aa5a 1px,transparent 1px); background-size: 42px 42px; mask-image: radial-gradient(circle, #000, transparent 70%); }
.auth-shell { position: relative; z-index: 1; width: min(1040px,100%); min-height: 660px; display: grid; grid-template-columns: .92fr 1.08fr; border: 1px solid #765a2b; background: #14170f; box-shadow: 0 35px 100px #000a, inset 0 0 0 5px #0d100c; }
.auth-story { position: relative; display: flex; flex-direction: column; justify-content: flex-end; padding: 46px; overflow: hidden; border-right: 1px solid var(--portal-line); background: linear-gradient(0deg,rgba(13,17,12,.98),rgba(13,17,12,.18)), url('/static/media/atlas-editor-render-v14.png') center/cover; }
.auth-story::before { content:""; position:absolute; inset:0; background:linear-gradient(135deg,rgba(116,79,29,.24),transparent 45%); }
.auth-story > * { position: relative; z-index: 1; }
.auth-story h1 { margin: 16px 0 12px; color: #eee0bd; font: 700 37px/1.12 var(--font-display); }
.auth-story p { margin: 0; color: #aaa087; font-size: 17px; line-height: 1.5; }
.auth-story ul { display: grid; gap: 10px; margin: 26px 0 0; padding: 0; list-style: none; color: #c7b999; }
.auth-story li::before { content: "◆"; color: #d2a74f; margin-right: 10px; font-size: 8px; }
.auth-panel { padding: 42px clamp(32px,6vw,74px); background: linear-gradient(145deg,#1d1c13,#12160f); }
.auth-panel-top { display: flex; justify-content: space-between; align-items: center; }
/* 24 px de alto mínimo (WCAG 2.2 SC 2.5.8): es un enlace suelto, no en línea. */
.back-link { display: inline-flex; align-items: center; min-height: 24px; color: #938972; font-weight: 600; }
.back-link:hover { color: #e5c570; }
.auth-heading { margin: 56px 0 28px; }
.auth-heading h2 { margin: 9px 0 8px; color: #eadbbc; font: 700 29px var(--font-display); }
.auth-heading p { margin: 0; color: #8f8776; font-size: 16px; }
.auth-provider-section { display: grid; gap: 14px; margin-bottom: 18px; }
.google-auth-button { min-height: 49px; display: flex; align-items: center; justify-content: center; gap: 11px; width: 100%; border: 1px solid rgba(224,196,135,.36); border-radius: 3px; color: #e9dfca; background: linear-gradient(180deg,#25281f,#191d17); box-shadow: inset 0 1px rgba(255,255,255,.04); font: 700 15px var(--font-body); cursor: pointer; transition: border-color .16s, background .16s, transform .16s; }
.google-auth-button svg { width: 20px; height: 20px; flex: 0 0 20px; padding: 2px; border-radius: 2px; background: #fff; }
.google-auth-button:hover { border-color: #d3aa58; background: linear-gradient(180deg,#2d3025,#20251c); transform: translateY(-1px); }
.google-auth-button:disabled { cursor: wait; opacity: .72; transform: none; }
.auth-divider { display: flex; align-items: center; gap: 12px; color: #948c79; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; }
.auth-divider::before, .auth-divider::after { content: ""; height: 1px; flex: 1; background: var(--portal-line-soft); }
.auth-divider span { white-space: nowrap; }
.auth-form { display: grid; gap: 17px; }
.form-field { display: grid; gap: 7px; }
.form-field label { color: #cabb9d; font-weight: 700; font-size: 13px; letter-spacing: .04em; }
.form-field input,.form-field select,.form-field textarea { width: 100%; padding: 0 14px; border: 1px solid rgba(213,175,98,.22); border-radius: 3px; color: #f0e3c8; background: #0f130e; transition: border-color .16s, box-shadow .16s; }
.form-field input,.form-field select { height:48px; }
.form-field textarea { min-height:130px; padding-top:13px; resize:vertical; line-height:1.45; }
.form-field input::placeholder,.form-field textarea::placeholder { color: #8b8474; }
.form-field input:focus,.form-field select:focus,.form-field textarea:focus { border-color: #be9143; box-shadow: 0 0 0 3px rgba(190,145,67,.08); outline: none; }
.password-wrap { position: relative; }
.password-wrap input { padding-right: 62px; }
.password-toggle { position: absolute; right: 8px; top: 8px; height: 32px; border: 0; color: #a2967e; background: transparent; cursor: pointer; }
.password-toggle:hover { color: #e7c870; }
.form-hint { color: #9a917d; font-size: 12px; }
.form-error, .form-success { min-height: 0; padding: 10px 12px; border: 1px solid; font-size: 13px; line-height: 1.4; }
.form-error:empty, .form-success:empty { display: none; }
.form-error { color: #efaaa0; border-color: rgba(197,85,72,.35); background: rgba(148,54,43,.1); }
.form-success { color: #a8d19f; border-color: rgba(91,148,84,.35); background: rgba(67,112,63,.1); }
.auth-submit { position: relative; min-height: 49px; border: 1px solid #cf9c43; border-radius: 3px; color: #21180a; background: linear-gradient(#f0ce7b,#bc8433); box-shadow: inset 0 1px #fff1b4; font-weight: 800; letter-spacing: .05em; cursor: pointer; }
.auth-submit:hover { filter: brightness(1.08); }
.auth-submit:disabled { cursor: wait; filter: saturate(.72); }
.inline-spinner { display: inline-block; width: 14px; height: 14px; margin-right: 8px; vertical-align: -2px; border: 2px solid rgba(32,24,11,.25); border-top-color: #21180a; border-radius: 50%; animation: portal-spin .7s linear infinite; }
@keyframes portal-spin { to { transform: rotate(360deg); } }
.long-progress { height: 4px; overflow: hidden; border-radius: 4px; background: rgba(216,171,83,.1); }
.long-progress[hidden] { display: none; }
.long-progress::before { content:""; display:block; width:42%; height:100%; background:linear-gradient(90deg,transparent,#e2b85f,transparent); animation: portal-progress 1.15s ease-in-out infinite; }
@keyframes portal-progress { from { transform: translateX(-110%); } to { transform: translateX(280%); } }
.auth-switch { margin-top: 24px; padding-top: 19px; border-top: 1px solid var(--portal-line-soft); color: #8d8573; text-align: center; }
.auth-switch a { color: #e0b45d; font-weight: 700; }

/* Admin */
.admin-body { min-height: 100vh; background: #0d110d; }
.admin-shell { min-height: 100vh; display: grid; grid-template-columns: 244px 1fr; }
.admin-sidebar { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; padding: 28px 22px; border-right: 1px solid var(--portal-line-soft); background: #11150f; }
.admin-nav { display: grid; gap: 7px; margin-top: 48px; }
.admin-nav a { padding: 11px 12px; border: 1px solid transparent; color: #948a75; }
.admin-nav a.active { color: #e1c474; border-color: var(--portal-line); background: rgba(216,171,83,.06); }
.admin-sidebar-footer { margin-top: auto; display: grid; gap: 8px; }
.admin-main { min-width: 0; padding: 38px clamp(25px,5vw,70px) 70px; }
.admin-topbar { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.admin-title span { color: #c99743; font-size: 11px; letter-spacing: .18em; }
.admin-title h1 { margin: 6px 0 0; color: #e8dcc0; font: 700 31px var(--font-display); }
.admin-user { text-align: right; }
.admin-user strong, .admin-user small { display: block; }
/* 4,29:1 sobre el #0d110d del panel: no llegaba al 4,5:1 de WCAG 2.2 AA. */
.admin-user small { color: #847c6e; margin-top: 3px; }
.admin-stats { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; margin: 34px 0; }
.admin-stat { min-height: 116px; padding: 21px; border: 1px solid var(--portal-line-soft); background: linear-gradient(145deg,#1b1b13,#151810); }
.admin-stat span { color: #8e8572; font-size: 11px; letter-spacing: .12em; }
.admin-stat strong { display: block; margin-top: 13px; color: #e5c779; font: 700 28px var(--font-display); }
.admin-panel { border: 1px solid var(--portal-line-soft); background: #151810; }
.admin-panel-head { min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 17px 20px; border-bottom: 1px solid var(--portal-line-soft); }
.admin-panel-head h2 { margin: 0; color: #dcd0b5; font: 700 18px var(--font-display); }
.admin-search { width: min(310px,100%); height: 39px; padding: 0 12px; border: 1px solid var(--portal-line-soft); color: #dfd4ba; background: #0e120d; }
.admin-table-wrap { overflow-x: auto; }
.admin-table { width: 100%; border-collapse: collapse; }
.admin-table th, .admin-table td { padding: 15px 18px; border-bottom: 1px solid rgba(238,227,200,.06); text-align: left; }
.admin-table th { color: #9c927d; font-size: 11px; letter-spacing: .14em; }
.admin-table td { color: #b8ae98; font-size: 14px; }
.admin-table td strong { color: #ddd0b3; }
.role-badge { padding: 3px 7px; border: 1px solid var(--portal-line); color: #d5aa54; font-size: 9px; letter-spacing: .1em; text-transform: uppercase; }
.table-action { border: 1px solid rgba(216,171,83,.25); padding: 7px 10px; color: #dab35f; background: rgba(216,171,83,.05); cursor: pointer; }
.table-action:hover { background: rgba(216,171,83,.12); }
/* 4,09:1 sobre el #151810 del panel: era el peor de la portada de administración. */
.table-empty { padding: 46px; color: #898170; text-align: center; }
.table-skeleton { padding: 20px; }
.skeleton-row { height: 52px; margin-bottom: 8px; background: linear-gradient(100deg,#181b13 20%,#28261c 38%,#181b13 56%); background-size: 300% 100%; animation: portal-shimmer 1.2s infinite; }
.admin-dialog { width: min(480px,calc(100% - 32px)); padding: 0; border: 1px solid #80602c; color: var(--portal-ink); background: #171a12; box-shadow: 0 30px 90px #000b; }
.admin-dialog::backdrop { background: rgba(0,0,0,.72); backdrop-filter: blur(3px); }
.admin-dialog form { padding: 27px; }
.admin-dialog h2 { margin: 0 0 7px; font: 700 21px var(--font-display); }
.admin-dialog p { margin: 0 0 22px; color: #8f8775; }
.dialog-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 20px; }
.admin-button { min-height: 38px; padding: 0 14px; border: 1px solid var(--portal-line); color: #d9caaa; background: #211f16; cursor: pointer; }
.admin-button.primary { color: #21180a; border-color: #c69441; background: linear-gradient(#edca74,#ba8232); }

/* Updates, feedback and administrative inbox */
.updates-body { min-height:100vh; background:radial-gradient(circle at 74% 0,rgba(94,126,84,.12),transparent 28%),radial-gradient(circle at 8% 35%,rgba(173,117,39,.13),transparent 25%),#0e120d; }
.updates-main { min-height:calc(100vh - 78px); }
.updates-hero { max-width:1320px; margin:auto; min-height:430px; display:grid; grid-template-columns:1fr 240px; align-items:center; gap:70px; padding:70px 42px 55px; }
.updates-hero h1 { max-width:880px; margin:16px 0; color:#efe3c5; font:700 clamp(39px,5vw,67px)/1.05 var(--font-display); letter-spacing:-.045em; }
.updates-hero p { max-width:730px; color:#a79e88; font-size:19px; line-height:1.55; }
.updates-seal { width:210px; aspect-ratio:1; display:grid; place-items:center; align-content:center; gap:10px; border:1px solid rgba(215,174,87,.38); border-radius:50%; background:radial-gradient(circle,rgba(207,166,76,.13),#11150f 67%); box-shadow:inset 0 0 0 9px #0f130e,0 20px 70px #0008; }
.updates-seal img { width:116px; height:116px; object-fit:contain; }
.updates-seal span { color:#d8b462; font-size:10px; font-weight:700; letter-spacing:.14em; }
.updates-section { max-width:1160px; margin:0 auto; padding:65px 42px; }
.updates-heading { max-width:790px; margin-bottom:30px; }
.updates-heading h2 { margin:10px 0; color:#e9ddc1; font:700 clamp(28px,3vw,41px)/1.15 var(--font-display); }
.updates-heading p { color:#99917e; font-size:16px; line-height:1.5; }
.release-list { display:grid; gap:13px; }
.release-card { display:grid; grid-template-columns:180px 1fr; gap:30px; padding:26px; border:1px solid var(--portal-line-soft); background:linear-gradient(135deg,#191b13,#12160f); }
.release-card.current { border-color:rgba(218,174,82,.48); box-shadow:inset 4px 0 #c89842; }
.release-meta span,.release-meta time { display:block; }
.release-meta span { color:#ddb65e; font:700 11px var(--font-display); letter-spacing:.11em; }
.release-meta time { margin-top:8px; color:#766f60; font-size:12px; }
.release-card h3 { margin:0; color:#e7d6ae; font:700 20px var(--font-display); }
.release-card p { margin:7px 0 13px; color:#a09987; line-height:1.45; }
.release-card ul { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px 20px; margin:0; padding:0; list-style:none; color:#817b6d; font-size:13px; }
.release-card li::before { content:"◆"; margin-right:7px; color:#967130; font-size:7px; }
.release-loading div { height:20px; background:linear-gradient(90deg,#1c2017,#29281c,#1c2017); background-size:220% 100%; animation:portal-shimmer 1.2s infinite; }
.feedback-section { padding-bottom:110px; }
.feedback-guest { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:18px; padding:24px; border:1px solid var(--portal-line); background:#171a12; }
.feedback-guest>span { width:48px; height:48px; display:grid; place-items:center; border-radius:50%; color:#e3bb62; background:#2b2416; }
.feedback-guest strong { color:#e6d5ad; font:700 17px var(--font-display); }
.feedback-guest p { margin:4px 0 0; color:#888171; }
.feedback-form { display:grid; gap:17px; padding:28px; border:1px solid rgba(209,169,80,.3); background:linear-gradient(145deg,#191b13,#12150f); box-shadow:var(--portal-shadow); }
.feedback-form-grid { display:grid; grid-template-columns:.55fr 1.45fr; gap:16px; }
.feedback-actions { display:flex; justify-content:space-between; align-items:center; gap:18px; }
.feedback-actions>small { color:#777062; }
.my-feedback { margin-top:42px; }
.my-feedback>header { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:15px; }
.my-feedback h3 { margin:5px 0 0; color:#dfd2b5; font:700 23px var(--font-display); }
.my-feedback-list { display:grid; gap:10px; }
.feedback-ticket { padding:19px; border:1px solid var(--portal-line-soft); background:#151810; }
.feedback-ticket-top { display:flex; justify-content:space-between; gap:12px; }
.feedback-category,.feedback-status { padding:4px 7px; border:1px solid; font-size:10px; font-weight:700; letter-spacing:.09em; text-transform:uppercase; }
.feedback-category { color:#d7b96f; border-color:rgba(204,163,72,.28); }
.feedback-status { color:#91b98e; border-color:rgba(103,159,96,.3); }
.status-resolved,.status-closed { color:#8f897b; border-color:rgba(160,151,132,.24); }
.feedback-ticket h4 { margin:12px 0 6px; color:#e5d5b3; font:700 16px var(--font-display); }
.feedback-ticket>p { margin:0; color:#99917f; line-height:1.45; white-space:pre-wrap; }
.feedback-ticket>small { display:block; margin-top:12px; color:#6f695c; }
.admin-reply { display:grid; gap:4px; margin-top:13px; padding:11px; border-left:3px solid #668962; color:#a8bca2; background:rgba(60,94,57,.12); }
.admin-reply strong { color:#c3d4b9; font-size:11px; letter-spacing:.07em; text-transform:uppercase; }
.feedback-empty { padding:25px; border:1px dashed var(--portal-line); color:#7f7869; text-align:center; }
.admin-feedback-summary { display:flex; flex-wrap:wrap; gap:8px; padding:14px 20px; border-bottom:1px solid var(--portal-line-soft); }
.admin-feedback-summary span { padding:6px 9px; border:1px solid var(--portal-line); color:#9a927f; background:#10140f; }
.admin-feedback-message { max-width:420px; white-space:normal; color:#8e8676; }
.admin-feedback-note { margin-top:6px; color:#9db295; font-size:12px; }
.admin-panel + .admin-panel { margin-top:24px; }
.admin-dialog textarea { width:100%; min-height:110px; padding:11px; resize:vertical; border:1px solid var(--portal-line); color:#e5d8ba; background:#0e120d; }
.admin-dialog select { width:100%; height:44px; padding:0 10px; border:1px solid var(--portal-line); color:#e5d8ba; background:#0e120d; }

@media (max-width: 1050px) {
  /* La navegación pasa a menú desplegable EN CUANTO los enlaces dejan de caber,
     no a 760 px. Con siete enlaces más el selector de idioma y dos botones, a
     768 px el español, el alemán y el italiano se salían 77 px por la derecha y
     «Crear cuenta» quedaba entero fuera de la pantalla; el inglés y el
     portugués, con etiquetas más cortas, sí cabían. Un punto de corte calculado
     sobre el idioma más corto deja rotos a los demás, así que se colapsa en el
     mismo ancho en el que el resto de la portada ya pasa a una columna.
     `top: 100%` en vez de una altura fija: el alto de la cabecera cambia con el
     breakpoint de 760 px y un 72 px escrito a mano descolgaba el desplegable. */
  .nav-toggle { display: block; }
  .site-nav {
    position: absolute; left: 12px; right: 12px; top: 100%;
    display: none; flex-direction: column; align-items: stretch; gap: 0;
    padding: 12px; border: 1px solid var(--portal-line);
    background: #171a12; box-shadow: var(--portal-shadow);
  }
  .site-nav.open { display: flex; }
  .site-nav a { padding: 12px; }
  .nav-divider { width: 100%; height: 1px; }

  .hero-section { grid-template-columns: 1fr; padding-top: 55px; }
  .hero-copy { max-width: 760px; }
  .hero-visual { max-width: 850px; }
  .feature-grid { grid-template-columns: 1fr 1fr; }
  .showcase-section { grid-template-columns: 1fr; }
  .workflow-grid { grid-template-columns: 1fr 1fr; }
  .status-section { grid-template-columns: 1fr; gap: 38px; }
  .support-section { grid-template-columns:120px 1fr; }
  .about-landing { grid-template-columns:120px 1fr; }
  .team-forge-heading { grid-template-columns:1fr; align-items:start; gap:18px; }
  .support-action { grid-column:2; }
  .updates-hero { grid-template-columns:1fr; }
  .updates-seal { display:none; }
  .release-card { grid-template-columns:1fr; gap:15px; }
}
@media (max-width: 760px) {
  .site-header { height: 68px; padding: 0 18px; }
  /* Las reglas del menú desplegable viven en el bloque de 1050 px: ahí es donde
     los enlaces dejan de caber en español, alemán e italiano. */
  .hero-section { min-height: auto; grid-template-columns: 1fr; padding: 50px 20px 72px; }
  .hero-copy h1 { font-size: clamp(37px,12vw,56px); }
  .hero-copy > p { font-size: 17px; }
  .hero-actions { flex-direction: column; }
  .hero-proof { width: 100%; }
  .hero-proof div { min-width: 0; flex: 1; padding: 12px 9px; }
  .floating-card { display: none; }
  .map-frame { transform: none; }
  .trust-strip { flex-wrap: wrap; gap: 12px; font-size: 9px; }
  .portal-section { padding: 78px 20px; }
  .team-forge-section { padding:20px 20px 82px; }
  .team-forge-heading { margin-bottom:22px; }
  .team-forge-heading h2 { font-size:clamp(30px,10vw,43px); }
  .team-forge-heading>p { font-size:16px; }
  .team-forge-portrait figcaption { position:relative; right:auto; bottom:auto; display:block; padding:9px 12px; border:0; border-top:1px solid rgba(224,180,82,.2); font-size:9px; }
  .team-forge-portrait::after { display:none; }
  .team-forge-roles { grid-template-columns:1fr; margin:12px 0 0; }
  .team-forge-roles article { min-height:0; padding:20px; }
  .feature-grid { grid-template-columns: 1fr; }
  .feature-card.featured { grid-column: auto; }
  .feature-card ul { grid-template-columns: 1fr; }
  .showcase-section { padding: 75px 20px; }
  .capability-list { grid-template-columns: 1fr; }
  .workflow-grid { grid-template-columns: 1fr; }
  .workflow-grid li { min-height: 180px; }
  .status-board { grid-template-columns: 1fr; }
  .support-section { grid-template-columns:1fr; margin:35px 20px; padding:34px 25px; text-align:center; }
  .support-seal img { width:112px; height:112px; margin:0 auto; }
  .support-action { grid-column:auto; }
  .landing-creators { grid-template-columns:1fr; text-align:left; }
  .about-landing .support-action { grid-template-columns:1fr; }
  .about-landing .support-action .portal-kicker,.about-landing .support-action p,.about-landing .support-action .paypal-button,.about-landing .support-action>small { grid-column:1; grid-row:auto; }
  .donation-campaign>div { align-items:start; flex-direction:column; gap:5px; }
  .updates-hero,.updates-section { padding-inline:20px; }
  .updates-hero { min-height:360px; }
  .release-card ul { grid-template-columns:1fr; }
  .feedback-form-grid { grid-template-columns:1fr; }
  .feedback-actions,.my-feedback>header { align-items:stretch; flex-direction:column; }
  .feedback-guest { grid-template-columns:1fr; text-align:center; }
  .final-cta { margin: 10px 20px 75px; padding: 28px; flex-direction: column; align-items: stretch; }
  .site-footer { grid-template-columns: 1fr; text-align: center; }
  .site-footer nav { justify-content: center; flex-wrap: wrap; }
  .auth-body { padding: 0; place-items: stretch; }
  .auth-shell { min-height: 100vh; grid-template-columns: 1fr; border: 0; }
  .auth-story { min-height: 300px; padding: 30px; }
  .auth-panel { padding: 32px 24px 50px; }
  .auth-heading { margin-top: 38px; }
  .admin-shell { grid-template-columns: 1fr; }
  .admin-sidebar { position: static; height: auto; flex-direction: row; align-items: center; justify-content: space-between; padding: 16px 20px; border-right: 0; border-bottom: 1px solid var(--portal-line-soft); }
  .admin-nav { display: none; }
  .admin-sidebar-footer { margin: 0; display: flex; }
  .admin-main { padding: 28px 16px 50px; }
  /* El título y el bloque de usuario iban en una sola fila con
     `space-between`, sin permiso para envolver: a 360 px se salían 51 px en
     español y 140 px en alemán —«Benutzerverwaltung» a 31 px mide 362 px, más
     que la pantalla entera—. Envolver y escalar el titular lo mantiene dentro
     sin tocar ninguna traducción. */
  .admin-topbar { flex-wrap: wrap; gap: 12px; }
  .admin-title { min-width: 0; }
  .admin-title h1 { font-size: clamp(21px, 6.4vw, 31px); overflow-wrap: anywhere; }
  .admin-user { min-width: 0; text-align: left; }
  .admin-user strong, .admin-user small { overflow-wrap: anywhere; }
  .admin-stats { grid-template-columns: 1fr; }
  .admin-panel-head { align-items: stretch; flex-direction: column; }
  .admin-search { width: 100%; }
}
.auth-shell.single { grid-template-columns:minmax(320px,680px); justify-content:center; }
/* Medía 14 px de alto. Se le da los 24 px de WCAG 2.2 SC 2.5.8 con la caja
   ceñida al texto (`inline-flex` dentro de un contenedor alineado a la
   derecha), para no convertir toda la anchura del formulario en zona pulsable.
   El margen negativo se ajusta de -9 a -14 px para compensar los 10 px de alto
   añadidos y dejar el enlace donde estaba. */
/* `width: fit-content` + `margin-left: auto`: la caja se ciñe al texto y sigue
   pegada a la derecha. Con `display:block` el enlace ocupaba los 312 px de la
   fila y hacía pulsable todo el hueco vacío; con `flex` a secas pasaría lo
   mismo. El margen negativo baja de -9 a -14 px para absorber los 10 px de alto
   que se ganan y dejar el enlace donde estaba. */
.auth-help-link { display:flex; align-items:center; width:fit-content; min-height:24px; margin-top:-14px; margin-left:auto; color:#cfaa58; font:600 12px var(--font-ui); text-decoration:none; }
.auth-help-link:hover { color:#f0d184; text-decoration:underline; }
.form-success { min-height:18px; color:#8fca8a; font:600 12px/1.4 var(--font-ui); }

/* i18n cloak */
/* El HTML servido está en es-CL: si el locale activo es otro, existe un instante entre el
   primer paint y la primera pasada de AtlasI18n.apply() en el que se vería el español.
   static/i18n.js pone <html data-i18n-cloak> durante esa pasada y lo retira al acabar
   (con failsafe por temporizador para no dejar la página en blanco). El ::before cubre ese
   instante con el fondo real del portal, evitando el destello blanco. */
html[data-i18n-cloak] body { visibility: hidden; }
html[data-i18n-cloak] body::before {
  content: "";
  position: fixed;
  z-index: 2147483647;
  inset: 0;
  visibility: visible;
  background: var(--portal-bg, #0e120d);
}
@media (prefers-reduced-motion: reduce) {
  html[data-i18n-cloak] body::before { animation: none; transition: none; }
}

/* selector de idioma */
/* Listbox del ANEXO A. Los colores salen de las variables del portal para no desviarse de
   los contrastes que fijó la auditoría de accesibilidad. El disparador y las opciones usan
   white-space: nowrap y anchos elásticos porque "Português (Brasil)" y "Deutsch" no miden
   lo mismo que "Español (Chile)": el selector crece, la barra no se rompe. */
.lang-switch { position: relative; display: flex; align-items: center; }
.lang-switch-label, .lang-switch-status { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.lang-switch-trigger { min-height: 38px; display: inline-flex; align-items: center; gap: 8px; padding: 0 11px; border: 1px solid var(--portal-line); border-radius: 4px; color: var(--portal-ink); background: var(--portal-panel); font: 600 13px var(--font-ui); letter-spacing: .04em; white-space: nowrap; cursor: pointer; transition: border-color .16s ease, background .16s ease; }
.lang-switch-trigger:hover { border-color: var(--portal-gold); background: var(--portal-panel-2); }
.lang-flag { font-size: 15px; line-height: 1; }
.lang-code { color: var(--portal-gold-2); font-weight: 700; }
.lang-name { color: var(--portal-ink); font-weight: 600; }
.lang-caret { color: var(--portal-muted); font-size: 10px; transition: transform .16s ease; }
.lang-switch.open .lang-caret { transform: rotate(180deg); }
.lang-switch-list { position: absolute; z-index: 60; top: calc(100% + 8px); right: 0; min-width: max(100%, 230px); max-width: min(320px, calc(100vw - 24px)); max-height: min(60vh, 340px); overflow-y: auto; margin: 0; padding: 6px; border: 1px solid var(--portal-line); border-radius: 6px; background: #171a12; box-shadow: var(--portal-shadow); list-style: none; }
.lang-switch-list[hidden] { display: none; }
.lang-option { min-height: 40px; display: flex; align-items: center; gap: 9px; padding: 8px 10px; border-radius: 4px; color: var(--portal-ink); font: 600 13px var(--font-ui); letter-spacing: .03em; white-space: nowrap; cursor: pointer; }
.lang-option:hover { background: rgba(216, 171, 83, .12); }
.lang-option:focus-visible { outline: 2px solid var(--portal-gold-2); outline-offset: -2px; }
.lang-option[aria-selected="true"] { background: rgba(216, 171, 83, .16); color: #f7e6bb; }
.lang-check { margin-left: auto; color: var(--portal-gold-2); }
.lang-option[aria-selected="false"] .lang-check { visibility: hidden; }
@media (max-width: 1050px) {
  .lang-switch-trigger { gap: 6px; padding: 0 8px; font-size: 12px; }
}
@media (max-width: 760px) {
  /* Dentro del panel plegable de navegación la lista va en flujo: así nunca se sale de la pantalla. */
  .lang-switch { display: block; width: 100%; }
  .lang-switch-trigger { width: 100%; justify-content: flex-start; margin: 4px 0; font-size: 13px; }
  .lang-caret { margin-left: auto; }
  .lang-switch-list { position: static; min-width: 0; max-width: none; max-height: 46vh; margin-top: 6px; background: #1b1f16; box-shadow: none; }
}
@media (prefers-reduced-motion: reduce) {
  .lang-switch-trigger, .lang-caret { transition: none; }
}