/* Shared installed-app layer; historical web navigation remains independent. */
:root{--pwa-scale:1;--pwa-bar-height:76px;--pwa-safe-bottom:env(safe-area-inset-bottom,0px);--pwa-safe-top:env(safe-area-inset-top,0px);--pwa-text:#1c1c1e;--pwa-muted:#595d68;--pwa-bg:#f2f2f7;--pwa-surface:#fff;--pwa-border:#e3e4e9;--pwa-accent:#bc0009;--pwa-selected:#fbebed}
:root[data-theme=dark]{color-scheme:dark;--pwa-text:#f2f3f7;--pwa-muted:#bcc2d0;--pwa-bg:#111318;--pwa-surface:#1d2028;--pwa-border:#444956;--pwa-accent:#ff939b;--pwa-selected:#402b34}
html[data-pwa-mode=app] body{padding-bottom:calc(var(--pwa-bar-height) + var(--pwa-safe-bottom) + 36px)!important}
html[data-pwa-mode=app] .nav-home .hero{padding-top:calc(14px + var(--pwa-safe-top))}
html[data-pwa-mode=app] .nav-category header{padding-top:calc(10px + var(--pwa-safe-top))}
html[data-pwa-mode=app] #chat-cantos-btn,html[data-pwa-mode=app] #chat-cantos-box{display:none!important}
html[data-pwa-mode=app]{scroll-padding-bottom:calc(var(--pwa-bar-height) + var(--pwa-safe-bottom) + 32px)}
.pwa-bottom{position:fixed;bottom:calc(12px + var(--pwa-safe-bottom));left:50%;transform:translateX(-50%);width:min(560px,calc(100% - 24px));display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;padding:8px;border:1px solid var(--pwa-border);border-radius:24px;background:var(--pwa-surface);box-shadow:0 6px 28px #15223218;z-index:1000}
.pwa-bottom .pwa-tab{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:56px;min-width:0;padding:7px 2px;border-radius:16px;color:var(--pwa-muted);font:600 calc(12px * var(--pwa-scale))/1.3 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;text-align:center;text-decoration:none;overflow-wrap:anywhere}
.pwa-tab svg{width:22px;height:22px;flex-shrink:0}.pwa-bottom .pwa-tab[aria-current=page]{color:var(--pwa-accent);background:var(--pwa-selected);font-weight:750}.pwa-tab:hover{background:var(--pwa-selected)}
.pwa-tab:focus-visible,.pwa-heart:focus-visible,.setting-option:has(input:focus-visible),.language-setting select:focus-visible{outline:3px solid #125ab6;outline-offset:3px}
[data-theme=dark] :is(a,button,input,select,[tabindex]):focus-visible{outline-color:#91c1ff!important}
.pwa-heart{display:flex;align-items:center;justify-content:center;width:48px;height:48px;flex:0 0 48px;padding:12px;border:1px solid var(--pwa-border);border-radius:13px;background:var(--pwa-surface);color:var(--pwa-muted);cursor:pointer;touch-action:manipulation}
.pwa-heart svg{width:22px;height:22px}.pwa-heart[aria-pressed=true]{color:var(--pwa-accent);background:var(--pwa-selected)}.pwa-heart[aria-pressed=true] svg{fill:currentColor}
.pwa-song-line{display:flex;align-items:center;background:var(--pwa-surface);border-bottom:1px solid var(--pwa-border);padding-right:8px;gap:4px}.pwa-song-line:last-child{border-bottom:0}.nav-home .pwa-song-line .song-row{flex:1;min-width:0;border-bottom:0}.pwa-song-line .song-row::after{display:none}
.pwa-song-tools{display:flex;justify-content:center;margin-top:12px}.pwa-live{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.pwa-storage-warning{padding:14px;background:#fff0ca;color:#503800;font:16px/1.5 sans-serif}
.shell-page{background:var(--pwa-bg);color:var(--pwa-text);font:calc(16px * var(--pwa-scale))/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;margin:0;min-height:100dvh}
.shell-header{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:var(--pwa-surface);border-bottom:3px solid var(--pwa-accent);padding:calc(16px + var(--pwa-safe-top)) max(16px,calc((100vw - 860px)/2)) 16px}
.shell-header img{object-fit:contain;border-radius:4px}.shell-header strong{font-size:calc(18px * var(--pwa-scale));color:var(--pwa-accent)}.prototype-label{font-size:calc(11px * var(--pwa-scale));color:var(--pwa-muted);flex-basis:100%;margin-left:52px}
.shell-main{max-width:860px;margin:24px auto;padding:0 16px}.shell-title{font-size:calc(30px * var(--pwa-scale));letter-spacing:-.035em;margin:0 0 12px;line-height:1.2;overflow-wrap:anywhere}.shell-intro{color:var(--pwa-muted);margin-bottom:24px}
.shell-card,.favorites-list{background:var(--pwa-surface);border:1px solid var(--pwa-border);border-radius:18px;overflow:hidden;margin:20px 0}.shell-card{padding:20px}.shell-card h2{font-size:calc(21px * var(--pwa-scale));line-height:1.3;margin:0 0 18px}.shell-card h3{font-size:calc(18px * var(--pwa-scale))}.shell-card p{color:var(--pwa-muted)}
.favorite-row{display:flex;align-items:center;gap:8px;padding:8px;border-bottom:1px solid var(--pwa-border)}.favorite-row:last-child{border-bottom:0}.favorite-link{display:flex;align-items:center;gap:12px;padding:12px 8px;min-height:56px;min-width:0;flex:1;color:var(--pwa-text);text-decoration:none}.favorite-title{overflow-wrap:anywhere;min-width:0}
.pwa-empty,.assistant-placeholder{text-align:center;padding:32px 20px}.pwa-empty h2{font-size:calc(20px * var(--pwa-scale));line-height:1.4}.pwa-empty p{color:var(--pwa-muted)}.empty-icon,.assistant-icon{display:grid;place-items:center;margin:0 auto 24px;width:72px;height:72px;background:var(--pwa-selected);color:var(--pwa-accent);border-radius:22px}.empty-icon svg,.assistant-icon svg{width:36px;height:36px}
.prototype-note{border-left:3px solid var(--pwa-accent);padding:12px;background:var(--pwa-bg);font-size:calc(14px * var(--pwa-scale));text-align:left}.appearance-field{border:0;padding:0;margin:0 0 20px;min-width:0}.appearance-field legend{font-weight:650;margin-bottom:10px}.setting-options{display:flex;flex-wrap:wrap;gap:8px}.setting-option{display:flex;align-items:center;gap:8px;padding:10px 12px;min-height:48px;border:1px solid var(--pwa-border);border-radius:12px;cursor:pointer}.setting-option:has(input:checked){border-color:var(--pwa-accent);background:var(--pwa-selected);color:var(--pwa-accent)}.setting-option input{width:17px;height:17px;margin:0;accent-color:var(--pwa-accent)}.setting-hint{font-size:calc(13px * var(--pwa-scale))}.language-setting{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;font-weight:600}.language-setting select{min-height:48px;padding:8px 12px;font:inherit;max-width:100%;border:1px solid var(--pwa-border);border-radius:10px;background:var(--pwa-surface);color:var(--pwa-text)}.version-tag{font-size:calc(12px * var(--pwa-scale));font-weight:700;text-transform:uppercase}.shell-back{min-height:44px;display:flex;align-items:center}
/* Real dark palette; score images retain their original paper and colors. */
[data-theme=dark] .navigation-app{--brand:#ff939b;--brand-dark:#ffbcc1;--ink:#f2f3f7;--muted:#bcc2d0;--canvas:#111318;--surface:#1d2028;--line:#444956;--soft:#402b34;color:var(--ink);background:#111318!important}
[data-theme=dark] .nav-home :is(.hero,.song-row,.songs-list,.chip),[data-theme=dark] .nav-category :is(header,.poster,.post-item a,.container_Post>div,#nav,.container-pie a),[data-theme=dark] .navigation-app #resultados-modal,[data-theme=dark] .navigation-app #cerrar-modal{background:#1d2028;color:#f2f3f7;border-color:#444956}
[data-theme=dark] .nav-home .portada-wrap{background:linear-gradient(110deg,#1d2028,#30212b);border-color:#444956}
[data-theme=dark] .navigation-app #buscador::placeholder{color:#bcc2d0}[data-theme=dark] .navigation-app #botonBuscar{background:#bc0009;color:#fff}
[data-theme=dark] .navigation-app.nav-home #filterChips .chip[aria-pressed=true]{background:#402b34;border-color:#ff939b;box-shadow:inset 0 0 0 1px #ff939b;color:#f2f3f7}
[data-theme=dark] .nav-home .song-row:hover,[data-theme=dark] .nav-home .chip:hover{background:#402b34}
[data-theme=dark] .navigation-app.nav-home .home-filter-empty{color:#bcc2d0}
[data-theme=dark] .canto-app{--fondo:#111318;--blanco:#1d2028;--texto:#f2f3f7;--gris:#bcc2d0;--borde:#444956;background:#111318!important;color:#f2f3f7}
[data-theme=dark] .canto-app .marca-txt,[data-theme=dark] .canto-app .tag-link{color:#ff939b}
[data-theme=dark] .canto-app :is(.nav,#nav,#resultados-modal){background:#1d2028;color:#f2f3f7}
[data-theme=dark] .canto-app :is(.nav a,#nav a,#resultados-modal a){color:#f2f3f7}
/* Shared text scale: selectors cover actual navigation, song and shell components. */
html:not([data-font=normal]) .nav-home .song-row,html:not([data-font=normal]) .nav-category .post-item a{font-size:calc(16px * var(--pwa-scale))}
html:not([data-font=normal]) :is(.navigation-app,.canto-app) #buscador{font-size:calc(16px * var(--pwa-scale))}
html:not([data-font=normal]) .nav-home .chip{font-size:calc(13px * var(--pwa-scale))}
html:not([data-font=normal]) .nav-home .chips-row:first-child .chip{font-size:calc(14px * var(--pwa-scale));padding:12px 9px;overflow-wrap:anywhere}
html:not([data-font=normal]) .nav-home .hero-subtitle{font-size:calc(21px * var(--pwa-scale))}
html:not([data-font=normal]) .nav-home :is(.filters-toggle,.songs-toggle){font-size:calc(17px * var(--pwa-scale))}
html:not([data-font=normal]) :is(.nav-category,.canto-app) #nav a{font-size:calc(15px * var(--pwa-scale));white-space:normal}
html:not([data-font=normal]) .canto-app .canto-titulo{font-size:calc(26px * var(--pwa-scale))}
html:not([data-font=normal]) .canto-app .tag-link{font-size:calc(13px * var(--pwa-scale));min-height:44px}
html:not([data-font=normal]) .canto-app :is(.canto-bloque-titulo,.canto-audio-label){font-size:calc(13px * var(--pwa-scale))}
html:not([data-font=normal]) :is(.canto-app,.navigation-app) #botonBuscar{font-size:calc(14px * var(--pwa-scale))}
html:not([data-font=normal]) .nav-home .hero-title{font-size:calc(21px * var(--pwa-scale));overflow-wrap:anywhere}
@media(min-width:768px){html:not([data-font=normal]) .nav-home .hero-subtitle{font-size:calc(38px * var(--pwa-scale))}.shell-main{margin-top:36px}.shell-card{padding:28px}}
@media(prefers-reduced-motion:reduce){.pwa-bottom *,.pwa-heart,.shell-page *{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

[data-theme=dark] .canto-app .canto-head{background:#30212b;color:#f2f3f7}
[data-theme=dark] .canto-app :is(.abrir-menu,.cerrar-menu){color:#ff939b}
html:not([data-font=normal]) .nav-category :is(h1,.page-title){font-size:calc(25px * var(--pwa-scale));overflow-wrap:anywhere}

/* Existing modal navigation takes precedence; its focusable global bar is hidden while open. */
html[data-pwa-mode=app] body:has(.nav.visible) .pwa-bottom{visibility:hidden}
/* UX final: compact icon-only glass navigation, with an opaque default fallback. */
.pwa-bottom{width:min(352px,calc(100% - 32px));padding:7px;gap:5px;border-radius:25px;background:var(--pwa-surface);box-shadow:0 8px 28px #15223220}
.pwa-bottom .pwa-tab{min-height:48px;padding:9px;border-radius:18px;gap:0}
.pwa-tab svg{width:24px;height:24px}.pwa-tab[aria-current=page] svg{stroke-width:2.25}
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
 .pwa-bottom{background:rgba(255,255,255,.9);backdrop-filter:blur(18px) saturate(150%);-webkit-backdrop-filter:blur(18px) saturate(150%)}
 [data-theme=dark] .pwa-bottom{background:rgba(29,32,40,.92);box-shadow:0 8px 28px #0005}
}
html.pwa-no-blur .pwa-bottom{background:var(--pwa-surface);backdrop-filter:none;-webkit-backdrop-filter:none}
html[data-pwa-mode=app] :is(.canto-app,.nav-category) :is(.abrir-menu,.cerrar-menu,#nav){display:none!important}
html[data-pwa-mode=app] .canto-app .buscador-container,html[data-pwa-mode=app] .nav-home .hero-langs{display:none!important}
.pwa-header-actions{display:flex;align-items:center;gap:6px;order:2;margin-left:auto;flex-shrink:0}
.pwa-search-open{display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:12px;background:var(--pwa-bg);color:var(--pwa-text);cursor:pointer}.pwa-search-open svg{width:23px;height:23px}
.pwa-header-actions .pwa-heart{width:44px;height:44px;flex-basis:44px;padding:10px;border:0;background:transparent}
.pwa-header-actions .pwa-heart[aria-pressed=true]{background:var(--pwa-selected)}
html[data-pwa-mode=app] .canto-app header .marca{min-width:0;flex:1;max-width:calc(100% - 106px)}
html[data-pwa-mode=app] .canto-app .marca-txt{font-size:calc(17px * var(--pwa-scale));overflow-wrap:anywhere}
html[data-pwa-mode=app] .canto-app .pwa-search-open:focus-visible, .language-choices button:focus-visible,.sheet-close:focus-visible,.assistant-send:focus-visible,.assistant-retry:focus-visible{outline:3px solid #125ab6;outline-offset:3px}
.language-onboarding{display:grid;place-items:center;padding:calc(36px + env(safe-area-inset-top,0px)) 24px calc(36px + env(safe-area-inset-bottom,0px))!important}
.language-card{width:min(100%,380px);text-align:center;margin:auto}.language-card>img{border-radius:18px;box-shadow:0 8px 30px #15223214;margin-bottom:24px}.language-card h1{font-size:calc(29px * var(--pwa-scale));letter-spacing:-.035em;line-height:1.24;margin:0 0 20px}.language-card>p{font-size:calc(14px * var(--pwa-scale));color:var(--pwa-muted)}
.language-choices{display:grid;gap:12px;margin:28px 0}.language-choices button{display:flex;justify-content:space-between;align-items:center;padding:18px 22px;border:1px solid var(--pwa-border);border-radius:16px;min-height:62px;background:var(--pwa-surface);color:var(--pwa-text);font:600 calc(18px * var(--pwa-scale))/1.3 sans-serif;cursor:pointer}.language-choices button:hover{border-color:var(--pwa-accent)}.language-choices span{color:var(--pwa-accent)}.language-card .language-note{font-size:calc(12px * var(--pwa-scale));line-height:1.8}
.pwa-search-sheet{position:fixed;inset:auto 0 0;margin:0 auto;width:min(100%,640px);max-width:100%;max-height:min(78dvh,calc(var(--sheet-viewport,100dvh) - 16px));padding:20px 20px calc(20px + env(safe-area-inset-bottom,0px));border:1px solid var(--pwa-border);border-radius:24px 24px 0 0;background:var(--pwa-surface);color:var(--pwa-text);overflow:auto;box-shadow:0 -12px 60px #0003;font:calc(16px * var(--pwa-scale))/1.45 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
.pwa-search-sheet::backdrop{background:#10131a80;backdrop-filter:blur(3px)}.sheet-top{display:flex;align-items:center;gap:8px;justify-content:space-between}.sheet-top h2{font-size:calc(20px * var(--pwa-scale));line-height:1.3;margin:0;min-width:0;overflow-wrap:anywhere}.sheet-close{width:44px;height:44px;flex-shrink:0;border:0;border-radius:12px;background:var(--pwa-bg);color:var(--pwa-text);font-size:28px;cursor:pointer}
.sheet-input{width:100%;margin-top:16px;min-height:52px;padding:12px;border:1px solid var(--pwa-border);border-radius:14px;background:var(--pwa-bg);color:var(--pwa-text);font:inherit;min-width:0}.sheet-input:focus-visible{outline:3px solid #125ab6;outline-offset:2px}.sheet-status{color:var(--pwa-muted);font-size:calc(13px * var(--pwa-scale))}.search-group h3{font-size:calc(12px * var(--pwa-scale));letter-spacing:.08em;text-transform:uppercase;color:var(--pwa-muted);margin:22px 0 8px}.sheet-result{display:flex;align-items:center;gap:12px;min-height:52px;padding:12px 4px;text-decoration:none;color:var(--pwa-text);border-bottom:1px solid var(--pwa-border);overflow-wrap:anywhere}.sheet-result span:last-child{min-width:0}.sheet-result:hover{background:var(--pwa-selected)}
.pwa-search-sheet .ux-song-color{width:14px;height:14px;flex:0 0 14px;border-radius:50%;background:white;border:1px solid #bcc2d0}.pwa-search-sheet .ux-color-azul{background:#76b1ee;border-color:#5a9ddd}.pwa-search-sheet .ux-color-verde{background:#bfe2bb;border-color:#7fb179}.pwa-search-sheet .ux-color-amarillo{background:#f5e69b;border-color:#d8bd45}
body:has(.pwa-search-sheet[open]){overflow:hidden}body:has(.pwa-search-sheet[open]) .pwa-bottom{visibility:hidden}
.assistant-heading{font-size:calc(21px * var(--pwa-scale));margin:20px 0}.assistant-help{background:var(--pwa-surface);border:1px solid var(--pwa-border);border-radius:18px;padding:16px}.assistant-help summary{cursor:pointer;font-weight:650;min-height:44px;display:list-item;padding:9px 0}.assistant-greeting{white-space:pre-line;line-height:1.65;font-size:calc(15px * var(--pwa-scale));color:var(--pwa-muted)}
.assistant-messages{display:grid;gap:12px;margin:20px 0}.assistant-message{border:1px solid var(--pwa-border);background:var(--pwa-surface);border-radius:18px;padding:16px;white-space:pre-wrap;overflow-wrap:anywhere}.assistant-message.user{background:var(--pwa-selected);margin-left:24px}.assistant-message a{color:var(--pwa-accent);text-decoration:underline}.assistant-state{color:var(--pwa-muted);font-size:calc(14px * var(--pwa-scale))}.assistant-form{display:grid;gap:10px}.assistant-form label{font-weight:650}.assistant-input{width:100%;min-height:100px;border:1px solid var(--pwa-border);border-radius:14px;padding:14px;background:var(--pwa-surface);color:var(--pwa-text);font:inherit;resize:vertical}.assistant-send,.assistant-retry{min-height:48px;border:0;border-radius:14px;padding:12px 20px;font:600 calc(16px * var(--pwa-scale))/1.3 sans-serif;background:var(--pwa-accent);color:var(--pwa-surface);cursor:pointer}.assistant-send:disabled{opacity:.6;cursor:wait}.assistant-remote{font-size:calc(12px * var(--pwa-scale));color:var(--pwa-muted)}
@media(prefers-reduced-transparency:reduce){.pwa-bottom{background:var(--pwa-surface);backdrop-filter:none;-webkit-backdrop-filter:none}}
.assistant-intro{font-size:calc(15px * var(--pwa-scale));color:var(--pwa-muted);white-space:pre-line;line-height:1.6;margin-bottom:20px}

/* Compact, accessible installed-app controls; native radio semantics retained. */
.pwa-visual-option{position:relative;display:grid;place-items:center;width:56px;min-height:56px;padding:8px;flex:0 0 56px;color:var(--pwa-text)}
.pwa-visual-option input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.pwa-setting-icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.pwa-setting-icon svg{width:26px;height:26px}
.pwa-visual-option:has(input:checked){border-color:var(--pwa-accent);background:var(--pwa-selected);box-shadow:inset 0 0 0 1px var(--pwa-accent)}
.pwa-visual-option:has(input:focus-visible),.pwa-language-option:focus-visible,.pwa-home-link:focus-visible{outline:3px solid var(--pwa-accent);outline-offset:3px}
.pwa-font-sample{font-family:Georgia,serif;line-height:1;font-weight:600}.pwa-font-sample[data-size=small]{font-size:18px}.pwa-font-sample[data-size=normal]{font-size:23px}.pwa-font-sample[data-size=large]{font-size:29px}.pwa-font-sample[data-size=xlarge]{font-size:35px}
.pwa-language-field legend{display:flex;gap:10px;align-items:center}.pwa-language-option{min-width:56px;min-height:48px;padding:10px 14px;border:1px solid var(--pwa-border);border-radius:12px;background:var(--pwa-surface);color:var(--pwa-text);font:650 16px/1.3 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;cursor:pointer}
.pwa-language-option[aria-pressed=true]{border-color:var(--pwa-accent);background:var(--pwa-selected);color:var(--pwa-accent);box-shadow:inset 0 0 0 1px var(--pwa-accent)}
.pwa-home-link{display:grid;place-items:center;width:44px;min-width:44px;height:44px;flex:0 0 44px;border-radius:12px;background:var(--pwa-bg);color:var(--pwa-text);text-decoration:none;order:-1}
.pwa-home-link svg{width:24px;height:24px}.pwa-home-link:hover{background:var(--pwa-selected)}
html[data-pwa-mode=app] .canto-app header:has(.pwa-home-link){column-gap:8px}
html[data-pwa-mode=app] .canto-app header:has(.pwa-home-link) .marca{flex:1 1 0;max-width:none;min-width:0}

/* Issue reporting uses the existing shell palette and text scale. */
.report-details summary{font-size:calc(20px * var(--pwa-scale));font-weight:650;min-height:44px;padding:10px 0;cursor:pointer;overflow-wrap:anywhere}
.report-form{display:grid;gap:10px;min-width:0;margin-top:16px}
.report-form label{font-weight:600}
.report-form :is(select,textarea){box-sizing:border-box;width:100%;max-width:100%;min-width:0;min-height:48px;padding:12px;border:1px solid var(--pwa-border);border-radius:12px;background:var(--pwa-bg);color:var(--pwa-text);font:inherit}
.report-form textarea{resize:vertical;line-height:1.5;scroll-margin-block:100px}
.report-page-hint{overflow-wrap:anywhere;color:var(--pwa-muted);font-size:calc(13px * var(--pwa-scale));margin:0}
.report-send{min-height:48px;border:0;border-radius:12px;padding:12px 18px;background:var(--pwa-accent);color:var(--pwa-surface);font:600 calc(16px * var(--pwa-scale))/1.4 sans-serif;cursor:pointer;scroll-margin-bottom:calc(var(--pwa-bar-height,80px) + 24px)}
.report-send:disabled{opacity:.65;cursor:wait}
.report-status{min-height:1.5em;margin:0;overflow-wrap:anywhere;scroll-margin-bottom:calc(var(--pwa-bar-height,80px) + 24px)}
.report-card :is(summary,select,textarea,button):focus-visible{outline:3px solid var(--pwa-accent);outline-offset:3px}
.report-form [aria-invalid=true]{border-color:var(--pwa-accent);box-shadow:0 0 0 1px var(--pwa-accent)}