/* Botones de idioma (bandera) y tema */
.header-tools{display:flex;gap:8px}
.tool-toggle{display:grid;place-items:center;width:42px;height:42px;padding:0;border:1px solid var(--line);border-radius:7px;background:transparent;color:var(--ink);cursor:pointer;transition:border-color .2s,background .2s,transform .2s}
.tool-toggle:hover{border-color:#9bab88;transform:translateY(-2px)}
.tool-toggle svg{grid-area:1/1;display:block;transition:opacity .25s,transform .35s cubic-bezier(.2,.7,.2,1)}
.flag{width:26px;height:auto;border-radius:3px;box-shadow:0 0 0 1px #0000001f}
.icon-moon,.icon-sun{width:20px;height:20px}
/* Se ve la bandera del idioma al que se cambia */
#lang-toggle .flag-us,#lang-toggle[data-current=es] .flag-es{opacity:0;transform:scale(.6) rotate(-8deg)}
#lang-toggle[data-current=es] .flag-us{opacity:1;transform:none}
#theme-toggle .icon-sun,:root[data-theme=dark] #theme-toggle .icon-moon{opacity:0;transform:rotate(-60deg) scale(.6)}
:root[data-theme=dark] #theme-toggle .icon-sun{opacity:1;transform:none}
#product-viewer{color:var(--ink)}
body,header,footer,.contact,.contact-card,.product-info,#product-viewer{transition:background-color .3s,color .3s,border-color .3s}

/* Modo oscuro */
:root[data-theme=dark]{color-scheme:dark;--bg:#0f130e;--ink:#e9eee4;--muted:#9da694;--line:#283023;--accent:#d3ef96}
:root[data-theme=dark] .studio{color:#8f9886}
:root[data-theme=dark] .button{background:var(--accent);border-color:var(--accent);color:#141a10}
:root[data-theme=dark] .button:hover{background:#e3f8b8;box-shadow:0 8px 18px #00000059}
:root[data-theme=dark] .highlight{background:linear-gradient(transparent 74%,#4f6a25 74%,#4f6a25 94%,transparent 94%)}
:root[data-theme=dark] .brand-stamp{color:#191c18;box-shadow:0 12px 28px #0000006b}
:root[data-theme=dark] .brand-stamp span{color:#50613b}
:root[data-theme=dark] .signature,:root[data-theme=dark] .hero-visual figcaption{color:#8a9381}
:root[data-theme=dark] .gallery-tile>img{background:#1c2219}
:root[data-theme=dark] .expand-icon,:root[data-theme=dark] .contact .eyebrow,:root[data-theme=dark] .product-type{color:#b5d58a}
:root[data-theme=dark] .contact{background:#161d13;border-color:#263022}
:root[data-theme=dark] .contact-brand>span>span{color:#9fb08a}
:root[data-theme=dark] .contact-card{background:#1b2317;border-color:#2e3a28}
:root[data-theme=dark] #copy-status,:root[data-theme=dark] .order-status,:root[data-theme=dark] #npc-order-status{color:#b5d58a}
:root[data-theme=dark] .product-card,:root[data-theme=dark] #product-viewer{background:#151a13}
:root[data-theme=dark] .product-price>span{background:#25301e;color:#c6dca7}
:root[data-theme=dark] .product-details ul{color:var(--muted)}
:root[data-theme=dark] .product-compatibility{color:#868f7d}
:root[data-theme=dark] .product-close{background:#1d241a;border-color:var(--line);color:var(--ink)}
:root[data-theme=dark] .product-close:hover{background:#273022}
:root[data-theme=dark] .dungeon-head .eyebrow{color:#bba0e6}
:root[data-theme=dark] .flag{box-shadow:0 0 0 1px #ffffff2e}
:root[data-theme=dark] #brief-fallback,:root[data-theme=dark] #npc-request-text,:root[data-theme=dark] #pack-request-text,:root[data-theme=dark] #dungeon-request-text{background:#0f130e;color:var(--ink);border-color:#3a4632}
:root[data-theme=dark] .skip{background:#151a13;color:var(--ink)}
@media(prefers-reduced-motion:reduce){.tool-toggle svg{transition:none}}

/* Botones que llevan al Discord (compra y contacto) */
.button.button-discord, :root[data-theme=dark] .button.button-discord { background: #5865f2; border-color: #5865f2; color: #fff; text-decoration: none; }
.button.button-discord:hover, :root[data-theme=dark] .button.button-discord:hover { background: #4752c4; border-color: #4752c4; box-shadow: 0 8px 18px #2b2f8a40; }
.contact-card .contact-discord { margin-top: 10px; }
#brief-copy, :root[data-theme=dark] #brief-copy { background: transparent; color: var(--ink); border-color: var(--line); }
#brief-copy:hover { background: #00000008; box-shadow: none; }
:root[data-theme=dark] #brief-copy:hover { background: #ffffff0d; }