/* AstroVenus · tema oscuro «Punk». Excepción acordada a DESIGN.md: solo existe bajo html.av-punk (clase que pone punk.js).
   Bloques planos: sin degradados ni box-shadow; único brillo permitido, text-shadow suave (<= 8px, <= 40%) en títulos y acentos.
   Tipografías ya alojadas (Poppins, Source Serif 4, JetBrains Mono). Contraste AA comprobado en tests/js/punk_css_test.js. */

/* Variables del plugin (.av) y del tema. La especificidad supera a los bloques oscuros de astrovenus.css y style.css. */
html.av-punk:root:not([data-theme="punk"]) .av:not([data-av-theme="punk"]),
html.av-punk:root:not([data-theme="punk"]) .av[data-av-theme]{
  --av-paper:#0E0B16;--av-surface:#171225;--av-ink:#F3EEDC;--av-muted:#9A93AD;--av-rule:#2B2340;
  --av-accent:#FCEE0A;--av-on-accent:#0E0B16;--av-harm:#19D3F3;--av-tens:#FF2A6D;--av-warn:#FCEE0A;--av-err:#FF2A6D;--av-ok:#19D3F3;
  color-scheme:dark}
html.av-punk:root:not([data-theme="punk"]){
  --av-punk-pink:#FF2A6D;--av-punk-cyan:#19D3F3;--av-punk-yellow:#FCEE0A;--av-punk-on-yellow:#0E0B16;
  --av-rule:#2B2340;--av-paper:#0E0B16;--av-surface:#171225;--av-ink:#F3EEDC;--av-muted:#9A93AD;--av-accent:#FCEE0A;--av-on-accent:#0E0B16;--av-harm:#19D3F3;--av-tens:#FF2A6D;
  --wp--preset--color--paper:#0E0B16;--wp--preset--color--surface:#171225;--wp--preset--color--ink:#F3EEDC;--wp--preset--color--muted:#9A93AD;
  --wp--preset--color--rule:#2B2340;--wp--preset--color--accent:#FCEE0A;--wp--preset--color--on-accent:#0E0B16;
  color-scheme:dark}

/* Chrome del sitio (tema): fondo, texto, enlaces, cabecera, menú, pie y formularios */
html.av-punk body{background:#0E0B16;color:#F3EEDC}
html.av-punk .wp-site-blocks>header,html.av-punk .wp-site-blocks>footer{background:#0E0B16;color:#F3EEDC}
html.av-punk .wp-site-blocks>footer{background:#171225;border-top:2px solid #FF2A6D}
html.av-punk .wp-site-blocks>header{border-bottom:1px solid #2B2340}
/* Los enlaces-botón (.av-btn, .wp-block-button__link) llevan su propio color: se excluyen, si no el enlace (0,2,2) pisaba al botón y salía cian sobre amarillo */
html.av-punk .wp-site-blocks a:not(.av-btn):not(.wp-block-button__link){color:#19D3F3}
html.av-punk .wp-site-blocks a:not(.av-btn):not(.wp-block-button__link):hover{color:#FCEE0A}
html.av-punk .wp-site-blocks>header .wp-block-navigation__submenu-container{background:#171225!important;border-color:#2B2340!important}
html.av-punk .wp-site-blocks>header .wp-block-navigation__responsive-container.is-menu-open{background:#0E0B16!important;color:#F3EEDC!important}
/* Reglas !important del tema que se pisan (especificidad theme -> punk, todas con !important, así no depende del orden):
   - style.css:21 y :24 (botón relleno, (0,5,1), en modo noche explícito y en :root sin data-theme con SO oscuro) -> las dos primeras variantes (0,6,2)
   - sin data-theme="dark" ni OS oscuro, o data-theme="light", no hay regla !important del tema: basta la tercera, (0,3,1) frente al estilo de WP
   - style.css:13 (hover, (0,3,0)) y :14 (hover del contorno, (0,4,0)) -> reglas :hover de abajo, (0,4,1) y (0,5,1)
   - style.css:88/104/133 (menús, vars del tema ya en paleta punk) -> bloque de menús, (0,3,2) y (0,4,2); el submenú móvil conserva su fondo transparente */
html.av-punk:root[data-theme="dark"] body .wp-block-button:not(.is-style-outline) .wp-block-button__link,
html.av-punk:root:not([data-theme="light"]) body .wp-block-button:not(.is-style-outline) .wp-block-button__link,
html.av-punk .wp-block-button .wp-block-button__link{background:#FCEE0A!important;color:#0E0B16!important;border-radius:0;font-weight:700}
html.av-punk .wp-block-button .wp-block-button__link:hover,
html.av-punk:root[data-theme="dark"] body .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,
html.av-punk:root:not([data-theme="light"]) body .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover{background:#FF2A6D!important;color:#0E0B16!important}
html.av-punk .wp-block-button.is-style-outline .wp-block-button__link{background:transparent!important;color:#FCEE0A!important;border:2px solid #FCEE0A}
html.av-punk .wp-block-button.is-style-outline .wp-block-button__link:hover{background:#FCEE0A!important;color:#0E0B16!important}
html.av-punk :focus-visible{outline:3px solid #FCEE0A;outline-offset:2px}
html.av-punk .av-theme-toggle{color:#F3EEDC;border-color:#2B2340}

/* Tipografía: títulos con brillo suave; lectura en serif, datos en mono (como DESIGN.md) */
html.av-punk h1,html.av-punk h2,html.av-punk h3,html.av-punk .av-h{color:#F3EEDC;text-shadow:0 0 8px rgba(255,42,109,.4)}
html.av-punk .av-reading,html.av-punk .av-sub{font-family:var(--av-serif,'Source Serif 4',Georgia,serif)}
html.av-punk .av-mono,html.av-punk .av-steps{font-family:var(--av-mono,'JetBrains Mono',ui-monospace,monospace)}
html.av-punk .av-steps li.is-on{color:#FCEE0A;text-shadow:0 0 6px rgba(252,238,10,.4)}

/* Componentes del plugin: bloques planos, esquinas rectas, borde nítido */
html.av-punk .av-panel,html.av-punk .av input[type=text],html.av-punk .av input[type=date],html.av-punk .av input[type=time],html.av-punk .av input[type=search],html.av-punk .av-seg{border-radius:0;border-color:#2B2340}
html.av-punk .av-panel{background:#171225;border-left:4px solid #FF2A6D}
html.av-punk .av input:focus{border-color:#FCEE0A}
html.av-punk .av :focus-visible{outline:3px solid #FCEE0A;outline-offset:2px}
html.av-punk .av-btn{border-radius:0;border-color:#FCEE0A;background:#FCEE0A;color:#0E0B16;font-weight:700}
html.av-punk .av-btn:hover:not(:disabled){background:#FF2A6D;border-color:#FF2A6D;color:#0E0B16}
html.av-punk .av-btn.is-ghost{background:transparent;color:#FCEE0A}
html.av-punk .av-btn.is-ghost:hover:not(:disabled){background:#FCEE0A;color:#0E0B16;border-color:#FCEE0A}
html.av-punk .av-seg label:has(input:checked){background:#FCEE0A;color:#0E0B16}
html.av-punk .av-badge{color:#FCEE0A;border:1px solid #FCEE0A;border-radius:0;background:#0E0B16;text-shadow:0 0 6px rgba(252,238,10,.4)}

/* Botón fijo «Modo Punk»: la imagen de la titular (assets/img/punk-toggle*.webp, recortada a la píldora, relación 3,55:1) pone el gráfico;
   el nombre accesible va en un span oculto (.av-punk-toggle__label). Reglas base SIN alcance html.av-punk (lista cerrada en punk_css_test.js):
   es el primer contacto del visitante con Punk apagado. Sin degradados ni box-shadow; el estado encendido se dibuja con un anillo rosa (::before) y una etiqueta «ON» (::after). */
.av-punk-toggle{position:fixed;right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));z-index:9990;
  width:200px;height:56px;padding:0;margin:0;border:0;border-radius:999px;cursor:pointer;
  background-color:transparent;background-image:url(../img/punk-toggle.webp);
  background-image:image-set(url(../img/punk-toggle.webp) 1x,url(../img/punk-toggle@2x.webp) 2x);
  background-size:contain;background-position:center;background-repeat:no-repeat;transition:transform .15s ease,filter .15s ease}
@media (hover:hover){
  .av-punk-toggle:hover{transform:scale(1.04);filter:brightness(1.08)}
}
.av-punk-toggle:focus-visible{outline:3px solid #1F7AE0;outline-offset:4px}
.av-punk-toggle__label{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap;border:0}
.av-punk-toggle[aria-pressed="true"]::before{content:"";position:absolute;inset:-5px;border:3px solid #FF2A6D;border-radius:999px;pointer-events:none}
.av-punk-toggle[aria-pressed="true"]::after{content:"ON";position:absolute;top:-12px;left:14px;padding:1px 8px;border:2px solid #FF2A6D;border-radius:999px;
  background:#0E0B16;color:#FCEE0A;font:700 .75rem/1.3 var(--av-mono,'JetBrains Mono',ui-monospace,monospace);letter-spacing:.08em;pointer-events:none}
@media (min-width:1024px){
  .av-punk-toggle{bottom:max(92px,env(safe-area-inset-bottom))}
}
@media (max-width:480px){
  .av-punk-toggle{width:156px;height:44px;right:max(12px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom))}
}
@media (prefers-reduced-motion:reduce){
  .av-punk-toggle{transition:none}
  .av-punk-toggle:hover{transform:none}
}

/* Aviso del modo (role=note): bloque con regla rosa a la izquierda y aire de etiqueta mono */
html.av-punk .av-punk-notice{background:#171225;color:#F3EEDC;border:1px solid #2B2340;border-left:4px solid #FF2A6D;border-radius:0;
  padding:12px 14px;margin:0 0 16px;font:400 .8125rem/1.5 var(--av-mono,'JetBrains Mono',ui-monospace,monospace);overflow-wrap:anywhere}

/* Aviso emergente al activar el modo (punk.js): plano, sobre el botón, descartable */
html.av-punk .av-punk-toast{position:fixed;left:12px;right:12px;bottom:72px;z-index:9991;max-width:28rem;margin-left:auto;display:flex;gap:8px;align-items:flex-start;
  background:#171225;color:#F3EEDC;border:1px solid #2B2340;border-left:4px solid #FF2A6D;border-radius:0;padding:12px 8px 12px 14px;
  font:400 .8125rem/1.5 var(--av-mono,'JetBrains Mono',ui-monospace,monospace)}
html.av-punk .av-punk-toast p{margin:0;flex:1;overflow-wrap:anywhere}
html.av-punk .av-punk-toast-close{min-width:44px;min-height:44px;margin:-8px 0;background:transparent;color:#FCEE0A;border:1px solid #FCEE0A;border-radius:0;
  font:700 1.25rem/1 var(--av-mono,'JetBrains Mono',ui-monospace,monospace);cursor:pointer}
html.av-punk .av-punk-toast-close:hover{background:#FCEE0A;color:#0E0B16}
html.av-punk .av-punk-toast-close:focus-visible{outline:3px solid #19D3F3;outline-offset:2px}

/* Botones «Ver interpretación clásica» */
html.av-punk [data-av-classic]{min-height:44px;min-width:44px;padding:8px 12px;background:transparent;color:#19D3F3;border:1px solid #19D3F3;border-radius:0;
  font:500 .8125rem/1.2 var(--av-mono,'JetBrains Mono',ui-monospace,monospace);cursor:pointer;max-width:100%}
html.av-punk [data-av-classic]:hover{background:#19D3F3;color:#0E0B16}
html.av-punk [data-av-classic][aria-pressed="true"]{background:#19D3F3;color:#0E0B16;font-weight:700}
html.av-punk [data-av-classic]:focus-visible{outline:3px solid #FCEE0A;outline-offset:2px}

/* Sin animaciones propias; si el tema o el navegador las añaden, se anulan */
@media (prefers-reduced-motion:reduce){
  html.av-punk *,html.av-punk *::before,html.av-punk *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
/* Móvil de 360 px: nada desborda */
@media (max-width:480px){
  html.av-punk .av-panel{padding:16px}
}

/* Aprende Tarot, mazo Punk: número y nombre dibujados sobre las bandas vacías de la carta (tarot-punk.js los crea; solo en imágenes Punk).
   Geometría por defecto = bandas de las cartas de prueba (arriba 0-9 %, abajo 86-98 % del alto); el arte final puede ajustarla con estas variables.
   Chip crema sólido (#F3EEDC) con tinta #0E0B16: contraste 15:1 (AA) sea cual sea el color de la banda. */
html.av-punk{--punk-label-top-h:9%;--punk-label-bottom-top:86%;--punk-label-bottom-h:12%;--punk-label-bg:#F3EEDC;--punk-label-ink:#0E0B16}
html.av-punk .tr-punk-label{position:absolute;left:4%;right:4%;display:flex;align-items:center;justify-content:center;box-sizing:border-box;overflow:hidden;
  background:var(--punk-label-bg);color:var(--punk-label-ink);font:700 clamp(.5rem,2.6cqw + .35rem,.95rem)/1.1 "Poppins",system-ui,sans-serif;letter-spacing:.04em;text-transform:uppercase;text-align:center;white-space:nowrap;text-overflow:ellipsis;pointer-events:none;border-radius:2px}
html.av-punk .tr-punk-label.is-top{top:0;height:var(--punk-label-top-h)}
html.av-punk .tr-punk-label.is-bottom{top:var(--punk-label-bottom-top);height:var(--punk-label-bottom-h)}
html.av-punk .tr-static,html.av-punk .tr-front{container-type:inline-size}

/* ==========================================================================================================================
   PÁGINAS REALES (revisión con capturas): componentes con paleta propia que el bloque base no cubría. Un solo conjunto de reglas para oscuro y claro,
   escrito con las variables --av-* (que cada tema define), de modo que el claro hereda sin duplicar. Especificidad (0,4-7,x) frente a form-ill.css
   (:root[data-theme="dark"] .fm… (0,4,0)) y al tema (style.css:246, (0,3,1) con color !important, pisado con (0,4,2) !important).
   ========================================================================================================================== */
/* Botón «Crear cuenta» del menú (theme style.css:246-247): relleno amarillo con tinta, esquinas rectas */
html.av-punk .wp-site-blocks>header .av-nav-cta>.wp-block-navigation-item__content{background:var(--av-punk-yellow);color:var(--av-punk-on-yellow)!important;border-radius:0;font-weight:700}
/* Carta natal (.fm--ill, form-ill.css): se reasignan sus variables --fm-* a la paleta Punk; todo lo que las usa (títulos, pasos, iconos, tabla) las hereda */
html.av-punk:root:not([data-theme="punk"]) .fm.fm--ill{--fm-parch:var(--av-paper);--fm-card:var(--av-surface);--fm-line:var(--av-rule);--fm-gold:var(--av-accent);--fm-red:var(--av-tens);--fm-navy:var(--av-harm);--fm-ink:var(--av-ink)}
html.av-punk:root:not([data-theme="punk"]) .fm-herobox{background:var(--av-surface);border:1px solid var(--av-rule);border-left:4px solid var(--av-tens);border-radius:0}
html.av-punk:root:not([data-theme="punk"]) .fm--ill .fm-card.av-panel{background:var(--av-surface);border:1px solid var(--av-rule);border-left:4px solid var(--av-tens);border-radius:0}
html.av-punk:root:not([data-theme="punk"]) .fm--ill input[type=date],html.av-punk:root:not([data-theme="punk"]) .fm--ill input[type=time],html.av-punk:root:not([data-theme="punk"]) .fm--ill input[type=text],html.av-punk:root:not([data-theme="punk"]) .fm--ill select,html.av-punk:root:not([data-theme="punk"]) .fm--ill .av-seg{background:var(--av-paper);border-color:var(--av-muted);border-radius:0;color:var(--av-ink)}
html.av-punk:root:not([data-theme="punk"]) .fm--ill .av-seg label{border-color:var(--av-rule)}
html.av-punk:root:not([data-theme="punk"]) .fm--ill input:focus,html.av-punk:root:not([data-theme="punk"]) .fm--ill select:focus{border-color:var(--av-tens);box-shadow:none;outline:3px solid var(--av-tens);outline-offset:2px}
html.av-punk:root:not([data-theme="punk"]) .fm--ill .av-seg label:has(input:checked){background:var(--av-punk-yellow);color:var(--av-punk-on-yellow)}
html.av-punk:root:not([data-theme="punk"]) .fm--ill .av-btn{background:var(--av-punk-yellow);border-color:var(--av-punk-yellow);color:var(--av-punk-on-yellow);border-radius:0;font-weight:700}
html.av-punk:root:not([data-theme="punk"]) .fm--ill .av-btn:hover:not(:disabled){background:var(--av-tens);border-color:var(--av-tens);color:var(--av-punk-on-yellow)}
html.av-punk:root:not([data-theme="punk"]) .fm--ill .av-btn.is-ghost{background:transparent;color:var(--av-accent)}
html.av-punk:root:not([data-theme="punk"]) .fm--ill .av-btn.is-ghost:hover:not(:disabled){background:var(--av-punk-yellow);border-color:var(--av-punk-yellow);color:var(--av-punk-on-yellow)}
html.av-punk:root:not([data-theme="punk"]) .fm--ill .av-steps .fm-n{background:var(--av-surface);border-color:var(--av-accent);color:var(--av-ink)}
html.av-punk:root:not([data-theme="punk"]) .fm--ill .av-steps li.is-cur .fm-n{background:var(--av-tens);border-color:var(--av-tens);color:var(--av-punk-on-yellow)}
html.av-punk:root:not([data-theme="punk"]) .fm-bico{background:var(--av-surface);border:1px solid var(--av-rule)}
html.av-punk:root:not([data-theme="punk"]) .fm-benefits li:not(:last-child)::after{background:var(--av-rule)}
/* Páginas de módulos con capa ilustrada (.av-wrap.ill, ill.css): mismas reasignaciones que la carta natal (el tema oscuro de ill.css pinta salmón #B24A3C) */
html.av-punk:root:not([data-theme="punk"]) .av-wrap.ill{--il-parch:var(--av-paper);--il-card:var(--av-surface);--il-line:var(--av-rule);--il-gold:var(--av-accent);--il-red:var(--av-tens);--il-navy:var(--av-harm);--il-ink:var(--av-ink)}
html.av-punk:root:not([data-theme="punk"]) .ill .ill-hero{background:var(--av-surface);border:1px solid var(--av-rule);border-left:4px solid var(--av-tens);border-radius:0}
html.av-punk:root:not([data-theme="punk"]) .ill .av-panel,html.av-punk:root:not([data-theme="punk"]) .ill .hub-card{background:var(--av-surface);border:1px solid var(--av-rule);border-radius:0}
html.av-punk:root:not([data-theme="punk"]) .ill .av-btn{background:var(--av-punk-yellow);border-color:var(--av-punk-yellow);color:var(--av-punk-on-yellow);border-radius:0;font-weight:700}
html.av-punk:root:not([data-theme="punk"]) .ill .av-btn:hover:not(:disabled){background:var(--av-tens);border-color:var(--av-tens);color:var(--av-punk-on-yellow)}
html.av-punk:root:not([data-theme="punk"]) .ill .av-btn.is-ghost{background:transparent;color:var(--av-accent)}
html.av-punk:root:not([data-theme="punk"]) .ill .av-btn.is-ghost:hover:not(:disabled){background:var(--av-punk-yellow);border-color:var(--av-punk-yellow);color:var(--av-punk-on-yellow)}
/* Tarjeta de la rueda (astrovenus.css:271, estilo «modern»): bloque plano, sin los dos degradados radiales */
html.av-punk:root:not([data-theme="punk"]) .av-wheelbox{background:var(--av-surface);border:1px solid var(--av-rule);border-radius:0}

/* ==========================================================================================================================
   TEMA CLARO «Punk» (Tarea 11). El oscuro de arriba sigue siendo el valor por defecto del modo Punk (decisión: «primero el oscuro»).
   Selección: SOLO cuando el sitio está en modo día de forma EXPLÍCITA, es decir, html.av-punk con data-theme="light" (lo pone el
   interruptor del tema, theme-toggle.js, y se guarda en localStorage). NO se usa prefers-color-scheme: un SO claro sin data-theme
   sigue viendo el Punk oscuro. Cambiar data-theme en caliente re-estiliza solo con CSS (punk.js no toca data-theme).
   Papel crema del logotipo; acentos OSCURECIDOS para el contraste sobre el papel. El amarillo (#FCEE0A) solo va como RELLENO
   (botón/insignia) con tinta #14101F; como texto o línea sobre papel se usa el dorado oscuro #7A6200. Sin degradados ni box-shadow;
   sin brillo (text-shadow: none). Anillo de foco de 3px en rosa oscuro. Mismos nombres de variable que el oscuro.
   Qué gana a qué (el claro se escribe siempre DESPUÉS del oscuro y con un atributo [data-theme="light"] de más):
   - Variables de :root: html.av-punk:root[data-theme="light"]:not([data-theme="punk"]) (0,4,1) > oscuro html.av-punk:root:not([data-theme="punk"]) (0,3,1).
   - Variables de .av: la misma cabecera + .av:not([data-av-theme]) o .av[data-av-theme="light"], (0,6,1) > bloques oscuros (0,5,1) y > los de astrovenus.css.
   - Reglas sueltas: cada selector claro es el oscuro con [data-theme="light"] añadido (+0,1,0), así gana siempre; no hay regla !important del tema
     específica del modo día salvo el hover (style.css:13 (0,3,0) y :14 (0,4,0)), que se pisa con :hover claro (0,5,1) y (0,6,1), también !important.
   - Menús (style.css:88/104): el desplegable claro (0,3,3) vence al oscuro (0,3,2) pero NO a la regla del submenú móvil del tema (0,4,1), que debe seguir
     transparente (se omite .wp-site-blocks y se usa «header ul» para sumar elementos en vez de clases); el panel de hamburguesa claro (0,5,2) vence al oscuro (0,4,2) y al tema (0,3,1).
   - El botón relleno del tema en modo día no tiene !important propio (style.css:21/24 solo actúan en noche); basta (0,4,1) sobre el oscuro (0,3,1) !important. */
html.av-punk:root[data-theme="light"]:not([data-theme="punk"]) .av:not([data-av-theme]),
html.av-punk:root[data-theme="light"]:not([data-theme="punk"]) .av[data-av-theme="light"]{
  --av-paper:#F4EBD0;--av-surface:#FBF5E4;--av-ink:#14101F;--av-muted:#5E5470;--av-rule:#D8CCA8;
  --av-accent:#7A6200;--av-on-accent:#F4EBD0;--av-harm:#0A6E85;--av-tens:#C4154F;--av-warn:#7A6200;--av-err:#C4154F;--av-ok:#0A6E85;
  color-scheme:light}
html.av-punk:root[data-theme="light"]:not([data-theme="punk"]){
  --av-punk-pink:#C4154F;--av-punk-cyan:#0A6E85;--av-punk-yellow:#FCEE0A;--av-punk-on-yellow:#14101F;--av-punk-gold:#7A6200;
  --av-rule:#D8CCA8;--av-paper:#F4EBD0;--av-surface:#FBF5E4;--av-ink:#14101F;--av-muted:#5E5470;--av-accent:#7A6200;--av-on-accent:#F4EBD0;--av-harm:#0A6E85;--av-tens:#C4154F;
  --wp--preset--color--paper:#F4EBD0;--wp--preset--color--surface:#FBF5E4;--wp--preset--color--ink:#14101F;--wp--preset--color--muted:#5E5470;
  --wp--preset--color--rule:#D8CCA8;--wp--preset--color--accent:#7A6200;--wp--preset--color--on-accent:#F4EBD0;
  color-scheme:light}

/* Chrome del sitio */
html.av-punk[data-theme="light"] body{background:var(--av-paper);color:var(--av-ink)}
html.av-punk[data-theme="light"] .wp-site-blocks>header,html.av-punk[data-theme="light"] .wp-site-blocks>footer{background:var(--av-paper);color:var(--av-ink)}
html.av-punk[data-theme="light"] .wp-site-blocks>footer{background:var(--av-surface);border-top:2px solid var(--av-tens)}
html.av-punk[data-theme="light"] .wp-site-blocks>header{border-bottom:1px solid var(--av-rule)}
/* Los enlaces-botón (.av-btn, .wp-block-button__link) llevan su propio color: se excluyen para no pintar cian sobre el relleno amarillo */
html.av-punk[data-theme="light"] .wp-site-blocks a:not(.av-btn):not(.wp-block-button__link){color:var(--av-harm)}
html.av-punk[data-theme="light"] .wp-site-blocks a:not(.av-btn):not(.wp-block-button__link):hover{color:var(--av-tens)}
html.av-punk[data-theme="light"] header ul.wp-block-navigation__submenu-container{background:var(--av-surface)!important;border-color:var(--av-rule)!important}
html.av-punk[data-theme="light"] .wp-site-blocks>header .wp-block-navigation__responsive-container.is-menu-open{background:var(--av-paper)!important;color:var(--av-ink)!important}
/* Botones del tema (WP Button): relleno amarillo con tinta; hover en tinta con texto amarillo (el rosa oscuro no da AA con tinta) */
html.av-punk[data-theme="light"] .wp-block-button .wp-block-button__link{background:var(--av-punk-yellow)!important;color:var(--av-ink)!important;border:2px solid var(--av-ink)}
html.av-punk[data-theme="light"] .wp-block-button .wp-block-button__link:hover{background:var(--av-ink)!important;color:var(--av-punk-yellow)!important}
html.av-punk[data-theme="light"] .wp-block-button.is-style-outline .wp-block-button__link{background:transparent!important;color:var(--av-ink)!important;border:2px solid var(--av-ink)}
html.av-punk[data-theme="light"] .wp-block-button.is-style-outline .wp-block-button__link:hover{background:var(--av-punk-yellow)!important;color:var(--av-ink)!important}
html.av-punk[data-theme="light"] :focus-visible{outline:3px solid var(--av-tens);outline-offset:2px}
html.av-punk[data-theme="light"] .av-theme-toggle{color:var(--av-ink);border-color:var(--av-muted)}

/* Tipografía: sin brillo en el modo día */
html.av-punk[data-theme="light"] h1,html.av-punk[data-theme="light"] h2,html.av-punk[data-theme="light"] h3,html.av-punk[data-theme="light"] .av-h{color:var(--av-ink);text-shadow:none}
html.av-punk[data-theme="light"] .av-steps li.is-on{color:var(--av-accent);text-shadow:none;font-weight:700}

/* Componentes del plugin */
html.av-punk[data-theme="light"] .av-panel,html.av-punk[data-theme="light"] .av input[type=text],html.av-punk[data-theme="light"] .av input[type=date],html.av-punk[data-theme="light"] .av input[type=time],html.av-punk[data-theme="light"] .av input[type=search],html.av-punk[data-theme="light"] .av-seg{border-color:var(--av-muted)}
html.av-punk[data-theme="light"] .av-panel{background:var(--av-surface);border-color:var(--av-rule);border-left:4px solid var(--av-tens)}
html.av-punk[data-theme="light"] .av input:focus{border-color:var(--av-tens)}
html.av-punk[data-theme="light"] .av :focus-visible{outline:3px solid var(--av-tens);outline-offset:2px}
html.av-punk[data-theme="light"] .av-btn{border-color:var(--av-ink);background:var(--av-punk-yellow);color:var(--av-ink)}
html.av-punk[data-theme="light"] .av-btn:hover:not(:disabled){background:var(--av-ink);border-color:var(--av-ink);color:var(--av-punk-yellow)}
html.av-punk[data-theme="light"] .av-btn.is-ghost{background:transparent;color:var(--av-ink)}
html.av-punk[data-theme="light"] .av-btn.is-ghost:hover:not(:disabled){background:var(--av-punk-yellow);color:var(--av-ink);border-color:var(--av-ink)}
html.av-punk[data-theme="light"] .av-seg label:has(input:checked){background:var(--av-punk-yellow);color:var(--av-ink)}
html.av-punk[data-theme="light"] .av-badge{color:var(--av-ink);border:1px solid var(--av-ink);background:var(--av-punk-yellow);text-shadow:none}

/* Botón «Modo Punk» y aviso */
html.av-punk[data-theme="light"] .av-punk-notice{background:var(--av-surface);color:var(--av-ink);border-color:var(--av-rule);border-left:4px solid var(--av-tens)}

html.av-punk[data-theme="light"] .av-punk-toast{background:var(--av-surface);color:var(--av-ink);border-color:var(--av-rule);border-left:4px solid var(--av-tens)}
html.av-punk[data-theme="light"] .av-punk-toast-close{color:var(--av-ink);border-color:var(--av-ink)}
html.av-punk[data-theme="light"] .av-punk-toast-close:hover{background:var(--av-punk-yellow);color:var(--av-ink)}
html.av-punk[data-theme="light"] .av-punk-toast-close:focus-visible{outline:3px solid var(--av-tens)}

/* Botones «Ver interpretación clásica» */
html.av-punk[data-theme="light"] [data-av-classic]{color:var(--av-harm);border-color:var(--av-harm)}
html.av-punk[data-theme="light"] [data-av-classic]:hover{background:var(--av-harm);color:var(--av-paper)}
html.av-punk[data-theme="light"] [data-av-classic][aria-pressed="true"]{background:var(--av-harm);color:var(--av-paper)}
html.av-punk[data-theme="light"] [data-av-classic]:focus-visible{outline:3px solid var(--av-tens);outline-offset:2px}

/* Etiquetas del tarot Punk: chip crema claro con tinta (17:1) */
html.av-punk[data-theme="light"]{--punk-label-bg:#FBF5E4;--punk-label-ink:#14101F}

html.av-punk:root[data-theme="light"]:not([data-theme="punk"]) .ill .av-btn{border-color:var(--av-punk-on-yellow)}
html.av-punk:root[data-theme="light"]:not([data-theme="punk"]) .ill .av-btn:hover:not(:disabled){background:var(--av-punk-on-yellow);border-color:var(--av-punk-on-yellow);color:var(--av-punk-yellow)}
html.av-punk:root[data-theme="light"]:not([data-theme="punk"]) .ill .av-btn.is-ghost{color:var(--av-punk-on-yellow);border-color:var(--av-punk-on-yellow)}
/* Carta natal en claro: contrapartes donde la regla compartida no da AA (tinta sobre rosa oscuro = 3,2:1; amarillo no es borde sobre papel) */
html.av-punk:root[data-theme="light"]:not([data-theme="punk"]) .fm--ill .av-btn{border-color:var(--av-punk-on-yellow)}
html.av-punk:root[data-theme="light"]:not([data-theme="punk"]) .fm--ill .av-btn:hover:not(:disabled){background:var(--av-punk-on-yellow);border-color:var(--av-punk-on-yellow);color:var(--av-punk-yellow)}
html.av-punk:root[data-theme="light"]:not([data-theme="punk"]) .fm--ill .av-btn.is-ghost{color:var(--av-punk-on-yellow);border-color:var(--av-punk-on-yellow)}
html.av-punk:root[data-theme="light"]:not([data-theme="punk"]) .fm--ill .av-btn.is-ghost:hover:not(:disabled){border-color:var(--av-punk-on-yellow)}
html.av-punk:root[data-theme="light"]:not([data-theme="punk"]) .fm--ill .av-steps li.is-cur .fm-n{color:var(--av-paper)}
html.av-punk:root[data-theme="light"]:not([data-theme="punk"]) .fm--ill .av-seg label:has(input:checked){border-color:var(--av-punk-on-yellow)}