/* Herramientas y hoja de ajustes, con los materiales del rosario. */
.boton-herramienta { display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; min-height:44px; flex:0 0 44px; padding:10px; color:#e2c887; border:1px solid #b99b5a80; border-radius:8px; background:linear-gradient(180deg,#183340,#10232e); box-shadow:inset 0 1px 0 #eed99e12,0 2px 5px #0002; }
.boton-herramienta:hover { border-color:#dec27e; background:#244454; }
.boton-herramienta[aria-pressed="true"] { border-color:#f0d69d; color:#fff0bf; background:#29424b; }
.boton-herramienta svg { width:22px; height:22px; }
.ajustes-inicio { position:absolute; top:24px; right:80px; z-index:5; }
.cabecera { grid-template-columns:minmax(72px,1fr) minmax(120px,2.6fr) auto; }
.acciones-cabecera { gap:7px; }
#ajustes-rosario { width:min(520px,calc(100vw - 28px)); max-height:calc(100dvh - 32px); padding:24px 26px 18px; overflow:hidden; border:1px solid #c9a967; border-radius:17px; background:linear-gradient(#fffaf21c,#fffaf21c),url('../assets/interfaz/fondo-hoja-marfil.webp') center / 100% 100% no-repeat,#f8f0dd; color:#403626; color-scheme:light; box-shadow:0 24px 90px #0009,inset 0 0 0 5px #dfc68c66; font-size:16px; line-height:1.45; }
#ajustes-rosario[open] { display:flex; flex-direction:column; }
#ajustes-rosario::backdrop { background:#06141ecc; backdrop-filter:blur(6px); }
body.ajustes-abiertos { overflow:hidden; }
#guardado-aviso { position:fixed; z-index:30; bottom:12px; left:50%; transform:translateX(-50%); width:max-content; max-width:calc(100% - 24px); padding:10px 15px; border:1px solid #c9ae76; border-radius:9px; background:#172d38f5; color:#f2e1bc; font-size:12px; line-height:1.5; text-align:center; box-shadow:0 3px 18px #0005; }
.ajustes-encabezado { display:flex; flex:0 0 auto; align-items:center; justify-content:space-between; gap:12px; margin-bottom:16px; }
#ajustes-titulo { margin:0; font:normal 29px/1.2 Georgia,serif; color:#4b351d; }
.ajustes-cerrar { width:44px; height:44px; flex:0 0 44px; padding:0; border:1px solid #b69a6760; border-radius:50%; background:#fff8e688; color:#5d4b30; font-size:27px; }
.ajustes-cuerpo { flex:1 1 auto; min-height:0; overflow-x:hidden; overflow-y:auto; overscroll-behavior:contain; scrollbar-gutter:stable; scrollbar-width:thin; scrollbar-color:#967234 #e8dabd; padding:0 9px 0 2px; }
#ajustes-rosario fieldset { min-width:0; padding:12px 0 16px; margin:0; border:0; border-top:1px solid #bfa37470; }
#ajustes-rosario legend { padding:0 12px 0 0; color:#4b351d; font-family:Georgia,serif; font-size:22px; }
.ajuste-volumen { display:flex; justify-content:space-between; gap:12px; font-size:16px; font-weight:500; }
.ajuste-volumen output { color:#63471f; font-variant-numeric:tabular-nums; }
#ajustes-rosario input[type="range"] { display:block; width:100%; height:36px; margin:0 0 9px; accent-color:#896525; cursor:pointer; }
#ajustes-rosario input[type="range"]:last-child { margin-bottom:0; }
.ajuste-selector { display:flex; flex-direction:column; gap:6px; font-size:16px; font-weight:500; margin:0 0 14px; }
.ajuste-selector:last-child { margin-bottom:0; }
.ajuste-selector select { width:100%; min-width:0; min-height:46px; padding:9px 11px; color:#403626; border:1px solid #ba9b62; border-radius:8px; background:#fffaf0d9; font:inherit; font-weight:400; }
#ajustes-rosario .ajuste-casilla { font-size:16px; font-weight:500; }
.ajustes-nota { color:#5d4d36; font-size:15px; line-height:1.5; margin:0 0 14px; }
.ajustes-nota:last-child { margin-bottom:0; }
.ajustes-desplegable { border-top:1px solid #bfa37470; }
.ajustes-desplegable summary { display:flex; align-items:center; gap:10px; min-height:52px; padding:10px 3px; color:#4b351d; font:normal 20px/1.3 Georgia,serif; list-style:none; cursor:pointer; }
.ajustes-desplegable summary::-webkit-details-marker { display:none; }
.ajustes-desplegable summary > span:first-child { flex:1 1 auto; min-width:0; }
.ajustes-desplegable summary::after { content:""; flex:0 0 7px; width:7px; height:7px; margin:0 4px 4px; border-right:1.5px solid #84601e; border-bottom:1.5px solid #84601e; transform:rotate(45deg); transition:transform 160ms ease; }
.ajustes-desplegable[open] summary::after { transform:rotate(225deg); margin-top:5px; }
.ajustes-resumen { flex:0 1 auto; max-width:38%; color:#765a2c; font:14px/1.35 system-ui,sans-serif; font-variant-numeric:tabular-nums; text-align:right; }
.ajustes-desplegable-cuerpo { padding:3px 3px 16px; }
.ajustes-desplegable-cuerpo .ajuste-selector { margin-bottom:8px; }
.ajustes-desplegable-cuerpo .ajustes-nota { margin-bottom:8px; }
.ajustes-descanso-estado { margin:0; color:#63471f; font-size:15px; line-height:1.45; font-variant-numeric:tabular-nums; }
.ajustes-pasos { margin:0 0 14px; padding-left:23px; color:#5d4d36; font-size:15px; line-height:1.5; }
.ajustes-pasos li + li { margin-top:6px; }
.ajustes-pasos li::marker { color:#765a2c; font-weight:600; }
.ajustes-modos { margin:0; color:#5d4d36; font-size:15px; line-height:1.5; }
.ajustes-modos > div + div { margin-top:7px; }
.ajustes-modos dt { display:inline; color:#4b351d; font-weight:600; }
.ajustes-modos dd { display:inline; margin:0; }
.ajustes-final { flex:0 0 auto; margin-top:8px; padding-top:12px; border-top:1px solid #bfa37470; }
.ajustes-pie { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.ajustes-restablecer { min-height:44px; padding:8px 0; border:0; background:none; color:#5d4829; font-size:15px; text-decoration:underline; text-underline-offset:3px; }
#ajustes-rosario .ajustes-listo { flex:0 1 156px; width:156px; min-width:132px; min-height:52px; padding:10px 28px; border:0; border-radius:12px; background:transparent url('../assets/interfaz/ajustes-listo-dorado.webp') center / 100% 100% no-repeat; color:#3d2c15; font:normal 21px/1.2 Georgia,serif; text-shadow:0 1px 0 #fff0c48c; box-shadow:none; filter:drop-shadow(0 2px 3px #65420f25); transition:filter 160ms ease,transform 160ms ease; }
#ajustes-rosario .ajustes-listo:hover { filter:brightness(1.06) drop-shadow(0 3px 4px #65420f35); }
.ajustes-guardado { margin-top:8px; color:#5d4d36; font-size:15px; text-align:center; line-height:1.5; }
#ajustes-rosario :focus-visible { outline:2px solid #84601e; outline-offset:3px; }

body[data-movimiento="quieto"] *,body[data-movimiento="quieto"] *::before,body[data-movimiento="quieto"] *::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
@media(max-width:900px) {
  .cabecera { grid-template-columns:80px minmax(0,1fr); }
  .acciones-cabecera { grid-column:1 / -1; justify-content:center; }
  .titulo-escena { text-align:right; }
}
@media(max-width:600px) {
  .ajustes-inicio { top:14px; right:69px; }
  .cabecera { grid-template-columns:60px minmax(0,1fr); padding:10px 14px; }
  .titulo-escena { grid-column:2; grid-row:1; text-align:right; }
  .cabecera #volver-inicio { grid-column:1; grid-row:1; }
  .acciones-cabecera { grid-column:1 / -1; grid-row:2; gap:13px; }
  .acciones-cabecera .boton-sonido { flex:0 0 44px; width:44px; height:44px; }
  #ajustes-rosario { padding:18px 18px 14px; }
  #ajustes-titulo { font-size:27px; }
  .ajustes-cuerpo { padding-right:7px; }
}