/* ===== Variante radical: MAPA (la ruta del ingenio) ===== */
:root{
  --ds-page:#f9f3e5;--ds-ink:#2e2113;--ds-ink-2:#6b5738;--ds-ink-3:#a08a64;--ds-ink-4:#cbb590;
  --ds-hairline:#e6d2b8;--ds-teal:#c96a1a;--ds-red:#c74b36;
  --ds-font-display:"Fredoka",-apple-system,sans-serif;
  --glass-bg:252,246,236;--glass-tint:.5;--glass-ink:#2e2113;
  --glass-shadow:0 8px 24px rgba(40,70,40,.12),0 2px 6px rgba(40,70,40,.07);
  --lg-accent:#c96a1a;
}
body{background:var(--ds-page)}
.mg-app{background:
  radial-gradient(640px 340px at 50% -8%,#fff8e699,transparent 60%),
  radial-gradient(700px 500px at 50% 112%,#e0a76b4d,transparent 62%),
  linear-gradient(180deg,#f9f3e5,#f2ddb9);background-attachment:fixed}
.mg-card{background:linear-gradient(135deg,rgba(255,255,250,.85),rgba(252,255,246,.65));
  -webkit-backdrop-filter:blur(14px) saturate(1.2);backdrop-filter:blur(14px) saturate(1.2);
  border:1px solid #ecd9b8;border-radius:20px;box-shadow:0 10px 24px rgba(40,70,40,.10),inset 0 1px #ffffffcc}
.pz-head h1{font-family:"Fredoka",sans-serif;font-weight:600;font-size:26px}
.pz-head img{border-radius:14px;border:1px solid #ecd9b8}
.pz-sec{color:#c96a1a;text-align:center;margin:14px 2px 6px}
.pz-sec:before,.pz-sec:after{content:"· · ·";color:#d8a86a;letter-spacing:.2em;margin:0 8px}

/* el mapa */
.pz-map{display:flex;flex-direction:column;padding:38vh 0 42vh}
.pz-mrow{display:flex;position:relative;padding:7px 0}
@keyframes pz-rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.pz-mrow{animation:none}}
.pz-mrow.s0{justify-content:flex-start;padding-left:16.6%}
.pz-mrow.s1{justify-content:center}
.pz-mrow.s2{justify-content:flex-end;padding-right:16.6%}
.pz-mnode{position:relative;z-index:1;width:58px;height:58px;border-radius:17px;border:0;
  background:linear-gradient(180deg,#e8963f,#d97a2b);color:#fff;font-family:"Fredoka",sans-serif;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;cursor:pointer;
  box-shadow:0 5px 0 #a85a15,0 9px 14px rgba(90,60,20,.26);transition:transform .12s ease,box-shadow .12s ease;
  padding:0;text-align:center;line-height:1}
.pz-mnode b{display:block;font-size:16px;font-weight:600;line-height:1;text-align:center}
.pz-mnode i{display:block;font-style:normal;line-height:1;text-align:center}
.pz-mnode:active{transform:translateY(4px);box-shadow:0 1px 0 #a85a15,0 3px 6px rgba(90,60,20,.24)}
.pz-mnode.done{background:linear-gradient(180deg,#e8963f,#d97a2b);font-size:20px}
.pz-mnode.part{background:linear-gradient(180deg,#f2bd55,#e2a437);box-shadow:0 5px 0 #b07d1e,0 9px 14px rgba(90,60,20,.26)}
.pz-mnode.part:active{box-shadow:0 1px 0 #b07d1e,0 3px 6px rgba(90,60,20,.24)}
.pz-mnode.todo{background:linear-gradient(180deg,#fff8ea,#fdeecd);color:#c96a1a;box-shadow:0 5px 0 #d9a45e,0 9px 14px rgba(90,60,20,.2)}
.pz-mnode.todo:active{box-shadow:0 1px 0 #d9a45e,0 3px 6px rgba(90,60,20,.18)}
.pz-mnode.lock{background:linear-gradient(180deg,#eeddbd,#e3cba4);box-shadow:0 5px 0 #b99b6b,0 8px 12px rgba(90,60,20,.16);font-size:18px;cursor:default}
.pz-mnode.lock:active{transform:none;box-shadow:0 5px 0 #b99b6b,0 8px 12px rgba(90,60,20,.16)}
.pz-mnode.hoy{width:74px;height:74px;border-radius:21px;background:linear-gradient(180deg,#f0715a,#e05a41);
  box-shadow:0 6px 0 #b23a26,0 11px 16px rgba(140,50,25,.32);animation:pz-pulse-hoy 1.6s ease-in-out infinite}
.pz-mnode.hoy:active{transform:translateY(4px);box-shadow:0 2px 0 #b23a26,0 5px 8px rgba(140,50,25,.3)}
.pz-mnode.hoy b{font-size:23px;font-weight:600}
.pz-mnode.hoy i{font-size:8.5px;letter-spacing:.12em;font-weight:600;margin-top:3px;padding-left:.12em}
.pz-mnode.lock i,.pz-mnode.done i{font-size:14px;line-height:1}
.pz-mnode.lock b,.pz-mnode.done b{font-size:12px;font-weight:600;margin-top:2px}
.pz-mnode.lock{color:#7a5f36}
.pz-mnode{gap:0}

/* línea de puntos que une cada nivel con el siguiente */
.pz-map{position:relative}
.pz-path{position:absolute;left:0;top:0;pointer-events:none;z-index:0}
.pz-path path{fill:none;stroke:#c08a4d;stroke-width:4;stroke-linecap:round;stroke-dasharray:.1 11}
@media(prefers-reduced-motion:reduce){.pz-path{animation:none}}

/* resto reutiliza el sistema */
.pz-hud b{font-family:"Fredoka",sans-serif;font-size:21px;font-weight:600;color:#c96a1a}
.pz-num{background:#c96a1a18;color:#c96a1a}
.pz-card.done .pz-num{background:#c96a1a26;color:#2f5f3d}
.pz-dif.M{background:#e8b45a2e;color:#a5712f}.pz-dif.A{background:#d95f4b1f;color:#c04a38}
.pz-dif,.pz-cat,.pz-pts{background:#c96a1a14;color:var(--ds-ink-2)}
.mg-add-btn{background:#c96a1a;color:#fff}
.pz-tile{background:#c96a1a12;border:1px solid #c96a1a30}
.pz-tile.q{background:#c96a1a;color:#fff}
.mg-progress-fill,.pz-cat-b i{background:linear-gradient(90deg,#e8a04c,#c96a1a)}
.pz-cal-d.ok{background:#c96a1a2b;color:#2f5f3d}
.pz-cal-d.mid{background:#e8b45a3d;color:#a5712f}
.pz-cal-l .ok{background:#c96a1a}.pz-cal-l .mid{background:#e8b45a}
.mg-tabs button[aria-current=page],.mg-tabs .mg-glass-marker{background:#c96a1a20}
.mg-tabs button[aria-current=page]{color:#c96a1a}
.mg-sheet{background:rgba(255,248,236,.96)}
.pz-toast{background:rgba(35,48,31,.94);border-radius:18px;padding:12px 20px;font-weight:600}
.pz-toast span{flex:1;text-align:center;line-height:1.45}
.pz-toast button{background:#e8a04c;color:#2e2113}
.pz-badge{background:#e05a41}
.mg-spinner{border-color:#c96a1a26;border-top-color:#c96a1a}
.pz-vol input{accent-color:#c96a1a}

html[data-theme=dark]{color-scheme:dark;
  --ds-page:#1d1409;--ds-ink:#f2e4cd;--ds-ink-2:#d8b98a;--ds-ink-3:#6e8168;--ds-ink-4:#4a3a24;
  --ds-hairline:#3a2a18;--ds-teal:#e8a04c;
  --glass-bg:22,34,24;--glass-tint:.55;--lg-accent:#e8a04c}
html[data-theme=dark] body{background:#181009;color:#f2e4cd}
html[data-theme=dark] .mg-app{background:radial-gradient(640px 340px at 50% -8%,rgba(220,150,70,.14),transparent 60%),radial-gradient(700px 500px at 50% 112%,rgba(180,110,50,.2),transparent 62%),linear-gradient(180deg,#1d1409,#120c06)}
html[data-theme=dark] .mg-card{background:linear-gradient(135deg,rgba(46,33,20,.85),rgba(30,21,12,.7));border-color:#4a3722;box-shadow:0 12px 26px rgba(0,0,0,.45),inset 0 1px rgba(255,255,255,.06)}
html[data-theme=dark] .pz-mnode{box-shadow:0 5px 0 #7a4a12,0 9px 14px rgba(0,0,0,.55)}
html[data-theme=dark] .pz-mnode:active{box-shadow:0 1px 0 #7a4a12,0 3px 6px rgba(0,0,0,.5)}
html[data-theme=dark] .pz-mnode.done{background:linear-gradient(180deg,#d9822f,#b96a1f)}
html[data-theme=dark] .pz-mnode.part{background:linear-gradient(180deg,#c99a34,#a87e26);box-shadow:0 5px 0 #7a5a15,0 9px 14px rgba(0,0,0,.55)}
html[data-theme=dark] .pz-mnode.part:active{box-shadow:0 1px 0 #7a5a15,0 3px 6px rgba(0,0,0,.5)}
html[data-theme=dark] .pz-mnode.todo{background:linear-gradient(180deg,#3a2b18,#2c2113);color:#e8c07a;box-shadow:0 5px 0 #17100a,0 9px 14px rgba(0,0,0,.55)}
html[data-theme=dark] .pz-mnode.todo:active{box-shadow:0 1px 0 #17100a,0 3px 6px rgba(0,0,0,.5)}
html[data-theme=dark] .pz-mnode.lock{background:linear-gradient(180deg,#33271a,#271d12);box-shadow:0 5px 0 #14100a,0 8px 12px rgba(0,0,0,.5)}
html[data-theme=dark] .pz-mnode.lock:active{transform:none;box-shadow:0 5px 0 #14100a,0 8px 12px rgba(0,0,0,.5)}
html[data-theme=dark] .pz-mnode.hoy{background:linear-gradient(180deg,#f0715a,#d34e36);box-shadow:0 6px 0 #8f2f1d,0 11px 16px rgba(0,0,0,.55)}
html[data-theme=dark] .pz-mnode.hoy:active{box-shadow:0 2px 0 #8f2f1d,0 5px 8px rgba(0,0,0,.5)}
html[data-theme=dark] .pz-path path{stroke:#7a5a30}
html[data-theme=dark] .pz-num{background:#e8a04c1f;color:#f0d0a0}
html[data-theme=dark] .pz-card.done .pz-num{background:#c96a1a33;color:#f0c088}
html[data-theme=dark] .pz-dif,.pz-cat,.pz-pts{background:#e8a04c14;color:#d8b98a}
html[data-theme=dark] .pz-dif.A{background:#d95f4b2b;color:#e88}
html[data-theme=dark] .pz-dif.M{background:#e8b45a2b;color:#eccf9a}
html[data-theme=dark] .pz-tile{background:#e8a04c14;border-color:#e8a04c40}
html[data-theme=dark] .pz-tile.q{background:#e8a04c;color:#241505}
html[data-theme=dark] .mg-add-btn{background:#e8a04c;color:#241505}
html[data-theme=dark] .mg-tabs{background:rgba(26,18,10,.45);border-color:rgba(255,255,255,.13)}
html[data-theme=dark] .mg-tabs button[aria-current=page],html[data-theme=dark] .mg-tabs .mg-glass-marker{background:#e8a04c26}
html[data-theme=dark] .mg-tabs button[aria-current=page]{color:#e8a04c}
html[data-theme=dark] .mg-sheet{background:rgba(30,21,12,.97)}
html[data-theme=dark] .pz-toast{background:#f2e4cd;color:#241505}
html[data-theme=dark] .pz-toast button{background:#181009;color:#f2e4cd}
html[data-theme=dark] .pz-hint.lock{background:#ffffff0d}
html[data-theme=dark] .pz-cal-d.no{background:#ffffff0d}
html[data-theme=dark] .pz-cal-d.ok{background:#c96a1a40;color:#f0c088}
html[data-theme=dark] .pz-cat-b{background:#ffffff14}
html[data-theme=dark] .ui-callout{background:#241a0e}
html[data-theme=dark] .mg-backup-text textarea{background:#17100a}
html[data-theme=dark] .mg-spinner{border-color:#e8a04c26;border-top-color:#e8a04c}

/* HUD mini: iconos pequeños a la derecha */
.pz-hud-mini{position:fixed;right:calc(max(10px,env(safe-area-inset-right)) + 4px);top:calc(max(12px,env(safe-area-inset-top)) + 8px);z-index:20;
  display:flex;flex-direction:column;gap:8px}
.pz-hud-mini span{overflow:hidden;white-space:nowrap;transition:transform .28s cubic-bezier(.3,1.4,.4,1)}
.pz-hud-mini span em{font-style:normal;font-size:10px;font-weight:600;color:var(--ds-ink-2);line-height:1.2;
  max-height:0;opacity:0;overflow:hidden;transition:max-height .26s cubic-bezier(.3,1.2,.4,1),opacity .2s ease,margin .26s ease;margin-top:0}
.pz-hud-mini span.on{transform:scale(1.14)}
.pz-hud-mini span.on em{max-height:16px;opacity:1;margin-top:3px}
.pz-hud-mini span{-webkit-tap-highlight-color:transparent;touch-action:none;user-select:none;-webkit-user-select:none}
html[data-theme=dark] .pz-hud-mini span em{color:#d8b98a}
.pz-hud-mini span{display:flex;flex-direction:column;align-items:center;gap:1px;width:44px;padding:7px 0 6px;
  border-radius:14px;background:linear-gradient(135deg,rgba(255,255,250,.88),rgba(252,246,236,.7));
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  border:1px solid #efdfc7;box-shadow:0 6px 14px rgba(120,80,30,.14),inset 0 1px #ffffffcc}
.pz-hud-mini i{font-style:normal;font-size:13px;line-height:1}
.pz-hud-mini b{font-family:"Fredoka",sans-serif;font-weight:600;font-size:11.5px;color:#c96a1a}
html[data-theme=dark] .pz-hud-mini span{background:linear-gradient(135deg,rgba(42,32,20,.9),rgba(30,22,14,.75));border-color:#3d2f1e;box-shadow:0 8px 16px rgba(0,0,0,.5)}
html[data-theme=dark] .pz-hud-mini b{color:#e8c07a}

/* X de cierre compacta (disco 32px, área táctil 44px) */
.mg-sheet .ui-close{width:32px;height:32px;font-size:15px;line-height:1;color:#6b4a1e;position:relative;
  background:rgba(255,255,255,.75);border:1.5px solid #c96a1a26;border-radius:50%;display:grid;place-items:center;
  box-shadow:0 3px 8px rgba(90,60,20,.14);transition:transform .15s ease}
.mg-sheet .ui-close:before{content:"";position:absolute;inset:-7px;border-radius:50%}
.mg-sheet .ui-close:active{transform:scale(.88)}
html[data-theme=dark] .mg-sheet .ui-close{background:rgba(40,31,19,.9);color:#e8c07a;border-color:#6b53301a;box-shadow:0 3px 8px rgba(0,0,0,.4)}

/* cabecera persistente: entra/sale fluida, sin re-render */
.pz-head{overflow:hidden;max-height:160px;transition:opacity .28s ease,transform .28s ease,max-height .3s ease,padding .3s ease}
.pz-head.pz-head-off{opacity:0;transform:translateY(-12px);max-height:0;padding-top:0;padding-bottom:0;pointer-events:none;visibility:hidden;transition:opacity .28s ease,transform .28s ease,max-height .3s ease,padding .3s ease,visibility 0s .3s}
@media(prefers-reduced-motion:reduce){.pz-head,.pz-head.pz-head-off{transition:none}}
/* el mapa carga de golpe, ya posicionado */
.pz-map,.pz-hud-mini{transition:opacity .28s ease}
.pz-pre{opacity:0!important}

/* aspecto de mapa del tesoro: decoración ligera SVG, simétrica al eje */
.pz-decor{position:absolute;left:0;top:0;pointer-events:none;z-index:0;color:#a5763a}
.pz-decor path{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;opacity:.38}
.pz-decor path.pz-x{stroke-width:3.5;opacity:.55}
.pz-decor path.pz-compass{opacity:.5}
.pz-decor path.pz-blob{opacity:.15;stroke-dasharray:2 7}
html[data-theme=dark] .pz-decor{color:#caa26a}
html[data-theme=dark] .pz-decor path{opacity:.3}
html[data-theme=dark] .pz-decor path.pz-x{opacity:.45}
html[data-theme=dark] .pz-decor path.pz-blob{opacity:.12}

/* papel de mapa: manchas suaves de pergamino (solo gradientes, sin imágenes) */
.pz-map{background-image:radial-gradient(560px 380px at 18% 12%,rgba(190,135,60,.10),transparent 70%),radial-gradient(520px 460px at 85% 42%,rgba(190,135,60,.08),transparent 70%),radial-gradient(640px 480px at 25% 80%,rgba(190,135,60,.09),transparent 70%)}
html[data-theme=dark] .pz-map{background-image:radial-gradient(560px 380px at 18% 12%,rgba(230,180,110,.05),transparent 70%),radial-gradient(520px 460px at 85% 42%,rgba(230,180,110,.04),transparent 70%),radial-gradient(640px 480px at 25% 80%,rgba(230,180,110,.05),transparent 70%)}

/* bordes envejecidos solo en la pestaña Mapa */
.mg-scroll.pz-scroll-map{box-shadow:inset 0 0 80px rgba(122,80,28,.20),inset 0 0 18px rgba(122,80,28,.10)}
html[data-theme=dark] .mg-scroll.pz-scroll-map{box-shadow:inset 0 0 90px rgba(0,0,0,.55),inset 0 0 22px rgba(0,0,0,.35)}

/* mapa del tesoro, capa detallada: marco de carta antigua, manchas, rumbos */
.pz-decor path.pz-frame{opacity:.5;stroke-width:2.5}
.pz-decor path.pz-frame2{opacity:.3;stroke-width:1}
.pz-decor path.pz-stain{opacity:.1;stroke-dasharray:6 4 9 5 4 7}
.pz-decor path.pz-rhumb{opacity:.12;stroke-width:1.5}
.pz-decor path.pz-tuft{opacity:.3;stroke-width:1.6}
.pz-decor path.pz-ship{opacity:.45}
.pz-decor path.pz-gull{opacity:.35;stroke-width:1.8}
html[data-theme=dark] .pz-decor path.pz-frame{opacity:.4}
html[data-theme=dark] .pz-decor path.pz-stain{opacity:.08}
html[data-theme=dark] .pz-decor path.pz-rhumb{opacity:.1}

/* mapa del tesoro, realismo: rellenos con degradado, sombreado, relieve */
.pz-decor .g1a{stop-color:#e2c48e}.pz-decor .g1b{stop-color:#b0803f}
.pz-decor .g2a{stop-color:#c9a061}.pz-decor .g2b{stop-color:#8a5f2e}
.pz-decor .g3a{stop-color:#fdf6e4}.pz-decor .g3b{stop-color:#e2cd9f}
.pz-decor path.f-mount{fill:url(#pzGM);stroke:#7d5626;stroke-width:1.6;opacity:.75}
.pz-decor path.f-tree{fill:url(#pzGT);stroke:#6e4c20;stroke-width:1.6;opacity:.8}
.pz-decor path.f-tree2{fill:url(#pzGT);stroke:#6e4c20;stroke-width:1.5;opacity:.7}
.pz-decor path.f-trunk{fill:#7a5225;stroke:none;opacity:.85}
.pz-decor path.f-snow{fill:#fbf3df;stroke:none;opacity:.95}
.pz-decor path.f-cloud{fill:url(#pzGC);stroke:#b08d55;stroke-width:1.6;opacity:.85}
.pz-decor path.f-hull{fill:#8a5f2e;stroke:#5f3f1a;stroke-width:1.4;opacity:.9}
.pz-decor path.f-sail{fill:url(#pzGC);stroke:#8a5f2e;stroke-width:1.3;opacity:.9}
.pz-decor path.pz-rig{fill:none;stroke:#5f3f1a;stroke-width:1.4;opacity:.8}
.pz-decor path.f-wave{fill:none;stroke:#a5763a;stroke-width:2;opacity:.45}
.pz-decor path.pz-sh{fill:#3a2410;stroke:none;opacity:.13}
.pz-decor path.pz-hatch{fill:none;stroke:#5f3f1a;stroke-width:1;opacity:.3}
.pz-decor path.pz-x{fill:none;stroke:#a03a22;stroke-width:4;opacity:.8}
.pz-decor path.pz-compass{fill:rgba(243,230,200,.5);stroke:#8a5f2e;stroke-width:1.6;opacity:.9}
.pz-decor path.pz-blob{fill:rgba(217,189,138,.08)}
html[data-theme=dark] .pz-decor .g1a{stop-color:#7a5a2c}html[data-theme=dark] .pz-decor .g1b{stop-color:#4a3315}
html[data-theme=dark] .pz-decor .g2a{stop-color:#6e4c20}html[data-theme=dark] .pz-decor .g2b{stop-color:#453012}
html[data-theme=dark] .pz-decor .g3a{stop-color:#d9c9a2}html[data-theme=dark] .pz-decor .g3b{stop-color:#8a6f42}
html[data-theme=dark] .pz-decor path.f-snow{fill:#d9c9a2;opacity:.8}
html[data-theme=dark] .pz-decor path.f-hull{fill:#b08d55;stroke:#d8b98a}
html[data-theme=dark] .pz-decor path.f-trunk{fill:#a5763a}
html[data-theme=dark] .pz-decor path.pz-rig{stroke:#caa26a}
html[data-theme=dark] .pz-decor path.pz-sh{fill:#000;opacity:.3}
html[data-theme=dark] .pz-decor path.pz-hatch{stroke:#d8b98a;opacity:.22}
html[data-theme=dark] .pz-decor path.pz-x{stroke:#c05a3a}
html[data-theme=dark] .pz-decor path.pz-compass{fill:rgba(202,162,106,.2);stroke:#caa26a}
html[data-theme=dark] .pz-decor path.f-wave{stroke:#caa26a;opacity:.35}

/* papel: grano generado + líneas de vergelé + manchas */
.pz-map{background-image:var(--pz-grain,none),repeating-linear-gradient(0deg,rgba(120,85,40,.035) 0 1px,transparent 1px 4px),radial-gradient(560px 380px at 18% 12%,rgba(190,135,60,.10),transparent 70%),radial-gradient(520px 460px at 85% 42%,rgba(190,135,60,.08),transparent 70%),radial-gradient(640px 480px at 25% 80%,rgba(190,135,60,.09),transparent 70%)}
html[data-theme=dark] .pz-map{background-image:var(--pz-grain,none),repeating-linear-gradient(0deg,rgba(230,190,120,.025) 0 1px,transparent 1px 4px),radial-gradient(560px 380px at 18% 12%,rgba(230,180,110,.05),transparent 70%),radial-gradient(520px 460px at 85% 42%,rgba(230,180,110,.04),transparent 70%),radial-gradient(640px 480px at 25% 80%,rgba(230,180,110,.05),transparent 70%)}

/* pergamino a pantalla completa (claro y oscuro), marco con esquinas redondeadas */
.mg-app.pz-paper-on{background-image:var(--pz-grain,none),repeating-linear-gradient(0deg,rgba(120,85,40,.035) 0 1px,transparent 1px 4px),radial-gradient(560px 380px at 18% 28%,rgba(190,135,60,.10),transparent 70%),radial-gradient(520px 460px at 85% 46%,rgba(190,135,60,.08),transparent 70%),radial-gradient(640px 480px at 25% 82%,rgba(190,135,60,.09),transparent 70%),linear-gradient(180deg,#f9f3e5,#f2ddb9);
  box-shadow:inset 70px 0 70px -50px rgba(122,80,28,.16),inset -70px 0 70px -50px rgba(122,80,28,.16),inset 0 -80px 80px -50px rgba(122,80,28,.20)}
html[data-theme=dark] .mg-app.pz-paper-on{background-image:var(--pz-grain,none),repeating-linear-gradient(0deg,rgba(230,190,120,.025) 0 1px,transparent 1px 4px),radial-gradient(560px 380px at 18% 28%,rgba(230,180,110,.05),transparent 70%),radial-gradient(520px 460px at 85% 46%,rgba(230,180,110,.04),transparent 70%),radial-gradient(640px 480px at 25% 82%,rgba(230,180,110,.05),transparent 70%),linear-gradient(180deg,#1d1409,#120c06);
  box-shadow:inset 70px 0 80px -50px rgba(0,0,0,.5),inset -70px 0 80px -50px rgba(0,0,0,.5),inset 0 -90px 90px -50px rgba(0,0,0,.55)}
.mg-app.pz-paper-on .pz-map{background:none}
.mg-scroll.pz-scroll-map{box-shadow:none}

/* pulso del nivel actual sin transform: no compite con el :active */
@keyframes pz-pulse-hoy{0%,100%{filter:brightness(1)}50%{filter:brightness(1.09)}}
@media(prefers-reduced-motion:reduce){.pz-mnode.hoy{animation:none}}

/* iOS: bloqueo del documento para que Safari no arrastre los elementos fixed al abrir el teclado */
html,body{overscroll-behavior:none}
/* pergamino a pantalla completa (cubre tambien la zona de la barra de estado) */
.mg-app.pz-paper-on{background:#f9f3e5;padding-top:0;box-shadow:none}
.mg-app.pz-paper-on::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background-image:var(--pz-grain,none),repeating-linear-gradient(0deg,rgba(120,85,40,.035) 0 1px,transparent 1px 4px),radial-gradient(560px 380px at 18% 28%,rgba(190,135,60,.10),transparent 70%),radial-gradient(520px 460px at 85% 46%,rgba(190,135,60,.08),transparent 70%),radial-gradient(640px 480px at 25% 82%,rgba(190,135,60,.09),transparent 70%),linear-gradient(180deg,#f9f3e5,#f2ddb9);
  box-shadow:inset 70px 0 70px -50px rgba(122,80,28,.16),inset -70px 0 70px -50px rgba(122,80,28,.16),inset 0 -80px 80px -50px rgba(122,80,28,.20)}
.mg-app.pz-paper-on .mg-scroll{position:relative;z-index:1}
html[data-theme=dark] .mg-app.pz-paper-on{background:#181009}
html[data-theme=dark] .mg-app.pz-paper-on::before{background-image:var(--pz-grain,none),repeating-linear-gradient(0deg,rgba(230,190,120,.025) 0 1px,transparent 1px 4px),radial-gradient(560px 380px at 18% 28%,rgba(230,180,110,.05),transparent 70%),radial-gradient(520px 460px at 85% 46%,rgba(230,180,110,.04),transparent 70%),radial-gradient(640px 480px at 25% 82%,rgba(230,180,110,.05),transparent 70%),linear-gradient(180deg,#1d1409,#120c06);
  box-shadow:inset 70px 0 80px -50px rgba(0,0,0,.5),inset -70px 0 80px -50px rgba(0,0,0,.5),inset 0 -90px 90px -50px rgba(0,0,0,.55)}

/* halo del input: una sola linea fina (como en Que ver v56) */
.mg-input:focus-visible{outline:none}
.mg-input:focus{box-shadow:0 0 0 1.5px rgba(201,106,26,.55)}
html[data-theme=dark] .mg-input:focus{box-shadow:0 0 0 1.5px rgba(201,106,26,.6)}

/* scroll en el documento (como Mis plantas): el contenido pasa por detrás del reloj con el blur nativo de Safari */
.mg-app{height:auto;min-height:100dvh;overflow:visible}
.mg-scroll{overflow:visible}
/* el dock era absolute anclado a .mg-app (100dvh); con scroll de documento pasa a fixed, misma posición visual */
.mg-tabs.lg-track{position:fixed}
/* backdrop NO fijo: Safari 26 muestrea los fixed a ancho completo del borde superior y pinta una banda;
   absolute + coords de documento = se ve el mapa atenuado bajo la hora, sin banda */
.mg-backdrop{position:absolute}
/* el atenuado entra y sale al instante: animar opacidad sobre una capa de todo el documento repinta cada frame en iPhone ("recarga"); la unica animacion visible es el pop de la tarjeta */
.mg-backdrop,.mg-backdrop.leaving{animation:none}

/* tarjetas flotantes centradas hacia el medio (centrado base left/top 50%); el teclado lo gestiona iOS con su pan nativo, sin JS. Altura tope para que quepa entera sobre el teclado */
.mg-sheet{max-height:min(500px,calc(100dvh - 32px))}
