@font-face{font-family:Archivo;src:url('fuentes/archivo-var.woff2') format('woff2-variations');font-weight:100 900;font-display:swap}@font-face{font-family:'Plex Mono';src:url('fuentes/plexmono-500.woff2') format('woff2');font-weight:500;font-display:swap}@font-face{font-family:'Plex Mono';src:url('fuentes/plexmono-600.woff2') format('woff2');font-weight:600;font-display:swap}
:root{--fondo:#f2f6f1;--superficie:#fff;--suave:#e5efe8;--alto:#d7e6dd;--tinta:#17352f;--media:#49665e;--tenue:#5f736c;--linea:#c5d6cc;--linea-fuerte:#9db5a8;--hoja:#176b50;--hoja-honda:#0d513c;--hoja-clara:#dcefe6;--azafran:#d99000;--azafran-claro:#fff0c7;--tomate:#b83e32;--tomate-claro:#fde5e1;--ciruela:#725280;--ciruela-claro:#efe7f2;--frasco:#5d8f64;--ui:Archivo,system-ui,-apple-system,'Segoe UI',sans-serif;--dato:'Plex Mono',ui-monospace,monospace;--icono-voz:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Crect x='9' y='2' width='6' height='11' rx='3'/%3E%3Cpath d='M5 11a7 7 0 0 0 14 0M12 18v4'/%3E%3C/svg%3E");--icono-qr:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M3 8V5.5A2.5 2.5 0 0 1 5.5 3H8M16 3h2.5A2.5 2.5 0 0 1 21 5.5V8M21 16v2.5a2.5 2.5 0 0 1-2.5 2.5H16M8 21H5.5A2.5 2.5 0 0 1 3 18.5V16M7 12h10'/%3E%3C/svg%3E");--sobre-hoja:#fff;--marcador:#657771;--codigo:#986500;--borde-dudoso:#c9a227;--campo:#fbfcfb;--barra:rgba(255,255,255,.96);--cabecera:rgba(242,246,241,.94);--cabecera-alt:rgba(248,250,247,.94);--velo:rgba(255,255,255,.72);--fondo-app:#edf3ef;--acceso-a:#e4eee8;--acceso-b:#f5f7f3;--acceso-c:#edf2ed;--toast-fondo:#17352f;--toast-texto:#fff;--texto-falta:#8f2d25;--texto-vence:#664473;--texto-admin:#795000;--texto-error:#7f2821;--borde-error:#e9aaa4;--borde-ok:#a9ceba;--texto-offline:#5f3e6c;--matiz-importe:#806b3b;--borde-importe:#ebce83;--barra-alto:70px;--margen:18px;--radio:14px}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html{color-scheme:light;scroll-behavior:smooth}html,body{margin:0;min-height:100%;background:var(--fondo);color:var(--tinta);font-family:var(--ui);font-size:16px;-webkit-font-smoothing:antialiased}body{min-height:100vh;padding-bottom:calc(var(--barra-alto) + 18px + env(safe-area-inset-bottom,0px));background-image:radial-gradient(circle at 15% 0,rgba(23,107,80,.08),transparent 30rem)}button,input,select,textarea{font:inherit}button,a,summary{touch-action:manipulation}[hidden]{display:none!important}
header.superior{position:sticky;top:0;z-index:10;padding:calc(17px + env(safe-area-inset-top,0px)) var(--margen) 15px;background:var(--cabecera);border-bottom:1px solid var(--linea);backdrop-filter:blur(14px)}header.superior h1{margin:0;font-size:clamp(1.35rem,5vw,1.65rem);font-weight:780;letter-spacing:-.035em;line-height:1.05}.marca-contexto{margin:7px 0 0;color:var(--media);font-family:var(--dato);font-size:.7rem}.rotulo{font-family:var(--dato);font-size:.67rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--media)}.volver{display:inline-flex;align-items:center;min-height:44px;margin-bottom:8px;color:var(--hoja);font-size:.78rem;font-weight:700;text-decoration:none}.volver::before{content:'←';margin-right:7px}
main{padding:16px 0 28px}.buscador{display:block;width:calc(100% - var(--margen)*2);margin:0 var(--margen) 12px;padding:13px 15px 13px 43px;color:var(--tinta);background:var(--superficie) no-repeat 15px center/18px;border:1px solid var(--linea);border-radius:12px;box-shadow:0 3px 14px rgba(23,53,47,.04);font-size:1rem;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%2349665e'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-4-4'/%3E%3C/svg%3E")}.buscador::placeholder,input::placeholder,textarea::placeholder{color:var(--marcador)}
.chips{display:flex;gap:7px;margin:0 var(--margen) 14px;padding:4px;background:var(--suave);border:1px solid var(--linea);border-radius:12px;overflow-x:auto;scrollbar-width:none}.chips::-webkit-scrollbar{display:none}.chip{flex:1;min-width:max-content;min-height:44px;padding:8px 13px;border:0;border-radius:9px;background:transparent;color:var(--media);font-size:.76rem;font-weight:720;white-space:nowrap;cursor:pointer}.chip[aria-pressed=true]{background:var(--superficie);color:var(--hoja-honda);box-shadow:0 2px 8px rgba(23,53,47,.09)}
ul.lista{list-style:none;margin:0;padding:0 var(--margen)}.fila{position:relative;display:flex;align-items:center;gap:12px;margin-bottom:8px;padding:13px 12px;background:var(--superficie);border:1px solid var(--linea);border-radius:13px;box-shadow:0 3px 12px rgba(23,53,47,.04)}.fila .datos{flex:1;min-width:0}.fila .nombre,a.nombre{display:block;overflow:hidden;color:var(--tinta);font-size:.98rem;font-weight:720;text-decoration:none;text-overflow:ellipsis;white-space:nowrap}.fila .detalle{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin-top:5px;color:var(--tenue);font-family:var(--dato);font-size:.67rem}.nivel{position:relative;flex:none;width:10px;height:48px;overflow:hidden;background:var(--alto);border:1px solid var(--linea-fuerte);border-radius:6px}.nivel::after{content:'';position:absolute;inset:auto 0 0;height:var(--llenado,0%);background:var(--frasco);border-radius:0 0 5px 5px;transition:height .35s cubic-bezier(.22,1,.36,1)}.nivel::before{content:'';position:absolute;z-index:1;right:-2px;bottom:50%;left:-2px;height:1px;background:var(--tinta);opacity:.42}.nivel.bajo::after{background:var(--tomate)}.nivel.sin-minimo::after{background:var(--tenue);opacity:.45}.nivel.sin-minimo::before,.nivel.receta::before{display:none}.nivel.receta::after{background:var(--azafran)}.nivel.receta.llena::after{background:var(--frasco)}.stock{flex:none;min-width:2.5ch;color:var(--tinta);font-family:var(--dato);font-size:1.35rem;font-weight:600;font-variant-numeric:tabular-nums;text-align:right}.stock.falta{color:var(--tomate)}.ajuste{display:flex;gap:5px;flex:none}.ajuste button{display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid var(--linea);border-radius:11px;background:var(--fondo);color:var(--hoja-honda);font-size:1.2rem;font-weight:700;cursor:pointer}.ajuste button:active{background:var(--hoja);color:var(--sobre-hoja)}.ajuste button:disabled{opacity:.38}.ajuste button svg{display:block;margin:auto}
.etiqueta-falta,.etiqueta-vence,.etiqueta-lista,.etiqueta-admin,.origen{display:inline-flex;align-items:center;min-height:22px;padding:3px 7px;border-radius:6px;font-size:.59rem;font-weight:750;letter-spacing:.07em;text-transform:uppercase}.etiqueta-falta,.origen-falta{background:var(--tomate-claro);color:var(--texto-falta)}.etiqueta-vence{background:var(--ciruela-claro);color:var(--texto-vence)}.etiqueta-lista,.origen-ok{background:var(--hoja-clara);color:var(--hoja-honda)}.etiqueta-admin,.origen-duda{background:var(--azafran-claro);color:var(--texto-admin)}
nav.inferior{position:fixed;z-index:20;right:0;bottom:0;left:0;display:flex;gap:3px;padding:7px 8px calc(7px + env(safe-area-inset-bottom,0px));background:var(--barra);border-top:1px solid var(--linea);box-shadow:0 -8px 28px rgba(23,53,47,.09);backdrop-filter:blur(14px)}nav.inferior a{display:flex;flex:1;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:52px;padding:5px 2px;border-radius:11px;color:var(--tenue);font-size:.57rem;font-weight:720;text-decoration:none;text-transform:uppercase}nav.inferior a svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}nav.inferior a[aria-current=page]{background:var(--hoja-clara);color:var(--hoja-honda)}nav.inferior a.central{margin-top:-17px;min-height:61px;background:var(--hoja);border:4px solid var(--fondo);color:var(--sobre-hoja);box-shadow:0 6px 16px rgba(13,81,60,.25)}
.tarjeta{margin:0 var(--margen) 12px;padding:18px;background:var(--superficie);border:1px solid var(--linea);border-radius:var(--radio);box-shadow:0 4px 18px rgba(23,53,47,.055)}.tarjeta h2{margin:0 0 12px;font-size:1rem;font-weight:760}label{display:block;margin:15px 0 6px;color:var(--media);font-size:.71rem;font-weight:740;letter-spacing:.055em;text-transform:uppercase}input[type=text],input[type=email],input[type=password],input[type=url],input[type=number],input[type=date],select,textarea{width:100%;min-height:46px;padding:11px 13px;background:var(--campo);border:1px solid var(--linea-fuerte);border-radius:10px;color:var(--tinta);font-size:1rem}input[type=number],input[type=date]{font-family:var(--dato)}textarea{min-height:104px;margin-top:8px;font-family:var(--dato);font-size:.83rem;line-height:1.55;resize:vertical}button.principal{width:100%;min-height:48px;margin-top:20px;padding:12px 16px;border:1px solid var(--hoja);border-radius:11px;background:var(--hoja);color:var(--sobre-hoja);font-size:.83rem;font-weight:780;cursor:pointer;box-shadow:0 6px 14px rgba(13,81,60,.18)}button.principal:hover{background:var(--hoja-honda)}button.principal:disabled{opacity:.5}button.enlace{min-height:44px;padding:7px 0;border:0;background:none;color:var(--hoja);font-size:.72rem;font-weight:750;cursor:pointer}
.aviso{margin:0 var(--margen) 12px;padding:12px 14px;border:1px solid;border-radius:11px;font-size:.86rem;line-height:1.5;white-space:pre-line}.aviso.error{background:var(--tomate-claro);border-color:var(--borde-error);color:var(--texto-error)}.aviso.ok{background:var(--hoja-clara);border-color:var(--borde-ok);color:var(--hoja-honda)}.vacio{margin:12px var(--margen);padding:38px 22px;background:var(--superficie);border:1px dashed var(--linea-fuerte);border-radius:var(--radio);color:var(--media);font-size:.9rem;line-height:1.6;text-align:center}.vacio strong{display:block;color:var(--tinta);font-size:1.05rem}.banda-offline{padding:9px var(--margen);background:var(--ciruela-claro);color:var(--texto-offline);font-size:.77rem}.frescura{display:flex;align-items:center;gap:7px;margin-top:7px;color:var(--media);font-family:var(--dato);font-size:.68rem}.punto{width:8px;height:8px;border-radius:50%;background:var(--frasco);box-shadow:0 0 0 3px var(--hoja-clara)}.frescura.tibia .punto{background:var(--ciruela)}.frescura.subiendo{color:var(--hoja)}.frescura.subiendo .punto{background:var(--hoja);animation:latido 1.1s ease-in-out infinite}@keyframes latido{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.72)}}.frescura.vieja{color:var(--tomate)}.frescura.vieja .punto{background:var(--tomate)}.pendientes{margin-left:auto;padding:3px 7px;border-radius:6px;background:var(--azafran-claro);color:var(--texto-admin)}.enlace-bloque{display:block;margin:0 var(--margen) 10px;padding:11px 13px;background:var(--azafran-claro);border-radius:10px;color:var(--texto-admin);font-size:.76rem;font-weight:750;text-decoration:none}
.lista-esqueleto{display:block}.fila-esqueleto{height:76px;margin:0 var(--margen) 8px;border-radius:13px;background:linear-gradient(90deg,var(--suave) 20%,var(--superficie) 50%,var(--suave) 80%);background-size:200% 100%;animation:brillo 1.35s ease-in-out infinite}@keyframes brillo{from{background-position:200% 0}to{background-position:-200% 0}}#toast{position:fixed;z-index:50;bottom:calc(var(--barra-alto) + 20px);left:50%;max-width:88vw;padding:11px 16px;transform:translate(-50%,14px);border-left:4px solid var(--hoja);border-radius:11px;background:var(--toast-fondo);color:var(--toast-texto);opacity:0;pointer-events:none;transition:.18s}#toast.visible{transform:translate(-50%,0);opacity:1}
body:has(.acceso-shell){padding-bottom:0;background:linear-gradient(145deg,var(--acceso-a) 0,var(--acceso-b) 48%,var(--acceso-c) 100%)}body:has(.acceso-shell) header.superior{position:relative;background:transparent;border:0}.acceso-shell{display:grid;gap:18px;max-width:1080px;margin:auto;padding:10px var(--margen) 34px}.acceso-intro{padding:8px 4px 2px}.sobrelinea{margin:0 0 10px;color:var(--hoja);font-size:.69rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.acceso-intro h2{margin:0;max-width:12ch;font-size:clamp(2.1rem,10vw,4.5rem);font-weight:820;letter-spacing:-.055em;line-height:.96}.acceso-intro>p:not(.sobrelinea){max-width:42rem;margin:16px 0;color:var(--media);line-height:1.55}.beneficios{display:grid;gap:8px;margin:18px 0 0;padding:0;list-style:none;color:var(--media);font-size:.86rem}.beneficios span{display:inline-grid;place-items:center;width:21px;height:21px;margin-right:7px;border-radius:50%;background:var(--hoja-clara);color:var(--hoja);font-weight:900}.acceso-panel{min-width:0}.acceso-modos{display:grid;grid-template-columns:1fr 1fr;margin:0 0 10px}.acceso-formulario{margin:0;padding:20px}.servidor-ajuste{margin-top:10px;border-top:1px solid var(--linea)}.servidor-ajuste summary{min-height:44px;padding:13px 3px;color:var(--media);font-size:.78rem;font-weight:700;cursor:pointer}.servidor-contenido{padding:0 3px 10px}.ayuda,.ayuda-campo,.nota{color:var(--tenue);font-size:.78rem;line-height:1.55}.ayuda-campo{margin:8px 0 0}.nota{margin:20px var(--margen)}
.estimacion{display:flex;align-items:baseline;flex-wrap:wrap;gap:9px;margin:0 var(--margen) 12px;padding:14px 16px;background:var(--azafran-claro);border:1px solid var(--borde-importe);border-radius:12px}.estimacion strong,.precio-fila{color:var(--texto-admin);font-family:var(--dato);font-weight:600}.estimacion strong{font-size:1.45rem}.estimacion .matiz{margin-left:auto;color:var(--matiz-importe);font-family:var(--dato);font-size:.67rem}.estimacion.vacia{background:var(--superficie);border-color:var(--linea);color:var(--media)}.precio-fila{min-width:7ch;text-align:right}.precio-fila.vacio{color:var(--tenue)}.linea.pendiente{border-left:4px solid var(--tomate)}.linea-cruda{color:var(--media);font-family:var(--dato);font-size:.76rem;word-break:break-word}.elegido,.candidatos{display:flex;gap:9px;margin-top:11px;padding-top:11px;border-top:1px solid var(--linea)}.elegido{align-items:center}.elegido span{flex:1;font-weight:700}.candidatos{flex-direction:column}.candidato{min-height:44px;padding:10px 12px;border:1px solid var(--linea);border-radius:10px;background:var(--fondo);color:var(--tinta);text-align:left}.candidato.buscar{color:var(--hoja);font-weight:700}.campos-linea{display:grid;grid-template-columns:1fr 1.35fr;gap:10px}.quitar,.apartado-motivo{color:var(--tomate)}.receta-fila .stock{font-size:1.08rem;color:var(--media)}.receta-fila .stock.completa{color:var(--hoja)}.apartado{padding:11px 0;border-top:1px solid var(--linea)}.apartado:first-child{border-top:0}.apartado-dato{display:flex;gap:8px;color:var(--media);font-family:var(--dato);font-size:.77rem}.apartado-dato .cuando{margin-left:auto}.dudoso{display:inline-flex;align-items:center;gap:5px;margin-left:6px;padding:2px 7px;border:1px solid var(--borde-dudoso);border-radius:6px;background:var(--azafran-claro);color:var(--texto-admin);font-size:.62rem;font-weight:750;letter-spacing:.04em;text-transform:uppercase}.dudoso svg{flex:none}.campo-dudoso input,.campo-dudoso select{border-color:var(--borde-dudoso);box-shadow:0 0 0 3px var(--azafran-claro)}.fila-anadir{display:flex;gap:10px;align-items:stretch}.fila-anadir .principal{flex:1}.dictar{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;flex:none;min-width:76px;min-height:48px;margin-top:20px;padding:8px 12px;border:1px solid var(--linea-fuerte);border-radius:11px;background:var(--superficie);color:var(--hoja-honda);font-size:.62rem;font-weight:750;letter-spacing:.04em;text-transform:uppercase;cursor:pointer}.dictar:disabled{opacity:.55}.dictar-icono{width:17px;height:17px;background:currentColor;-webkit-mask:var(--icono-voz) center/contain no-repeat;mask:var(--icono-voz) center/contain no-repeat}.dictar.escuchando{border-color:var(--hoja);background:var(--hoja-clara)}.dictar.escuchando .dictar-icono{animation:latido 1.1s ease-in-out infinite}.escanear-qr{display:inline-flex;align-items:center;gap:7px;margin-top:10px}.escanear-qr::before{content:'';width:17px;height:17px;flex:none;background:currentColor;-webkit-mask:var(--icono-qr) center/contain no-repeat;mask:var(--icono-qr) center/contain no-repeat}.ayuda-ok{color:var(--hoja-honda);font-weight:600}.ayuda-error{color:var(--texto-error);font-weight:600}.anadir-articulo label{margin-top:0}.articulo .marcar{display:grid;place-items:center;flex:none;width:44px;height:44px;padding:0;border:2px solid var(--linea-fuerte);border-radius:50%;background:var(--superficie);color:var(--sobre-hoja);cursor:pointer}.articulo .marcar[aria-pressed=true]{background:var(--hoja);border-color:var(--hoja)}.articulo.comprado .nombre{color:var(--tenue);text-decoration:line-through}.articulo .quitar{display:grid;place-items:center;flex:none;width:44px;height:44px;padding:0;border:0;background:none;color:var(--tomate);cursor:pointer}.cambio{display:flex;flex:none;flex-direction:column;align-items:flex-end;gap:3px;min-width:5.5ch}.cambio .delta{font-family:var(--dato);font-size:1.15rem;font-weight:600;font-variant-numeric:tabular-nums}.saldo{color:var(--tenue);font-family:var(--dato);font-size:.66rem;white-space:nowrap}.saldo strong{color:var(--tinta);font-weight:600}.delta.suma{color:var(--hoja)}.delta.resta{color:var(--tomate)}.apartado-acciones,.miembro-acciones{display:flex;gap:14px}.miembro{display:flex;align-items:center;gap:8px;padding:10px 0;border-top:1px solid var(--linea)}.miembro-nombre{font-weight:700}.miembro-acciones{margin-left:auto}.invitacion{margin-top:14px;padding:16px;background:var(--fondo);border:1px solid var(--linea);border-radius:12px;text-align:center}.invitacion-qr{margin:10px auto 12px;max-width:190px}.qr{display:block;width:100%;height:auto;border:1px solid var(--linea);border-radius:8px}.codigo-familia{margin:0;color:var(--codigo);font-family:var(--dato);font-size:1.5rem;font-weight:600;letter-spacing:.22em}.invitacion .ayuda{margin-top:8px}.pin-grande{color:var(--hoja);font-family:var(--dato);font-size:2.1rem;font-weight:600;letter-spacing:.24em;text-align:center}
:focus-visible{outline:3px solid var(--azafran);outline-offset:3px;border-radius:6px}:focus{scroll-margin-top:88px;scroll-margin-bottom:calc(var(--barra-alto) + 18px)}[aria-invalid=true]{border-color:var(--tomate)!important;box-shadow:0 0 0 3px var(--tomate-claro)}.saltar-contenido{position:fixed;z-index:100;top:8px;left:50%;display:inline-flex;align-items:center;min-height:44px;padding:10px 16px;transform:translate(-50%,-160%);border-radius:9px;background:var(--toast-fondo);color:var(--toast-texto);font-weight:700;text-decoration:none}.saltar-contenido:focus{transform:translate(-50%,0)}.visualmente-oculto{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;border:0;clip:rect(0 0 0 0);white-space:nowrap}
@media(min-width:760px){:root{--margen:28px}header.superior,main,#banda{width:min(100%,820px);margin-inline:auto}header.superior{padding-inline:32px}main{min-height:calc(100vh - 90px);padding-block:22px 48px}.fila{padding:15px 16px}nav.inferior{right:auto;left:50%;width:min(100%,820px);transform:translateX(-50%);border-inline:1px solid var(--linea)}.tarjeta{padding:23px}.acceso-shell{grid-template-columns:minmax(0,1fr) minmax(360px,460px);align-items:center;min-height:calc(100vh - 100px);padding:26px 36px 60px}.acceso-intro{padding-right:30px}}
@media(min-width:1050px){.acceso-modos{grid-template-columns:repeat(4,1fr)}.acceso-modos .chip{padding-inline:8px;font-size:.7rem}}@media(max-width:390px){.fila{gap:9px;padding-inline:10px}.ajuste button{width:44px}.stock{font-size:1.18rem}.campos-linea{grid-template-columns:1fr}nav.inferior a{font-size:.51rem}.acceso-intro h2{font-size:2.2rem}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media(forced-colors:active){.nivel,.fila,.tarjeta,.chips{border:1px solid CanvasText}.nivel::after{background:Highlight}}

/* El aviso ocupa la fila completa; vacío no debe alterar la cuadrícula. */
.acceso-shell{width:100%}.acceso-shell>#aviso{grid-column:1/-1}.acceso-shell>#aviso:empty{display:none}.acceso-intro h2{max-width:16ch;font-size:clamp(2.1rem,8vw,3.9rem)}

/* Segunda pasada: una interfaz inspirada en etiquetas y estantes de despensa. */
:root{--tinta-tenue:var(--tenue);--rocoto:var(--tomate);--aji:var(--azafran);--sombra:0 8px 28px rgba(23,53,47,.07)}
body:not(:has(.acceso-shell)){background-color:var(--fondo-app);background-image:linear-gradient(rgba(23,107,80,.035) 1px,transparent 1px),radial-gradient(circle at 8% 0,rgba(217,144,0,.08),transparent 25rem);background-size:100% 72px,auto}
body:not(:has(.acceso-shell)) header.superior{overflow:hidden;padding-bottom:17px;background:var(--cabecera-alt);box-shadow:0 8px 30px rgba(23,53,47,.045)}
body:not(:has(.acceso-shell)) header.superior::after{content:'';position:absolute;right:0;bottom:0;left:0;height:4px;background:linear-gradient(90deg,var(--hoja) 0 18%,var(--azafran) 18% 24%,var(--linea) 24% 100%)}
.pagina-sobrelinea{margin:0 0 5px;color:var(--hoja);font-family:var(--dato);font-size:.6rem;font-weight:600;letter-spacing:.13em;text-transform:uppercase}
.pagina-contexto{max-width:56ch;margin:7px 0 0;color:var(--media);font-size:.76rem;line-height:1.42}
header.superior .rotulo{margin-top:9px!important}
.tarjeta{position:relative;overflow:hidden;box-shadow:var(--sombra)}
button.enlace{min-width:24px}
.tarjeta::before{content:'';position:absolute;top:0;right:0;left:0;height:3px;background:linear-gradient(90deg,var(--hoja) 0 42px,var(--azafran) 42px 54px,var(--linea) 54px 100%)}
.tarjeta h2{display:flex;align-items:center;gap:8px;font-size:1.04rem;letter-spacing:-.015em}
.tarjeta h2::before{content:'';width:7px;height:7px;border:2px solid var(--azafran);border-radius:50%}
.fila{border-left:3px solid var(--hoja-clara);transition:border-color .18s,transform .18s,box-shadow .18s}
.fila:focus-within,.fila:hover{border-left-color:var(--hoja);box-shadow:var(--sombra);transform:translateY(-1px)}
.volver::before{content:'←';margin-right:7px}
.contenido-secundario{color:var(--tenue);font-size:.86rem;line-height:1.55}
.ayuda-inicio{margin:0 0 6px}
.margen-corto{margin-top:12px!important}
.accion-peligro{background:transparent!important;border-color:var(--tomate)!important;color:var(--tomate)!important;box-shadow:none!important}
.accion-peligro:hover{background:var(--tomate-claro)!important}
a.principal{display:flex;align-items:center;justify-content:center;width:100%;min-height:48px;margin-top:20px;padding:12px 16px;border:1px solid var(--hoja);border-radius:11px;background:var(--hoja);color:var(--sobre-hoja);font-size:.83rem;font-weight:780;text-decoration:none;box-shadow:0 6px 14px rgba(13,81,60,.18)}
a.principal:hover{background:var(--hoja-honda)}
.accion-bloque{text-align:center}
.rotulo-separado{margin-top:9px}
.enlace-centro{display:block;margin:10px auto 0}
.entrada-codigo{text-transform:uppercase;letter-spacing:.18em;font-size:1.15rem!important}
.entrada-pin{font-family:var(--dato);font-size:1.3rem!important;letter-spacing:.4em;text-align:center}
.buscador{box-shadow:var(--sombra)}
.estimacion{position:relative;overflow:hidden;padding-left:20px;box-shadow:0 7px 22px rgba(121,80,0,.08)}
.estimacion::before{content:'';position:absolute;top:0;bottom:0;left:0;width:5px;background:var(--azafran)}
.vacio{background:var(--velo);box-shadow:var(--sombra)}
nav.inferior a{transition:background-color .18s,color .18s,transform .18s}
nav.inferior a:hover{background:var(--suave);color:var(--hoja-honda);transform:translateY(-1px)}
nav.inferior a.central:hover{background:var(--hoja-honda);color:var(--sobre-hoja)}

@media(min-width:760px){
  body:not(:has(.acceso-shell)) header.superior,body:not(:has(.acceso-shell)) main,body:not(:has(.acceso-shell)) #banda{width:min(calc(100% - 40px),960px)}
  body:not(:has(.acceso-shell)) main:has(> .tarjeta){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-content:start;gap:14px;padding-inline:28px}
  main:has(> .tarjeta)>.tarjeta{height:max-content;margin:0}
  main:has(> .tarjeta)>#aviso,main:has(> .tarjeta)>#resumen,main:has(> .tarjeta)>#camara,main:has(> .tarjeta)>#resultado{grid-column:1/-1}
  nav.inferior{width:min(calc(100% - 40px),960px);border-radius:16px 16px 0 0}
  .pagina-contexto{font-size:.82rem}
}

@media(max-width:390px){
  .pagina-contexto{max-width:34ch}
  body:not(:has(.acceso-shell)) header.superior{padding-top:calc(14px + env(safe-area-inset-top,0px))}
}

@media(forced-colors:active){body:not(:has(.acceso-shell)) header.superior::after,.tarjeta::before,.estimacion::before{background:CanvasText}}

/* Estilos semánticos usados en ajustes y recetas. */
.apartado-acciones .descartar{color:var(--tinta-tenue)}
.receta-fila .stock .pct{margin-left:1px;font-size:.6em;opacity:.65}
.receta-fila .detalle.sutil{margin-top:2px;color:var(--tinta-tenue);opacity:.75}

/* ---------------------------------------------------------------------------
   Modo oscuro. Solo se redefinen los tokens: ninguna regla de arriba cambia.
   Una despensa se consulta de noche, en la cocina, con la luz apagada; un
   fondo blanco a esa hora deslumbra. Los verdes suben de luminosidad porque
   sobre fondo oscuro el mismo verde de marca queda ilegible.
--------------------------------------------------------------------------- */
@media (prefers-color-scheme:dark){
:root{
--fondo:#101a17;--superficie:#17241f;--suave:#1e2f29;--alto:#273d35;
--tinta:#e8f0ec;--media:#a9beb5;--tenue:#8ea79d;
--linea:#2d453b;--linea-fuerte:#3f5c4f;
--hoja:#57bd92;--hoja-honda:#8ad9b4;--hoja-clara:#15332a;
--azafran:#eaad35;--azafran-claro:#352a10;
--tomate:#ec8073;--tomate-claro:#3c1f1b;
--ciruela:#b997c7;--ciruela-claro:#2c2233;
--frasco:#6fb079;
--sobre-hoja:#06120d;--marcador:#8ea79d;--codigo:#eaad35;--borde-dudoso:#7a6320;--campo:#12201b;--barra:rgba(23,36,31,.96);
--cabecera:rgba(16,26,23,.94);--cabecera-alt:rgba(20,31,27,.94);
--velo:rgba(23,36,31,.72);--fondo-app:#0d1613;
--acceso-a:#0d1714;--acceso-b:#111c18;--acceso-c:#0e1815;
--toast-fondo:#e8f0ec;--toast-texto:#0f1a17;
--texto-falta:#f0a89d;--texto-vence:#cbb0d6;--texto-admin:#e8c477;
--texto-error:#f2ab9f;--borde-error:#6b332b;--borde-ok:#2c5c47;
--texto-offline:#cbb0d6;--matiz-importe:#d3ba82;--borde-importe:#5a4a22;
}
html{color-scheme:dark}
/* Los velos de la cabecera y el fondo de la app se dibujan con verde apagado,
   no con blanco translucido, que sobre oscuro se ve como niebla gris. */
body{background-image:radial-gradient(circle at 15% 0,rgba(87,189,146,.07),transparent 30rem)}
body:not(:has(.acceso-shell)){background-image:linear-gradient(rgba(87,189,146,.045) 1px,transparent 1px),radial-gradient(circle at 8% 0,rgba(234,173,53,.06),transparent 25rem)}
}