
:root{color-scheme:dark;--bg:#130b08;--panel:#21130e;--text:#fff8ed;--muted:#e8d7c5;--accent:#ffd166;--accent2:#ff9f1c;--line:#f4c27a;--focus:#fff;--danger:#ffb4a2}
*{box-sizing:border-box}
html{font-size:18px}
body{margin:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,"Segoe UI",sans-serif;line-height:1.5;padding-bottom:2rem}
button,select,input{font:inherit}
button,select{min-height:3rem}
button{background:#3b2117;color:var(--text);border:2px solid var(--line);border-radius:.7rem;padding:.65rem 1rem;font-weight:700}
button:hover{background:#533022}
button:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible,[role=tabpanel]:focus-visible{outline:4px solid var(--focus);outline-offset:3px}
.skip-link{position:absolute;left:-9999px;top:.5rem;background:#fff;color:#000;padding:.6rem;z-index:50}.skip-link:focus{left:.5rem}
.app-header{max-width:880px;margin:auto;padding:1.4rem 1rem .4rem;text-align:center}
.eyebrow{font-size:1.25rem;font-weight:800;color:var(--accent);margin:.2rem 0}
h1{font-size:clamp(2rem,6vw,3.2rem);margin:.1rem 0 .7rem}
main{max-width:880px;margin:auto;padding:0 1rem}
.panel{background:var(--panel);border:2px solid #70442e;border-radius:1rem;padding:1rem;margin:1rem 0}
.compact-panel h2,.tuning-panel h2{margin-top:0}
.mode-label{text-align:center;font-size:1.05rem}
.gain-box{display:grid;grid-template-columns:auto 1fr auto;gap:.8rem;align-items:center}
input[type=range]{width:100%;min-height:2.5rem}
#gain-value{min-width:3ch;font-weight:800;font-size:1.3rem}
.primary-action{text-align:center;margin:1.25rem 0}
.tune-main{width:min(100%,620px);min-height:5rem;font-size:clamp(1.6rem,5vw,2.35rem);background:var(--accent);color:#211208;border:4px solid #fff}
.tune-main[aria-pressed=true]{background:var(--danger)}
.mic-line{text-align:center;font-size:1.1rem}
.meter-help{text-align:center;color:var(--muted)}
.tuning-meter{padding:.5rem .2rem 1rem}
.meter-scale,.meter-words{display:flex;justify-content:space-between;align-items:center;font-weight:700}
.meter-track{height:3.2rem;border:3px solid #fff;border-radius:.6rem;position:relative;margin:.45rem 0;background:linear-gradient(90deg,#7b241c 0 35%,#7a5c00 35% 46%,#146b38 46% 54%,#7a5c00 54% 65%,#7b241c 65% 100%)}
.meter-center{position:absolute;left:50%;top:-.35rem;bottom:-.35rem;width:4px;background:#fff;transform:translateX(-50%)}
.meter-needle{position:absolute;top:-.55rem;height:4.1rem;width:.5rem;background:#fff;border:2px solid #000;border-radius:.25rem;transform:translateX(-50%);transition:left .08s linear}
.status-list{margin:1rem 0 0}
.status-list div{display:grid;grid-template-columns:minmax(10rem,1fr) 1fr;gap:.8rem;border-top:1px solid #6b4635;padding:.55rem 0}
.status-list dt{font-weight:800}.status-list dd{margin:0}
.signal-meter{height:.45rem;background:#5c463c;border-radius:1rem;overflow:hidden;margin-top:1rem}.signal-meter span{display:block;height:100%;width:0;background:var(--accent)}
select{width:100%;max-width:42rem;background:#180e0a;color:var(--text);border:2px solid var(--line);border-radius:.5rem;padding:.55rem}
fieldset{border:2px solid #70442e;border-radius:.8rem;margin:1rem 0;padding:1rem}legend{font-weight:800;color:var(--accent);padding:0 .4rem}
.sound-row{display:grid;grid-template-columns:minmax(9rem,1fr) minmax(12rem,2fr) auto;gap:.6rem;align-items:center;margin:.7rem 0}
.sound-row select{min-width:0}
details summary{font-size:1.3rem;font-weight:800;cursor:pointer}
.credits dt{font-weight:800;margin-top:.6rem}.credits dd{margin-left:0}
.warning{border-left:5px solid var(--accent2);padding-left:.8rem}
.top-tabs{position:sticky;top:0;background:#0d0806;border-top:2px solid var(--line);border-bottom:3px solid var(--line);z-index:20;padding:.45rem}
.top-tabs [role=tablist]{display:grid;grid-template-columns:1fr 1fr;gap:.45rem;max-width:880px;margin:auto}
.top-tabs [role=tab][aria-selected=true]{background:var(--accent);color:#211208;border-width:3px}
.visually-hidden,.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
[hidden]{display:none!important}
@media(max-width:620px){html{font-size:17px}.status-list div{grid-template-columns:1fr}.sound-row{grid-template-columns:1fr}.gain-box{grid-template-columns:1fr auto}.gain-box label{grid-column:1/-1}.meter-scale{font-size:.85rem}}
@media(forced-colors:active){button,.panel,.meter-track,fieldset{forced-color-adjust:auto}.meter-needle,.meter-center{background:CanvasText}.top-tabs [role=tab][aria-selected=true]{outline:3px solid Highlight}}
@media(prefers-reduced-motion:reduce){.meter-needle{transition:none}}

/* Fase 3.7.22 */
.app-header{padding-bottom:.15rem}
.app-header h1{max-width:780px;margin:.2rem auto .45rem}
.primary-action{margin:.7rem auto 1rem}
.mode-label{margin:.5rem auto 1rem;padding:.6rem .85rem;max-width:700px;border-radius:.65rem;background:#2b190f}
.compact-panel{max-width:720px;margin-left:auto;margin-right:auto}
.meter-status-text{text-align:center;font-weight:800;font-size:1.1rem;margin:.2rem 0 .7rem}

.gain-box-simple{display:block}.gain-box-simple input[type="range"]{width:100%;margin:.35rem 0}

/* Fase 3.7.27 — medidor visual suave y de alto contraste */
.tuning-meter{position:relative;min-height:5rem;border:3px solid currentColor;border-radius:.8rem;overflow:hidden}
.tuning-meter::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:5px;transform:translateX(-50%);background:currentColor;opacity:.82}
#tuning-needle{position:absolute;left:50%;top:.35rem;bottom:.35rem;width:8px;transform:translateX(-50%);border:2px solid #000;border-radius:999px;background:#fff;box-shadow:0 0 0 2px currentColor;will-change:left}
.tuning-meter[data-state="tuned"]{outline:4px double currentColor;outline-offset:3px}
.tuning-meter[data-state="tuned"] #tuning-needle{width:12px}
.meter-help{font-weight:800;font-size:clamp(1rem,2.5vw,1.25rem);letter-spacing:.02em}
@media (forced-colors:active){.tuning-meter,#tuning-needle{forced-color-adjust:auto}}


/* Fase 3.7.32 — controles principales arriba y modalidades visuales responsive */
.primary-controls{max-width:760px;margin:.65rem auto 1rem;padding:.9rem;background:var(--panel);border:2px solid #70442e;border-radius:1rem}
.mode-main{display:grid;gap:.4rem}
.mode-main label{font-size:1.15rem}
.primary-controls .primary-action{margin:.85rem 0 .15rem}
.tune-main{min-height:5.4rem;border-width:4px;box-shadow:0 0 0 2px #000;font-size:clamp(1.75rem,5vw,2.5rem)}
.tuning-panel{width:100%}
.tuning-meter{width:100%;max-width:100%;min-height:clamp(6rem,16vw,9rem)}
.meter-track{height:clamp(3.2rem,10vw,5.2rem)}
body[data-tuning-mode="visual"] .tuning-panel{max-width:100%}
body[data-tuning-mode="visual"] .tuning-meter{min-height:clamp(7rem,20vw,11rem)}
body[data-tuning-mode="visual"] .meter-track{height:clamp(4rem,12vw,6.5rem)}
body[data-tuning-mode="visual"] #tuning-needle{width:clamp(8px,1.4vw,14px)}
@media(max-width:620px){
  .top-tabs{position:sticky;top:0}
  .top-tabs [role=tablist]{gap:.3rem}
  .top-tabs button{min-height:3.25rem;padding:.5rem}
  .primary-controls{padding:.75rem}
  .tune-main{width:100%;min-height:5rem}
  .tuning-meter{padding:.45rem .25rem .8rem}
  .meter-words{font-size:.9rem}
}
@media(min-width:1000px){
  main,.app-header,.top-tabs [role=tablist]{max-width:1040px}
}
@media(forced-colors:active){
  .top-tabs [role=tab][aria-selected=true]{outline:3px solid Highlight}
  .tune-main{border:4px solid ButtonText}
}

/* Fase 3.7.33 — página única y divulgación progresiva */
#panel-tuner,#panel-settings{display:block}
#panel-settings{margin-top:1.25rem}
.option-details{max-width:760px;margin:.7rem auto;border:2px solid #70442e;border-radius:.85rem;background:var(--panel)}
.option-details summary{cursor:pointer;font-weight:800;font-size:1.08rem;padding:.9rem;min-height:2.8rem}
.option-details summary:focus-visible{outline:4px solid currentColor;outline-offset:3px}
.details-content{padding:.1rem .9rem 1rem}

/* Afinación visual activa */
body.visual-tuning-active{overflow-x:hidden}
body.visual-tuning-active .app-header{padding:.3rem .75rem}
body.visual-tuning-active .app-header p{display:none}
body.visual-tuning-active .primary-controls{position:sticky;top:0;z-index:40;max-width:none;margin:0;padding:.45rem .75rem;display:flex;align-items:center;gap:.7rem;border-radius:0;border-width:0 0 3px 0}
body.visual-tuning-active .mode-main{flex:1;min-width:0}
body.visual-tuning-active .mode-main label{font-size:.9rem}
body.visual-tuning-active .primary-action{margin:0;flex:0 0 auto}
body.visual-tuning-active .tune-main{min-height:3.8rem;width:auto;padding:.55rem 1rem;font-size:clamp(1.1rem,3.5vw,1.6rem)}
body.visual-tuning-active .compact-panel,body.visual-tuning-active .mic-line{display:none}
body.visual-tuning-active .tuning-panel{width:min(100%,1200px);max-width:1200px;margin:.5rem auto;padding:.6rem}
body.visual-tuning-active .tuning-meter{width:100%;min-height:clamp(12rem,42vh,28rem)}
body.visual-tuning-active .meter-track{height:clamp(7rem,28vh,18rem)}
body.visual-tuning-active #tuning-needle{width:clamp(10px,1.2vw,16px)}
body.visual-tuning-active .status-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.6rem;font-size:clamp(1.05rem,2.2vw,1.5rem)}
body.visual-tuning-active #nearest-string,body.visual-tuning-active #instruction{font-size:clamp(1.55rem,4vw,3rem);font-weight:900}
body.visual-tuning-active #panel-settings{display:none}
@media(max-width:680px){
 body.visual-tuning-active .primary-controls{flex-wrap:wrap}
 body.visual-tuning-active .mode-main,body.visual-tuning-active .primary-action{flex:1 1 100%}
 body.visual-tuning-active .tune-main{width:100%}
 body.visual-tuning-active .status-list{grid-template-columns:1fr 1fr}
}
@media(max-width:420px){body.visual-tuning-active .status-list{grid-template-columns:1fr}}
@media(orientation:landscape) and (max-height:600px){
 body.visual-tuning-active .tuning-panel{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(16rem,1fr);gap:.8rem;align-items:center}
 body.visual-tuning-active .tuning-meter{min-height:55vh}
 body.visual-tuning-active .meter-track{height:38vh}
 body.visual-tuning-active .status-list{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){body.visual-tuning-active *{scroll-behavior:auto!important}}

/* 3.7.34: ajustes accesibles */
.sound-mode-details,.nested-details{margin:.65rem 0;border:2px solid currentColor;border-radius:.7rem}
.sound-mode-details>summary,.nested-details>summary{cursor:pointer;font-weight:750;padding:.8rem;min-height:2.7rem}
.sound-mode-details>summary:focus-visible,.nested-details>summary:focus-visible{outline:4px solid currentColor;outline-offset:3px}
.reference-action{margin-top:1rem;padding-top:1rem;border-top:2px solid currentColor}
#reference-button,#reset-settings{min-height:3.2rem;font-weight:750}
@media(max-width:620px){.sound-row{grid-template-columns:1fr}.sound-row select,.sound-row button{width:100%}}

/* Fase 3.7.35 — pie simplificado: Sonidos, Ayuda y Acerca de */
#panel-settings{margin-top:1.25rem}
#panel-settings>.option-details{max-width:760px}
#reference-play{margin:.15rem 0 .8rem;min-height:3.2rem;font-weight:800}
.reset-action{margin-top:1rem;padding-top:1rem;border-top:2px solid currentColor}
#help-options h3{margin-top:1rem}

/* Fase 3.7.37 — interfaz principal compacta y menú de primer plano */
:root{--main-width:760px}
body{min-height:100dvh}
.app-header{padding:.45rem .8rem .2rem}
.app-header h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(1.65rem,5vw,2.65rem);line-height:1.05;letter-spacing:.01em;margin:.15rem auto;text-align:center}.app-header h1 span{font-style:italic;font-weight:600}
#contenido{max-width:var(--main-width);margin:0 auto;padding:.25rem .8rem .7rem}
.menu-launch{display:block;margin:.25rem auto .4rem;min-height:2.65rem;padding:.45rem 1.2rem;font-weight:800}
.primary-controls{padding:.35rem .6rem}.primary-controls h2{font-size:clamp(1.1rem,3vw,1.4rem);margin:.15rem 0 .25rem}.primary-controls select{width:100%;min-height:2.7rem}
.tune-main{display:block;width:min(90%,19rem);min-height:3.5rem;margin:.45rem auto .2rem;font-size:clamp(1.15rem,3.5vw,1.45rem);font-weight:900}
.diapason-button{display:block;min-height:2.55rem;margin:.15rem auto .25rem;padding:.35rem 1rem;font-weight:750}
.tuning-panel{margin-top:.25rem;padding:.35rem .65rem}.tuning-panel h2{margin:.1rem 0 .25rem;font-size:clamp(1.05rem,3vw,1.35rem)}
.tuning-meter{margin:.15rem auto .35rem}.meter-words{display:none!important}
.essential-status{display:grid;grid-template-columns:repeat(3,1fr);gap:.35rem;margin:.25rem 0}.essential-status>div{padding:.4rem}.essential-status dt{font-size:.88rem}.essential-status dd{font-size:clamp(1.05rem,3vw,1.3rem);font-weight:800}
.menu-overlay[hidden]{display:none}.menu-overlay{position:fixed;inset:0;z-index:1000;background:rgba(0,0,0,.68);display:grid;place-items:center;padding:1rem}.menu-card{width:min(94vw,42rem);max-height:90dvh;overflow:auto;background:Canvas;color:CanvasText;border:3px solid currentColor;border-radius:1rem;padding:1rem;box-shadow:0 1rem 3rem rgba(0,0,0,.4)}.menu-card h2,.menu-card h3{margin-top:0}.menu-card button,.menu-card summary,.menu-card select,.menu-card input{min-height:2.8rem}.menu-card #menu-root>button{display:block;width:100%;margin:.55rem 0;font-size:1.1rem;font-weight:800}.menu-page>details{margin:.6rem 0;border:2px solid currentColor;border-radius:.7rem}.menu-page>details>summary{padding:.7rem;font-weight:800;cursor:pointer}.menu-nav{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:1rem}.menu-nav button{flex:1}.details-content{padding:.6rem}.sound-row{display:grid;grid-template-columns:minmax(8rem,1fr) minmax(10rem,2fr) auto;gap:.45rem;align-items:end;margin:.45rem 0}#mic-gain{width:100%}#gain-value{display:block;font-weight:800;margin:.25rem 0}#measure-level{margin:.4rem 0}
@media(max-width:620px){.essential-status{grid-template-columns:1fr 1fr 1fr}.sound-row{grid-template-columns:1fr}.sound-row select,.sound-row button{width:100%}}
@media(max-height:700px) and (min-width:500px){.app-header h1{font-size:1.5rem}.app-header{padding:.15rem}.menu-launch{margin:.1rem auto}.primary-controls{padding:.15rem .5rem}.primary-controls h2{margin:.05rem 0}.tune-main{min-height:2.9rem;margin:.2rem auto .05rem}.diapason-button{min-height:2.3rem;margin:.05rem auto}.tuning-panel{padding:.15rem .5rem}.tuning-panel h2{margin:0}.tuning-meter{margin:.05rem auto .15rem}.essential-status{margin:.1rem 0}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* Fase 3.7.38 — consolidación accesible del menú */
body.menu-open{overflow:hidden}.menu-card{scrollbar-gutter:stable}.menu-card h2,.menu-card h3{scroll-margin-top:1rem}
.menu-page>details[open]{background:color-mix(in srgb, Canvas 92%, CanvasText 8%)}.menu-page>details>summary{font-size:1.05rem}
.dbfs-display{margin:.55rem 0;padding:.6rem .75rem;border:2px solid currentColor;border-radius:.65rem}.dbfs-display p{margin:.2rem 0;font-variant-numeric:tabular-nums}
#measure-level[aria-pressed="true"]{font-weight:900}
@media(max-width:520px){.menu-overlay{padding:.45rem}.menu-card{width:100%;max-height:96dvh;border-radius:.7rem;padding:.75rem}.menu-nav{position:sticky;bottom:0;background:Canvas;padding-top:.55rem}}

/* Fase 3.7.39 — consolidación de medición dBFS */
#dbfs-meter{display:block;width:100%;height:1.4rem;margin:.65rem 0 .15rem}
.dbfs-display:focus-visible{outline:4px solid currentColor;outline-offset:3px}
#measure-level{min-height:3rem;font-weight:800}
#measure-level[aria-pressed="true"]{border-width:3px}

/* Fase 3.7.40 — enlace accesible al manual */
.menu-link{display:inline-block;padding:.7rem .9rem;border:2px solid currentColor;border-radius:.6rem;font-weight:800;text-decoration:underline;text-underline-offset:.18em}
.menu-link:focus-visible{outline:4px solid currentColor;outline-offset:3px}

/* 3.7.41 visual: solo composición, base funcional 3.7.40 */
.primary-controls{max-width:46rem;margin:1rem auto 1.5rem;padding:1rem;display:grid;gap:.85rem;align-items:center}.primary-controls h2{margin:0 0 .15rem;text-align:center}#tuning-mode{width:min(100%,34rem);min-height:2.85rem;margin-inline:auto;font:inherit}#tune-button{display:block;width:min(100%,20rem);min-height:3.6rem;margin:.2rem auto 0;padding:.8rem 1.35rem;font-size:clamp(1.15rem,2.5vw,1.45rem);font-weight:800;border-radius:.9rem}#reference-play{display:block;width:min(100%,16rem);min-height:3rem;margin:0 auto;padding:.65rem 1rem;font-size:1rem;font-weight:700;border-radius:.75rem}.visual-tuner,.tuning-info{max-width:46rem;margin-inline:auto}@media(max-width:30rem){.primary-controls{padding:.8rem .5rem;gap:.75rem}#tune-button{width:min(100%,18rem);min-height:3.45rem}#reference-play{width:min(100%,15rem)}}

/* 3.7.42: organización de Configuración; controles operativos permanecen en principal */
#menu-configuration details{margin:.75rem 0}#menu-configuration summary{min-height:2.75rem;display:flex;align-items:center;font-weight:800}#menu-configuration .details-content{padding:.65rem .25rem .9rem}#menu-configuration button,#menu-configuration select,#menu-configuration input[type="range"]{max-width:100%}

/* Fase 3.7.43 — Apariencia y accesibilidad visual */
:root{
  --at-bg:#ffffff;
  --at-fg:#151515;
  --at-surface:#f4f4f4;
  --at-border:#444444;
}
html[data-theme="dark"]{
  color-scheme:dark;
  --at-bg:#171717;
  --at-fg:#f4f4f4;
  --at-surface:#242424;
  --at-border:#d8d8d8;
}
@media (prefers-color-scheme:dark){
  html[data-theme="auto"]{
    color-scheme:dark;
    --at-bg:#171717;
    --at-fg:#f4f4f4;
    --at-surface:#242424;
    --at-border:#d8d8d8;
  }
}
html[data-theme="light"]{color-scheme:light}
html[data-high-contrast="true"]{
  --at-bg:#000000;
  --at-fg:#ffffff;
  --at-surface:#000000;
  --at-border:#ffffff;
  color-scheme:dark;
}
html[data-theme],html[data-theme] body{
  background:var(--at-bg);
  color:var(--at-fg);
}
html[data-theme] #menu-overlay,
html[data-theme] .menu-page,
html[data-theme] details{
  background:var(--at-surface);
  color:var(--at-fg);
  border-color:var(--at-border);
}
html[data-high-contrast="true"] button,
html[data-high-contrast="true"] select,
html[data-high-contrast="true"] input{
  border:3px solid var(--at-border);
}
html[data-high-contrast="true"] :focus-visible{
  outline:4px solid var(--at-fg) !important;
  outline-offset:4px;
}
#appearance-settings label{display:block;font-weight:800;margin:.75rem 0 .35rem}
#appearance-theme{width:100%;min-height:2.8rem;font:inherit}
#appearance-settings .check-row{display:flex;gap:.65rem;align-items:center;font-weight:800}
#appearance-contrast{width:1.4rem;height:1.4rem}
.setting-help{margin:.75rem 0 0}

/* Fase 3.7.44 — instalación PWA */
#install-settings button{min-height:2.9rem;margin:.65rem 0;font:inherit;font-weight:800}
#ios-install-help{margin-top:.8rem}
#ios-install-help h4{margin-bottom:.4rem}
#ios-install-help ol{padding-inline-start:1.6rem}
#ios-install-help li{margin:.35rem 0}

/* Fase 3.7.47 — selector de idioma */
#language-settings label{display:block;font-weight:800;margin:.75rem 0 .35rem}
#language-select{width:100%;min-height:2.8rem;font:inherit}

/* 3.7.52: título en dos líneas dentro de un único H1 */
.title-product,.title-brand{display:block}.title-brand{margin-top:.08em}

/* 3.7.52: apariencia predeterminada negra; claro solo por elección manual. */
html:not([data-theme="light"]),html[data-theme="auto"]{
 --at-bg:#000000;--at-surface:#171717;--at-text:#ffffff;--at-muted:#d6d6d6;--at-border:#8f8f8f;color-scheme:dark;
}
html[data-theme="light"]{
 --at-bg:#ffffff;--at-surface:#f6f6f6;--at-text:#111111;--at-muted:#555555;--at-border:#c7c7c7;color-scheme:light;
}


/* Fase 3.7.64 Visual 3D experimental — capa puramente visual */
:root{
 --glass-surface:rgba(28,35,42,.88);--glass-edge:rgba(255,255,255,.38);
 --tube-deep:#05080b;--tube-mid:#16212a;--tube-glow:rgba(118,220,255,.68);
 --tube-warm:rgba(255,151,73,.78);--tube-tuned:rgba(121,255,177,.9);
}
.tuning-panel{position:relative;isolation:isolate;background:linear-gradient(145deg,rgba(35,43,50,.96),rgba(8,12,16,.98));border-color:rgba(255,255,255,.34);box-shadow:0 1.2rem 2.8rem rgba(0,0,0,.48),inset 0 1px 0 rgba(255,255,255,.16)}
.tuning-panel::after{content:"";position:absolute;inset:.35rem;border:1px solid rgba(255,255,255,.08);border-radius:.8rem;pointer-events:none;z-index:-1}
.tuning-meter{overflow:visible;border:0!important;background:transparent;perspective:900px;padding:.7rem .45rem 1.1rem}
.meter-scale{position:relative;z-index:3;padding:0 .55rem;color:#f7fbff;text-shadow:0 2px 2px #000,0 0 10px rgba(255,255,255,.22);letter-spacing:.035em}
.meter-tube-3d{position:relative;overflow:hidden;border:2px solid rgba(225,245,255,.72);border-radius:999px;background:linear-gradient(180deg,rgba(255,255,255,.22) 0%,rgba(119,153,174,.08) 16%,rgba(4,9,13,.96) 48%,rgba(15,27,35,.98) 72%,rgba(255,255,255,.14) 100%);box-shadow:inset 0 7px 11px rgba(255,255,255,.16),inset 0 -10px 18px rgba(0,0,0,.78),inset 0 0 26px rgba(111,211,255,.13),0 14px 22px rgba(0,0,0,.48),0 2px 0 rgba(255,255,255,.22);transform:rotateX(2deg);transform-style:preserve-3d}
.meter-tube-3d::before{content:"";position:absolute;inset:8% 1.2%;border-radius:999px;background:linear-gradient(90deg,rgba(255,123,62,.34),rgba(255,194,74,.18) 37%,rgba(106,255,174,.18) 47%,rgba(106,255,174,.18) 53%,rgba(255,194,74,.18) 63%,rgba(255,123,62,.34));filter:saturate(1.15);box-shadow:inset 0 0 20px rgba(0,0,0,.55)}
.tube-reflection{position:absolute;z-index:4;left:3%;right:3%;top:10%;height:22%;border-radius:999px;background:linear-gradient(180deg,rgba(255,255,255,.34),rgba(255,255,255,.02));pointer-events:none}
.tube-depth{position:absolute;z-index:1;inset:13% 1.8%;border-radius:999px;box-shadow:inset 0 0 18px #000,0 0 18px rgba(91,199,255,.08);pointer-events:none}
.meter-center{z-index:5;top:5%!important;bottom:5%!important;width:3px!important;background:rgba(255,255,255,.95)!important;box-shadow:0 0 10px #fff,0 0 22px rgba(110,255,183,.8)}
#tuning-needle.meter-beam-3d{z-index:6;top:12%!important;bottom:12%!important;height:auto!important;width:clamp(10px,1.2vw,16px)!important;border:1px solid rgba(255,255,255,.92)!important;border-radius:999px!important;background:linear-gradient(90deg,rgba(255,255,255,.58),#fff,rgba(255,255,255,.58))!important;box-shadow:0 0 8px #fff,0 0 18px var(--tube-warm),0 0 38px var(--tube-warm)!important;will-change:left;transition:box-shadow .18s ease,width .18s ease}
.tuning-meter[data-state="near"] #tuning-needle,.tuning-meter[data-state="nearZone"] #tuning-needle{box-shadow:0 0 8px #fff,0 0 20px rgba(255,220,89,.9),0 0 42px rgba(255,220,89,.65)!important}
.tuning-meter[data-state="tuned"]{outline:0!important}
.tuning-meter[data-state="tuned"] #tuning-needle{width:clamp(16px,2vw,24px)!important;background:#eafff2!important;box-shadow:0 0 10px #fff,0 0 25px var(--tube-tuned),0 0 58px var(--tube-tuned)!important}
.status-glass-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem;margin-top:1rem}
.status-glass-grid>div{display:block!important;min-width:0;padding:.9rem!important;border:1px solid var(--glass-edge)!important;border-radius:.9rem;background:linear-gradient(145deg,rgba(255,255,255,.11),rgba(255,255,255,.035));box-shadow:0 10px 20px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.18);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.status-glass-grid dt{font-size:.88rem;color:var(--muted)}.status-glass-grid dd{margin:.25rem 0 0!important;font-size:clamp(1.1rem,3vw,1.55rem);font-weight:900;text-shadow:0 2px 2px rgba(0,0,0,.65)}
@media(max-width:620px){.status-glass-grid{grid-template-columns:1fr}.meter-tube-3d{transform:none}}
@media(prefers-reduced-motion:reduce){#tuning-needle.meter-beam-3d{transition:none!important}}
@media(forced-colors:active){.tuning-panel,.meter-tube-3d,.status-glass-grid>div{background:Canvas!important;box-shadow:none!important;border:2px solid CanvasText!important}.tube-reflection,.tube-depth,.meter-tube-3d::before{display:none!important}#tuning-needle.meter-beam-3d,.meter-center{background:CanvasText!important;box-shadow:none!important}}
html[data-high-contrast="true"] .tuning-panel,html[data-high-contrast="true"] .meter-tube-3d,html[data-high-contrast="true"] .status-glass-grid>div{backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none;background:#000;border-color:#fff}


/* Fase 3.7.65 — navegación plana y contraste semántico */
:root{
  --title-product-color:#ffffff;
  --title-brand-color:#8fe8ff;
  --menu-surface:#111820;
  --menu-text:#ffffff;
  --menu-border:#a9dff0;
  --menu-button-bg:#182733;
  --menu-button-text:#ffffff;
}
html[data-theme="light"]{
  --title-product-color:#111111;
  --title-brand-color:#004b67;
  --menu-surface:#ffffff;
  --menu-text:#111111;
  --menu-border:#31576a;
  --menu-button-bg:#eef5f8;
  --menu-button-text:#111111;
}
html[data-high-contrast="true"]{
  --title-product-color:#ffffff;
  --title-brand-color:#ffffff;
  --menu-surface:#000000;
  --menu-text:#ffffff;
  --menu-border:#ffffff;
  --menu-button-bg:#000000;
  --menu-button-text:#ffffff;
}
.title-product{color:var(--title-product-color)}
.title-brand{color:var(--title-brand-color);text-shadow:0 1px 0 rgba(0,0,0,.45),0 0 .35em currentColor}
html[data-theme="light"] .title-brand{text-shadow:none}
.menu-card{background:var(--menu-surface)!important;color:var(--menu-text)!important;border-color:var(--menu-border)!important}
.flat-menu-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem}
.flat-menu-grid>button{width:100%;min-height:3.4rem;margin:0!important;padding:.75rem;background:var(--menu-button-bg);color:var(--menu-button-text);border:2px solid var(--menu-border);border-radius:.75rem}
.flat-menu-grid>button:focus-visible,.choice-group input:focus-visible,.menu-page button:focus-visible,.menu-page a:focus-visible{outline:4px solid currentColor;outline-offset:4px}
.menu-page{background:var(--menu-surface)!important;color:var(--menu-text)!important}
.menu-page>h3{padding-bottom:.55rem;border-bottom:2px solid var(--menu-border)}
.flat-section{padding:.15rem 0 .6rem}
.flat-section>h4{margin:1rem 0 .4rem}
.choice-group{border:2px solid var(--menu-border);border-radius:.8rem;padding:.65rem;margin:.4rem 0 1rem}
.choice-group legend{font-weight:800;padding:0 .35rem}
.choice-group label{display:flex!important;align-items:flex-start;gap:.7rem;padding:.7rem .35rem;margin:0!important;min-height:2.9rem;font-weight:700}
.choice-group input[type="radio"]{width:1.45rem;height:1.45rem;flex:0 0 auto;margin-top:.08rem}
.compat-select{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
#menu-sounds .sound-settings{margin-bottom:1rem}
#menu-sounds .sound-row{border-bottom:1px solid color-mix(in srgb,var(--menu-text) 35%,transparent);padding-bottom:.65rem}
.menu-nav{border-top:2px solid var(--menu-border);padding-top:.8rem}
@media(max-width:560px){.flat-menu-grid{grid-template-columns:1fr}.flat-menu-grid>button{min-height:3rem}}
@media(prefers-reduced-motion:reduce){.title-brand{text-shadow:none}}
@media(forced-colors:active){.title-product,.title-brand{color:CanvasText;text-shadow:none}.flat-menu-grid>button,.choice-group{border:2px solid CanvasText}}


/* ===== Fase 3.7.66 — Medidor VICTORIA 3D avanzado (solo presentación) ===== */
:root{
  --victoria-glass-edge:rgba(224,247,255,.82);
  --victoria-glass-highlight:rgba(255,255,255,.38);
  --victoria-glass-low:rgba(0,0,0,.72);
  --victoria-chamber:#071018;
  --victoria-near:rgba(255,218,82,.86);
  --victoria-tuned:rgba(112,255,177,.92);
  --victoria-beam:rgba(255,255,255,.98);
}
.tuning-panel{isolation:isolate}
.tuning-meter{
  perspective:1100px;
  perspective-origin:50% 38%;
  padding:1rem clamp(.4rem,2vw,1.1rem) 1.55rem;
}
.meter-scale{
  padding-inline:clamp(1.1rem,4vw,2.5rem);
  margin-bottom:.45rem;
  font-variant-numeric:tabular-nums;
}
.meter-scale span:nth-child(3){
  font-size:1.14em;
  text-decoration:underline;
  text-decoration-thickness:.12em;
  text-underline-offset:.2em;
}
.meter-tube-3d{
  overflow:visible;
  height:clamp(5.2rem,13vw,7.6rem);
  margin-inline:clamp(.65rem,3vw,1.8rem);
  border:2px solid var(--victoria-glass-edge);
  border-radius:999px;
  transform:rotateX(5deg) translateZ(0);
  transform-style:preserve-3d;
  background:
    linear-gradient(180deg,
      rgba(255,255,255,.28) 0%,
      rgba(168,224,247,.11) 13%,
      rgba(11,23,32,.96) 43%,
      rgba(4,10,15,.99) 64%,
      rgba(26,49,62,.94) 83%,
      rgba(255,255,255,.13) 100%);
  box-shadow:
    inset 0 .45rem .85rem rgba(255,255,255,.15),
    inset 0 -.75rem 1.15rem rgba(0,0,0,.82),
    inset 0 0 1.7rem rgba(94,205,255,.12),
    0 1.25rem 1.4rem -.55rem rgba(0,0,0,.72),
    0 .18rem 0 rgba(255,255,255,.22);
}
.meter-tube-3d::before{
  inset:12% 1.4%;
  z-index:0;
  background:
    radial-gradient(ellipse at 50% 42%,rgba(120,223,255,.08),transparent 56%),
    linear-gradient(90deg,
      rgba(255,118,61,.29) 0 34%,
      rgba(255,205,76,.14) 38% 46%,
      rgba(106,255,174,.13) 47% 53%,
      rgba(255,205,76,.14) 54% 62%,
      rgba(255,118,61,.29) 66% 100%);
  border:1px solid rgba(255,255,255,.09);
  box-shadow:inset 0 .3rem .8rem rgba(0,0,0,.72),inset 0 -.2rem .5rem rgba(255,255,255,.06);
}
.meter-tube-3d::after{
  content:"";
  position:absolute;
  z-index:-2;
  left:7%;right:7%;bottom:-1.15rem;height:1.1rem;
  border-radius:50%;
  background:radial-gradient(ellipse,rgba(0,0,0,.72),rgba(0,0,0,0) 70%);
  transform:translateZ(-18px) scaleY(.55);
  pointer-events:none;
}
.tube-cap{
  position:absolute;
  z-index:3;
  top:4%;bottom:4%;
  width:clamp(1rem,3.3vw,1.75rem);
  border:2px solid rgba(229,249,255,.72);
  border-radius:50%;
  background:
    radial-gradient(ellipse at 38% 35%,rgba(255,255,255,.3),rgba(112,182,214,.08) 35%,rgba(1,8,13,.8) 78%);
  box-shadow:inset 0 0 .8rem rgba(139,226,255,.17),0 0 .6rem rgba(0,0,0,.7);
  pointer-events:none;
}
.tube-cap-left{left:calc(-1 * clamp(.45rem,1.5vw,.8rem));transform:translateZ(3px)}
.tube-cap-right{right:calc(-1 * clamp(.45rem,1.5vw,.8rem));transform:translateZ(3px) scaleX(-1)}
.tube-reflection{
  z-index:5;left:5%;right:5%;top:8%;height:20%;
  background:linear-gradient(180deg,rgba(255,255,255,.44),rgba(255,255,255,.06) 65%,transparent);
  filter:none;
  opacity:.86;
}
.tube-depth{
  z-index:1;inset:15% 2.2%;
  border:1px solid rgba(139,225,255,.08);
  box-shadow:inset 0 0 1.25rem rgba(0,0,0,.9),0 0 .8rem rgba(89,205,255,.06);
}
.tube-floor{
  position:absolute;z-index:2;left:4%;right:4%;bottom:10%;height:28%;
  border-radius:50%;
  background:linear-gradient(180deg,transparent,rgba(0,0,0,.48));
  box-shadow:inset 0 -.35rem .7rem rgba(0,0,0,.4);
  pointer-events:none;
}
.meter-center{
  z-index:6!important;top:8%!important;bottom:8%!important;width:4px!important;
  border-radius:999px;
  background:rgba(238,255,248,.96)!important;
  box-shadow:0 0 .55rem #fff,0 0 1.25rem rgba(105,255,182,.62);
}
#tuning-needle.meter-beam-3d{
  z-index:8;top:15%!important;bottom:15%!important;
  width:clamp(9px,1.1vw,14px)!important;
  border:1px solid rgba(255,255,255,.95)!important;
  background:linear-gradient(90deg,rgba(255,255,255,.42),var(--victoria-beam),rgba(255,255,255,.42))!important;
  box-shadow:0 0 .45rem #fff,0 0 1.05rem var(--tube-warm),0 0 2.25rem rgba(255,151,73,.62)!important;
  transform:translateX(-50%) translateZ(10px);
  transition:left .08s linear,box-shadow .16s ease,width .16s ease,opacity .16s ease;
}
.tuned-ring{
  position:absolute;z-index:7;left:50%;top:50%;
  width:clamp(2.1rem,5vw,3.3rem);height:82%;
  border:3px solid transparent;border-radius:50%;
  transform:translate(-50%,-50%) translateZ(7px);
  opacity:0;pointer-events:none;
}
.tuning-meter[data-state="near"] .meter-tube-3d,
.tuning-meter[data-state="nearZone"] .meter-tube-3d{
  box-shadow:
    inset 0 .45rem .85rem rgba(255,255,255,.15),
    inset 0 -.75rem 1.15rem rgba(0,0,0,.82),
    inset 0 0 1.9rem rgba(255,218,82,.14),
    0 1.25rem 1.4rem -.55rem rgba(0,0,0,.72);
}
.tuning-meter[data-state="near"] #tuning-needle,
.tuning-meter[data-state="nearZone"] #tuning-needle{
  box-shadow:0 0 .5rem #fff,0 0 1.25rem var(--victoria-near),0 0 2.6rem rgba(255,218,82,.64)!important;
}
.tuning-meter[data-state="tuned"] .meter-tube-3d{
  border-color:rgba(197,255,222,.88);
  box-shadow:
    inset 0 .45rem .85rem rgba(255,255,255,.17),
    inset 0 -.75rem 1.15rem rgba(0,0,0,.82),
    inset 0 0 2rem rgba(112,255,177,.2),
    0 1.25rem 1.4rem -.55rem rgba(0,0,0,.72),
    0 0 1.5rem rgba(112,255,177,.12);
}
.tuning-meter[data-state="tuned"] #tuning-needle{
  width:clamp(15px,1.8vw,22px)!important;
  box-shadow:0 0 .6rem #fff,0 0 1.45rem var(--victoria-tuned),0 0 3.2rem rgba(112,255,177,.75)!important;
}
.tuning-meter[data-state="tuned"] .tuned-ring{
  opacity:1;border-color:rgba(176,255,210,.88);
  box-shadow:0 0 .8rem rgba(255,255,255,.65),0 0 1.8rem rgba(112,255,177,.65),inset 0 0 1rem rgba(112,255,177,.32);
  animation:victoria-tuned-confirm .62s ease-out 1;
}
@keyframes victoria-tuned-confirm{
  0%{opacity:0;transform:translate(-50%,-50%) translateZ(7px) scale(.72)}
  45%{opacity:1}
  100%{opacity:.72;transform:translate(-50%,-50%) translateZ(7px) scale(1.14)}
}
/* Sin señal: el centro sigue siendo referencia geométrica, pero el haz no aparenta una lectura. */
.tuning-meter[data-state="waiting"] #tuning-needle{
  opacity:.12;
  box-shadow:none!important;
}
.tuning-meter[data-state="waiting"] .meter-tube-3d{
  filter:saturate(.45);
}
/* Identidad VICTORIA: sólida y legible, sin depender del resplandor. */
.title-brand{
  letter-spacing:.13em;
  font-weight:950;
  color:var(--title-brand-color);
  text-shadow:0 .08em 0 rgba(0,0,0,.7),0 0 .26em color-mix(in srgb,currentColor 55%,transparent);
}
@media(max-width:620px){
  .meter-tube-3d{transform:rotateX(2deg);margin-inline:.65rem;height:clamp(4.8rem,19vw,6.3rem)}
  .tube-cap{width:1.1rem}
  .meter-scale{padding-inline:1rem}
}
@media(prefers-reduced-motion:reduce){
  .tuning-meter[data-state="tuned"] .tuned-ring{animation:none}
  #tuning-needle.meter-beam-3d{transition:none!important}
}
@media(forced-colors:active){
  .tube-cap,.tube-floor,.tuned-ring{display:none!important}
  .meter-tube-3d{filter:none!important;transform:none!important}
  .title-brand{color:CanvasText!important;text-shadow:none!important}
}
html[data-high-contrast="true"] .tube-cap,
html[data-high-contrast="true"] .tube-floor,
html[data-high-contrast="true"] .tuned-ring{display:none}
html[data-high-contrast="true"] .meter-tube-3d{filter:none;transform:none}
html[data-high-contrast="true"] #tuning-needle{opacity:1}
html[data-theme="light"] .meter-scale{color:#111;text-shadow:none}
html[data-theme="light"] .title-brand{text-shadow:none}

/* ===== Fase 3.7.67 — Displays físicos y pulsador VICTORIA ===== */
.victoria-readouts{gap:clamp(.7rem,2vw,1rem)}
.victoria-display{position:relative;overflow:hidden;border:1px solid rgba(150,222,247,.52);border-radius:1rem;background:linear-gradient(180deg,rgba(255,255,255,.08),transparent 17%),linear-gradient(180deg,#0c171e,#071017 52%,#03080c);box-shadow:inset 0 .12rem .15rem rgba(255,255,255,.12),inset 0 -.4rem .85rem rgba(0,0,0,.68),inset 0 0 1.1rem rgba(64,177,221,.08),0 .48rem .75rem -.42rem rgba(0,0,0,.82)}
.victoria-display::before{content:"";position:absolute;pointer-events:none;left:4%;right:4%;top:5%;height:22%;border-radius:999px;background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,0));opacity:.7}
.victoria-display dt,.victoria-display dd{position:relative;z-index:1}
.victoria-display dt{letter-spacing:.045em;font-weight:750}
.victoria-display dd{font-variant-numeric:tabular-nums;font-weight:900;text-shadow:0 0 .5rem rgba(133,227,255,.18)}
.victoria-readouts .victoria-display:first-child{border-color:rgba(164,235,255,.75);box-shadow:inset 0 .12rem .15rem rgba(255,255,255,.14),inset 0 -.4rem .9rem rgba(0,0,0,.7),inset 0 0 1.35rem rgba(75,198,240,.12),0 .55rem .85rem -.42rem rgba(0,0,0,.85)}
.victoria-readouts .victoria-display:first-child dd{font-size:clamp(1.55rem,4vw,2.25rem)}
.victoria-tune-button{position:relative;isolation:isolate;min-height:3.9rem;padding-inline:clamp(1.8rem,7vw,4.2rem)!important;border:2px solid rgba(197,241,255,.75)!important;border-radius:1.15rem!important;background:linear-gradient(180deg,rgba(255,255,255,.22),rgba(255,255,255,.035) 28%),linear-gradient(180deg,#185c75,#0b4056 52%,#062b3d)!important;box-shadow:inset 0 .16rem .18rem rgba(255,255,255,.26),inset 0 -.42rem .6rem rgba(0,0,0,.48),0 .55rem 0 #03151e,0 .75rem 1rem rgba(0,0,0,.5)!important;transform:translateY(-.16rem);transition:transform .08s ease,box-shadow .08s ease,filter .14s ease;font-weight:950;letter-spacing:.035em}
.victoria-tune-button:hover{filter:brightness(1.09)}
.victoria-tune-button:active{transform:translateY(.28rem);box-shadow:inset 0 .32rem .55rem rgba(0,0,0,.42),inset 0 -.1rem .15rem rgba(255,255,255,.15),0 .12rem 0 #03151e,0 .25rem .45rem rgba(0,0,0,.4)!important}
.victoria-button-lamp{display:inline-block;width:.72rem;height:.72rem;margin-inline-end:.65rem;border:2px solid rgba(255,255,255,.65);border-radius:50%;vertical-align:.05em;background:#26333a;box-shadow:inset 0 0 .25rem rgba(0,0,0,.8);pointer-events:none}
.victoria-tune-button[aria-pressed="true"] .victoria-button-lamp{background:#b8ffd2;box-shadow:0 0 .42rem #fff,0 0 .9rem rgba(112,255,177,.85),inset 0 0 .15rem rgba(255,255,255,.7)}
.victoria-tune-button[aria-pressed="true"]{transform:translateY(.18rem);box-shadow:inset 0 .28rem .5rem rgba(0,0,0,.34),inset 0 0 1rem rgba(112,255,177,.1),0 .2rem 0 #03151e,0 .35rem .7rem rgba(0,0,0,.46)!important}
html[data-theme="light"] .victoria-display{color:#071017;border-color:#315f70;background:linear-gradient(180deg,#fff,#eaf4f7);box-shadow:inset 0 .12rem .15rem #fff,inset 0 -.28rem .6rem rgba(37,77,91,.16),0 .35rem .6rem rgba(0,0,0,.16)}
html[data-theme="light"] .victoria-display dd{color:#071017;text-shadow:none}
html[data-high-contrast="true"] .victoria-display{border:3px solid currentColor;background:Canvas;box-shadow:none}
html[data-high-contrast="true"] .victoria-display::before,html[data-high-contrast="true"] .victoria-button-lamp{display:none}
html[data-high-contrast="true"] .victoria-tune-button{border:3px solid currentColor!important;background:Canvas!important;color:CanvasText!important;box-shadow:none!important;transform:none!important}
@media(prefers-reduced-motion:reduce){.victoria-tune-button{transition:none}}
@media(forced-colors:active){.victoria-display,.victoria-tune-button{background:Canvas!important;color:CanvasText!important;border:2px solid CanvasText!important;box-shadow:none!important;transform:none!important}.victoria-display::before,.victoria-button-lamp{display:none!important}}

/* Fase 3.7.68 - Armonizacion estetica integral VICTORIA */
:root{--victoria-surface-1:#101820;--victoria-surface-2:#071017;--victoria-edge:rgba(162,226,247,.55);--victoria-focus:#fff3a3}
body{background:radial-gradient(circle at 50% -10%,rgba(40,128,164,.14),transparent 35rem),var(--at-bg)}
main{max-width:70rem;margin-inline:auto}header::after{content:"";display:block;width:min(16rem,55vw);height:1px;margin:.85rem auto 0;background:linear-gradient(90deg,transparent,var(--title-brand-color),transparent);opacity:.75}.title-product{letter-spacing:.025em;font-weight:820}.title-brand{display:block;margin-top:.14em;font-size:clamp(1.35rem,5vw,2.25rem);letter-spacing:.18em}.panel{border-color:var(--victoria-edge);background:linear-gradient(180deg,rgba(255,255,255,.035),transparent 16%),linear-gradient(180deg,var(--victoria-surface-1),var(--victoria-surface-2));box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 .55rem 1.3rem rgba(0,0,0,.24)}.victoria-console{position:relative;overflow:hidden}.victoria-console::before{content:"";position:absolute;pointer-events:none;inset:0 0 auto;height:3.2rem;background:linear-gradient(180deg,rgba(255,255,255,.045),transparent)}.victoria-mode-select,.victoria-reference-button,.victoria-menu-open{border:2px solid var(--victoria-edge)!important;border-radius:.9rem!important}.victoria-mode-select{min-height:3.25rem;background:linear-gradient(180deg,#122a35,#081820)!important;color:var(--at-text)!important;box-shadow:inset 0 .1rem .15rem rgba(255,255,255,.08),inset 0 -.25rem .45rem rgba(0,0,0,.32)}.victoria-reference-button{background:linear-gradient(180deg,#18303b,#0b1c24)!important;box-shadow:inset 0 .1rem .14rem rgba(255,255,255,.11),0 .25rem .45rem rgba(0,0,0,.28)!important}.victoria-reference-button[aria-pressed="true"]{border-color:rgba(255,229,126,.92)!important;box-shadow:inset 0 0 .8rem rgba(255,218,82,.13),0 0 .7rem rgba(255,218,82,.18)!important}.victoria-menu-open{background:linear-gradient(180deg,#153848,#0a2430)!important;box-shadow:inset 0 .1rem .14rem rgba(255,255,255,.1),0 .28rem .5rem rgba(0,0,0,.3)!important}button:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:4px solid var(--victoria-focus)!important;outline-offset:4px!important}.flat-menu-grid{gap:.7rem}.flat-menu-grid button{min-height:3.3rem;text-align:start;border:2px solid var(--menu-border);border-radius:.85rem;background:linear-gradient(180deg,rgba(255,255,255,.055),transparent 30%),var(--menu-button-bg);color:var(--menu-button-text);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 .25rem .4rem rgba(0,0,0,.2)}.flat-menu-grid button:hover{filter:brightness(1.1)}.menu-card{border:2px solid var(--menu-border);box-shadow:0 1.3rem 3rem rgba(0,0,0,.62),inset 0 1px 0 rgba(255,255,255,.08)}.menu-page{border-top:1px solid color-mix(in srgb,var(--menu-border) 45%,transparent);padding-top:.8rem}.menu-page h3{letter-spacing:.025em}html[data-theme="light"] body{background:radial-gradient(circle at 50% -10%,rgba(49,116,145,.12),transparent 35rem),var(--at-bg)}html[data-theme="light"] .panel{background:linear-gradient(180deg,#fff,#eef5f7);border-color:#557b8b;box-shadow:inset 0 1px 0 #fff,0 .45rem 1rem rgba(0,0,0,.12)}html[data-theme="light"] .victoria-mode-select{background:linear-gradient(180deg,#fff,#e8f1f4)!important;color:#111!important}html[data-theme="light"] .victoria-reference-button,html[data-theme="light"] .victoria-menu-open{color:#111!important;background:linear-gradient(180deg,#fff,#dcecf2)!important;border-color:#315f70!important}html[data-high-contrast="true"] body{background:var(--at-bg)}html[data-high-contrast="true"] header::after,html[data-high-contrast="true"] .victoria-console::before{display:none}html[data-high-contrast="true"] .panel,html[data-high-contrast="true"] .victoria-mode-select,html[data-high-contrast="true"] .victoria-reference-button,html[data-high-contrast="true"] .victoria-menu-open,html[data-high-contrast="true"] .flat-menu-grid button,html[data-high-contrast="true"] .menu-card{background:Canvas!important;color:CanvasText!important;border:3px solid currentColor!important;box-shadow:none!important}@media(max-width:620px){main{width:100%}.panel{border-radius:.9rem}.victoria-mode-select,.victoria-reference-button,.victoria-menu-open,.victoria-tune-button{width:100%;max-width:none}.title-brand{letter-spacing:.12em}.flat-menu-grid{grid-template-columns:1fr}}@media(forced-colors:active){body{background:Canvas}header::after,.victoria-console::before{display:none}.panel,.victoria-mode-select,.victoria-reference-button,.victoria-menu-open,.flat-menu-grid button,.menu-card{background:Canvas!important;color:CanvasText!important;border:2px solid CanvasText!important;box-shadow:none!important}}


/* ============================================================
   VICTORIA 3.7.70 — Identidad Flamenca 3D
   Recupera la paleta histórica de la fase 3.7.40:
   fondo #130B08, madera #21130E, marfil #FFF8ED,
   dorado #FFD166 / #F4C27A, ámbar #FF9F1C y teja #7B241C.
   ============================================================ */
:root{
  --at-bg:#130B08;
  --at-surface:#21130E;
  --at-text:#FFF8ED;
  --at-muted:#E8D7C5;
  --victoria-surface-1:#2A1811;
  --victoria-surface-2:#160C08;
  --victoria-edge:rgba(244,194,122,.62);
  --victoria-edge-strong:#FFD166;
  --victoria-focus:#FFD166;
  --victoria-control:#3B2117;
  --victoria-control-hover:#533022;
  --title-product-color:#FFF8ED;
  --title-brand-color:#FFD166;
  --menu-surface:#21130E;
  --menu-text:#FFF8ED;
  --menu-border:#F4C27A;
  --menu-button-bg:#3B2117;
  --menu-button-text:#FFF8ED;
}
body{
  color:#FFF8ED;
  background:
    radial-gradient(circle at 50% -12%,rgba(255,159,28,.13),transparent 34rem),
    radial-gradient(circle at 12% 18%,rgba(123,36,28,.12),transparent 25rem),
    #130B08;
}
header::after{
  background:linear-gradient(90deg,transparent,#7B241C 12%,#FFD166 50%,#7B241C 88%,transparent);
  opacity:.95;
}
.title-product{
  color:#FFF8ED;
  text-shadow:0 .08rem .12rem rgba(0,0,0,.75);
}
.title-brand{
  color:#FFD166;
  text-shadow:
    0 1px 0 #70442E,
    0 2px 0 #3B2117,
    0 0 .45rem rgba(255,159,28,.42);
}
.panel{
  border-color:rgba(244,194,122,.55);
  background:
    linear-gradient(115deg,rgba(255,255,255,.035),transparent 20%),
    repeating-linear-gradient(4deg,rgba(255,209,102,.018) 0 1px,transparent 1px 6px),
    linear-gradient(180deg,#2A1811,#160C08);
  box-shadow:
    inset 0 1px 0 rgba(255,209,102,.09),
    inset 0 -.5rem 1rem rgba(0,0,0,.2),
    0 .55rem 1.3rem rgba(0,0,0,.34);
}
.victoria-console::before{
  background:linear-gradient(180deg,rgba(255,209,102,.055),transparent);
}

/* Medidor: cristal ahumado ámbar dentro de una carcasa de madera. */
.meter-track-3d{
  border-color:rgba(244,194,122,.76)!important;
  background:
    linear-gradient(180deg,rgba(255,225,161,.16),rgba(255,159,28,.035) 25%,rgba(19,11,8,.36) 68%,rgba(123,36,28,.16))!important;
  box-shadow:
    inset 0 .18rem .28rem rgba(255,232,180,.18),
    inset 0 -.48rem .7rem rgba(50,20,8,.62),
    inset 0 0 1.2rem rgba(255,159,28,.12),
    0 .65rem 1rem rgba(0,0,0,.45)!important;
}
.tube-cap-left,.tube-cap-right{
  border-color:rgba(244,194,122,.7)!important;
  background:linear-gradient(90deg,rgba(112,68,46,.68),rgba(255,209,102,.08),rgba(59,33,23,.66))!important;
}
.tube-reflection{
  background:linear-gradient(180deg,rgba(255,248,237,.22),rgba(255,209,102,.03),transparent)!important;
}
.tube-depth{
  box-shadow:inset 0 0 1rem rgba(123,36,28,.25),inset 0 0 2rem rgba(255,159,28,.08)!important;
}
.tube-floor{
  background:linear-gradient(180deg,transparent,rgba(123,36,28,.12),rgba(255,159,28,.08))!important;
}
.meter-center{
  background:#FFD166!important;
  box-shadow:0 0 .35rem rgba(255,209,102,.8)!important;
}
.meter-scale,
.meter-label,
.tuning-scale{
  color:#F4C27A!important;
}
.meter-beam-3d{
  background:linear-gradient(180deg,#FFF8ED,#FFD166 36%,#FF9F1C 72%,#7B241C)!important;
  box-shadow:0 0 .35rem #FFD166,0 0 .9rem rgba(255,159,28,.75)!important;
}
.tuned .meter-beam-3d,
.is-tuned .meter-beam-3d{
  background:linear-gradient(180deg,#F1FFF4,#9EFFB5,#49D66F)!important;
  box-shadow:0 0 .35rem #fff,0 0 1rem rgba(73,214,111,.9)!important;
}
.tuned-ring{
  border-color:rgba(255,209,102,.7)!important;
  box-shadow:0 0 .8rem rgba(255,159,28,.42),inset 0 0 .8rem rgba(255,209,102,.25)!important;
}

/* Displays: cristal oscuro con cerco bronce/dorado. */
.victoria-display{
  border-color:rgba(244,194,122,.62)!important;
  background:
    linear-gradient(180deg,rgba(255,209,102,.07),transparent 18%),
    linear-gradient(180deg,#1A100C,#0F0907 55%,#080504)!important;
  box-shadow:
    inset 0 .12rem .15rem rgba(255,232,180,.1),
    inset 0 -.4rem .85rem rgba(0,0,0,.72),
    inset 0 0 1.1rem rgba(255,159,28,.07),
    0 .48rem .75rem -.42rem rgba(0,0,0,.86)!important;
}
.victoria-display::before{
  background:linear-gradient(180deg,rgba(255,232,180,.13),rgba(255,255,255,0))!important;
}
.victoria-display dt{color:#E8D7C5}
.victoria-display dd{
  color:#FFF8ED;
  text-shadow:0 0 .55rem rgba(255,209,102,.18)!important;
}
.victoria-readouts .victoria-display:first-child{
  border-color:#FFD166!important;
  box-shadow:
    inset 0 .12rem .15rem rgba(255,232,180,.13),
    inset 0 -.4rem .9rem rgba(0,0,0,.72),
    inset 0 0 1.35rem rgba(255,159,28,.12),
    0 .55rem .85rem -.42rem rgba(0,0,0,.88)!important;
}

/* Controles físicos con madera, teja y herrajes dorados. */
.victoria-tune-button{
  border-color:#FFD166!important;
  color:#FFF8ED!important;
  background:
    linear-gradient(180deg,rgba(255,232,180,.13),transparent 27%),
    linear-gradient(180deg,#8A3327,#7B241C 54%,#4D1712)!important;
  box-shadow:
    inset 0 .16rem .18rem rgba(255,232,180,.2),
    inset 0 -.42rem .6rem rgba(40,8,5,.56),
    0 .55rem 0 #2B100C,
    0 .75rem 1rem rgba(0,0,0,.55)!important;
}
.victoria-button-lamp{
  border-color:#FFD166!important;
  background:#3B2117!important;
}
.victoria-tune-button[aria-pressed="true"] .victoria-button-lamp{
  background:#A8FFBC!important;
  box-shadow:0 0 .42rem #fff,0 0 .9rem rgba(73,214,111,.88)!important;
}
.victoria-reference-button{
  color:#FFF8ED!important;
  border-color:#F4C27A!important;
  background:linear-gradient(180deg,#533022,#2E1911)!important;
  box-shadow:inset 0 .1rem .14rem rgba(255,209,102,.12),0 .25rem .45rem rgba(0,0,0,.35)!important;
}
.victoria-reference-button[aria-pressed="true"]{
  border-color:#FFD166!important;
  box-shadow:inset 0 0 .9rem rgba(255,159,28,.18),0 0 .8rem rgba(255,209,102,.2)!important;
}
.victoria-mode-select{
  color:#FFF8ED!important;
  border-color:#F4C27A!important;
  background:linear-gradient(180deg,#3B2117,#21130E)!important;
}
.victoria-menu-open{
  color:#FFF8ED!important;
  border-color:#F4C27A!important;
  background:linear-gradient(180deg,#70442E,#3B2117)!important;
}
.flat-menu-grid button{
  border-color:#F4C27A!important;
  background:
    linear-gradient(180deg,rgba(255,209,102,.07),transparent 30%),
    linear-gradient(180deg,#533022,#2D1912)!important;
  color:#FFF8ED!important;
}
.flat-menu-grid button:hover{
  background:linear-gradient(180deg,#70442E,#3B2117)!important;
}
.menu-card{
  background:
    linear-gradient(180deg,rgba(255,209,102,.04),transparent 15%),
    #21130E!important;
  color:#FFF8ED!important;
  border-color:#F4C27A!important;
}
.menu-page{border-top-color:rgba(244,194,122,.45)!important}
button:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible,[tabindex]:focus-visible{
  outline-color:#FFD166!important;
  box-shadow:0 0 0 2px #130B08,0 0 0 6px #FFD166!important;
}

/* El tema claro conserva identidad cálida: pergamino/madera, no azul. */
html[data-theme="light"] body{
  color:#2B1710;
  background:radial-gradient(circle at 50% -10%,rgba(255,159,28,.13),transparent 35rem),#F7E9D5!important;
}
html[data-theme="light"] .panel{
  color:#2B1710;
  border-color:#70442E!important;
  background:linear-gradient(180deg,#FFF8ED,#EFD8BA)!important;
}
html[data-theme="light"] .title-product{color:#2B1710}
html[data-theme="light"] .title-brand{color:#7B241C;text-shadow:0 1px 0 #FFD166}
html[data-theme="light"] .victoria-mode-select,
html[data-theme="light"] .victoria-reference-button,
html[data-theme="light"] .victoria-menu-open{
  color:#2B1710!important;
  border-color:#70442E!important;
  background:linear-gradient(180deg,#FFF8ED,#E8CDAA)!important;
}
html[data-theme="light"] .victoria-display{
  color:#2B1710;
  border-color:#70442E!important;
  background:linear-gradient(180deg,#FFF8ED,#E8D7C5)!important;
}
html[data-theme="light"] .victoria-display dt,
html[data-theme="light"] .victoria-display dd{color:#2B1710!important;text-shadow:none!important}

/* Alto contraste y colores forzados siguen priorizando accesibilidad. */
html[data-high-contrast="true"] body{background:var(--at-bg)!important}
@media(forced-colors:active){
  body{background:Canvas!important}
}

/* VICTORIA 3.7.76 — identidad gráfica. Solo presentación. */
.victoria-logo-heading{margin:.1rem auto .35rem!important;max-width:min(54rem,96vw)!important;line-height:0}
.victoria-header-logo{display:block;width:min(100%,54rem);height:auto;margin-inline:auto;object-fit:contain;border-radius:.35rem}
.victoria-menu-emblem{display:block;width:clamp(2.2rem,7vw,3.2rem);height:auto;margin:0 auto .45rem;border-radius:.55rem;opacity:.88}
@media(max-width:620px){.app-header{padding:.35rem .55rem .12rem}.victoria-logo-heading{max-width:96vw!important;margin:.05rem auto .18rem!important}.victoria-header-logo{max-height:5.2rem;object-fit:contain}.victoria-menu-emblem{width:2.35rem;margin-bottom:.3rem}}
@media(max-height:700px) and (min-width:500px){.victoria-header-logo{max-height:4.3rem;width:auto;max-width:92vw}.victoria-logo-heading{margin:0 auto .1rem!important}}
@media(prefers-reduced-motion:reduce){.victoria-header-logo,.victoria-menu-emblem{transition:none}}
@media(forced-colors:active){.victoria-header-logo{forced-color-adjust:none}.victoria-menu-emblem{display:none}}

/* VICTORIA 3.7.77 — cabecera gráfica refinada */
.app-header{background:#000!important;padding:.25rem .75rem 0!important}
.victoria-logo-heading{margin:0 auto!important;max-width:46rem!important;line-height:0;text-align:center;padding:0 0 25px!important}
.victoria-header-logo{display:block;width:100%;max-width:46rem;height:auto;max-height:none;margin:0 auto;object-fit:contain;border-radius:0}
.victoria-menu-emblem{object-fit:contain}
@media(max-width:620px){
  .app-header{padding:.2rem .4rem 0!important}
  .victoria-logo-heading{width:70%!important;max-width:70%!important;margin:0 auto!important;padding:0 0 24px!important}
  .victoria-header-logo{width:100%;max-width:100%;height:auto;max-height:none;object-fit:contain}
}
@media(max-height:700px) and (min-width:500px){
  .victoria-logo-heading{max-width:42rem!important;margin:0 auto!important;padding-bottom:22px!important}
  .victoria-header-logo{width:100%;height:auto;max-height:none;max-width:100%;object-fit:contain}
}


/* VICTORIA 3.7.78 — ajuste de identidad móvil */
/* Solo aumenta la presencia del logotipo en pantallas móviles; conserva proporción y estructura. */
@media(max-width:620px){
  .victoria-logo-heading{width:88%!important;max-width:88%!important;margin:0 auto!important;padding:0 0 25px!important}
  .victoria-header-logo{display:block;width:100%;max-width:100%;height:auto;max-height:none;margin:0 auto;object-fit:contain}
}

/* VICTORIA 3.7.82 — cabecera ajuste final */
/* Reduce únicamente el espacio posterior al logotipo; no altera su escala ni el resto de la interfaz. */
.victoria-logo-heading{padding-bottom:3px!important}
@media(max-width:620px){.victoria-logo-heading{padding-bottom:3px!important}}
@media(max-height:700px) and (min-width:500px){.victoria-logo-heading{padding-bottom:3px!important}}

/* VICTORIA 3.7.82 — cabecera ajuste final */
.victoria-logo-heading{padding-bottom:3px!important}
@media(max-width:620px){.victoria-logo-heading{padding-bottom:3px!important}}
@media(max-height:700px) and (min-width:500px){.victoria-logo-heading{padding-bottom:3px!important}}

/* VICTORIA 3.7.84 — ayuda integrada segura, sin JavaScript adicional */
.documentation{max-height:min(68vh,44rem);overflow:auto;scrollbar-gutter:stable}.documentation details{border:1px solid var(--line);border-radius:.6rem;margin:.75rem 0;background:rgba(0,0,0,.08)}.documentation summary{cursor:pointer;font-weight:700;padding:.85rem;min-height:3rem}.documentation details[open] summary{border-bottom:1px solid var(--line)}.help-document{padding:.2rem .9rem 1rem}.documentation h4{margin-top:1.35rem}.documentation table{width:100%;border-collapse:collapse;margin:1rem 0}.documentation th,.documentation td{border:1px solid var(--line);padding:.45rem;text-align:left}.documentation ul,.documentation ol{padding-inline-start:1.5rem}.donate-details{margin-top:.75rem;padding:.75rem;border:1px solid var(--line);border-radius:.55rem}.donate-button{display:inline-block;padding:.7rem .9rem;border:1px solid var(--line);border-radius:.5rem;font-weight:700}

/* VICTORIA 3.7.85 EXPERIMENTAL — modo visual inmersivo 3D.
   Capa exclusivamente visual: no modifica detección, audio ni lógica de afinación. */
body.visual-tuning-active{
  min-height:100dvh;
  background:
    radial-gradient(ellipse at 50% 42%,rgba(120,28,13,.24) 0%,rgba(35,10,7,.12) 35%,transparent 66%),
    linear-gradient(180deg,#070403 0%,#110806 52%,#050302 100%);
}
body.visual-tuning-active .app-header,
body.visual-tuning-active .menu-launch,
body.visual-tuning-active .primary-controls > h2,
body.visual-tuning-active .primary-controls > label,
body.visual-tuning-active #tuning-mode,
body.visual-tuning-active #reference-play,
body.visual-tuning-active #selected-mode{display:none!important}
body.visual-tuning-active main#contenido{max-width:none;width:100%;padding:0!important;margin:0!important}
body.visual-tuning-active #panel-tuner{min-height:100dvh;display:flex;flex-direction:column}
body.visual-tuning-active .primary-controls{
  position:sticky;top:0;z-index:60;width:100%;max-width:none!important;margin:0!important;
  min-height:4.2rem;padding:.45rem .8rem!important;display:flex!important;justify-content:center;align-items:center;
  background:linear-gradient(180deg,rgba(24,10,7,.98),rgba(10,5,4,.96));
  border:0!important;border-bottom:1px solid rgba(255,201,99,.5)!important;border-radius:0!important;
  box-shadow:0 .45rem 1.4rem rgba(0,0,0,.48)
}
body.visual-tuning-active #tune-button{
  width:min(92vw,24rem)!important;min-height:3.15rem!important;margin:0!important;padding:.55rem 1.25rem!important;
  border:2px solid #f4c27a!important;border-radius:999px!important;
  background:linear-gradient(180deg,#6e2518,#35120c)!important;color:#fff8ed!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 0 0 1px rgba(255,159,28,.2),0 .45rem 1rem rgba(0,0,0,.55)!important;
  font-size:clamp(1.08rem,3.5vw,1.35rem)!important
}
body.visual-tuning-active .tuning-panel{
  flex:1;width:100%!important;max-width:none!important;min-height:calc(100dvh - 4.2rem);margin:0!important;
  padding:clamp(.55rem,1.6vw,1.15rem)!important;display:flex!important;flex-direction:column;justify-content:center;gap:clamp(.45rem,1.5vh,1rem);
  border:0!important;border-radius:0!important;
  background:
    radial-gradient(ellipse at 50% 46%,rgba(126,25,13,.25),transparent 58%),
    linear-gradient(145deg,rgba(22,10,7,.98),rgba(5,4,3,.995))!important;
  box-shadow:none!important
}
body.visual-tuning-active .tuning-panel::after{display:none!important}
body.visual-tuning-active .tuning-panel > h2{
  margin:0!important;text-align:center;color:#ffd166;font-size:clamp(1rem,2.7vw,1.35rem);letter-spacing:.08em;text-transform:uppercase
}
body.visual-tuning-active .tuning-meter{
  position:relative;width:min(98vw,96rem)!important;min-height:0!important;height:clamp(15rem,55dvh,40rem)!important;
  margin:0 auto!important;padding:clamp(1.4rem,4vh,3.2rem) clamp(.5rem,2vw,2rem) clamp(1rem,3vh,2.2rem)!important;
  perspective:1200px;filter:drop-shadow(0 1.1rem 1.4rem rgba(0,0,0,.68))
}
body.visual-tuning-active .meter-scale{
  position:absolute;z-index:9;left:6%;right:6%;top:.25rem;height:2.4rem;display:flex!important;justify-content:space-between;align-items:flex-start;
  color:#ffe2a1;font-size:clamp(.9rem,2.5vw,1.35rem);font-weight:800;text-shadow:0 1px 0 #000,0 0 .65rem rgba(255,185,72,.5)
}
body.visual-tuning-active .meter-track.meter-tube-3d{
  position:absolute;inset:clamp(2.4rem,7vh,4.4rem) 2.5% clamp(.5rem,2vh,1.5rem)!important;width:auto!important;height:auto!important;margin:0!important;
  overflow:hidden;border:clamp(3px,.45vw,7px) solid #c98a32!important;border-radius:clamp(2.4rem,8vw,7rem)!important;
  background:
    linear-gradient(180deg,rgba(255,244,206,.22) 0%,rgba(255,205,113,.07) 8%,transparent 24%,rgba(0,0,0,.32) 52%,rgba(116,25,15,.18) 76%,rgba(255,185,70,.13) 100%),
    radial-gradient(ellipse at 50% 38%,rgba(116,20,12,.92) 0%,rgba(39,8,7,.97) 58%,#090403 100%)!important;
  box-shadow:
    inset 0 clamp(8px,2vh,22px) clamp(18px,4vh,50px) rgba(255,225,163,.2),
    inset 0 clamp(-35px,-5vh,-12px) clamp(28px,6vh,72px) rgba(0,0,0,.88),
    inset 0 0 clamp(28px,7vw,90px) rgba(188,42,21,.28),
    0 0 0 clamp(2px,.25vw,4px) rgba(255,218,139,.24),
    0 clamp(12px,3vh,34px) clamp(28px,6vh,70px) rgba(0,0,0,.72)!important;
  transform:rotateX(4deg)!important;transform-style:preserve-3d
}
/* Escala grabada: las marcas son decorativas y no entran en accesibilidad. */
body.visual-tuning-active .meter-track.meter-tube-3d::before{
  content:"";position:absolute;z-index:4;left:4%;right:4%;top:9%;height:22%;border-radius:50% 50% 22% 22%;
  background:
    repeating-linear-gradient(90deg,transparent 0 calc(2% - 2px),rgba(255,219,139,.9) calc(2% - 2px) 2%,transparent 2% 4%),
    linear-gradient(180deg,rgba(255,221,147,.16),transparent 70%)!important;
  opacity:.72;filter:drop-shadow(0 2px 2px rgba(0,0,0,.8))!important;box-shadow:none!important
}
body.visual-tuning-active .meter-track.meter-tube-3d::after{
  content:"";position:absolute;z-index:8;left:3%;right:3%;top:3%;height:38%;border-radius:999px 999px 48% 48%;pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.28),rgba(255,236,197,.08) 35%,transparent 88%)!important;
  filter:blur(.15px);opacity:.72
}
body.visual-tuning-active .tube-reflection{z-index:10!important;opacity:.8!important;background:linear-gradient(105deg,transparent 5%,rgba(255,255,255,.13) 18%,rgba(255,255,255,.02) 35%,transparent 49%,rgba(255,221,166,.1) 75%,transparent 90%)!important}
body.visual-tuning-active .tube-depth{opacity:.95!important;box-shadow:inset 0 0 clamp(25px,5vw,70px) rgba(0,0,0,.82)!important}
body.visual-tuning-active .tube-floor{opacity:.8!important;background:radial-gradient(ellipse at center,rgba(255,119,44,.18),rgba(0,0,0,.7) 70%)!important}
body.visual-tuning-active .meter-center{
  z-index:12!important;width:clamp(3px,.38vw,6px)!important;height:82%!important;top:9%!important;
  background:linear-gradient(180deg,#fff6d1,#ffd166 46%,#ff9f1c)!important;
  box-shadow:0 0 .45rem #ffd166,0 0 1.2rem rgba(255,159,28,.75)!important
}
body.visual-tuning-active #tuning-needle.meter-beam-3d{
  z-index:14!important;top:7%!important;height:86%!important;width:clamp(7px,.75vw,13px)!important;border-radius:999px!important;
  background:linear-gradient(90deg,#7a160c 0%,#ffad35 20%,#fff5c7 50%,#ffad35 80%,#7a160c 100%)!important;
  box-shadow:0 0 .35rem #fff1b0,0 0 1rem #ff9f1c,0 0 2.4rem rgba(255,93,28,.75)!important;
  transform:translateX(-50%) translateZ(30px)!important;transition:filter .16s ease,opacity .16s ease!important
}
body.visual-tuning-active .tuning-meter[data-state="waiting"] #tuning-needle{opacity:.2!important;filter:saturate(.4)!important}
body.visual-tuning-active .tuning-meter[data-state="near"] #tuning-needle,
body.visual-tuning-active .tuning-meter[data-state="nearZone"] #tuning-needle{filter:brightness(1.22) saturate(1.15)!important}
body.visual-tuning-active .tuning-meter[data-state="tuned"] #tuning-needle{
  background:linear-gradient(90deg,#0b542a,#62e894 25%,#e8ffef 50%,#62e894 75%,#0b542a)!important;
  box-shadow:0 0 .45rem #caffda,0 0 1.35rem #62e894,0 0 3rem rgba(52,222,116,.78)!important
}
body.visual-tuning-active .tuning-meter[data-state="tuned"] .meter-track{border-color:#c9e7bd!important;box-shadow:inset 0 0 clamp(35px,7vw,90px) rgba(46,188,99,.2),0 0 2rem rgba(65,219,121,.2),0 1.2rem 3rem rgba(0,0,0,.7)!important}
body.visual-tuning-active .victoria-readouts{
  width:min(96vw,78rem);margin:0 auto!important;display:grid!important;grid-template-columns:1.25fr 1fr 1fr!important;gap:clamp(.45rem,1.2vw,.9rem)!important
}
body.visual-tuning-active .victoria-display{
  min-height:clamp(4.6rem,11vh,7rem);padding:clamp(.4rem,1.2vh,.75rem)!important;border:1px solid rgba(255,202,105,.52)!important;border-radius:clamp(.6rem,1.5vw,1rem)!important;
  background:linear-gradient(180deg,rgba(61,22,14,.9),rgba(14,7,5,.96))!important;
  box-shadow:inset 0 1px 0 rgba(255,229,175,.14),inset 0 -.5rem 1.2rem rgba(0,0,0,.6),0 .55rem 1rem rgba(0,0,0,.42)!important
}
body.visual-tuning-active .victoria-display dt{color:#eacb91!important;font-size:clamp(.75rem,1.8vw,1rem)!important;letter-spacing:.045em;text-transform:uppercase}
body.visual-tuning-active .victoria-display dd{color:#fff4d2!important;font-variant-numeric:tabular-nums;font-size:clamp(1.15rem,3.5vw,2.25rem)!important;text-shadow:0 0 .55rem rgba(255,196,85,.28)}
body.visual-tuning-active .victoria-readouts .victoria-display:first-child dd{font-size:clamp(1.5rem,5vw,3.25rem)!important;color:#ffd166!important}
@media(max-width:620px){
  body.visual-tuning-active .primary-controls{min-height:3.85rem;padding:.35rem .55rem!important}
  body.visual-tuning-active .tuning-panel{min-height:calc(100dvh - 3.85rem);padding:.35rem .3rem .55rem!important;gap:.35rem}
  body.visual-tuning-active .tuning-panel > h2{font-size:.9rem}
  body.visual-tuning-active .tuning-meter{width:100%!important;height:clamp(17rem,58dvh,32rem)!important;padding-inline:.1rem!important}
  body.visual-tuning-active .meter-track.meter-tube-3d{inset:2.45rem 1.2% .4rem!important;border-radius:2.6rem!important;transform:rotateX(2deg)!important}
  body.visual-tuning-active .meter-scale{left:5%;right:5%;font-size:.82rem}
  body.visual-tuning-active .victoria-readouts{width:98%;grid-template-columns:1.2fr 1fr 1fr!important;gap:.3rem!important}
  body.visual-tuning-active .victoria-display{min-height:4.1rem;padding:.3rem!important}
  body.visual-tuning-active .victoria-display dt{font-size:.66rem!important}
  body.visual-tuning-active .victoria-display dd{font-size:clamp(.92rem,3.7vw,1.35rem)!important}
  body.visual-tuning-active .victoria-readouts .victoria-display:first-child dd{font-size:clamp(1.15rem,5.2vw,1.8rem)!important}
}
@media(orientation:landscape) and (max-height:620px){
  body.visual-tuning-active .primary-controls{position:fixed;right:.6rem;top:.5rem;width:auto!important;min-height:0;background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important}
  body.visual-tuning-active #tune-button{width:auto!important;min-width:10rem!important;min-height:2.75rem!important}
  body.visual-tuning-active .tuning-panel{min-height:100dvh;padding:.25rem .6rem!important;display:grid!important;grid-template-columns:minmax(0,3.2fr) minmax(14rem,1fr);grid-template-rows:auto 1fr;column-gap:.65rem!important}
  body.visual-tuning-active .tuning-panel > h2{grid-column:1/3;margin:.1rem 11rem .1rem 0!important}
  body.visual-tuning-active .tuning-meter{grid-column:1;height:86dvh!important;width:100%!important}
  body.visual-tuning-active .victoria-readouts{grid-column:2;width:100%;grid-template-columns:1fr!important;align-self:center}
}
@media(prefers-reduced-motion:reduce){
  body.visual-tuning-active #tuning-needle{transition:none!important}
}
@media(forced-colors:active){
  body.visual-tuning-active{background:Canvas!important}
  body.visual-tuning-active .tuning-panel,body.visual-tuning-active .victoria-display{background:Canvas!important;color:CanvasText!important}
}

/* 3.7.88: el tono de referencia se conserva internamente pero se retira de la pantalla principal. */
#reference-play[hidden]{display:none!important}
.primary-controls{grid-template-columns:1fr}
.primary-controls #tune-button{margin-bottom:.1rem}

html:not([lang="es"]) .spanish-master-document{display:none;}


/* Fase 3.7.94 — compatibilidad de selectores nativos en Windows 11.
   Las listas desplegables nativas pueden heredar texto claro sobre fondo claro. */
select option { background-color:#ffffff; color:#111111; }
html[data-theme="dark"] select option { background-color:#ffffff; color:#111111; }
@media (forced-colors: active) { select option { background:Canvas; color:CanvasText; } }

/* 3.7.95 — Accesibilidad, atajos y contacto. */
.shortcut-setting,.contact-form{display:grid;gap:.65rem;margin:1rem 0}.contact-form input[type="text"],.contact-form textarea{width:100%;box-sizing:border-box;font:inherit;padding:.7rem;border:2px solid currentColor;border-radius:.5rem;background:var(--surface,#fff);color:inherit}.contact-form label:not(.check-row){font-weight:700;display:block;margin-bottom:.25rem}.shortcut-setting button,.contact-form button{justify-self:start}


/* VICTORIA 3.7.96 — navegación, documentación y contacto accesible. */
.documentation,.help-document,.documentation p,.documentation li,.documentation h4,.documentation h5,.documentation h6{color:inherit;}
html[data-theme="light"] .documentation,html[data-theme="light"] .help-document{color:#2B1710;background-color:#FFF8ED;}
html[data-theme="dark"] .documentation,html[data-theme="dark"] .help-document{color:#FFF4E6;background-color:#1B0E0A;}
.contact-form-panel{margin:.75rem 0 1rem;padding:.85rem;border:1px solid var(--line);border-radius:.6rem;}
.contact-form-panel[hidden]{display:none!important;}
.contact-form-panel h6{font-size:1.05rem;margin:.1rem 0 .7rem;}
.contact-form button+button{margin-inline-start:.5rem;}
@media(forced-colors:active){.documentation,.help-document,.contact-form-panel{background:Canvas!important;color:CanvasText!important;}}


/* 3.7.98 EXP-RADIO-VISUAL — selección de sonidos con radios nativos */
.sound-radio-group{margin:.85rem 0;padding:.8rem 1rem}
.sound-radio-group legend{font-weight:800;color:var(--accent);padding:0 .4rem}
.sound-radio-option{display:flex;align-items:center;gap:.65rem;min-height:3rem;padding:.35rem .2rem;cursor:pointer}
.sound-radio-option input[type="radio"]{width:1.35rem;height:1.35rem;flex:0 0 auto}
.sound-radio-option span{font-weight:650}

/* Ajuste experimental del afinador visual: evita alturas ligadas al viewport y conserva los datos debajo. */
body.visual-tuning-active .tuning-panel{
  min-height:0!important;display:block!important;padding:1rem!important;margin:1rem 0!important;
  border:2px solid #70442e!important;border-radius:1rem!important
}
body.visual-tuning-active .tuning-meter{
  position:relative!important;width:100%!important;max-width:100%!important;
  height:clamp(8rem,24vw,14rem)!important;min-height:8rem!important;
  margin:.5rem auto 1rem!important;padding:2.5rem .45rem .65rem!important
}
body.visual-tuning-active .meter-track.meter-tube-3d{
  position:absolute!important;left:1.5%!important;right:1.5%!important;top:2.5rem!important;bottom:.55rem!important;
  width:auto!important;height:auto!important;margin:0!important
}
body.visual-tuning-active .victoria-readouts{
  width:100%!important;margin:.75rem 0 0!important;display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:.6rem!important
}
@media(max-width:620px){
  body.visual-tuning-active .tuning-panel{padding:.75rem!important}
  body.visual-tuning-active .tuning-meter{height:clamp(8rem,38vw,12rem)!important;min-height:8rem!important}
  body.visual-tuning-active .victoria-readouts{grid-template-columns:1fr!important;gap:.45rem!important}
  body.visual-tuning-active .victoria-display{min-height:0!important}
}
@media(orientation:landscape) and (max-height:620px){
  body.visual-tuning-active .primary-controls{position:static!important;width:auto!important;padding:.75rem!important;background:var(--panel)!important;border:2px solid #70442e!important}
  body.visual-tuning-active .tuning-panel{min-height:0!important;display:block!important;padding:.75rem!important}
  body.visual-tuning-active .tuning-panel > h2{margin:0 0 .5rem!important}
  body.visual-tuning-active .tuning-meter{width:100%!important;height:clamp(7rem,42vh,11rem)!important}
  body.visual-tuning-active .victoria-readouts{width:100%!important;grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
