/* Meteo-Foto · estils principals (el <style> gran de la capçalera) — extret tal com era de index.html el 26-09-2026 (fase 1 de la divisió). Aquí és on s'edita. */

:root,[data-theme="light"]{
  --bg-gradient:linear-gradient(135deg,rgba(224,240,255,0.55) 0%,rgba(240,249,255,0.55) 100%);
  --bg-overlay:rgba(255,255,255,0.78);
  --card:rgba(255,255,255,0.96); --card-2:#f5fbff; --card-3:#e7f3fb;
  --primary:#1e6091; --accent:#168aad;
  --text:#1a1a2e; --text-2:#555; --muted:#6b7c93; --muted-2:#888;
  --danger:#d62828; --warning:#f4a261; --success:#2a9d8f; --info:#168aad;
  --border:#d0e2f0;
  --input-bg:#ffffff; --suggestions-bg:#ffffff; --suggestions-hover:#f1f9ff;
  --uncertain-bg:#fff8ed; --uncertain-text:#b8741e; --uncertain-border:#f4a261;
  --info-bg:#e8f1f8; --error-bg:#fde8e8; --success-bg:#e0f5ee;
  --shadow:0 4px 16px rgba(0,0,0,0.08); --shadow-hover:0 8px 24px rgba(0,0,0,0.12);
  --grad-photo:linear-gradient(135deg,#f4a261 0%,#e76f51 100%);
  --grad-night:linear-gradient(135deg,#1a1a2e 0%,#16213e 50%,#0f3460 100%);
  --grad-sunmoon:linear-gradient(135deg,#fcb045 0%,#fd7c4f 50%,#833ab4 100%);
  --grad-aurora:linear-gradient(135deg,#0f3460 0%,#16537e 50%,#1abc9c 100%);
  --grad-alerts:linear-gradient(135deg,#e76f51 0%,#d62828 100%);
}
[data-theme="dark"]{
  --bg-gradient:linear-gradient(135deg,rgba(13,20,25,0.4) 0%,rgba(22,30,46,0.4) 100%);
  --bg-overlay:rgba(13,20,25,0.65);
  --card:rgba(26,34,51,0.95); --card-2:#232c40; --card-3:#2c3651;
  --primary:#5fb3d6; --accent:#7dc4d8;
  --text:#e8eef5; --text-2:#b0bcc8; --muted:#8a9bae; --muted-2:#6a7a8e;
  --danger:#ff7373; --warning:#ffb86c; --success:#50e3c2; --info:#7dc4d8;
  --border:#2a3447;
  --input-bg:#232c40; --suggestions-bg:#232c40; --suggestions-hover:#2c3651;
  --uncertain-bg:#2a2418; --uncertain-text:#ffb86c; --uncertain-border:#b8741e;
  --info-bg:#1f2a3a; --error-bg:#3a1f1f; --success-bg:#1f3a30;
  --shadow:0 4px 16px rgba(0,0,0,0.4); --shadow-hover:0 8px 28px rgba(0,0,0,0.5);
}
*{box-sizing:border-box;margin:0;padding:0}
html{min-height:100%;scrollbar-gutter:stable}
body{
  font-family:'Segoe UI',Roboto,'Helvetica Neue',sans-serif;
  color:var(--text);
  min-height:100vh;
  padding:calc(0.4rem + env(safe-area-inset-top)) calc(1rem + env(safe-area-inset-right)) calc(1rem + env(safe-area-inset-bottom)) calc(1rem + env(safe-area-inset-left));
  display:flex;flex-direction:column;align-items:center;
  transition:color 0.3s;
  position:relative;
  background-color:#0d1419;
}
/* 13-10 (Jaume, iPhone en mode dia: «el fons gris no s'allarga prou», a baix sortia negre): el gris és la capa fixa body::before
   sobre el #0d1419; a l'iPhone aquesta capa no sempre cobreix el final de la pàgina. En mode dia, el body ja és d'aquest gris
   (el mateix color que feia la capa) i la capa no hi és: es veu igual que abans, sense cap tros negre */
[data-theme="light"] body{background-color:#f2f2f7}   /* 16-10 (Jaume: «el fons del mode fàcil m'agrada, posa'l també al mode dia del mode complet»): el gris clar de l'iPhone (abans #868f98) */
[data-theme="light"] body::before{background:none}
/* Capes de fons (crossfade entre fotos pròpies) */
/* (fons d'imatges retirat — web més neta) */
/* Overlay per atenuar el fons i mantenir llegibilitat */
body::before{
  content:'';position:fixed;inset:0;z-index:-1;
  background:var(--bg-gradient);
  pointer-events:none;
}
.container{width:100%;max-width:1100px;min-width:0;overflow-x:clip;display:flex;flex-direction:column;gap:0.9rem}

h1{text-align:center;color:var(--primary);font-size:2rem;font-weight:600;letter-spacing:-0.5px}
h1:not(.app-title) span{display:block;font-size:0.95rem;font-weight:400;color:var(--muted);margin-top:0.25rem}
h2{color:var(--primary);font-size:1.25rem}
h3{color:var(--primary);font-size:1.05rem;margin-bottom:0.5rem}
h4{color:var(--text);font-size:0.95rem;margin-bottom:0.4rem}

/* ===== HEADER PREMIUM — logo esquerra, controls dreta ===== */
.header-bar{display:flex;justify-content:space-between;align-items:center;gap:0.5rem;margin-bottom:0;padding:0.1rem 0;flex-wrap:wrap;position:relative;z-index:1200}
.header-right{display:inline-flex;align-items:center;gap:0.5rem;flex-shrink:0}

/* ===== HEADER V34 — branding més gran i primera línia pròpia en mòbil ===== */
.header-bar{
  gap:0.7rem;
}
.app-title{
  min-width:0;
}
.app-icon{
  height:78px!important;
}
.app-name{
  font-size:3.2rem!important;
}

/* Escriptori gran: METEOFOTO.CAT una mica més present */
@media (min-width:1200px){
  .app-icon{height:84px!important}
  .app-name{font-size:3.45rem!important}
}

/* Mòbil / tauleta petita:
   - 1a fila sempre reservada al branding
   - logo + text ocupen tota l'amplada
   - el text creix de forma fluïda i s'adapta al dispositiu */
@media (max-width:820px){
  .header-bar{
    align-items:flex-start;
    row-gap:0.7rem;
  }
  .app-title{
    width:100%!important;
    flex:0 0 100%!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:0.7rem!important;
    margin:0!important;
  }
  .app-icon{
    height:clamp(56px,15vw,78px)!important;
    flex:0 0 auto!important;
  }
  .app-name{
    min-width:0;
    flex:1 1 auto;
    width:auto;
    display:flex!important;
    align-items:baseline;
    font-size:clamp(2.15rem,8.6vw,3.15rem)!important;
    line-height:.96!important;
    letter-spacing:-0.02em!important;
    white-space:nowrap!important;
  }
  .app-name .app-name-cat{
    font-size:.33em!important;
    margin-left:.1em!important;
  }
  .header-right{
    width:100%;
    flex:0 0 100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:0.45rem;
    flex-wrap:nowrap;
    overflow-x:auto;
    overflow-y:hidden;
    padding-bottom:0.05rem;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }
  .header-right::-webkit-scrollbar{display:none}
}

/* Mòbils estrets: encara més fi per no tallar mai el nom */
@media (max-width:520px){
  .header-bar{padding-top:0.12rem}
  .app-title{
    gap:0.55rem!important;
  }
  .app-icon{
    height:clamp(50px,14vw,68px)!important;
  }
  .app-name{
    font-size:clamp(1.95rem,8.2vw,2.85rem)!important;
  }
}

/* iPhones molt estrets */
@media (max-width:390px){
  .app-title{gap:0.46rem!important}
  .app-icon{
    height:48px!important;
  }
  .app-name{
    font-size:clamp(1.72rem,7.7vw,2.45rem)!important;
    letter-spacing:-0.024em!important;
  }
}

/* Quan hi ha molt espai, els botons poden quedar a la dreta sense estrènyer el branding */
@media (min-width:821px){
  .header-right{
    margin-left:auto;
  }
}

/* ===================== MFServiceStatus — Chip & Banners ===================== */
/* Xip d'estat al header (avatar/login side). Mida discreta, click obre tooltip. */
.mf-service-chip{display:inline-flex;align-items:center;gap:0.3rem;padding:0.28rem 0.55rem;border-radius:999px;font-size:0.78rem;font-weight:600;cursor:pointer;user-select:none;border:1px solid transparent;background:rgba(120,120,120,0.12);color:var(--text);transition:background 0.2s,border-color 0.2s,transform 0.15s;line-height:1;white-space:nowrap;position:relative}
.mf-service-chip:hover{transform:translateY(-1px)}
.mf-service-chip .mf-svc-dot{width:0.55rem;height:0.55rem;border-radius:50%;flex-shrink:0;background:#9ca3af}
.mf-service-chip .mf-svc-label{font-size:0.72rem;letter-spacing:0.01em}
.mf-service-chip[data-status="ok"]{background:rgba(16,185,129,0.12);border-color:rgba(16,185,129,0.3);color:#059669}
.mf-service-chip[data-status="ok"] .mf-svc-dot{background:#10b981;box-shadow:0 0 0 3px rgba(16,185,129,0.15)}
.mf-service-chip[data-status="degraded"]{background:rgba(245,158,11,0.12);border-color:rgba(245,158,11,0.35);color:#b45309}
.mf-service-chip[data-status="degraded"] .mf-svc-dot{background:#f59e0b;box-shadow:0 0 0 3px rgba(245,158,11,0.18);animation:mfSvcPulseSlow 2.4s ease-in-out infinite}
.mf-service-chip[data-status="down"]{background:rgba(239,68,68,0.14);border-color:rgba(239,68,68,0.4);color:#b91c1c}
.mf-service-chip[data-status="down"] .mf-svc-dot{background:#ef4444;box-shadow:0 0 0 3px rgba(239,68,68,0.2);animation:mfSvcPulse 1.4s ease-in-out infinite}
.mf-service-chip[data-status="unknown"]{background:rgba(120,120,120,0.1);color:var(--muted)}
.mf-service-chip[data-status="unknown"] .mf-svc-dot{background:#9ca3af}
@keyframes mfSvcPulse{0%,100%{opacity:1}50%{opacity:0.4}}
@keyframes mfSvcPulseSlow{0%,100%{opacity:1}50%{opacity:0.6}}
[data-theme="dark"] .mf-service-chip[data-status="ok"]{color:#34d399}
[data-theme="dark"] .mf-service-chip[data-status="degraded"]{color:#fbbf24}
[data-theme="dark"] .mf-service-chip[data-status="down"]{color:#f87171}
/* Tooltip flotant sota el xip al hover/focus/click */
#footerStatusRow{display:flex;gap:0.6rem;justify-content:center;align-items:center;flex-basis:100%;margin-bottom:0.45rem;position:relative}
#footerStatusRow{flex-wrap:wrap;gap:.45rem .9rem;padding:0 .5rem}   /* 16-10: privacitat · connectats · servei · restableix · sobre Meteo-Foto, en una fila */
/* 16-10 (Jaume: «el col·labora fes-lo una mica més visible»): pastilla ambre (_mfDonateApply la mostra si l'admin té les donacions actives) */
.mf-donate-pill{align-items:center;gap:.4rem;padding:.55rem 1.25rem;border-radius:999px;border:1.5px solid #f59e0b;background:rgba(245,158,11,.14);color:#b45309;font:750 .95rem/1.2 system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;cursor:pointer}
.mf-donate-pill:hover{background:rgba(245,158,11,.24)}
[data-theme="dark"] .mf-donate-pill{color:#fbbf24}
#footerStatusRow .mf-svc-tooltip{top:auto;bottom:calc(100% + 0.5rem);right:auto;left:50%;transform:translate(-50%,4px)}
#footerStatusRow .mf-service-chip[aria-expanded="true"] .mf-svc-tooltip,#footerStatusRow .mf-service-chip:hover .mf-svc-tooltip,#footerStatusRow .mf-service-chip:focus-within .mf-svc-tooltip{transform:translate(-50%,0)}
.header-right .mf-top-btn{font-size:0.78rem;padding:0.32rem 0.6rem}
.header-right .mf-top-loc-big{max-width:none;white-space:nowrap}
.header-right .mf-top-btn{width:auto;overflow:visible;text-overflow:clip}
@media(max-width:600px){
  .header-right{flex-wrap:wrap;justify-content:flex-end;row-gap:0.3rem}
  .header-right .mf-top-loc-big{max-width:58vw;overflow:hidden;text-overflow:ellipsis}
}
.header-right .mf-top-bell{filter:grayscale(1);opacity:0.6;font-size:1rem;padding:0.26rem 0.34rem;min-width:0;line-height:1}
.header-right .mf-top-bell.mf-bell-on{filter:none;opacity:1;border-color:rgba(245,197,66,0.75);background:rgba(245,197,66,0.14);box-shadow:0 0 8px rgba(245,197,66,0.35)}
.mf-svc-tooltip{position:absolute;top:calc(100% + 0.5rem);right:0;min-width:260px;max-width:320px;padding:0.75rem 0.9rem;background:var(--card-bg,#fff);border:1px solid var(--border,#e5e7eb);border-radius:0.6rem;box-shadow:0 10px 30px rgba(0,0,0,0.18);font-size:0.82rem;font-weight:500;color:var(--text);line-height:1.45;z-index:1100;opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity 0.18s,transform 0.18s,visibility 0.18s;text-align:left;white-space:normal}
.mf-service-chip[aria-expanded="true"] .mf-svc-tooltip,.mf-service-chip:hover .mf-svc-tooltip,.mf-service-chip:focus-within .mf-svc-tooltip{opacity:1;visibility:visible;transform:translateY(0)}
.mf-svc-tooltip h4{margin:0 0 0.4rem;font-size:0.88rem;font-weight:700}
.mf-svc-tooltip p{margin:0 0 0.4rem;font-size:0.78rem;color:var(--muted)}
.mf-svc-tooltip .mf-svc-retry{display:inline-block;margin-top:0.4rem;padding:0.3rem 0.7rem;font-size:0.76rem;font-weight:600;background:var(--accent,#6366f1);color:white;border:none;border-radius:0.4rem;cursor:pointer}
.mf-svc-tooltip .mf-svc-retry:hover{filter:brightness(1.1)}
.mf-svc-srctest{margin-top:0.55rem;padding-top:0.5rem;border-top:1px solid var(--border)}
.mf-svc-srctest-lbl{font-size:0.68rem;color:var(--muted);margin-bottom:0.35rem;font-weight:600}
.mf-svc-srcbtns{display:flex;gap:0.3rem;flex-wrap:wrap}
.mf-svc-srcbtn{flex:1;min-width:62px;padding:0.3rem 0.4rem;font-size:0.7rem;font-weight:600;border:1px solid #cdd6e3;background:#eef2f7;color:#374151;border-radius:0.4rem;cursor:pointer;transition:background 0.15s,border-color 0.15s,color 0.15s}
.mf-svc-srcbtn:hover{border-color:#168aad;background:#e3ecf5}
.mf-svc-srcbtn.active{background:#168aad;color:#fff;border-color:#168aad}
/* Versió compacta en mòbil: només el punt, sense text "Servei OK" */
@media (max-width:700px){
  .mf-service-chip .mf-svc-label{display:none}
  .mf-service-chip{padding:0.32rem 0.4rem;gap:0}
  .mf-svc-tooltip{right:-2rem;min-width:240px}
}
/* Banners de servei a AVUI i SETMANA */
.mf-service-banner{display:none;margin:0 0 1rem;padding:0.85rem 1rem;border-radius:0.6rem;font-size:0.88rem;font-weight:500;line-height:1.5;align-items:flex-start;gap:0.7rem;border:1px solid transparent}
.mf-service-banner.visible{display:flex}
.mf-service-banner[data-status="degraded"]{background:rgba(245,158,11,0.10);border-color:rgba(245,158,11,0.35);color:#92400e}
.mf-service-banner[data-status="down"]{background:rgba(239,68,68,0.10);border-color:rgba(239,68,68,0.35);color:#991b1b}
[data-theme="dark"] .mf-service-banner[data-status="degraded"]{color:#fcd34d;background:rgba(245,158,11,0.15)}
[data-theme="dark"] .mf-service-banner[data-status="down"]{color:#fca5a5;background:rgba(239,68,68,0.15)}
.mf-service-banner .mf-svcb-icon{font-size:1.3rem;flex-shrink:0;line-height:1}
.mf-service-banner .mf-svcb-body{flex:1;min-width:0}
.mf-service-banner .mf-svcb-title{font-weight:700;margin:0 0 0.2rem;font-size:0.92rem}
.mf-service-banner .mf-svcb-text{margin:0 0 0.4rem}
.mf-service-banner .mf-svcb-meta{font-size:0.78rem;opacity:0.85;margin:0}
.mf-service-banner .mf-svcb-actions{display:flex;gap:0.5rem;margin-top:0.5rem;flex-wrap:wrap}
.mf-service-banner .mf-svcb-btn{padding:0.35rem 0.75rem;font-size:0.8rem;font-weight:600;border:1px solid currentColor;border-radius:0.4rem;background:transparent;color:inherit;cursor:pointer}
.mf-service-banner .mf-svcb-btn:hover{background:rgba(255,255,255,0.18)}
[data-theme="dark"] .mf-service-banner .mf-svcb-btn:hover{background:rgba(0,0,0,0.2)}
/* ============================================================================ */
.app-title{margin:0;line-height:1;display:inline-flex;align-items:center;gap:0.85rem;flex-shrink:0;cursor:pointer;user-select:none}
.app-title:hover .app-icon{filter:drop-shadow(0 4px 14px rgba(198,173,127,0.55));transform:scale(1.05)}
/* Icona del logo (sense text) — proporció natural ~1.94:1 */
.app-icon{height:72px!important;width:auto!important;flex-shrink:0;filter:drop-shadow(0 2px 8px rgba(40,55,90,0.25));object-fit:contain;transition:filter 0.25s,transform 0.2s}
/* Nom de l'app amb font serif elegant similar a la del logo */
.app-name{font-family:'Archivo Black','Arial Black',system-ui,sans-serif!important;font-size:2.9rem!important;font-weight:400!important;line-height:1;letter-spacing:-0.01em;display:inline-flex!important;align-items:baseline;white-space:nowrap;text-transform:uppercase}
.app-name .app-name-cat{font-size:0.42em;letter-spacing:0.02em;margin-left:0.12em;opacity:0.85}
.app-name-meteo{color:#283758}
.app-name-sep{color:#283758;margin:0 0.05em;font-weight:500}
.app-name-foto{color:#c6a877;font-weight:600}
/* Mode fosc: text "Meteo-" en clar */
[data-theme="dark"] .app-name-meteo,[data-theme="dark"] .app-name-sep{color:#e8edf5!important}
[data-theme="dark"] .app-name-foto{color:#d4b889!important}

/* ============= NAVEGACIÓ PHOTOPILLS-STYLE ============= */
.group-nav{display:flex;gap:0.3rem;background:rgba(26,34,51,0.97);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:0.85rem;padding:0.4rem;box-shadow:0 4px 14px rgba(0,0,0,0.35);margin-bottom:0.7rem;position:sticky;top:0.4rem;z-index:100}
:root:not(.dark) .group-nav{background:rgba(255,255,255,0.97)}
@media (max-width:360px){.group-tab{padding:0.55rem 0.12rem}.group-tab-icon{font-size:1.2rem}.group-tab-label{letter-spacing:0}.group-nav{gap:0.22rem;padding:0.32rem}}
.group-nav[hidden]{display:none}

/* === NAV DE PESTANYA (substitueix group-nav quan estàs dins una pestanya) === */
.page-nav{display:flex;align-items:stretch;gap:0.4rem;background:var(--card);border-radius:0.85rem;padding:0.4rem;box-shadow:var(--shadow);margin-bottom:0.7rem;position:sticky;top:0.4rem;z-index:100}
.page-nav[hidden]{display:none}
.page-nav-back{display:flex;align-items:center;gap:0.4rem;border:none;background:linear-gradient(135deg,#168aad 0%,#76c7d0 100%);color:white;padding:0.55rem 0.95rem;border-radius:0.7rem;cursor:pointer;font-weight:700;font-size:0.85rem;transition:all 0.18s ease;white-space:nowrap;flex-shrink:0;box-shadow:0 2px 8px rgba(22,138,173,0.4)}
.page-nav-back:hover{background:linear-gradient(135deg,#0f6a87 0%,#5db4be 100%);color:white;transform:translateX(-2px);box-shadow:0 4px 14px rgba(22,138,173,0.55)}
.page-nav-back-arrow{font-size:1.25rem;line-height:1}
.page-nav-back-label{font-size:0.82rem;letter-spacing:0.3px;text-transform:uppercase}
.page-nav-prev,.page-nav-next{display:inline-flex;align-items:center;justify-content:center;gap:0.3rem;border:none;background:var(--card-2);color:var(--text);padding:0.5rem 0.7rem;border-radius:0.65rem;cursor:pointer;transition:all 0.18s ease;flex-shrink:0;min-width:62px;font-size:0.95rem;line-height:1}
.page-nav-prev:hover,.page-nav-next:hover{background:linear-gradient(135deg,var(--primary),var(--accent));color:white}
.page-nav-prev[hidden],.page-nav-next[hidden]{visibility:hidden;display:inline-flex}
.page-nav-prev img,.page-nav-next img{width:1.2em;height:1.2em;object-fit:contain}
.page-nav-btn-label{font-size:0.82rem;font-weight:600;max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.page-nav-arrow{font-size:1.3rem;line-height:1;font-weight:600}
.page-nav-title{font-size:1.2rem;font-weight:700;padding:0.55rem 0.7rem;color:var(--text);display:flex;align-items:center;justify-content:center;line-height:1.2;background:linear-gradient(90deg,rgba(167,139,250,0.06),rgba(167,139,250,0.06));border-radius:0.55rem;letter-spacing:-0.2px;gap:0.45rem;min-width:0;flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-align:center}
.page-nav-title img{width:1.4em;height:1.4em;object-fit:contain;flex-shrink:0}
@media(max-width:600px){
  .page-nav{gap:0.3rem;padding:0.3rem}
  .page-nav-back{padding:0.45rem 0.7rem;font-size:0.78rem;gap:0.3rem}
  .page-nav-back-label{display:inline;font-size:0.7rem}
  .page-nav-back-arrow{font-size:1.3rem}
  .page-nav-prev,.page-nav-next{padding:0.4rem 0.5rem;min-width:50px;gap:0.2rem}
  .page-nav-prev img,.page-nav-next img{width:1em;height:1em}
  .page-nav-btn-label{display:none}
  .page-nav-title{font-size:1.05rem;padding:0.45rem 0.5rem}
}
@media(max-width:600px){
  .page-nav{padding:0.3rem;gap:0.35rem}
  .page-nav-back{padding:0.45rem 0.7rem}
  .page-nav-back-label{font-size:0.7rem}
  .page-nav-title{font-size:1.05rem;padding:0.4rem 0.55rem}
}
@media(max-width:380px){
  .page-nav-back-label{display:none}
}
.group-tab{flex:1 1 0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0.2rem;min-width:0;padding:0.6rem 0.2rem;border:none;background:transparent;border-radius:0.65rem;cursor:pointer;color:var(--muted);font-weight:700;transition:all 0.18s ease;min-height:54px}
.group-tab-icon{font-size:1.4rem;line-height:1}
.group-tab-label{font-size:clamp(0.6rem,3vw,0.78rem);letter-spacing:0.2px;text-transform:uppercase;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.group-tab-sublabel{font-size:0.62rem;letter-spacing:0.2px;color:var(--muted);font-weight:500;text-transform:none;line-height:1.1;margin-top:0.05rem;text-align:center;white-space:nowrap}
.group-tab.active .group-tab-sublabel{color:rgba(255,255,255,0.85)}
.group-tab:hover{background:var(--card-2);color:var(--text)}
.group-tab.active{background:linear-gradient(135deg,var(--primary) 0%,var(--accent) 100%);color:white;box-shadow:0 4px 12px rgba(22,138,173,0.25)}
.group-tab.active .group-tab-icon{transform:scale(1.1)}

@media(max-width:600px){
  .group-nav{padding:0.3rem;gap:0.3rem}
  .group-tab{padding:0.5rem 0.15rem;min-height:48px}   /* 21-09: menys marge lateral → més espai per al text amb 6 pestanyes */
  .group-tab-icon{font-size:1.2rem}
  .group-tab-label{font-size:0.72rem;letter-spacing:0.2px}
  .group-tab-sublabel{font-size:0.58rem;letter-spacing:0.1px}
}

/* === GRAELLA D'ICONES (vista del grup actiu) === */
.group-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(135px,180px));gap:0.7rem;padding:0.3rem 0;animation:gridFadeIn 0.3s ease;justify-content:center}
@keyframes gridFadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.group-grid[hidden]{display:none}
.group-grid-item{aspect-ratio:1;background:var(--card);border-radius:0.85rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0.55rem;padding:0.85rem;cursor:pointer;border:1px solid var(--border);transition:transform 0.2s,box-shadow 0.2s,border-color 0.2s;text-align:center;user-select:none;position:relative}
.group-grid-count{position:absolute;top:0.4rem;right:0.55rem;font-size:1.35rem;font-weight:800;color:var(--accent);line-height:1;text-shadow:0 1px 4px rgba(0,0,0,0.4);pointer-events:none}
@media (max-width:640px){.group-grid-count{font-size:1.1rem;top:0.3rem;right:0.45rem}}
.group-grid-item.needs-auth{opacity:0.7}
.group-grid-item.needs-auth:hover{opacity:1}
.group-grid-item-lock{position:absolute;top:0.3rem;left:0;right:0;font-size:0.62rem;opacity:0.9;display:flex;align-items:center;justify-content:center;gap:0.2rem;line-height:1;pointer-events:none;z-index:3}
[data-theme="dark"] .group-grid-item-lock{background:rgba(255,255,255,0.08)}
.group-grid-item:hover{transform:translateY(-3px);box-shadow:0 8px 18px rgba(0,0,0,0.1);border-color:var(--accent)}
.group-grid-item:active{transform:translateY(0);transition:transform 0.05s}
.group-grid-item-icon{font-size:2.4rem;line-height:1;filter:drop-shadow(0 2px 4px rgba(0,0,0,0.15))}
.group-grid-item-label{font-size:0.86rem;font-weight:600;color:var(--text);line-height:1.2}
.group-grid-item.special{background:var(--card);border-color:var(--border)}
.group-grid-item.special:hover{border-color:var(--accent)}
.group-grid-item.special .group-grid-item-icon{animation:none}
@keyframes specialPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}

/* Mini-eclipsi animat per a la card del menú de Guies: lluna passant per davant del sol */
.eclipse-icon-mini{position:relative;width:1em;height:1em;display:inline-block;overflow:visible}
.eim-corona{position:absolute;inset:-0.18em;border-radius:50%;background:radial-gradient(circle,rgba(255,224,168,0.4) 25%,rgba(255,167,38,0.12) 50%,transparent 65%);animation:eimCoronaPulse 4s ease-in-out infinite}
.eim-sun{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff8e1 0%,#ffd166 25%,#ffa726 55%,#ff7043 85%,#bf360c 100%);box-shadow:0 0 0.5em rgba(255,167,38,0.7),0 0 1em rgba(255,112,67,0.4)}
.eim-moon{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 30% 30%,#2a2a3e 0%,#0d0d1a 60%,#000 100%);box-shadow:inset -0.05em -0.05em 0.1em rgba(0,0,0,0.5);animation:eclipseIconTransit 6s ease-in-out infinite;z-index:2}
@keyframes eclipseIconTransit{0%{transform:translateX(-115%)}42%, 58%{transform:translateX(0)}92%, 100%{transform:translateX(115%)}}
@keyframes eimCoronaPulse{0%,100%{opacity:0.4;transform:scale(1)}50%{opacity:0.95;transform:scale(1.1)}}

/* === Animacions per als icons originals de Guies === */
.mf-fam-item{position:relative;overflow:hidden}
.group-grid-item.needs-auth{padding-top:1.4rem}
.mf-fam-item::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;border-radius:3px 3px 0 0}
.mf-fam-item.mf-fam-astro::before{background:linear-gradient(90deg,#a78bfa,#7c3aed)}
.mf-fam-item.mf-fam-meteo::before{background:linear-gradient(90deg,#38bdf8,#0ea5e9)}
.mf-fam-tag{position:absolute;bottom:0.3rem;right:0.4rem;font-size:0.7rem;opacity:0.8;line-height:1;z-index:2}
.mf-fam-chip{display:inline-flex;align-items:center;gap:0.2rem;font-size:0.68rem;font-weight:700;padding:0.08rem 0.4rem;border-radius:999px;vertical-align:middle}
.mf-fam-chip.mf-fam-astro{background:rgba(167,139,250,0.14);color:#a78bfa}
.mf-fam-chip.mf-fam-meteo{background:rgba(56,189,248,0.14);color:#38bdf8}
.mf-fam-btn-astro.active{background:linear-gradient(135deg,#a78bfa,#7c3aed)!important;border-color:#a78bfa!important}
.mf-fam-btn-meteo.active{background:linear-gradient(135deg,#38bdf8,#0ea5e9)!important;border-color:#38bdf8!important}
.group-grid-item-icon[data-anim]{transition:transform 0.2s}

/* Aurora 🌌 — glow verd-violeta pulsant */
.group-grid-item-icon[data-anim="aurora"]{animation:gAurora 3s ease-in-out infinite}
@keyframes gAurora{0%,100%{filter:drop-shadow(0 0 3px rgba(34,197,94,0.4))}50%{filter:drop-shadow(0 0 12px rgba(168,85,247,0.7))}}

/* Circumpolar 🌀 — rotació lenta */
.group-grid-item-icon[data-anim="circumpolar"]{animation:gCircumpolar 8s linear infinite}
@keyframes gCircumpolar{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}

/* Correfocs (SVG) — parpelleig vermell-taronja */
.group-grid-item-icon[data-anim="correfocs"]{animation:gCorrefocs 1.2s ease-in-out infinite}
@keyframes gCorrefocs{0%,100%{filter:drop-shadow(0 0 2px rgba(239,68,68,0.5))}50%{filter:drop-shadow(0 0 10px rgba(251,146,60,0.9));transform:scale(1.06)}}

/* Estrelles ✨ — twinkle (escala + opacitat) */
.group-grid-item-icon[data-anim="stars"]{animation:gStars 2.5s ease-in-out infinite}
@keyframes gStars{0%,100%{opacity:0.7;transform:scale(0.92);filter:drop-shadow(0 0 2px rgba(255,255,255,0.4))}50%{opacity:1;transform:scale(1.08);filter:drop-shadow(0 0 8px rgba(165,180,252,0.7))}}

/* Focs artificials 💥 — bouncing */
.group-grid-item-icon[data-anim="fireworks"]{animation:gFireworks 1.8s ease-in-out infinite}
@keyframes gFireworks{0%,100%{transform:scale(0.9)}25%{transform:scale(1.15)}50%{transform:scale(0.95)}75%{transform:scale(1.1)}}

/* Lightpainting 🌈 — hue-rotate */
.group-grid-item-icon[data-anim="lightpainting"]{animation:gLightpaint 4s linear infinite}
@keyframes gLightpaint{0%{filter:hue-rotate(0deg) drop-shadow(0 0 4px rgba(251,146,60,0.5))}100%{filter:hue-rotate(360deg) drop-shadow(0 0 4px rgba(251,146,60,0.5))}}

/* Llamps ⚡ — flash + glow groc */
.group-grid-item-icon[data-anim="lightning"]{animation:gLightning 2.5s ease-in-out infinite}
@keyframes gLightning{0%,80%,100%{filter:drop-shadow(0 0 2px rgba(251,191,36,0.4));transform:scale(1)}82%,86%{filter:drop-shadow(0 0 16px rgba(254,243,199,1)) brightness(1.4);transform:scale(1.15)}88%{filter:drop-shadow(0 0 4px rgba(251,191,36,0.6));transform:scale(1.05)}}

/* Meteo adversa 🌪️ — sacseig (shake) */
.group-grid-item-icon[data-anim="severeweather"]{animation:gSevereWeather 0.6s ease-in-out infinite;transform-origin:center bottom}
@keyframes gSevereWeather{0%,100%{transform:translateX(0) rotate(0deg)}25%{transform:translateX(-2px) rotate(-3deg)}75%{transform:translateX(2px) rotate(3deg)}}

/* Núvols ☁️ — flotació suau */
.group-grid-item-icon[data-anim="clouds"]{animation:gClouds 5s ease-in-out infinite}
@keyframes gClouds{0%,100%{transform:translateX(-3px)}50%{transform:translateX(3px)}}

/* Pluja de meteors ☄️ — trajectòria diagonal */
.group-grid-item-icon[data-anim="meteors"]{animation:gMeteors 2.5s ease-in-out infinite}
@keyframes gMeteors{0%,100%{transform:translate(2px,-2px) rotate(-15deg)}50%{transform:translate(-2px,2px) rotate(15deg) scale(1.05);filter:drop-shadow(0 0 8px rgba(251,191,36,0.7))}}

/* Via Làctia (SVG) — glow blau-violeta pulsant */
.group-grid-item-icon[data-anim="milkyway"]{animation:gMilkyway 4s ease-in-out infinite}
@keyframes gMilkyway{0%,100%{filter:drop-shadow(0 0 3px rgba(99,102,241,0.4))}50%{filter:drop-shadow(0 0 14px rgba(168,85,247,0.7))}}

/* === Animacions per al grup OPERATIU === */

/* Mapes 🗺️ — tilt subtil com si fos un mapa al vent */
.group-grid-item-icon[data-anim="map"]{animation:gMap 4s ease-in-out infinite;transform-origin:center}
@keyframes gMap{0%,100%{transform:rotate(-3deg) scale(1)}50%{transform:rotate(3deg) scale(1.04)}}

/* Setmana 📆 — flip subtil (passar pàgina) */
.group-grid-item-icon[data-anim="photo"]{animation:gPhoto 5s ease-in-out infinite;transform-origin:right center;perspective:200px}
@keyframes gPhoto{0%,40%,100%{transform:rotateY(0deg)}50%{transform:rotateY(-25deg)}60%{transform:rotateY(0deg)}}

/* Calendari lunar 🗓️ — pulsació suau amb glow blau */
.group-grid-item-icon[data-anim="mooncal"]{animation:gMooncal 3s ease-in-out infinite}
@keyframes gMooncal{0%,100%{filter:drop-shadow(0 0 2px rgba(99,168,255,0.3));transform:scale(1)}50%{filter:drop-shadow(0 0 10px rgba(99,168,255,0.6));transform:scale(1.05)}}

/* Ubicacions 📍 — pin caient (bouncing) */
.group-grid-item-icon[data-anim="locations"]{animation:gLocations 2s ease-in-out infinite;transform-origin:center bottom}
@keyframes gLocations{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}70%{transform:translateY(-1px)}}

/* Planificacions 📋 — oscil·lació subtil (com prendre apunts) */
.group-grid-item-icon[data-anim="planslog"]{animation:gPlans 3s ease-in-out infinite}
@keyframes gPlans{0%,100%{transform:rotate(0deg)}25%{transform:rotate(2deg) translateX(-1px)}75%{transform:rotate(-2deg) translateX(1px)}}

/* Galeria 📷 — flash de càmera periòdic */
.group-grid-item-icon[data-anim="gallery"]{animation:gGallery 4s ease-in-out infinite}
@keyframes gGallery{0%,80%,100%{filter:drop-shadow(0 0 2px rgba(125,125,125,0.3))}82%,86%{filter:drop-shadow(0 0 14px rgba(255,255,255,1)) brightness(1.4);transform:scale(1.08)}}

/* === Animacions per al grup RECURSOS === */

/* Hiperfocal 📐 — rotació subtil (compàs/triangle) */
.group-grid-item-icon[data-anim="hyperfocal"]{animation:gHyperfocal 6s ease-in-out infinite}
@keyframes gHyperfocal{0%,100%{transform:rotate(-8deg)}50%{transform:rotate(8deg)}}

/* Time-Lapse ⏱️ — rotació constant (cronòmetre) */
.group-grid-item-icon[data-anim="timelapse"]{animation:gTimelapse 4s linear infinite}
@keyframes gTimelapse{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}

/* Web en directe 📹 — gravant (red pulse) */
.group-grid-item-icon[data-anim="live-cams"]{animation:gLiveCams 1.5s ease-in-out infinite}
@keyframes gLiveCams{0%,100%{filter:drop-shadow(0 0 3px rgba(239,68,68,0.5))}50%{filter:drop-shadow(0 0 12px rgba(239,68,68,0.95));transform:scale(1.04)}}

/* Avisos ⚠️ — parpelleig urgent ambre */
.group-grid-item-icon[data-anim="alerts"]{animation:gAlerts 1s ease-in-out infinite}
@keyframes gAlerts{0%,100%{filter:drop-shadow(0 0 2px rgba(245,158,11,0.4))}50%{filter:drop-shadow(0 0 14px rgba(251,191,36,1));transform:scale(1.06)}}

/* Tallers 🎓 — bouncing (graduació) */
.group-grid-item-icon[data-anim="workshops"]{animation:gWorkshops 2.2s ease-in-out infinite;transform-origin:center bottom}
@keyframes gWorkshops{0%,100%{transform:translateY(0) rotate(0deg)}30%{transform:translateY(-3px) rotate(-3deg)}60%{transform:translateY(-3px) rotate(3deg)}}

/* Meteoròlegs TV3 (SVG) — glow blau (broadcast) */
.group-grid-item-icon[data-anim="tv3meteos"]{animation:gTv3 3s ease-in-out infinite}
@keyframes gTv3{0%,100%{filter:drop-shadow(0 0 2px rgba(14,165,233,0.4))}50%{filter:drop-shadow(0 0 12px rgba(56,189,248,0.8))}}

/* Fonts 🌐 — rotació lenta suau (globus) */
.group-grid-item-icon[data-anim="sources"]{animation:gSources 10s linear infinite}
@keyframes gSources{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}

/* Admin 👑 — golden glow + pulsació */
.group-grid-item-icon[data-anim="admin"]{animation:gAdmin 3s ease-in-out infinite}
@keyframes gAdmin{0%,100%{filter:drop-shadow(0 0 3px rgba(251,191,36,0.5));transform:scale(1)}50%{filter:drop-shadow(0 0 14px rgba(255,215,0,0.95));transform:scale(1.08)}}

/* Instal·lar app 📲 — bouncing + glow blau (com una notificació) */
.group-grid-item-icon[data-anim="install-app"]{animation:gInstallApp 2s ease-in-out infinite}
@keyframes gInstallApp{0%,100%{transform:translateY(0) scale(1);filter:drop-shadow(0 0 4px rgba(99,102,241,0.5))}50%{transform:translateY(-4px) scale(1.08);filter:drop-shadow(0 0 14px rgba(59,130,246,0.9))}}

/* Llanterna 🔦 — parpelleig groc/blanc com llanterna real */
.group-grid-item-icon[data-anim="flashlight"]{animation:gFlashlight 2.5s ease-in-out infinite}
@keyframes gFlashlight{0%,40%,100%{filter:drop-shadow(0 0 3px rgba(251,191,36,0.4))}50%,60%{filter:drop-shadow(0 0 18px rgba(255,255,255,0.95)) drop-shadow(0 0 10px rgba(251,191,36,0.85));transform:scale(1.06)}}

/* ============================================================ */
/* OVERLAY LLANTERNA FULLSCREEN                                  */
/* ============================================================ */
#flashlightOverlay{position:fixed;top:0;left:0;right:0;bottom:0;width:100vw;height:100vh;height:100dvh;z-index:99998;display:none;align-items:center;justify-content:center;transition:background-color 0.3s,filter 0.3s;cursor:pointer;user-select:none;-webkit-user-select:none;margin:0;padding:0;-webkit-touch-callout:none}
#flashlightOverlay.active{display:flex}
/* El botó tancar i controls SI respecten safe-areas perquè siguin visibles */
#flashlightControls{position:fixed;bottom:calc(24px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);background:rgba(0,0,0,0.78);backdrop-filter:blur(12px);border-radius:18px;padding:18px 22px;display:flex;flex-direction:column;gap:12px;min-width:360px;max-width:min(560px,95vw);box-shadow:0 10px 36px rgba(0,0,0,0.6);transition:opacity 0.3s,transform 0.3s;color:white;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;z-index:10}
#flashlightControls.hidden{opacity:0;transform:translateX(-50%) translateY(20px);pointer-events:none}
.fl-row{display:flex;align-items:center;gap:12px}
.fl-row label{font-size:0.92rem;color:rgba(255,255,255,0.92);min-width:96px;font-weight:600}
.fl-row input[type="range"]{flex:1;-webkit-appearance:none;height:8px;background:rgba(255,255,255,0.2);border-radius:4px;outline:none}
.fl-row input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;background:#fbbf24;border-radius:50%;cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,0.5)}
.fl-row input[type="range"]::-moz-range-thumb{width:26px;height:26px;background:#fbbf24;border-radius:50%;cursor:pointer;border:none}
.fl-row .fl-val{font-size:0.9rem;color:rgba(255,255,255,0.85);min-width:52px;text-align:right;font-variant-numeric:tabular-nums;font-weight:600}
.fl-colors{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.fl-color-btn{flex:1;min-width:80px;padding:11px 14px;border:2px solid rgba(255,255,255,0.25);border-radius:10px;background:rgba(255,255,255,0.08);color:white;cursor:pointer;font-size:0.95rem;font-weight:600;display:flex;align-items:center;justify-content:center;gap:6px;transition:all 0.18s}
.fl-color-btn.active{border-color:#fbbf24;background:rgba(251,191,36,0.22)}
.fl-color-btn:hover:not(.active){background:rgba(255,255,255,0.15)}

/* Botó "Color personalitzat" amb picker RGB (segona fila) */
.fl-colors-custom-row{display:flex;justify-content:center;position:relative}
.fl-color-btn-custom{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;max-width:280px}
.fl-color-preview{width:24px;height:24px;border-radius:6px;border:1px solid rgba(255,255,255,0.35);flex-shrink:0;box-shadow:inset 0 1px 2px rgba(0,0,0,0.3);background:#00ff88;transition:background 0.18s}
.fl-color-btn-custom:hover .fl-color-preview{transform:scale(1.06)}
/* Input color amagat però accessible — el botó l'activa programàticament */
#flCustomColor{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px;border:none;padding:0;margin:0}

/* Parpelleig — botó toggle amb 3 modes (off/lent/ràpid) */
.fl-blink-row{display:flex;justify-content:center}
.fl-blink-btn{display:flex;align-items:center;gap:10px;padding:11px 18px;border-radius:10px;background:rgba(255,255,255,0.08);border:2px solid rgba(255,255,255,0.25);color:white;cursor:pointer;font-size:0.95rem;font-weight:600;transition:all 0.2s;font-family:inherit}
.fl-blink-btn:hover{background:rgba(255,255,255,0.15)}
.fl-blink-btn[data-mode="slow"]{border-color:#fbbf24;background:rgba(251,191,36,0.18)}
.fl-blink-btn[data-mode="fast"]{border-color:#ef4444;background:rgba(239,68,68,0.2)}
.fl-blink-dot{width:11px;height:11px;border-radius:50%;background:rgba(255,255,255,0.3);flex-shrink:0;transition:background 0.2s}
.fl-blink-btn[data-mode="slow"] .fl-blink-dot{background:#fbbf24;animation:flBlinkDot 1.2s infinite}
.fl-blink-btn[data-mode="fast"] .fl-blink-dot{background:#ef4444;animation:flBlinkDot 0.4s infinite}
@keyframes flBlinkDot{0%,49%{opacity:1}50%,100%{opacity:0.2}}
.fl-blink-label strong{font-weight:700;letter-spacing:0.04em}

/* Files de Temporitzador i Alarma al panell de controls */
.fl-tool-row{display:flex;align-items:center;gap:10px;padding:6px 0}
.fl-tool-icon{font-size:1.4rem;width:30px;text-align:center;flex-shrink:0}
.fl-tool-num{width:64px;background:rgba(255,255,255,0.1);border:1px solid rgba(255,255,255,0.25);color:white;border-radius:8px;padding:9px 10px;font-size:1.05rem;text-align:center;font-variant-numeric:tabular-nums;-moz-appearance:textfield;font-weight:600}
.fl-tool-num::-webkit-outer-spin-button,.fl-tool-num::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.fl-tool-sep{color:rgba(255,255,255,0.5);font-weight:700;font-size:1.1rem}
.fl-tool-time{flex:1;background:rgba(255,255,255,0.1);border:1px solid rgba(255,255,255,0.25);color:white;border-radius:8px;padding:9px 10px;font-size:1.05rem;font-variant-numeric:tabular-nums;color-scheme:dark;font-weight:600}
.fl-tool-btn{padding:10px 18px;background:rgba(251,191,36,0.22);border:1px solid rgba(251,191,36,0.5);color:#fde68a;border-radius:8px;font-size:0.92rem;font-weight:700;cursor:pointer;flex-shrink:0;letter-spacing:0.02em;transition:all 0.18s;min-width:100px}
.fl-tool-btn:hover{background:rgba(251,191,36,0.35);color:#fef3c7}
.fl-tool-btn-stop{background:rgba(239,68,68,0.22) !important;border-color:rgba(239,68,68,0.55) !important;color:#fca5a5 !important}
.fl-tool-btn-stop:hover{background:rgba(239,68,68,0.4) !important;color:white !important}

@media (max-width:480px){
  #flashlightControls{min-width:auto;width:calc(100% - 32px);bottom:16px;padding:14px 16px}
  .fl-row label{min-width:80px;font-size:0.85rem}
  .fl-tool-btn{min-width:88px;padding:9px 12px;font-size:0.85rem}
  .fl-tool-num{width:54px;font-size:0.95rem}
}

/* Chips dinàmics dins llanterna (sota cronòmetre) — GRANS i verticals, igual amplada que cronòmetre */
.fl-chips{display:flex;flex-direction:column;align-items:center;gap:1.2rem;margin-top:1.8rem;pointer-events:auto}
.fl-chip{display:inline-flex;align-items:center;justify-content:center;gap:0.8rem;padding:0.4rem 1.5rem;border-radius:18px;font-size:7rem;font-weight:200;font-family:inherit;background:rgba(0,0,0,0.18);backdrop-filter:blur(6px);font-variant-numeric:tabular-nums;letter-spacing:0.04em;line-height:1.05;min-width:auto;color:rgba(255,255,255,0.55)}
.fl-chip-icon{font-size:0.6em;opacity:0.7;line-height:1}
.fl-chip-text{line-height:1}
.fl-chip-timer{border:1px solid rgba(251,191,36,0.4);color:#fde68a}
.fl-chip-alarm{border:1px solid rgba(96,165,250,0.4);color:#bfdbfe}
.fl-chip-stop{background:rgba(255,255,255,0.18);border:none;color:white;width:44px;height:44px;border-radius:50%;cursor:pointer;font-size:1.3rem;display:flex;align-items:center;justify-content:center;padding:0;line-height:1;font-weight:300;flex-shrink:0;transition:all 0.18s;margin-left:0.5rem}
.fl-chip-stop:hover{background:rgba(239,68,68,0.7);transform:scale(1.08)}
@media (max-width:700px){
  .fl-chip{font-size:4.5rem;padding:0.3rem 1.1rem;gap:0.6rem}
  .fl-chip-stop{width:36px;height:36px;font-size:1.1rem}
  .fl-chips{gap:0.9rem;margin-top:1.3rem}
}
@media (max-width:480px){
  .fl-chip{font-size:3.2rem;padding:0.2rem 0.9rem;gap:0.5rem}
  .fl-chip-stop{width:32px;height:32px;font-size:1rem}
  .fl-chips{gap:0.7rem;margin-top:1rem}
}
@media (max-width:380px){
  .fl-chip{font-size:2.8rem}
}

.fl-close{position:fixed;top:calc(22px + env(safe-area-inset-top));left:50%;transform:translateX(-50%);background:rgba(0,0,0,0.45);color:rgba(255,255,255,0.92);border:1.5px solid rgba(255,255,255,0.4);height:52px;padding:0 22px 0 16px;border-radius:26px;cursor:pointer;font-size:1.05rem;font-weight:600;display:flex;align-items:center;gap:10px;backdrop-filter:blur(10px);box-shadow:0 6px 20px rgba(0,0,0,0.45);z-index:10;letter-spacing:0.02em;transition:opacity 0.2s,background 0.2s,transform 0.15s;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif}
.fl-close:hover{background:rgba(0,0,0,0.7);color:white;border-color:rgba(255,255,255,0.6);transform:translateX(-50%) scale(1.04)}
.fl-close-x{font-size:1.6rem;line-height:1;font-weight:300;opacity:1}
@media (max-width:480px){
  .fl-close{height:46px;padding:0 18px 0 14px;font-size:0.95rem;border-radius:23px}
  .fl-close-x{font-size:1.45rem}
}
.fl-hint{font-size:0.7rem;color:rgba(255,255,255,0.55);text-align:center;margin-top:2px}

/* Display central — 4 elements alineats verticalment, MATEIX estil uniforme premium */
.fl-info{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;mix-blend-mode:difference;font-family:-apple-system,BlinkMacSystemFont,'SF Mono',Menlo,monospace;font-variant-numeric:tabular-nums;pointer-events:none;z-index:5;letter-spacing:0.02em;width:100%;max-width:min(580px,92vw);padding:0 0.5rem;box-sizing:border-box;display:flex;flex-direction:column;gap:0.55rem}

/* CAIXA UNIFORME: tots iguals (border, fons, ombra, radius) */
.fl-display{display:flex;align-items:center;gap:0.6rem;padding:0.5rem 0.9rem;border-radius:16px;width:100%;box-sizing:border-box;pointer-events:auto;background:rgba(0,0,0,0.28);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,0.14);box-shadow:0 4px 20px rgba(0,0,0,0.35),inset 0 1px 0 rgba(255,255,255,0.04);min-height:88px;color:rgba(255,255,255,0.62)}
/* L'hora té el mateix contorn però sense pointer-events (no interactiu) */
.fl-display.fl-display-clock{pointer-events:none;color:rgba(255,255,255,0.5)}
.fl-display.fl-display-timer{color:#fde68a}
.fl-display.fl-display-alarm{color:#bfdbfe}

/* L'icona té amplada FIXA igual a la dels botons → valor queda centrat */
.fl-icon{font-size:3rem;line-height:1;flex-shrink:0;opacity:0.75;width:108px;text-align:left;padding-left:0.4rem}
/* Valor centrat al mig de la caixa */
.fl-value{font-size:4.2rem;font-weight:200;line-height:1;letter-spacing:0.04em;flex:1;text-align:center;font-variant-numeric:tabular-nums}
.fl-value-input{font-size:4.2rem;font-weight:200;line-height:1;letter-spacing:0.04em;flex:1;text-align:center;text-align-last:center;font-variant-numeric:tabular-nums;background:transparent;border:none;color:inherit;font-family:inherit;outline:none;padding:0;-webkit-appearance:none;color-scheme:dark;width:100%;cursor:pointer;border-radius:6px;transition:background 0.15s;min-width:0;display:block}
.fl-value-input:hover{background:rgba(255,255,255,0.06)}
.fl-value-input:focus{background:rgba(255,255,255,0.12);outline:1px solid rgba(255,255,255,0.3)}
/* Amagar el botó del calendar picker per a inputs time perquè no desplaci el text */
.fl-value-input::-webkit-calendar-picker-indicator{display:none;-webkit-appearance:none;opacity:0;width:0;padding:0;margin:0}
/* Per a iOS Safari, el text del time input pot quedar a l'esquerra. Forçar centrat absolut: */
input.fl-value-input[type="time"]{padding-left:0;padding-right:0;text-indent:0}
input.fl-value-input[type="time"]::-webkit-date-and-time-value{text-align:center;margin:0}

/* Botons amb amplada FIXA per simetria (igual que .fl-icon) */
.fl-display-btns{display:flex;align-items:center;gap:0.4rem;flex-shrink:0;width:108px;justify-content:flex-end;padding-right:0.4rem}
.fl-mini-btn{background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.22);color:rgba(255,255,255,0.7);cursor:pointer;width:46px;height:46px;font-size:1.1rem;padding:0;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all 0.18s;font-weight:300;font-family:inherit;backdrop-filter:blur(2px)}
.fl-mini-btn:hover{background:rgba(255,255,255,0.2);color:white;transform:scale(1.08)}
.fl-mini-btn:active{transform:scale(0.92)}
.fl-mini-btn.active{background:rgba(239,68,68,0.4);border-color:rgba(239,68,68,0.6);color:white}

@media (max-width:700px){
  .fl-info{max-width:96vw;gap:0.45rem}
  .fl-display{padding:0.35rem 0.7rem;gap:0.45rem;min-height:70px;border-radius:14px}
  .fl-icon{font-size:2rem;width:80px}
  .fl-value,.fl-value-input{font-size:2.7rem}
  .fl-mini-btn{width:38px;height:38px;font-size:0.95rem}
  .fl-display-btns{width:80px}
}
@media (max-width:480px){
  .fl-display{padding:0.3rem 0.55rem;min-height:58px;gap:0.35rem}
  .fl-icon{font-size:1.65rem;width:64px;padding-left:0.2rem}
  .fl-value,.fl-value-input{font-size:2.1rem}
  .fl-mini-btn{width:34px;height:34px;font-size:0.88rem}
  .fl-display-btns{width:64px;padding-right:0.2rem}
}
@media (max-width:380px){
  .fl-icon{font-size:1.4rem;width:56px}
  .fl-value,.fl-value-input{font-size:1.75rem}
  .fl-mini-btn{width:30px;height:30px;font-size:0.78rem}
  .fl-display-btns{width:56px}
}
@media (max-width:480px){
  #flashlightControls{min-width:auto;width:calc(100% - 40px);bottom:16px;padding:12px}
  .fl-row label{min-width:65px;font-size:0.74rem}
}

/* Pausar TOTES les animacions de icons si l'usuari té reduced-motion */
@media (prefers-reduced-motion: reduce){
  .group-grid-item-icon[data-anim]{animation:none!important}
  .eim-moon,.eim-corona{animation:none!important}
}

@media(max-width:600px){
  .group-grid{grid-template-columns:repeat(auto-fit,minmax(105px,1fr));gap:0.5rem}
  .group-grid-item{padding:0.65rem;border-radius:0.7rem;gap:0.4rem}
  .group-grid-item-icon{font-size:2rem}
  .group-grid-item-label{font-size:0.78rem}
}

/* === BOTÓ TORNAR AL MENÚ (visible només dins una pestanya) === */
.back-to-grid{display:inline-flex;align-items:center;gap:0.35rem;background:transparent;border:1px solid var(--border);color:var(--muted);padding:0.4rem 0.85rem;border-radius:0.5rem;margin-bottom:0.6rem;cursor:pointer;font-size:0.85rem;font-weight:600;transition:all 0.15s}
.back-to-grid:hover{background:var(--card-2);color:var(--text);border-color:var(--accent)}
.back-arrow{font-size:1.2rem;line-height:1;font-weight:300}
.back-to-grid[hidden]{display:none}
.page-context-title{font-size:1.05rem;font-weight:700;margin:0;color:var(--primary);letter-spacing:-0.2px;line-height:1.25}
.page-context-desc{font-size:0.8rem;margin:0.15rem 0 0;color:var(--muted);line-height:1.4;font-weight:400}
.page-context-desc:empty{display:none}
.tab-hero-card-hidden{display:none !important}
/* Mòbil: header més compacte i respirat */
@media(max-width:600px){
  .header-bar{flex-wrap:wrap!important;gap:0.4rem 0.5rem;margin-bottom:0.5rem;padding:0.25rem 0;align-items:center;justify-content:space-between}
  .header-right{flex-wrap:wrap;justify-content:flex-end;row-gap:0.3rem;max-width:100%}
  .app-title{flex:1 1 auto;min-width:0;gap:0.4rem!important}
  .app-name{font-size:1.35rem!important;flex-shrink:1;min-width:0;overflow:hidden;text-overflow:ellipsis}
  .app-icon{height:40px!important;flex-shrink:0}
  .header-right{flex-shrink:1;gap:0.4rem!important;align-items:center;min-width:0}
  /* Botó Manual: només emoji 📖 al mòbil (sense text "Manual") */
  .header-btn-text{display:none}
  #manualBtn{padding:0.4rem 0.55rem!important;font-size:1rem!important;min-width:36px;display:inline-flex;align-items:center;justify-content:center}
  /* Theme toggle: igual mida que els altres botons */
  .theme-toggle{padding:0.3rem 0.45rem!important;font-size:0.95rem!important;width:36px;height:36px}
  /* Auth: amaga el text del nom/email, deixa només check + caret + avatar */
  .auth-status{padding:0.3rem 0.5rem!important;gap:0.35rem!important}
  .auth-status .email{display:none}
  .auth-user-btn{padding:0.25rem 0.4rem!important;font-size:0.78rem!important;gap:0.3rem!important}
  .auth-user-btn .email{display:none}
  .auth-user-caret{display:none}
  .auth-status-login{padding:0.35rem 0.7rem!important;font-size:0.78rem!important}
  .auth-status-user{padding:0.3rem 0.55rem!important;font-size:0.75rem!important;max-width:none}
  .auth-modal-icon{width:140px!important;height:auto!important}
  .auth-modal-name-text{font-size:2.6rem!important}
  .page-context{margin:0.1rem auto 0.35rem}
  .page-context-title{font-size:0.95rem}
  .page-context-desc{font-size:0.75rem}
}
@media(max-width:380px){
  .app-name{font-size:1.15rem!important}
  .app-icon{height:34px!important}
  .header-right{gap:0.25rem!important}
  /* Mòbils molt estrets: mai controls fora de pantalla — es plega en 2 files */
  .header-bar{flex-wrap:wrap!important;justify-content:center}
  .header-right{flex-wrap:wrap;justify-content:center}
  #manualBtn,.theme-toggle{width:34px;height:34px;min-width:34px;padding:0.25rem!important}
}
/* ============================================================
   FIX MÒBIL (v2026-05-14-13h00 → 13h30) — el hack anterior amb
   font-size:0 + ::before mostrava DOS cadenats en iOS Safari
   perquè els emojis ignoren font-size:0 (es renderitzen amb font
   de sistema). Solució neta: el text "Inicia sessió" està ara
   dins una <span class="login-text-full"> que amaguem amb
   display:none en mòbil. El "🔓" queda com a text directe al botó.
   ============================================================ */
@media(max-width:480px){
  .auth-status-login{
    padding:0.4rem 0.65rem!important;
    font-size:1.1rem!important;
    line-height:1!important;
    min-width:40px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }
  .auth-status-login .login-text-full{display:none!important}
  /* Amagar badge "X connectat" — informació no crítica en mòbil,
     accessible igualment via pestanya Admin per a admins */
}
@media(max-width:380px){
  /* Salvaguarda extra a pantalles ultra-petites: limitar amplada
     del títol perquè mai empenyi els botons fora del viewport */
  .app-name{max-width:50vw}
}

/* === BADGES "GRATIS" === */
.free-badge{display:inline-block;background:linear-gradient(135deg,#10b981,#059669);color:white;font-size:0.62rem;font-weight:800;padding:0.12rem 0.4rem;border-radius:0.6rem;margin-left:0.35rem;text-transform:uppercase;letter-spacing:0.6px;vertical-align:middle;box-shadow:0 1px 3px rgba(16,185,129,0.3)}
.free-alert{background:linear-gradient(135deg,rgba(16,185,129,0.15),rgba(5,150,105,0.08));border:1px solid rgba(16,185,129,0.35);border-radius:0.55rem;padding:0.7rem 0.9rem;margin:0.6rem 0;font-size:0.86rem;color:var(--text);line-height:1.45;display:flex;align-items:center;gap:0.55rem;position:relative;overflow:hidden}
.free-alert::before{content:"🎁";font-size:1.3rem;flex-shrink:0;animation:freeGiftBounce 3s ease-in-out infinite}
@keyframes freeGiftBounce{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-2px) rotate(-8deg)}}
.free-alert strong{color:#10b981}

/* ===== ECLIPSI 12-08-2026 ===== */
.tab-btn.tab-special{background:linear-gradient(135deg,rgba(255,193,7,0.15),rgba(255,87,34,0.18))!important;border:1px solid rgba(255,193,7,0.55)!important;color:#ffa726!important;font-weight:700;animation:tabSpecialPulse 2.5s infinite}
.tab-btn.tab-special.active{background:linear-gradient(135deg,#ff9800,#ff5722)!important;color:white!important;border-color:#ff9800!important;animation:none}
@keyframes tabSpecialPulse{0%,100%{box-shadow:0 0 0 0 rgba(255,152,0,0.4)}50%{box-shadow:0 0 0 6px rgba(255,152,0,0)}}

.eclipse-hero{position:relative;overflow:hidden;background:linear-gradient(135deg,#0a0a1f 0%,#16213e 45%,#1a1a2e 70%,#3d2616 100%);color:white;padding:2rem 1.5rem;border:none}
/* Estrelles ambient com a la resta de guies */
.eclipse-hero::before{content:"";position:absolute;inset:0;background:radial-gradient(2px 2px at 12% 18%,#fff,transparent),radial-gradient(1px 1px at 28% 62%,#fff,transparent),radial-gradient(1px 1px at 45% 35%,#fff,transparent),radial-gradient(2px 2px at 62% 78%,#fff,transparent),radial-gradient(1px 1px at 80% 22%,#fff,transparent),radial-gradient(1px 1px at 92% 55%,#fff,transparent),radial-gradient(1px 1px at 8% 88%,#fff,transparent),radial-gradient(2px 2px at 35% 12%,#ffd166,transparent),radial-gradient(1px 1px at 70% 50%,#ffd166,transparent);opacity:0.4;pointer-events:none;animation:eclipseStarTwinkle 6s ease-in-out infinite}
@keyframes eclipseStarTwinkle{0%,100%{opacity:0.35}50%{opacity:0.6}}
/* === ECLIPSI: SOL + LLUNA ANIMATS === */
.eclipse-stage{position:absolute;top:50%;right:-30px;transform:translateY(-50%);width:280px;height:280px;pointer-events:none;opacity:0.85;z-index:0}
.eclipse-corona{position:absolute;inset:-40px;border-radius:50%;background:radial-gradient(circle,rgba(255,224,168,0.25) 25%,rgba(255,167,38,0.1) 50%,transparent 65%);animation:eclipseCoronaPulse 6s ease-in-out infinite}
.eclipse-sun{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff8e1 0%,#ffe0a8 20%,#ffa726 50%,#ff7043 80%,#bf360c 100%);box-shadow:0 0 60px rgba(255,167,38,0.55),0 0 120px rgba(255,112,67,0.3)}
.eclipse-moon{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 30% 30%,#2a2a3e 0%,#0d0d1a 60%,#000 100%);box-shadow:0 0 25px rgba(0,0,0,0.7),inset -8px -8px 20px rgba(0,0,0,0.5);animation:eclipseTransit 45s ease-in-out infinite}
@keyframes eclipseTransit{
  0%{transform:translateX(-140%)}
  35%, 55%{transform:translateX(0)}
  90%, 100%{transform:translateX(140%)}
}
@keyframes eclipseCoronaPulse{0%,100%{opacity:0.5;transform:scale(1)}50%{opacity:0.95;transform:scale(1.08)}}
.eclipse-hero-content{position:relative;z-index:1}
.eclipse-hero h2{color:white;margin-bottom:0.5rem;font-size:1.45rem}
.eclipse-hero p{color:rgba(255,255,255,0.9);font-size:0.95rem;line-height:1.5;margin-bottom:1.2rem;max-width:90%}
.eclipse-hero p strong{color:#ffa726}

/* === METEORS: ESTRELLES FUGACES === */
.meteor-hero{position:relative;overflow:hidden}
.meteor-rain{position:absolute;inset:0;pointer-events:none;z-index:0}
.shooting-star{position:absolute;width:90px;height:1px;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,0.5) 60%,rgba(180,200,255,0.85) 95%,transparent 100%);opacity:0;transform:rotate(-22deg);filter:drop-shadow(0 0 2px rgba(180,200,255,0.6));border-radius:1px}
.shooting-star::after{content:"";position:absolute;right:-1px;top:-1.5px;width:4px;height:4px;border-radius:50%;background:#fff;box-shadow:0 0 6px #fff,0 0 12px rgba(180,200,255,0.7)}
.shooting-star:nth-child(1){top:18%;left:-100px;animation:shoot 11s 1s infinite}
.shooting-star:nth-child(2){top:48%;left:-100px;animation:shoot 13s 5s infinite;width:70px}
.shooting-star:nth-child(3){top:72%;left:-100px;animation:shoot 9s 7.5s infinite;width:110px}
.shooting-star:nth-child(4){top:32%;left:-100px;animation:shoot 14s 11s infinite;width:80px}
@keyframes shoot{
  0%, 70%{opacity:0;transform:translate(0,0) rotate(-22deg)}
  72%{opacity:0.9}
  88%{opacity:0.7}
  96%, 100%{opacity:0;transform:translate(140vw,55vw) rotate(-22deg)}
}

/* === LLAMPS: FLASH OCASIONAL + BOLT === */
.lightning-hero{position:relative;overflow:hidden}
.lightning-flash{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 80% 100% at 35% 0%,rgba(220,210,255,0.55) 0%,rgba(180,160,255,0.25) 35%,transparent 65%);opacity:0;animation:lightningFlash 13s infinite;mix-blend-mode:screen}
.lightning-bolt{position:absolute;top:-12px;right:8%;width:42px;height:84px;opacity:0;pointer-events:none;filter:drop-shadow(0 0 8px rgba(220,210,255,0.85));animation:lightningBolt 13s infinite}
@keyframes lightningFlash{
  0%, 78%{opacity:0}
  78.3%{opacity:0.85}
  78.8%{opacity:0.15}
  79.2%{opacity:0.7}
  79.8%{opacity:0}
  82%, 100%{opacity:0}
}
@keyframes lightningBolt{
  0%, 78%{opacity:0;transform:translateY(-4px)}
  78.3%{opacity:0.95;transform:translateY(0)}
  79.2%{opacity:0.6;transform:translateY(0)}
  79.8%, 100%{opacity:0;transform:translateY(0)}
}

/* === RESPECTAR PREFERÈNCIA REDUCED-MOTION === */
@media (prefers-reduced-motion: reduce){
  .eclipse-moon,.eclipse-corona,.shooting-star,.lightning-flash,.lightning-bolt,.fw-particle,.cp-arc,.mw-band,.mw-star{animation:none !important}
  .lightning-flash,.lightning-bolt,.shooting-star,.fw-particle{opacity:0 !important}
  .eclipse-moon{transform:translateX(0) !important;opacity:0.6}
  .mw-band{opacity:0.7}
  .mw-star{opacity:0.7}
}
.eclipse-countdown{display:flex;gap:0.7rem;flex-wrap:wrap}
.ec-cd-item{background:rgba(255,255,255,0.1);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,0.2);border-radius:0.7rem;padding:0.7rem 0.9rem;text-align:center;min-width:70px}
.ec-cd-num{font-size:1.6rem;font-weight:800;color:#ffa726;line-height:1;font-variant-numeric:tabular-nums}
.ec-cd-lbl{font-size:0.68rem;color:rgba(255,255,255,0.75);text-transform:uppercase;letter-spacing:1px;margin-top:0.3rem}

.ec-facts-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:0.6rem}
.ec-fact{background:var(--card-2);padding:0.7rem;border-radius:0.6rem;text-align:center}
.ec-fact-lbl{font-size:0.72rem;color:var(--muted);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:0.3rem}
.ec-fact-val{font-size:1rem;font-weight:700;color:var(--text)}

.ec-cities-table{width:100%;border-collapse:collapse;font-size:0.86rem}
.ec-cities-table th,.ec-cities-table td{padding:0.5rem 0.6rem;text-align:left;border-bottom:1px solid var(--border);white-space:nowrap}
.ec-cities-table th{background:var(--card-2);font-weight:600;font-size:0.78rem;color:var(--muted);text-transform:uppercase;letter-spacing:0.3px}
.ec-cities-table tr:hover td{background:rgba(22,138,173,0.06)}
.ec-pill{display:inline-block;padding:0.1rem 0.5rem;border-radius:0.6rem;font-size:0.72rem;font-weight:700}
.ec-pill.total{background:rgba(255,152,0,0.18);color:#ff9800;border:1px solid rgba(255,152,0,0.4)}
.ec-pill.partial{background:rgba(120,120,120,0.18);color:var(--muted);border:1px solid var(--border)}

.ec-phase-grid{display:grid;grid-template-columns:1fr;gap:0.8rem}
.ec-phase{background:var(--card-2);padding:0.9rem 1rem;border-radius:0.6rem;border-left:3px solid var(--accent)}
.ec-phase.ec-phase-totality{border-left-color:#ff9800;background:linear-gradient(135deg,rgba(255,152,0,0.06),rgba(255,87,34,0.04))}
.ec-phase-title{font-size:1rem;font-weight:700;margin-bottom:0.6rem;color:var(--text)}
.ec-list{list-style:none;padding:0;margin:0}
.ec-list li{padding:0.35rem 0 0.35rem 1.4rem;position:relative;line-height:1.55;font-size:0.88rem}
.ec-list li::before{content:'▸';position:absolute;left:0.3rem;color:var(--accent);font-weight:700}
.ec-list li strong{color:var(--text)}

.ec-gear-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:0.7rem}
.ec-gear{background:var(--card-2);padding:0.9rem;border-radius:0.6rem;border:1px solid var(--border);position:relative;transition:transform 0.15s}
.ec-gear:hover{transform:translateY(-2px);border-color:var(--accent)}
.ec-gear-icon{font-size:1.7rem;line-height:1;margin-bottom:0.3rem}
.ec-gear-name{font-weight:700;font-size:0.92rem;margin-bottom:0.3rem;color:var(--text)}
.ec-gear-desc{font-size:0.8rem;color:var(--muted);line-height:1.45}
.ec-gear-price{font-size:0.78rem;color:var(--accent);font-weight:600;margin-top:0.4rem}

/* ===== LLAMPS ===== */
.lit-config-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:0.6rem}
.lit-cfg{background:var(--card-2);padding:0.8rem 0.9rem;border-radius:0.5rem;border-left:3px solid #a78bfa}
.lit-cfg-key{font-size:0.78rem;color:var(--muted);text-transform:uppercase;letter-spacing:0.4px;font-weight:600;margin-bottom:0.2rem}
.lit-cfg-val{font-size:1.05rem;font-weight:700;color:var(--text);margin-bottom:0.3rem}
.lit-cfg-note{font-size:0.82rem;color:var(--muted);line-height:1.45}

.lit-rules{display:flex;flex-direction:column;gap:0.55rem}
.lit-rule{display:flex;gap:0.8rem;background:var(--card-2);padding:0.7rem 0.9rem;border-radius:0.55rem;border-left:3px solid var(--accent);align-items:flex-start}
.lit-rule:nth-child(1){border-left-color:#52b788}
.lit-rule:nth-child(2){border-left-color:#ffd166}
.lit-rule:nth-child(3){border-left-color:#e76f51}
.lit-rule-icon{font-size:1.5rem;line-height:1;flex-shrink:0;padding-top:0.15rem}
.lit-rule-body{flex:1;min-width:0}
.lit-rule-title{font-weight:600;color:var(--text);margin-bottom:0.2rem;font-size:0.92rem}
.lit-rule-action{font-size:1rem;font-weight:700;color:var(--accent);margin-bottom:0.2rem}
.lit-rule-detail{font-size:0.82rem;color:var(--muted);line-height:1.45}

.lit-detector-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:0.6rem}
.lit-detector{background:var(--card-2);padding:0.8rem;border-radius:0.55rem;border:1px solid var(--border)}
.lit-detector-name{font-weight:700;font-size:0.95rem;margin-bottom:0.25rem;color:var(--text)}
.lit-detector-price{font-size:0.78rem;color:#a78bfa;font-weight:700;margin-bottom:0.4rem}
.lit-detector-desc{font-size:0.83rem;color:var(--muted);line-height:1.45}

.lit-comp-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:0.45rem}
.lit-comp{background:var(--card-2);padding:0.55rem 0.75rem;border-radius:0.45rem;font-size:0.86rem;color:var(--text);line-height:1.45;border-left:2px solid var(--accent)}

.lit-apps-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:0.55rem}
.lit-app{background:var(--card-2);padding:0.7rem 0.8rem;border-radius:0.5rem;border:1px solid var(--border)}
.lit-app-name{font-size:0.92rem;margin-bottom:0.25rem;color:var(--text)}
.lit-app-desc{font-size:0.82rem;color:var(--muted);line-height:1.45;margin-bottom:0.35rem}
.lit-app-link{font-size:0.78rem;color:var(--accent);text-decoration:none;font-family:monospace}
.lit-app-link:hover{text-decoration:underline}

/* ===== METEORS GUIA ===== */
.met-rules{display:flex;flex-direction:column;gap:0.55rem}
.met-rule{display:flex;gap:0.8rem;background:var(--card-2);padding:0.7rem 0.9rem;border-radius:0.55rem;border-left:3px solid var(--accent);align-items:flex-start}
.met-rule-icon{font-size:1.5rem;line-height:1;flex-shrink:0;padding-top:0.15rem}
.met-rule-body{flex:1;min-width:0}
.met-rule-title{font-weight:600;color:var(--text);margin-bottom:0.2rem;font-size:0.92rem}
.met-rule-detail{font-size:0.84rem;color:var(--muted);line-height:1.5}
.met-steps{display:flex;flex-direction:column;gap:0.5rem;counter-reset:metstep}
.met-step{display:flex;gap:0.7rem;align-items:flex-start;background:var(--card-2);padding:0.65rem 0.9rem;border-radius:0.5rem;font-size:0.88rem;line-height:1.5}
.met-step-n{flex-shrink:0;width:1.6rem;height:1.6rem;border-radius:50%;background:linear-gradient(135deg,#a78bfa,#7c3aed);color:white;display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:0.85rem}

/* === TAULA AURORA === */
.aurora-table{width:100%;border-collapse:collapse;font-size:0.86rem}
.aurora-table th{text-align:left;padding:0.55rem 0.6rem;background:var(--card-2);font-weight:700;color:var(--muted);font-size:0.78rem;text-transform:uppercase;letter-spacing:0.4px;border-bottom:2px solid var(--border)}
.aurora-table td{padding:0.55rem 0.6rem;border-bottom:1px solid var(--border);color:var(--text);line-height:1.4}
.aurora-table tr:last-child td{border-bottom:none}
@media(max-width:600px){.aurora-table{font-size:0.78rem}.aurora-table th,.aurora-table td{padding:0.4rem 0.4rem}}

/* === FOCS ARTIFICIALS: PARTÍCULES === */
.fireworks-hero{position:relative;overflow:hidden}
.fireworks-burst{position:absolute;inset:0;pointer-events:none;z-index:0}
.fw-particle{position:absolute;width:3px;height:3px;border-radius:50%;opacity:0;box-shadow:0 0 8px currentColor,0 0 16px currentColor}
.fw-particle:nth-child(1){top:30%;right:18%;color:#ffd54f;animation:fwBurst 9s 0.5s infinite}
.fw-particle:nth-child(2){top:25%;right:14%;color:#f87171;animation:fwBurst 9s 0.6s infinite;animation-delay:0.7s}
.fw-particle:nth-child(3){top:35%;right:22%;color:#a78bfa;animation:fwBurst 9s 0.4s infinite;animation-delay:0.5s}
.fw-particle:nth-child(4){top:45%;right:8%;color:#34d399;animation:fwBurst 11s 4s infinite}
.fw-particle:nth-child(5){top:42%;right:11%;color:#60a5fa;animation:fwBurst 11s 4.2s infinite}
.fw-particle:nth-child(6){top:38%;right:5%;color:#fb7185;animation:fwBurst 11s 3.8s infinite}
@keyframes fwBurst{
  0%,84%{opacity:0;transform:scale(0.5)}
  85%{opacity:1;transform:scale(1)}
  88%{opacity:0.85;transform:scale(2.5) translate(20px,-10px)}
  92%{opacity:0.5;transform:scale(3.5) translate(40px,5px)}
  96%, 100%{opacity:0;transform:scale(4) translate(50px,30px)}
}

/* === VIA LÀCTIA: BANDA DIAGONAL + ESTRELLES === */
.mw-hero{position:relative;overflow:hidden;min-height:140px}
.mw-galaxy{position:absolute;inset:0;pointer-events:none;z-index:0}
.mw-band{position:absolute;top:-30%;left:-20%;width:140%;height:160%;background:linear-gradient(95deg,transparent 30%,rgba(167,139,250,0.18) 42%,rgba(244,114,182,0.22) 50%,rgba(96,165,250,0.18) 58%,transparent 70%);transform:rotate(-18deg);filter:blur(8px);animation:mwGlow 16s ease-in-out infinite}
@keyframes mwGlow{0%,100%{opacity:0.85;filter:blur(8px)}50%{opacity:1;filter:blur(6px)}}
.mw-star{position:absolute;width:2px;height:2px;border-radius:50%;background:#fff;box-shadow:0 0 4px #fff,0 0 8px rgba(220,200,255,0.8)}
.mw-s1{top:35%;left:15%;animation:mwTwinkle 4s ease-in-out infinite}
.mw-s2{top:55%;left:32%;animation:mwTwinkle 5s 1s ease-in-out infinite}
.mw-s3{top:25%;left:48%;animation:mwTwinkle 4.5s 0.5s ease-in-out infinite;width:3px;height:3px}
.mw-s4{top:60%;left:62%;animation:mwTwinkle 5.5s 2s ease-in-out infinite}
.mw-s5{top:40%;left:78%;animation:mwTwinkle 4s 1.5s ease-in-out infinite;width:2.5px;height:2.5px}
.mw-s6{top:50%;left:88%;animation:mwTwinkle 5s 0.8s ease-in-out infinite}
@keyframes mwTwinkle{0%,100%{opacity:0.4}50%{opacity:1}}

.mw-cal-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:0.55rem}
.mw-month{background:var(--card-2);padding:0.7rem 0.8rem;border-radius:0.55rem;border-left:3px solid var(--border)}
.mw-month-name{font-weight:700;font-size:0.95rem;color:var(--text);margin-bottom:0.25rem}
.mw-month-pos{font-size:0.84rem;color:var(--accent);font-weight:600;margin-bottom:0.4rem}
.mw-month-tip{font-size:0.83rem;color:var(--muted);line-height:1.5}
.mw-m-easy{border-left-color:#34d399}
.mw-m-medium{border-left-color:#fbbf24}
.mw-m-hard{border-left-color:#f87171}

/* === EINA VIVA VIA LÀCTIA === */
.mw-controls{display:flex;flex-wrap:wrap;gap:0.5rem;margin-bottom:0.8rem;align-items:flex-end}
.mw-results-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:0.7rem;margin-top:0.7rem}
.mw-result-card{background:var(--card-2);padding:0.85rem 1rem;border-radius:0.6rem;border:1px solid var(--border)}
.mw-result-card h4{margin:0 0 0.5rem;font-size:0.95rem;color:var(--text)}
.mw-table{width:100%;border-collapse:collapse;font-size:0.85rem}
.mw-table td{padding:0.32rem 0;border-bottom:1px solid rgba(120,120,120,0.12)}
.mw-table td:first-child{color:var(--muted)}
.mw-table td:last-child{text-align:right}
.mw-table tr:last-child td{border-bottom:none}
.mw-now-status{padding:0.45rem 0.6rem;border-radius:0.4rem;font-size:0.85rem;margin-bottom:0.5rem;line-height:1.4}
.mw-now-up{background:rgba(74,222,128,0.15);color:#4ade80;border-left:3px solid #4ade80}
.mw-now-edge{background:rgba(251,191,36,0.15);color:#fbbf24;border-left:3px solid #fbbf24}
.mw-now-down{background:rgba(120,120,120,0.12);color:var(--muted);border-left:3px solid var(--muted-2)}
.mw-score-card{padding:1.2rem 1.4rem !important;border:none !important}
.mw-score-header{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:0.7rem;margin-bottom:0.6rem}
.mw-score-value{font-size:2.4rem;font-weight:800;line-height:1;margin:0.1rem 0}
.mw-score-stars{font-size:1.1rem;letter-spacing:0.2rem;color:#fbbf24;text-shadow:0 1px 3px rgba(0,0,0,0.3)}
.mw-score-factors{display:flex;flex-wrap:wrap;gap:0.35rem;margin-top:0.5rem}
.mw-factor{background:rgba(255,255,255,0.15);padding:0.25rem 0.55rem;border-radius:0.35rem;font-size:0.78rem;color:white}
.mw-factor strong{margin-left:0.3rem;opacity:0.95}
.mw-factor-pos{background:rgba(255,255,255,0.18)}
.mw-factor-neg{background:rgba(0,0,0,0.25)}

/* === SKYDOME === */
.mw-skydome-card{background:linear-gradient(135deg,rgba(167,139,250,0.06),rgba(96,165,250,0.06));border-color:rgba(167,139,250,0.3) !important}
.mw-skydome-wrap{display:flex;flex-wrap:wrap;gap:1.2rem;align-items:flex-start;justify-content:center;margin-top:0.7rem}
.mw-skydome{width:280px;height:280px;flex-shrink:0;filter:drop-shadow(0 4px 12px rgba(0,0,0,0.15))}
.mw-skydome-legend{display:flex;flex-direction:column;gap:0.4rem;font-size:0.83rem;color:var(--text);min-width:140px}
.mw-skydome-legend>div{display:flex;align-items:center;gap:0.4rem}
.mw-leg-dot{width:0.7rem;height:0.7rem;border-radius:50%;display:inline-block;flex-shrink:0}

/* === TOP 3 NIGHTS === */
.mw-topnights-card{background:linear-gradient(135deg,rgba(251,191,36,0.05),rgba(244,114,182,0.05))}
.mw-topnights-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:0.7rem;margin-top:0.6rem}
.mw-topnight{background:var(--card);padding:0.85rem 1rem;border-radius:0.55rem;border:1px solid var(--border);position:relative;display:flex;flex-direction:column;gap:0.3rem}
.mw-topnight-1{border:2px solid #fbbf24;box-shadow:0 4px 12px rgba(251,191,36,0.15)}
.mw-topnight-2{border:2px solid #d1d5db}
.mw-topnight-3{border:2px solid #cd7f32}
.mw-topnight-rank{position:absolute;top:-0.5rem;right:0.6rem;background:linear-gradient(135deg,#fbbf24,#f59e0b);color:white;padding:0.15rem 0.55rem;border-radius:1rem;font-size:0.78rem;font-weight:700;box-shadow:0 2px 4px rgba(0,0,0,0.15)}
.mw-topnight-2 .mw-topnight-rank{background:linear-gradient(135deg,#d1d5db,#9ca3af)}
.mw-topnight-3 .mw-topnight-rank{background:linear-gradient(135deg,#cd7f32,#92400e)}
.mw-topnight-date{font-weight:700;font-size:0.95rem;color:var(--text);text-transform:capitalize}
.mw-topnight-score{font-size:1.6rem;font-weight:800;color:var(--accent);line-height:1}
.mw-topnight-stars{color:#fbbf24;font-size:0.95rem;letter-spacing:0.15rem}
.mw-topnight-meta{display:flex;flex-wrap:wrap;gap:0.45rem;font-size:0.76rem;color:var(--muted);margin-top:0.2rem}
.mw-topnight-meta span{background:var(--card-2);padding:0.15rem 0.45rem;border-radius:0.3rem}
.mw-topnight-btn{margin-top:0.4rem;align-self:flex-start;font-size:0.78rem !important}

/* === ALERT BANNER === */
.mw-alert-banner{display:flex;align-items:center;gap:0.8rem;padding:0.85rem 1rem;background:linear-gradient(135deg,#065f46,#10b981);color:white;border-radius:0.6rem;margin-bottom:0.7rem;box-shadow:0 4px 12px rgba(16,185,129,0.25);position:relative;overflow:hidden}
.mw-alert-banner::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 80% 50%,rgba(255,255,255,0.15),transparent 60%);pointer-events:none}
.mw-alert-icon{font-size:1.8rem;flex-shrink:0;animation:mwAlertPulse 2.5s ease-in-out infinite}
@keyframes mwAlertPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.15)}}
.mw-alert-body{flex:1;min-width:0;position:relative;z-index:1}
.mw-alert-title{font-weight:700;font-size:1rem;margin-bottom:0.15rem;text-transform:uppercase;letter-spacing:0.5px}
.mw-alert-detail{font-size:0.84rem;opacity:0.94}
.mw-alert-action{position:relative;z-index:1;background:rgba(255,255,255,0.2) !important;border-color:rgba(255,255,255,0.5) !important;color:white !important}
.mw-alert-action:hover{background:rgba(255,255,255,0.3) !important}
@media(max-width:600px){.mw-alert-banner{flex-wrap:wrap}.mw-alert-action{width:100%}}

/* ============= GALERIA ============= */
.gallery-toolbar{display:flex;flex-wrap:wrap;justify-content:space-between;gap:0.7rem;margin-bottom:1rem;align-items:center}
.gallery-filters{display:flex;flex-wrap:wrap;gap:0.35rem}
.gf-chip{padding:0.4rem 0.75rem;border:1px solid var(--border);background:var(--card-2);border-radius:1.5rem;cursor:pointer;font-size:0.83rem;font-weight:600;color:var(--muted);transition:all 0.15s}
.gf-chip:hover{border-color:var(--accent);color:var(--text)}
.gf-chip.active{background:var(--accent);color:white;border-color:var(--accent)}
.gallery-actions{display:flex;gap:0.5rem;align-items:center}
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:0.5rem}
@media(max-width:600px){.gallery-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:0.35rem}}
.gallery-item{aspect-ratio:1;overflow:hidden;border-radius:0.5rem;cursor:pointer;background:var(--card-2);position:relative;transition:transform 0.15s,box-shadow 0.15s}
.gallery-item:hover{transform:scale(1.03);box-shadow:0 6px 16px rgba(0,0,0,0.18);z-index:1}
.gallery-item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 0.3s}
.gallery-item:hover img{transform:scale(1.06)}
.gal-own-flags{position:absolute;top:0.35rem;left:0.35rem;display:flex;gap:0.22rem;z-index:2}
.gal-own-flags b{font-size:0.58rem;font-weight:800;padding:0.12rem 0.3rem;border-radius:0.3rem;background:rgba(0,0,0,0.72);backdrop-filter:blur(4px);letter-spacing:0.02em}
.gal-own-flags b.ok{color:#34d399}
.gal-own-flags b.no{color:#f87171;opacity:0.85}
.gallery-item-cat{position:absolute;top:0.35rem;right:0.35rem;background:rgba(0,0,0,0.7);color:white;padding:0.15rem 0.45rem;border-radius:0.3rem;font-size:0.7rem;font-weight:600;backdrop-filter:blur(4px)}
.gallery-item-author{position:absolute;bottom:0.35rem;left:0.35rem;background:rgba(0,0,0,0.7);color:#fbbf24;padding:0.15rem 0.45rem;border-radius:0.3rem;font-size:0.65rem;font-weight:600;backdrop-filter:blur(4px);max-width:calc(100% - 0.7rem);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.gallery-item img{user-select:none;-webkit-user-drag:none;-webkit-touch-callout:none;pointer-events:auto;}

/* Mode admin: wrapper amb foto i selector sota */
.gallery-grid.admin-mode{grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}
.gallery-cell{display:flex;flex-direction:column;gap:0.35rem}
.gallery-edit{display:flex;align-items:center;gap:0.3rem;background:var(--card-2);border:1px solid var(--border);border-radius:0.4rem;padding:0.25rem 0.4rem;}
.gallery-cat-select{flex:1;padding:0.25rem 0.4rem;border-radius:0.3rem;background:var(--card);color:var(--text);border:1px solid var(--border);font-size:0.78rem;font-weight:600;cursor:pointer;}
.gallery-cat-select:focus{outline:2px solid var(--accent);outline-offset:1px}
.gallery-edit-status{font-size:0.7rem;color:var(--muted);min-width:55px;font-weight:600}

/* ============= LIGHTBOX ============= */
.gallery-lightbox{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;animation:glFadeIn 0.2s ease;overscroll-behavior:contain;touch-action:none}
.gallery-lightbox[hidden]{display:none !important}
/* Popup de foc: compacte i translúcid perquè es vegi el perímetre de sota */
.mf-fire-popup .leaflet-popup-content-wrapper{background:rgba(20,26,40,0.9);color:#eee;backdrop-filter:blur(3px)}
.mf-fire-popup .leaflet-popup-tip{background:rgba(20,26,40,0.9)}
.mf-fire-popup .leaflet-popup-content{margin:0.6rem 0.8rem}
.mf-fire-popup a.leaflet-popup-close-button{color:#fff;font-size:20px;width:26px;height:26px;padding:2px 0 0 0}
/* 💬 Comentaris al lightbox */
.gl-comments-panel{position:absolute;right:12px;bottom:70px;width:min(380px,calc(100vw - 24px));max-height:52vh;display:flex;flex-direction:column;background:rgba(15,20,32,0.96);border:1px solid rgba(255,255,255,0.15);border-radius:0.7rem;box-shadow:0 10px 30px rgba(0,0,0,0.5);z-index:5;overflow:hidden;backdrop-filter:blur(6px)}
.gl-comments-panel[hidden]{display:none!important}
.gl-com-head{display:flex;align-items:center;justify-content:space-between;padding:0.55rem 0.75rem;border-bottom:1px solid rgba(255,255,255,0.12);color:#fff;font-weight:700;font-size:0.9rem}
.gl-com-close{background:none;border:none;color:#aaa;font-size:1rem;cursor:pointer;padding:0.1rem 0.3rem}
.gl-com-close:hover{color:#fff}
.gl-com-list{overflow-y:auto;padding:0.5rem 0.75rem;display:flex;flex-direction:column;gap:0.55rem;flex:1;min-height:60px}
.gl-com-item{font-size:0.83rem;line-height:1.45;color:#e8e8e8}
.gl-com-meta{display:flex;align-items:center;gap:0.4rem;margin-bottom:0.1rem}
.gl-com-author{font-weight:700;color:#fbbf24;font-size:0.8rem}
.gl-com-date{color:#9aa0ae;font-size:0.7rem}
.gl-com-del{margin-left:auto;background:none;border:none;color:#c7ccd6;cursor:pointer;font-size:0.95rem;padding:0 0.25rem;opacity:0.8}
.gl-com-del:hover{color:#ef5350}
.gl-com-empty{color:#9aa0ae;font-size:0.82rem;text-align:center;padding:0.8rem 0}
/* Reaccions als comentaris (estil FB) */
.gl-com-reacts{display:flex;align-items:center;flex-wrap:wrap;gap:0.25rem;margin-top:0.25rem}
.gl-com-rpill{background:rgba(255,255,255,0.09);border:1px solid rgba(255,255,255,0.15);border-radius:999px;color:#dfe3ea;font-size:0.72rem;padding:0.08rem 0.45rem;cursor:pointer;line-height:1.4}
.gl-com-rpill.mine{background:rgba(59,130,246,0.28);border-color:rgba(59,130,246,0.7)}
.gl-com-rpill:hover{background:rgba(255,255,255,0.18)}
.gl-com-radd{background:none;border:1px dashed rgba(255,255,255,0.25);border-radius:999px;color:#9aa0ae;font-size:0.78rem;padding:0.05rem 0.4rem;cursor:pointer;line-height:1.4}
.gl-com-radd:hover{border-color:rgba(255,255,255,0.5);color:#fff}
.gl-com-radd-plus{font-size:0.7rem;margin-left:1px}
.gl-com-rpicker{display:inline-flex;gap:0.1rem;background:rgba(20,26,40,0.98);border:1px solid rgba(255,255,255,0.2);border-radius:999px;padding:0.12rem 0.3rem;box-shadow:0 4px 14px rgba(0,0,0,0.45)}
.gl-com-rpicker[hidden]{display:none!important}
.gl-com-remo{background:none;border:none;font-size:1.05rem;cursor:pointer;padding:0.05rem 0.15rem;border-radius:50%;line-height:1;transition:transform 0.1s}
.gl-com-remo:hover{transform:scale(1.3)}
.gl-com-remo.mine{background:rgba(59,130,246,0.35)}
.gl-com-form{display:flex;gap:0.4rem;padding:0.55rem 0.75rem;border-top:1px solid rgba(255,255,255,0.12)}
.gl-com-input{flex:1;background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.18);border-radius:0.5rem;color:#fff;padding:0.45rem 0.6rem;font-size:0.85rem;resize:none;font-family:inherit;max-height:90px}
.gl-com-input::placeholder{color:#8b93a3}
.gl-com-send{background:var(--accent,#3b82f6);border:none;color:#fff;border-radius:0.5rem;padding:0 0.8rem;font-size:1rem;cursor:pointer;font-weight:700}
.gl-com-send:disabled{opacity:0.45;cursor:default}
.gl-com-login{padding:0.6rem 0.75rem;border-top:1px solid rgba(255,255,255,0.12);color:#9aa0ae;font-size:0.8rem;text-align:center}
@media(max-width:600px){.gl-comments-panel{right:6px;left:6px;width:auto;bottom:64px;max-height:46vh}}
/* Escriptori: comentaris DOCATS a la columna dreta, sota les dades/EXIF, sempre visibles */
@media(min-width:961px){
  .gl-info{bottom:auto;max-height:36vh}
  /* [hidden] inclòs: sinó la regla d'amagar (més específica) guanyava i el panell no sortia MAI */
  .gl-comments-panel,.gl-comments-panel[hidden]{top:calc(4rem + 36vh + 0.8rem);bottom:4rem;right:1rem;left:auto;width:300px;max-height:none;display:flex!important}
  .gl-comments-panel .gl-com-close{display:none}
  #glCommentsBtn{display:none!important}
}
/* Mode presentació: fora panells, foto mana */
.gl-presenting .gl-info{display:none!important}
.gl-presenting .gl-comments-panel{display:none!important}
/* 🚨 Banner d'alarma de foc proper */
.mf-alerts-bar{position:sticky;top:0;z-index:1000;display:flex;flex-wrap:wrap;gap:0.5rem;margin:0}
.mf-today-chip{appearance:none;background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.16);color:var(--text,#e7ecf5);border-radius:2rem;padding:0.32rem 0.75rem;font-size:0.8rem;font-weight:700;cursor:pointer;line-height:1.25;transition:background 0.15s,border-color 0.15s}
.mf-today-chip:hover{background:rgba(255,255,255,0.12)}
.mf-today-chip.open{background:rgba(139,92,246,0.18);border-color:rgba(167,139,250,0.6);color:#e9d5ff}
@keyframes mfSimSpin{to{transform:rotate(360deg)}}
.mf-top-btn{appearance:none;background:rgba(255,255,255,0.07);border:1.5px solid rgba(255,255,255,0.2);color:var(--text,#e7ecf5);border-radius:0.7rem;padding:0.55rem 0.95rem;font-size:0.92rem;font-weight:800;cursor:pointer;line-height:1.2;transition:background 0.15s,border-color 0.15s;white-space:nowrap}
.mf-top-btn:hover{background:rgba(255,255,255,0.13)}
.mf-top-btn{width:100%;text-align:center;overflow:hidden;text-overflow:ellipsis}
/* Tema clar: fons blanc translúcid + vora blanca no es veuen — cal to fosc suau */
html:not([data-theme="dark"]) .mf-top-btn{background:rgba(30,96,145,0.07);border-color:rgba(30,96,145,0.3)}
html:not([data-theme="dark"]) .mf-top-btn:hover{background:rgba(30,96,145,0.14)}
html:not([data-theme="dark"]) .mf-top-btn.open{background:rgba(30,96,145,0.16);border-color:rgba(30,96,145,0.55)}
html:not([data-theme="dark"]) .mf-today-chip{background:rgba(30,96,145,0.07);border-color:rgba(30,96,145,0.28)}
html:not([data-theme="dark"]) .mf-today-chip:hover{background:rgba(30,96,145,0.14)}
html:not([data-theme="dark"]) .mf-today-chip.open{background:rgba(30,96,145,0.16);border-color:rgba(30,96,145,0.55);color:var(--primary)}
/* A5b: pista visual d'scroll horitzontal (només on hi ha overflow, mòbil) */
@media (max-width:640px){
  .mf-hscroll-fade{-webkit-mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 2.2rem),transparent);mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 2.2rem),transparent)}
}
.mf-top-btn.open{background:rgba(139,92,246,0.2);border-color:rgba(167,139,250,0.65)}
/* Famílies de botons del simulador: cada funció, el seu color */
#mfSimGrpRow .mf-sim-chip{border-color:rgba(96,165,250,0.55)}            /* ubicacions: blau */
#mfSimGrpRow .mf-sim-chip.active{background:rgba(59,130,246,0.25)}
#mfSimModeRow #mfSimModeEcl{border-color:rgba(251,191,36,0.6)}           /* eclipsis: ambre */
#mfSimModeRow #mfSimModeMW{border-color:rgba(167,139,250,0.6)}           /* VL: lila */
#mfSimModeRow .mf-sim-chip.active{background:rgba(139,92,246,0.22)}
#mfSimModeRow #mfSimModeEcl.active{background:rgba(245,158,11,0.22)}
.mf-chip-circ{border-color:rgba(45,212,191,0.6)!important}               /* circumpolar: turquesa */
/* ── Barra compacta del simulador (estil PhotoPills) ── */
/* 🔍 Anti-zoom del simulador (12-09): cap element del sim deixa fer doble toc
   ni pessic de PÀGINA (Safari aplica touch-action element a element; el none
   de l'arrel no protegia les capes filles). El pessic del panorama i del mapa
   són JS (Google/Leaflet) i no es toquen. */
#mfEclSim button,#mfEclSim input,#mfEclSim select,#mfEclSim .mf-sim-chip,#mfEclSimInfo,#mfEclSimTopWrap,#mfSimToolbar,#mfSimToolbar *{touch-action:manipulation;}
#mfEclSimPano *{touch-action:none!important;}
#mfSimToolbar{display:flex;flex-direction:column;gap:0.42rem;margin:0.55rem auto 0;padding:0.48rem;max-width:56rem;background:linear-gradient(180deg,rgba(15,23,42,0.88),rgba(8,13,26,0.94));border:1px solid rgba(148,163,184,0.24);border-radius:1rem;box-shadow:0 12px 34px rgba(0,0,0,0.38),inset 0 1px 0 rgba(255,255,255,0.05);backdrop-filter:blur(14px) saturate(130%);-webkit-backdrop-filter:blur(14px) saturate(130%);overflow:hidden;}
.mf-tb-row{display:flex;justify-content:center;align-items:stretch;gap:0.32rem;flex-wrap:nowrap;width:100%;}
.mf-tb-btn{position:relative;flex:1 1 0;max-width:none;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0.18rem;background:rgba(255,255,255,0.035);border:1px solid transparent;color:#cbd5e1;cursor:pointer;padding:0.48rem 0.3rem;border-radius:0.72rem;font-size:1.08rem;line-height:1;transition:transform .14s ease,background .16s ease,border-color .16s ease,box-shadow .16s ease,color .16s ease;}
.mf-tb-btn:hover{background:rgba(255,255,255,0.085);border-color:rgba(148,163,184,0.25);transform:translateY(-1px);}
.mf-tb-btn:active{transform:translateY(0) scale(.98);}
.mf-tb-btn>span{font-size:1.16rem;line-height:1.05;filter:drop-shadow(0 1px 3px rgba(0,0,0,.35));}
.mf-tb-btn small{font-size:0.62rem;line-height:1.12;letter-spacing:0.015em;color:#9aa8bd;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;}
.mf-tb-btn.active{background:linear-gradient(180deg,rgba(109,40,217,0.42),rgba(76,29,149,0.34));border-color:rgba(167,139,250,0.55);color:#fff;box-shadow:0 4px 14px rgba(76,29,149,0.28),inset 0 1px 0 rgba(255,255,255,.08);}
.mf-tb-btn.active small{color:#ede9fe;}
.mf-tb-main .mf-tb-mode-current{background:linear-gradient(180deg,rgba(14,116,144,0.26),rgba(8,47,73,0.28));border-color:rgba(34,211,238,0.32);}
.mf-tb-main .mf-tb-mode-current:hover{border-color:rgba(34,211,238,0.58);background:linear-gradient(180deg,rgba(14,116,144,0.36),rgba(8,47,73,0.36));}
/* 21-09 (Jaume): «Enrere» més gran i visible (icona 1.35 rem, vora clara, fons més marcat) */
.mf-tb-back{flex:0 0 4.4rem!important;min-width:4.4rem!important;max-width:4.4rem!important;background:rgba(148,163,184,0.16)!important;border-color:rgba(203,213,225,0.45)!important;color:#f1f5f9!important;}
.mf-tb-back span{font-size:1.35rem!important;line-height:1;}
.mf-tb-back small{font-size:0.62rem;font-weight:700;}
.mf-sim-sheet{display:none;flex-direction:column;gap:0.38rem;max-height:45vh;overflow:auto;padding:0.08rem 0.02rem 0;}
/* mf-sim-sheet.open premium definit més amunt */
.mf-sim-sheet-head{display:flex;align-items:center;justify-content:center;gap:.42rem;color:#dbeafe;font-size:.66rem;font-weight:800;letter-spacing:.055em;text-transform:uppercase;opacity:.88;padding:.08rem .2rem .02rem;}
.mf-sim-sheet-head::before,.mf-sim-sheet-head::after{content:'';height:1px;flex:1;background:linear-gradient(90deg,transparent,rgba(148,163,184,.22));}
.mf-sim-sheet-head::after{background:linear-gradient(90deg,rgba(148,163,184,.22),transparent);}
#mfEclSimBottomBar{background:linear-gradient(180deg,transparent 0%,rgba(4,8,18,.58) 18%,rgba(4,8,18,.93) 55%,rgba(4,8,18,.97) 100%)!important;padding:1.25rem 1rem calc(.85rem + env(safe-area-inset-bottom,0px))!important;}
#mfEclSimClock{letter-spacing:.055em;text-shadow:0 2px 12px rgba(245,158,11,.22),0 2px 8px rgba(0,0,0,.8);}
#mfEclSimDateBig{display:flex!important;justify-content:center;align-items:center;width:max-content;max-width:92%;margin:.18rem auto .22rem!important;padding:.18rem .55rem;border-radius:.58rem;background:rgba(15,23,42,.42);border:1px solid rgba(148,163,184,.10);text-shadow:0 1px 6px rgba(0,0,0,.7);}
#mfEclSimNowBtn,#mfEclSimMaxBtn{box-shadow:inset 0 1px 0 rgba(255,255,255,.05);transition:background .15s ease,border-color .15s ease,transform .12s ease;}
#mfEclSimNowBtn:hover,#mfEclSimMaxBtn:hover{background:rgba(245,158,11,.12)!important;border-color:rgba(252,211,77,.8)!important;transform:translateY(-1px);}
#mfEclSimSlider,#mfSimYearSlider{appearance:none;-webkit-appearance:none;height:7px;border-radius:999px;outline:none;background:linear-gradient(90deg,rgba(245,158,11,.95),rgba(245,158,11,.95)) 0/var(--mf-range-fill,50%) 100% no-repeat,rgba(148,163,184,.32);box-shadow:inset 0 1px 2px rgba(0,0,0,.45);cursor:pointer;}
#mfEclSimSlider::-webkit-slider-thumb,#mfSimYearSlider::-webkit-slider-thumb{-webkit-appearance:none;width:21px;height:21px;border-radius:50%;background:linear-gradient(145deg,#fbbf24,#f59e0b);border:2px solid rgba(255,255,255,.65);box-shadow:0 3px 10px rgba(0,0,0,.42),0 0 0 4px rgba(245,158,11,.10);cursor:grab;}
#mfEclSimSlider::-moz-range-thumb,#mfSimYearSlider::-moz-range-thumb{width:19px;height:19px;border-radius:50%;background:linear-gradient(145deg,#fbbf24,#f59e0b);border:2px solid rgba(255,255,255,.65);box-shadow:0 3px 10px rgba(0,0,0,.42);cursor:grab;}
#mfEclSimSlider:active::-webkit-slider-thumb,#mfSimYearSlider:active::-webkit-slider-thumb{cursor:grabbing;transform:scale(1.06);}
#mfSimDailyRow{gap:.62rem!important;padding:.14rem .12rem .02rem;}
#mfSimYearRow{border-radius:.78rem!important;background:rgba(7,12,24,.62)!important;border-color:rgba(148,163,184,.20)!important;padding:.5rem .58rem!important;}
@media(max-width:700px){
  #mfSimToolbar{margin-top:.42rem;padding:.4rem;border-radius:.9rem;gap:.34rem;}
  .mf-tb-row{justify-content:flex-start;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;padding-bottom:.08rem;-webkit-overflow-scrolling:touch;scrollbar-width:none;}
  .mf-tb-row::-webkit-scrollbar{display:none;}
  .mf-tb-btn{flex:0 0 4.4rem;min-width:4.4rem;scroll-snap-align:start;padding:.43rem .25rem;}
  .mf-tb-main .mf-tb-btn{flex:1 1 0;min-width:3.65rem;}
  .mf-tb-btn>span{font-size:1.08rem;}
  .mf-tb-btn small{font-size:.57rem;}
  .mf-tb-back{flex:0 0 3.6rem!important;min-width:3.6rem!important;max-width:3.6rem!important;}
  .mf-tb-back span{font-size:1.45rem!important;}   /* 21-09: al mòbil, sense text, la icona mana */
  .mf-tb-back small{display:none;}
  .mf-sim-sheet-head{font-size:.58rem;}
  #mfEclSimBottomBar{padding-left:.65rem!important;padding-right:.65rem!important;}
  #mfEclSimDateBig{font-size:.88rem!important;max-width:96%;}
}

/* mf-tb-row premium definit més amunt */
/* mf-tb-btn premium definit més amunt */
/* mf-tb-btn small premium definit més amunt */
/* active premium definit més amunt */
/* active small premium definit més amunt */
/* mf-sim-sheet premium definit més amunt */
.mf-sim-sheet.open{display:flex;}
.mf-tb-hidden{display:none!important;}
/* ⌖ Reticle premium del mode visor */
#mfAlignReticle{position:absolute;width:78px;height:78px;transform:translate(-50%,-50%);pointer-events:none;display:none;filter:drop-shadow(0 0 7px rgba(45,212,191,0.85));}
#mfAlignReticle .mf-ret-spin{transform-origin:50% 50%;animation:mfRetSpin 7s linear infinite;}
#mfAlignReticle.bad{filter:drop-shadow(0 0 7px rgba(248,113,113,0.9));}
#mfAlignReticle.bad circle,#mfAlignReticle.bad line{stroke:#f87171!important}
#mfAlignReticle.bad circle[fill]{fill:#f87171!important}
#mfAlignReticle.moon{filter:drop-shadow(0 0 7px rgba(147,197,253,0.9));}
#mfAlignReticle.moon circle,#mfAlignReticle.moon line{stroke:#93c5fd!important}
@keyframes mfRetSpin{to{transform:rotate(360deg)}}
#mfAlignReticle.fire{animation:mfRetFire 0.26s ease-out;filter:drop-shadow(0 0 14px rgba(250,204,21,0.95));}
@keyframes mfRetFire{0%{transform:translate(-50%,-50%) scale(1)}45%{transform:translate(-50%,-50%) scale(0.58)}100%{transform:translate(-50%,-50%) scale(1.08)}}
#mfEclSimInfo.mf-info-collapsed .mf-sim-ext{display:none!important;}
/* Capçalera hora/dia del simulador: menys bold, més elegant */
#mfEclSimClock{font-weight:500!important;}
#mfEclSimDateBig{font-weight:400!important;}
#mfEclSimWxBig{font-weight:500!important;}
#mfEclSimPhase{font-weight:500!important;}
#mfEclSimBrightRow{display:none!important;}
#mfSimToolbar #mfSimYearRow button[onclick*="mfSimYearMode"]{display:none!important;}
#mfSheetMode #mfEclSimEclRow,#mfSheetMode #mfSimGrpRow{margin-top:0!important;padding-bottom:0!important;}
#mfSheetMode #mfEclSimEclRow:empty,#mfSheetMode #mfSimGrpRow:empty{display:none!important;}
#mfEclSimBrightRow.mf-bright-open{display:flex!important;align-items:center;gap:0.5rem;margin-top:0.1rem;}
/* Fitxes d'eclipsi i grup dins la safata Mode: lletra compacta (mida del menú) */
#mfSheetMode #mfEclSimEclRow button,#mfSheetMode #mfSimGrpRow button,#mfSimToolbar #mfSimYearRow button{font-size:0.58rem!important;padding:0.25rem 0.4rem!important;line-height:1.25!important;}
#mfSimToolbar #mfSimYearRow{margin-top:0.1rem;font-size:0.62rem;}
/* Safata Anual: ⬅️ + 5 esdeveniments en UNA sola línia (botons que s'encongeixen) */
/* 21-09 (Jaume): MODE ANUAL — 6 botons (Enrere + albada · posta sol · surt lluna · posta lluna · CVL)
   SEMPRE en una sola línia, sense scroll horitzontal: es reparteixen l'amplada i el text pot anar a 2 línies. */
#mfSheetAny .mf-tb-row{flex-wrap:nowrap!important;overflow-x:hidden!important;justify-content:stretch!important;scroll-snap-type:none!important;}
#mfSheetAny .mf-tb-btn{flex:1 1 0!important;min-width:0!important;max-width:none!important;padding-left:.1rem!important;padding-right:.1rem!important;}
#mfSheetAny .mf-tb-back{flex:0 0 2.9rem!important;min-width:2.9rem!important;max-width:2.9rem!important;}
#mfSheetAny .mf-tb-btn small{font-size:0.54rem;letter-spacing:0;white-space:normal;overflow:visible;text-overflow:clip;line-height:1.05;text-align:center;}
@media(max-width:700px){
  #mfSheetAny .mf-tb-btn{padding:.4rem .05rem!important;}
  #mfSheetAny .mf-tb-btn>span{font-size:1rem;}
  #mfSheetAny .mf-tb-btn small{font-size:.5rem;}
}
/* Mòbil: l'etiqueta anual (amb la lluna) passa a la línia de sota del slider */
@media (max-width:520px){
  #mfSimToolbar #mfSimYearRow div:has(> #mfSimYearLbl){flex-wrap:wrap;}
  #mfSimYearLbl{min-width:100%!important;text-align:center!important;}
}
/* Originals substituïts per proxies de la barra: amagats per ID (className= no els pot ressuscitar) */
#mfSimModeEcl,#mfSimModeMW,#mfSimYearToggle,#mfEclSimCamBtn,#mfTbMaxSrc,#mfTbShareSrc,#mfTbEssRow,
#mfSimCircumBtn,#mfSimFrameBtn,#mfEclSimSwapBtn,#mfEclSim #mfSimActRow,#mfEclSim #mfSimModeRow,
#mfEclSimMoreBtn,#mfEclSimBtnsTgl,#mfSimModeSwapBtn,#mfSimVistaLbl,#mfEclSimCalBtn,#mfSimShareFab{display:none!important;}m;}
.mf-chip-circ.active{background:rgba(20,184,166,0.25)!important}
.mf-chip-frame{border-color:rgba(52,211,153,0.6)!important}              /* enquadre: verd */
.mf-chip-frame.active{background:rgba(16,185,129,0.25)!important}
#mfSimActRow .mf-sim-chip{border-color:rgba(244,114,182,0.55)}           /* desa/pla: rosa */
/* Files de control del simulador: graella 2 columnes a TOT l'ample (com els sliders) */
#mfSimModeRow,#mfSimCircumRow,#mfSimActRow{
  display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:0.4rem;width:100%}
#mfSimModeRow .mf-sim-chip,#mfSimCircumRow .mf-sim-chip,#mfSimActRow .mf-sim-chip{
  width:100%;text-align:center;display:inline-flex;align-items:center;justify-content:center;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#mfSimFrameCtl{grid-column:1/-1;justify-content:center;flex-wrap:wrap;width:100%;margin-top:0.35rem}
/* Selector d'exposició del circumpolar: UNA sola fila de 5 xips iguals,
   lletra del menú (0.58rem); la icona ⏱️ fora (robava amplada) */
#mfSimToolbar #mfSimCircumExp{width:100%;margin-top:0.1rem;gap:0.3rem!important;flex-wrap:nowrap!important;align-items:stretch!important;justify-content:stretch;}
#mfSimToolbar #mfSimCircumExp>span{display:none!important;}
#mfSimToolbar #mfSimCircumExp .mf-sim-chip{flex:1 1 0;min-width:0;width:auto!important;font-size:0.58rem!important;padding:0.28rem 0.2rem!important;line-height:1.25!important;white-space:nowrap;text-align:center;}
#mfSimFrameCtl select{flex:0 1 auto;min-width:5.5rem;max-width:48%}
#mfSimGrpRow{width:100%;display:flex!important}
#mfSimGrpRow select{flex:1;min-width:0;width:100%;max-width:none}
#mfSimGrpRow span{flex-shrink:0}
#mfEclSim.mf-sim-min #mfEclSimInfo .mf-sim-ext{display:none;}
.mf-simclose-mini{display:none;}
@media(max-width:560px){
  #mfEclSimCloseBtn .mf-simclose-full{display:none;}
  #mfEclSimCloseBtn .mf-simclose-mini{display:inline;font-size:1.1rem;line-height:1;}
  #mfEclSimCloseBtn{padding:0.55rem 0.75rem!important;}
  #mfEclSimTopWrap{right:4rem!important;}
  #mfEclSimInfo{max-width:100%!important;font-size:0.76rem!important;}
}
#mfEclSim.mf-sim-min #mfEclSimBtns,
#mfEclSim.mf-sim-min #mfEclSimEclRow,
#mfEclSim.mf-sim-min #mfSimModeRow,
#mfEclSim.mf-sim-min #mfSimCircumRow,
#mfEclSim.mf-sim-min #mfSimGrpRow,
#mfEclSim.mf-sim-min #mfSimActRow,
#mfEclSim.mf-sim-min #mfEclSimBrightRow,
#mfEclSim.mf-sim-min #mfEclSimWxBig,
#mfEclSim.mf-sim-min #mfEclSimPhase{display:none!important}
/* 🎯 Mode calibració de la vista càmera: amaguem TOTS els controls per veure el cel net */
#mfEclSim.mf-sim-cal #mfEclSimBottomBar,
#mfEclSim.mf-sim-cal #mfSimShareFab,
#mfEclSim.mf-sim-cal #mfSimMapFab,
#mfEclSim.mf-sim-cal #mfSimCamFab,
#mfEclSim.mf-sim-cal #mfTbBrightBtn,
#mfEclSim.mf-sim-cal #mfSimAlignFab,
#mfEclSim.mf-sim-cal #mfSimMotionFab,
#mfEclSim.mf-sim-cal #mfSimSunFab,#mfEclSim.mf-sim-cal #mfSimMoonFab,#mfEclSim.mf-sim-cal .mf-ev-tray,#mfEclSim.mf-sim-cal #mfSimScopeFab,#mfEclSim.mf-sim-cal #mfSimStarsFab,
#mfEclSim.mf-sim-cal #mfEclSimTopWrap{display:none!important}
#mfEclSim.mf-sim-cleanview #mfSimAzChip{display:none!important}
/* FABs fixos del sim: 🗺️ sota el plegador del quadre (esquerra) i 🔆 sota Sortir (dreta) */
.mf-sim-fab{position:absolute;width:2.5rem;height:2.5rem;border-radius:50%;border:1.5px solid rgba(255,255,255,0.4);background:rgba(0,0,0,0.72);color:#e7ecf5;font-size:1.15rem;cursor:pointer;backdrop-filter:blur(6px);box-shadow:0 3px 12px rgba(0,0,0,0.5);line-height:1;padding:0;z-index:6;}
.mf-sim-fab.active{border-color:rgba(252,211,77,0.9);background:rgba(120,85,10,0.75);color:#fde68a;}
/* 21-09: columna DRETA = ✕ · ⤢ · 🔆 · 🗺️ · ✥ · ❔ · zoom SV (📷 i ⌖ han passat a l'esquerra) */
#mfSimMapFab{right:0.7rem;top:calc(9.3rem + env(safe-area-inset-top,0px));}   /* 15-09: a la dreta (abans a l'esquerra, tapat per la columna de modes) */
#mfSimCamFab{}   /* 21-09: viu a la columna esquerra (#mfSimModeCol), 9è */
#mfTbBrightBtn{right:0.7rem;top:calc(6.5rem + env(safe-area-inset-top,0px));}
#mfSimMotionFab{right:0.7rem;top:calc(12.1rem + env(safe-area-inset-top,0px));display:flex;align-items:center;justify-content:center;}
/* 21-09 (Jaume): ☀️ i 🌙 a la columna dreta (abans a la barra de temps, no hi cabien al mòbil); el ❔ baixa dos llocs */
#mfSimScopeFab{right:0.7rem;top:calc(12.1rem + env(safe-area-inset-top,0px));}
#mfSimSunFab{right:0.7rem;top:calc(14.9rem + env(safe-area-inset-top,0px));}
#mfSimMoonFab{right:0.7rem;top:calc(17.7rem + env(safe-area-inset-top,0px));}
#mfSimStarsFab{right:0.7rem;top:calc(20.5rem + env(safe-area-inset-top,0px));}
#mfSimStarsFab.active{border-color:#fcd34d;background:rgba(120,85,10,.6);}
#mfSimTourFab{right:0.7rem;top:calc(23.3rem + env(safe-area-inset-top,0px));color:#93c5fd;border-color:rgba(147,197,253,.6);font-size:1.2rem;font-weight:800;}
#mfEclSimEvBtns{display:none!important;}
.mf-ev-tray{position:absolute;right:3.5rem;z-index:7;display:flex;gap:.3rem;align-items:center;height:2.5rem;}
.mf-ev-tray[hidden]{display:none!important;}
#mfSimSunTray{top:calc(14.9rem + env(safe-area-inset-top,0px));}
#mfSimMoonTray{top:calc(17.7rem + env(safe-area-inset-top,0px));}
.mf-ev-tray button{background:rgba(10,15,28,.95);border:1px solid rgba(255,255,255,.35);color:#fff;border-radius:2rem;padding:.45rem .75rem;font-weight:800;font-size:.8rem;cursor:pointer;white-space:nowrap;box-shadow:0 4px 14px rgba(0,0,0,.5);}
#mfSimSunFab.active,#mfSimMoonFab.active{border-color:#fcd34d;background:rgba(120,85,10,.75);}
#mfEclSim.mf-sim-cal #mfSimTourFab,#mfEclSim.mf-sim-cleanview #mfSimTourFab{display:none!important;}
/* 25-09 (Jaume, prova): columna DRETA agrupada → ⤢ · ⚙️ Opcions de vista · 🗺️ · 🌅 Moments · ❔ (petit).
   ⚙️ = 🔆 brillantor, ⭐ estrelles, ✥ moviment (si n'hi ha), 🎯 visor (només càmera). 🌅 = albada, posta, sortida i posta
   de lluna (amb el mapa obert: pin d'objectiu ☀️/🌙). Els botons antics es queden al DOM, amagats: els nous els premen. */
#mfEclSim #mfTbBrightBtn,#mfEclSim #mfSimSunFab,#mfEclSim #mfSimMoonFab,#mfEclSim #mfSimStarsFab,#mfEclSim #mfSimMotionFab,#mfEclSim #mfSimScopeFab,#mfEclSim #mfSimSunTray,#mfEclSim #mfSimMoonTray{display:none!important;}
#mfSimOptFab{right:0.7rem;top:calc(6.5rem + env(safe-area-inset-top,0px));}
#mfSimMomFab{right:0.7rem;top:calc(9.3rem + env(safe-area-inset-top,0px));}
#mfSimOptFab.mf-dot::after{content:'';position:absolute;top:.08rem;right:.08rem;width:.55rem;height:.55rem;border-radius:50%;background:#f59e0b;box-shadow:0 0 0 2px rgba(0,0,0,.7);}
#mfSimOptFab.active,#mfSimMomFab.active{border-color:#fcd34d;background:rgba(120,85,10,.75);}
#mfSimTourFab{width:2.1rem!important;height:2.1rem!important;font-size:1rem!important;margin-right:.2rem;}
#mfEclSim #mfSimTourFab{top:calc(12.3rem + env(safe-area-inset-top,0px))!important;}
.mf-rc-pop{position:absolute;right:3.5rem;z-index:9;display:flex;flex-direction:column;gap:.3rem;align-items:stretch;min-width:12rem;max-width:calc(100vw - 5rem);}
.mf-rc-pop[hidden]{display:none!important;}
.mf-rc-pop button{display:flex;align-items:center;gap:.5rem;text-align:left;background:rgba(10,15,28,.95);border:1px solid rgba(255,255,255,.3);color:#fff;border-radius:.8rem;padding:.55rem .75rem;font-weight:700;font-size:.82rem;cursor:pointer;white-space:nowrap;box-shadow:0 4px 14px rgba(0,0,0,.5);}
.mf-rc-pop button .st{margin-left:auto;font-size:.7rem;font-weight:800;padding:.1rem .45rem;border-radius:1rem;background:rgba(148,163,184,.25);color:#cbd5e1;}
.mf-rc-pop button .st.on{background:rgba(57,255,20,.22);color:#b7ffa8;}
#mfEclSim.mf-sim-cal #mfSimOptFab,#mfEclSim.mf-sim-cal #mfSimMomFab,#mfEclSim.mf-sim-cal .mf-rc-pop,
#mfEclSim.mf-sim-cleanview #mfSimOptFab,#mfEclSim.mf-sim-cleanview #mfSimMomFab,#mfEclSim.mf-sim-cleanview .mf-rc-pop{display:none!important;}
@media(max-width:620px){
  #mfSimOptFab{right:.42rem;top:calc(6.05rem + env(safe-area-inset-top,0px));}
  #mfSimMomFab{right:.42rem;top:calc(8.85rem + env(safe-area-inset-top,0px));}
  .mf-rc-pop{right:3.1rem;}
  #mfEclSim #mfSimTourFab{top:calc(11.85rem + env(safe-area-inset-top,0px))!important;}
}
#mfSimMotionFab svg{display:block;}
#mfSimAlignFab{color:#5eead4;border-color:rgba(45,212,191,0.7);font-size:1.35rem;font-weight:800;margin-top:.35rem;}   /* 20-09: viu a la columna esquerra (#mfSimModeCol), 8è; el marge el separa dels modes */
/* Mòbil estret: rellotge + Ara + Màxim han de cabre en una línia */
@media (max-width:480px){
  #mfEclSimNowBtn,#mfEclSimMaxBtn{font-size:0.6rem!important;padding:0.25rem 0.38rem!important;}
  #mfEclSimClock{font-size:1.6rem!important;}
}
/* Files de botons del simulador a AMPLADES IGUALS i alineades:
   .mf-eqrow → tots a una línia repartint-se l'espai (2 → meitats, 3 → terços)
   .mf-eqwrap → parelles del 50%; si el recompte és senar, l'últim omple tota la fila */
#mfEclSim .mf-eqrow{display:flex;gap:0.45rem}
#mfEclSim .mf-eqrow>*{flex:1 1 0;min-width:0}
#mfEclSim .mf-eqwrap{display:flex;flex-wrap:wrap;gap:0.45rem}
#mfEclSim .mf-eqwrap>*{flex:1 1 calc(50% - 0.25rem);min-width:calc(50% - 0.25rem)}
#mfEclSim :is(.mf-eqrow,.mf-eqwrap) :is(.mf-sim-btn,.mf-sim-chip){white-space:normal;text-align:center;padding-left:0.4rem;padding-right:0.4rem}
.mf-today-chip .n{display:inline-block;background:rgba(239,68,68,0.85);color:#fff;border-radius:1rem;padding:0 0.4rem;font-size:0.68rem;vertical-align:1px}
.mf-alerts-bar > #meteoAlertBanner,
.mf-alerts-bar > #firesAlertBanner{
  position:static !important;
  top:auto !important;
  margin:0 0.55rem !important;
  flex:1 1 320px;
  min-width:min(calc(100% - 1.1rem),300px);
  border-radius:0.9rem !important;
  overflow:hidden;
}
#firesProximityBanner{display:none;position:sticky;top:0;z-index:1000;margin:0.5rem -1rem 0.5rem;padding:0.65rem 1rem;font-size:0.9rem;font-weight:700;color:#fff;align-items:center;gap:0.6rem;flex-wrap:wrap;background:linear-gradient(90deg,#7f1d1d,#dc2626,#7f1d1d);background-size:200% 100%;animation:mfAlarmPulse 1.6s ease-in-out infinite;box-shadow:0 4px 18px rgba(220,38,38,0.5)}
@keyframes mfAlarmPulse{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
#firesProximityBanner .mf-alarm-siren{font-size:1.5rem;animation:mfSirenShake 0.7s ease-in-out infinite}
@keyframes mfSirenShake{0%,100%{transform:rotate(-8deg)}50%{transform:rotate(8deg)}}
/* Barra d'emojis */
.gl-com-emojis{display:flex;flex-wrap:wrap;gap:0.15rem;padding:0.4rem 0.6rem 0}
.gl-com-emo{background:none;border:none;font-size:1.15rem;line-height:1;cursor:pointer;padding:0.15rem 0.2rem;border-radius:0.3rem;transition:transform 0.1s}
.gl-com-emo:hover{transform:scale(1.25);background:rgba(255,255,255,0.08)}
@keyframes glFadeIn{from{opacity:0}to{opacity:1}}
.gl-backdrop{position:absolute;inset:0;background:rgba(5,5,15,0.96);backdrop-filter:blur(6px)}
.gl-close{position:absolute;top:1rem;right:1rem;width:2.5rem;height:2.5rem;border-radius:50%;background:rgba(255,255,255,0.1);border:none;color:white;font-size:1.3rem;cursor:pointer;z-index:2;transition:background 0.15s;display:flex;align-items:center;justify-content:center}
.gl-close:hover{background:rgba(255,255,255,0.2)}
.gl-nav{position:absolute;top:50%;transform:translateY(-50%);width:3rem;height:3rem;border-radius:50%;background:rgba(255,255,255,0.1);border:none;color:white;font-size:2rem;cursor:pointer;z-index:2;transition:background 0.15s;display:flex;align-items:center;justify-content:center;line-height:1;padding:0;font-family:serif;font-weight:300}
.gl-nav:hover{background:rgba(255,255,255,0.25)}
.gl-prev{left:1rem}
.gl-next{right:calc(300px + 1.5rem)}  /* 300px panell info + 1rem margin + 0.5rem aire */
/* Layout per defecte (landscape — PC/Mac/tauleta horitzontal):
   stage a l'esquerra, panell d'info i puntuació a la DRETA */
.gl-stage{position:relative;width:calc(100vw - 340px);max-width:calc(100vw - 340px);height:calc(100vh - 6rem);margin:3rem 320px 3rem 1rem;display:flex;align-items:center;justify-content:center}
.gl-img{position:absolute;max-width:100%;max-height:100%;object-fit:contain;border-radius:0.4rem;box-shadow:0 8px 40px rgba(0,0,0,0.6);transition:opacity 0.6s ease;opacity:0}
.gl-img.gl-active{opacity:1}
.gl-controls{position:absolute;bottom:1rem;left:calc(50vw - 160px);transform:translateX(-50%);display:flex;gap:0.5rem;z-index:2}
.gl-btn{padding:0.5rem 1rem;background:rgba(255,255,255,0.12);border:1px solid rgba(255,255,255,0.2);border-radius:0.45rem;color:white;font-size:0.85rem;font-weight:600;cursor:pointer;transition:background 0.15s;backdrop-filter:blur(4px)}
.gl-btn:hover{background:rgba(255,255,255,0.22)}
.gl-btn.gl-active-btn{background:#10b981;border-color:#10b981}
.gl-info{position:absolute;top:4rem;right:1rem;bottom:4rem;width:300px;background:rgba(0,0,0,0.7);backdrop-filter:blur(10px);color:white;padding:0.8rem 1rem;border-radius:0.6rem;font-size:0.85rem;line-height:1.55;border:1px solid rgba(255,255,255,0.12);overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;z-index:2}
.gl-info strong{color:#fbbf24}
.gl-info-row{display:flex;flex-wrap:wrap;gap:0.7rem;margin-top:0.2rem}
.gl-info-row span{font-family:monospace;font-size:0.82rem}
.gl-counter{position:absolute;bottom:1rem;right:1rem;background:rgba(0,0,0,0.6);color:white;padding:0.4rem 0.7rem;border-radius:0.4rem;font-size:0.85rem;font-weight:700;font-family:monospace;backdrop-filter:blur(4px);z-index:3}

/* Portrait (mòbil + iPad/tauleta vertical): panell d'info A BAIX */
@media (orientation: portrait){
  .gl-stage{width:100vw;max-width:100vw;height:calc(55vh);margin:3rem 0 0 0}
  .gl-info{top:auto;left:0.5rem;right:0.5rem;bottom:0.5rem;width:auto;max-height:42vh;padding:0.6rem 0.8rem;font-size:0.8rem}
  .gl-controls{bottom:auto;top:0.6rem;left:50%;transform:translateX(-50%)}
  .gl-counter{bottom:auto;top:0.6rem;right:0.6rem;font-size:0.78rem}
  .gl-btn{padding:0.4rem 0.7rem;font-size:0.78rem}
  .gl-next{right:1rem}  /* en portrait l'info és a baix, el next torna al costat dret */
}

/* Pantalles molt estretes (mòbil) — ajustos addicionals */
@media(max-width:480px){
  .gl-nav{width:2.4rem;height:2.4rem;font-size:1.6rem}
  .gl-info{font-size:0.76rem;padding:0.5rem 0.7rem;max-height:38vh}
  .gl-stage{height:50vh}
}

/* === MODE PRESENTACIÓ: foto neta, sense info ni puntuació ===
   S'activa quan el slideshow està en marxa. Tot el chrome s'esvaeix;
   el botó tancar es manté subtil i el botó "Aturar" reapareix amb hover/tap. */
.gallery-lightbox.gl-presenting .gl-stage{width:100vw!important;max-width:100vw!important;height:100vh!important;margin:0!important}
.gallery-lightbox.gl-presenting .gl-info,
.gallery-lightbox.gl-presenting .gl-counter,
.gallery-lightbox.gl-presenting .gl-nav{opacity:0;pointer-events:none;transition:opacity 0.4s ease}
.gallery-lightbox.gl-presenting .gl-controls{opacity:0.25;transition:opacity 0.3s ease}
.gallery-lightbox.gl-presenting .gl-controls:hover,
.gallery-lightbox.gl-presenting:hover .gl-controls{opacity:1}
.gallery-lightbox.gl-presenting .gl-close{opacity:0.35;transition:opacity 0.3s ease}
.gallery-lightbox.gl-presenting .gl-close:hover,
.gallery-lightbox.gl-presenting:hover .gl-close{opacity:1}

/* Fullscreen real del navegador: stage ocupa tot */
:fullscreen .gl-stage{width:100vw;max-width:100vw;height:100vh;margin:0}
:fullscreen .gl-img{max-height:100vh}
:fullscreen .gl-info{top:4rem;right:1rem;bottom:4rem}
:fullscreen .gl-next{right:calc(300px + 1.5rem)}  /* manté la coherència amb panell info visible */
@media (orientation: portrait){
  :fullscreen .gl-stage{height:58vh;margin-top:3rem}
  :fullscreen .gl-info{top:auto;left:0.5rem;right:0.5rem;bottom:0.5rem;max-height:42vh}
  :fullscreen .gl-next{right:1rem}
}

/* === CIRCUMPOLAR: ESTRELLES ROTANT === */
.circumpolar-hero{position:relative;overflow:hidden}
.circumpolar-stage{position:absolute;top:50%;right:-40px;transform:translateY(-50%);width:300px;height:300px;pointer-events:none;opacity:0.55}
.cp-polaris{position:absolute;top:50%;left:50%;width:5px;height:5px;border-radius:50%;background:#fff;box-shadow:0 0 6px #fff,0 0 12px #fff,0 0 24px rgba(255,255,255,0.5);transform:translate(-50%,-50%);z-index:5}
.cp-arc{position:absolute;top:50%;left:50%;border-radius:50%;border:1px solid transparent;transform-origin:center}
.cp-arc-1{width:60px;height:60px;border-top-color:rgba(255,255,255,0.55);border-right-color:rgba(255,255,255,0.25);margin:-30px 0 0 -30px;animation:cpSpin 30s linear infinite}
.cp-arc-2{width:120px;height:120px;border-top-color:rgba(180,220,255,0.45);border-left-color:rgba(180,220,255,0.18);margin:-60px 0 0 -60px;animation:cpSpin 45s linear infinite reverse}
.cp-arc-3{width:200px;height:200px;border-top-color:rgba(255,200,180,0.38);border-bottom-color:rgba(255,200,180,0.13);margin:-100px 0 0 -100px;animation:cpSpin 60s linear infinite}
.cp-arc-4{width:280px;height:280px;border-top-color:rgba(180,255,220,0.28);border-right-color:rgba(180,255,220,0.10);margin:-140px 0 0 -140px;animation:cpSpin 90s linear infinite reverse}
@keyframes cpSpin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}

/* === MÈTODES A vs B === */
.cp-methods{display:grid;grid-template-columns:1fr 1fr;gap:0.7rem}
@media(max-width:800px){.cp-methods{grid-template-columns:1fr}}
.cp-method{background:var(--card-2);border-radius:0.6rem;padding:0.9rem;border:1px solid var(--border)}
.cp-method-b{border:2px solid #4ade80;background:linear-gradient(180deg,rgba(74,222,128,0.05),transparent)}
.cp-method-header{margin-bottom:0.4rem}
.cp-method-tag{display:inline-block;font-size:0.7rem;font-weight:700;text-transform:uppercase;letter-spacing:0.6px;color:var(--muted-2);background:var(--card);padding:0.15rem 0.5rem;border-radius:0.3rem;margin-bottom:0.3rem}
.cp-method-tag-recommended{background:linear-gradient(135deg,#4ade80,#22c55e);color:white}
.cp-method h4{font-size:1rem;margin:0.2rem 0;color:var(--text)}
.cp-pros-cons{display:grid;grid-template-columns:1fr 1fr;gap:0.6rem;margin-top:0.5rem}
@media(max-width:500px){.cp-pros-cons{grid-template-columns:1fr}}
.cp-pros,.cp-cons{font-size:0.82rem;line-height:1.5}
.cp-pros strong{color:#4ade80;display:block;margin-bottom:0.3rem;font-size:0.85rem}
.cp-cons strong{color:#f87171;display:block;margin-bottom:0.3rem;font-size:0.85rem}
.cp-pros ul,.cp-cons ul{padding-left:1rem;margin:0;color:var(--muted)}
.cp-pros li,.cp-cons li{margin-bottom:0.25rem}

/* === ISO COMPARE === */
.cp-iso-compare{display:grid;grid-template-columns:1fr 1fr;gap:0.7rem}
@media(max-width:700px){.cp-iso-compare{grid-template-columns:1fr}}
.cp-iso-block{background:var(--card-2);padding:0.9rem;border-radius:0.6rem;border:1px solid var(--border)}
.cp-iso-low{border-left:4px solid #fbbf24}
.cp-iso-high{border-left:4px solid #60a5fa}
.cp-iso-tag{display:inline-block;font-size:0.78rem;font-weight:700;color:var(--muted);background:var(--card);padding:0.2rem 0.5rem;border-radius:0.3rem;margin-bottom:0.3rem}
.cp-iso-block h4{font-size:0.95rem;margin:0.2rem 0 0.4rem;color:var(--text)}
.cp-iso-block ul{padding-left:1rem;margin:0;color:var(--muted)}
.auth-status{display:flex;align-items:center;gap:0.5rem;font-size:0.9rem;background:var(--card);padding:0.5rem 1rem;border-radius:2rem;box-shadow:var(--shadow);color:var(--text);position:relative}
.auth-status .email{color:var(--primary);font-weight:600;max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.auth-status .badge-warn{color:var(--warning)}
.auth-status .badge-ok{color:var(--success)}
.auth-user-btn{display:inline-flex;align-items:center;gap:0.4rem;background:transparent;border:none;cursor:pointer;color:inherit;font-size:inherit;padding:0;font-family:inherit}
.auth-user-caret{font-size:0.7rem;color:var(--muted);margin-left:0.1rem;transition:transform 0.15s}
.auth-user-btn[aria-expanded="true"] .auth-user-caret{transform:rotate(180deg)}

/* Dropdown del menú d'usuari */
.auth-user-menu{position:absolute;top:calc(100% + 0.4rem);right:0;background:var(--card);border:1px solid var(--border);border-radius:0.6rem;box-shadow:0 8px 24px rgba(0,0,0,0.18);min-width:180px;padding:0.3rem;z-index:1100;animation:authMenuFade 0.15s ease}
.auth-user-menu[hidden]{display:none}
@keyframes authMenuFade{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
.auth-user-menu-item{display:flex;align-items:center;gap:0.6rem;width:100%;padding:0.55rem 0.7rem;border:none;background:transparent;color:var(--text);font-size:0.88rem;text-align:left;cursor:pointer;border-radius:0.4rem;transition:background 0.12s,color 0.12s}
.auth-user-menu-item:hover{background:var(--card-2)}
.auth-user-menu-item span{font-size:1.05rem;width:1.4rem;display:inline-flex;justify-content:center}
/* 16-10 (Jaume): idioma i dia · nit · vermell dins del menú d'usuari (amb sessió surten de la fila de dalt): icona + selector segmentat */
.auth-user-menu{min-width:232px}
.mf-menu-seg{display:flex;align-items:center;gap:.6rem;padding:.35rem .7rem}
.mf-menu-ic{flex:0 0 auto;display:inline-flex;justify-content:center;width:1.4rem;font-size:1.05rem}
.mf-menu-opts{flex:1 1 auto;display:flex;gap:2px;padding:2px;border-radius:9px;background:var(--card-2)}
.mf-menu-opts button{flex:1 1 0;min-width:0;padding:.38rem .35rem;border:0;border-radius:7px;background:transparent;color:var(--text);font:600 .8rem system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;white-space:nowrap;cursor:pointer}
.mf-menu-opts button.active{background:var(--card);box-shadow:0 1px 3px rgba(0,0,0,.18)}
.auth-user-menu-item.logout{color:var(--danger)}
.auth-user-menu-item.logout:hover{background:rgba(220,38,38,0.1);color:var(--danger)}
.btn-link{background:none;border:none;color:var(--accent);cursor:pointer;font-size:0.9rem;text-decoration:underline;padding:0}
.btn-link:hover{color:var(--primary)}
.mf-signup-cta{text-align:center;font-size:1.05rem!important;font-weight:700;padding:0.85rem;margin-top:0.6rem;background:rgba(56,189,248,0.14);border:1.5px solid rgba(56,189,248,0.45);border-radius:0.7rem}
.mf-signup-cta,.mf-signup-cta #toggleModeText,#modalWelcome .mf-signup-cta,#modalWelcome .mf-signup-cta #toggleModeText{color:#f1f5f9!important}
.btn-signup-hl{background:linear-gradient(135deg,#0ea5e9,#6366f1);color:#fff;border:none;border-radius:0.5rem;padding:0.4rem 1rem;font-size:0.95rem;font-weight:800;cursor:pointer;margin-left:0.35rem;box-shadow:0 2px 8px rgba(14,165,233,0.35);transition:transform 0.12s,box-shadow 0.12s}
.btn-signup-hl:hover{transform:scale(1.05);box-shadow:0 4px 12px rgba(14,165,233,0.5)}
.btn-signup-hl:active{transform:scale(0.97)}
.theme-toggle{background:var(--card);border:none;border-radius:50%;width:40px;height:40px;cursor:pointer;font-size:1.2rem;box-shadow:var(--shadow);transition:transform 0.2s,background 0.3s;display:flex;align-items:center;justify-content:center}
.theme-toggle:hover{transform:scale(1.1)}

/* Badge "X connectats" — discret al header */
.online-badge{display:inline-flex;align-items:center;gap:0.3rem;background:var(--card);border:1px solid var(--border);border-radius:1rem;padding:0.18rem 0.6rem;font-size:0.72rem;font-weight:600;color:var(--text);box-shadow:var(--shadow);cursor:help;user-select:none;line-height:1;opacity:0.85;transition:opacity 0.2s}
.online-badge[hidden]{display:none!important}
.online-badge:hover{opacity:1}
.online-dot{width:7px;height:7px;border-radius:50%;background:#10b981;box-shadow:0 0 4px rgba(16,185,129,0.6);animation:onlinePulse 2s ease-in-out infinite}
@keyframes onlinePulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:0.55;transform:scale(0.85)}}
@media (max-width:520px){.online-badge{font-size:0.65rem;padding:0.15rem 0.45rem}.online-dot{width:6px;height:6px}}

/* Tabs */
.tabs{display:flex;flex-direction:column;gap:0.35rem;background:var(--card);border-radius:0.8rem;padding:0.3rem;box-shadow:var(--shadow);position:sticky;top:0.4rem;z-index:100}
.tab-row{display:grid;gap:0.2rem}
.tab-row-primary{grid-template-columns:repeat(5,1fr)}
.tab-row-knowledge{grid-template-columns:repeat(7,1fr);padding:0.25rem 0.35rem;background:rgba(120,120,120,0.05);border-radius:0.5rem;border:1px dashed rgba(120,120,120,0.2);align-items:center;position:relative}
.tab-row-label{grid-column:1/-1;font-size:0.66rem;font-weight:700;text-transform:uppercase;letter-spacing:0.6px;color:var(--muted-2);padding:0.1rem 0.4rem;opacity:0.7}
@media(max-width:900px){.tab-row-primary{grid-template-columns:repeat(4,1fr)}.tab-row-knowledge{grid-template-columns:repeat(4,1fr)}}
@media(max-width:600px){.tab-row-primary{grid-template-columns:repeat(3,1fr)}.tab-row-knowledge{grid-template-columns:repeat(3,1fr)}}
@media(max-width:400px){.tab-row-primary{grid-template-columns:repeat(2,1fr)}.tab-row-knowledge{grid-template-columns:repeat(2,1fr)}}
.tab-btn{padding:0.45rem 0.4rem;border:none;background:transparent;border-radius:0.45rem;cursor:pointer;font-size:0.8rem;font-weight:600;color:var(--muted);transition:all 0.2s;display:flex;align-items:center;justify-content:center;gap:0.25rem;text-align:center;text-decoration:none;line-height:1.15;min-height:34px}
.tab-btn:hover{background:var(--suggestions-hover);color:var(--primary)}
.tab-btn.active{background:var(--primary);color:white}
.tab-btn.tab-external{color:var(--accent);background:linear-gradient(135deg,rgba(22,138,173,0.08),rgba(22,138,173,0.15));border:1px dashed rgba(22,138,173,0.4)}
.tab-btn.tab-external:hover{background:var(--accent);color:white;border-color:var(--accent)}
/* Pestanyes de coneixement: estil més apagat */
.tab-btn.tab-knowledge{font-size:0.74rem;padding:0.35rem 0.3rem;font-weight:500;color:var(--muted-2);min-height:30px;background:transparent}
.tab-btn.tab-knowledge:hover{color:var(--accent);background:rgba(22,138,173,0.06)}
.tab-btn.tab-knowledge.active{background:var(--accent);color:white;font-weight:600}
@media(max-width:600px){.tab-btn{font-size:0.74rem;padding:0.4rem 0.25rem;min-height:32px}.tab-btn.tab-knowledge{font-size:0.68rem;min-height:28px}}
.tab-content{display:none;flex-direction:column;gap:1.5rem;width:100%;max-width:1100px;min-width:0;margin-inline:auto}
.tab-content.active{display:flex;animation:fadeIn 0.25s ease}
@keyframes fadeIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}

/* Cards */
.card{background:var(--card);border-radius:1.25rem;padding:1.5rem;box-shadow:var(--shadow);color:var(--text);transition:box-shadow 0.2s}
.card.gradient{color:white}
.card.gradient h2,.card.gradient h3,.card.gradient h4{color:white}
.card.aurora{background:var(--grad-aurora);color:white}
.card.aurora h2,.card.aurora h3{color:white}
.card.photo-grad{background:var(--grad-photo);color:white}
.card.night-grad{background:var(--grad-night);color:white}
.card.sunmoon-grad{background:var(--grad-sunmoon);color:white}
.card.alert-grad{background:var(--grad-alerts);color:white}

/* Inputs / botons */
.add-location{display:flex;flex-wrap:wrap;gap:0.5rem;align-items:flex-start}
.add-location input,.input-clean{flex:1 1 200px;padding:0.8rem 1rem;border:2px solid var(--border);border-radius:2.5rem;font-size:1rem;outline:none;transition:border-color 0.3s;background:var(--input-bg);color:var(--text)}
.add-location input:focus,.input-clean:focus{border-color:var(--accent)}
.btn{padding:0.8rem 1.5rem;border:none;border-radius:2.5rem;background:var(--primary);color:white;font-weight:600;cursor:pointer;font-size:1rem;transition:background 0.2s,transform 0.1s;display:inline-flex;align-items:center;justify-content:center;gap:0.4rem}
/* Reforçar l'atribut hidden — alguns components (.btn, etc.) usen display:inline-flex i fan que hidden no funcioni */
[hidden]{display:none !important}
.btn:hover{background:var(--accent)}
.btn:active{transform:scale(0.97)}
.btn:disabled{opacity:0.6;cursor:not-allowed}
/* Vista setmanal calendari de "Triar lloc avui" — 7 columnes estil Google Calendar */
.photo-cal-week{display:grid;grid-template-columns:repeat(7,minmax(110px,1fr));border:1px solid var(--border);border-radius:0.5rem;background:var(--card);box-shadow:0 1px 3px rgba(0,0,0,0.06)}
.photo-cal-week-wrap{overflow-x:auto;overflow-y:visible;-webkit-overflow-scrolling:touch;width:100%;max-width:100%;border-radius:0.5rem;scroll-padding-left:0.5rem;scroll-snap-type:x proximity}
.photo-cal-day-col{border-right:1px solid var(--border);display:flex;flex-direction:column;min-height:380px}
.photo-cal-day-col:last-child{border-right:none}
.photo-cal-day-col.is-past{opacity:0.45;background:repeating-linear-gradient(45deg,transparent,transparent 6px,rgba(125,125,125,0.04) 6px,rgba(125,125,125,0.04) 12px)}
.photo-cal-day-col.is-today{background:rgba(99,168,255,0.05)}
.photo-cal-day-head{text-align:center;padding:0.6rem 0.3rem 0.5rem;border-bottom:1px solid var(--border);background:var(--card-2,rgba(125,125,125,0.04))}
.photo-cal-day-name{font-size:0.72rem;text-transform:uppercase;color:var(--muted);font-weight:600;letter-spacing:0.5px;line-height:1}
.photo-cal-day-num{font-size:1.5rem;font-weight:400;color:var(--text);margin-top:0.25rem;line-height:1}
.photo-cal-day-col.is-today .photo-cal-day-num{display:inline-flex;width:2rem;height:2rem;justify-content:center;align-items:center;border-radius:50%;background:rgba(99,168,255,0.22);color:#5b9eff;font-weight:600;font-size:1.05rem;margin-top:0.2rem}
.photo-cal-events{padding:0.4rem 0.35rem 0.5rem;display:flex;flex-direction:column;gap:0.25rem;flex:1;justify-content:flex-start}
.photo-cal-event{font-size:0.72rem;padding:0.3rem 0.45rem;border-radius:0.3rem;background:rgba(125,125,125,0.13);color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.3}
.photo-cal-event-score{padding:0.4rem 0.45rem;border-radius:0.35rem;font-weight:700;text-align:center;font-size:0.85rem;color:white;line-height:1.1}
.photo-cal-event-score.score-high{background:linear-gradient(135deg,#10b981,#059669)}
.photo-cal-event-score.score-mid{background:linear-gradient(135deg,#fbbf24,#d97706)}
.photo-cal-event-score.score-low{background:linear-gradient(135deg,#f87171,#dc2626)}
.photo-cal-event-score.score-na{background:rgba(125,125,125,0.25);color:var(--muted)}
.photo-cal-event.ev-sunrise{background:rgba(251,191,36,0.18);color:#d97706;border:1px solid rgba(251,191,36,0.35)}
.photo-cal-event.ev-sunset{background:rgba(244,114,182,0.18);color:#db2777;border:1px solid rgba(244,114,182,0.35)}
.photo-cal-event.ev-night{background:rgba(99,102,241,0.18);color:#4f46e5;border:1px solid rgba(99,102,241,0.35)}
.photo-cal-event.ev-fog{background:rgba(148,163,184,0.18);color:#475569;border:1px solid rgba(148,163,184,0.35)}
.photo-cal-event.ev-rain{background:rgba(56,189,248,0.18);color:#0284c7;border:1px solid rgba(56,189,248,0.35)}
/* Nocturna combinada: color segons score d'estels */
.photo-cal-event.ev-night-good{background:rgba(99,102,241,0.25);color:#4338ca;border:1px solid rgba(99,102,241,0.5);font-weight:600}
.photo-cal-event.ev-night-mid{background:rgba(99,102,241,0.13);color:#6366f1;border:1px solid rgba(99,102,241,0.3)}
.photo-cal-event.ev-night-low{background:rgba(99,102,241,0.08);color:#818cf8;border:1px solid rgba(99,102,241,0.2);opacity:0.85}
/* Vent: ok / mig / fort */
.photo-cal-event.ev-wind-ok{background:rgba(134,239,172,0.18);color:#15803d;border:1px solid rgba(134,239,172,0.35)}
.photo-cal-event.ev-wind-mid{background:rgba(253,224,71,0.18);color:#a16207;border:1px solid rgba(253,224,71,0.35)}
.photo-cal-event.ev-wind-high{background:rgba(248,113,113,0.18);color:#b91c1c;border:1px solid rgba(248,113,113,0.35)}
.photo-cal-event.ev-wind-na{background:rgba(125,125,125,0.13);color:var(--muted)}
/* Lluna: bona (poca llum) / mitja / brillant */
.photo-cal-event.ev-moon-good{background:rgba(30,64,175,0.13);color:#1e40af;border:1px solid rgba(30,64,175,0.3)}
.photo-cal-event.ev-moon-mid{background:rgba(125,125,125,0.13);color:var(--text);border:1px solid rgba(125,125,125,0.25)}
.photo-cal-event.ev-moon-bright{background:rgba(250,204,21,0.18);color:#a16207;border:1px solid rgba(250,204,21,0.35)}
/* Centre Galàctic: visible bo / mig / baix / no visible */
.photo-cal-event.ev-gc-good{background:rgba(168,85,247,0.22);color:#7e22ce;border:1px solid rgba(168,85,247,0.45);font-weight:600}
.photo-cal-event.ev-gc-mid{background:rgba(168,85,247,0.13);color:#9333ea;border:1px solid rgba(168,85,247,0.3)}
.photo-cal-event.ev-gc-low{background:rgba(168,85,247,0.08);color:#a855f7;border:1px solid rgba(168,85,247,0.2)}
.photo-cal-event.ev-gc-no{background:rgba(125,125,125,0.08);color:var(--muted);border:1px dashed rgba(125,125,125,0.25);opacity:0.7}
/* Oportunitat fotogràfica: lluna plena (≥95%) sortint o ponent-se durant el dia (sol per sobre l'horitzó) */
.photo-cal-event.ev-fmd{background:linear-gradient(135deg,rgba(250,204,21,0.45),rgba(251,146,60,0.40));color:#92400e;border:1px solid rgba(245,158,11,0.7);font-weight:700;animation:fmdPulse 1.4s ease-in-out infinite}
@keyframes fmdPulse{
  0%,100%{
    box-shadow:0 0 6px rgba(250,204,21,0.5), 0 0 12px rgba(251,146,60,0.30);
    border-color:rgba(245,158,11,0.6);
  }
  50%{
    box-shadow:0 0 18px rgba(250,204,21,0.95), 0 0 32px rgba(251,146,60,0.65), 0 0 50px rgba(245,158,11,0.35);
    border-color:rgba(245,158,11,1);
  }
}
[data-theme="dark"] .photo-cal-event.ev-fmd{color:#fde68a;background:linear-gradient(135deg,rgba(250,204,21,0.35),rgba(251,146,60,0.25));border-color:rgba(250,204,21,0.7)}
[data-theme="dark"] .photo-cal-event.ev-sunrise{color:#fbbf24}
[data-theme="dark"] .photo-cal-event.ev-sunset{color:#f472b6}
[data-theme="dark"] .photo-cal-event.ev-night{color:#a5b4fc}
[data-theme="dark"] .photo-cal-event.ev-night-good{color:#a5b4fc}
[data-theme="dark"] .photo-cal-event.ev-night-mid{color:#818cf8}
[data-theme="dark"] .photo-cal-event.ev-night-low{color:#6366f1}
[data-theme="dark"] .photo-cal-event.ev-fog{color:#cbd5e1}
[data-theme="dark"] .photo-cal-event.ev-rain{color:#7dd3fc}
[data-theme="dark"] .photo-cal-event.ev-wind-ok{color:#86efac}
[data-theme="dark"] .photo-cal-event.ev-wind-mid{color:#fde047}
[data-theme="dark"] .photo-cal-event.ev-wind-high{color:#fca5a5}
[data-theme="dark"] .photo-cal-event.ev-moon-good{color:#93c5fd}
[data-theme="dark"] .photo-cal-event.ev-moon-bright{color:#fde047}
[data-theme="dark"] .photo-cal-event.ev-gc-good{color:#d8b4fe}
[data-theme="dark"] .photo-cal-event.ev-gc-mid{color:#c084fc}
[data-theme="dark"] .photo-cal-event.ev-gc-low{color:#a855f7}
[data-theme="dark"] .photo-cal-day-col.is-today{background:rgba(99,168,255,0.08)}
@media (max-width:640px){
  .photo-cal-week{grid-template-columns:repeat(7,140px);width:max-content;min-width:max-content}
  .photo-cal-event{font-size:0.7rem}
  .photo-cal-day-col{scroll-snap-align:start}
  .photo-cal-week-wrap::-webkit-scrollbar{height:6px}
  .photo-cal-week-wrap::-webkit-scrollbar-thumb{background:rgba(125,125,125,0.4);border-radius:3px}
}
/* Modal de detall del dia (Setmana) */
.phd-block{margin-bottom:1rem;padding:0.7rem 0.85rem;background:var(--card-2,rgba(125,125,125,0.05));border-radius:0.55rem;border:1px solid var(--border)}
.phd-block-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:0.55rem;font-weight:600;font-size:0.92rem;color:var(--text)}
.phd-score{font-size:1rem;font-weight:700}
.phd-factors{display:flex;flex-wrap:wrap;gap:0.35rem}
.phd-factor{font-size:0.74rem;padding:0.25rem 0.5rem;border-radius:0.35rem;font-weight:500}
.phd-factor.pos{background:rgba(16,185,129,0.13);color:#059669;border:1px solid rgba(16,185,129,0.3)}
.phd-factor.neg{background:rgba(239,68,68,0.13);color:#dc2626;border:1px solid rgba(239,68,68,0.3)}
.phd-factor.info{background:rgba(99,102,241,0.13);color:#4f46e5;border:1px solid rgba(99,102,241,0.3)}
[data-theme="dark"] .phd-factor.pos{color:#10b981}
[data-theme="dark"] .phd-factor.neg{color:#f87171}
[data-theme="dark"] .phd-factor.info{color:#a5b4fc}
.phd-row{font-size:0.86rem;padding:0.3rem 0;border-bottom:1px dashed var(--border-light,rgba(125,125,125,0.15))}
.phd-row:last-child{border-bottom:none}
.phd-plan-btn{padding:0.55rem 0.85rem;border-radius:0.5rem;border:1px solid var(--border);background:var(--card);color:var(--text);font-size:0.82rem;font-weight:600;cursor:pointer;transition:all 0.15s;display:inline-flex;align-items:center;gap:0.35rem;white-space:nowrap}
.phd-plan-btn:hover{transform:translateY(-1px);background:var(--accent);color:white;border-color:var(--accent);box-shadow:0 4px 10px rgba(6,182,212,0.25)}
.photo-cal-day-col[data-day-idx]{cursor:pointer;transition:background 0.15s}
.photo-cal-day-col[data-day-idx]:hover{background:rgba(99,168,255,0.07)}
.photo-cal-day-col.is-today[data-day-idx]:hover{background:rgba(99,168,255,0.13)}

/* === Widget de votació (estrelles + Top or) === */
.rating-widget{display:inline-flex;gap:0.4rem;align-items:center;flex-wrap:wrap}
.rating-stars{display:inline-flex;gap:0.05rem;align-items:center}
.rating-star{font-size:1.2rem;color:rgba(125,125,125,0.4);cursor:pointer;transition:color 0.15s,transform 0.15s;user-select:none;line-height:1;padding:0 0.05rem}
.rating-star.active{color:#fbbf24}
.rating-star:hover{transform:scale(1.25);color:#f59e0b}
.rating-star.preview{color:#fde047}
.rating-zero-btn{background:transparent;border:1.5px solid rgba(125,125,125,0.4);border-radius:0.4rem;padding:0.2rem 0.55rem;font-size:0.95rem;cursor:pointer;transition:all 0.15s;color:var(--muted);font-weight:700;display:inline-flex;align-items:center;justify-content:center;line-height:1.1;min-width:1.9rem}
.rating-zero-btn:hover{transform:scale(1.05);border-color:#94a3b8;color:var(--text)}
.rating-zero-btn.active{background:#64748b;border-color:#64748b;color:white;box-shadow:0 2px 6px rgba(100,116,139,0.4)}
.rating-top-btn{background:transparent;border:1.5px solid rgba(125,125,125,0.4);border-radius:0.4rem;padding:0.2rem 0.55rem;font-size:0.95rem;cursor:pointer;transition:all 0.15s;color:var(--muted);font-weight:600;display:inline-flex;align-items:center;gap:0.25rem;line-height:1.1}
.rating-top-btn:hover{transform:scale(1.05);border-color:#d97706}
.rating-top-btn.active{background:linear-gradient(135deg,#fbbf24,#d97706);border-color:#d97706;color:white;box-shadow:0 2px 8px rgba(251,191,36,0.5)}
.rating-readonly .rating-star,.rating-readonly .rating-top-btn,.rating-readonly .rating-zero-btn{cursor:default;pointer-events:none}
.rating-readonly .rating-star:hover,.rating-readonly .rating-top-btn:hover,.rating-readonly .rating-zero-btn:hover{transform:none}

/* Badge de punts (visible sempre per a tothom) */
.rating-points-badge{display:inline-flex;align-items:center;gap:0.25rem;font-size:0.78rem;font-weight:700;padding:0.2rem 0.5rem;border-radius:0.4rem;background:linear-gradient(135deg,rgba(251,191,36,0.18),rgba(217,119,6,0.18));color:#92400e;border:1px solid rgba(251,191,36,0.4);white-space:nowrap}
.rating-points-badge.has-top{background:linear-gradient(135deg,rgba(251,191,36,0.3),rgba(217,119,6,0.4));color:#78350f;font-weight:800;animation:goldGlow 2s ease-in-out infinite}
.rating-points-badge.zero{background:rgba(125,125,125,0.13);color:var(--muted);border-color:rgba(125,125,125,0.25);font-weight:500}
[data-theme="dark"] .rating-points-badge{color:#fbbf24}
[data-theme="dark"] .rating-points-badge.has-top{color:#fcd34d}
[data-theme="dark"] .rating-points-badge.zero{color:var(--muted)}
@keyframes goldGlow{0%,100%{box-shadow:0 0 4px rgba(251,191,36,0.3)}50%{box-shadow:0 0 12px rgba(251,191,36,0.6)}}

/* Badge de punts dins els items de galeria (pla 'd'overlay') */
.gallery-item .rating-points-badge{position:absolute;bottom:8px;right:8px;font-size:0.68rem;padding:0.15rem 0.4rem;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);z-index:5;background:linear-gradient(135deg,rgba(251,191,36,0.85),rgba(217,119,6,0.85));color:white;border-color:rgba(251,191,36,0.6);text-shadow:0 1px 2px rgba(0,0,0,0.3)}
.gallery-item .rating-points-badge.zero{background:rgba(0,0,0,0.55);color:#cbd5e1;border-color:rgba(255,255,255,0.18);text-shadow:none}

/* Modal "Qui ha votat" */
.rating-vote-row{display:flex;align-items:center;justify-content:space-between;padding:0.55rem 0.7rem;border-bottom:1px solid var(--border);font-size:0.86rem}
.rating-vote-row:last-child{border-bottom:none}
.rating-vote-row .voter{display:flex;align-items:center;gap:0.5rem;flex:1;min-width:0}
.rating-vote-row .vote-display{font-weight:700;white-space:nowrap}
.rating-vote-row .vote-display.is-top{color:#d97706}
.rating-vote-row .vote-date{font-size:0.74rem;color:var(--muted);font-family:'SF Mono',monospace}
#accountAvatarWrap:hover{transform:scale(1.04);box-shadow:0 6px 18px rgba(6,182,212,0.35)!important;}
#accountAvatarWrap:active{transform:scale(0.98);}
/* Author badge: utilitzat a Plans, lightbox de galeria i (opcionalment) Ubicacions */
.author-badge{display:inline-flex;align-items:center;gap:0.32rem;font-size:inherit;line-height:1;vertical-align:middle}
.author-avatar-mini{width:1.5rem;height:1.5rem;border-radius:50%;background:linear-gradient(135deg,#06b6d4,#8b5cf6);color:white;display:inline-flex;align-items:center;justify-content:center;font-size:0.72rem;font-weight:700;flex-shrink:0;overflow:hidden;letter-spacing:0;border:1px solid rgba(255,255,255,0.18);box-shadow:0 1px 3px rgba(0,0,0,0.15)}
.author-avatar-mini img{width:100%;height:100%;object-fit:cover;display:block}
.author-prefix{font-size:0.85rem;flex-shrink:0;line-height:1}
.author-name{font-weight:500;color:inherit;white-space:nowrap}
.author-badge.size-lg .author-avatar-mini{width:2rem;height:2rem;font-size:0.92rem}

/* Avatar mini al botó d'auth-status (header) */
.auth-user-avatar{width:1.65rem;height:1.65rem;border-radius:50%;object-fit:cover;border:1.5px solid var(--success);box-shadow:0 1px 3px rgba(0,0,0,0.18);display:inline-block;vertical-align:middle;flex-shrink:0}
.auth-user-avatar-fallback{width:1.65rem;height:1.65rem;border-radius:50%;background:linear-gradient(135deg,#06b6d4,#8b5cf6);color:white;display:inline-flex;align-items:center;justify-content:center;font-size:0.78rem;font-weight:700;border:1.5px solid var(--success);flex-shrink:0}

/* Botó fullscreen flotant per a mapes (Leaflet + iframes) */
.map-fullscreen-btn{position:absolute;bottom:0.7rem;right:0.7rem;z-index:1000;width:2.4rem;height:2.4rem;border-radius:0.45rem;background:rgba(255,255,255,0.95);border:1px solid rgba(0,0,0,0.18);box-shadow:0 2px 8px rgba(0,0,0,0.2);cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;color:#1a2233;transition:background 0.15s,transform 0.12s,box-shadow 0.15s}
.map-fullscreen-btn:hover{background:rgba(255,255,255,1);transform:scale(1.08);box-shadow:0 4px 12px rgba(0,0,0,0.25)}
.map-fullscreen-btn:active{transform:scale(0.95)}
.map-fullscreen-btn svg{width:1.3rem;height:1.3rem;display:block}
[data-theme="dark"] .map-fullscreen-btn{background:rgba(40,55,90,0.92);color:white;border-color:rgba(255,255,255,0.22)}
[data-theme="dark"] .map-fullscreen-btn:hover{background:rgba(40,55,90,1)}

/* Botó "Localitzar-me" flotant (al costat del fullscreen) */
.map-locate-btn{position:absolute;bottom:0.7rem;right:3.4rem;z-index:1000;width:2.4rem;height:2.4rem;border-radius:0.45rem;background:rgba(255,255,255,0.95);border:1px solid rgba(0,0,0,0.18);box-shadow:0 2px 8px rgba(0,0,0,0.2);cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;font-size:1.15rem;color:#1a2233;transition:background 0.15s,transform 0.12s,box-shadow 0.15s}
.map-locate-btn:hover{background:rgba(255,255,255,1);transform:scale(1.08);box-shadow:0 4px 12px rgba(0,0,0,0.25)}
.map-locate-btn:active{transform:scale(0.95)}
.map-locate-btn.locating{animation:locatePulse 1.2s ease-in-out infinite;color:#3b82f6}
@keyframes locatePulse{0%,100%{box-shadow:0 0 0 0 rgba(59,130,246,0.6)}50%{box-shadow:0 0 0 8px rgba(59,130,246,0)}}
[data-theme="dark"] .map-locate-btn{background:rgba(40,55,90,0.92);color:white;border-color:rgba(255,255,255,0.22)}
[data-theme="dark"] .map-locate-btn:hover{background:rgba(40,55,90,1)}

/* Fake fullscreen per a iOS / dispositius sense Element.requestFullscreen */
.fake-fullscreen{position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important;z-index:99999!important;border-radius:0!important;margin:0!important;background:var(--card)}
.fake-fullscreen .map-fullscreen-btn,.fake-fullscreen .map-locate-btn{bottom:1.2rem;width:3rem;height:3rem}
.fake-fullscreen .map-fullscreen-btn{right:1.2rem}
.fake-fullscreen .map-locate-btn{right:4.7rem}
.fake-fullscreen iframe,.fake-fullscreen .leaflet-container{width:100%!important;height:100%!important}

/* Quan el wrapper està en fullscreen — engrandir contingut */
:fullscreen .map-fullscreen-btn,
*:fullscreen > .map-fullscreen-btn{bottom:1.2rem;right:1.2rem;width:3rem;height:3rem}
:fullscreen .map-locate-btn,
*:fullscreen > .map-locate-btn{bottom:1.2rem;right:4.7rem;width:3rem;height:3rem}
:fullscreen iframe,
:fullscreen .leaflet-container{width:100%!important;height:100%!important}
.map-wrapper:fullscreen,
[class*="map-wrapper"]:fullscreen{background:#000;display:flex;flex-direction:column}
.map-wrapper:fullscreen iframe,
[class*="map-wrapper"]:fullscreen iframe{flex:1;border:0}
.btn-outline{background:var(--card);border:2px solid var(--primary);color:var(--primary)}
.btn-outline:hover{background:var(--suggestions-hover)}
.btn-danger{background:var(--danger)}
.btn-sm{padding:0.4rem 0.9rem;font-size:0.85rem}

/* Suggestions */
.suggestions{width:100%;background:var(--suggestions-bg);border-radius:1rem;box-shadow:0 10px 25px rgba(0,0,0,0.1);margin-top:0.5rem;list-style:none;max-height:200px;overflow-y:auto}
.suggestions li{padding:0.75rem 1rem;cursor:pointer;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;color:var(--text)}
.suggestions li:hover{background:var(--suggestions-hover)}

/* Location cards */
.saved-list{display:flex;flex-direction:column;gap:0}
.saved-list>.locs-toolbar{margin-bottom:0.6rem}
.saved-list>.community-authors-row{margin-bottom:0.6rem}

/* === BOTÓ DESTACAT "AFEGIR UBICACIÓ NOVA" + TOOLBAR FILTRES === */
.loc-actions-bar{display:flex;flex-wrap:wrap;gap:0.5rem;align-items:stretch;margin-bottom:1rem}
/* ===== VISTA DE TAULA D'UBICACIONS (files) ===== */
.mf-loctable{display:flex;flex-direction:column;border:1px solid var(--border);border-radius:0.7rem;overflow:hidden;background:var(--card)}
.mf-loctable-head{display:grid;grid-template-columns:minmax(0,1fr) 5rem 2rem 2.2rem 2.2rem 6rem 3.6rem;gap:0.3rem;padding:0.5rem 0.7rem;font-size:0.68rem;font-weight:800;text-transform:uppercase;letter-spacing:0.03em;color:var(--muted);background:rgba(255,255,255,0.03);border-bottom:1px solid var(--border);align-items:center}
.mf-loctable-filters{text-transform:none!important;padding:0.5rem 0.7rem!important}
.mf-loctable-filters .mlt-grp select,.mf-loctable-filters .mlt-sky select{max-width:100%;box-sizing:border-box}
.mf-loctable-filters .mlt-fbtn{padding:0.15rem 0!important}
.mlt-fbtn{width:100%;background:transparent;border:1px solid var(--border);border-radius:0.4rem;font-size:1rem;cursor:pointer;padding:0.2rem 0;filter:grayscale(0.6) opacity(0.55);transition:all 0.12s}
.mlt-fbtn:hover{filter:grayscale(0) opacity(1);background:rgba(255,255,255,0.05)}
.mlt-fbtn.on{filter:none;border-color:rgba(251,191,36,0.7);background:rgba(251,191,36,0.16)}
.mf-loctable-row{display:grid;grid-template-columns:minmax(0,1fr) 5rem 2rem 2.2rem 2.2rem 6rem 3.6rem;gap:0.3rem;padding:0.6rem 0.7rem;font-size:0.85rem;align-items:center;cursor:pointer;border-bottom:1px solid rgba(255,255,255,0.05);transition:background 0.12s}
.mf-loctable-row:last-child{border-bottom:none}
.mf-loctable-row:hover{background:rgba(56,189,248,0.07)}
.mf-loctable .mlt-name{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mf-loctable .mlt-temp{font-weight:700;color:#38bdf8;text-align:center;font-size:0.82rem}
.mf-loctable .mlt-pref,.mf-loctable .mlt-fav,.mf-loctable .mlt-sky{text-align:center}
.mf-loctable .mlt-grp{overflow:hidden}
.mlt-grp-tag{display:inline-block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:0.7rem;background:rgba(148,163,184,0.16);padding:0.1rem 0.4rem;border-radius:0.4rem;vertical-align:middle}
.mlt-bortle{font-size:0.66rem;font-weight:800;padding:0.08rem 0.35rem;border-radius:0.35rem}
.mlt-bortle.b3,.mlt-bortle.b2,.mlt-bortle.b1{background:rgba(34,197,94,0.2);color:#4ade80}
.mlt-bortle.b4{background:rgba(132,204,22,0.2);color:#a3e635}
.mlt-bortle.b5{background:rgba(234,179,8,0.2);color:#facc15}
.mlt-bortle.b6,.mlt-bortle.b7,.mlt-bortle.b8,.mlt-bortle.b9{background:rgba(249,115,22,0.2);color:#fb923c}
@media(max-width:480px){
  .mf-loctable-head,.mf-loctable-row{grid-template-columns:minmax(0,1fr) 3.8rem 1.8rem 1.9rem 1.9rem 4.2rem 2.8rem;gap:0.2rem;padding:0.55rem 0.5rem;font-size:0.8rem}
}
/* ===== POPUP DE DETALL D'UBICACIÓ ===== */
.mf-locdetail-ov{position:fixed;inset:0;z-index:10050;background:rgba(5,8,18,0.75);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;padding:1rem}
.mf-locdetail-card{width:100%;max-width:420px;background:var(--card-bg,#111827);border:1px solid var(--border);border-radius:1rem;box-shadow:0 20px 60px rgba(0,0,0,0.55);max-height:85vh;overflow-y:auto}
.mf-locdetail-head{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.1rem 0.7rem;border-bottom:1px solid var(--border)}
.mf-locdetail-head strong{font-size:1.05rem}
.mf-locdetail-x{background:none;border:none;color:var(--muted);font-size:1.4rem;cursor:pointer;line-height:1}
.mf-ld-headsim{background:rgba(167,139,250,0.15);border:1.5px solid rgba(167,139,250,0.5);color:#a78bfa;font-size:1.1rem;cursor:pointer;line-height:1;border-radius:0.5rem;padding:0.3rem 0.55rem;transition:all 0.12s}
.mf-ld-headsim:hover{background:rgba(167,139,250,0.28)}
.mf-locdetail-body{padding:1rem 1.1rem}
.mf-locdetail-wx{text-align:center;padding:0.5rem 0 0.9rem}
.mf-locdetail-meta{display:flex;flex-direction:column;gap:0.3rem;font-size:0.8rem;color:var(--muted);margin-bottom:0.9rem;padding-bottom:0.9rem;border-bottom:1px solid var(--border)}
.mf-locdetail-actions{display:flex;gap:0.5rem;flex-wrap:wrap;margin-bottom:0.6rem}
.mf-ld-btn{flex:1;min-width:calc(50% - 0.25rem);padding:0.6rem 0.7rem;border-radius:0.6rem;border:1.5px solid var(--border);background:var(--card);color:var(--text);font-weight:700;font-size:0.85rem;cursor:pointer;transition:all 0.12s}
.mf-ld-btn:hover{background:rgba(255,255,255,0.06)}
.mf-ld-btn.on{border-color:rgba(251,191,36,0.7);background:rgba(251,191,36,0.14);color:#fbbf24}
.mf-ld-btn.primary{border-color:rgba(56,189,248,0.6);background:rgba(56,189,248,0.1);color:#38bdf8}
.mf-ld-btn.danger{flex:1;min-width:100%;border-color:rgba(248,113,113,0.6);background:rgba(248,113,113,0.1);color:#f87171}
.mf-ed-lbl{display:block;font-size:0.72rem;color:var(--muted);text-transform:uppercase;letter-spacing:0.03em;font-weight:700;margin:0.6rem 0 0.25rem}
.mf-ed-input{width:100%;padding:0.55rem 0.7rem;border-radius:0.5rem;border:1.5px solid var(--border);background:var(--card);color:var(--text);font-size:0.9rem;margin-bottom:0.2rem}
.mf-ed-input:focus{border-color:var(--accent);outline:none}
.mf-ed-toggles{display:flex;gap:0.5rem;margin:0.5rem 0 0.2rem}
.mf-ed-tog{flex:1;padding:0.5rem;border-radius:0.5rem;border:1.5px solid var(--border);background:var(--card);color:var(--muted);font-weight:700;font-size:0.85rem;cursor:pointer;transition:all 0.12s}
.mf-ed-tog.on{border-color:rgba(251,191,36,0.7);background:rgba(251,191,36,0.14);color:#fbbf24}

.loc-actions-bar>*{min-height:42px}
.btn-add-loc-prominent{display:flex;align-items:center;justify-content:center;gap:0.5rem;flex:0 0 auto;padding:0 1rem;background:linear-gradient(135deg,var(--primary) 0%,var(--accent) 100%);color:white;border:none;border-radius:0.65rem;font-size:0.9rem;font-weight:700;cursor:pointer;box-shadow:0 3px 10px rgba(22,138,173,0.25);transition:transform 0.15s,box-shadow 0.15s,filter 0.15s;letter-spacing:0.2px}
.btn-add-loc-prominent:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(22,138,173,0.4);filter:brightness(1.05)}
.btn-add-loc-prominent:active{transform:translateY(0);transition:transform 0.05s}
.btn-add-loc-icon{font-size:1.05rem;line-height:1;display:inline-flex;background:rgba(255,255,255,0.2);width:24px;height:24px;align-items:center;justify-content:center;border-radius:50%}
.btn-add-loc-text{font-size:0.88rem;white-space:nowrap}

.loc-filter-name{flex:1;min-width:140px;padding:0.4rem 0.7rem;border:1.5px solid var(--border);border-radius:0.6rem;background:var(--input-bg);color:var(--text);font-size:0.86rem;outline:none;transition:border-color 0.15s}
.loc-filter-name:focus{border-color:var(--accent)}
.loc-filter-cat{padding:0.4rem 0.7rem;border:1.5px solid var(--border);border-radius:0.6rem;background:var(--input-bg);color:var(--text);font-size:0.86rem;cursor:pointer;outline:none;min-width:130px;max-width:180px}
.loc-filter-cat:focus{border-color:var(--accent)}

.loc-filter-vis{display:inline-flex;gap:0.15rem;background:var(--card);padding:0.2rem;border-radius:0.6rem;border:1.5px solid var(--border)}
.loc-vis-chip{padding:0.3rem 0.6rem;border:none;background:transparent;color:var(--muted);border-radius:0.45rem;cursor:pointer;font-size:0.82rem;font-weight:600;transition:all 0.15s;white-space:nowrap}
.loc-vis-chip:hover{background:var(--card-2);color:var(--text)}
.loc-vis-chip.active{background:linear-gradient(135deg,var(--primary),var(--accent));color:white;box-shadow:0 2px 6px rgba(22,138,173,0.3)}
.loc-vis-chip .chip-count{display:inline-block;padding:0.02rem 0.4rem;background:rgba(0,0,0,0.12);border-radius:0.5rem;font-size:0.72rem;font-weight:700;margin-left:0.25rem;min-width:1.2rem;text-align:center}
[data-theme="dark"] .loc-vis-chip .chip-count{background:rgba(255,255,255,0.12)}
.loc-vis-chip.active .chip-count{background:rgba(255,255,255,0.28);color:white}

@media(max-width:520px){
  .btn-add-loc-text{display:none}
  .btn-add-loc-prominent{padding:0 0.65rem}
  .loc-filter-cat{min-width:100px;font-size:0.78rem}
  .loc-filter-name{min-width:90px;font-size:0.82rem}
  .loc-vis-chip{padding:0.3rem 0.45rem;font-size:0.78rem}
}

/* === VISTA COMUNITAT === */
.loc-row-community{border-left:3px solid #10b981;background:linear-gradient(90deg,rgba(16,185,129,0.04),transparent 40%)}
.loc-shared-badge{display:inline-block;font-size:0.7rem;background:rgba(16,185,129,0.15);color:#10b981;padding:0.1rem 0.4rem;border-radius:0.5rem;margin-left:0.4rem;font-weight:700;letter-spacing:0.3px;border:1px solid rgba(16,185,129,0.3)}
.loc-pp-badge{display:inline-flex;align-items:center;flex-shrink:0;width:1.15rem;height:1.15rem;border-radius:0.3rem;background:#FFD43A;justify-content:center;margin-left:0.35rem;box-shadow:0 1px 2px rgba(0,0,0,0.15);position:relative;cursor:help}
.loc-pp-badge svg{width:0.85rem;height:0.85rem;display:block}
.loc-planned-date{display:inline-block;font-size:0.72rem;color:var(--accent);background:rgba(22,138,173,0.1);padding:0.05rem 0.35rem;border-radius:0.4rem;margin-left:0.3rem;font-weight:600;font-variant-numeric:tabular-nums}
.loc-plans-badge{display:inline-block;font-size:0.72rem;color:#fff;background:var(--accent);padding:0.05rem 0.45rem;border-radius:0.4rem;margin-left:0.3rem;font-weight:700;cursor:help}
.loc-plans-badge.loc-plans-click{cursor:pointer;transition:transform 0.12s,box-shadow 0.12s;border:none;font-family:inherit;line-height:1.3}
.loc-plans-badge.loc-plans-click:hover{transform:scale(1.08);box-shadow:0 2px 8px rgba(139,92,246,0.5)}
.mf-locplans-item{display:flex;align-items:center;gap:0.5rem;width:100%;text-align:left;background:rgba(255,255,255,0.06);border:1px solid var(--border,rgba(255,255,255,0.14));border-radius:0.55rem;color:inherit;font-size:0.86rem;padding:0.5rem 0.65rem;cursor:pointer;margin-top:0.4rem}
.mf-locplans-item:hover{background:rgba(139,92,246,0.22)}
.mf-locplans-item .d{color:var(--muted,#93A0B5);font-size:0.76rem;white-space:nowrap;margin-left:auto}
.loc-plans-badge:hover{filter:brightness(1.15)}
.loc-import-btn{background:linear-gradient(135deg,#10b981,#059669);color:white;border:none;width:32px;height:32px;border-radius:50%;cursor:pointer;font-size:0.95rem;display:inline-flex;align-items:center;justify-content:center;transition:all 0.15s;box-shadow:0 2px 6px rgba(16,185,129,0.3)}
.loc-import-btn:hover:not(:disabled){transform:scale(1.1);box-shadow:0 3px 10px rgba(16,185,129,0.5)}
.loc-import-btn:disabled{opacity:0.7;cursor:wait}

/* Dropdown d'autors a la vista de comunitat */
.community-author-bar{display:flex;align-items:center;gap:0.6rem;padding:0.7rem 0.85rem;background:linear-gradient(135deg,rgba(16,185,129,0.08),rgba(5,150,105,0.04));border:1px solid rgba(16,185,129,0.25);border-radius:0.7rem;margin-bottom:0.8rem}
.community-author-label{font-size:0.85rem;font-weight:700;color:#10b981;flex-shrink:0}
.community-author-select{flex:1;padding:0.45rem 0.7rem;border:1.5px solid rgba(16,185,129,0.35);border-radius:0.55rem;background:var(--input-bg);color:var(--text);font-size:0.88rem;font-weight:500;cursor:pointer;outline:none;min-width:0}
.community-author-select:focus{border-color:#10b981;box-shadow:0 0 0 3px rgba(16,185,129,0.15)}
@media(max-width:520px){
  .community-author-bar{flex-direction:column;align-items:stretch;gap:0.4rem}
  .community-author-label{font-size:0.78rem}
  .community-author-select{width:100%}
}
.location-card{background:var(--card);border-radius:1.25rem;padding:1.2rem 1.5rem;box-shadow:var(--shadow)}
.location-card-header{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem}
.location-card h2{font-size:1.3rem;color:var(--primary);margin-bottom:0.3rem}
.location-meta{font-size:0.85rem;color:var(--muted)}
.weather-now{display:flex;align-items:center;gap:0.7rem;font-size:1.8rem;margin:0.8rem 0 1rem;flex-wrap:wrap}
/* Toolbar i toggle ubicacions */
.locs-toolbar{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:0.5rem;margin-bottom:0.6rem;padding:0.4rem 0.7rem;background:var(--card-2);border-radius:0.5rem}

/* === FILA COMPACTA D'UBICACIÓ — UNA LÍNIA, SENSE GAP ENTRE FILES === */
.loc-row-card{background:var(--card);border:1px solid var(--border);border-bottom:none;margin-bottom:0;transition:background 0.15s;position:relative;overflow:hidden}
.loc-row-card:first-child{border-top-left-radius:0.55rem;border-top-right-radius:0.55rem}
.loc-row-card:last-child{border-bottom:1px solid var(--border);border-bottom-left-radius:0.55rem;border-bottom-right-radius:0.55rem}
/* Quan hi ha un menú flotant obert, traiem overflow per veure'l (afegit via JS) */
.loc-row-card.menu-open{overflow:visible;z-index:200}
/* Quan dos cards són germans i el de dalt està obert, el separador queda més marcat */
.loc-row-card[data-expanded="1"]{background:var(--card-2)}
.loc-row-card:hover{background:var(--card-2)}
.loc-row-card[data-expanded="1"]+.loc-row-card,.loc-row-card+.loc-row-card[data-expanded="1"]{border-top:1px solid rgba(22,138,173,0.25)}

.loc-row{display:flex;align-items:center;gap:0.5rem;padding:0.4rem 0.55rem;min-height:42px}
.loc-toggle{flex:0 0 auto;background:transparent;border:none;cursor:pointer;font-size:0.95rem;padding:0.25rem 0.4rem;color:var(--muted);border-radius:0.3rem;display:flex;align-items:center;justify-content:center;transition:color 0.15s,background 0.15s}
.loc-toggle:hover{color:var(--accent);background:rgba(22,138,173,0.1)}
.loc-toggle-arrow{transition:transform 0.18s;display:inline-block}
.loc-row-card[data-expanded="1"] .loc-toggle-arrow{transform:rotate(90deg);color:var(--accent)}

.loc-row-name{flex:1;min-width:0;display:flex;align-items:center;gap:0.5rem;cursor:pointer;overflow:hidden}
.loc-name-text{font-weight:600;font-size:0.95rem;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.loc-row-cats{display:inline-flex;gap:0.25rem;flex-shrink:0}
.loc-row-cats .cat-pill{padding:0.05rem 0.35rem;font-size:0.7rem}

.loc-row-now{flex:0 0 auto;display:flex;align-items:center;gap:0.4rem;font-size:0.92rem;color:var(--text);font-weight:500;white-space:nowrap;padding:0 0.3rem}
/* === Targetes grans de favorites/preferent (estil menú) === */
.locs-fav-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:0.7rem;margin:0.2rem 0 1.1rem}
.loc-group-bar{display:flex;flex-wrap:wrap;gap:0.45rem;align-items:center;margin:0.3rem 0 0.9rem}
.loc-group-btn{font-size:0.85rem}
.loc-group-n{display:inline-block;background:var(--card-2,rgba(128,128,128,0.18));border-radius:999px;padding:0 0.45rem;font-size:0.75rem;margin-left:0.25rem;color:var(--muted)}
.loc-group-btn.active .loc-group-n{background:rgba(255,255,255,0.25);color:inherit}
/* Overlay de càrrega del mapa de focs */
.fires-loading-overlay{position:absolute;inset:0;z-index:1200;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0.5rem;background:rgba(10,14,25,0.45);backdrop-filter:blur(2px);border-radius:inherit;pointer-events:none}
.fires-loading-overlay .flo-fire{font-size:3.2rem;line-height:1;animation:mfFireFlicker 0.9s ease-in-out infinite;filter:drop-shadow(0 0 14px rgba(255,120,0,0.8))}
.fires-loading-overlay .flo-txt{color:#fff;font-weight:700;font-size:0.9rem;text-shadow:0 1px 4px rgba(0,0,0,0.6)}
@keyframes mfFireFlicker{0%,100%{transform:scale(1) rotate(-3deg);opacity:1}25%{transform:scale(1.15) rotate(2deg);opacity:0.85}50%{transform:scale(0.95) rotate(-2deg);opacity:1}75%{transform:scale(1.1) rotate(3deg);opacity:0.9}}
.fav-order-btn{background:var(--card-2,rgba(128,128,128,0.12));border:1px solid var(--border);border-radius:0.4rem;color:var(--muted);cursor:pointer;font-size:1rem;font-weight:700;line-height:1;padding:0.15rem 0.4rem;transition:background 0.15s,color 0.15s,opacity 0.15s}
.fav-order-btn:hover{background:var(--suggestions-hover);color:var(--primary)}
.loc-fav-big{position:relative}
.loc-fav-big>.fav-order-btn{position:absolute;top:5px;z-index:3;opacity:0.5;padding:0.05rem 0.32rem;font-size:1.05rem}
.loc-fav-big>.fav-order-btn[data-fav-order-dir="-1"]{left:5px}
.loc-fav-big>.fav-order-btn[data-fav-order-dir="1"]{right:5px}
.loc-fav-big:hover>.fav-order-btn,.loc-fav-big>.fav-order-btn:hover{opacity:1}
.fav-drag-handle{position:absolute;top:0;left:50%;transform:translateX(-50%);z-index:3;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;color:var(--muted);opacity:0.65;font-size:1.05rem;padding:0.3rem 1.1rem;line-height:1.2}
.fav-drag-handle:hover{opacity:1;color:var(--accent)}
.fav-drag-handle:active{cursor:grabbing}
.loc-fav-big:hover .fav-drag-handle,.fav-drag-handle:hover{opacity:1;color:var(--primary)}
.fav-drag-handle:active{cursor:grabbing}
.loc-fav-big.is-dragging{opacity:0.65;outline:2px dashed var(--accent);transform:scale(0.98)}
/* Heatmap sensació tèrmica a les ubicacions */
.mf-feels-toggle{display:inline-flex;align-items:center;gap:0.3rem}
.mf-feels-lbl{font-size:0.78rem;color:var(--muted)}
.mf-feels-btn{font-size:0.78rem;padding:0.12rem 0.6rem;border:1px solid var(--border);background:var(--card,#fff);color:var(--text,#222);border-radius:999px;cursor:pointer;line-height:1.5}
.mf-feels-btn.active{background:var(--primary);color:#fff;border-color:var(--primary)}
.mf-temp-pill{display:inline-block;font-weight:700;font-size:0.8rem;padding:0.04rem 0.45rem;border-radius:999px;background:var(--loc-temp,#999);color:var(--loc-temp-text,#fff);vertical-align:middle;white-space:nowrap}
.loc-row-card.mf-temp-colored::before{content:'';position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--loc-temp,transparent);z-index:2;pointer-events:none}
.loc-fav-big{background:var(--card);border:1px solid var(--border);border-radius:0.85rem;padding:0.8rem 0.65rem;display:flex;flex-direction:column;align-items:center;gap:0.4rem;text-align:center;transition:transform .18s,box-shadow .18s,border-color .18s;min-height:150px;justify-content:space-between}
.loc-fav-big:hover{transform:translateY(-3px);box-shadow:0 8px 18px rgba(0,0,0,.12);border-color:var(--accent)}
.loc-fav-big.is-pref{border-color:#f59e0b;box-shadow:0 0 0 1px rgba(245,158,11,.35) inset}
.loc-fav-name{font-weight:700;font-size:0.92rem;line-height:1.2;color:var(--text);display:flex;align-items:center;gap:0.3rem;justify-content:center;flex-wrap:wrap}
.loc-fav-weather{display:flex;flex-direction:column;align-items:center;gap:0.05rem;min-height:48px;justify-content:center;color:var(--muted)}
.loc-fav-weather .ffw-main{display:flex;align-items:center;gap:0.35rem}
.loc-fav-weather .ffw-icon{font-size:1.9rem;line-height:1}
.loc-fav-weather .ffw-temp{font-size:1.5rem;font-weight:700;color:var(--text)}
.loc-fav-weather .ffw-sub{display:flex;gap:0.6rem;font-size:0.78rem;color:var(--muted);flex-wrap:wrap;justify-content:center;margin-top:0.1rem}
.loc-fav-actions{display:flex;gap:0.2rem;align-items:center;justify-content:center;flex-wrap:wrap}
.loc-fav-actions .fav-wrap{position:relative}
.loc-fav-iconbtn{background:rgba(22,138,173,0.12);color:var(--accent);border:1px solid rgba(22,138,173,0.3);width:32px;height:32px;border-radius:50%;cursor:pointer;font-size:0.95rem;display:inline-flex;align-items:center;justify-content:center;transition:all 0.15s;padding:0}
.loc-fav-iconbtn:hover{background:var(--accent);color:white;transform:scale(1.1)}
.locs-rest-title{font-size:0.78rem;color:var(--muted);text-transform:uppercase;letter-spacing:0.04em;margin:0.5rem 0 0.5rem;font-weight:700}
.loc-fav-big{cursor:pointer}
.loc-fav-toggle-hint{color:var(--muted);font-size:1rem;line-height:1;opacity:0.5;transition:transform 0.2s;user-select:none}
.loc-fav-big:hover .loc-fav-toggle-hint{opacity:0.9;color:var(--accent)}
.loc-fav-big[data-expanded="1"] .loc-fav-toggle-hint{transform:rotate(180deg)}
.loc-fav-big .loc-detail{width:100%;text-align:left;padding:0;border-top:none;margin-top:0.4rem}
.loc-fav-big[data-expanded="1"] .loc-detail{border-top:1px solid var(--border);padding-top:0.5rem}
.loc-fav-big[data-expanded="1"]{grid-column:1/-1}
.loc-fav-big[data-expanded="1"] .loc-detail{max-width:480px;margin-left:auto;margin-right:auto}
.loc-fav-big[data-expanded="1"]:hover{transform:none;box-shadow:0 4px 12px rgba(0,0,0,.08)}
.loc-fav-big .loc-fav-actions{display:none}
.loc-fav-big[data-expanded="1"] .loc-fav-actions{display:flex}
.loc-fav-big .loc-row-cats{display:none}
.loc-fav-big[data-expanded="1"] .loc-row-cats{display:block;text-align:center}
.loc-fav-chart{background:#0c1f33;border:1px solid var(--border);border-radius:0.7rem;padding:0.5rem 0.55rem;margin:0 0 0.55rem}
.loc-fav-chart .cat-chart-block{background:transparent;margin-top:0;gap:0.6rem}
.loc-fav-chart .cat-chart-row-label{font-size:0.72rem}
.loc-fav-chart .cat-chart-svg .cat-chart-val{font-size:6px;fill:rgba(255,255,255,0.9)}
.loc-fav-chart .cat-chart-svg .cat-chart-hour{font-size:5.5px}
.loc-fav-chart .cat-chart-svg .cat-chart-bar-val{font-size:5.5px}
.loc-trend-details{margin-top:0.2rem}
.loc-trend-details>summary.loc-trend-summary{cursor:pointer;list-style:none}
.loc-trend-details>summary.loc-trend-summary::-webkit-details-marker{display:none}
.loc-trend-details>summary.loc-trend-summary::before{content:'▸';font-size:0.7em;transition:transform 0.2s;display:inline-block}
.loc-trend-details[open]>summary.loc-trend-summary::before{transform:rotate(90deg)}
.loc-fav-big[data-expanded="1"] .forecast-container .day{cursor:pointer;transition:box-shadow .12s,background .12s;border-radius:0.4rem}
.loc-fav-big[data-expanded="1"] .forecast-container .day:hover{box-shadow:0 0 0 1px var(--accent) inset}
.loc-fav-big[data-expanded="1"] .forecast-container .day.is-selected{box-shadow:0 0 0 2px var(--accent) inset;background:rgba(22,138,173,0.10)}
.loc-row-icon{font-size:1.05rem}
.loc-row-temp{font-weight:700;color:var(--primary);font-variant-numeric:tabular-nums}
.loc-row-wind{font-size:0.78rem;color:var(--muted);font-variant-numeric:tabular-nums}

.loc-row-actions{flex:0 0 auto;display:flex;gap:0.15rem;align-items:center}
.loc-row-actions button{background:transparent;border:none;cursor:pointer;font-size:0.92rem;padding:0.25rem 0.4rem;border-radius:0.3rem;color:var(--muted);transition:all 0.15s;line-height:1}
.loc-row-actions button:hover{color:var(--accent);background:rgba(22,138,173,0.1)}
.loc-row-actions .remove-btn:hover{color:var(--danger);background:rgba(220,38,38,0.1)}
.loc-row-actions .share-btn.is-public{color:#10b981}
.loc-row-actions .fav-btn{color:#94a3b8;font-size:1.05rem;line-height:1}
.loc-row-actions .fav-btn:hover{color:#fbbf24;background:rgba(251,191,36,0.12)}
.loc-row-actions .fav-btn.is-fav{color:#fbbf24;text-shadow:0 0 8px rgba(251,191,36,0.4)}
.loc-row-actions .fav-btn.is-fav:hover{color:#f59e0b}
/* Menú flotant per triar categoria de favorit */
.fav-wrap{position:relative;display:inline-block}
.fav-menu{position:absolute;top:calc(100% + 0.3rem);right:0;background:var(--card);border:1px solid var(--border);border-radius:0.55rem;box-shadow:0 8px 24px rgba(0,0,0,0.22);padding:0.35rem;z-index:300;min-width:280px;max-width:320px;display:grid;grid-template-columns:1fr 1fr;gap:0.15rem;animation:favMenuFade 0.12s ease}
.fav-menu[hidden]{display:none}
@media(max-width:480px){.fav-menu{min-width:240px;max-width:90vw;max-height:55vh;overflow-y:auto;overscroll-behavior:contain}}
@keyframes favMenuFade{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
.fav-menu-item{display:flex;align-items:center;gap:0.4rem;padding:0.4rem 0.55rem;border:none;background:transparent;color:var(--text);font-size:0.82rem;text-align:left;cursor:pointer;border-radius:0.4rem;white-space:nowrap;font-weight:500;transition:background 0.1s,color 0.1s}
.fav-menu-clear{border-top:1px solid var(--border,rgba(255,255,255,0.15));margin-top:0.2rem;padding-top:0.5rem;color:#F05561}
.fav-menu-clear:hover{background:rgba(240,85,97,0.15)}
.fav-menu-item:hover{background:var(--card-2)}
.fav-menu-item.active{color:#fbbf24;background:rgba(251,191,36,0.1)}
.preferred-btn{background:transparent;border:1.5px solid transparent;color:var(--muted);width:30px;height:30px;border-radius:0.45rem;cursor:pointer;font-size:1rem;display:inline-flex;align-items:center;justify-content:center;transition:all 0.15s;padding:0;filter:grayscale(0.4);opacity:0.65}
.preferred-btn:hover{background:rgba(16,185,129,0.1);color:#10b981;transform:scale(1.1);filter:grayscale(0);opacity:1}
.preferred-btn.is-preferred{color:#10b981;background:linear-gradient(135deg,#10b981 0%,#059669 100%);border-color:#047857;box-shadow:0 0 0 2px rgba(16,185,129,0.3),0 2px 6px rgba(16,185,129,0.35);transform:scale(1.05);filter:grayscale(0);opacity:1;font-size:1.05rem}
.preferred-btn.is-preferred:hover{background:linear-gradient(135deg,#059669 0%,#047857 100%);transform:scale(1.12)}
.preferred-btn.is-preferred::after{content:'';position:absolute}
.loc-row-actions{position:relative}
.loc-preferred-badge{display:inline-flex;align-items:center;gap:0.2rem;padding:0.12rem 0.5rem;background:linear-gradient(135deg,#10b981,#059669);color:white;border-radius:0.35rem;font-size:0.7rem;font-weight:800;letter-spacing:0.3px;text-transform:uppercase;margin-left:0.3rem;box-shadow:0 1px 3px rgba(16,185,129,0.4);vertical-align:middle}

.loc-detail{display:none;padding:0 0.8rem 0.7rem;border-top:1px solid var(--border)}
.loc-row-card[data-expanded="1"] .loc-detail{display:block}
.loc-detail-meta{font-size:0.78rem;color:var(--muted);padding:0.4rem 0;border-bottom:1px dashed var(--border);margin-bottom:0.5rem}
.loc-detail .weather-now{font-size:1.4rem;margin:0.4rem 0 0.7rem}

/* Mòbil: amaga categories del row, només es veuen quan desplegat */
@media(max-width:600px){
  .loc-row-cats{display:none}
  .loc-row-wind{display:none}
  .loc-name-text{font-size:0.88rem}
  .loc-row-now{font-size:0.85rem}
}
.temp{font-weight:700;color:var(--text)}
.weather-icon{font-size:2.5rem}
.weather-desc{font-size:1rem;color:var(--text-2)}

/* Forecast grid */
.forecast-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:0.4rem}
@media(max-width:700px){.forecast-grid{grid-template-columns:repeat(4,1fr)}}
@media(max-width:420px){.forecast-grid{grid-template-columns:repeat(3,1fr)}}
.day{background:var(--card-2);border-radius:0.7rem;padding:0.5rem 0.3rem;text-align:center;display:flex;flex-direction:column;gap:0.15rem;transition:background 0.2s}
.day:hover{background:var(--card-3)}
.day.uncertain{background:var(--uncertain-bg);border:1px dashed var(--uncertain-border)}
.day .dow{font-weight:600;font-size:0.78rem;color:var(--primary)}
.day .date{font-size:0.7rem;color:var(--muted)}
.day .icon{font-size:1.4rem;line-height:1}
.day .temps{display:flex;justify-content:center;gap:0.3rem;font-size:0.8rem}
.day .precip{font-size:0.7rem;color:var(--accent);margin-top:0.1rem}
.max{color:#d32f2f;font-weight:600}
[data-theme="dark"] .max{color:#ff8a8a}
.min{color:#1976d2}
[data-theme="dark"] .min{color:#5fb3d6}
.week-divider{margin:0.5rem 0 0.3rem;padding:0.3rem 0;font-size:0.75rem;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:0.05em;display:flex;align-items:center;gap:0.5rem}
.week-divider::before,.week-divider::after{content:'';flex:1;height:1px;background:var(--border)}
.uncertainty-note{font-size:0.78rem;color:var(--uncertain-text);background:var(--uncertain-bg);border-left:3px solid var(--uncertain-border);padding:0.5rem 0.8rem;border-radius:0.4rem;margin-top:0.6rem}
.remove-btn{background:none;border:none;color:var(--danger);font-size:1.2rem;cursor:pointer;opacity:0.6;transition:opacity 0.2s;padding:0.3rem}
.remove-btn:hover{opacity:1}

/* Auth */
.auth-form{display:flex;flex-direction:column;gap:1rem;max-width:420px;margin:0 auto;width:100%}
/* Botó "Inicia sessió" al header (quan no autenticat) */
.auth-status-login{background:linear-gradient(135deg,#168aad,#76c7d0)!important;color:white!important;font-weight:600!important;text-decoration:none!important;padding:0.4rem 0.9rem!important;border-radius:1.4rem!important;border:none!important;cursor:pointer;font-size:0.85rem!important;transition:transform 0.15s,box-shadow 0.15s;box-shadow:0 2px 6px rgba(22,138,173,0.35)}
.auth-status-login:hover{transform:scale(1.05);box-shadow:0 4px 12px rgba(22,138,173,0.5)!important;color:white!important}
/* Modal d'auth — capçalera amb branding */
.auth-modal-box{max-width:480px}
.auth-modal-header{text-align:center;margin-bottom:1.2rem;padding-bottom:1rem;border-bottom:1px solid var(--border)}
.auth-modal-title{margin:0;display:flex;flex-direction:column;align-items:center;gap:0.5rem}
.auth-modal-icon{width:160px;height:auto;filter:drop-shadow(0 3px 10px rgba(40,55,90,0.25))}
.auth-modal-name-text{font-size:3rem!important}
.auth-modal-header .auth-credit{font-size:0.7rem;color:var(--muted-2);margin:0.5rem 0 0;line-height:1.5;font-weight:400;opacity:0.85}
.auth-modal-header .auth-credit a{color:var(--accent);text-decoration:none}
.auth-modal-header .auth-credit a:hover{text-decoration:underline}
.auth-modal-box .auth-form{max-width:none;margin:0}
.auth-modal-box .auth-form h2{font-size:1.05rem;text-align:center;margin-bottom:0.3rem}
/* Formulari de login unificat dins de la finestra de benvinguda (#modalWelcome),
   que té fons fosc fix → forcem colors llegibles independentment del tema clar/fosc */
#modalWelcome .auth-form{max-width:420px;margin:0 auto}
#modalWelcome .auth-form h2{font-size:1.2rem;text-align:center;margin:0.2rem 0 0.7rem;color:#e2e8f0}
#modalWelcome .auth-form .field label{color:#cbd5e1}
#modalWelcome .auth-form .field input{background:rgba(15,23,42,0.55);border-color:rgba(148,163,184,0.35);color:#e2e8f0}
#modalWelcome .auth-form .field input::placeholder{color:#64748b}
#modalWelcome .auth-form .toggle-mode.mf-signup-cta{color:#f1f5f9}
#modalWelcome .auth-form .toggle-mode:not(.mf-signup-cta){color:#94a3b8}
#modalWelcome .auth-credit{color:#94a3b8;font-size:0.78rem;text-align:center}
#modalWelcome .auth-credit a{color:#38bdf8}
/* Selector d'idioma — botó únic que cicla CA→ES→EN */
.lang-cycle{display:inline-flex;align-items:center;justify-content:center;min-width:32px;height:28px;padding:0 0.45rem;font-size:0.72rem;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;background:linear-gradient(135deg,#168aad,#76c7d0);color:white;border:none;border-radius:0.45rem;cursor:pointer;transition:all 0.15s;box-shadow:0 1px 3px rgba(22,138,173,0.4);user-select:none}
.lang-cycle:hover{transform:scale(1.08);box-shadow:0 2px 6px rgba(22,138,173,0.5)}
.lang-cycle:active{transform:scale(0.95)}
/* Compat: amagar l'antic selector de 3 botons si queda al DOM */
.lang-selector{display:none!important}

/* Modal "El meu compte" */
.account-section{margin-bottom:1.2rem;padding-bottom:0.9rem;border-bottom:1px solid var(--border)}
.lang-pick-btn.active{background:linear-gradient(135deg,#6366f1,#8b5cf6)!important;color:white!important;border-color:transparent!important;box-shadow:0 2px 8px rgba(99,102,241,0.3)}

/* === MODAL COMPTE — DISSENY PREMIUM === */
.acc-header{display:flex;align-items:center;gap:1rem;padding:0.5rem 0 1rem;border-bottom:1px solid var(--border);margin-bottom:0.9rem}
.acc-header-avatar{flex-shrink:0;position:relative;width:78px;height:78px;border-radius:50%;overflow:hidden;background:linear-gradient(135deg,#06b6d4 0%,#8b5cf6 100%);display:flex;align-items:center;justify-content:center;color:white;font-size:1.8rem;font-weight:700;cursor:pointer;border:3px solid var(--card);box-shadow:0 4px 14px rgba(99,102,241,0.25);transition:transform 0.2s}
.acc-header-avatar:hover{transform:scale(1.04)}
.acc-header-avatar .acc-avatar-overlay{position:absolute;bottom:0;left:0;right:0;background:rgba(0,0,0,0.6);color:white;font-size:0.56rem;text-align:center;padding:0.15rem 0;letter-spacing:0.5px;font-weight:700;opacity:0;transition:opacity 0.2s}
.acc-header-avatar:hover .acc-avatar-overlay{opacity:1}
.acc-header-info{flex:1;min-width:0}
.acc-header-name{font-size:1.05rem;font-weight:700;color:var(--text);margin:0;line-height:1.2}
.acc-header-email{font-size:0.78rem;color:var(--muted);margin:0.15rem 0 0;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.acc-header-badge{display:inline-block;background:linear-gradient(135deg,rgba(99,102,241,0.12),rgba(139,92,246,0.08));border:1px solid rgba(99,102,241,0.25);color:var(--accent);font-size:0.68rem;font-weight:700;padding:0.15rem 0.5rem;border-radius:0.35rem;margin-top:0.35rem;letter-spacing:0.3px}

/* Tabs interiors */
.acc-tabs{display:flex;gap:0.15rem;border-bottom:1px solid var(--border);margin-bottom:1.1rem;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.acc-tabs::-webkit-scrollbar{display:none}
.acc-tab-btn{flex-shrink:0;padding:0.55rem 0.85rem;border:none;background:transparent;color:var(--muted);font-size:0.83rem;font-weight:600;cursor:pointer;border-bottom:2px solid transparent;transition:all 0.15s;white-space:nowrap;-webkit-tap-highlight-color:transparent;border-radius:0.4rem 0.4rem 0 0;margin-bottom:-1px}
.acc-tab-btn:hover{color:var(--text);background:rgba(99,102,241,0.05)}
.acc-tab-btn.active{color:var(--accent);border-bottom-color:var(--accent);background:linear-gradient(180deg,rgba(99,102,241,0.08),transparent)}
.acc-tab-panel{display:none;animation:accFadeIn 0.18s ease}
.acc-tab-panel.active{display:block}
@keyframes accFadeIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}

/* Sub-section dins de tabs */
.acc-card{background:var(--card-2);border:1px solid var(--border);border-radius:0.6rem;padding:0.9rem 1rem;margin-bottom:0.8rem}
.acc-card-title{font-size:0.92rem;font-weight:700;margin:0 0 0.5rem;display:flex;align-items:center;gap:0.4rem;color:var(--text)}
.acc-card-hint{font-size:0.78rem;color:var(--muted);margin:0 0 0.6rem;line-height:1.45}

/* Estadístiques rendrida en línia */
.acc-stat-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:0.5rem;margin-top:0.4rem}
.acc-stat-row-compact{grid-template-columns:repeat(6,1fr);gap:0.35rem}
.acc-stat-pill{background:linear-gradient(135deg,rgba(99,102,241,0.06),rgba(139,92,246,0.03));border:1px solid rgba(99,102,241,0.15);border-radius:0.45rem;padding:0.5rem 0.4rem;text-align:center;min-width:0}
.acc-stat-row-compact .acc-stat-pill{padding:0.4rem 0.3rem}
.acc-stat-pill-value{font-size:1.15rem;font-weight:700;color:var(--text);line-height:1.1;font-variant-numeric:tabular-nums}
.acc-stat-row-compact .acc-stat-pill-value{font-size:0.95rem}
.acc-stat-pill-label{font-size:0.66rem;color:var(--muted);text-transform:uppercase;letter-spacing:0.04em;font-weight:600;margin-top:0.15rem}
.acc-stat-row-compact .acc-stat-pill-label{font-size:0.58rem;letter-spacing:0.02em;line-height:1.15}

/* Alçada uniforme per a totes les tabs */
.acc-panels-wrap{min-height:460px;position:relative}
@media (max-width:520px){
  .acc-panels-wrap{min-height:520px}
  .acc-stat-row-compact{grid-template-columns:repeat(3,1fr)}
  .acc-stat-row-compact .acc-stat-pill-value{font-size:1.05rem}
  .acc-stat-row-compact .acc-stat-pill-label{font-size:0.6rem}
}

/* Layout del modal compte: footer "Tancar" sempre visible (no scroll global, scroll intern al contingut) */
#modalAccount .modal-box{display:flex;flex-direction:column;max-height:90vh;overflow:hidden;padding:1.1rem 1.2rem 0.9rem}
#modalAccount h2{flex-shrink:0;margin:0 0 0.6rem}
#modalAccount .acc-header{flex-shrink:0}
#modalAccount #accountAvatarMsg{flex-shrink:0}
#modalAccount .acc-tabs{flex-shrink:0}
#modalAccount .acc-panels-wrap{flex:1 1 auto;overflow-y:auto;-webkit-overflow-scrolling:touch;min-height:0;padding-right:0.2rem}
#modalAccount .modal-actions{flex-shrink:0;background:var(--card);padding-top:0.7rem;margin-top:0.6rem;border-top:1px solid var(--border);position:sticky;bottom:0}

/* Botó d'idioma més polit */
.lang-pick-btn{padding:0.45rem 0.85rem;font-size:0.85rem;font-weight:600;border-radius:0.4rem;transition:all 0.15s}
.account-section:last-of-type{border-bottom:none}
.account-section h3{font-size:1rem;margin-bottom:0.6rem;color:var(--accent)}
.account-stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(115px,1fr));gap:0.5rem}
.account-stat{padding:0.6rem;background:var(--card-2);border-radius:0.5rem;text-align:center}
.account-stat-num{font-size:1.4rem;font-weight:700;color:var(--primary);line-height:1}
.account-stat-lbl{font-size:0.72rem;color:var(--muted);margin-top:0.25rem;text-transform:uppercase;letter-spacing:0.5px}
.account-stat.is-public .account-stat-num{color:#168aad}
.account-stat.is-private .account-stat-num{color:#10b981}
/* Botó del header amb sessió iniciada → més clarament clicable */
.auth-status .auth-user-btn{display:flex;align-items:center;gap:0.4rem;cursor:pointer;background:transparent;border:none;padding:0;color:inherit;font-size:inherit}
.auth-status .auth-user-btn:hover .email{text-decoration:underline}
.header-logout-btn{margin-left:0.5rem;background:rgba(220,38,38,0.12);color:var(--danger);border:1px solid rgba(220,38,38,0.25);border-radius:50%;width:30px;height:30px;cursor:pointer;font-size:0.95rem;display:inline-flex;align-items:center;justify-content:center;transition:all 0.15s}
.header-logout-btn:hover{background:var(--danger);color:white;transform:scale(1.05)}
.auth-form h2{text-align:center}
/* 16-10 (Jaume: «el registre i iniciar sessió més senzill»): el pas del codi pel correu (js/app.js, setAuthMode 'code'/'code2') */
.auth-code-intro{margin:-.35rem 0 0;text-align:center;font-size:.98rem;line-height:1.45;color:var(--muted)}
.auth-form .field input#authCode{text-align:center;font-size:1.7rem;font-weight:700;letter-spacing:.45em;padding:.7rem .5rem .7rem 1rem;font-variant-numeric:tabular-nums}
.auth-code-terms{margin:-.4rem 0 0;text-align:center;font-size:.8rem;line-height:1.4;color:var(--muted)}
.auth-code-terms .footer-link{font-size:inherit}
.auth-code-links{text-align:center}
.auth-code-links .btn-link:disabled{opacity:.55;cursor:default;text-decoration:none}
.auth-form .field{display:flex;flex-direction:column;gap:0.3rem}
.auth-form .field label{font-size:0.85rem;color:var(--muted);font-weight:600}
.auth-form .field input{padding:0.8rem 1rem;border:2px solid var(--border);border-radius:0.7rem;font-size:1rem;outline:none;background:var(--input-bg);color:var(--text)}
.auth-form .field input:focus{border-color:var(--accent)}
.password-wrapper{position:relative;display:flex;align-items:center}
.password-wrapper input.with-toggle{padding-right:3rem !important;flex:1;width:100%}
.password-toggle{position:absolute;right:0.6rem;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;font-size:1.2rem;color:var(--muted);padding:0.3rem;line-height:1;border-radius:0.35rem;transition:all 0.15s;-webkit-tap-highlight-color:transparent}
.password-toggle:hover{color:var(--text);background:rgba(0,0,0,0.05)}
[data-theme="dark"] .password-toggle:hover{background:rgba(255,255,255,0.08)}
.password-toggle:active{transform:translateY(-50%) scale(0.92)}
.auth-form .toggle-mode{text-align:center;font-size:0.9rem;color:var(--muted);margin-top:0.3rem}
.auth-message{padding:0.7rem 1rem;border-radius:0.7rem;font-size:0.9rem;line-height:1.4}
.auth-message.error{background:var(--error-bg);color:var(--danger);border-left:3px solid var(--danger)}
.auth-message.success{background:var(--success-bg);color:var(--success);border-left:3px solid var(--success)}
.auth-message.info{background:var(--info-bg);color:var(--primary);border-left:3px solid var(--primary)}
.config-warning{background:var(--uncertain-bg);border:2px solid var(--uncertain-border);color:var(--uncertain-text);padding:1rem 1.2rem;border-radius:0.7rem;margin-bottom:1rem;font-size:0.9rem;line-height:1.5}
.config-warning code{background:rgba(0,0,0,0.1);padding:0.1rem 0.4rem;border-radius:0.3rem;font-family:'Courier New',monospace;font-size:0.85rem}
[data-theme="dark"] .config-warning code{background:rgba(255,255,255,0.1)}
.info-box{background:var(--info-bg);border-radius:0.7rem;padding:0.8rem 1rem;font-size:0.9rem;color:var(--text)}

/* Map */
.map-controls{display:flex;flex-wrap:wrap;gap:0.4rem;align-items:center;margin-bottom:0.8rem}
.map-controls .label{font-size:0.85rem;color:var(--muted);margin-right:0.3rem}
.map-wrapper{position:relative;width:100%;padding-top:60%;border-radius:1rem;overflow:hidden;box-shadow:0 4px 12px rgba(0,0,0,0.1);background:var(--card-2)}

/* ===== Visor Radar Nowcast (RainViewer + Leaflet) ===== */
.radar-nowcast-wrap{position:relative;width:100%;border-radius:1rem;overflow:hidden;box-shadow:0 6px 18px rgba(0,0,0,0.15);background:var(--card-2)}
.rv-user-marker{font-size:24px;line-height:1;text-align:center;filter:drop-shadow(0 1px 3px rgba(0,0,0,0.7))}
.rv-map{width:100%;height:460px;background:#0f172a}
@media(max-width:640px){.rv-map{height:380px}}
.rv-controls{display:flex;align-items:center;gap:0.8rem;padding:0.7rem 0.9rem;background:linear-gradient(180deg,rgba(15,23,42,0.92) 0%,rgba(15,23,42,0.98) 100%);border-top:1px solid rgba(255,255,255,0.08)}
.rv-play-btn{flex-shrink:0;width:44px;height:44px;border:none;border-radius:50%;background:linear-gradient(135deg,#06b6d4 0%,#0284c7 100%);color:white;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(6,182,212,0.4);transition:transform 0.15s,box-shadow 0.15s}
.rv-play-btn:hover{transform:scale(1.08);box-shadow:0 4px 14px rgba(6,182,212,0.5)}
.rv-play-btn:active{transform:scale(0.95)}
.rv-play-btn.is-playing{background:linear-gradient(135deg,#f59e0b 0%,#d97706 100%);box-shadow:0 2px 8px rgba(245,158,11,0.4)}
.rv-slider{flex:1;-webkit-appearance:none;appearance:none;height:6px;background:linear-gradient(90deg,#1e293b 0%,#475569 70%,#fbbf24 70%,#fbbf24 100%);border-radius:3px;outline:none;cursor:pointer}
.rv-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;background:white;border:3px solid #06b6d4;border-radius:50%;cursor:pointer;box-shadow:0 2px 6px rgba(0,0,0,0.4);transition:transform 0.1s}
.rv-slider::-webkit-slider-thumb:hover{transform:scale(1.2)}
.rv-slider::-moz-range-thumb{width:20px;height:20px;background:white;border:3px solid #06b6d4;border-radius:50%;cursor:pointer;box-shadow:0 2px 6px rgba(0,0,0,0.4)}
.rv-time-label{flex-shrink:0;min-width:120px;font-family:'SF Mono',Menlo,monospace;font-size:0.92rem;font-weight:700;color:#fbbf24;text-align:right;text-shadow:0 1px 2px rgba(0,0,0,0.5);letter-spacing:-0.01em}
@media(max-width:540px){
  .rv-controls{gap:0.5rem;padding:0.6rem 0.7rem;flex-wrap:nowrap}
  .rv-time-label{min-width:80px;font-size:0.78rem}
  .rv-play-btn{width:38px;height:38px;font-size:16px}
}
.rv-legend{display:flex;flex-wrap:wrap;gap:0.7rem;padding:0.5rem 0.9rem;background:rgba(15,23,42,0.85);border-top:1px solid rgba(255,255,255,0.06);font-size:0.78rem;color:#cbd5e1;justify-content:center}
.rv-legend-item{display:inline-flex;align-items:center;gap:0.3rem}
.rv-dot{display:inline-block;width:10px;height:10px;border-radius:50%;box-shadow:0 0 0 1px rgba(255,255,255,0.2)}
/* Indicador de nowcast (futur) al slider */
.rv-slider.has-nowcast{background:linear-gradient(90deg,#1e293b 0%,#475569 var(--nowcast-pos,70%),#fbbf24 var(--nowcast-pos,70%),#f59e0b 100%)}
.map-wrapper iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0}
.btn-toggle{background:var(--card-2);border:1.5px solid var(--border);color:var(--text);padding:0.45rem 0.85rem;border-radius:0.5rem;cursor:pointer;font-size:0.85rem;font-weight:600;transition:all 0.15s}
.btn-toggle:hover:not(.active):not(:disabled){background:rgba(22,138,173,0.1);border-color:rgba(22,138,173,0.4)}
.btn-toggle.active{background:linear-gradient(135deg,var(--primary) 0%,var(--accent) 100%);color:white;border-color:transparent;box-shadow:0 2px 6px rgba(22,138,173,0.25)}

/* Aurora */
.aurora-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media(max-width:600px){.aurora-grid{grid-template-columns:1fr}}
.kp-now{text-align:center;padding:1.5rem;border-radius:1rem;background:rgba(255,255,255,0.1)}
.kp-value{font-size:4rem;font-weight:700;line-height:1;text-shadow:0 2px 8px rgba(0,0,0,0.3)}
.kp-label{font-size:1rem;opacity:0.9;margin-top:0.3rem}
.kp-status{font-size:0.95rem;margin-top:0.5rem;padding:0.4rem 1rem;border-radius:2rem;display:inline-block;background:rgba(0,0,0,0.2)}
.metrics-grid{display:grid;grid-template-columns:1fr 1fr;gap:0.8rem}
.metric{background:rgba(255,255,255,0.12);border-radius:0.7rem;padding:0.8rem;text-align:center}
.metric-value{font-size:1.4rem;font-weight:700}
.metric-label{font-size:0.78rem;opacity:0.85;margin-top:0.2rem}
.kp-forecast{display:flex;flex-direction:column;gap:0.4rem;margin-top:0.5rem}
.kp-bar-row{display:flex;align-items:center;gap:0.6rem;font-size:0.85rem}
.kp-bar-label{width:110px;flex-shrink:0}
.kp-bar-track{flex:1;height:22px;background:rgba(255,255,255,0.15);border-radius:0.4rem;overflow:hidden}
.kp-bar-fill{height:100%;transition:width 0.4s;display:flex;align-items:center;justify-content:flex-end;padding-right:0.5rem;font-weight:700;font-size:0.8rem;color:white;min-width:30px}
.kp-quiet{background:linear-gradient(90deg,#2a9d8f,#52b788)}
.kp-unsettled{background:linear-gradient(90deg,#ffd166,#f4a261)}
.kp-active{background:linear-gradient(90deg,#f4a261,#e76f51)}
.kp-storm{background:linear-gradient(90deg,#e76f51,#d62828)}
.kp-severe{background:linear-gradient(90deg,#9b2226,#6a040f)}
.kp-semaphore{display:grid;grid-template-columns:repeat(10,1fr);gap:0.4rem;margin:0.7rem 0}
.kp-led{aspect-ratio:1;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1rem;font-weight:700;background:rgba(255,255,255,0.08);color:rgba(255,255,255,0.55);border:2px solid rgba(255,255,255,0.15);transition:all 0.25s;min-height:34px;position:relative}
.kp-led.active{color:white;box-shadow:0 0 14px currentColor;border-color:rgba(255,255,255,0.3)}
.kp-led.current{border:3px solid #fff;transform:scale(1.18);font-weight:900;font-size:1.1rem;z-index:2}
.kp-led.current::after{content:'▼';position:absolute;top:-1.4rem;left:50%;transform:translateX(-50%);font-size:0.85rem;color:#fff;text-shadow:0 0 4px rgba(0,0,0,0.5)}
.kp-led-q{background:#52b788}
.kp-led-u{background:#ffd166;color:#1a1a1a !important}
.kp-led-s{background:#e76f51}
.kp-led-x{background:#9b2226}
.kp-meta{font-size:0.8rem;opacity:0.8;margin-top:0.4rem;text-align:center}

/* Mini-semàfor per ubicació aurora */
.aurora-loc-card{background:rgba(255,255,255,0.08);border-radius:0.6rem;padding:0.8rem 0.9rem;margin-bottom:0.5rem;border:1px solid rgba(255,255,255,0.1)}
.aurora-fc-pill{margin:0.4rem 0 0.2rem;padding:0.4rem 0.7rem;font-size:0.82rem;background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.12);border-radius:0.45rem;line-height:1.45}
.aurora-fc-pill.on{background:linear-gradient(135deg,rgba(82,216,150,0.18),rgba(82,216,150,0.06));border-color:rgba(82,216,150,0.45);color:#caffd6}
.aurora-add-btn{display:inline-flex;align-items:center;gap:0.3rem;padding:0.4rem 0.7rem;border-radius:0.45rem;background:linear-gradient(135deg,rgba(99,102,241,0.18),rgba(99,102,241,0.08));border:1px solid rgba(99,102,241,0.45);color:#c7d2fe;font-size:0.78rem;font-weight:500;cursor:pointer;transition:background 0.15s,transform 0.08s}
.aurora-add-btn:hover{background:rgba(99,102,241,0.28)}
.aurora-add-btn:active{transform:scale(0.97)}
.aurora-add-btn:disabled{opacity:0.6;cursor:wait}
.aurora-cloud-pill{display:inline-block;padding:0.18rem 0.55rem;border-radius:0.5rem;font-size:0.78rem;font-weight:600;letter-spacing:0.2px}
.aurora-maps-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:0.7rem;margin-top:0.5rem}
.aurora-map-block{background:rgba(0,0,0,0.25);border-radius:0.6rem;padding:0.6rem;border:1px solid rgba(255,255,255,0.1)}
.aurora-map-title{font-weight:700;font-size:0.92rem;margin-bottom:0.4rem;color:white}
.aurora-map-img{width:100%;height:auto;border-radius:0.4rem;background:#000;display:block;min-height:140px;object-fit:contain}
.aurora-map-legend{font-size:0.74rem;opacity:0.78;margin-top:0.4rem;line-height:1.35;color:rgba(255,255,255,0.85)}
.aurora-loc-head{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:0.5rem;margin-bottom:0.3rem}
.aurora-loc-title{font-weight:600;font-size:0.95rem}
.aurora-loc-prob{text-align:right;flex-shrink:0}
.aurora-loc-prob-val{font-size:1.4rem;font-weight:700;line-height:1}
.aurora-loc-prob-lbl{font-size:0.72rem;opacity:0.85;margin-top:0.1rem}
.aurora-loc-coord{font-size:0.76rem;opacity:0.75;margin-bottom:0.5rem}
.aurora-mini-sema{display:grid;grid-template-columns:repeat(10,1fr);gap:0.25rem;margin:0.7rem 0 0.4rem;max-width:340px;position:relative}
.aurora-mini-led{aspect-ratio:1;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:0.72rem;font-weight:700;background:rgba(255,255,255,0.07);color:rgba(255,255,255,0.55);border:1.5px solid rgba(255,255,255,0.12);min-height:22px;position:relative;transition:all 0.2s}
.aurora-mini-led.active{color:white;border-color:rgba(255,255,255,0.3)}
.aurora-mini-led.active.q{background:#52b788}
.aurora-mini-led.active.u{background:#ffd166;color:#1a1a1a}
.aurora-mini-led.active.s{background:#e76f51}
.aurora-mini-led.active.x{background:#9b2226}
.aurora-mini-led.threshold{outline:2px dashed #ffd166;outline-offset:1px;z-index:1}
.aurora-mini-led.now{border:2.5px solid #fff;transform:scale(1.18);z-index:2;font-weight:900}
.aurora-mini-led.now::after{content:'▼';position:absolute;top:-1.1rem;left:50%;transform:translateX(-50%);font-size:0.7rem;color:#fff}
.aurora-mini-legend{display:flex;flex-wrap:wrap;gap:0.6rem;font-size:0.72rem;opacity:0.85;margin:0.2rem 0 0.4rem}
.aurora-mini-legend span{display:inline-flex;align-items:center;gap:0.25rem}
.aurora-mini-legend .leg-now{color:#fff}
.aurora-mini-legend .leg-th{color:#ffd166}
.aurora-loc-verdict{font-size:0.86rem;padding:0.45rem 0.7rem;border-radius:0.4rem;margin-top:0.4rem;font-weight:600}
.aurora-loc-verdict.v-ok{background:rgba(82,183,136,0.2);color:#7fdab0;border-left:3px solid #52b788}
.aurora-loc-verdict.v-mid{background:rgba(255,209,102,0.18);color:#ffd166;border-left:3px solid #ffd166}
.aurora-loc-verdict.v-no{background:rgba(214,40,40,0.15);color:#ff9a9a;border-left:3px solid #d62828}
.aurora-loc-badge{background:rgba(255,209,102,0.25);color:#ffd166;padding:0.1rem 0.5rem;border-radius:1rem;font-size:0.7rem;margin-left:0.4rem;display:inline-block}

/* Hiperfocal */
.hf-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem;margin:1rem 0}
.hf-block{background:var(--card-2);border-radius:0.8rem;padding:1rem 1.1rem}
.hf-block label{display:block;font-size:0.85rem;color:var(--muted);font-weight:600;margin-bottom:0.4rem}
.hf-block select,.hf-block input[type="number"]{width:100%;padding:0.6rem 0.9rem;border:2px solid var(--border);border-radius:0.5rem;background:var(--input-bg);color:var(--text);font-size:1rem;font-family:inherit}
.hf-slider{width:100%;margin:0.4rem 0}
.hf-slider-row{display:flex;align-items:center;gap:0.8rem}
.hf-slider-val{font-weight:700;color:var(--primary);font-size:1.1rem;min-width:55px;text-align:right}
.hf-result{background:linear-gradient(135deg,rgba(22,138,173,0.12),rgba(20,80,110,0.12));border:1px solid var(--accent);border-radius:0.9rem;padding:1.2rem;margin-top:1rem}
.hf-big-num{font-size:2.5rem;font-weight:800;color:var(--primary);line-height:1}
.hf-big-lbl{font-size:0.85rem;color:var(--muted);text-transform:uppercase;letter-spacing:0.05em;margin-top:0.2rem}
.hf-secondary{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:0.6rem;margin-top:1rem}
.hf-sec-item{background:var(--card);border-radius:0.6rem;padding:0.7rem 0.9rem}
.hf-sec-num{font-size:1.3rem;font-weight:700;color:var(--text)}
.hf-sec-lbl{font-size:0.78rem;color:var(--muted);margin-top:0.1rem}
.hf-bar{position:relative;height:46px;background:linear-gradient(90deg,#1a1a2e 0%,#1a1a2e 100%);border-radius:0.5rem;margin:1rem 0 0.7rem;overflow:hidden;border:1px solid var(--border)}
[data-theme="light"] .hf-bar{background:linear-gradient(90deg,#e7eef5 0%,#e7eef5 100%)}
.hf-bar-zone{position:absolute;top:0;bottom:0;background:linear-gradient(180deg,rgba(82,183,136,0.4),rgba(82,183,136,0.7));border-left:2px solid #52b788;border-right:2px solid #52b788}
.hf-bar-marker{position:absolute;top:0;bottom:0;width:2px;background:#fff;box-shadow:0 0 6px rgba(255,255,255,0.6)}
.hf-bar-label{position:absolute;font-size:0.7rem;color:var(--text);background:var(--card);padding:0.05rem 0.3rem;border-radius:0.25rem;border:1px solid var(--border);white-space:nowrap}
.hf-scale{display:flex;justify-content:space-between;font-size:0.72rem;color:var(--muted);margin-top:-0.4rem}
.hf-presets{display:flex;flex-wrap:wrap;gap:0.4rem;margin-top:0.5rem}
.hf-preset-btn{padding:0.4rem 0.8rem;font-size:0.82rem;border:1.5px solid var(--border);background:var(--card);color:var(--text);border-radius:1.5rem;cursor:pointer;transition:all 0.2s}
.hf-preset-btn:hover{border-color:var(--accent);color:var(--accent)}
.hf-tip{font-size:0.85rem;color:var(--text-2);background:var(--info-bg);padding:0.6rem 0.9rem;border-radius:0.5rem;border-left:3px solid var(--info);margin-top:1rem;line-height:1.4}

/* Calendari lunar */
.cal-controls{display:flex;align-items:center;gap:0.5rem;margin-bottom:1rem}
.cal-controls h3{flex:1;text-align:center;margin:0;font-size:1.1rem}
.cal-nav-btn{background:var(--card-2);border:2px solid var(--border);color:var(--text);width:38px;height:38px;border-radius:50%;cursor:pointer;font-size:1.1rem;font-weight:700;transition:all 0.2s;display:flex;align-items:center;justify-content:center}
.cal-nav-btn:hover{background:var(--primary);color:white;border-color:var(--primary)}
.cal-today-btn{background:var(--card-2);border:2px solid var(--accent);color:var(--accent);padding:0.4rem 0.8rem;border-radius:1.2rem;cursor:pointer;font-size:0.85rem;font-weight:600;transition:all 0.2s}
.cal-today-btn:hover{background:var(--accent);color:white}
.cal-weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:0.3rem;font-size:0.75rem;color:var(--muted);text-align:center;margin-bottom:0.4rem;font-weight:600;text-transform:uppercase;letter-spacing:0.05em}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);grid-auto-rows:1fr;gap:0.3rem}
.cal-day{background:var(--card-2);border-radius:0.6rem;padding:0.4rem 0.25rem;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:0.15rem;border:2px solid transparent;transition:all 0.2s;position:relative;min-height:108px}
@media(max-width:600px){.cal-day{min-height:88px;padding:0.3rem 0.15rem}}
.cal-day.empty{visibility:hidden}
.cal-day.today{border-color:var(--accent);background:var(--card-3);box-shadow:0 0 0 2px rgba(22,138,173,0.2)}
.cal-day .moon-svg-wrap{display:flex;align-items:center;justify-content:center;width:100%;margin:0.1rem 0}
.cal-day .moon-svg-wrap svg{width:42px;height:42px}
@media(max-width:600px){.cal-day .moon-svg-wrap svg{width:32px;height:32px}}
.cal-day .day-num{font-weight:600;color:var(--text);font-size:0.85rem;line-height:1}
.cal-day.today .day-num{color:var(--accent);font-weight:800}
.cal-day .day-marker{position:absolute;top:0.15rem;right:0.25rem;font-size:0.72rem;font-weight:700;line-height:1}
.cal-day.new-moon .day-marker{color:#888}
.cal-day.full-moon .day-marker{color:#ffd166}
.cal-day.first-q .day-marker,.cal-day.last-q .day-marker{color:var(--accent)}
.cal-day .day-times{font-size:0.62rem;color:var(--muted);text-align:center;line-height:1.15;font-family:'Segoe UI',sans-serif}
@media(max-width:600px){.cal-day .day-times{font-size:0.58rem}}
.cal-day .day-mw{font-size:0.62rem;color:var(--accent);font-weight:600;line-height:1.1;text-align:center}
@media(max-width:600px){.cal-day .day-mw{font-size:0.55rem}}

/* Bloc compacte d'info Centre Galàctic dins cada cel·la (estil PhotoPills) */
.cal-day .day-gc{margin-top:0.15rem;padding:0.18rem 0.25rem;border-radius:0.3rem;background:rgba(22,138,173,0.12);line-height:1.15;font-weight:600}
.cal-day .day-gc-header{font-size:0.62rem;color:var(--accent);text-align:center}
.cal-day .day-gc-stats{font-size:0.58rem;color:var(--text-2);text-align:center;margin-top:0.05rem;font-weight:500}
.cal-day .day-gc-kpi{position:relative;height:5px;background:rgba(0,0,0,0.15);border-radius:3px;margin-top:0.2rem;overflow:hidden}
.cal-day .day-gc-kpi-bar{position:absolute;left:0;top:0;bottom:0;border-radius:3px;transition:width 0.3s}
.cal-day .day-gc-kpi-bar.gc-good{background:linear-gradient(90deg,#10b981,#34d399)}
.cal-day .day-gc-kpi-bar.gc-mid{background:linear-gradient(90deg,#f59e0b,#fbbf24)}
.cal-day .day-gc-kpi-bar.gc-low{background:linear-gradient(90deg,#dc2626,#f87171)}
.cal-day .day-gc-kpi-label{display:none}
/* Oportunitat lluna plena diürna */
.cal-day .day-fmd{margin-top:0.15rem;padding:0.2rem 0.3rem;border-radius:0.3rem;background:linear-gradient(135deg,rgba(250,204,21,0.45),rgba(251,146,60,0.40));color:#92400e;border:1px solid rgba(245,158,11,0.7);font-size:0.62rem;font-weight:700;text-align:center;line-height:1.2;animation:fmdPulse 1.4s ease-in-out infinite}
[data-theme="dark"] .cal-day .day-fmd{color:#fde68a;background:linear-gradient(135deg,rgba(250,204,21,0.32),rgba(251,146,60,0.25));border-color:rgba(250,204,21,0.7)}
@media(max-width:600px){
  .cal-day .day-fmd{font-size:0.55rem;padding:0.15rem 0.2rem}
}
@media(max-width:600px){
  .cal-day .day-gc-header{font-size:0.55rem}
  .cal-day .day-gc-stats{font-size:0.5rem}
  .cal-day .day-gc{padding:0.12rem 0.2rem}
}

/* Plans al calendari */
.cal-day{cursor:pointer}
.cal-day.has-plan{box-shadow:inset 0 0 0 2px rgba(16,185,129,0.4)}
.cal-day.has-public-plan{box-shadow:inset 0 0 0 2px rgba(22,138,173,0.4)}
.cal-day.has-plan.has-public-plan{box-shadow:inset 0 0 0 2px rgba(16,185,129,0.5),inset 0 0 0 4px rgba(22,138,173,0.3)}
.cal-day .day-plans{position:absolute;top:2px;right:3px;display:flex;gap:2px;font-size:0.65rem;line-height:1}
.plan-dot{display:inline-block;width:9px;height:9px;border-radius:50%;vertical-align:middle}
.plan-dot.plan-mine{background:#10b981;box-shadow:0 0 4px rgba(16,185,129,0.6)}
.plan-dot.plan-public{background:#168aad;box-shadow:0 0 4px rgba(22,138,173,0.6)}
.cal-day{position:relative}

/* Llista de propers plans */
.upcoming-plan{display:flex;gap:0.7rem;padding:0.6rem 0.7rem;background:var(--card-2);border-radius:0.5rem;margin-bottom:0.4rem;border-left:3px solid var(--accent);transition:transform 0.15s,box-shadow 0.15s;cursor:pointer}
.upcoming-plan:hover{transform:translateX(2px);box-shadow:0 2px 8px rgba(0,0,0,0.1)}
.upcoming-plan.is-public{border-left-color:#168aad}
.upcoming-plan.is-mine{border-left-color:#10b981}
.upcoming-plan-date{flex-shrink:0;text-align:center;min-width:46px}
.upcoming-plan-date .day{font-size:1.4rem;font-weight:700;color:var(--primary);line-height:1}
.upcoming-plan-date .month{font-size:0.7rem;color:var(--muted);text-transform:uppercase;letter-spacing:0.5px}
.upcoming-plan-body{flex:1;min-width:0}
.upcoming-plan-title{font-weight:600;color:var(--text)}
.upcoming-plan-meta{font-size:0.78rem;color:var(--muted);margin-top:0.15rem}
.upcoming-plan-tag{display:inline-block;font-size:0.7rem;padding:0.1rem 0.4rem;border-radius:0.7rem;margin-left:0.3rem;font-weight:600}
.upcoming-plan-tag.tag-mine{background:rgba(16,185,129,0.15);color:#10b981}
.upcoming-plan-tag.tag-public{background:rgba(22,138,173,0.15);color:#168aad}

/* Avís de solapament de plans */
.plan-conflict-warn{background:linear-gradient(135deg,rgba(239,68,68,0.10),rgba(239,68,68,0.05));border-left:3px solid #ef4444;padding:0.6rem 0.9rem;border-radius:0.4rem;color:#ef4444;font-size:0.86rem;margin-bottom:0.5rem;line-height:1.5}
.plan-conflict-warn strong{color:#dc2626}
[data-theme="dark"] .plan-conflict-warn{background:linear-gradient(135deg,rgba(239,68,68,0.18),rgba(239,68,68,0.08));color:#fca5a5}
[data-theme="dark"] .plan-conflict-warn strong{color:#fecaca}
.plan-conflict-badge{display:inline-block;font-size:0.7rem;padding:0.1rem 0.45rem;border-radius:0.7rem;margin-left:0.3rem;font-weight:700;background:rgba(239,68,68,0.18);color:#dc2626;border:1px solid rgba(239,68,68,0.35)}
[data-theme="dark"] .plan-conflict-badge{background:rgba(239,68,68,0.28);color:#fecaca}
.plan-conflict-icon{display:inline-block;font-size:0.95em;animation:planConflictPulse 2.2s ease-in-out infinite;vertical-align:middle}
@keyframes planConflictPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:0.6;transform:scale(1.12)}}
.day-plan-row.has-conflict{border-left-color:#ef4444 !important;background:linear-gradient(90deg,rgba(239,68,68,0.08) 0%,var(--card-2) 30%)}
tr.has-conflict td.col-date{position:relative}
tr.has-conflict{background:linear-gradient(90deg,rgba(239,68,68,0.06) 0%,transparent 40%)}
[data-theme="dark"] tr.has-conflict{background:linear-gradient(90deg,rgba(239,68,68,0.14) 0%,transparent 40%)}

/* Llista plans dins modal del dia */
.day-plan-row{display:flex;gap:0.7rem;padding:0.6rem;background:var(--card-2);border-radius:0.5rem;margin-bottom:0.4rem;align-items:flex-start;border-left:3px solid var(--accent)}
.day-plan-row.is-public{border-left-color:#168aad}
.day-plan-row.is-mine{border-left-color:#10b981}
.day-plan-row-content{flex:1;min-width:0}
.day-plan-actions{display:flex;gap:0.3rem;flex-shrink:0}
.day-plan-actions button{padding:0.3rem 0.5rem;font-size:0.78rem;background:transparent;border:1px solid var(--border);border-radius:0.4rem;cursor:pointer;color:var(--muted)}
.day-plan-actions button:hover{border-color:var(--accent);color:var(--accent)}

/* Registre de plans */
.planslog-quickactions{display:flex;flex-wrap:wrap;gap:0.5rem;margin-bottom:0.8rem}
.planslog-quickactions .btn{padding:0.5rem 0.8rem;font-size:0.85rem}
.planslog-quickactions .btn.active{background:var(--primary);color:white;border-color:var(--primary)}
.planslog-filters{margin-bottom:0.8rem;background:var(--card-2);padding:0.6rem 0.8rem;border-radius:0.5rem}
.planslog-filters summary{cursor:pointer;font-weight:600;font-size:0.9rem;color:var(--text);padding:0.2rem 0;user-select:none}
.planslog-filters summary:hover{color:var(--accent)}
.planslog-filter-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:0.5rem 0.8rem;margin-top:0.7rem}
.planslog-filter-grid .field{margin:0}
.planslog-filter-grid label{font-size:0.78rem;color:var(--muted);margin-bottom:0.2rem;display:block}
.planslog-filter-grid select,.planslog-filter-grid input{width:100%;padding:0.4rem 0.5rem;font-size:0.85rem;border:1.5px solid var(--border);border-radius:0.4rem;background:var(--input-bg);color:var(--text)}
.planslog-table-wrap{overflow-x:auto;margin-top:0.6rem;max-height:600px;border-radius:0.5rem;border:1px solid var(--border)}
.planslog-table{width:100%;border-collapse:collapse;font-size:0.86rem;background:var(--card)}
.planslog-table th{text-align:left;padding:0.55rem 0.5rem;background:var(--card-2);color:var(--text);font-weight:600;font-size:0.82rem;border-bottom:2px solid var(--border);cursor:pointer;user-select:none;white-space:nowrap;position:sticky;top:0;z-index:1}
.planslog-table th:hover{background:rgba(22,138,173,0.12)}
.planslog-table th.sort-active{color:var(--accent)}
.planslog-table th .sort-arrow{font-size:0.7rem;opacity:0.5;margin-left:0.2rem}
.planslog-table th.sort-active .sort-arrow{opacity:1}
.planslog-table td{padding:0.5rem;border-bottom:1px solid var(--border);vertical-align:top}
.planslog-table tr{cursor:pointer;transition:background 0.1s}
.planslog-table tr:hover td{background:rgba(22,138,173,0.06)}
.planslog-table tr.row-mine td{border-left:3px solid #10b981}
.planslog-table tr.row-public td{border-left:3px solid #168aad}
.planslog-table .col-date{white-space:nowrap;font-weight:600}
.planslog-table .col-title{min-width:180px}
.planslog-table .col-title .desc{font-size:0.78rem;color:var(--muted);margin-top:0.15rem;font-style:italic}
.planslog-table .col-author{white-space:nowrap;font-size:0.82rem}
.planslog-table .col-loc{font-size:0.82rem}
.planslog-table .col-cat{font-size:0.78rem}
.planslog-table .cat-pill{display:inline-block;padding:0.05rem 0.35rem;background:rgba(22,138,173,0.13);color:var(--accent);border-radius:0.6rem;margin:1px;white-space:nowrap}
.planslog-table .badge-mine{display:inline-block;padding:0.05rem 0.4rem;background:rgba(16,185,129,0.15);color:#10b981;border-radius:0.6rem;font-size:0.7rem;font-weight:600}
.planslog-table .badge-public{display:inline-block;padding:0.05rem 0.4rem;background:rgba(22,138,173,0.15);color:#168aad;border-radius:0.6rem;font-size:0.7rem;font-weight:600}
@media(max-width:600px){
  .planslog-table{font-size:0.78rem}
  .planslog-table .col-author,.planslog-table .col-cat{display:none}
}

/* Registre de plans */
.planslog-quickactions{display:flex;flex-wrap:wrap;gap:0.5rem;margin-bottom:0.8rem}
.planslog-quickactions .btn{padding:0.5rem 0.85rem;font-size:0.85rem}
.planslog-quickactions .btn.active{background:var(--primary);color:white;border-color:var(--primary)}
.planslog-filters{margin-bottom:0.8rem;background:var(--card-2);padding:0.6rem 0.8rem;border-radius:0.5rem}
.planslog-filters summary{cursor:pointer;font-weight:600;font-size:0.9rem;color:var(--text);padding:0.2rem 0;user-select:none}
.planslog-filters summary:hover{color:var(--accent)}
.planslog-filter-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:0.5rem 0.8rem;margin-top:0.7rem}
.planslog-filter-grid .field{margin:0}
.planslog-filter-grid label{font-size:0.78rem;color:var(--muted);margin-bottom:0.2rem;display:block}
.planslog-filter-grid select,.planslog-filter-grid input{width:100%;padding:0.45rem 0.55rem;font-size:0.85rem;border:1.5px solid var(--border);border-radius:0.4rem;background:var(--input-bg);color:var(--text)}
.planslog-table-wrap{overflow-x:auto;margin-top:0.6rem;max-height:65vh;border-radius:0.5rem;border:1px solid var(--border)}
.planslog-table{width:100%;border-collapse:collapse;font-size:0.86rem;background:var(--card)}
.planslog-table thead{position:sticky;top:0;z-index:2;background:var(--card-2)}
.planslog-table th{text-align:left;padding:0.55rem 0.6rem;color:var(--text);font-weight:600;font-size:0.82rem;border-bottom:2px solid var(--border);cursor:pointer;user-select:none;white-space:nowrap}
.planslog-table th:hover{color:var(--accent)}
.planslog-table th.sort-active{color:var(--accent)}
.planslog-table th .sort-arrow{font-size:0.75rem;opacity:0.45;margin-left:0.2rem}
.planslog-table th.sort-active .sort-arrow{opacity:1}
.planslog-table tr{border-bottom:1px solid var(--border)}
.planslog-table tr:last-child{border-bottom:none}
.planslog-table tr.is-mine{background:rgba(16,185,129,0.05)}
.planslog-table tr.is-public-other{background:rgba(22,138,173,0.05)}
.planslog-table tr.is-past{opacity:0.6}
.planslog-table tr:hover{background:rgba(22,138,173,0.12);cursor:pointer}
.planslog-table td{padding:0.55rem 0.6rem;vertical-align:top}
.planslog-table td.col-date{white-space:nowrap;font-weight:600;color:var(--primary)}
.planslog-table td.col-time{white-space:nowrap;font-family:monospace;color:var(--text-2)}
.planslog-table td.col-title strong{display:block}
.planslog-table td.col-title small{color:var(--muted);font-size:0.78rem;display:block;margin-top:0.15rem}
.planslog-table td.col-author{white-space:nowrap}
.planslog-table .author-tag{display:inline-block;padding:0.1rem 0.45rem;border-radius:0.7rem;font-size:0.75rem;font-weight:600}
.planslog-table .author-tag.tag-mine{background:rgba(16,185,129,0.18);color:#10b981}
.planslog-table .author-tag.tag-public{background:rgba(22,138,173,0.18);color:#168aad}
.planslog-table td.col-loc{font-size:0.83rem}
.planslog-table td.col-loc .loc-coords{display:block;font-size:0.72rem;color:var(--muted);font-family:monospace}
.planslog-table td.col-cats{font-size:0.78rem;color:var(--muted-2)}
.planslog-table .cat-mini{display:inline-block;background:var(--card-2);border-radius:0.7rem;padding:0.1rem 0.4rem;margin-right:0.2rem;margin-bottom:0.15rem;font-size:0.72rem}
@media(max-width:680px){
  .planslog-table th,.planslog-table td{padding:0.4rem 0.4rem;font-size:0.78rem}
  .planslog-table .col-cats,.planslog-table th[data-sort-col="categories"]{display:none}
}
.cal-legend{margin-top:1rem;font-size:0.78rem;color:var(--muted);display:flex;flex-wrap:wrap;gap:0.8rem;justify-content:center}
.cal-legend span{display:inline-flex;align-items:center;gap:0.3rem}
.cal-event-row{display:flex;align-items:center;gap:0.6rem;padding:0.45rem 0.7rem;background:var(--card-2);border-radius:0.5rem;margin-bottom:0.4rem;font-size:0.88rem}
.cal-event-icon{font-size:1.4rem;flex-shrink:0}
.cal-event-text{flex:1}
.cal-event-name{font-weight:600;color:var(--text)}
.cal-event-date{font-size:0.78rem;color:var(--muted)}
.cal-event-countdown{font-size:0.78rem;color:var(--accent);font-weight:600;flex-shrink:0}

/* Estrelles com a punts (regles NPF i 500) */
.stars-result{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1rem;margin-top:1rem}
.stars-rule{background:linear-gradient(135deg,rgba(26,26,46,0.8),rgba(15,52,96,0.6));color:#fff;border-radius:0.9rem;padding:1.2rem;border:1px solid rgba(255,255,255,0.15)}
.stars-rule h4{color:#ffd166;margin-bottom:0.4rem;font-size:1rem}
.stars-rule .stars-time{font-size:2.4rem;font-weight:800;line-height:1;color:#fff;display:flex;align-items:baseline;gap:0.4rem}
.stars-rule .stars-time small{font-size:1rem;opacity:0.8}
.stars-rule .stars-desc{font-size:0.82rem;opacity:0.85;margin-top:0.5rem;line-height:1.4}
.stars-rule.npf{background:linear-gradient(135deg,rgba(40,40,80,0.85),rgba(70,40,120,0.65))}
.stars-rule.r500{background:linear-gradient(135deg,rgba(20,40,60,0.85),rgba(40,80,120,0.65))}
.stars-formula{font-family:'Courier New',monospace;font-size:0.78rem;background:rgba(0,0,0,0.3);padding:0.4rem 0.6rem;border-radius:0.4rem;margin-top:0.5rem;color:#ffd166}
.stars-warning{font-size:0.85rem;background:var(--uncertain-bg);color:var(--uncertain-text);border-left:3px solid var(--uncertain-border);padding:0.6rem 0.9rem;border-radius:0.4rem;margin-top:1rem}

/* Admin panel */
.admin-stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:0.8rem}
/* === Sub-pestanyes Admin === */
.admin-subtabs-nav{display:flex;gap:0.35rem;overflow-x:auto;padding:0.5rem 0.25rem;margin-bottom:0.7rem;border-bottom:2px solid var(--border);scrollbar-width:thin;-webkit-overflow-scrolling:touch;position:sticky;top:0;z-index:5;background:var(--bg);backdrop-filter:blur(8px)}
.admin-subtabs-nav::-webkit-scrollbar{height:4px}
.admin-subtabs-nav::-webkit-scrollbar-thumb{background:rgba(99,102,241,0.4);border-radius:2px}
/* Mobil: sticky+backdrop dins contenidors amb overflow fa poltergeist a iOS — barra estatica, scroll horitzontal net */
@media (max-width:768px){
/* ADMIN MOBIL v2 (02-09): cada taula es el seu propi carril d'scroll; res no pot
   eixamplar la pagina. Desktop intacte. */
.admin-subtabs-nav{position:static;backdrop-filter:none;background:transparent;flex-wrap:nowrap;max-width:100%}
#tab-admin{overflow-x:hidden;max-width:100vw}
#tab-admin .card,#tab-admin .admin-subtab-panel{max-width:100%;min-width:0}
#tab-admin .card{padding:0.8rem 0.6rem}
#tab-admin table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%;font-size:0.78rem}
#tab-admin table th,#tab-admin table td{padding:0.35rem 0.45rem;white-space:nowrap}
#tab-admin pre,#tab-admin code{white-space:pre-wrap;word-break:break-word;max-width:100%}
#tab-admin img,#tab-admin iframe,#tab-admin canvas{max-width:100%}
}
.admin-subtab-btn{flex-shrink:0;padding:0.5rem 0.9rem;border-radius:0.45rem 0.45rem 0 0;border:1px solid transparent;background:transparent;color:var(--muted);font-size:0.85rem;font-weight:600;cursor:pointer;white-space:nowrap;transition:all 0.15s;-webkit-tap-highlight-color:transparent}
.adm-analytics-period.active{background:linear-gradient(135deg,#6366f1,#8b5cf6);color:white;border-color:transparent;box-shadow:0 2px 8px rgba(99,102,241,0.3)}

/* === KPI cards premium === */
.adm-kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:0.7rem;margin-bottom:1.4rem}
.adm-kpi-card{background:linear-gradient(135deg,rgba(99,102,241,0.08),rgba(139,92,246,0.04));border:1px solid rgba(99,102,241,0.18);border-radius:0.7rem;padding:0.9rem 1rem;position:relative;overflow:hidden;transition:transform 0.18s,box-shadow 0.18s}
.adm-kpi-card:hover{transform:translateY(-2px);box-shadow:0 6px 18px rgba(99,102,241,0.15)}
.adm-kpi-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#6366f1,#8b5cf6,#06b6d4);opacity:0.7}
.adm-kpi-icon{font-size:1.1rem;opacity:0.85;margin-bottom:0.3rem;display:block}
.adm-kpi-label{font-size:0.72rem;color:var(--muted);text-transform:uppercase;letter-spacing:0.05em;font-weight:600;margin-bottom:0.2rem}
.adm-kpi-value{font-size:1.5rem;font-weight:700;color:var(--text);line-height:1.1;font-variant-numeric:tabular-nums}
.adm-kpi-sublabel{font-size:0.7rem;color:var(--muted);margin-top:0.15rem}

/* === Section title premium === */
.adm-section-title{display:flex;align-items:center;gap:0.5rem;font-size:0.92rem;font-weight:700;color:var(--text);margin:1.2rem 0 0.6rem;padding-bottom:0.35rem;border-bottom:1px solid rgba(99,102,241,0.15)}
.adm-section-title-icon{font-size:1.05rem;opacity:0.9}

/* === Daily chart premium === */
.adm-daily-wrap{background:linear-gradient(180deg,rgba(99,102,241,0.04),rgba(99,102,241,0.01));border:1px solid rgba(99,102,241,0.1);border-radius:0.7rem;padding:1.1rem 0.9rem 1.5rem;position:relative}
.adm-daily-chart{display:flex;align-items:flex-end;gap:4px;height:140px;padding:0.4rem 0;position:relative;justify-content:flex-start}
.adm-daily-chart.few-bars{justify-content:center;gap:1rem}
.adm-daily-bar{flex:1;max-width:60px;background:linear-gradient(180deg,#6366f1,#8b5cf6 60%,#a78bfa);border-radius:4px 4px 0 0;min-height:4px;position:relative;cursor:help;transition:all 0.2s;box-shadow:0 -2px 8px rgba(99,102,241,0.25)}
.adm-daily-bar:hover{filter:brightness(1.15) saturate(1.1);transform:scaleY(1.02)}
.adm-daily-bar-label{position:absolute;bottom:-22px;left:50%;transform:translateX(-50%);font-size:0.7rem;color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums;font-weight:600}
.adm-daily-bar-value{position:absolute;top:-18px;left:50%;transform:translateX(-50%);font-size:0.7rem;color:var(--text);font-weight:700;white-space:nowrap;opacity:0;transition:opacity 0.2s}
.adm-daily-bar:hover .adm-daily-bar-value{opacity:1}

/* === Bar lists premium === */
.adm-cards-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1rem;margin-top:1rem}
.adm-bars-card{background:rgba(99,102,241,0.025);border:1px solid rgba(99,102,241,0.1);border-radius:0.6rem;padding:0.85rem 1rem}
.adm-bar-row{display:flex;align-items:center;gap:0.55rem;padding:0.35rem 0;font-size:0.85rem;border-bottom:1px dashed rgba(99,102,241,0.08)}
.adm-bar-row:last-child{border-bottom:none}
.adm-bar-icon{flex-shrink:0;font-size:1rem;width:20px;text-align:center}
.adm-bar-label{flex-shrink:0;min-width:90px;font-weight:600;color:var(--text);font-size:0.82rem}
.adm-bar-track{flex:1;background:rgba(99,102,241,0.08);border-radius:0.4rem;height:8px;position:relative;overflow:hidden}
.adm-bar-fill{position:absolute;left:0;top:0;height:100%;background:linear-gradient(90deg,#6366f1,#8b5cf6);border-radius:0.4rem;transition:width 0.5s cubic-bezier(0.4,0,0.2,1)}
.adm-bar-value{flex-shrink:0;min-width:55px;text-align:right;font-size:0.78rem;color:var(--muted);font-variant-numeric:tabular-nums;font-weight:600}

.adm-empty-state{text-align:center;color:var(--muted);padding:1.5rem 0;font-size:0.85rem;font-style:italic}
.admin-subtab-btn:hover{background:rgba(99,102,241,0.1);color:var(--text)}
.admin-subtab-btn.active{background:var(--card);border-color:var(--border);border-bottom-color:var(--card);color:var(--accent);margin-bottom:-2px;position:relative}
.admin-subtab-btn.active::after{content:'';position:absolute;left:10%;right:10%;bottom:-2px;height:2px;background:var(--accent)}
.admin-subtab-panel{animation:adminSubtabFadeIn 0.2s ease-out}
.admin-subtab-panel[hidden]{display:none}
/* 25-09 (Jaume): pestanyes de l'admin SENSE scroll horitzontal — xips que salten de línia (mòbil: graella de columnes iguals) */
#adminSubtabsNav.admin-subtabs-nav{flex-wrap:wrap!important;overflow:visible!important;gap:0.35rem!important;border-bottom:1px solid var(--border)!important;padding:0.4rem 0 0.6rem!important}
#adminSubtabsNav .admin-subtab-btn{flex-shrink:1;border-radius:2rem!important;border:1px solid var(--border)!important;padding:0.38rem 0.75rem!important;font-size:0.8rem!important;margin:0!important}
#adminSubtabsNav .admin-subtab-btn.active{background:rgba(99,102,241,0.18)!important;border-color:var(--accent)!important;color:var(--text)!important;margin-bottom:0!important}
#adminSubtabsNav .admin-subtab-btn.active::after{display:none!important}
@media (max-width:768px){
  #adminSubtabsNav.admin-subtabs-nav{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(6.6rem,1fr))}
  #adminSubtabsNav .admin-subtab-btn{padding:0.42rem 0.3rem!important;font-size:0.76rem!important;text-align:center;overflow:hidden;text-overflow:ellipsis}
}
@keyframes adminSubtabFadeIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
/* Activitat per usuari */
.admin-activity-table{width:100%;border-collapse:collapse;font-size:0.85rem}
.admin-activity-table th.admin-act-sort{cursor:pointer;user-select:none;white-space:nowrap}
.admin-activity-table th.admin-act-sort:hover{color:#fff;text-decoration:underline dotted}
.admin-activity-table th.admin-act-sort.active{color:#FBBF24}
.admin-activity-table th{text-align:left;padding:0.5rem 0.6rem;background:var(--card-2);font-weight:600;border-bottom:2px solid var(--border);position:sticky;top:0}
.admin-activity-table td{padding:0.45rem 0.6rem;border-bottom:1px solid var(--border)}
.admin-activity-table tr:hover{background:rgba(99,102,241,0.06)}
.admin-activity-num{text-align:right;font-variant-numeric:tabular-nums;font-weight:600}
/* Últimes fotos */
.admin-photo-card{background:var(--card-2);border-radius:0.5rem;overflow:hidden;border:1px solid var(--border);transition:transform 0.15s;cursor:pointer}
.admin-photo-card:hover{transform:translateY(-2px);border-color:var(--accent)}
.admin-photo-card img{width:100%;height:120px;object-fit:cover;display:block;background:var(--bg)}
.admin-photo-meta{padding:0.4rem 0.55rem;font-size:0.74rem;color:var(--muted);line-height:1.35}
.admin-photo-meta strong{color:var(--text);display:block;margin-bottom:0.15rem;font-weight:600}
.admin-stat-card{background:linear-gradient(135deg,rgba(231,111,81,0.12),rgba(214,40,40,0.18));border-radius:0.7rem;padding:0.9rem 0.7rem;text-align:center;border:1px solid rgba(214,40,40,0.25)}
.active-badge{display:inline-block;padding:0.1rem 0.45rem;border-radius:0.6rem;font-size:0.72rem;font-weight:600;white-space:nowrap}
.active-badge.active-now{background:rgba(16,185,129,0.18);color:#10b981;border:1px solid rgba(16,185,129,0.4)}
.active-badge.active-day{background:rgba(245,158,11,0.16);color:#f59e0b;border:1px solid rgba(245,158,11,0.35)}
.active-badge.active-online{background:rgba(16,185,129,0.22);color:#10b981;border:1px solid rgba(16,185,129,0.5);font-weight:700;position:relative}
.active-badge.active-online::before{content:'';display:inline-block;width:6px;height:6px;background:#10b981;border-radius:50%;margin-right:4px;animation:pulse 1.5s infinite}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:0.5;transform:scale(1.2)}}
@keyframes mfPulseAlert{0%,100%{box-shadow:0 4px 12px rgba(0,0,0,0.3),0 0 0 0 rgba(220,38,38,0.6)}50%{box-shadow:0 4px 20px rgba(0,0,0,0.5),0 0 0 8px rgba(220,38,38,0)}}
.status-pill{display:inline-block;padding:0.1rem 0.5rem;border-radius:0.6rem;font-size:0.75rem;font-weight:600;white-space:nowrap}
.status-pill.status-open{background:rgba(245,158,11,0.16);color:#f59e0b;border:1px solid rgba(245,158,11,0.35)}
.status-pill.status-in_progress{background:rgba(22,138,173,0.16);color:#168aad;border:1px solid rgba(22,138,173,0.35)}
.status-pill.status-closed{background:rgba(16,185,129,0.16);color:#10b981;border:1px solid rgba(16,185,129,0.35)}
.admin-stat-num{font-size:1.8rem;font-weight:800;color:var(--text);line-height:1}
.admin-stat-lbl{font-size:0.78rem;color:var(--muted);margin-top:0.3rem;text-transform:uppercase;letter-spacing:0.04em}
.admin-table{width:100%;border-collapse:collapse;font-size:0.85rem;min-width:500px}
.admin-table th{background:var(--card-2);color:var(--text);font-weight:700;text-align:left;padding:0.55rem 0.7rem;border-bottom:2px solid var(--border);font-size:0.78rem;text-transform:uppercase;letter-spacing:0.03em;position:sticky;top:0}
.admin-table td{padding:0.55rem 0.7rem;border-bottom:1px solid var(--border);color:var(--text-2)}
.admin-table tr:hover td{background:var(--card-2)}
.admin-table .col-id{font-family:'Courier New',monospace;font-size:0.72rem;color:var(--muted-2)}
.admin-table .col-email{font-weight:600;color:var(--text)}
.admin-table .col-date{font-size:0.78rem;color:var(--muted);white-space:nowrap}
.admin-table .col-coords{font-family:'Courier New',monospace;font-size:0.78rem}
.admin-empty{padding:1rem;text-align:center;color:var(--muted);font-style:italic}
.admin-map{height:400px;width:100%;border-radius:0.7rem;border:1px solid var(--border);margin-top:0.7rem;background:var(--card-2);z-index:1}
/* Marcadors temperatures Catalunya */
.ct-marker{display:flex;flex-direction:column;align-items:center;gap:1px;font-family:system-ui;pointer-events:auto;text-shadow:0 1px 2px rgba(0,0,0,0.4);transform:translate(-50%,-100%)}
.ct-name{font-size:0.7rem;font-weight:700;color:#000;background:rgba(255,255,255,0.92);padding:0px 4px;border-radius:0.25rem;white-space:nowrap;border:1px solid rgba(0,0,0,0.15);max-width:100px;overflow:hidden;text-overflow:ellipsis}
.ct-temps{display:flex;gap:2px}
.ct-max,.ct-min{display:inline-block;font-size:0.78rem;font-weight:800;padding:2px 5px;border-radius:0.3rem;color:white;text-shadow:0 1px 2px rgba(0,0,0,0.5);box-shadow:0 1px 3px rgba(0,0,0,0.3);min-width:26px;text-align:center;letter-spacing:-0.3px;line-height:1.1}
.ct-min{font-size:0.7rem;opacity:0.92}
.ct-legend{display:flex;flex-wrap:wrap;align-items:center;gap:0.3rem;margin-top:0.7rem;padding:0.5rem 0.7rem;background:var(--card-2);border-radius:0.5rem;font-size:0.78rem}
.ct-legend-label{font-weight:600;color:var(--muted);margin-right:0.3rem}
.ct-legend-pill{display:inline-block;padding:0.15rem 0.5rem;border-radius:0.3rem;color:white;font-weight:700;font-size:0.78rem;min-width:30px;text-align:center;text-shadow:0 1px 2px rgba(0,0,0,0.4)}
.ct-single{font-size:0.84rem;padding:3px 7px}
@media(max-width:600px){.admin-map{height:320px}}
.admin-map .leaflet-popup-content-wrapper{background:var(--card);color:var(--text);border-radius:0.5rem}
.admin-map .leaflet-popup-tip{background:var(--card)}
.admin-map .leaflet-popup-content{margin:0.6rem 0.8rem;font-size:0.85rem;line-height:1.4}
.admin-map .leaflet-popup-content strong{color:var(--text)}
.admin-map .leaflet-popup-content small{color:var(--muted);display:block;margin-top:0.2rem}
.admin-map .leaflet-control-attribution{font-size:0.7rem}
.admin-map-toggle{display:flex;gap:0.4rem;margin-top:0.7rem;flex-wrap:wrap}
.admin-map-toggle button{padding:0.35rem 0.7rem;font-size:0.8rem;border-radius:0.4rem;border:1px solid var(--border);background:var(--card-2);color:var(--text);cursor:pointer}
.admin-map-toggle button.active{background:var(--accent);color:white;border-color:var(--accent)}

/* Tabs del formulari afegir ubicació */
.addloc-tab{padding:0.5rem 0.9rem;font-size:0.85rem;border-radius:0.5rem;border:2px solid var(--border);background:var(--card-2);color:var(--text);cursor:pointer;font-weight:600;transition:all 0.2s;flex:1}
.addloc-tab:hover{border-color:var(--accent)}
.addloc-tab.active{background:var(--primary);color:white;border-color:var(--primary)}
.coord-message-success{color:var(--success);font-weight:600}
.coord-message-error{color:var(--danger);font-weight:600}

/* Botó compartir/privar a cada ubicació */
.share-btn{background:transparent;border:1px solid var(--border);border-radius:0.5rem;padding:0.3rem 0.55rem;cursor:pointer;font-size:0.85rem;color:var(--muted);transition:all 0.2s;display:inline-flex;align-items:center;gap:0.25rem}
.share-btn:hover{border-color:var(--accent);color:var(--accent)}
.share-btn.is-public{background:linear-gradient(135deg,rgba(42,157,143,0.15),rgba(80,227,194,0.1));color:var(--success);border-color:var(--success)}
.share-btn.is-public:hover{background:var(--success);color:white}

/* Modal genèric (privacitat, report, etc.) */
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.6);z-index:9999;display:flex;align-items:center;justify-content:center;padding:1rem;backdrop-filter:blur(4px)}
.modal-overlay[hidden]{display:none}
/* Modal de pujada de foto: per sobre del modal del compte */
#modalUploadPhoto{z-index:10001;background:rgba(0,0,0,0.75);}
/* Modals (.modal) — alias amb mateix comportament que modal-overlay */
.modal{position:fixed;inset:0;background:rgba(0,0,0,0.6);z-index:9999;display:flex;align-items:center;justify-content:center;padding:1rem;backdrop-filter:blur(4px)}
.modal[hidden]{display:none}
.modal-content{background:var(--card);color:var(--text);border-radius:0.9rem;padding:1.4rem;max-width:600px;width:100%;max-height:85vh;overflow-y:auto;box-shadow:0 12px 48px rgba(0,0,0,0.3);position:relative}
.modal-content h2{margin-bottom:0.7rem;font-size:1.2rem}
.modal-content .modal-close{position:absolute;top:0.5rem;right:0.7rem;background:transparent;border:none;font-size:1.4rem;color:var(--muted);cursor:pointer;padding:0.3rem 0.6rem;border-radius:0.4rem}
.modal-content .modal-close:hover{color:var(--danger);background:var(--card-2)}
.modal-box{background:var(--card);color:var(--text);border-radius:0.9rem;padding:1.4rem;max-width:600px;width:100%;max-height:85vh;overflow-y:auto;box-shadow:0 12px 48px rgba(0,0,0,0.3)}
.modal-box h2{margin-bottom:0.7rem;font-size:1.2rem}
.modal-box h3{margin:0.9rem 0 0.4rem;font-size:0.95rem;color:var(--accent)}
.modal-box p{font-size:0.88rem;line-height:1.5;color:var(--text-2);margin-bottom:0.4rem}
.modal-box ul{margin:0.3rem 0 0.6rem 1.2rem;font-size:0.86rem;color:var(--text-2);line-height:1.5}
.modal-box .modal-actions{display:flex;justify-content:flex-end;gap:0.5rem;margin-top:1rem;flex-wrap:wrap}
.modal-box .modal-close{background:transparent;border:none;font-size:1.4rem;color:var(--muted);cursor:pointer;float:right;margin-top:-0.5rem;margin-right:-0.5rem;padding:0.3rem 0.6rem}
.modal-box .modal-close:hover{color:var(--danger)}
.report-reason{display:flex;flex-direction:column;gap:0.4rem;margin:0.6rem 0}
.report-reason label{display:flex;align-items:flex-start;gap:0.5rem;padding:0.55rem 0.7rem;border:1px solid var(--border);border-radius:0.5rem;cursor:pointer;font-size:0.88rem;transition:all 0.15s}
.report-reason label:hover{border-color:var(--accent);background:var(--card-2)}
.report-reason input[type=radio]:checked+span{font-weight:700}
.report-reason input[type=radio]{margin-top:0.15rem}

/* Footer links GDPR */
.footer-link{background:none;border:none;color:var(--accent);cursor:pointer;font-size:0.78rem;padding:0;text-decoration:underline;font-family:inherit}
.footer-link:hover{color:var(--primary)}

/* Cluster de Leaflet (estil personalitzat) */
.marker-cluster-small{background:rgba(22,138,173,0.4)!important}
.marker-cluster-small div{background:rgba(22,138,173,0.85)!important;color:white!important;font-weight:700}
.marker-cluster-medium{background:rgba(244,162,97,0.4)!important}
.marker-cluster-medium div{background:rgba(244,162,97,0.85)!important;color:white!important;font-weight:700}
.marker-cluster-large{background:rgba(231,111,81,0.4)!important}
.marker-cluster-large div{background:rgba(231,111,81,0.85)!important;color:white!important;font-weight:700}

/* Botons dins popup Leaflet */
.popup-btn{background:var(--accent);color:white;border:none;padding:0.35rem 0.7rem;border-radius:0.4rem;font-size:0.78rem;cursor:pointer;margin-top:0.4rem;font-family:inherit;text-decoration:none;display:inline-flex;align-items:center;gap:0.25rem;justify-content:center}
.popup-btn:hover{background:var(--primary)}
.popup-btn.danger{background:var(--danger);width:100%;margin-top:0.4rem}
.popup-btn.danger:hover{background:#a51d1d}
.popup-btn.primary{background:linear-gradient(135deg,#10b981,#059669);flex:1;font-weight:700;color:white !important}
.popup-btn.primary:hover{background:linear-gradient(135deg,#059669,#047857)}
.popup-btn.secondary{background:#3b82f6;width:42px;flex-shrink:0}
.popup-btn.secondary:hover{background:#2563eb}
.popup-btn-row{display:flex;gap:0.35rem;margin-top:0.5rem}
.loc-mapview-btn{background:rgba(22,138,173,0.12);color:var(--accent);border:1px solid rgba(22,138,173,0.3);width:32px;height:32px;border-radius:50%;cursor:pointer;font-size:0.95rem;display:inline-flex;align-items:center;justify-content:center;transition:all 0.15s}
.loc-mapview-btn:hover{background:var(--accent);color:white;transform:scale(1.1)}

/* Avís GDPR al login */
.gdpr-consent{font-size:0.82rem;color:var(--muted);margin:0.6rem 0;padding:0.5rem 0.7rem;background:var(--info-bg);border-radius:0.4rem;border-left:3px solid var(--info)}
.gdpr-consent label{display:flex;align-items:flex-start;gap:0.5rem;cursor:pointer;line-height:1.4}
.gdpr-consent input[type=checkbox]{margin-top:0.2rem}

/* Categories: chips selectables */
.cat-chips{display:flex;flex-wrap:wrap;gap:0.35rem;margin:0.4rem 0}
.cat-chip{display:inline-flex;align-items:center;gap:0.3rem;padding:0.35rem 0.65rem;border:1px solid var(--border);border-radius:1rem;font-size:0.78rem;cursor:pointer;background:var(--card-2);color:var(--text-2);transition:all 0.15s;user-select:none}
.cat-chip:hover{border-color:var(--accent)}
.cat-chip.active{background:var(--accent);color:white;border-color:var(--accent);font-weight:600}
.cat-chip-display{display:inline-flex;align-items:center;gap:0.25rem;padding:0.18rem 0.5rem;border-radius:0.8rem;font-size:0.72rem;background:var(--info-bg);color:var(--info);font-weight:600;margin-right:0.25rem;margin-top:0.25rem}

/* Mapa pin per afegir ubicació */
.pin-map{height:300px;width:100%;border-radius:0.7rem;border:2px solid var(--border);margin-top:0.4rem;background:var(--card-2);z-index:1}
@media(max-width:600px){.pin-map{height:240px}}
.pin-hint{font-size:0.78rem;color:var(--muted);margin-top:0.4rem}
.pin-coords-display{display:inline-block;font-family:'Courier New',monospace;background:var(--card-2);padding:0.25rem 0.5rem;border-radius:0.4rem;font-size:0.82rem;color:var(--accent);margin-left:0.4rem}

/* Botó editar categories a saved locations */
.cat-edit-btn{background:transparent;border:1px solid var(--border);border-radius:0.5rem;padding:0.3rem 0.55rem;cursor:pointer;font-size:0.85rem;color:var(--muted);transition:all 0.2s;margin-right:0.3rem}
.cat-edit-btn:hover{border-color:var(--accent);color:var(--accent)}
.cat-quick-btn{background:transparent;border:1px solid var(--border);border-radius:0.5rem;padding:0.3rem 0.5rem;cursor:pointer;font-size:0.85rem;color:var(--muted);transition:all .15s}
.cat-quick-btn:hover,.cat-quick-btn.open{border-color:var(--accent);color:var(--accent)}
.cat-quick-panel{padding:0.5rem 0.6rem;border-top:1px dashed var(--border);display:flex;flex-wrap:wrap;gap:0.3rem;background:var(--card-2)}
.catq-chip{display:inline-flex;align-items:center;gap:0.25rem;padding:0.22rem 0.5rem;border-radius:999px;border:1px solid var(--border);background:var(--card);color:var(--muted);font-size:0.76rem;cursor:pointer;user-select:none;transition:all .12s;line-height:1.2}
.catq-chip .catq-ic{font-size:0.9rem}
.catq-chip:hover{border-color:var(--accent)}
.catq-chip.active{background:var(--accent);color:#fff;border-color:var(--accent);font-weight:700}
.catq-chip.saving{opacity:0.5;pointer-events:none}
.loc-cats-quick{display:inline-flex;flex-wrap:wrap;gap:2px;margin-left:4px;vertical-align:middle}
.loc-cats-quick .lcq-ic{font-size:0.82rem;line-height:1.05}
.mf-loctable-row .cat-quick-btn{padding:0.08rem 0.3rem;font-size:0.82rem}
.mf-loctable .mlt-cats{display:flex;justify-content:flex-end;align-items:center;gap:2px;flex-wrap:wrap}
.mf-loctable .mlt-cats .loc-cats-quick{flex-wrap:nowrap;justify-content:flex-end}
.mf-loctable .mlt-catbtn{display:flex;justify-content:center;align-items:center}

/* Filtres mapa comunitari */
.community-filters{display:flex;flex-direction:column;gap:0.5rem;margin-bottom:0.7rem}
.comm-type-tabs{display:flex;gap:0.3rem;background:rgba(15,23,42,0.4);padding:0.25rem;border-radius:0.5rem;border:1px solid var(--border)}
.comm-tab{flex:1;padding:0.5rem 0.7rem;background:transparent;border:none;color:var(--muted);font-size:0.88rem;font-weight:600;cursor:pointer;border-radius:0.35rem;transition:all 0.18s;font-family:inherit;letter-spacing:0.01em}
.comm-tab:hover{color:var(--text);background:rgba(255,255,255,0.05)}
.comm-tab.active{background:linear-gradient(135deg,#168aad 0%,#0284c7 100%);color:white;box-shadow:0 2px 6px rgba(14,165,233,0.3)}
.comm-tab[data-comm-tab="default"].active{background:linear-gradient(135deg,#f59e0b 0%,#d97706 100%);box-shadow:0 2px 6px rgba(245,158,11,0.35)}
.comm-filters-group{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:0.5rem}
.comm-filters-group[hidden]{display:none}
.comm-filters-group input[type="text"]{padding:0.45rem 0.7rem;background:var(--card);border:1px solid var(--border);border-radius:0.4rem;color:var(--text);font-size:0.88rem;width:100%;box-sizing:border-box;font-family:inherit}
.comm-filters-group input[type="text"]:focus{outline:none;border-color:var(--accent)}
.community-filters select{padding:0.45rem 0.7rem;border:2px solid var(--border);border-radius:0.5rem;background:var(--input-bg);color:var(--text);font-size:0.85rem}

/* Cercador de mapa (pin map i mapa comunitari) */
.map-search-row,.pin-search-row{display:flex;gap:0.4rem;margin-top:0.5rem;align-items:center}
.map-search-row input,.pin-search-row input{flex:1;padding:0.5rem 0.75rem;border:2px solid var(--border);border-radius:0.5rem;background:var(--input-bg);color:var(--text);font-size:0.9rem}
.map-search-row input:focus,.pin-search-row input:focus{outline:none;border-color:var(--accent)}
.map-search-row .btn-sm,.pin-search-row .btn-sm{flex-shrink:0;padding:0.5rem 0.9rem;font-size:0.85rem}

/* Marcador especial de ubicació predeterminada (admin · sense usuari) — contorn or amb glow */
.comm-marker.is-default{
  border:3px solid #fbbf24;
  background:linear-gradient(135deg,#fffbeb 0%,#fef3c7 100%);
  box-shadow:0 0 0 2px rgba(251,191,36,0.35),0 2px 8px rgba(217,119,6,0.4);
  width:36px;height:36px;
  font-size:18px;
}
.comm-marker.is-default::after{
  content:"⭐";
  position:absolute;
  top:-4px;
  right:-4px;
  font-size:11px;
  background:#fbbf24;
  border-radius:50%;
  width:14px;
  height:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 1px 3px rgba(0,0,0,0.4);
  border:1px solid white;
}
[data-theme="dark"] .comm-marker.is-default{
  background:linear-gradient(135deg,#fef3c7 0%,#fde68a 100%);
}
.comm-marker.is-default.cat-nocturna{
  background:linear-gradient(135deg,#1a1a2e,#2d1b69);
  color:#fde68a;
  border-color:#fbbf24;
}
.comm-marker{position:relative}

/* Marcadors del mapa comunitari amb icona de categoria */
.comm-marker{background:white;border:2px solid #168aad;border-radius:50%;width:32px;height:32px;display:flex;align-items:center;justify-content:center;font-size:17px;box-shadow:0 2px 6px rgba(0,0,0,0.35);cursor:pointer;transition:transform 0.15s}
.comm-marker:hover{transform:scale(1.15)}
.comm-marker.cat-nocturna{background:linear-gradient(135deg,#1a1a2e,#2d1b69);border-color:#a78bfa;color:white;box-shadow:0 2px 8px rgba(124,58,237,0.5)}
.comm-marker.cat-paisatge{border-color:#10b981}
.comm-marker.cat-sortida,.comm-marker.cat-capvespre{border-color:#f59e0b}
.comm-marker.cat-mar{border-color:#0ea5e9}
.comm-marker.cat-muntanya{border-color:#78716c}
.comm-marker.cat-bosc{border-color:#16a34a}
.comm-marker.cat-monument,.comm-marker.cat-castell,.comm-marker.cat-esglesia,.comm-marker.cat-patrimoni{border-color:#a16207}
.comm-marker.cat-urbana{border-color:#6b7280}
.comm-marker.cat-mirador{border-color:#dc2626}

/* Subtabs internes pestanya Ubicacions */
.loc-subtabs{display:flex;gap:0.5rem;margin-bottom:1rem;border-bottom:2px solid var(--border);padding-bottom:0}
.loc-subtab{flex:1;padding:0.7rem 0.9rem;font-size:0.95rem;font-weight:700;border:none;background:transparent;color:var(--muted);cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-2px;transition:all 0.15s;display:flex;align-items:center;justify-content:center;gap:0.4rem}
.loc-subtab:hover{color:var(--text)}
.loc-subtab.active{color:var(--primary);border-bottom-color:var(--primary)}
.loc-subtab-count{background:var(--card-2);color:var(--muted);font-size:0.78rem;padding:0.1rem 0.5rem;border-radius:0.8rem;font-weight:600}
.loc-subtab.active .loc-subtab-count{background:var(--primary);color:white}
@media(max-width:600px){
  .loc-subtab{font-size:0.85rem;padding:0.6rem 0.4rem}
  .loc-subtab span:first-child{font-size:1.05rem}
}

/* Mapes: el pane SVG del Leaflet es gegant per disseny i el contenidor l'ha de
   retallar SEMPRE; si s'escapa, eixampla tota la pagina (bug Chrome/Mac 01-09). */
#tab-map{overflow-x:hidden;max-width:1100px;min-width:0;margin-inline:auto}
#tab-map .leaflet-container{overflow:hidden!important;max-width:100%}
/* Fix flexbox: els fills flex (min-width:auto per defecte) no s'encongien sota
   l'amplada del seu contingut — el mapa Leaflet de Focs/Isobares és ample i
   eixamplava la secció. Mateix patró que #tab-admin. */
#tab-map>[data-mapsection],#tab-map [data-mapsection] .card{min-width:0;max-width:100%}
#tab-map [data-mapsection] .admin-map,#tab-map [data-mapsection] .map-wrapper,#tab-map [data-mapsection] .radar-nowcast-wrap,#tab-map [data-mapsection] .aurora-frame{min-width:0;width:calc(100% + 3rem);max-width:calc(100% + 3rem);margin-left:-1.5rem;margin-right:-1.5rem}
#tab-map [data-mapsection] img{max-width:100%}
/* Subtabs pestanya Mapes */
.map-subtabs{display:flex;flex-wrap:wrap;gap:0.4rem;margin-bottom:1rem;padding:0.4rem;background:var(--card);border-radius:0.7rem;box-shadow:var(--shadow);overflow-x:auto;-webkit-overflow-scrolling:touch}
.map-subtab{flex:1;min-width:90px;padding:0.55rem 0.6rem;font-size:0.85rem;font-weight:700;border:none;background:var(--card-2);color:var(--muted);cursor:pointer;border-radius:0.55rem;transition:all 0.15s;white-space:nowrap;text-align:center;overflow:hidden;text-overflow:ellipsis}
.map-subtab:hover{background:rgba(22,138,173,0.1);color:var(--text)}
.map-subtab.active{background:linear-gradient(135deg,var(--primary) 0%,var(--accent) 100%);color:white;box-shadow:0 3px 8px rgba(22,138,173,0.25)}
@media(max-width:600px){.map-subtab{font-size:0.78rem;padding:0.45rem 0.4rem;min-width:78px}}
@media(max-width:600px){.map-subtab{font-size:0.78rem;padding:0.55rem 0.4rem}}

/* Llegenda pol·lució lumínica */
.lp-legend{margin:0.7rem 0;display:flex;flex-direction:column;gap:0.35rem}
.lp-row{display:grid;grid-template-columns:32px 1fr;gap:0.6rem;align-items:center;padding:0.35rem 0.5rem;border-radius:0.5rem;background:var(--card-2)}
.lp-row strong{font-size:0.88rem;display:block;color:var(--text)}
.lp-row small{font-size:0.78rem;color:var(--muted);display:block;line-height:1.3}
.lp-color{width:28px;height:28px;border-radius:0.4rem;flex-shrink:0;box-shadow:inset 0 0 0 1px rgba(0,0,0,0.1)}

/* Botó "Llegenda" (ℹ️) destacat al costat de Pol·lució */
button[id$="PollutionLegend"]{
  background:linear-gradient(135deg,#168aad,#76c7d0)!important;
  color:white!important;
  font-weight:700!important;
  font-size:1rem!important;
  border:2px solid rgba(255,255,255,0.4)!important;
  border-radius:50%!important;
  width:34px!important;
  min-width:34px!important;
  height:34px!important;
  padding:0!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  box-shadow:0 2px 8px rgba(22,138,173,0.5)!important;
  cursor:pointer;
  transition:transform 0.15s,box-shadow 0.15s
}
button[id$="PollutionLegend"]:hover{
  transform:scale(1.12);
  box-shadow:0 4px 14px rgba(22,138,173,0.7)!important
}

/* Pluges de meteors */
.meteor-hero{background:linear-gradient(135deg,rgba(15,52,96,0.9),rgba(40,30,80,0.85));color:#fff;border-radius:0.9rem;padding:1.2rem;border:1px solid rgba(255,255,255,0.15);position:relative;overflow:hidden}
.meteor-hero h3{color:#ffd166;font-size:0.85rem;text-transform:uppercase;letter-spacing:0.05em;margin-bottom:0.4rem}
.meteor-hero .meteor-name{font-size:1.5rem;font-weight:800;margin-bottom:0.2rem}
.meteor-hero .meteor-stats{font-size:0.92rem;opacity:0.92;line-height:1.5}
.meteor-hero .meteor-rate{font-size:2.2rem;font-weight:800;color:#ffd166;display:inline-block;margin-right:0.4rem}
.meteor-hero .meteor-stars{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(2px 2px at 20% 30%,#fff,transparent),radial-gradient(1px 1px at 70% 60%,#fff,transparent),radial-gradient(1px 1px at 40% 80%,#fff,transparent),radial-gradient(2px 2px at 85% 25%,#fff,transparent),radial-gradient(1px 1px at 15% 70%,#fff,transparent);opacity:0.4;pointer-events:none}
.meteor-day-nav{display:flex;align-items:center;gap:0.5rem;margin-bottom:0.8rem;justify-content:center}
.meteor-date-display{font-weight:600;font-size:0.95rem;text-align:center;flex:1}
.meteor-moon-info{background:var(--card-2);border-radius:0.6rem;padding:0.7rem 0.9rem;margin-top:0.8rem;display:flex;align-items:center;gap:0.7rem;font-size:0.88rem}
.meteor-moon-info .moon-svg-mini{flex-shrink:0}
.meteor-showcase{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:0.6rem;margin-top:0.6rem}
.showcase-card{background:var(--card-2);border-radius:0.7rem;padding:0.7rem 0.5rem;text-align:center;border:1px solid var(--border);transition:all 0.2s}
.showcase-card:hover{border-color:var(--accent);transform:translateY(-2px);box-shadow:var(--shadow)}
.showcase-card svg{margin:0 auto 0.4rem;display:block}
.showcase-card .sc-name{font-weight:700;font-size:0.85rem;color:var(--text);margin-bottom:0.15rem}
.showcase-card .sc-date{font-size:0.75rem;color:var(--muted)}
.shower-row{display:flex;align-items:flex-start;gap:0.7rem;padding:0.7rem 0;border-bottom:1px solid var(--border)}
.shower-row:last-child{border-bottom:none}
.shower-bar{flex-shrink:0;width:6px;align-self:stretch;border-radius:3px;background:linear-gradient(to bottom,var(--accent),var(--primary))}
.shower-bar.future{background:var(--muted-2)}
.shower-bar.weak{background:var(--muted-2)}
.shower-content{flex:1;min-width:0}
.shower-name{font-weight:700;color:var(--text);font-size:0.95rem}
.shower-name .shower-period{font-weight:400;color:var(--muted);font-size:0.83rem;margin-left:0.3rem}
.shower-peak{color:#e8a317;font-size:0.88rem;margin-top:0.15rem}
[data-theme="dark"] .shower-peak{color:#ffd166}
.shower-moon{color:var(--muted);font-size:0.83rem;margin-top:0.15rem}
.shower-moon.bad{color:var(--warning)}
.shower-moon.good{color:var(--success)}
.shower-icon{flex-shrink:0;font-size:1.5rem;color:var(--accent);align-self:center}
.meteor-times{display:grid;grid-template-columns:auto 1fr 1fr;gap:0.4rem 1.5rem;font-size:0.95rem;align-items:center}
.meteor-times .lbl{font-weight:700;color:var(--muted)}
.meteor-times .arrow{font-weight:700;font-size:1.05rem}
.meteor-times .arrow.up{color:#f4a261}
.meteor-times .arrow.dn{color:#168aad}
.meteor-times .val{font-family:'Segoe UI',sans-serif}

/* Dashboard Avui */
.today-header{display:flex;align-items:center;gap:0.5rem;margin-bottom:0.8rem;flex-wrap:wrap}
.today-compact-card{padding:0.7rem 0.9rem !important}
.today-compact-row{display:flex;align-items:center;gap:0.5rem;flex-wrap:wrap}
.today-nav-group{display:inline-flex;align-items:center;gap:0.3rem;flex-shrink:0}
.today-loc-group{flex:1;min-width:160px;display:flex;flex-wrap:wrap;align-items:center}
.today-loc-select{flex:1;min-width:140px;padding:0.35rem 0.6rem;border:1.5px solid var(--border);border-radius:0.45rem;background:var(--input-bg);color:var(--text);font-size:0.86rem}
/* Chips de filtre del selector AVUI */
.today-loc-filter-row{display:flex;flex-wrap:wrap;gap:0.3rem;width:100%;margin-bottom:0.45rem}
/* 12-09 (Jaume): filtres d'ubicacions plegables — plegat: [filtre actiu] … [▼] a la mateixa línia */
#todayLocFilterRow{margin-bottom:0.6rem!important}   /* aire abans del mapa */
.today-loc-filter-row.folded{display:none!important}   /* plegat: la pestanya del mapa ja diu el filtre */
.cat-map-fold{margin-left:auto;padding:0 .2rem 0 .5rem;font-size:.8rem;opacity:.85;}
.cat-map-tab{display:flex;align-items:center;gap:.3rem;}
.today-loc-filter-chip{cursor:pointer;padding:0.3rem 0.6rem;border-radius:1rem;border:1.5px solid var(--border);background:transparent;color:var(--text);font-size:0.78rem;font-weight:600;white-space:nowrap;transition:background 0.15s ease,border-color 0.15s ease,color 0.15s ease}
.today-loc-filter-chip:hover{background:rgba(99,102,241,0.10);border-color:rgba(99,102,241,0.45)}
.today-loc-filter-chip.active{background:rgba(99,102,241,0.20);border-color:rgba(99,102,241,0.7);color:#fff}
.today-loc-filter-chip[disabled]{opacity:0.45;cursor:wait}
@media(max-width:520px){
  .today-compact-row{gap:0.35rem;flex-wrap:wrap}
  /* === FIX (v2026-05-14-14h00) === Navegador del dia: forçar UNA línia
     ‹ DATA › Avui — i compactar elements perquè no sobresurti.
     Abans: flex-wrap:wrap feia que el botó "Avui" saltés sortís fora.
     Ara: nowrap + width:100% + ellipsis al text + botons compactats. */
  .today-nav-group{
    flex-wrap:nowrap !important;
    width:100%;
    gap:0.3rem;
    min-width:0;
    justify-content:space-between;
  }
  .today-date-wrap{flex:1 1 auto;min-width:0}
  .today-date{
    font-size:0.92rem;
    padding:0.3rem 0.35rem;
    line-height:1.25;
    overflow:hidden;
  }
  .today-date small{font-size:0.7rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
  .today-date::after{font-size:0.6rem;margin-left:0.15rem;opacity:0.4}
  .cal-nav-btn{
    flex:0 0 auto;
    width:34px;
    height:34px;
    font-size:1rem;
    border-width:1.5px;
  }
  .cal-today-btn{
    flex:0 0 auto;
    padding:0.3rem 0.6rem;
    font-size:0.78rem;
    border-width:1.5px;
    border-radius:1rem;
  }
  .today-loc-group{width:100%;gap:0.35rem}
  .today-loc-select{width:100%;flex:1 1 100%;min-width:0}
  .today-loc-group #todayCreatePlanBtn{margin-left:0 !important;flex:1;font-size:0.82rem}
  .today-loc-group #todayRefreshBtn{margin-left:0 !important;flex:0 0 auto}
}
/* Pantalles ultra-petites (iPhone SE i similars): "Avui" → només la icona ↻
   per estalviar amplada al màxim. */
@media(max-width:360px){
  .cal-today-btn{font-size:0;padding:0.3rem 0.5rem;min-width:36px}
  .cal-today-btn::before{content:"↻";font-size:1rem;line-height:1}
  .today-date{font-size:0.88rem}
}

/* === Saltar a fase lunar === */
.today-moon-jump-row{display:flex;align-items:center;gap:0.3rem;flex-wrap:wrap;margin-top:0.6rem;padding:0.35rem 0.6rem;background:linear-gradient(135deg,rgba(99,102,241,0.06),rgba(168,85,247,0.04));border-radius:0.55rem;border:1px solid rgba(168,85,247,0.15)}
.moon-jump-label{font-size:0.78rem;color:var(--muted);font-weight:600;letter-spacing:0.3px;flex-shrink:0}
.moon-jump-btn{display:inline-flex;align-items:center;gap:0.15rem;background:var(--card);border:1px solid var(--border);color:var(--text);padding:0.32rem 0.55rem;border-radius:0.45rem;cursor:pointer;font-size:0.85rem;font-weight:600;transition:all 0.15s;white-space:nowrap}
.moon-jump-btn:hover{background:linear-gradient(135deg,#6366f1,#a855f7);color:white;border-color:transparent;transform:translateY(-1px);box-shadow:0 3px 8px rgba(99,102,241,0.3)}
.moon-jump-btn:active{transform:translateY(0)}
.moon-jump-btn .mj-icon{font-size:0.95rem;line-height:1}
.moon-jump-btn .mj-arrow{font-size:1rem;line-height:1;font-weight:300}
.moon-jump-divider{color:var(--muted-2);font-size:0.7rem;opacity:0.45;margin:0 0.2rem}
@media(max-width:520px){
  .today-moon-jump-row{padding:0.3rem 0.4rem;gap:0.2rem}
  .moon-jump-label{font-size:0.72rem}
  .moon-jump-btn{padding:0.28rem 0.4rem;font-size:0.8rem}
}
.today-date{flex:1;text-align:center;font-weight:700;font-size:1.05rem;line-height:1.3;cursor:pointer;padding:0.3rem 0.5rem;border-radius:0.45rem;transition:background 0.15s,box-shadow 0.15s;position:relative;user-select:none}
.today-date:hover{background:rgba(22,138,173,0.08);box-shadow:inset 0 0 0 1px rgba(22,138,173,0.2)}
.today-date:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.today-date::after{content:"📅";font-size:0.7rem;margin-left:0.3rem;opacity:0.5;vertical-align:middle}
.today-date-wrap{flex:1;position:relative;display:flex;flex-direction:column}

/* === CALENDARI POPUP === */
.today-cal-popup{position:absolute;top:calc(100% + 0.4rem);left:50%;transform:translateX(-50%);background:var(--card);border:1px solid var(--border);border-radius:0.7rem;box-shadow:0 8px 24px rgba(0,0,0,0.18);padding:0.8rem;min-width:260px;z-index:200;animation:calFadeIn 0.15s ease}
.today-cal-popup[hidden]{display:none}
@keyframes calFadeIn{from{opacity:0;transform:translateX(-50%) translateY(-4px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}
.today-cal-header{display:flex;align-items:center;justify-content:space-between;gap:0.4rem;margin-bottom:0.6rem}
.today-cal-nav{width:30px;height:30px;border:none;background:var(--card-2);color:var(--text);border-radius:0.4rem;cursor:pointer;font-size:1.2rem;line-height:1;font-weight:300;transition:all 0.15s}
.today-cal-nav:hover{background:var(--accent);color:white}
.today-cal-title{flex:1;text-align:center;font-weight:700;font-size:0.95rem;border:none;background:transparent;cursor:pointer;color:var(--text);padding:0.3rem;border-radius:0.4rem;text-transform:capitalize;transition:background 0.15s}
.today-cal-title:hover{background:var(--card-2)}
.today-cal-weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:0.2rem;margin-bottom:0.3rem;text-align:center;font-size:0.72rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:0.4px}
.today-cal-days{display:grid;grid-template-columns:repeat(7,1fr);gap:0.2rem}
.today-cal-day{aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0.05rem;border:none;background:transparent;color:var(--text);border-radius:0.4rem;cursor:pointer;font-size:0.85rem;font-weight:500;transition:all 0.12s;padding:0.1rem 0;min-width:0;position:relative}
.today-cal-day:hover:not(.other-month):not(.disabled){background:var(--card-2);transform:scale(1.05)}
.today-cal-day.other-month{opacity:0.3;pointer-events:none}
.today-cal-day.today{font-weight:800;color:var(--accent);outline:1.5px dashed var(--accent);outline-offset:-2px}
.today-cal-day.selected{background:linear-gradient(135deg,var(--primary),var(--accent));color:white;font-weight:800;box-shadow:0 2px 6px rgba(22,138,173,0.35)}
.today-cal-day.selected:hover{transform:none}
.cal-day-num{line-height:1;font-size:0.85rem}
.cal-marks{display:flex;gap:1px;line-height:0.7;height:0.65rem;align-items:center;margin-top:1px;justify-content:center}
.cal-mark{font-size:0.55rem;line-height:0.65rem;display:inline-block}
.cal-mark.moon-new{filter:drop-shadow(0 0 2px rgba(99,102,241,0.6))}
.cal-mark.moon-full{filter:drop-shadow(0 0 3px rgba(255,235,150,0.8))}
.cal-mark.moon-q{opacity:0.85}
.cal-mark.eclipse{font-size:0.6rem;animation:eclipsePulse 2s ease-in-out infinite}
.cal-mark.meteor{color:#fbbf24;font-size:0.7rem;line-height:0.65rem}
.cal-mark.meteor.iconic{filter:drop-shadow(0 0 3px rgba(251,191,36,0.8))}
.cal-mark.equinox{font-size:0.55rem;filter:drop-shadow(0 0 2px rgba(34,197,94,0.5))}
.cal-mark.iss{font-size:0.6rem;filter:drop-shadow(0 0 2px rgba(56,189,248,0.7));animation:issBlink 3s ease-in-out infinite}
@keyframes issBlink{0%,100%{opacity:0.95}50%{opacity:0.7;transform:translateY(-1px)}}
@keyframes eclipsePulse{0%,100%{opacity:0.85;transform:scale(1)}50%{opacity:1;transform:scale(1.15)}}
.today-cal-day.has-new-moon:not(.selected):not(.has-eclipse){background:rgba(99,102,241,0.08)}
.today-cal-day.has-full-moon:not(.selected):not(.has-eclipse){background:rgba(255,235,150,0.12)}
.today-cal-day.has-eclipse:not(.selected){border:1.5px solid #ef4444;background:rgba(239,68,68,0.08)}
.today-cal-day.has-eclipse.eclipse-visible:not(.selected){border-color:#dc2626;background:rgba(239,68,68,0.18);font-weight:700}
.today-cal-day.has-eclipse.eclipse-lunar:not(.selected){border-color:#f97316;background:rgba(249,115,22,0.1)}
.today-cal-day.has-equinox:not(.selected):not(.has-eclipse){background:rgba(34,197,94,0.1);border:1px dashed rgba(34,197,94,0.4)}
.today-cal-legend{display:flex;flex-wrap:wrap;justify-content:center;gap:0.5rem;margin-top:0.6rem;padding-top:0.5rem;border-top:1px solid var(--border);font-size:0.68rem;color:var(--muted)}
.today-cal-legend span{display:inline-flex;align-items:center;gap:0.2rem}
.today-cal-legend .cal-mark{font-size:0.65rem}
.today-cal-iss-link{display:block;text-align:center;margin-top:0.5rem;padding:0.4rem 0.6rem;font-size:0.78rem;color:#0ea5e9;background:rgba(56,189,248,0.08);border:1px solid rgba(56,189,248,0.25);border-radius:0.45rem;text-decoration:none;font-weight:600;transition:all 0.15s}
.today-cal-iss-link:hover{background:rgba(56,189,248,0.18);border-color:#0ea5e9;transform:translateY(-1px)}
@media(max-width:520px){
  .today-cal-popup{min-width:240px;padding:0.6rem;left:0;transform:none}
  @keyframes calFadeIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
  .today-cal-day{font-size:0.8rem}
}
.today-date small{display:block;font-weight:400;font-size:0.8rem;color:var(--muted);margin-top:0.1rem}
.today-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:0.6rem;margin-top:0.7rem}
.today-card{background:var(--card);border-radius:0.7rem;padding:0.85rem 0.95rem;box-shadow:var(--shadow);border:1px solid var(--border);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.today-card h3{font-size:0.92rem;margin-bottom:0.5rem;display:flex;align-items:center;gap:0.4rem}
.today-card.day-card{background:linear-gradient(135deg,rgba(252,176,69,0.78),rgba(253,124,79,0.62));color:#1f2937}
.today-card.day-card h3,
.today-card.day-card .today-row .lbl,
.today-card.day-card .today-row .val,
.today-card.day-card .today-row .val small{color:#1f2937}
.today-card.day-card .today-row .lbl{color:#374151}
.today-card.day-card .today-row .val small{color:#4b5563;opacity:0.95}
.today-card.day-card .today-row{border-bottom-color:rgba(31,41,55,0.18)}
.today-card.night-card{background:linear-gradient(135deg,rgba(15,52,96,0.82),rgba(40,30,80,0.72));color:var(--text)}
[data-theme="dark"] .today-card.night-card{background:linear-gradient(135deg,rgba(15,52,96,0.88),rgba(40,30,80,0.8))}
.today-card.astro-card{background:linear-gradient(135deg,rgba(22,138,173,0.75),rgba(125,196,216,0.62))}
.today-card.meteo-card{background:linear-gradient(135deg,rgba(42,157,143,0.78),rgba(80,227,194,0.65))}
.today-card.actions-card{background:linear-gradient(135deg,rgba(244,162,97,0.8),rgba(231,111,81,0.65))}
.today-row{display:flex;justify-content:space-between;padding:0.4rem 0;border-bottom:1px dashed var(--border);font-size:0.9rem}
.today-row:last-child{border-bottom:none}
.today-row .lbl{color:var(--muted);font-weight:600}
.today-row .val{color:var(--text);font-weight:600;text-align:right}
.today-row .val small{color:var(--muted);font-weight:400;display:block;font-size:0.78rem}
.today-row.mf-route-row{transition:background 0.15s ease;margin:0 -0.4rem;padding-left:0.4rem;padding-right:0.4rem;border-radius:0.4rem}
.today-row.mf-route-row:hover{background:rgba(99,102,241,0.10)}
.today-row.mf-route-row:active{background:rgba(99,102,241,0.18)}
/* ===== 12-10 · DIA I NIT MODERNS (inici del mode complet; Jaume: «icones antics», estil Apple) =====
   Targetes neutres (sense degradats saturats), icones noves (.mf-ico), hores tabulars, franja del cel i separadors fins.
   HTML: classe mf-tdy a index.html; contingut a js/app.js (_renderTodayDashboardImpl, _mfTdyIco, _mfTdyHeads).
   Colors de la franja: --tdy-n (nit) · --tdy-b (blava) · --tdy-g (daurada) · --tdy-d (dia) · --tdy-ml (sense lluna) */
.today-grid .today-card.mf-tdy{--tdy-n:#2b3768;--tdy-b:#4f7fe0;--tdy-g:#f4b247;--tdy-d:#a6d3ff;--tdy-ml:#4b4ec4;--tdy-tile:rgba(118,118,128,.08);--tdy-sep:rgba(60,60,67,.12);--tdy-track:rgba(118,118,128,.16);
  background:var(--card);color:var(--text);border:1px solid rgba(0,0,0,.05);border-radius:20px;padding:.95rem 1rem 1rem;box-shadow:0 1px 2px rgba(0,0,0,.05),0 8px 24px rgba(0,0,0,.06);container-type:inline-size;
  font-family:-apple-system,BlinkMacSystemFont,system-ui,'Segoe UI',Roboto,'Helvetica Neue',sans-serif}
[data-theme="light"] .today-grid .today-card.mf-tdy{background:#fff}
[data-theme="dark"] .today-grid .today-card.mf-tdy{--tdy-n:#27325f;--tdy-b:#3b67cf;--tdy-g:#e8a23d;--tdy-d:#76b0e6;--tdy-ml:#7276ee;--tdy-tile:rgba(255,255,255,.05);--tdy-sep:rgba(255,255,255,.08);--tdy-track:rgba(255,255,255,.09);
  border-color:rgba(255,255,255,.06);box-shadow:0 1px 2px rgba(0,0,0,.3),0 10px 26px rgba(0,0,0,.28)}
html.mf-red .today-grid .today-card.mf-tdy{--tdy-ml:#ffb0b0;--tdy-sep:rgba(255,176,176,.14)}
html.mf-red .today-grid .today-card.mf-tdy .mf-ico{background:rgba(255,255,255,.08)}   /* amb el vel vermell, taronja i blanc donen el mateix vermell: quadrat fosc perquè el glif es vegi */
.today-grid .today-card.mf-tdy h3{margin:0 0 .8rem;gap:.5rem;font-size:.74rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.mf-tdy-hi{display:inline-flex}
.mf-tdy-hi:empty{display:none}
.today-card.mf-tdy h3 .mf-ico{width:22px;height:22px;border-radius:6px;box-shadow:none}
.today-card.mf-tdy .mf-info{background:var(--tdy-track);color:var(--muted)}
.mf-tdy-icw{display:inline-block;width:26px;text-align:center;font-size:1.15rem;line-height:1;flex:0 0 auto}
/* dues caselles: sortida | posta */
.mf-tdy-pair{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
.mf-tdy-cell,.mf-tdy-ml{background:var(--tdy-tile);border-radius:14px;padding:.7rem .75rem .7rem;min-width:0}
.mf-tdy-cell{display:flex;flex-direction:column;justify-content:space-between}
.mf-tdy-ch{display:flex;align-items:center;gap:.45rem;font-size:.78rem;font-weight:600;line-height:1.2;color:var(--muted)}
.mf-tdy-ch>span{min-width:0}
.mf-tdy-ch .mf-ico{width:26px;height:26px;border-radius:7px;box-shadow:none}
.mf-tdy-big{margin-top:.45rem;font-size:1.7rem;font-weight:600;line-height:1.05;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--text)}
.mf-tdy-big small{font-size:.55em;font-weight:500;letter-spacing:0;margin-left:.06em;color:var(--muted)}
.mf-tdy-sm{margin-top:.2rem;font-size:.76rem;color:var(--muted);font-variant-numeric:tabular-nums}
/* franja del cel (00–24 h) i franja de nit (12–12 h) */
.mf-tdy-strip{margin:.85rem .15rem .1rem}
.mf-tdy-ml .mf-tdy-strip{margin:.7rem 0 0}
.mf-tdy-bar{position:relative;height:8px;border-radius:999px;background:var(--tdy-track)}
.mf-tdy-tk{position:absolute;top:-3px;bottom:-3px;width:2px;margin-left:-1px;border-radius:1px;background:var(--text);opacity:.3}
.mf-tdy-seg{position:absolute;top:0;bottom:0;border-radius:999px;background:var(--tdy-ml)}
.mf-tdy-now{position:absolute;top:50%;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:#fff;box-shadow:0 0 0 2px var(--text),0 1px 4px rgba(0,0,0,.3)}
.mf-tdy-ax{display:flex;justify-content:space-between;margin-top:.35rem;font-size:.66rem;line-height:1;color:var(--muted);font-variant-numeric:tabular-nums;opacity:.85}
/* files: hora blava i daurada */
.mf-tdy-list{margin-top:.55rem}
.mf-tdy-row{position:relative;display:flex;align-items:center;gap:.7rem;min-height:46px;padding:.4rem 0}
.mf-tdy-row+.mf-tdy-row::before{content:'';position:absolute;top:0;right:0;left:calc(28px + .7rem);border-top:1px solid var(--tdy-sep)}
.mf-tdy-row .mf-ico{width:28px;height:28px;border-radius:8px;box-shadow:none}
.mf-tdy-rl{flex:1 1 auto;min-width:0;font-size:.92rem;font-weight:500;line-height:1.25;color:var(--text)}
.mf-tdy-rv{flex:0 0 auto;white-space:nowrap;text-align:right;font-size:.98rem;font-weight:600;font-variant-numeric:tabular-nums;color:var(--text)}
.mf-tdy-rv i{font-style:normal;font-weight:400;margin:0 .15em;color:var(--muted)}
/* lluna: fase dibuixada (moonSVG) + nom */
.mf-tdy-moon{display:flex;align-items:center;gap:.9rem;margin:0 0 .8rem}
.mf-tdy-moon>svg{display:block;flex:0 0 auto;border-radius:50%;box-shadow:0 0 0 1px var(--tdy-sep),0 4px 14px rgba(0,0,0,.18)}
.mf-tdy-pn{display:block;font-size:1.15rem;font-weight:600;line-height:1.2;color:var(--text)}
.mf-tdy-sub{display:block;margin-top:.15rem;font-size:.85rem;color:var(--muted);font-variant-numeric:tabular-nums}
.mf-tdy-ml{margin-top:.5rem}
/* icones pròpies (glif blanc en quadrat amb degradat, com .mf-ico-<k>) */
.mf-tdy-i-sun{background:linear-gradient(160deg,#ffd27a,#f28c38)}
.mf-tdy-i-gold{background:linear-gradient(160deg,#ffd666,#e3981b)}
.mf-tdy-i-blue{background:linear-gradient(160deg,#6d98ff,#2b47b4)}
.mf-tdy-i-mrise,.mf-tdy-i-mset{background:linear-gradient(160deg,#27407d,#0b1530)}
.mf-tdy-i-dark{background:linear-gradient(160deg,#363a5e,#0b0d1c)}
/* 12-10 · Cel profund i Meteo amb el mateix estil (Jaume ho aprova): regles pròpies, no toquen Dia ni Nit */
.today-grid .today-card.astro-card.mf-tdy{--tdy-gc:#7a5bd6}
[data-theme="dark"] .today-grid .today-card.astro-card.mf-tdy{--tdy-gc:#a68bff}
html.mf-red .today-grid .today-card.astro-card.mf-tdy{--tdy-gc:#ffb0b0}
.today-grid .today-card.meteo-card.mf-tdy:hover{transform:none}   /* la regla .meteo-card de la pàgina dels meteoròlegs (index.html) la feia saltar */
.today-grid .today-card.meteo-card.mf-tdy{transition:none}   /* 16-10: la mateixa regla hi posava transition:all i, en plegar-la, el farciment s'animava (quedava més avall que les altres) */
.today-card.mf-tdy h3 .mf-info{text-transform:none;letter-spacing:0}
#todayAstro>.mf-tdy-ml:first-child{margin-top:0}
.mf-tdy-big i{font-style:normal;font-weight:400;margin:0 .12em;color:var(--muted)}
.mf-tdy-big .mf-tdy-name{display:block;font-size:.74em;letter-spacing:-.01em;line-height:1.2}
.mf-tdy-big .mf-tdy-off{display:block;font-size:.6em;font-weight:500;letter-spacing:0;color:var(--muted)}
.mf-tdy-seg.mf-tdy-gc{background:var(--tdy-gc)}
.mf-tdy-fill{position:absolute;left:0;top:0;bottom:0;border-radius:999px}
.mf-tdy-dot{display:inline-block;width:.6em;height:.6em;border-radius:50%;margin-right:.4em;vertical-align:.02em}
/* meteo: temperatura gran amb la icona del cel */
.mf-tdy-wx{display:flex;align-items:center;gap:.85rem;margin:0 0 .75rem}
.mf-tdy-wx>.mf-ico{width:56px;height:56px;border-radius:15px;box-shadow:0 3px 10px rgba(0,0,0,.16)}
.mf-tdy-wx>.mf-tdy-icw{width:56px;font-size:2.2rem}
.mf-tdy-wx .mf-tdy-sub{margin:0}
.mf-tdy-wx .mf-tdy-big{display:block;margin-top:.15rem}
.mf-tdy-temp span{font-size:.62em;vertical-align:.22em}
html.mf-red .today-grid .today-card.mf-tdy .mf-tdy-fill,html.mf-red .today-grid .today-card.mf-tdy .mf-tdy-dot{background:var(--tdy-ml)!important}
html.mf-red .today-grid .today-card.mf-tdy .mf-tdy-temp span{color:inherit!important}   /* fletxes de tendència: el blau es tornaria negre */
.mf-tdy-i-stars{background:linear-gradient(160deg,#4a3f9e,#141533)}
.mf-tdy-i-part{background:linear-gradient(160deg,#5ab0ff,#2b6fd6)}
.mf-tdy-i-cnight{background:linear-gradient(160deg,#27407d,#0b1530)}
.mf-tdy-i-wind{background:linear-gradient(160deg,#9db3c8,#53697f)}
.mf-tdy-i-drop{background:linear-gradient(160deg,#5f9dff,#2a55c9)}
.mf-tdy-i-eye{background:linear-gradient(160deg,#5fd3b5,#1f8b74)}
.mf-tdy-i-rain{background:linear-gradient(160deg,#6f8fb8,#34507a)}   /* 15-10: pluja i neu (els 5 dies del mode fàcil) */
.mf-tdy-i-snow{background:linear-gradient(160deg,#9cc0e6,#4f74a3)}
@container (max-width:250px){
  .mf-tdy-wx{gap:.65rem;margin-bottom:.6rem}
  .mf-tdy-wx>.mf-ico{width:46px;height:46px;border-radius:12px}
  .meteo-card .mf-tdy-ml .mf-tdy-strip{margin-top:.55rem}
}
/* 12-10 · ✨ KPI d'estrelles (Lluna × núvols): tres caselles a Cel profund i la targeta «Estrelles i Via Làctia» (#todayStarsCard).
   Nivells: ≥70 bo (verd) · 40–69 regular (ambre) · <40 dolent (vermell). En vermell: com més bo, més clar */
.today-grid .today-card.astro-card.mf-tdy,.today-grid .today-card.mf-sky-card{--kpi-good:#1f9d4c;--kpi-good-bg:rgba(52,199,89,.15);--kpi-mid:#c27400;--kpi-mid-bg:rgba(255,159,10,.17);--kpi-bad:#d1372d;--kpi-bad-bg:rgba(255,59,48,.13)}
[data-theme="dark"] .today-grid .today-card.astro-card.mf-tdy,[data-theme="dark"] .today-grid .today-card.mf-sky-card{--kpi-good:#4cd57a;--kpi-good-bg:rgba(48,209,88,.18);--kpi-mid:#ffb340;--kpi-mid-bg:rgba(255,170,40,.17);--kpi-bad:#ff6b61;--kpi-bad-bg:rgba(255,90,80,.17)}
html.mf-red .today-grid .today-card.astro-card.mf-tdy,html.mf-red .today-grid .today-card.mf-sky-card{--kpi-good:#ffd6d6;--kpi-good-bg:rgba(255,214,214,.22);--kpi-mid:#d08888;--kpi-mid-bg:rgba(208,136,136,.14);--kpi-bad:#8f5050;--kpi-bad-bg:rgba(143,80,80,.16)}
.mf-tdk-good{--kpi-fg:var(--kpi-good);--kpi-bg:var(--kpi-good-bg)}
.mf-tdk-mid{--kpi-fg:var(--kpi-mid);--kpi-bg:var(--kpi-mid-bg)}
.mf-tdk-bad{--kpi-fg:var(--kpi-bad);--kpi-bg:var(--kpi-bad-bg)}
.mf-tdk-na{--kpi-fg:var(--muted);--kpi-bg:var(--tdy-track)}
/* Cel profund: Lluna · Núvols · Estrelles (aquesta, destacada) */
.mf-tdk-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem;margin-bottom:.5rem}
.mf-tdk-row .mf-tdk-main{grid-column:1/-1}   /* 12-10: ✨ Estrelles a dalt, a tota l'amplada; a sota 🌙 ☁️ 💡 */
.mf-tdy-i-lp{background:linear-gradient(160deg,#334155,#0f172a)}
/* 12-10 (Jaume): les 5 targetes es pleguen tocant el títol; plegades, el títol porta el resum (#tdySum_<k>) */
.today-grid .today-card.mf-tdy[data-fold]>h3{display:flex;align-items:center;cursor:pointer;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}
.mf-tdy[data-fold]>h3 .mf-tdy-chev{flex:0 0 auto;width:.5rem;height:.5rem;margin:-.2rem .25rem 0 auto;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);transition:transform .2s ease;opacity:.7}
.mf-tdy-sum{display:none;flex:0 0 auto;max-width:calc(100% - 3.2rem);min-width:0;margin-left:auto;align-items:center;gap:.3rem;overflow:hidden;white-space:nowrap;text-transform:none;letter-spacing:0;font-size:.86rem;font-weight:500;color:var(--text);font-variant-numeric:tabular-nums}
.mf-tdy-sum b{font-weight:700}
.mf-tdy-sum .mf-ico{width:16px!important;height:16px!important;border-radius:4px!important;flex:0 0 auto}
.mf-tdy-sum b.mf-tdk-good,.mf-tdy-sum b.mf-tdk-mid,.mf-tdy-sum b.mf-tdk-bad{color:var(--kpi-fg)}
.today-grid .today-card.mf-tdy.mf-tdy-closed{align-self:start}
.today-grid .today-card.mf-tdy.mf-tdy-closed>h3{margin-bottom:0}
.mf-tdy.mf-tdy-closed>:not(h3){display:none!important}
.mf-tdy.mf-tdy-closed .mf-tdy-sum{display:inline-flex}
.mf-tdy.mf-tdy-closed>h3 .mf-tdy-chev{transform:rotate(-45deg);margin-left:.5rem;margin-top:0}
.mf-tdy.mf-tdy-closed>h3 .mf-tdy-ht{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:0 1 auto}
.mf-tdy.mf-tdy-closed>h3 .mf-info{display:none}
/* 13-10 (Jaume): «Catalunya — temps» també es plega (capçalera .mf-fold-h) */
.cat-meteo-map-card[data-fold]>.mf-fold-h{cursor:pointer;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}
.cat-meteo-map-card[data-fold]>.mf-fold-h .mf-tdy-chev{flex:0 0 auto;width:.5rem;height:.5rem;margin:-.2rem .25rem 0 auto;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);transition:transform .2s ease;opacity:.8}
.cat-meteo-map-card.mf-tdy-closed>:not(.mf-fold-h){display:none!important}
.cat-meteo-map-card.mf-tdy-closed .mf-tdy-sum{display:inline-flex}
/* 16-10 (Jaume: «que les propostes també es puguin plegar»): #todayOpportunitiesCard amb data-fold="opps" (el mateix sistema);
   plegada, el títol, el resum (quantes n'hi ha i la primera) i la fletxa; el «?», el dia i els botons s'amaguen */
.mf-opps-card[data-fold]>.mf-fold-h{cursor:pointer}
.mf-opps-card[data-fold] .mf-tdy-chev{flex:0 0 auto;width:.5rem;height:.5rem;margin:-.2rem .35rem 0 .5rem;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);transition:transform .2s ease;opacity:.8}
.mf-opps-card.mf-tdy-closed>:not(.mf-fold-h){display:none!important}
.mf-opps-card.mf-tdy-closed .mf-tdy-sum{display:inline-flex}
.mf-opps-card.mf-tdy-closed .mf-tdy-chev{transform:rotate(-45deg)}
.mf-opps-card.mf-tdy-closed .mf-opps-help,.mf-opps-card.mf-tdy-closed .mf-opps-daysel,.mf-opps-card.mf-tdy-closed .mf-opps-btnrow{display:none!important}
.mf-opps-card.mf-tdy-closed>.mf-opps-head{margin-bottom:0}
/* 16-10 (Jaume: «les propostes també s'haurien de plegar»: ja es plegaven, però la fletxa petita del títol no es veia): oberta, un
   botó rodó «Plega» a la dreta de tot de la capçalera (fa clic al títol); plegada, la fletxa de sempre */
.mf-opps-fold{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;margin-left:auto;padding:0;border-radius:50%;border:1px solid var(--border);background:var(--card-2);color:var(--text);cursor:pointer;touch-action:manipulation}
.mf-opps-fold svg{width:18px;height:18px}
.mf-opps-fold:hover{background:var(--card)}
.mf-opps-card:not(.mf-tdy-closed) .mf-tdy-chev{display:none}
.mf-opps-card.mf-tdy-closed .mf-opps-fold{display:none!important}
.cat-meteo-map-card.mf-tdy-closed>.mf-fold-h .mf-tdy-chev{transform:rotate(-45deg);margin-left:.5rem;margin-top:0}
.cat-meteo-map-card.mf-tdy-closed>.mf-fold-h h3{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:0 1 auto;margin:0}
/* 13-10 (Jaume: «totes les caixes amb la mateixa alçada i més compactes»): plegades, totes igual (~50 px) i les separacions iguals */
.today-grid .today-card.mf-tdy.mf-tdy-closed,.cat-meteo-map-card.mf-tdy-closed,#satRadarCard:has(#satRadarBody[hidden]),#todayGalleryShowcase:has(#tgBody[style*="none"]){padding:.6rem 1rem!important;height:3.2rem;overflow:hidden}
.today-grid .today-card.mf-tdy.mf-tdy-closed>h3,.cat-meteo-map-card.mf-tdy-closed>.mf-fold-h,#satRadarCard:has(#satRadarBody[hidden])>h3,#todayGalleryShowcase:has(#tgBody[style*="none"])>h2{min-height:2rem;margin:0!important}
.container .today-grid{margin-top:0;gap:.9rem}
body #tab-today{row-gap:.9rem}   /* 13-10: el mateix espai entre totes les caixes de l'inici (abans 24 px fora de les graelles i 14 a dins) */   /* plegada, el resum té prioritat (la «i» torna en obrir-la) */
/* targetes estretes (4 columnes a l'ordinador, mòbils petits): plegada, només la icona i el resum */
@container (max-width:300px){ .mf-tdy.mf-tdy-closed>h3 .mf-tdy-ht{display:none} .mf-tdy-sum{font-size:.82rem;gap:.25rem} .mf-tdy-sum .mf-sum-x{display:none} }
/* 16-10 (Jaume: «a la pantalla gran no es veuen els títols de Meteo, Dia, Nit i Cel profund fins que cliques»): a l'ordinador, plegades
   i estretes, en dues línies a la mateixa alçada: el títol petit a dalt i el resum a sota, al costat de la icona (al mòbil, els quadrats) */
@media (min-width:701px){ @container (max-width:300px){
  .today-grid .today-card.mf-tdy.mf-tdy-closed>h3{display:grid;grid-template-columns:auto minmax(0,1fr) auto;column-gap:.6rem;row-gap:.12rem;align-items:center}
  .mf-tdy.mf-tdy-closed>h3 .mf-tdy-hi{grid-column:1;grid-row:1/3}
  .mf-tdy.mf-tdy-closed>h3 .mf-tdy-ht{display:block;grid-column:2;grid-row:1;font-size:.66rem;line-height:1.1}
  .mf-tdy.mf-tdy-closed>h3 .mf-tdy-sum{grid-column:2;grid-row:2;justify-self:start;margin-left:0;max-width:100%;font-size:.8rem;line-height:1.15}
  .mf-tdy.mf-tdy-closed>h3 .mf-tdy-chev{grid-column:3;grid-row:1/3;margin:0 .25rem 0 .3rem!important}
} }
.mf-tip-pop[data-tip="stars_kpi"]{white-space:pre-line;line-height:1.45}   /* 12-10: l'explicació dels KPI d'estrelles, en línies */
/* 16-10 (Jaume: «les caixes horitzontals de l'inici del mode complet, més maco botons quadrats i dos per fila»): al mòbil, les caixes
   PLEGADES són quadrats (icona, títol i resum), 2 per fila; en obrir-ne una ocupa tota l'amplada al seu lloc. #tab-today és una
   graella de 2 columnes (dense: els quadrats s'aparellen) i .today-grid fa display:contents perquè Dia, Nit, Cel profund, Meteo i
   Estrelles en siguin peces directes. A l'ordinador, com sempre */
@media (max-width:700px){
  body #tab-today.active{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-flow:row;gap:.55rem}   /* 16-10: 3 per fila (abans 2); sense dense: cada caixa al seu lloc de l'ordre (Jaume), encara que quedi un forat */
  body #tab-today>*{grid-column:1/-1;min-width:0}
  body #tab-today>.today-grid{display:contents}
  body #tab-today>.today-grid>*{grid-column:1/-1;min-width:0;margin:0}
  body #tab-today .mf-tdy-closed,body #tab-today>#satRadarCard:has(#satRadarBody[hidden]),body #tab-today>#todayGalleryShowcase:has(#tgBody[style*="none"]){grid-column:auto!important;aspect-ratio:1/1;height:auto!important;min-height:0;margin:0!important;padding:.85rem .9rem!important;overflow:hidden;display:flex;flex-direction:column}
  /* Dia, Nit, Cel profund, Meteo i Estrelles: icona i fletxa a dalt, el títol i el resum a sota */
  body #tab-today .mf-tdy.mf-tdy-closed>h3{flex-wrap:wrap;align-items:flex-start;align-content:flex-start;row-gap:.5rem;min-height:0}
  body #tab-today .mf-tdy.mf-tdy-closed>h3 .mf-tdy-hi .mf-ico{width:34px;height:34px;border-radius:9px}
  body #tab-today .mf-tdy.mf-tdy-closed>h3 .mf-tdy-chev{order:1;margin:.35rem .25rem 0 auto!important}
  body #tab-today .mf-tdy.mf-tdy-closed>h3 .mf-tdy-ht{order:2;flex:1 1 100%;display:block!important;overflow:visible;white-space:normal;text-overflow:clip;line-height:1.25}
  body #tab-today .mf-tdy.mf-tdy-closed>h3 .mf-tdy-sum{order:3;flex:1 1 100%;max-width:100%;margin:0;flex-wrap:wrap;row-gap:.25rem;white-space:normal;font-size:.9rem;line-height:1.3}
  /* Propostes i el mapa de Catalunya: el títol a dalt (fins a 3 línies), la fletxa a la dreta i el resum a sota */
  body #tab-today .mf-tdy-closed>.mf-fold-h,body #tab-today .mf-opps-card.mf-tdy-closed .mf-opps-title-wrap{flex-wrap:wrap;align-items:flex-start;align-content:flex-start;row-gap:.45rem;min-height:0}
  body #tab-today .mf-tdy-closed>.mf-fold-h h3,body #tab-today .mf-opps-card.mf-tdy-closed #mfOppsTitle{flex:1 1 calc(100% - 1.6rem);min-width:0;margin:0;white-space:normal;overflow:hidden;text-overflow:clip;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;font-size:1rem;line-height:1.25}
  body #tab-today .mf-tdy-closed .mf-tdy-chev{order:1;margin:.35rem .25rem 0 auto!important}
  body #tab-today .mf-tdy-closed>.mf-fold-h .mf-tdy-sum,body #tab-today .mf-opps-card.mf-tdy-closed .mf-tdy-sum{order:2;flex:1 1 100%;max-width:100%;margin:0;flex-wrap:wrap;white-space:normal;font-size:.9rem;line-height:1.3}
  /* Satèl·lit i radar, i Fotos de la comunitat: el títol en dues línies si cal */
  body #tab-today>#satRadarCard:has(#satRadarBody[hidden])>h3,body #tab-today>#todayGalleryShowcase:has(#tgBody[style*="none"])>h2{flex-wrap:wrap;align-items:flex-start;white-space:normal;line-height:1.25;padding-right:1.4rem}
  body #tab-today>#satRadarCard:has(#satRadarBody[hidden]),body #tab-today>#todayGalleryShowcase:has(#tgBody[style*="none"]){position:relative}
  body #tab-today #satRadarArrow,body #tab-today #tgCaret{position:absolute;top:.95rem;right:1rem}   /* la fletxa a dalt a la dreta, com a les altres */
  body #tab-today .mf-tdy-closed>.mf-fold-h .mf-tdy-sum,body #tab-today .mf-opps-card.mf-tdy-closed .mf-tdy-sum{display:block}   /* el resum com un text seguit */
  /* 16-10 (Jaume: «posa'n 3 per fila»): quadrats de ~110 px: menys marge, lletra més petita i com a molt unes línies de títol i resum */
  body #tab-today .mf-tdy-closed,body #tab-today>#satRadarCard:has(#satRadarBody[hidden]),body #tab-today>#todayGalleryShowcase:has(#tgBody[style*="none"]){padding:.6rem .6rem!important;border-radius:16px!important}
  body #tab-today .mf-tdy.mf-tdy-closed>h3{row-gap:.3rem}
  body #tab-today .mf-tdy.mf-tdy-closed>h3 .mf-tdy-hi .mf-ico{width:28px;height:28px;border-radius:8px}
  body #tab-today .mf-tdy.mf-tdy-closed>h3 .mf-tdy-ht{font-size:.62rem;letter-spacing:.04em;display:-webkit-box!important;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  body #tab-today .mf-tdy.mf-tdy-closed>h3 .mf-tdy-sum{font-size:.74rem;max-height:3.9em;overflow:hidden}
  body #tab-today .mf-tdy.mf-tdy-closed>h3 .mf-tdy-sum .mf-ico{width:13px!important;height:13px!important}
  body #tab-today .mf-tdy-closed .mf-tdy-chev{width:.4rem;height:.4rem;margin:.3rem .1rem 0 auto!important}
  body #tab-today .mf-tdy-closed>.mf-fold-h h3,body #tab-today .mf-opps-card.mf-tdy-closed #mfOppsTitle{flex-basis:calc(100% - 1rem);font-size:.8rem;-webkit-line-clamp:3}
  body #tab-today .mf-tdy-closed>.mf-fold-h .mf-tdy-sum,body #tab-today .mf-opps-card.mf-tdy-closed .mf-tdy-sum{font-size:.72rem;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  body #tab-today>#satRadarCard:has(#satRadarBody[hidden])>h3,body #tab-today>#todayGalleryShowcase:has(#tgBody[style*="none"])>h2{font-size:.82rem!important;padding-right:.9rem}
  body #tab-today #satRadarArrow,body #tab-today #tgCaret{top:.6rem;right:.6rem}
}
.mf-tdk-h .mf-info{flex:0 0 auto}
.mf-sk-lp{display:flex;align-items:center;gap:.25rem;margin-top:.12rem;font-size:.66rem;font-weight:500;color:var(--muted)}
.mf-sk-lp i{width:.55rem;height:.55rem;border-radius:50%;flex:0 0 auto;box-shadow:0 0 0 1px rgba(127,127,127,.35)}
.mf-sk-n{display:flex;flex-direction:column;justify-content:center}
.mf-sk-nm{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mf-tdk{display:flex;flex-direction:column;min-width:0;background:var(--tdy-tile);border-radius:14px;padding:.6rem .65rem .6rem}
.mf-tdk-h{display:flex;align-items:center;gap:.35rem;font-size:.72rem;font-weight:600;line-height:1.15;color:var(--muted)}
.mf-tdk-h>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mf-tdk-h .mf-ico{width:20px;height:20px;border-radius:6px;box-shadow:none}
.mf-tdk-h .mf-tdy-icw{width:20px;font-size:.95rem}
.mf-tdk-v{margin-top:.4rem;font-size:1.35rem;font-weight:600;line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--text)}
.mf-tdk-bar{margin-top:.45rem;height:4px;border-radius:999px;background:var(--tdy-track);overflow:hidden}
.mf-tdk-bar i{display:block;height:100%;border-radius:999px;background:var(--kpi-fg)}
.mf-tdk-s{margin-top:.3rem;font-size:.68rem;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mf-tdk-s svg{width:.95em;height:.95em;margin-right:.15em;vertical-align:-.12em}
.mf-tdk-main{background:var(--kpi-bg)}
.mf-tdk-main .mf-tdk-v{font-size:1.95rem;font-weight:700;color:var(--kpi-fg)}
.mf-tdk-main .mf-tdk-h{color:var(--text)}
/* targeta «Estrelles i Via Làctia»: el today-grid d'una columna li dona l'estil mf-tdy */
.today-grid.mf-sky-grid{grid-template-columns:1fr}
.mf-sk-ex{margin:-.35rem 0 .75rem;font-size:.8rem;line-height:1.35;color:var(--muted)}
.mf-sk-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.mf-sk{min-width:296px}
.mf-sk-r{position:relative;display:grid;grid-template-columns:minmax(104px,1.7fr) repeat(5,minmax(37px,1fr));align-items:center;column-gap:.2rem;min-height:52px;padding:.3rem 0}
.mf-sk-r+.mf-sk-r::before{content:'';position:absolute;top:0;left:0;right:0;border-top:1px solid var(--tdy-sep)}
.mf-sk-hd{min-height:0;padding:0 0 .45rem}
.mf-sk-c{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.18rem;min-width:0}
.mf-sk-hd .mf-sk-c{gap:.08rem;font-size:.66rem;line-height:1.15;color:var(--muted);text-transform:capitalize}
.mf-sk-hd .mf-sk-c b{font-size:.92rem;font-weight:600;color:var(--text);font-variant-numeric:tabular-nums}
.mf-sk-hd .mf-sk-l{align-items:flex-start;justify-content:flex-end;align-self:end;text-transform:none}
.mf-sk-hd .mf-sk-today b{color:var(--kpi-good)}
.mf-sk-mo{display:inline-flex;align-items:center;gap:.12rem;margin-top:.1rem;font-weight:600;font-variant-numeric:tabular-nums;color:var(--kpi-fg)}
.mf-sk-mo svg,.mf-sk-cl svg{width:.95em;height:.95em;flex:0 0 auto}
.mf-sk-n{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.88rem;font-weight:500;color:var(--text)}
.mf-sk-p{display:inline-flex;align-items:center;justify-content:center;min-width:2.2em;padding:.2rem .4rem;border-radius:999px;font-size:.86rem;font-weight:700;line-height:1.1;font-variant-numeric:tabular-nums;background:var(--kpi-bg);color:var(--kpi-fg)}
.mf-sk-cl{display:inline-flex;align-items:center;gap:.12rem;font-size:.64rem;line-height:1;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.mf-sk-na{font-size:.9rem;color:var(--muted)}
/* 13-10 (Jaume): cada casella és un botó que obre el simulador (mfStarsSim); les 3 millors fan pampallugues amb un anell:
   la 1a en verd i la 2a i la 3a en blau (vermell: rosa clar i rosa fosc). Plegada, el resum porta «▶ Simula» (.mf-sk-go) */
.today-grid .today-card.mf-sky-card{--sk-1:#34c759;--sk-1g:rgba(52,199,89,.45);--sk-2:#007aff;--sk-2g:rgba(0,122,255,.38)}
[data-theme="dark"] .today-grid .today-card.mf-sky-card{--sk-1:#30d158;--sk-1g:rgba(48,209,88,.5);--sk-2:#0a84ff;--sk-2g:rgba(10,132,255,.5)}
html.mf-red .today-grid .today-card.mf-sky-card{--sk-1:#ffd6d6;--sk-1g:rgba(255,214,214,.45);--sk-2:#c07878;--sk-2g:rgba(192,120,120,.4)}
.mf-sk-b{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.18rem;width:100%;min-width:0;margin:0;padding:.2rem 0;border:0;border-radius:10px;background:none;color:inherit;font:inherit;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;transition:background-color .15s}
.mf-sk-b:active{background:var(--tdy-track)}
@media (hover:hover){.mf-sk-b:hover{background:var(--tdy-tile)}}
.mf-sk-b:focus-visible{outline:2px solid var(--sk-2);outline-offset:-2px}
.mf-sk-top1{--sk-c:var(--sk-1);--sk-g:var(--sk-1g)}
.mf-sk-top2,.mf-sk-top3{--sk-c:var(--sk-2);--sk-g:var(--sk-2g)}
.mf-sk-top .mf-sk-p{box-shadow:0 0 0 2px var(--sk-c),0 0 8px 1px var(--sk-g)}
.mf-sk-top.mf-sk-blink .mf-sk-p{animation:mfSkBlink 1.3s ease-in-out infinite}   /* 16-10: pampallugues només si la casella passa de 80 (mf-sk-blink, _mfStarsTable) */
@keyframes mfSkBlink{50%{box-shadow:0 0 0 2px transparent,0 0 0 0 transparent}}
@media (prefers-reduced-motion:reduce){.mf-sk-top.mf-sk-blink .mf-sk-p{animation:none}}
.mf-sk-lg{display:inline-flex;align-items:center;gap:.3rem;white-space:nowrap}
.mf-sk-lg i{display:inline-block;width:.55rem;height:.55rem;margin-left:.2rem;border-radius:50%;box-shadow:0 0 0 2px var(--sk-1)}
.mf-sk-lg i.mf-sk-lg2{margin-left:.45rem;box-shadow:0 0 0 2px var(--sk-2)}
.mf-tdy-sum .mf-sk-sn{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis}
.mf-tdy-sum .mf-sk-sd{flex:0 0 auto;color:var(--muted)}
.mf-tdy-sum b.mf-sk-p{flex:0 0 auto}
.mf-sk-go{flex:0 0 auto;display:inline-flex;align-items:center;gap:.25rem;margin-left:.15rem;padding:.3rem .62rem;border:0;border-radius:999px;background:var(--sk-2);color:#fff;font:inherit;font-size:.8rem;font-weight:600;line-height:1;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.mf-sk-go svg{width:.85em;height:.85em;flex:0 0 auto}
.mf-sk-go:active{opacity:.7}
.mf-sk-gl{display:none}
@container (min-width:560px){ .mf-tdy-sum .mf-sk-gs{display:none} .mf-tdy-sum .mf-sk-gl{display:inline} }   /* targeta ampla: «Simula la Via Làctia» */
html.mf-red .mf-sk-go{background:rgba(255,214,214,.2);color:#ffd6d6}
@container (max-width:300px){
  .mf-tdk-h{flex-direction:column;align-items:flex-start;gap:.3rem}
  .mf-tdk{padding:.55rem .55rem .55rem}
  .mf-tdk-main .mf-tdk-v{font-size:1.7rem}
}
/* targeta estreta (mòbil petit, escriptori a 4 columnes): a les files, el nom a dalt (petit) i les hores a sota */
@container (max-width:300px){
  .mf-tdy-row{display:grid;grid-template-columns:28px 1fr;column-gap:.7rem;row-gap:.1rem;align-items:center}
  .mf-tdy-row .mf-ico{grid-row:1 / span 2}
  .mf-tdy-rl{font-size:.78rem;font-weight:500;color:var(--muted)}
  .mf-tdy-rv{text-align:left;font-size:1rem}
}
@container (max-width:250px){
  .mf-tdy-big{font-size:1.45rem}
  .mf-tdy-cell,.mf-tdy-ml{padding:.6rem .6rem .6rem}
  .mf-tdy-ch{font-size:.74rem;gap:.35rem}
  .mf-tdy-ch .mf-ico{width:22px;height:22px;border-radius:6px}
  .mf-tdy-moon{gap:.7rem}
  .mf-tdy-moon>svg{width:54px;height:54px}
}
.today-big{font-size:2rem;font-weight:800;color:var(--accent);line-height:1;margin:0.3rem 0 0.1rem}
.today-tag{display:inline-block;padding:0.2rem 0.55rem;border-radius:0.5rem;font-size:0.78rem;font-weight:700;margin-right:0.3rem;margin-top:0.2rem}
.today-tag.success{background:var(--success-bg);color:var(--success)}
.today-tag.warn{background:var(--uncertain-bg);color:var(--uncertain-text)}
.today-tag.danger{background:var(--error-bg);color:var(--danger)}
.today-tag.info{background:var(--info-bg);color:var(--info)}
.today-tag.fmd{background:linear-gradient(135deg,rgba(250,204,21,0.45),rgba(251,146,60,0.40));color:#92400e;border:1px solid rgba(245,158,11,0.7);animation:fmdPulse 1.4s ease-in-out infinite}
[data-theme="dark"] .today-tag.fmd{color:#fde68a;background:linear-gradient(135deg,rgba(250,204,21,0.32),rgba(251,146,60,0.25));border-color:rgba(250,204,21,0.7)}
/* Bloc gran al modal openDayPlansModal */
.fmd-modal-block{background:linear-gradient(135deg,rgba(250,204,21,0.30),rgba(251,146,60,0.25));border:2px solid rgba(245,158,11,0.7);animation:fmdPulseStrong 1.4s ease-in-out infinite;position:relative;overflow:hidden}
@keyframes fmdPulseStrong{
  0%,100%{
    box-shadow:0 0 14px rgba(250,204,21,0.5), 0 0 28px rgba(251,146,60,0.30);
    border-color:rgba(245,158,11,0.6);
  }
  50%{
    box-shadow:0 0 30px rgba(250,204,21,1), 0 0 55px rgba(251,146,60,0.75), 0 0 80px rgba(245,158,11,0.45);
    border-color:rgba(245,158,11,1);
  }
}
[data-theme="dark"] .fmd-modal-block{background:linear-gradient(135deg,rgba(250,204,21,0.22),rgba(251,146,60,0.18));border-color:rgba(250,204,21,0.7)}
.today-action{display:flex;align-items:flex-start;gap:0.6rem;padding:0.55rem 0;font-size:0.88rem;line-height:1.4}
.today-action .ico{flex-shrink:0;font-size:1.1rem}
.today-action strong{color:var(--text)}
.today-summary-banner{background:linear-gradient(135deg,rgba(22,138,173,0.18),rgba(125,196,216,0.1));border-radius:0.7rem;padding:0.9rem 1.1rem;font-size:0.92rem;color:var(--text);border-left:4px solid var(--accent)}

/* ===== MAPA METEO CATALUNYA ===== */
.cat-meteo-map-card{padding:0.7rem 0.9rem !important}
/* ===== 🔭 OPORTUNITATS FOTOGRÀFIQUES (Avui) ===== */
.mf-opps-card{background:linear-gradient(135deg,rgba(139,92,246,0.12),rgba(6,182,212,0.08));border-left:4px solid #8b5cf6;padding:0.8rem 0.95rem !important}
.mf-opps-head{display:flex;align-items:center;justify-content:space-between;gap:0.5rem;row-gap:0.4rem;flex-wrap:wrap;margin-bottom:0.55rem}
.mf-opps-head h3{margin:0;font-size:1.02rem;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mf-opps-geo{background:rgba(255,255,255,0.09);border:1px solid rgba(255,255,255,0.2);color:inherit;border-radius:0.5rem;padding:0.32rem 0.6rem;cursor:pointer;font-size:0.8rem;font-weight:600;white-space:nowrap;transition:background 0.15s}
.mf-opps-btnrow{display:flex;gap:0.4rem;align-items:center;flex-wrap:wrap;position:relative}
#mfOppsPrefBtn{border-color:rgba(245,197,66,0.55);max-width:11rem;overflow:hidden;text-overflow:ellipsis}
.mf-opps-mini{padding:0.32rem 0.45rem;font-size:0.85rem;line-height:1}
.mf-opps-pref-pop{position:absolute;top:calc(100% + 0.35rem);right:0;z-index:60;min-width:13rem;max-width:min(19rem,calc(100vw - 2rem));max-height:15rem;overflow-y:auto;-webkit-overflow-scrolling:touch;background:var(--card,#141A2E);border:1px solid var(--border,rgba(255,255,255,0.18));border-radius:0.7rem;box-shadow:0 12px 34px rgba(0,0,0,0.5);padding:0.3rem}
.mf-opps-pref-pop[hidden]{display:none}
.mf-opps-pref-pop .ttl{font-size:0.72rem;font-weight:800;color:var(--muted,#93A0B5);padding:0.3rem 0.55rem 0.2rem;text-transform:uppercase;letter-spacing:0.04em}
.mf-opps-pref-pop button{display:flex;align-items:center;gap:0.45rem;width:100%;text-align:left;background:none;border:none;color:inherit;font-size:0.85rem;padding:0.4rem 0.55rem;border-radius:0.45rem;cursor:pointer}
.mf-opps-pref-pop button:hover{background:rgba(139,92,246,0.22)}
.mf-opps-pref-pop button.cur{background:rgba(245,197,66,0.16);font-weight:700;cursor:default}
.mf-opps-geo:hover{background:rgba(255,255,255,0.18)}
.mf-opps-title-wrap{display:flex;align-items:center;gap:0.35rem;min-width:0;flex:1 1 auto}
.mf-opps-help{flex:0 0 auto;width:1.2rem;height:1.2rem;line-height:1.1rem;text-align:center;border-radius:50%;border:1px solid rgba(255,255,255,0.35);background:rgba(255,255,255,0.08);color:inherit;font-size:0.74rem;font-weight:700;cursor:pointer;padding:0;transition:background 0.15s}
.mf-opps-help:hover{background:rgba(255,255,255,0.22)}
.mf-opps-help[aria-expanded="true"]{background:rgba(255,255,255,0.3)}
.mf-opps-helpbox{background:rgba(0,0,0,0.28);border:1px solid rgba(255,255,255,0.18);border-radius:0.55rem;padding:0.6rem 0.7rem;margin:-0.1rem 0 0.55rem;font-size:0.82rem;line-height:1.5;color:var(--text)}
.mf-opps-helpbox strong{font-weight:700}
.mf-opps-filters{display:flex;flex-direction:column;gap:0.35rem;margin-bottom:0.5rem}
.mf-opps-chips{display:flex;flex-wrap:wrap;gap:0.3rem}
.mf-opp-chip{background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.18);color:inherit;border-radius:999px;padding:0.22rem 0.62rem;font-size:0.76rem;font-weight:600;cursor:pointer;white-space:nowrap;transition:background 0.15s,border-color 0.15s}
.mf-opp-chip:hover{background:rgba(255,255,255,0.16)}
.mf-opp-chip.active{background:rgba(139,92,246,0.35);border-color:rgba(139,92,246,0.7)}
.mf-opps-chips-loc .mf-opp-chip{font-weight:500;font-size:0.73rem;opacity:0.95}
.mf-opps-help.on{background:rgba(51,203,116,0.30);border-color:rgba(51,203,116,0.75)}
.mf-top-loc-big{font-weight:800;border-color:rgba(56,189,248,0.55)!important;background:rgba(56,189,248,0.08)}
.mf-top-bell{border-color:rgba(251,191,36,0.55)!important}
.mf-top-bell.mf-bell-on{border-color:rgba(51,203,116,0.8)!important;background:rgba(51,203,116,0.14);color:#34cb74;font-weight:800}
.mf-wx-bell{flex:0 0 auto;display:inline-flex;align-items:center;gap:0.3rem;border-radius:999px;border:1.5px solid rgba(251,191,36,0.55);background:rgba(251,191,36,0.10);color:inherit;font-size:0.78rem;font-weight:700;padding:0.24rem 0.7rem;cursor:pointer;white-space:nowrap;transition:background 0.15s,border-color 0.15s}
.mf-wx-bell:hover{background:rgba(251,191,36,0.22)}
.mf-wx-bell.on{border-color:rgba(51,203,116,0.8);background:rgba(51,203,116,0.22)}
.mf-a2hs-ov{position:fixed;inset:0;background:rgba(5,8,16,0.72);z-index:100000;display:flex;align-items:center;justify-content:center;padding:1rem}
.mf-a2hs-card{background:#141A2E;border:1px solid rgba(255,255,255,0.18);border-radius:1rem;max-width:26rem;width:100%;padding:1.1rem 1.2rem;color:var(--text);box-shadow:0 12px 40px rgba(0,0,0,0.6);font-size:0.95rem;line-height:1.5}
.mf-a2hs-card h3{margin:0 0 0.5rem;font-size:1.05rem}
.mf-a2hs-steps{margin:0.6rem 0 0.2rem;padding-left:1.2rem}
.mf-a2hs-steps li{margin-bottom:0.4rem}
.mf-a2hs-note{color:#93A0B5;font-size:0.82rem;margin-top:0.45rem}
.mf-a2hs-social{color:#FBBF24;font-weight:700;font-size:0.86rem;margin-top:0.5rem}
.mf-users-badge{display:inline-flex;align-items:center;gap:0.4rem;padding:0.3rem 0.75rem;background:rgba(139,92,246,0.10);border:1px solid rgba(139,92,246,0.35);border-radius:999px;font-size:0.78rem;color:#C4B5FD;font-weight:600;letter-spacing:0.02em}
.mf-users-badge[hidden]{display:none}
.mf-chat-fab.off{opacity:0.82;filter:saturate(0.55)}
.mf-chat-tick{margin-left:0.3rem;font-size:0.72rem;letter-spacing:-0.12em;color:#93A0B5;font-weight:700}
.mf-chat-tick.read{color:#4FC3F7}
.mf-a2hs-btn.danger{background:#DC2626;border-color:#DC2626;color:#fff}
.mf-a2hs-btn.danger:hover{background:#B91C1C}
.mf-chat-fab.off:hover{opacity:1;filter:none}
.mf-proposal-pill{display:inline-flex;align-items:center;gap:0.35rem;padding:0.35rem 0.75rem;background:rgba(139,92,246,0.12);border:1px solid rgba(139,92,246,0.45);border-radius:999px;font-size:0.78rem;color:#C4B5FD;font-weight:600;letter-spacing:0.02em;cursor:pointer;transition:background 0.15s}
.mf-proposal-pill:hover{background:rgba(139,92,246,0.25)}
.mf-opp-plans{margin-left:0.4rem;font-size:0.72rem;font-weight:700;color:#FBBF24;background:rgba(251,191,36,0.12);border:1px solid rgba(251,191,36,0.4);border-radius:999px;padding:0.1rem 0.45rem;vertical-align:0.05rem;white-space:nowrap}
.mf-oppm-plan{margin-top:0.85rem;padding-top:0.75rem;border-top:1px solid rgba(255,255,255,0.12);display:flex;flex-direction:column;gap:0.55rem}
.mf-oppm-plan:empty{display:none}
.mf-oppm-plan-count{color:#FBBF24;font-weight:700;font-size:0.88rem}
.mf-oppm-plan-chk{display:flex;gap:0.5rem;align-items:flex-start;font-size:0.85rem;cursor:pointer}
.mf-oppm-plan-chk input{width:1rem;height:1rem;accent-color:#8B5CF6;margin-top:0.1rem;flex:0 0 auto}
.mf-oppm-plan-btn{align-self:flex-start;background:rgba(139,92,246,0.85);border:1px solid rgba(139,92,246,1);color:#fff;font-weight:700;border-radius:0.55rem;padding:0.5rem 0.95rem;cursor:pointer;transition:background 0.15s}
.mf-oppm-plan-btn:hover{background:rgba(139,92,246,1)}
.mf-oppm-plan-mine{color:#33CB74;font-weight:700;font-size:0.9rem}
.mf-oppm-plan-cancel{align-self:flex-start;background:transparent;border:1px solid rgba(255,255,255,0.3);color:inherit;border-radius:0.55rem;padding:0.42rem 0.85rem;cursor:pointer;font-size:0.85rem}
.mf-oppm-plan-login{color:#93A0B5;font-size:0.85rem}
.mf-oppm-plan-time{display:flex;gap:0.5rem;align-items:center;font-size:0.85rem}
.mf-oppm-plan-time input{margin-left:auto;background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.28);color:inherit;border-radius:0.45rem;padding:0.25rem 0.45rem;font:inherit}
.mf-chat-av{position:relative;overflow:hidden}
.mf-chat-av-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:inherit}
.mf-oppm-people{display:flex;flex-wrap:wrap;gap:0.4rem;align-items:center;margin-top:0.55rem}
.mf-oppm-people:empty{display:none}
.mf-oppm-people-t{flex:0 0 100%;font-size:0.82rem;font-weight:700;color:#93A0B5}
.mf-oppm-person{display:inline-flex;align-items:center;gap:0.4rem;border:1px solid rgba(255,255,255,0.22);background:rgba(255,255,255,0.06);color:inherit;border-radius:999px;padding:0.22rem 0.65rem 0.22rem 0.28rem;font-size:0.82rem;font-weight:600;cursor:pointer;transition:background 0.15s}
.mf-oppm-person:hover{background:rgba(139,92,246,0.22)}
.mf-oppm-person.self{opacity:0.65;cursor:default}
.mf-oppm-person .mf-chat-av{width:1.45rem;height:1.45rem;font-size:0.7rem;flex:0 0 auto}

/* ===== 🤖 Bot IA (beta, 24-09) — mateix racó que el 💬, just a sobre ===== */
/* 24-09: 📷 Equip (Compte → Equip) */
.mf-gear-cam{border:1px solid var(--border);border-radius:0.55rem;padding:0.6rem 0.7rem;margin:0.55rem 0;background:var(--card)}
.mf-gear-head{display:flex;align-items:flex-start;gap:0.4rem}
.mf-gear-head b{font-size:0.95rem}
.mf-gear-sub{font-size:0.76rem;color:var(--muted);margin-top:0.1rem}
.mf-gear-lens{display:flex;align-items:center;gap:0.35rem;padding:0.3rem 0 0.3rem 0.6rem;border-top:1px dashed var(--border);font-size:0.85rem}
.mf-gear-lens span.nm{flex:1;min-width:0}
.mf-gear-lens small{color:var(--muted)}
.mf-gear-ib{background:none;border:none;cursor:pointer;font-size:0.95rem;padding:0.15rem 0.25rem;color:inherit}
.mf-gear-ov{position:fixed;inset:0;z-index:100050;background:rgba(0,0,0,0.6);display:flex;align-items:center;justify-content:center;padding:16px}
.mf-gear-box{background:var(--card-2);color:var(--text);border:1px solid var(--border);border-radius:0.7rem;width:100%;max-width:460px;max-height:90vh;overflow:auto;padding:1rem;box-sizing:border-box}
.mf-gear-box label{display:block;font-size:0.8rem;font-weight:600;margin:0.55rem 0 0.2rem}
.mf-gear-box input[type=text],.mf-gear-box input[type=number],.mf-gear-box select{width:100%;box-sizing:border-box;padding:0.45rem 0.5rem;font-size:0.92rem;border:1px solid var(--border);border-radius:0.4rem;background:var(--card);color:var(--text)}
.mf-gear-box select:disabled,.mf-gear-box input:disabled{opacity:0.55;cursor:not-allowed;background:var(--card-2)}
.mf-gear-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:0.45rem}
.mf-gear-hint{font-size:0.75rem;color:var(--muted);margin-top:0.3rem;min-height:1em}
.mf-ai-fab{position:fixed;right:1rem;bottom:calc(4.9rem + env(safe-area-inset-bottom,0px));z-index:9990;width:3.2rem;height:3.2rem;border-radius:50%;border:1px solid rgba(56,189,248,0.7);background:linear-gradient(135deg,#0e4a63,#0b2a3d);color:#fff;font-size:1.4rem;cursor:pointer;box-shadow:0 6px 20px rgba(0,0,0,0.45);display:flex;align-items:center;justify-content:center;transition:transform 0.15s}
.mf-ai-fab:hover{transform:scale(1.06)}
.mf-ai-fab[hidden]{display:none}
.mf-ai-panel{position:fixed;right:1rem;bottom:calc(8.7rem + env(safe-area-inset-bottom,0px));z-index:9995;width:min(380px,calc(100vw - 2rem));height:min(520px,calc(100vh - 10rem));height:min(520px,calc(100dvh - 10rem));background:var(--card,#141A2E);border:1px solid var(--border,rgba(255,255,255,0.15));border-radius:1rem;box-shadow:0 16px 48px rgba(0,0,0,0.55);display:flex;flex-direction:column;overflow:hidden}
/* 25-09 (Jaume): finestra de benvinguda sòbria i professional — fons llis, un sol accent, sense degradats
   ni emojis, icones de traç fi. Els !important guanyen els estils en línia antics sense tocar-ne l'estructura. */
#modalWelcome.mfw{background:rgba(5,9,17,0.9)!important;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
#modalWelcome.mfw>.modal-box{max-width:460px!important;background:#0e1420!important;border:1px solid rgba(255,255,255,0.08)!important;border-radius:16px!important;box-shadow:0 24px 64px rgba(0,0,0,0.55)!important;padding:2rem 1.6rem 1.3rem!important;color:#e2e8f0}
#modalWelcome .mfw-logo img{width:56px!important;height:56px!important;border-radius:14px!important;box-shadow:none!important}
#modalWelcome .mfw-brand{font-size:1.55rem!important;font-weight:700!important;letter-spacing:-0.01em!important;margin:0.2rem 0 0!important}
#modalWelcome .mfw-brand span{color:#f1f5f9!important;opacity:1!important}
#modalWelcome [data-i18n="welcome.tagline"]{font-weight:500;color:#cbd5e1}
#modalWelcome [data-i18n="welcome.desc"],#modalWelcome [data-i18n="welcome.desc"] strong{color:#94a3b8!important;font-weight:400}
#modalWelcome #authTitle{font-size:1.05rem!important;font-weight:600!important;color:#f1f5f9;margin:0.6rem 0 0.2rem!important;letter-spacing:0}
#modalWelcome .auth-form{text-align:left}
#modalWelcome .auth-form .field label{font-size:0.8rem;color:#94a3b8;font-weight:500}
#modalWelcome .auth-form input[type=email],#modalWelcome .auth-form input[type=password]{background:#0a0f19!important;border:1px solid rgba(255,255,255,0.12)!important;border-radius:10px!important;color:#f1f5f9!important}
#modalWelcome .auth-form input:focus{border-color:#22d3ee!important;outline:none;box-shadow:0 0 0 3px rgba(34,211,238,0.15)!important}
#modalWelcome #authSubmitBtn{width:100%;background:#0e7490!important;color:#fff!important;border:none!important;border-radius:10px!important;font-weight:600!important;padding:0.75rem!important;box-shadow:none!important;background-image:none!important}
#modalWelcome #authSubmitBtn:hover{background:#0891b2!important}
#modalWelcome .toggle-mode,#modalWelcome .toggle-mode .btn-link,#modalWelcome #authClearAndType{font-size:0.82rem!important;color:#94a3b8!important}
#modalWelcome .btn-signup-hl{background:none!important;border:none!important;color:#22d3ee!important;font-weight:600!important;padding:0!important;box-shadow:none!important;animation:none!important;text-decoration:underline;text-underline-offset:3px}
#modalWelcome #authPwaWarning{background:rgba(245,158,11,0.08)!important;border:1px solid rgba(245,158,11,0.35)!important;color:#fcd34d!important;border-radius:10px!important}
#modalWelcome #authPwaResetBtn{background:transparent!important;color:#fcd34d!important;border:1px solid rgba(245,158,11,0.5)!important;font-weight:600!important}
#modalWelcome .auth-credit{font-size:0.74rem!important;color:#64748b!important}
#modalWelcome .auth-credit a{color:#94a3b8!important}
#modalWelcome #welcomeGuestBtn{background:#f1f5f9!important;background-image:none!important;color:#0e1420!important;box-shadow:none!important;border:none!important;border-radius:10px!important;font-size:0.98rem!important;font-weight:600!important;padding:0.8rem 1rem!important;margin-bottom:0.55rem!important}
#modalWelcome #welcomeGuestBtn:hover{background:#ffffff!important}
#modalWelcome #welcomeInstallBtn{background:transparent!important;border:1px solid rgba(255,255,255,0.14)!important;color:#cbd5e1!important;border-radius:10px!important;font-weight:500!important}
#modalWelcome .mfw-why{background:transparent!important;border:none!important;border-top:1px solid rgba(255,255,255,0.08)!important;border-radius:0!important;padding:1.1rem 0 0!important;margin-top:0.9rem!important}
#modalWelcome .mfw-why strong[data-i18n="welcome.why.title"]{color:#f1f5f9!important;font-weight:600}
#modalWelcome .mfw-why ul{padding-left:0!important}
#modalWelcome .mfw-why li{position:relative;padding-left:1.1rem;color:#cbd5e1}
#modalWelcome .mfw-why li::before{content:'';position:absolute;left:0.1rem;top:0.62em;width:5px;height:5px;border-radius:50%;background:#22d3ee}
#modalWelcome .mfw-why li strong{color:#f1f5f9;font-weight:600}
#modalWelcome .mfw-feat{gap:0.5rem!important}
#modalWelcome .mfw-feat>div{background:transparent!important;border:1px solid rgba(255,255,255,0.08)!important;border-radius:10px!important;padding:0.7rem!important;align-items:center!important}
#modalWelcome .mfw-feat>div div[data-i18n$=".title"]{color:#e2e8f0!important;font-weight:600!important}
#modalWelcome .mfw-ic{width:22px;height:22px;flex:0 0 22px;fill:none;stroke:#22d3ee;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
#modalWelcome #welcomeReloadBtn{color:#64748b!important;font-size:0.74rem!important}
.mf-ai-panel[hidden]{display:none}
/* 25-09: TOTA L'APP — sense zoom INVOLUNTARI, amb el zoom de pessic intacte (accessibilitat):
   1) manipulation = sense zoom de doble toc (Leaflet i Google Maps tenen regles pròpies més específiques i manen);
   2) iOS amplia sol els camps de <16px en tocar-los → 16px als camps (només iOS, @supports -webkit-touch-callout) */
*{touch-action:manipulation}
@supports (-webkit-touch-callout:none){@media (max-width:900px){
  /* 25-09: fora del simulador (#mfEclSim), que ja té el zoom bloquejat i uns desplegables compactes (Sol/Lluna) */
  input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=file]):not(#mfEclSim input),select:not(#mfEclSim select),textarea:not(#mfEclSim textarea){font-size:16px!important}
}}
/* 25-09: dins del xat no es pot ampliar pessigant ni amb doble toc (es pot desplaçar igual) */
.mf-ai-panel,.mf-ai-panel *{touch-action:pan-x pan-y}
/* 25-09: al mòbil, tot l'ample, de sota la capçalera (logo + ubicació) fins a baix; top i height els posa _aiFit() (teclat inclòs) */
@media (max-width:640px){.mf-ai-panel{left:0;right:0;width:auto;top:4.5rem;bottom:0;height:auto;border-radius:0.9rem 0.9rem 0 0;border-left:none;border-right:none;border-bottom:none;z-index:10050}
  .mf-ai-panel .mf-ai-inputrow{padding-bottom:calc(0.55rem + env(safe-area-inset-bottom,0px))}
  /* 25-09: iOS fa zoom a qualsevol camp de <16px en tocar-lo → l'ample es desmarxava */
  .mf-ai-panel .mf-ai-inputrow textarea{font-size:16px}
  .mf-ai-panel{max-width:100vw;box-sizing:border-box;overflow:hidden}
  .mf-ai-panel .mf-ai-msgs{overflow-x:hidden}
  /* amb el teclat obert el panell ocupa la zona visible sencera: sense cantonades */
  .mf-ai-panel.mf-ai-kb{border-radius:0.9rem 0.9rem 0 0}
  html.mf-ai-lock,html.mf-ai-lock body{overflow:hidden!important;overscroll-behavior:none}
  body.mf-ai-open .mf-ai-fab{display:none}}
.mf-ai-head{display:flex;align-items:center;gap:0.4rem;padding:0.6rem 0.8rem;background:rgba(56,189,248,0.14);border-bottom:1px solid var(--border,rgba(255,255,255,0.12));font-weight:800}
.mf-ai-title{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mf-ai-left{font-size:0.72rem;font-weight:700;color:var(--muted,#93A0B5);white-space:nowrap}
/* 24-09: comptador del mes + cost acumulat (petit) · botó Ko-fi · cost de cada resposta */
.mf-ai-meter{display:flex;flex-direction:column;align-items:flex-end;line-height:1.15}
.mf-ai-spent{font-size:0.62rem;font-weight:600;color:var(--muted,#93A0B5);white-space:nowrap;opacity:0.85}
.mf-ai-kofi{background:rgba(251,191,36,0.16);border:1px solid rgba(251,191,36,0.55);color:#fcd34d;border-radius:999px;font-size:0.7rem;font-weight:800;padding:0.12rem 0.5rem;cursor:pointer;white-space:nowrap}
.mf-ai-scen .mf-ai-act-btns button.on{background:rgba(45,212,191,0.4)}
.mf-ai-scen-card .camera-preset-card{margin:0;max-width:100%;box-sizing:border-box;white-space:normal;cursor:auto}
.mf-ai-bub{cursor:copy;-webkit-tap-highlight-color:transparent;transition:box-shadow .2s}
.mf-ai-bub.mf-ai-copied{box-shadow:0 0 0 2px rgba(56,189,248,0.8)}
.mf-ai-cost{margin-left:auto;align-self:center;font-size:0.66rem;color:var(--muted,#93A0B5);opacity:0.8;white-space:nowrap}
.mf-ai-hbtn{background:none;border:none;color:inherit;font-size:1.15rem;cursor:pointer;line-height:1;padding:0 0.2rem}
#mfAiCloseBtn{font-size:1.9rem;min-width:2.4rem;min-height:2.4rem;padding:0 0.3rem;margin:-0.35rem -0.35rem -0.35rem 0.1rem;display:inline-flex;align-items:center;justify-content:center;border-radius:50%}   /* 25-09: × més gran (dit) */
#mfAiCloseBtn:active{background:rgba(255,255,255,0.12)}
.mf-ai-msgs{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:0.7rem;display:flex;flex-direction:column;gap:0.4rem;background:rgba(0,0,0,0.15)}
.mf-ai-bub{max-width:86%;padding:0.5rem 0.7rem;border-radius:0.75rem;font-size:0.88rem;line-height:1.4;word-wrap:break-word;white-space:pre-wrap;position:relative}
.mf-ai-u{align-self:flex-end;background:#0e4a63;color:#fff;border-bottom-right-radius:0.25rem}
.mf-ai-a{align-self:flex-start;background:var(--card-2,rgba(255,255,255,0.07));border:1px solid var(--border,rgba(255,255,255,0.1));border-bottom-left-radius:0.25rem;padding-right:1.9rem}
.mf-ai-s{align-self:center;max-width:94%;background:none;color:var(--muted,#93A0B5);font-size:0.8rem;text-align:center}
.mf-ai-wait{animation:mfAiPulse 1.2s ease-in-out infinite;display:inline-flex;align-items:center;gap:0.45rem}
.mf-ai-spin{display:inline-block;font-size:1.25rem;line-height:1;animation:mfAiSpin 1.1s linear infinite;transform-origin:50% 55%}
@keyframes mfAiSpin{to{transform:rotate(360deg)}}
@keyframes mfAiPulse{0%,100%{opacity:0.45}50%{opacity:1}}
.mf-ai-say{position:absolute;right:0.3rem;bottom:0.25rem;background:none;border:none;cursor:pointer;font-size:0.85rem;opacity:0.65;padding:0}
.mf-ai-say:hover{opacity:1}
.mf-ai-rate{display:flex;gap:0.3rem;margin-top:0.35rem}
.mf-ai-act{margin-top:0.5rem;padding:0.5rem 0.6rem;border-radius:0.6rem;border:1px solid rgba(45,212,191,0.45);background:rgba(45,212,191,0.08);font-size:0.8rem;line-height:1.45;white-space:normal}
.mf-ai-act-btns{display:flex;flex-wrap:wrap;gap:0.35rem;margin-top:0.45rem}
.mf-ai-act-btns button{border:1px solid rgba(45,212,191,0.7);background:rgba(45,212,191,0.16);color:inherit;border-radius:999px;padding:0.3rem 0.65rem;font-size:0.78rem;font-weight:700;cursor:pointer}
.mf-ai-act-btns button:hover{background:rgba(45,212,191,0.3)}
.mf-ai-rate button{background:none;border:1px solid transparent;border-radius:999px;cursor:pointer;font-size:0.8rem;padding:0 0.3rem;opacity:0.5;line-height:1.5}
.mf-ai-rate button:hover{opacity:0.9}
.mf-ai-rate button.on{opacity:1;border-color:rgba(56,189,248,0.6);background:rgba(56,189,248,0.12)}
.mf-ai-inputrow{display:flex;gap:0.4rem;align-items:flex-end;padding:0.55rem;border-top:1px solid var(--border,rgba(255,255,255,0.1))}
.mf-ai-inputrow textarea{flex:1;min-width:0;resize:none;max-height:6rem;padding:0.5rem 0.6rem;border-radius:0.6rem;border:1px solid var(--border,rgba(255,255,255,0.15));background:var(--card-2,rgba(255,255,255,0.05));color:var(--text,#EEF3FA);font:inherit;font-size:0.9rem}
.mf-ai-inputrow button{flex:0 0 auto;width:2.5rem;height:2.5rem;border-radius:50%;border:none;background:#0e7490;color:#fff;font-size:1.05rem;cursor:pointer}
.mf-ai-inputrow .mf-ai-mic{background:rgba(255,255,255,0.1)}
.mf-ai-inputrow .mf-ai-mic.on{background:#dc2626;animation:mfAiPulse 1s ease-in-out infinite}

/* ===== 💬 Xat entre usuaris ===== */
.mf-chat-fab{position:fixed;right:1rem;bottom:calc(1rem + env(safe-area-inset-bottom,0px));z-index:9990;width:3.2rem;height:3.2rem;border-radius:50%;border:1px solid rgba(139,92,246,0.7);background:linear-gradient(135deg,#3B2F63,#241d43);color:#fff;font-size:1.35rem;cursor:pointer;box-shadow:0 6px 20px rgba(0,0,0,0.45);display:flex;align-items:center;justify-content:center;transition:transform 0.15s}
.mf-chat-fab:hover{transform:scale(1.06)}
.mf-chat-fab[hidden]{display:none}
.mf-chat-fab-badge{position:absolute;top:-4px;right:-4px;min-width:1.15rem;height:1.15rem;border-radius:999px;background:#F05561;color:#fff;font-size:0.68rem;font-weight:800;display:flex;align-items:center;justify-content:center;padding:0 0.25rem;border:2px solid #241d43}
.mf-chat-fab-badge[hidden]{display:none}
.mf-chat-panel{position:fixed;right:1rem;bottom:calc(4.8rem + env(safe-area-inset-bottom,0px));z-index:9995;width:min(380px,calc(100vw - 2rem));height:min(560px,calc(100vh - 7rem));height:min(560px,calc(100dvh - 7rem));background:var(--card,#141A2E);border:1px solid var(--border,rgba(255,255,255,0.15));border-radius:1rem;box-shadow:0 16px 48px rgba(0,0,0,0.55);display:flex;flex-direction:column;overflow:hidden}
.mf-chat-panel[hidden]{display:none}
@media (max-width:640px){.mf-chat-panel{right:0.5rem;left:0.5rem;width:auto;bottom:calc(4.6rem + env(safe-area-inset-bottom,0px));height:min(70vh,560px);height:min(78dvh,560px)}}
@media (max-width:380px){.mf-chat-inputrow{padding:0.45rem}.mf-chat-inputrow button{width:2.3rem}.mf-chat-head{padding:0.55rem 0.7rem}.mf-chat-conv-head{padding:0.45rem 0.5rem;gap:0.35rem}}
.mf-chat-head{display:flex;align-items:center;justify-content:space-between;padding:0.65rem 0.9rem;background:rgba(139,92,246,0.16);border-bottom:1px solid var(--border,rgba(255,255,255,0.12));font-weight:800}
.mf-chat-x{background:none;border:none;color:inherit;font-size:1.3rem;cursor:pointer;line-height:1;padding:0 0.2rem}
.mf-chat-tabs{display:flex;border-bottom:1px solid var(--border,rgba(255,255,255,0.1))}
.mf-chat-tabs button{flex:1;background:none;border:none;color:var(--muted,#93A0B5);font-weight:700;font-size:0.85rem;padding:0.55rem;cursor:pointer;border-bottom:2px solid transparent}
.mf-chat-tabs button.active{color:var(--text,#EEF3FA);border-bottom-color:#8B5CF6}
.mf-chat-list{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch}
.mf-chat-item{display:flex;gap:0.6rem;align-items:center;padding:0.6rem 0.8rem;cursor:pointer;border-bottom:1px solid rgba(255,255,255,0.05)}
.mf-chat-item:hover{background:rgba(255,255,255,0.05)}
.mf-chat-av{flex:0 0 auto;width:2.3rem;height:2.3rem;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;color:#fff;font-size:0.95rem}
.mf-chat-item-main{flex:1;min-width:0}
.mf-chat-item-name{font-weight:700;font-size:0.9rem;display:flex;align-items:center;gap:0.35rem}
.mf-chat-item-last{color:var(--muted,#93A0B5);font-size:0.78rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mf-chat-you{color:#8B5CF6}
.mf-chat-item-side{display:flex;flex-direction:column;align-items:flex-end;gap:0.2rem}
.mf-chat-item-time{color:var(--muted,#93A0B5);font-size:0.7rem}
.mf-chat-unread{min-width:1.1rem;height:1.1rem;border-radius:999px;background:#8B5CF6;color:#fff;font-size:0.68rem;font-weight:800;display:flex;align-items:center;justify-content:center;padding:0 0.25rem}
.mf-chat-online-dot{width:8px;height:8px;border-radius:50%;background:#33CB74;display:inline-block;flex:0 0 auto}
.mf-chat-empty{padding:1.6rem 1rem;text-align:center;color:var(--muted,#93A0B5);font-size:0.86rem;line-height:1.5}
.mf-chat-conv{flex:1;display:flex;flex-direction:column;min-height:0}
.mf-chat-conv[hidden]{display:none}
.mf-chat-conv-head{display:flex;align-items:center;gap:0.5rem;padding:0.5rem 0.7rem;border-bottom:1px solid var(--border,rgba(255,255,255,0.1));font-weight:700}
.mf-chat-conv-head button{background:none;border:none;color:inherit;font-size:1rem;cursor:pointer;padding:0.15rem 0.3rem}
.mf-chat-conv-head #mfChatConvName{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mf-chat-msgs{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:0.7rem;display:flex;flex-direction:column;gap:0.35rem;background:rgba(0,0,0,0.15)}
.mf-chat-bub{max-width:78%;padding:0.45rem 0.65rem 0.5rem;border-radius:0.75rem;font-size:0.87rem;line-height:1.35;word-wrap:break-word;white-space:pre-wrap;position:relative}
.mf-chat-bub.mine{align-self:flex-end;background:rgba(139,92,246,0.42);border-bottom-right-radius:0.2rem}
.mf-chat-bub.their{align-self:flex-start;background:rgba(255,255,255,0.1);border-bottom-left-radius:0.2rem}
.mf-chat-bub-time{display:inline-block;margin-left:0.5rem;font-size:0.65rem;color:rgba(255,255,255,0.55);vertical-align:bottom}
.mf-chat-inputrow{display:flex;gap:0.45rem;padding:0.55rem;border-top:1px solid var(--border,rgba(255,255,255,0.1))}
.mf-chat-inputrow textarea{flex:1;resize:none;background:rgba(255,255,255,0.07);border:1px solid rgba(255,255,255,0.18);border-radius:0.6rem;color:inherit;padding:0.45rem 0.6rem;font-size:0.88rem;font-family:inherit;max-height:6rem}
.mf-chat-inputrow button{flex:0 0 auto;width:2.5rem;border-radius:0.6rem;border:none;background:#8B5CF6;color:#fff;font-size:1rem;cursor:pointer}
.mf-chat-inputrow #mfChatEmojiBtn{background:rgba(255,255,255,0.09);border:1px solid rgba(255,255,255,0.18);font-size:1.15rem}
.mf-chat-emoji-pop{position:absolute;bottom:3.4rem;left:0.55rem;right:0.55rem;background:var(--card,#141A2E);border:1px solid var(--border,rgba(255,255,255,0.18));border-radius:0.75rem;box-shadow:0 10px 30px rgba(0,0,0,0.5);padding:0.5rem;display:grid;grid-template-columns:repeat(8,1fr);gap:0.15rem;z-index:5;max-height:11rem;overflow-y:auto;-webkit-overflow-scrolling:touch}
.mf-chat-emoji-pop[hidden]{display:none}
.mf-chat-emoji-pop button{background:none;border:none;font-size:1.25rem;cursor:pointer;padding:0.25rem 0;border-radius:0.4rem;line-height:1}
.mf-chat-emoji-pop button:hover{background:rgba(139,92,246,0.25)}
.mf-chat-conv{position:relative}
/* 13-10 · xat: separadors de dia, foto a la capçalera (toc → fitxa), cercador d'usuaris i 📷 imatges */
.mf-chat-day{display:flex;justify-content:center;margin:.45rem 0 .2rem}
.mf-chat-day span{font-size:.7rem;font-weight:700;padding:.18rem .65rem;border-radius:999px;background:rgba(255,255,255,.1);color:var(--muted,#93A0B5)}
.mf-chat-conv-head .mf-chat-conv-who{flex:1;min-width:0;display:flex;align-items:center;gap:.5rem;text-align:left;font-weight:700;font-size:.95rem;padding:.1rem .3rem;border-radius:.55rem}
.mf-chat-conv-head .mf-chat-conv-who:hover{background:rgba(255,255,255,.06)}
.mf-chat-conv-who #mfChatConvName{flex:0 1 auto;min-width:0}
#mfChatConvAv{display:flex;flex:0 0 auto}
#mfChatConvAv:empty{display:none}
.mf-chat-conv-who .mf-chat-av{width:2.1rem;height:2.1rem;font-size:.88rem}
.mf-chat-search{padding:.5rem .6rem;border-bottom:1px solid var(--border,rgba(255,255,255,.1))}
.mf-chat-search[hidden]{display:none}
.mf-chat-search input{width:100%;box-sizing:border-box;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.18);border-radius:.6rem;color:inherit;padding:.45rem .7rem;font-size:16px;font-family:inherit}
.mf-chat-inputrow #mfChatImgBtn{background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.18);font-size:1.1rem}
.mf-chat-inputrow #mfChatImgBtn[hidden]{display:none}
.mf-chat-inputrow button:disabled{opacity:.5;cursor:default}
.mf-chat-imgprev{display:flex;align-items:center;gap:.55rem;padding:.45rem .6rem;border-top:1px solid var(--border,rgba(255,255,255,.1));font-size:.78rem;line-height:1.3;color:var(--muted,#93A0B5)}
.mf-chat-imgprev[hidden]{display:none}
.mf-chat-imgprev img{width:3rem;height:3rem;object-fit:cover;border-radius:.45rem;flex:0 0 auto}
.mf-chat-imgprev span{flex:1;min-width:0}
.mf-chat-imgprev button{flex:0 0 auto;background:none;border:none;color:inherit;font-size:1rem;cursor:pointer;padding:.2rem .45rem}
.mf-chat-bub.has-img{padding:.3rem .35rem .4rem}
.mf-chat-img{display:block;padding:0;margin:0 0 .25rem;border:0;background:rgba(0,0,0,.22);border-radius:.55rem;overflow:hidden;cursor:zoom-in;min-width:8rem;min-height:6rem;color:inherit}
.mf-chat-img.ok{min-width:0;min-height:0;background:none}
.mf-chat-img img{display:block;max-width:100%;max-height:16rem;border-radius:.55rem}
.mf-chat-img.err::after{content:'📷';display:flex;align-items:center;justify-content:center;width:8rem;height:6rem;opacity:.45;font-size:1.4rem}
.mf-chat-imgview{position:fixed;inset:0;z-index:100010;background:rgba(0,0,0,.93);display:flex;align-items:center;justify-content:center}
.mf-chat-imgview[hidden]{display:none}
.mf-chat-imgview img{max-width:100vw;max-height:100vh;max-height:100dvh;object-fit:contain}
.mf-chat-imgview button{position:absolute;top:calc(.7rem + env(safe-area-inset-top,0px));right:.8rem;width:2.4rem;height:2.4rem;border-radius:50%;border:none;background:rgba(255,255,255,.16);color:#fff;font-size:1.1rem;cursor:pointer}
.mf-chat-prof-ov[hidden]{display:none}
.mf-chat-prof{position:relative;text-align:center}
.mf-chat-prof-x{position:absolute;top:.45rem;right:.5rem;background:none;border:none;color:inherit;font-size:1.1rem;cursor:pointer;padding:.3rem .5rem;border-radius:50%}
.mf-chat-prof-av{display:flex;justify-content:center;margin:.5rem 0 .65rem}
.mf-chat-prof-av[data-chprof-av]{cursor:zoom-in}
.mf-chat-prof .mf-chat-av{width:7.5rem;height:7.5rem;font-size:2.8rem;box-shadow:0 6px 20px rgba(0,0,0,.35)}
.mf-chat-prof h3{margin:.1rem 0 .25rem;font-size:1.25rem}
.mf-chat-prof-since{color:var(--muted,#93A0B5);font-size:.86rem;margin-bottom:.75rem}
.mf-chat-prof-mail{display:flex;flex-direction:column;gap:.1rem;margin:0 0 .8rem;font-size:.9rem;word-break:break-all}
.mf-chat-prof-mail a{color:#a78bfa}
.mf-chat-prof-mail small{color:var(--muted,#93A0B5);font-size:.7rem}
.mf-chat-prof-gal{width:100%;margin-top:.15rem}
.mf-chat-prof-none{color:var(--muted,#93A0B5);font-size:.84rem;margin-top:.15rem}

.mf-spin{display:inline-block;width:0.9em;height:0.9em;border:2px solid rgba(255,255,255,0.25);border-top-color:currentColor;border-radius:50%;animation:mfspin 0.8s linear infinite;vertical-align:-0.12em;margin-right:0.4em}
@keyframes mfspin{to{transform:rotate(360deg)}}
.mf-a2hs-btns{display:flex;gap:0.5rem;margin-top:0.9rem;flex-wrap:wrap}
.mf-a2hs-btn{border-radius:0.6rem;padding:0.55rem 1rem;font-weight:700;cursor:pointer;border:1px solid rgba(255,255,255,0.25);background:rgba(255,255,255,0.08);color:inherit}
.mf-a2hs-btn.primary{background:rgba(139,92,246,0.85);border-color:rgba(139,92,246,1)}
.mf-wx-toast{position:fixed;left:50%;bottom:1.2rem;transform:translateX(-50%);z-index:99999;background:rgba(20,26,46,0.97);color:#f1f5f9;border:1px solid rgba(255,255,255,0.25);border-radius:0.7rem;padding:0.65rem 1rem;font-size:0.9rem;box-shadow:0 6px 24px rgba(0,0,0,0.5);max-width:92vw;opacity:0;pointer-events:none;transition:opacity 0.25s}
.mf-wx-toast.show{opacity:1}
.mf-opps-list{display:flex;flex-direction:column;gap:0.5rem}
.mf-opp{display:flex;align-items:flex-start;gap:0.65rem;padding:0.6rem 0.7rem;border-radius:0.55rem;background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.09)}
.mf-opp-ic{font-size:1.45rem;line-height:1.1;flex-shrink:0}
.mf-opp-body{flex:1;min-width:0}
.mf-opp-title{font-weight:700;font-size:0.9rem;color:#f1f5f9}
.mf-opps-daysel{margin-left:0.5rem;padding:0.2rem 0.4rem;border-radius:0.5rem;border:1.5px solid rgba(56,189,248,0.5);background:rgba(56,189,248,0.1);color:#38bdf8;font-size:0.78rem;font-weight:700;cursor:pointer;vertical-align:middle}
.mf-opps-daysel:hover{background:rgba(56,189,248,0.18)}
.mf-opp-detail{font-size:0.82rem;color:#cbd5e1;line-height:1.45;margin-top:0.12rem}
.mf-opp-win{font-size:0.76rem;color:#a5b4fc;margin-top:0.2rem;font-weight:700;letter-spacing:0.01em}
.mf-opp.hot{border-color:rgba(239,68,68,0.45);background:rgba(239,68,68,0.09)}
.mf-opps-foot{font-size:0.74rem;color:#94a3b8;margin-top:0.55rem;font-style:italic}
.mf-opps-ctrl{display:flex;align-items:center;gap:0.4rem;flex-wrap:wrap;margin-bottom:0.55rem;font-size:0.8rem;color:#cbd5e1}
.mf-opps-ctrl select{background:rgba(255,255,255,0.09);border:1px solid rgba(255,255,255,0.2);color:#f1f5f9;border-radius:0.4rem;padding:0.25rem 0.5rem;font-size:0.8rem;font-weight:600;cursor:pointer}
.mf-opps-ctrl select option{background:#1e293b;color:#f1f5f9}
/* ===== ⭐ HERO ECLIPSI (contingut destacat) ===== */
.mf-eclipse-hero{display:flex;align-items:center;gap:0.9rem;background:linear-gradient(135deg,rgba(2,6,23,0.92),rgba(120,80,10,0.30));border:1px solid rgba(251,191,36,0.45);border-left:4px solid #fbbf24;box-shadow:0 6px 22px rgba(251,191,36,0.22)}
.mf-ech-left{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:54px;height:54px}
.mf-ech-left .eclipse-icon-mini{transform:scale(1.6)}
.mf-ech-body{flex:1;min-width:0}
.mf-ech-title{font-weight:800;font-size:1rem;color:#f8fafc;letter-spacing:-0.01em}
.mf-ech-count{font-size:1.15rem;color:#fde68a;margin-top:0.15rem;font-variant-numeric:tabular-nums;letter-spacing:0.02em}
.mf-ech-count b{font-size:1.5rem;color:#fff;font-weight:800;font-variant-numeric:tabular-nums;display:inline-block;text-align:center}
.mf-ech-sub{font-size:0.78rem;color:#fcd34d;margin-top:0.15rem}
.mf-ech-cta{flex-shrink:0;background:linear-gradient(135deg,#f59e0b,#fbbf24);color:#1e1b4b;border:none;padding:0.6rem 0.9rem;border-radius:0.6rem;font-weight:800;font-size:0.85rem;cursor:pointer;white-space:nowrap;box-shadow:0 4px 12px rgba(245,158,11,0.4)}
.mf-ech-cta:hover{opacity:0.92}
.mf-ech-actions{flex-shrink:0;display:flex;flex-direction:column;gap:0.4rem;align-items:stretch}
.mf-ech-btn{background:rgba(251,191,36,0.14);border:1px solid rgba(251,191,36,0.5);color:#fde68a;padding:0.44rem 0.7rem;border-radius:0.5rem;font-weight:700;font-size:0.8rem;text-decoration:none;text-align:center;white-space:nowrap;transition:background 0.15s}
.mf-ech-btn:hover{background:rgba(251,191,36,0.26)}
.mf-ech-btn.pro{background:rgba(34,211,238,0.12);border-color:rgba(34,211,238,0.5);color:#a5f3fc}
.mf-ech-sim{background:linear-gradient(135deg,#7c3aed,#4f46e5);border:none;color:#fff;padding:0.6rem 0.8rem;border-radius:0.55rem;font-weight:800;font-size:0.88rem;cursor:pointer;box-shadow:0 3px 12px rgba(124,58,237,0.45);transition:transform 0.12s,box-shadow 0.12s;white-space:nowrap}
.mf-ech-sim:hover{transform:translateY(-1px);box-shadow:0 5px 16px rgba(124,58,237,0.6)}
.mf-ech-next{display:flex;align-items:center;gap:0.55rem;background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.13);border-radius:0.6rem;padding:0.45rem 0.65rem;cursor:pointer;text-align:left;color:inherit;font:inherit;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:background 0.15s,border-color 0.15s,transform 0.12s,box-shadow 0.15s;width:100%}
.mf-ech-next:hover{background:rgba(255,255,255,0.1);border-color:rgba(255,255,255,0.26);transform:translateY(-1px)}
.mf-ech-next.sim{border-color:rgba(251,191,36,0.4);background:rgba(251,191,36,0.07)}
.mf-ech-next.sim:hover{background:rgba(251,191,36,0.14);border-color:rgba(251,191,36,0.65);box-shadow:0 2px 14px rgba(251,191,36,0.18)}
.mf-ech-next .n-ic{font-size:1.15rem;flex-shrink:0}
.mf-ech-next .n-body{min-width:0;flex:1}
.mf-ech-next .n-t{font-weight:800;font-size:0.8rem;line-height:1.25}
.mf-ech-next .n-s{font-size:0.72rem;opacity:0.85;line-height:1.3}
.mf-ech-next .n-d{flex-shrink:0;text-align:center;background:rgba(0,0,0,0.25);border-radius:0.45rem;padding:0.2rem 0.45rem;line-height:1.1}
.mf-ech-next .n-d b{display:block;font-size:0.95rem}
.mf-ech-next .n-d small{font-size:0.58rem;opacity:0.8;text-transform:uppercase;letter-spacing:0.03em}
/* Botons premium del simulador: vidre fosc, un sol accent ambre */
.mf-sim-btn{appearance:none;background:rgba(255,255,255,0.07);border:1px solid rgba(255,255,255,0.15);color:#e7ecf5;border-radius:0.55rem;padding:0.5rem 0.95rem;font-size:0.82rem;font-weight:600;letter-spacing:0.01em;cursor:pointer;line-height:1.25;margin:0;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:background 0.15s,border-color 0.15s,transform 0.12s,box-shadow 0.15s}
.mf-sim-btn:hover{background:rgba(255,255,255,0.13);border-color:rgba(255,255,255,0.3);transform:translateY(-1px)}
.mf-sim-btn:active{transform:translateY(0)}
.mf-sim-btn.accent{background:rgba(245,158,11,0.13);border-color:rgba(245,158,11,0.5);color:#fcd34d}
.mf-sim-btn.accent:hover{background:rgba(245,158,11,0.22);border-color:rgba(245,158,11,0.75);box-shadow:0 2px 12px rgba(245,158,11,0.25)}
.mf-sim-chip{appearance:none;background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.14);color:#cbd5e1;border-radius:2rem;padding:0.32rem 0.8rem;font-size:0.78rem;font-weight:700;cursor:pointer;line-height:1.25;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:background 0.15s,border-color 0.15s,box-shadow 0.15s}
.mf-sim-chip:hover{background:rgba(255,255,255,0.12);border-color:rgba(255,255,255,0.28)}
.mf-sim-chip.active{background:rgba(245,158,11,0.15);border-color:rgba(245,158,11,0.6);color:#fcd34d;box-shadow:0 0 12px rgba(245,158,11,0.22)}
/* Tema clar: chips sobre targetes blanques (panell Ubicació + onboarding GPS) necessiten text fosc */
html:not([data-theme="dark"]) :is(#mfLocPanel,#mfGeoOnboard,#mfWxPanel) .mf-sim-chip{color:var(--text);background:rgba(30,96,145,0.07);border-color:rgba(30,96,145,0.28)}
html:not([data-theme="dark"]) :is(#mfLocPanel,#mfGeoOnboard,#mfWxPanel) .mf-sim-chip:hover{background:rgba(30,96,145,0.14)}
html:not([data-theme="dark"]) :is(#mfLocPanel,#mfGeoOnboard,#mfWxPanel) .mf-sim-chip.active,
html:not([data-theme="dark"]) :is(#mfLocPanel,#mfGeoOnboard,#mfWxPanel) .mf-sim-chip.accent{color:var(--primary);border-color:rgba(30,96,145,0.55);background:rgba(30,96,145,0.14);box-shadow:none}
.mf-ech-btn.pro:hover{background:rgba(34,211,238,0.24)}
@media(max-width:600px){
  .mf-eclipse-hero{flex-wrap:wrap}
  .mf-ech-actions{width:100%;flex-direction:row;flex-wrap:wrap;margin-top:0.4rem}
  .mf-ech-actions .mf-ech-btn{flex:1;min-width:110px}
  .mf-ech-actions .mf-ech-cta{flex:1 0 100%;margin-top:0;width:auto}
}
/* ===== 🛈 TOOLTIPS ===== */
.mf-info{display:inline-flex;align-items:center;justify-content:center;width:1.05em;height:1.05em;border-radius:50%;background:rgba(148,163,184,0.25);color:#cbd5e1;font-size:0.72em;font-weight:700;font-style:normal;cursor:pointer;vertical-align:middle;margin-left:0.15em;user-select:none;line-height:1}
.mf-info:hover{background:var(--accent,#06b6d4);color:#fff}
.mf-tip-pop{position:absolute;z-index:10050;background:#0f172a;border:1px solid rgba(139,92,246,0.5);color:#e2e8f0;padding:0.55rem 0.7rem;border-radius:0.5rem;font-size:0.82rem;line-height:1.5;box-shadow:0 8px 24px rgba(0,0,0,0.5);pointer-events:none}
/* ===== Tastet visual darrere el mur de login ===== */
.mf-lock-wrap{position:relative;max-width:660px;margin:2rem auto;border-radius:0.7rem;overflow:hidden;border:1px solid rgba(148,163,184,0.15)}
.mf-lock-preview{position:absolute;inset:0;filter:blur(5px);opacity:0.45;pointer-events:none;padding:1.1rem;transform:scale(1.03);overflow:hidden}
.mf-lock-veil{position:relative;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,rgba(15,23,42,0.5),rgba(15,23,42,0.9));padding:1.6rem 1rem}
.mf-lock-card{text-align:center;padding:1.6rem 1.5rem;max-width:420px;margin:0}
.mf-mk-list{display:flex;flex-direction:column;gap:0.5rem}
.mf-mk-row{display:flex;justify-content:space-between;gap:0.6rem;background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.08);border-radius:0.5rem;padding:0.6rem 0.8rem;font-size:0.9rem;color:#e2e8f0}
.mf-mk-r{color:#fbbf24;font-weight:700;white-space:nowrap}
.mf-mk-week{display:flex;gap:0.4rem;justify-content:space-between;align-items:flex-end}
.mf-mk-day{flex:1;display:flex;flex-direction:column;align-items:center;gap:0.3rem;font-size:0.75rem;color:#94a3b8}
.mf-mk-barwrap{width:100%;height:90px;display:flex;align-items:flex-end;background:rgba(255,255,255,0.04);border-radius:0.3rem}
.mf-mk-bar{width:100%;background:linear-gradient(180deg,#06b6d4,#3b82f6);border-radius:0.3rem}
.mf-mk-sc{font-weight:700;color:#fbbf24}
.mf-mk-cal{display:grid;grid-template-columns:repeat(7,1fr);gap:0.35rem}
.mf-mk-cell{aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;background:rgba(255,255,255,0.04);border-radius:0.4rem;font-size:1.1rem}
.mf-mk-dn{font-size:0.6rem;color:#94a3b8}

.mf-opp-none{font-size:0.85rem;color:#cbd5e1;padding:0.6rem 0.3rem;text-align:center;line-height:1.5}
.mf-opp{cursor:pointer;transition:background 0.15s,border-color 0.15s}
/* Distinció astro (lila) / meteo (blau) a la vora esquerra de cada targeta */
.mf-opp-astro{border-left:3px solid #a78bfa!important}
.mf-opp-meteo{border-left:3px solid #38bdf8!important}
.mf-opp-astro .mf-opp-date{background:rgba(167,139,250,0.10)}
.mf-opp-meteo .mf-opp-date{background:rgba(56,189,248,0.10)}
.mf-opp:hover{background:rgba(255,255,255,0.09);border-color:rgba(139,92,246,0.45)}
.mf-opp-date{flex-shrink:0;display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:46px;padding:0.28rem 0.35rem;background:rgba(139,92,246,0.20);border:1px solid rgba(139,92,246,0.4);border-radius:0.5rem;line-height:1}
.mf-opp-day{font-size:1.4rem;font-weight:800;color:#f8fafc}
.mf-opp-mon{font-size:0.6rem;font-weight:700;color:#c4b5fd;text-transform:uppercase;letter-spacing:0.04em;margin-top:0.12rem}
.mf-opp-hh{font-size:0.84rem;font-weight:800;color:#f8fafc;margin-top:0.16rem;letter-spacing:0.02em}
.mf-opp-arrow{flex-shrink:0;align-self:center;color:#94a3b8;font-size:1.4rem;font-weight:700}
/* 16-10 (Jaume: «les propostes surten en fons gris, que surtin també en fons blanc en el mode dia del mode complet»): amb el fons clar
   nou (#f2f2f7), la caixa de Propostes blanca com les altres i cada proposta en un gris molt suau amb el text fosc (els colors de
   sempre eren per a fons fosc). El mode nit no canvia */
[data-theme="light"] #todayOpportunitiesCard{background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.05),0 8px 24px rgba(0,0,0,.06)}
[data-theme="light"] .mf-opp{background:#f6f6f8;border-color:rgba(0,0,0,.07)}
[data-theme="light"] .mf-opp:hover{background:#efeff4;border-color:rgba(139,92,246,.45)}
[data-theme="light"] .mf-opp.hot{background:rgba(239,68,68,.06);border-color:rgba(239,68,68,.35)}
[data-theme="light"] .mf-opp-date{background:rgba(139,92,246,.10);border-color:rgba(139,92,246,.35)}
[data-theme="light"] .mf-opp-astro .mf-opp-date{background:rgba(167,139,250,.13)}
[data-theme="light"] .mf-opp-meteo .mf-opp-date{background:rgba(56,189,248,.13)}
[data-theme="light"] .mf-opp-day,[data-theme="light"] .mf-opp-hh,[data-theme="light"] .mf-opp-title{color:#1c1c1e}
[data-theme="light"] .mf-opp-mon{color:#6d28d9}
[data-theme="light"] .mf-opp-detail,[data-theme="light"] .mf-opp-none,[data-theme="light"] .mf-opps-ctrl{color:#3a3a3c}
[data-theme="light"] .mf-opp-win{color:#4f46e5}
[data-theme="light"] .mf-opp-arrow,[data-theme="light"] .mf-opps-foot{color:#6e6e73}
[data-theme="light"] .mf-opp-chip{background:rgba(118,118,128,.1);border-color:rgba(0,0,0,.1);color:#1c1c1e}
[data-theme="light"] .mf-opp-chip.active{background:rgba(139,92,246,.18);border-color:rgba(139,92,246,.55)}
[data-theme="light"] .mf-opps-help{border-color:rgba(0,0,0,.25);background:rgba(0,0,0,.04);color:#1c1c1e}
[data-theme="light"] .mf-opps-helpbox{background:#f6f6f8;border-color:rgba(0,0,0,.08);color:#1c1c1e}
[data-theme="light"] .mf-opps-daysel{color:#0369a1;border-color:rgba(3,105,161,.4);background:rgba(56,189,248,.08)}
[data-theme="light"] .mf-opps-geo{background:rgba(0,0,0,.04);border-color:rgba(0,0,0,.12)}
[data-theme="light"] .mf-opps-ctrl select{background:#fff;border-color:rgba(0,0,0,.15);color:#1c1c1e}
[data-theme="light"] .mf-ecl-cta[style*="120,120,145"]{background:rgba(118,118,128,.16)!important;color:#1c1c1e;text-shadow:none}   /* «📷 Vista càmera» (gris, fons posat pel codi): text fosc */
/* 21-09 (Jaume): finestra de proposta — bàner de cap a cap a dalt (lloc · dia · hora), ✕ en blanc a sobre, cos amb farciment propi */
#mfOppModal .modal-box{padding:0;position:relative;overflow:hidden;display:flex;flex-direction:column}
#mfOppModal .modal-box .modal-close{position:absolute;top:.35rem;right:.5rem;float:none;margin:0;color:#fff;opacity:.9;z-index:2;font-size:1.6rem;line-height:1;padding:.25rem .5rem}
#mfOppModal .modal-box .modal-close:hover{opacity:1;background:rgba(255,255,255,.14)}
#mfOppModalContent{display:flex;flex-direction:column;min-height:0;overflow-y:auto;max-height:85vh}
.mf-oppm-where{display:flex;flex-wrap:wrap;gap:.3rem 1.1rem;align-items:center;flex:0 0 auto;margin:0;padding:.85rem 3rem .85rem 1.4rem;background:linear-gradient(135deg,#312e81,#6d28d9 60%,#7c3aed);color:#fff;font-weight:700;font-size:1rem;line-height:1.35;box-shadow:0 2px 12px rgba(0,0,0,.35)}
.mf-oppm-where span{white-space:nowrap}
.mf-oppm-body{padding:1rem 1.4rem 1.4rem}
@media (max-width:480px){.mf-oppm-where{font-size:.92rem;padding:.75rem 2.8rem .75rem 1rem;gap:.25rem .8rem}.mf-oppm-body{padding:.9rem 1rem 1.1rem}}
.mf-oppm-head{display:flex;align-items:center;gap:0.6rem;margin-bottom:0.5rem}
.mf-oppm-ic{font-size:1.9rem;line-height:1}
.mf-oppm-head h3{margin:0;font-size:1.12rem;color:#f1f5f9}
.mf-oppm-detail{font-size:0.9rem;color:#cbd5e1;line-height:1.5;margin:0 0 0.5rem}
.mf-oppm-win{font-size:0.82rem;color:#a5b4fc;font-weight:700;margin:0 0 0.6rem}
.mf-oppm-h4{font-size:0.86rem;color:#a5b4fc;margin:0.7rem 0 0.4rem;font-weight:700}
.mf-oppm-tips{margin:0;padding-left:1.2rem;font-size:0.86rem;color:#e2e8f0;line-height:1.65}
.mf-oppm-tips li{margin-bottom:0.3rem}
.mf-oppm-guide{margin-top:1rem;background:linear-gradient(135deg,#8b5cf6,#06b6d4);color:#fff;border:none;padding:0.65rem 1rem;border-radius:0.55rem;font-weight:700;cursor:pointer;font-size:0.9rem;width:100%}
.mf-oppm-guide:hover{opacity:0.92}


.cat-meteo-map-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:0.6rem;gap:0.5rem}
.cat-meteo-map-header h3{margin:0;font-size:1.05rem}
.btn-icon-refresh{background:none;border:1px solid var(--border);border-radius:0.4rem;cursor:pointer;font-size:1rem;padding:0.25rem 0.55rem;color:var(--muted);transition:all .15s}
.btn-icon-refresh:hover{background:var(--card-2);color:var(--accent);transform:rotate(180deg)}
.cat-meteo-controls{display:flex;align-items:stretch;gap:0.6rem;margin-bottom:0.6rem;flex-wrap:nowrap;overflow-x:auto;padding-bottom:0.3rem;scrollbar-width:thin}
.cat-meteo-controls::-webkit-scrollbar{height:5px}
.cat-meteo-controls::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}
.cat-meteo-divider{width:1px;align-self:stretch;background:var(--border);flex-shrink:0;margin:0.15rem 0.1rem}
.cat-meteo-modes{display:flex;gap:0.35rem;flex-wrap:nowrap;flex-shrink:0;align-items:stretch}
.cat-meteo-days{display:flex;gap:0.3rem;flex-wrap:nowrap;flex-shrink:0;align-items:stretch}
.cat-day-btn{background:var(--card-2);border:1px solid var(--border);border-radius:0.55rem;padding:0.4rem 0.7rem;font-size:0.72rem;font-weight:600;cursor:pointer;color:var(--text);transition:all .15s;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-width:62px;line-height:1.1;flex-shrink:0}
.cat-day-btn:hover{background:rgba(22,138,173,0.12);border-color:var(--accent)}
.cat-day-btn.active{background:linear-gradient(135deg,#f59e0b,#dc2626);border-color:transparent;color:#fff;box-shadow:0 2px 8px rgba(245,158,11,0.35)}
.cat-day-btn.weekend{border-color:rgba(245,158,11,0.4)}
.cat-day-btn.weekend.active{background:linear-gradient(135deg,#dc2626,#7c2d12)}
.cat-day-name{font-size:0.7rem;text-transform:capitalize;letter-spacing:0.2px;font-weight:700;white-space:nowrap}
.cat-day-num{font-size:0.95rem;font-weight:800;line-height:1}
.cat-day-today-tag{font-size:0.55rem;color:var(--accent);font-weight:700;text-transform:uppercase;letter-spacing:0.5px;margin-top:1px}
.cat-day-btn.active .cat-day-today-tag{color:#fff}
/* Meteo inline al botó: només pictograma (tmax/tmin ara estan als botons de mode) */
.cat-day-icon{font-size:1.1rem;line-height:1.1;margin-top:1px}
.cat-mode-btn{background:var(--card-2);border:1px solid var(--border);border-radius:0.55rem;padding:0.35rem 0.7rem;font-size:0.74rem;font-weight:600;cursor:pointer;color:var(--text);transition:all .15s;white-space:nowrap;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;flex-shrink:0;line-height:1.15;min-width:74px}
.cat-mode-btn:hover{background:rgba(22,138,173,0.12);border-color:var(--accent)}
.cat-mode-btn.active{background:linear-gradient(135deg,#168ad9,#1e3a8a);border-color:transparent;color:#fff;box-shadow:0 2px 8px rgba(22,138,173,0.3)}
.cat-mode-label{font-size:0.72rem;font-weight:700;letter-spacing:0.2px;line-height:1}
.cat-mode-value{font-size:0.7rem;font-weight:600;color:var(--accent);line-height:1;margin-top:1px;display:inline-flex;align-items:center;gap:0.15rem}
.cat-mode-btn.active .cat-mode-value{color:rgba(255,255,255,0.95)}
.cat-mode-value:empty{display:none}
.cat-mode-trend-up{color:#ef4444}
.cat-mode-trend-down{color:#3b82f6}
.cat-mode-trend-flat{color:var(--muted)}
.cat-mode-btn.active .cat-mode-trend-up,
.cat-mode-btn.active .cat-mode-trend-down,
.cat-mode-btn.active .cat-mode-trend-flat{color:#fff}
@media(max-width:768px){
  .cat-meteo-controls{flex-direction:column;align-items:stretch;gap:0.45rem;overflow:visible}
  .cat-meteo-divider{display:none}
  .cat-meteo-days{overflow-x:auto;padding-bottom:0.2rem}
  /* Scroll horitzontal per modes en mòbil (segons la decisió de l'usuari) */
  .cat-meteo-modes{overflow-x:auto;flex-wrap:nowrap;padding-bottom:0.2rem;justify-content:flex-start;gap:0.3rem;-webkit-overflow-scrolling:touch}
  .cat-mode-btn{flex:0 0 auto;min-width:78px;font-size:0.72rem;padding:0.35rem 0.55rem}
  .cat-mode-label{font-size:0.68rem}
  .cat-mode-value{font-size:0.66rem}
  .cat-day-btn{min-width:54px}
  .cat-day-name{font-size:0.68rem}
}
.cat-meteo-map{width:100%;height:480px;border-radius:0.55rem;background:#f0f4f8;overflow:hidden;border:1px solid var(--border);position:relative;transition:height .3s ease}
.cat-meteo-map.is-fullscreen{position:fixed;top:0;left:0;right:0;bottom:0;width:100%!important;height:100vh!important;height:100dvh!important;z-index:9999;border-radius:0;border:none}
/* === OUT-OF-RANGE (v20h45): mapa esmorteït quan la data del header està fora del seu interval === */
.cat-meteo-map.is-out-of-range{filter:grayscale(0.7) brightness(0.65);pointer-events:none}
.cat-meteo-map.is-out-of-range::after{
  content:"📅 El mapa només mostra avui i pròxims dies (fins diumenge). Torna a una data dins d'aquest interval per veure'l actualitzat.";
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  background:rgba(15,23,42,0.92);color:#fff;padding:0.85rem 1.1rem;border-radius:0.6rem;
  font-size:0.88rem;line-height:1.45;text-align:center;max-width:80%;
  border:1px solid rgba(168,85,247,0.4);box-shadow:0 8px 24px rgba(0,0,0,0.4);
  pointer-events:auto;z-index:1000;font-weight:500;
}
/* Botó maximitzar custom */
.cat-fs-btn-wrap{margin:8px!important}
.cat-fs-btn{background:rgba(255,255,255,0.95);border:1px solid rgba(0,0,0,0.15);border-radius:50%;width:36px;height:36px;font-size:1.05rem;cursor:pointer;color:#0f172a;font-weight:700;box-shadow:0 2px 6px rgba(0,0,0,0.2);transition:all .12s;display:flex;align-items:center;justify-content:center}
.cat-fs-btn:hover{background:#fff;transform:scale(1.05);box-shadow:0 3px 10px rgba(0,0,0,0.3)}
.cat-zoom-btn-wrap{margin:8px!important;display:flex;flex-direction:column;gap:0}
.cat-zoom-btn{background:rgba(255,255,255,0.95);border:1px solid rgba(0,0,0,0.15);width:36px;height:33px;font-size:1.25rem;font-weight:700;cursor:pointer;color:#0f172a;box-shadow:0 2px 6px rgba(0,0,0,0.2);display:flex;align-items:center;justify-content:center;line-height:1;transition:all .12s;padding:0}
.cat-zoom-btn:first-child{border-radius:0.4rem 0.4rem 0 0;border-bottom:none}
.cat-zoom-btn:last-child{border-radius:0 0 0.4rem 0.4rem}
.cat-zoom-btn:hover{background:#fff;box-shadow:0 3px 10px rgba(0,0,0,0.28)}
[data-theme="dark"] .cat-zoom-btn{background:rgba(40,55,90,0.92);color:#fff;border-color:rgba(255,255,255,0.22)}
[data-theme="dark"] .cat-zoom-btn:hover{background:rgba(40,55,90,1)}
/* ===== Panell lateral d'ubicacions (mapa maximitzat) v09-08 ===== */
.cat-map-sidebar{position:absolute;top:0;left:0;bottom:0;z-index:1200;display:none;pointer-events:none}
.cat-meteo-map.is-fullscreen .cat-map-sidebar{display:block}
.cat-map-sidebar .cms-panel{position:absolute;top:0;left:0;bottom:0;width:260px;max-width:78vw;background:rgba(255,255,255,0.97);backdrop-filter:blur(6px);border-right:1px solid rgba(0,0,0,0.12);box-shadow:2px 0 14px rgba(0,0,0,0.18);display:flex;flex-direction:column;pointer-events:auto;transform:translateX(0);transition:transform .22s ease}
/* Mòbil: safe-area (que el 🔗 no quedi sota la barra d'estat) + panell semitransparent */
.cat-map-sidebar .cms-panel{padding-top:env(safe-area-inset-top,0px)}
.cat-map-sidebar .cms-rail{margin-top:env(safe-area-inset-top,0px)}
.cat-meteo-map.is-fullscreen .leaflet-top{margin-top:env(safe-area-inset-top,0px)}
.cat-meteo-map.is-fullscreen .mf-ltg-bar{top:calc(3.4rem + env(safe-area-inset-top,0px));}
.cat-meteo-map.is-fullscreen:has(.cat-map-sidebar:not(.is-collapsed)) .mf-ltg-bar{left:calc(50% + 130px);}   /* el lateral (260px) no la tapa */
@media(max-width:620px){ .mf-ltg-bar{left:.5rem;right:3.6rem;transform:none;width:auto;max-width:none;} .mf-ltg-hours button{padding:.3rem .5rem;min-width:0;flex:1 1 0;} .cat-meteo-map.is-fullscreen:has(.cat-map-sidebar:not(.is-collapsed)) .mf-ltg-bar{left:.5rem;} }   /* 12-09: sota la barra d'estat d'iOS (env pot ser 0 en pantalla sencera) */
@media (max-width:720px){
  .cat-map-sidebar .cms-panel{background:rgba(255,255,255,0.80);backdrop-filter:blur(9px)}
  [data-theme="dark"] .cat-map-sidebar .cms-panel{background:rgba(20,28,46,0.80)}
  .cat-map-sidebar .cms-list{background:transparent}
}
.cat-map-sidebar .cms-rail{position:absolute;top:50%;left:0;transform:translateY(-50%);z-index:2;pointer-events:auto;opacity:0;transition:opacity .2s}
.cat-map-sidebar .cms-expand{width:32px;height:70px;border:none;border-radius:0 14px 14px 0;background:#2563eb;cursor:pointer;font-size:1.5rem;font-weight:800;color:#fff;box-shadow:2px 3px 12px rgba(37,99,235,0.5);display:flex;align-items:center;justify-content:center;animation:cmsExpandPulse 2.2s ease-in-out infinite}
@keyframes cmsExpandPulse{0%,100%{box-shadow:2px 3px 12px rgba(37,99,235,0.5)}50%{box-shadow:2px 3px 18px rgba(37,99,235,0.85)}}
.cat-map-sidebar .cms-expand:hover{background:#1d4ed8}
.cat-map-sidebar.is-collapsed .cms-panel{transform:translateX(-102%)}
.cat-map-sidebar.is-collapsed .cms-rail{opacity:1}
.cat-map-sidebar .cms-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px;border-bottom:1px solid rgba(0,0,0,0.1)}
.cat-map-sidebar .cms-title{font-weight:800;font-size:0.92rem;color:#0f172a}
.cat-map-sidebar .cms-count{display:inline-block;min-width:20px;text-align:center;background:#0f172a;color:#fff;border-radius:999px;font-size:0.72rem;padding:1px 7px;margin-left:4px}
.cat-map-sidebar .cms-collapse{width:32px;height:32px;border:none;border-radius:9px;background:#2563eb;cursor:pointer;font-size:1.25rem;font-weight:800;color:#fff;line-height:1;flex:none;box-shadow:0 2px 6px rgba(37,99,235,0.45)}
.cat-map-sidebar .cms-collapse:hover{background:#1d4ed8}
.cat-map-sidebar .cms-sort{display:flex;gap:6px;padding:8px 12px;border-bottom:1px solid rgba(0,0,0,0.08)}
.cat-map-sidebar .cms-sort-btn{flex:1;padding:5px 6px;border:1px solid rgba(0,0,0,0.15);border-radius:7px;background:#f8fafc;cursor:pointer;font-size:0.78rem;font-weight:700;color:#334155}
.cat-map-sidebar .cms-sort-btn.is-active{background:#0f172a;color:#fff;border-color:#0f172a}
.cat-map-sidebar .cms-list{flex:1;overflow-y:auto;padding:6px 8px}
.cat-map-sidebar .cms-item{display:flex;align-items:center;gap:8px;padding:7px 9px;border-radius:8px;cursor:pointer;font-size:0.85rem;color:#1e293b;transition:background .12s}
.cat-map-sidebar .cms-item:hover{background:#e0f2fe}
.cat-map-sidebar .cms-num{flex:none;width:22px;height:22px;border-radius:50%;background:#ff6b35;color:#fff;font-size:0.72rem;font-weight:800;display:flex;align-items:center;justify-content:center}
.cat-map-sidebar .cms-cat{flex:none;width:22px;text-align:center;font-size:1rem;line-height:1}
.cat-map-sidebar .cms-cat .cms-cat-none{color:var(--muted,#94a3b8);font-weight:800}
.cat-map-sidebar .cms-filter{display:flex;flex-wrap:wrap;align-items:center;gap:4px;padding:7px 10px;border-bottom:1px solid rgba(0,0,0,0.08)}
.cat-map-sidebar .cms-filter-lbl{font-size:0.72rem;font-weight:800;color:#475569;margin-right:2px}
.cat-map-sidebar .cms-fchip{width:26px;height:26px;border:1px solid rgba(0,0,0,0.15);border-radius:7px;background:#f8fafc;cursor:pointer;font-size:0.9rem;line-height:1;display:flex;align-items:center;justify-content:center;padding:0}
.cat-map-sidebar .cms-fchip:hover{border-color:var(--accent,#2563eb)}
.cat-map-sidebar .cms-fchip.active{background:#2563eb;border-color:#2563eb;box-shadow:0 0 0 2px rgba(37,99,235,0.35)}
.cat-map-sidebar .cms-fclear{width:26px;height:26px;border:1px solid rgba(220,38,38,0.4);border-radius:7px;background:#fff;color:#dc2626;cursor:pointer;font-size:0.8rem;line-height:1;display:flex;align-items:center;justify-content:center;padding:0}
[data-theme="dark"] .cat-map-sidebar .cms-filter{border-bottom-color:rgba(255,255,255,0.1)}
[data-theme="dark"] .cat-map-sidebar .cms-filter-lbl{color:#cbd5e1}
[data-theme="dark"] .cat-map-sidebar .cms-fchip{background:#1e293b;border-color:rgba(255,255,255,0.18)}
[data-theme="dark"] .cat-map-sidebar .cms-fclear{background:#1e293b}
.cat-map-sidebar .cms-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
[data-theme="dark"] .cat-map-sidebar .cms-panel{background:rgba(20,28,46,0.97);border-right-color:rgba(255,255,255,0.14)}
[data-theme="dark"] .cat-map-sidebar .cms-expand{background:rgba(20,28,46,0.97);color:#e2e8f0;border-color:rgba(255,255,255,0.18)}
[data-theme="dark"] .cat-map-sidebar .cms-title{color:#e2e8f0}
[data-theme="dark"] .cat-map-sidebar .cms-count{background:#e2e8f0;color:#0f172a}
[data-theme="dark"] .cat-map-sidebar .cms-collapse{background:#3b82f6;color:#fff}
[data-theme="dark"] .cat-map-sidebar .cms-sort-btn{background:#1e293b;color:#cbd5e1;border-color:rgba(255,255,255,0.18)}
[data-theme="dark"] .cat-map-sidebar .cms-sort-btn.is-active{background:#e2e8f0;color:#0f172a;border-color:#e2e8f0}
[data-theme="dark"] .cat-map-sidebar .cms-item{color:#e2e8f0}
[data-theme="dark"] .cat-map-sidebar .cms-item:hover{background:rgba(56,189,248,0.18)}
.cat-marker-wrap.mf-hl{z-index:4000!important}
.cat-marker-wrap.mf-hl .cat-marker-icon{animation:mfMarkerPulse 0.9s ease-in-out infinite}
.cat-marker-wrap.mf-hl .cat-marker-val{box-shadow:0 0 0 3px rgba(255,107,53,0.9),0 0 14px 4px rgba(255,107,53,0.7)!important;border-color:#fff!important}
.cat-marker-wrap.mf-hl .cat-marker-name{background:#ff6b35!important;color:#fff!important;display:block!important;font-weight:800!important}
@keyframes mfMarkerPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.35)}}
.cat-map-sidebar .cms-item.mf-row-hl{background:#ffe4d6;box-shadow:inset 3px 0 0 #ff6b35}
[data-theme="dark"] .cat-map-sidebar .cms-item.mf-row-hl{background:rgba(255,107,53,0.22);box-shadow:inset 3px 0 0 #ff6b35}
.cat-map-sidebar .cms-actions{display:flex;align-items:center;gap:8px;padding:6px 12px;border-bottom:1px solid rgba(0,0,0,0.08)}
.cat-map-sidebar .cms-selall{display:flex;align-items:center;gap:5px;font-size:0.76rem;font-weight:700;color:#475569;cursor:pointer;user-select:none}
.cat-map-sidebar .cms-selall input{accent-color:#2563eb}
.cat-map-sidebar .cms-road-btn{margin-left:auto;padding:5px 10px;border:1px solid #2563eb;border-radius:7px;background:#2563eb;color:#fff;cursor:pointer;font-size:0.78rem;font-weight:800;white-space:nowrap}
.cat-map-sidebar .cms-road-btn:disabled{background:#cbd5e1;border-color:#cbd5e1;color:#eef2f7;cursor:not-allowed}
.cat-map-sidebar .cms-summary{padding:7px 12px;font-size:0.82rem;color:#0f172a;background:#eff6ff;border-bottom:1px solid rgba(37,99,235,0.2)}
.cat-map-sidebar .cms-check{flex:none;width:16px;height:16px;cursor:pointer;accent-color:#2563eb}
.cat-map-sidebar .cms-item.is-sel{background:#eff6ff}
[data-theme="dark"] .cat-map-sidebar .cms-actions{border-bottom-color:rgba(255,255,255,0.1)}
[data-theme="dark"] .cat-map-sidebar .cms-selall{color:#cbd5e1}
[data-theme="dark"] .cat-map-sidebar .cms-summary{background:rgba(37,99,235,0.18);color:#e2e8f0;border-bottom-color:rgba(37,99,235,0.35)}
[data-theme="dark"] .cat-map-sidebar .cms-item.is-sel{background:rgba(37,99,235,0.18)}
.cat-map-sidebar .cms-share{width:28px;height:28px;border:1px solid rgba(0,0,0,0.15);border-radius:7px;background:#fff;cursor:pointer;font-size:0.95rem;color:#0f172a;line-height:1;flex:none;margin-right:4px}
.cat-map-sidebar .cms-share:hover{background:#f1f5f9}
[data-theme="dark"] .cat-map-sidebar .cms-share{background:#1e293b;color:#e2e8f0;border-color:rgba(255,255,255,0.18)}
.cat-map-sidebar .cms-share-menu{display:flex;flex-direction:column;gap:4px;padding:8px 10px;border-bottom:1px solid rgba(0,0,0,0.1);background:var(--card-2,#f1f5f9)}
.cat-map-sidebar .csm-item{display:block;padding:7px 10px;border-radius:7px;border:1px solid rgba(0,0,0,0.12);background:#fff;color:#0f172a;font-size:0.82rem;font-weight:700;text-decoration:none;cursor:pointer;text-align:left}
.cat-map-sidebar .csm-item:hover{background:#e0f2fe}
[data-theme="dark"] .cat-map-sidebar .cms-share-menu{background:rgba(20,28,46,0.9);border-bottom-color:rgba(255,255,255,0.12)}
[data-theme="dark"] .cat-map-sidebar .csm-item{background:#1e293b;color:#e2e8f0;border-color:rgba(255,255,255,0.14)}
.mf-shared-pin{background:none;border:none}
.mf-shared-pin .msp-dot{font-size:22px;line-height:1;filter:drop-shadow(0 1px 2px rgba(0,0,0,0.5))}
.mf-shared-pin .msp-lbl{background:rgba(37,99,235,0.95);color:#fff;font-size:10px;font-weight:700;padding:1px 5px;border-radius:4px;white-space:nowrap;margin-top:-2px;max-width:120px;overflow:hidden;text-overflow:ellipsis;box-shadow:0 1px 3px rgba(0,0,0,0.4)}
.mf-shared-banner{position:absolute;top:10px;left:50%;transform:translateX(-50%);z-index:1300;display:flex;align-items:center;gap:10px;max-width:92%;background:rgba(15,23,42,0.95);color:#fff;padding:9px 12px;border-radius:10px;box-shadow:0 4px 16px rgba(0,0,0,0.35);font-size:0.82rem;backdrop-filter:blur(4px)}
.mf-shared-banner b{color:#7dd3fc}
.mf-shared-banner .msb-reg{background:#2563eb;color:#fff;border:none;border-radius:7px;padding:6px 11px;font-weight:800;cursor:pointer;font-size:0.8rem;white-space:nowrap}
.mf-shared-banner .msb-reg:hover{background:#1d4ed8}
.mf-shared-banner .msb-x{background:transparent;border:none;color:#cbd5e1;cursor:pointer;font-size:1rem;padding:2px 4px;flex:none}
.cat-recenter-btn-wrap{margin:8px 8px 0 8px!important}
.cat-recenter-btn{background:rgba(255,255,255,0.95);border:1px solid rgba(0,0,0,0.15);border-radius:0.4rem;width:36px;height:36px;font-size:1.05rem;cursor:pointer;color:#0f172a;font-weight:700;box-shadow:0 2px 6px rgba(0,0,0,0.2);transition:all .12s;display:flex;align-items:center;justify-content:center}
.cat-recenter-btn:hover{background:#fff;transform:scale(1.05);box-shadow:0 3px 10px rgba(0,0,0,0.3)}
/* === Botó canvi de fons del mapa (cicle 3 nivells) === */
.cat-bg-btn-wrap{margin:8px 8px 0 8px!important}
.cat-sun-btn.on{background:#fde68a;border-color:#f59e0b;box-shadow:0 0 8px rgba(245,158,11,0.5)}
.app-hero{position:relative;height:200px;overflow:hidden;border-radius:0.9rem;margin:0 0 .5rem;box-shadow:0 4px 18px rgba(15,23,42,0.25)}   /* 21-09 (Jaume): meitat d'espai fins al menú */
.app-hero img{width:100%;height:100%;object-fit:cover;object-position:50% 78%;display:block}
.app-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,17,32,0.45) 0%,rgba(11,17,32,0.05) 32%,rgba(11,17,32,0.35) 100%);pointer-events:none}
.app-hero-tag{position:absolute;right:1.1rem;top:0.8rem;z-index:2;color:#fff;font-family:'Archivo Black','Arial Black',sans-serif;font-size:1.15rem;letter-spacing:0.01em;text-shadow:0 2px 10px rgba(0,0,0,0.75);text-align:right}
.mf-hero-alert-bubbles{position:absolute;right:0.95rem;bottom:0.8rem;z-index:3;display:flex;align-items:center;justify-content:flex-end;gap:0.45rem;max-width:calc(100% - 1.9rem);flex-wrap:wrap}
.mf-meteo-mini-bubble,.mf-fire-mini-bubble{position:static;display:none;align-items:center;gap:0.45rem;padding:0.42rem 0.72rem;border-radius:999px;color:#fff;border:1px solid rgba(255,255,255,0.28);box-shadow:0 8px 20px rgba(0,0,0,0.35);cursor:pointer;font-weight:800;font-size:0.84rem;line-height:1;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.mf-meteo-mini-bubble{background:linear-gradient(90deg,#f97316,#ea580c);animation:mfPulseAlert 2.4s ease-in-out infinite}
.mf-fire-mini-bubble{background:linear-gradient(90deg,#dc2626,#991b1b);animation:mfPulseAlert 2s ease-in-out infinite}
.mf-meteo-mini-bubble:hover,.mf-fire-mini-bubble:hover{transform:translateY(-1px)}
.mf-meteo-mini-count,.mf-fire-mini-count{display:inline-flex;align-items:center;justify-content:center;min-width:1.45rem;height:1.45rem;padding:0 0.2rem;border-radius:999px;background:rgba(255,255,255,0.22);font-size:0.82rem;font-weight:900}
.mf-meteo-mini-label,.mf-fire-mini-label{font-size:0.72rem;font-weight:700;opacity:0.95;letter-spacing:0.02em}
@media (max-width:600px){.app-hero{height:120px;border-radius:0.7rem}.app-hero-tag{font-size:0.82rem;right:0.7rem;top:0.55rem}.mf-hero-alert-bubbles{right:0.6rem;bottom:0.55rem;gap:0.35rem;max-width:calc(100% - 1.2rem)}.mf-meteo-mini-bubble,.mf-fire-mini-bubble{padding:0.35rem 0.56rem;gap:0.35rem}.mf-meteo-mini-label,.mf-fire-mini-label{display:none}.mf-meteo-mini-count,.mf-fire-mini-count{min-width:1.3rem;height:1.3rem;font-size:0.78rem}}
/* Calendari solar: 7 columnes de dades denses — cel·les encongibles o la graella es desborda */
#sunCalGrid{min-width:0}
#sunCalGrid .cal-day{min-width:0;overflow:hidden;padding:0.3rem 0.12rem}
#sunCalGrid .day-times{font-size:0.6rem;line-height:1.3;white-space:nowrap;overflow:hidden;letter-spacing:-0.01em}
#sunCalGrid .day-marker{white-space:normal;line-height:1.15}
@media (max-width:700px){
  #sunCalGrid .day-times{font-size:0.5rem}
  #sunCalGrid .cal-day{padding:0.22rem 0.08rem}
  #sunCalGrid .day-num{font-size:0.72rem}
}
.cal-day.has-sun-ev{border-color:rgba(249,115,22,0.55);box-shadow:0 0 0 1px rgba(249,115,22,0.3) inset}
.cal-day.sun-ev-flash{animation:sunEvFlash 0.65s ease-in-out 4}
@keyframes sunEvFlash{0%,100%{box-shadow:0 0 0 1px rgba(249,115,22,0.3) inset}50%{box-shadow:0 0 0 3px rgba(249,115,22,0.95) inset,0 0 18px rgba(249,115,22,0.6)}}
.mf-sunicon{position:relative;display:block;width:1em;height:1em;filter:drop-shadow(0 0 4px rgba(255,150,50,0.5))}
.mf-sunicon img{position:relative;z-index:1;width:100%!important;height:100%!important}
.mf-sunicon::before,.mf-sunicon::after{content:"";position:absolute;width:34%;height:16%;border-radius:50%;
 background:radial-gradient(closest-side,rgba(255,210,110,0.95),rgba(255,140,30,0.55) 60%,transparent);
 filter:blur(1px);opacity:0;transform-origin:0% 50%;z-index:0}
.mf-sunicon::before{left:88%;top:22%;transform:rotate(-32deg) scaleX(0.4);animation:mfFlareA 9s ease-in-out infinite}
.mf-sunicon::after{left:6%;top:78%;transform:rotate(148deg) scaleX(0.4);transform-origin:0% 50%;animation:mfFlareB 13s ease-in-out infinite 4s}
@keyframes mfFlareA{0%,66%{opacity:0;transform:rotate(-32deg) scaleX(0.35)}72%{opacity:0.95;transform:rotate(-32deg) scaleX(1)}80%,100%{opacity:0;transform:rotate(-32deg) scaleX(0.45)}}
@keyframes mfFlareB{0%,58%{opacity:0;transform:rotate(148deg) scaleX(0.35)}65%{opacity:0.85;transform:rotate(148deg) scaleX(1)}74%,100%{opacity:0;transform:rotate(148deg) scaleX(0.45)}}
.mf-vricon{position:relative;display:inline-block;overflow:hidden;border-radius:22%}
.mf-vricon::after{content:"";position:absolute;top:-10%;bottom:-10%;left:0;width:26%;
 background:linear-gradient(105deg,transparent,rgba(255,255,255,0.5),transparent);
 transform:translateX(-140%) skewX(-18deg);animation:mfVrShine 7s ease-in-out infinite 2s;pointer-events:none}
@keyframes mfVrShine{0%,78%{transform:translateX(-140%) skewX(-18deg)}88%{transform:translateX(420%) skewX(-18deg)}100%{transform:translateX(420%) skewX(-18deg)}}
@media (prefers-reduced-motion:reduce){.mf-sunicon::before,.mf-sunicon::after,.mf-vricon::after{animation:none}}
.mf-has-ribbon{overflow:hidden;position:relative}
.mf-ribbon{position:absolute;top:12px;right:-32px;width:118px;text-align:center;transform:rotate(38deg);background:linear-gradient(135deg,#f59e0b,#d97706);color:#1a1206;font-size:0.55rem;font-weight:800;letter-spacing:0.06em;text-transform:uppercase;padding:2px 0;box-shadow:0 1px 4px rgba(0,0,0,0.35);pointer-events:none;z-index:3}
.cat-bg-btn,.cat-lp-btn,.cat-sun-btn{background:rgba(255,255,255,0.95);border:1px solid rgba(0,0,0,0.15);border-radius:0.4rem;width:36px;height:36px;font-size:1rem;cursor:pointer;color:#0f172a;font-weight:700;box-shadow:0 2px 6px rgba(0,0,0,0.2);transition:all .12s;display:flex;align-items:center;justify-content:center;line-height:1}
.tg-big{position:relative;border-radius:0.7rem;overflow:hidden;cursor:pointer;background:#0d0f16;max-width:680px;margin:0 auto;height:clamp(240px,52vw,400px);display:flex;align-items:center;justify-content:center}
.tg-bgblur{position:absolute;inset:-24px;width:calc(100% + 48px);height:calc(100% + 48px);object-fit:cover;filter:blur(20px) brightness(0.5);z-index:0}
.tg-main{position:relative;z-index:1;max-width:100%;max-height:100%;width:auto;height:auto}
.tg-exif{font-size:0.7rem;opacity:0.85;margin-top:0.15rem}
.tg-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.tg-cap{position:absolute;left:0;right:0;bottom:0;padding:0.45rem 0.65rem;font-size:0.78rem;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,0.7));z-index:2}
.tg-row{display:grid;grid-template-columns:repeat(7,1fr);gap:0.3rem;margin-top:0.2rem}
.tg-thumb{position:relative;aspect-ratio:1;border-radius:0.45rem;overflow:hidden;cursor:pointer;background:var(--card-2)}
.tg-foot{display:flex;justify-content:space-between;align-items:center;margin-top:0.55rem;gap:0.5rem}
.mf-lp-badge{display:inline-flex;align-items:center;gap:0.25rem;font-size:0.68rem;color:var(--muted);background:rgba(120,120,150,0.14);border-radius:0.6rem;padding:0.1rem 0.45rem;white-space:nowrap;cursor:help}
.mf-lp-dot{width:0.58rem;height:0.58rem;border-radius:50%;display:inline-block;border:1px solid rgba(0,0,0,0.25);flex:0 0 auto}
.cat-bg-btn:hover,.cat-lp-btn:hover,.cat-sun-btn:hover{background:#fff;transform:scale(1.05);box-shadow:0 3px 10px rgba(0,0,0,0.3)}
.cat-meteo-map.bg-medium .leaflet-tile-pane{filter:brightness(0.55) saturate(0.85) contrast(1.05)}
.cat-meteo-map.bg-dark .leaflet-tile-pane,
.cat-meteo-map.bg-medium .leaflet-tile-pane{transition:filter 0.2s ease}
.cat-meteo-map.is-loading{opacity:0.4;pointer-events:none}
.cat-meteo-status{margin-top:0.45rem;font-size:0.78rem;color:var(--muted);text-align:right;font-style:italic}
.cat-meteo-status.err{color:var(--danger);font-style:normal}
/* Marker meteo personalitzat */
.cat-marker{display:flex;flex-direction:column;align-items:center;gap:2px;pointer-events:auto;cursor:pointer;transition:transform .12s ease-out}
.cat-marker:hover{transform:scale(1.15);z-index:1000}
.cat-marker-icon{font-size:30px;line-height:1;filter:drop-shadow(0 1px 2px rgba(0,0,0,0.35)) drop-shadow(0 0 3px rgba(255,255,255,0.6))}
.cat-marker-val{background:rgba(15,23,42,0.92);color:#fff;font-weight:700;font-size:11px;padding:2px 7px;border-radius:8px;text-shadow:none;border:1.5px solid rgba(255,255,255,0.85);min-width:34px;text-align:center;white-space:nowrap;line-height:1.4;box-shadow:0 2px 6px rgba(0,0,0,0.25)}
.cat-marker-val.warm{background:linear-gradient(135deg,#dc2626,#ea580c);border-color:rgba(255,255,255,0.9)}
.cat-marker-val.cold{background:linear-gradient(135deg,#1e40af,#0ea5e9);border-color:rgba(255,255,255,0.9)}
.cat-marker-val.windy{background:linear-gradient(135deg,#16a34a,#22d3ee);border-color:rgba(255,255,255,0.9)}
.cat-marker-val.rainy{background:linear-gradient(135deg,#0369a1,#0ea5e9);border-color:rgba(255,255,255,0.9)}
/* 👑 Modes 💧: el lloc on més ha plogut, destacat */
.cat-marker-maxpin{position:absolute;top:-13px;font-size:17px;filter:drop-shadow(0 2px 4px rgba(0,0,0,0.45));animation:userPinBounce 1.8s infinite ease-in-out;z-index:4}
.cat-marker-val.max-rain{background:linear-gradient(135deg,#0c4a6e,#06b6d4)!important;border:2px solid #7dd3fc!important;font-size:12.5px;font-weight:800;padding:2px 9px;box-shadow:0 0 12px rgba(56,189,248,0.8)}
.cat-marker-val.cloud-clear{background:linear-gradient(135deg,#15803d,#22c55e);border-color:rgba(255,255,255,0.9)}
.cat-marker-val.cloud-part{background:linear-gradient(135deg,#a16207,#eab308);border-color:rgba(255,255,255,0.9)}
.cat-marker-val.cloud-over{background:linear-gradient(135deg,#334155,#64748b);border-color:rgba(255,255,255,0.9)}
.cat-marker-name{background:rgba(255,255,255,0.92);color:#0f172a;font-size:9px;padding:1px 5px;border-radius:3px;text-shadow:none;font-weight:600;letter-spacing:0.2px;line-height:1.5;max-width:90px;text-align:center;border:1px solid rgba(0,0,0,0.1)}
/* Ordre de capes DINS del marker: el valor sempre per sobre de tot, el nom sota */
.cat-marker-val{position:relative;z-index:3}
.cat-marker-name{position:relative;z-index:2}
/* Mode azimuts: el nom de la ubicacio seleccionada es veu SEMPRE (tambe a zoom baix) */
.cat-marker-wrap.sun-focus .cat-marker-name{display:block!important;background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff;font-weight:700;border:1px solid rgba(255,255,255,0.7)}
/* Molt allunyat (zoom ≤7): amagar els noms — només icona + valor, sense embolics */
.cat-meteo-map.cat-z-low .cat-marker-name{display:none}
/* === MARKER UBICACIÓ DE L'USUARI (destacat) === */
.cat-marker.is-user-loc{position:relative;z-index:500}
.cat-marker.is-user-loc .cat-marker-icon{font-size:36px;filter:drop-shadow(0 2px 4px rgba(0,0,0,0.5)) drop-shadow(0 0 6px rgba(255,193,7,0.65))}
.cat-marker-userpin{position:absolute;top:-12px;font-size:18px;animation:userPinBounce 1.8s infinite ease-in-out;filter:drop-shadow(0 2px 4px rgba(0,0,0,0.4))}
.cat-marker-val.user-val{background:linear-gradient(135deg,#fbbf24,#dc2626)!important;border:2px solid rgba(255,255,255,0.95)!important;font-size:12.5px;font-weight:800;padding:2px 9px;box-shadow:0 3px 10px rgba(220,38,38,0.45)}
.cat-marker-name.user-name{background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#fff;font-weight:700;font-size:9.5px;border:1px solid rgba(255,255,255,0.7);box-shadow:0 2px 5px rgba(0,0,0,0.2);max-width:110px}
@keyframes userPinBounce{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-4px)}
}
/* === MARKER GEOLOCALITZACIÓ GPS (anell pulsant blau) === */
.cat-marker.is-gps-loc{position:relative;z-index:600}
.cat-marker.is-gps-loc .cat-marker-icon{font-size:34px;filter:drop-shadow(0 2px 4px rgba(0,0,0,0.5)) drop-shadow(0 0 8px rgba(59,130,246,0.75))}
.cat-marker-gpspin{position:absolute;top:-12px;font-size:18px;animation:gpsPinPulse 1.4s infinite ease-in-out;filter:drop-shadow(0 2px 4px rgba(0,0,0,0.4))}
.cat-marker-val.gps-val{background:linear-gradient(135deg,#3b82f6,#1d4ed8)!important;border:2px solid rgba(255,255,255,0.95)!important;font-size:12.5px;font-weight:800;padding:2px 9px;box-shadow:0 3px 10px rgba(29,78,216,0.5)}
.cat-marker-name.gps-name{background:linear-gradient(135deg,#3b82f6,#1d4ed8);color:#fff;font-weight:700;font-size:9.5px;border:1px solid rgba(255,255,255,0.7);box-shadow:0 2px 5px rgba(0,0,0,0.25);max-width:110px}
.cat-marker-name.selected-name{background:linear-gradient(135deg,#10b981,#059669);color:#fff;font-weight:700;font-size:9.5px;border:1px solid rgba(255,255,255,0.7);box-shadow:0 2px 5px rgba(0,0,0,0.25);max-width:110px}
.cat-marker-val.selected-val{background:#10b981;color:#fff;font-weight:700}
.cat-marker.is-selected-loc{filter:drop-shadow(0 0 4px rgba(16,185,129,0.6))}
.cat-marker-selectedpin{position:absolute;top:-6px;left:50%;transform:translateX(-50%);font-size:16px;text-shadow:0 1px 2px rgba(0,0,0,0.5);z-index:2}
.cat-marker-wrap.is-gps::before{content:'';position:absolute;left:50%;top:50%;width:18px;height:18px;border-radius:50%;background:rgba(59,130,246,0.55);transform:translate(-50%,-50%);animation:gpsRing 1.8s infinite ease-out;pointer-events:none;z-index:-1}
@keyframes gpsPinPulse{
  0%,100%{transform:scale(1)}
  50%{transform:scale(1.15)}
}
@keyframes gpsRing{
  0%{width:18px;height:18px;opacity:0.7}
  100%{width:70px;height:70px;opacity:0}
}

/* === MODAL ADMIN: USUARIS CONNECTATS === */
.admin-online-row{display:flex;align-items:center;justify-content:space-between;gap:0.7rem;padding:0.65rem 0.8rem;background:var(--card-2);border-radius:0.5rem;margin-bottom:0.45rem;border:1px solid var(--border);transition:all .12s}
.admin-online-row:hover{transform:translateX(2px);border-color:var(--accent)}
.admin-online-row.is-registered{border-left:3px solid #16a34a}
.aor-left{display:flex;align-items:center;gap:0.7rem;flex:1;min-width:0}
.aor-icon{font-size:1.5rem;flex-shrink:0;width:32px;text-align:center}
.aor-info{flex:1;min-width:0}
.aor-email{font-weight:600;font-size:0.88rem;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;align-items:center;gap:0.4rem}
.aor-badge{display:inline-block;font-size:0.62rem;font-weight:700;padding:1px 5px;border-radius:3px;background:linear-gradient(135deg,#16a34a,#15803d);color:#fff;letter-spacing:0.4px}
.aor-meta{display:flex;gap:0.7rem;flex-wrap:wrap;font-size:0.72rem;color:var(--muted);margin-top:2px}
.aor-meta span{white-space:nowrap}
.aor-right{display:flex;flex-direction:column;align-items:flex-end;gap:2px;flex-shrink:0;font-size:0.72rem;color:var(--muted)}
.aor-time{font-weight:600;color:var(--accent)}
.aor-duration{color:var(--muted)}
/* === AGRUPACIÓ DE SESSIONS (v20h45 · Opció A) === */
.admin-online-row.is-group{padding:0;display:block}
.admin-online-row.is-group .aor-summary{display:flex;align-items:center;justify-content:space-between;gap:0.7rem;padding:0.65rem 0.8rem;cursor:pointer;list-style:none;user-select:none}
.admin-online-row.is-group .aor-summary::-webkit-details-marker{display:none}
.admin-online-row.is-group .aor-summary:hover{background:rgba(255,255,255,0.03)}
.admin-online-row.is-group .aor-summary-chevron{font-size:1rem;color:var(--muted);transition:transform 0.18s ease;flex-shrink:0}
.admin-online-row.is-group[open] .aor-summary-chevron{transform:rotate(180deg)}
.aor-multi{display:inline-block;font-size:0.62rem;font-weight:700;padding:1px 6px;border-radius:3px;background:linear-gradient(135deg,#6366f1,#8b5cf6);color:#fff;letter-spacing:0.3px;margin-left:0.3rem}
.aor-multi-one{background:linear-gradient(135deg,#475569,#334155)}
.aor-meta-compact{font-size:0.72rem;color:var(--muted);margin-top:2px;display:flex;gap:0.5rem;flex-wrap:wrap}
.aor-subsessions{border-top:1px solid var(--border);padding:0.3rem 0.8rem 0.55rem;background:rgba(255,255,255,0.02)}
.aor-subsession{display:flex;align-items:center;justify-content:space-between;gap:0.5rem;padding:0.4rem 0;border-bottom:1px dashed rgba(255,255,255,0.08);font-size:0.78rem}
.aor-subsession:last-child{border-bottom:none}
.aor-sub-left{display:flex;gap:0.6rem;align-items:center;flex-wrap:wrap;color:var(--muted);min-width:0;flex:1}
.aor-sub-left .aor-sub-sid{color:var(--text);font-family:monospace;font-size:0.74rem;background:rgba(255,255,255,0.04);padding:1px 5px;border-radius:3px}
.aor-sub-right{display:flex;gap:0.6rem;flex-shrink:0;font-size:0.7rem;color:var(--muted)}
.aor-sub-right .aor-time{font-weight:600;color:var(--accent)}
@media(max-width:600px){
  .admin-online-row{flex-wrap:wrap;gap:0.4rem}
  .aor-meta{font-size:0.68rem;gap:0.4rem}
  .aor-subsession{flex-wrap:wrap;gap:0.3rem}
}

/* === MODAL DE BENVINGUDA PERSONAL === */
.personal-welcome-modal{box-shadow:0 25px 80px rgba(0,0,0,0.35), 0 0 0 1px rgba(255,255,255,0.1);animation:pwScale .35s ease-out}
.pw-header{position:relative;overflow:hidden}
.pw-confetti{position:absolute;font-size:3rem;opacity:0.18;top:-0.5rem;right:0.8rem;transform:rotate(15deg);pointer-events:none}
.pw-ok-btn:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(0,0,0,0.25)!important}
.pw-ok-btn:active{transform:translateY(0)}
@keyframes pwScale{
  from{transform:scale(0.85);opacity:0}
  to{transform:scale(1);opacity:1}
}

/* === MODAL EQUIP === */
.team-modal-box{border-radius:1rem;background:var(--card);overflow:hidden}
.team-modal-header{background:linear-gradient(135deg,#168ad9 0%,#7c3aed 50%,#dc2626 100%);color:#fff;padding:1.6rem 1.5rem 1.4rem;text-align:center;position:relative}
.team-modal-logo{width:84px;height:84px;display:block;margin:0 auto 0.5rem;filter:drop-shadow(0 4px 14px rgba(0,0,0,0.35));border-radius:14px;background:rgba(255,255,255,0.12);padding:6px;backdrop-filter:blur(6px)}
.team-modal-brand{font-family:'Cormorant Garamond',Georgia,'Times New Roman',serif;font-size:2.2rem;font-weight:600;line-height:1;margin:0.1rem 0 0.5rem;letter-spacing:0.005em;text-shadow:0 2px 8px rgba(0,0,0,0.25)}
.tm-brand-meteo{color:#fff}
.tm-brand-sep{color:#fff;margin:0 0.05em;opacity:0.85;font-weight:500}
.tm-brand-foto{color:#fbbf24}
.team-modal-title{color:#fff!important;margin:0!important;font-size:1.2rem;font-weight:700;letter-spacing:0.2px;opacity:0.95}
.team-modal-sub{margin:0.3rem 0 0;opacity:0.85;font-size:0.85rem;font-weight:400;font-style:italic}
.team-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;padding:1.3rem 1.2rem 1rem}
.team-card{background:var(--card-2);border:1px solid var(--border);border-radius:0.85rem;padding:1.1rem 1rem;text-align:center;transition:all .2s;display:flex;flex-direction:column;align-items:center}
.team-card:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,0.12)}
.team-card-jaume{border-top:4px solid #c6a877}
.team-card-eloi{border-top:4px solid #7c3aed}
.team-avatar{width:84px;height:84px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:2.2rem;margin:0 auto 0.7rem;box-shadow:0 6px 20px rgba(0,0,0,0.2);color:#fff;flex-shrink:0}
/* === AVATAR MINI per modal Team unificat (v09h30) === */
.team-avatar-mini{width:54px;height:54px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.55rem;margin:0 auto 0.5rem;box-shadow:0 4px 12px rgba(0,0,0,0.18);color:#fff;flex-shrink:0}
/* === LAYOUT 2 COLUMNES (v09h45) === */
.team-cols{display:grid;grid-template-columns:1fr 1fr;gap:0.9rem;margin-bottom:1rem}
.team-col-card{background:var(--card-2);padding:1rem 0.95rem;border-radius:0.6rem;line-height:1.5;display:flex;flex-direction:column;align-items:center}
.team-col-name{font-size:1.1rem;font-weight:700;color:var(--text);margin-bottom:0.15rem}
.team-col-role{font-size:0.78rem;color:var(--muted);margin-bottom:0.6rem;text-align:center}
.team-col-bio{font-size:0.83rem;color:var(--muted-2);margin:0 0 0.7rem;line-height:1.45;text-align:center;flex-grow:1}
.team-col-links{display:flex;flex-direction:column;gap:0.25rem;font-size:0.82rem;width:100%;align-items:center}
.team-col-links a{color:var(--accent);text-decoration:none;font-weight:500;white-space:nowrap}
.team-col-links a:hover{text-decoration:underline}
.team-col-links span{white-space:nowrap}
@media(max-width:560px){
  .team-cols{grid-template-columns:1fr;gap:0.7rem}
  .team-col-card{padding:0.85rem 0.9rem}
}
.team-name{margin:0 0 0.2rem!important;font-size:1.15rem!important;font-weight:700!important;color:var(--text)!important;font-family:inherit!important}
.team-role{font-size:0.82rem;color:var(--accent);font-weight:600;letter-spacing:0.2px;margin-bottom:0.7rem}
.team-bio{font-size:0.83rem;color:var(--text);line-height:1.55;margin:0 0 0.8rem;text-align:left;flex:1}
.team-bio strong{color:var(--text);font-weight:700}
.team-tags{display:flex;flex-wrap:wrap;gap:0.3rem;justify-content:center;margin-bottom:0.8rem}
.team-tag{font-size:0.7rem;background:var(--card);border:1px solid var(--border);padding:2px 7px;border-radius:0.3rem;color:var(--muted);font-weight:500;white-space:nowrap}
.team-links{display:flex;gap:0.45rem;justify-content:center;flex-wrap:wrap}
.team-links a, .team-link-placeholder{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:var(--card);border:1px solid var(--border);color:var(--text);text-decoration:none;font-size:1.05rem;transition:all .15s}
.team-links a:hover{background:var(--accent);color:#fff;border-color:transparent;transform:translateY(-2px);box-shadow:0 4px 10px rgba(22,138,173,0.3)}
.team-link-placeholder{opacity:0.25;cursor:not-allowed}
.team-footer{padding:0.9rem 1.5rem 1.2rem;text-align:center;background:var(--card-2);border-top:1px solid var(--border);font-size:0.85rem;color:var(--muted);line-height:1.55}
.team-footer p{margin:0}

#modalAuthorLogo:hover{transform:scale(1.05) rotate(-2deg)}

/* === COMPARTIR APP (v18h45) === */
.share-app-section{background:linear-gradient(135deg,rgba(22,138,217,0.07),rgba(168,85,247,0.07));border:1px solid rgba(22,138,217,0.18);padding:0.7rem 0.85rem 0.85rem;border-radius:0.55rem;margin-bottom:0.9rem}
.share-app-title{font-size:0.74rem;color:var(--muted);margin-bottom:0.55rem;font-weight:700;letter-spacing:0.03em;text-transform:uppercase;text-align:center}
.share-app-buttons{display:flex;gap:0.4rem;justify-content:center;flex-wrap:wrap}
.share-app-btn{display:inline-flex;align-items:center;gap:0.35rem;padding:0.45rem 0.8rem;font-size:0.84rem;font-weight:600;background:var(--card-2);border:1px solid var(--border);color:var(--text);border-radius:0.45rem;cursor:pointer;transition:all 0.15s ease;min-width:auto;line-height:1}
.share-app-btn:hover{transform:translateY(-1px);box-shadow:0 3px 8px rgba(0,0,0,0.12)}
.share-app-btn-icon{font-size:0.95rem;line-height:1}
.share-app-btn-email:hover{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border-color:#2563eb}
.share-app-btn-whatsapp:hover{background:linear-gradient(135deg,#25d366,#128c7e);color:#fff;border-color:#128c7e}
.share-app-btn-copy:hover{background:linear-gradient(135deg,#a78bfa,#7c3aed);color:#fff;border-color:#7c3aed}
.share-app-btn-native:hover{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff;border-color:#d97706}
.mf-mapshare-ov{position:fixed;inset:0;z-index:100000;background:rgba(0,0,0,0.55);display:flex;align-items:center;justify-content:center;padding:1rem}
.mf-mapshare-card{background:var(--card,#fff);color:var(--text,#0f172a);border:1px solid var(--border,#dde);border-radius:0.9rem;max-width:420px;width:100%;padding:1rem 1.1rem;box-shadow:0 12px 40px rgba(0,0,0,0.45)}
.mf-mapshare-head{display:flex;align-items:center;justify-content:space-between;gap:0.5rem;font-size:1rem}
.mf-mapshare-x{background:transparent;border:none;font-size:1.1rem;cursor:pointer;color:var(--muted,#64748b);padding:2px 6px;line-height:1}
.mf-mapshare-sub{font-size:0.82rem;color:var(--muted,#64748b);margin-top:0.4rem;line-height:1.45}
.mf-mapshare-btns{display:flex;flex-wrap:wrap;gap:0.5rem;justify-content:center;margin:0.7rem 0 0.5rem}
.mf-mapshare-url{width:100%;padding:0.5rem 0.6rem;border:1px solid var(--border,#dde);border-radius:0.5rem;background:var(--card-2,#f1f5f9);color:var(--text,#0f172a);font-size:0.76rem;font-family:monospace;box-sizing:border-box}
.share-app-btn.is-copied{background:linear-gradient(135deg,#10b981,#059669)!important;color:#fff!important;border-color:#059669!important;pointer-events:none}
@media(max-width:480px){
  .share-app-btn{padding:0.4rem 0.6rem;font-size:0.78rem;gap:0.3rem}
  .share-app-btn-icon{font-size:0.85rem}
}

@media(max-width:600px){
  .team-grid{grid-template-columns:1fr;gap:0.7rem;padding:1rem}
  .team-modal-logo{width:64px;height:64px;padding:5px}
  .team-modal-brand{font-size:1.7rem}
  .team-modal-title{font-size:1rem}
  .team-modal-sub{font-size:0.78rem}
  .team-avatar{width:72px;height:72px;font-size:1.9rem}
  .team-name{font-size:1.05rem!important}
  .team-bio{font-size:0.8rem}
}
.joke-hero-card{background:linear-gradient(135deg,#fbbf24 0%,#f59e0b 50%,#dc2626 100%);color:#fff;border:none;text-align:center;padding:1.4rem 1.2rem 1.6rem}
.joke-hero-title{color:#fff!important;margin:0 0 0.3rem!important;font-size:1.7rem;font-weight:800;text-shadow:0 2px 5px rgba(0,0,0,0.18)}
.joke-hero-sub{margin:0 0 1rem;font-size:0.92rem;opacity:0.95;font-weight:500}
.joke-filter-row{display:inline-flex;gap:0.3rem;background:rgba(255,255,255,0.18);padding:0.3rem;border-radius:0.65rem;backdrop-filter:blur(8px);flex-wrap:wrap;justify-content:center}
.joke-filter-btn{background:transparent;border:none;color:rgba(255,255,255,0.85);padding:0.45rem 0.9rem;border-radius:0.5rem;font-size:0.85rem;font-weight:600;cursor:pointer;transition:all .15s;white-space:nowrap}
.joke-filter-btn:hover{background:rgba(255,255,255,0.15);color:#fff}
.joke-filter-btn.active{background:rgba(255,255,255,0.95);color:#dc2626;box-shadow:0 2px 8px rgba(0,0,0,0.18)}

.joke-display-card{padding:1.2rem 1rem!important;min-height:240px;display:flex;flex-direction:column;justify-content:space-between}
.joke-display{flex:1;display:flex;align-items:center;justify-content:center;text-align:center;padding:1.2rem 0.6rem;font-size:1.15rem;line-height:1.6;color:var(--text);font-weight:500;font-family:Georgia,serif;font-style:italic;min-height:140px;position:relative}
.joke-display.fade{opacity:0;transform:translateY(8px);transition:all .25s ease}
.joke-display.show{opacity:1;transform:translateY(0);transition:all .35s ease}
.joke-text{position:relative;max-width:560px;margin:0 auto}
.joke-text::before{content:'"';position:absolute;left:-1.5rem;top:-1rem;font-size:3.5rem;color:#fbbf24;opacity:0.35;font-family:Georgia,serif;line-height:1}
.joke-text::after{content:'"';position:absolute;right:-1.5rem;bottom:-2rem;font-size:3.5rem;color:#fbbf24;opacity:0.35;font-family:Georgia,serif;line-height:1}
.joke-category-tag{display:inline-block;font-size:0.7rem;font-weight:700;padding:2px 8px;border-radius:0.3rem;margin-top:0.7rem;letter-spacing:0.4px;text-transform:uppercase;font-family:inherit;font-style:normal}
.joke-category-tag.meteo{background:linear-gradient(135deg,#0ea5e9,#0369a1);color:#fff}
.joke-category-tag.meteofoto{background:linear-gradient(135deg,#a855f7,#7c3aed);color:#fff}
.joke-loading{color:var(--muted);font-style:italic;font-family:inherit}
.joke-empty{color:var(--muted);font-style:italic;font-family:inherit}

.joke-controls{display:flex;gap:0.5rem;align-items:center;justify-content:center;margin-top:0.8rem;flex-wrap:wrap}
.joke-nav-btn{background:var(--card-2);border:1px solid var(--border);width:42px;height:42px;border-radius:50%;font-size:1.4rem;font-weight:700;cursor:pointer;color:var(--text);transition:all .15s;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.joke-nav-btn:hover{background:var(--accent);color:#fff;transform:scale(1.08)}
.joke-laugh-btn{background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#fff;border:none;padding:0.5rem 0.9rem;border-radius:1.2rem;font-weight:700;cursor:pointer;display:flex;align-items:center;gap:0.45rem;font-size:0.88rem;box-shadow:0 3px 10px rgba(245,158,11,0.35);transition:all .15s}
.joke-laugh-btn:hover{transform:translateY(-1px);box-shadow:0 5px 14px rgba(245,158,11,0.45)}
.joke-laugh-btn:active{transform:scale(0.95)}
.joke-laugh-btn.laughed{background:linear-gradient(135deg,#16a34a,#15803d);box-shadow:0 3px 10px rgba(22,163,74,0.35)}
.jl-icon{font-size:1.1rem}
.jl-count{background:rgba(255,255,255,0.25);padding:1px 7px;border-radius:0.8rem;font-size:0.78rem;font-weight:700;min-width:22px;text-align:center}
.joke-share-btn{background:var(--card-2);border:1px solid var(--border);width:42px;height:42px;border-radius:50%;font-size:1.1rem;cursor:pointer;color:var(--text);transition:all .15s;display:flex;align-items:center;justify-content:center}
.joke-share-btn:hover{background:rgba(22,138,173,0.12);border-color:var(--accent)}
.joke-counter{text-align:center;margin-top:0.7rem;font-size:0.78rem;color:var(--muted);font-weight:500}

/* Admin */
.joke-admin-row{display:flex;align-items:flex-start;gap:0.6rem;padding:0.55rem 0.7rem;background:var(--card-2);border-radius:0.45rem;margin-bottom:0.4rem;border:1px solid var(--border)}
.jar-text{flex:1;font-size:0.85rem;line-height:1.45;color:var(--text)}
.jar-meta{display:flex;align-items:center;gap:0.5rem;margin-top:0.25rem;font-size:0.7rem;color:var(--muted)}
.jar-cat{font-weight:700;padding:1px 5px;border-radius:0.25rem;font-size:0.65rem;text-transform:uppercase;letter-spacing:0.3px}
.jar-cat.meteo{background:#0ea5e9;color:#fff}
.jar-cat.meteofoto{background:#a855f7;color:#fff}
.jar-del{background:none;border:1px solid var(--border);color:var(--danger);width:28px;height:28px;border-radius:0.3rem;cursor:pointer;font-size:0.85rem;transition:all .12s;flex-shrink:0}
.jar-del:hover{background:var(--danger);color:#fff;border-color:var(--danger)}

@media(max-width:600px){
  .joke-hero-title{font-size:1.35rem}
  .joke-display{font-size:1.02rem;padding:0.8rem 0.4rem}
  .joke-text::before,.joke-text::after{display:none}
  .joke-laugh-btn{font-size:0.8rem;padding:0.4rem 0.7rem}
  .jl-label{display:none}
}
/* Popup Leaflet customitzat */
.leaflet-popup-content-wrapper{background:#0f172a !important;color:#fff !important;border-radius:0.55rem !important;box-shadow:0 8px 32px rgba(0,0,0,0.5) !important}
.leaflet-popup-tip{background:#0f172a !important}
.leaflet-popup-content{margin:0.6rem 0.8rem !important;font-size:0.82rem;line-height:1.4;min-width:220px;max-width:280px}
.leaflet-popup-content strong{color:#facc15;display:block;font-size:0.95rem}
/* Capçalera del popup: icona meteo grossa + nom + condició */
.cat-popup-header{display:flex;align-items:center;gap:0.7rem;padding-bottom:0.5rem;margin-bottom:0.4rem;border-bottom:1px solid rgba(255,255,255,0.12)}
.cat-popup-bigicon{font-size:2.6rem;line-height:1;flex-shrink:0;filter:drop-shadow(0 2px 6px rgba(0,0,0,0.6));text-shadow:0 0 12px rgba(250,204,21,0.25)}
.cat-popup-headtext{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.cat-popup-headtext strong{margin:0!important;font-size:1.05rem!important;line-height:1.15}
.cat-popup-cond{font-size:0.78rem;color:rgba(255,255,255,0.85);font-weight:500;text-transform:capitalize;line-height:1.25}
.cat-popup-date{font-size:0.68rem;color:rgba(255,255,255,0.55);margin-top:1px;font-style:italic}
.cat-popup-row{display:flex;justify-content:space-between;gap:0.8rem;padding:2px 0;border-bottom:1px solid rgba(255,255,255,0.08)}
.cat-popup-row:last-child{border:none}
.cat-popup-row span:first-child{color:rgba(255,255,255,0.7);font-size:0.78rem}
.cat-popup-row span:last-child{font-weight:600}
/* === SÍNTESI + FOTOGRAFIA (v17h45) === */
.cat-popup-section-title{font-size:0.7rem;font-weight:700;letter-spacing:0.04em;text-transform:uppercase;color:#facc15;display:block;margin-bottom:0.2rem}
.cat-popup-synthesis{margin-top:0.55rem;padding-top:0.45rem;border-top:1px solid rgba(255,255,255,0.12)}
.cat-popup-synthesis-text{font-size:0.82rem;line-height:1.35;color:rgba(255,255,255,0.92);font-style:italic}
.cat-popup-photo{margin-top:0.5rem;padding-top:0.45rem;border-top:1px solid rgba(255,255,255,0.12)}
.cat-popup-photo-head{display:flex;align-items:center;justify-content:space-between;gap:0.5rem;margin-bottom:0.3rem;flex-wrap:wrap}
.cat-popup-photo-head .cat-popup-section-title{margin-bottom:0}
.cat-photo-rating{display:inline-flex;align-items:center;gap:0.35rem;font-size:0.72rem}
.cat-photo-stars{color:#fbbf24;letter-spacing:0.5px;font-size:0.82rem;line-height:1}
.cat-photo-stars-off{color:rgba(255,255,255,0.25)}
.cat-photo-quality{color:#fbbf24;font-weight:700;font-size:0.7rem;text-transform:uppercase;letter-spacing:0.03em}
.cat-popup-photo-rec{display:flex;align-items:flex-start;gap:0.45rem;padding:3px 0;font-size:0.78rem;line-height:1.3;color:rgba(255,255,255,0.88)}
.cat-popup-photo-icon{flex-shrink:0;font-size:0.95rem;line-height:1.25}
/* === Franges fotogràfiques horàries (accordió tancat per defecte) === */
.cat-popup-hourly{margin-top:0.55rem;padding-top:0.45rem;border-top:1px solid rgba(255,255,255,0.12)}
.cat-popup-hourly>summary{list-style:none;cursor:pointer;font-size:0.7rem;font-weight:700;letter-spacing:0.04em;text-transform:uppercase;color:#facc15;display:flex;align-items:center;gap:0.4rem;user-select:none;outline:none}
.cat-popup-hourly>summary::-webkit-details-marker{display:none}
.cat-popup-hourly>summary::before{content:'▸';font-size:0.65rem;color:rgba(250,204,21,0.7);transition:transform 0.15s ease}
.cat-popup-hourly[open]>summary::before{transform:rotate(90deg)}
.cat-popup-hourly>summary:hover{color:#fde047}
.cat-popup-hourly-table{margin-top:0.4rem;display:flex;flex-direction:column;gap:1px;background:rgba(0,0,0,0.18);border-radius:6px;padding:4px 6px}
.cat-popup-hourly-row{display:grid;grid-template-columns:auto auto 1fr;gap:0.5rem;align-items:center;padding:3px 0;font-size:0.72rem;line-height:1.25;color:rgba(255,255,255,0.92);border-bottom:1px solid rgba(255,255,255,0.06)}
.cat-popup-hourly-row:last-child{border:none}
.cat-popup-hourly-row .hslot-label{font-weight:600;white-space:nowrap}
.cat-popup-hourly-row .hslot-time{color:rgba(255,255,255,0.55);font-variant-numeric:tabular-nums;font-size:0.68rem;white-space:nowrap}
.cat-popup-hourly-row .hslot-data{color:rgba(255,255,255,0.78);text-align:right;font-variant-numeric:tabular-nums;font-size:0.7rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cat-popup-hourly-empty{font-size:0.72rem;color:rgba(255,255,255,0.55);font-style:italic;padding:6px 4px;text-align:center}
/* === Gràfic horari del dia (estil Google) === */
.cat-popup-chart{margin-top:0.55rem;padding-top:0.45rem;border-top:1px solid rgba(255,255,255,0.12)}
.cat-popup-chart>summary{list-style:none;cursor:pointer;font-size:0.7rem;font-weight:700;letter-spacing:0.04em;text-transform:uppercase;color:#facc15;display:flex;align-items:center;gap:0.4rem;user-select:none;outline:none}
.cat-popup-chart>summary::-webkit-details-marker{display:none}
.cat-popup-chart>summary::before{content:'▸';font-size:0.65rem;color:rgba(250,204,21,0.7);transition:transform 0.15s ease}
.cat-popup-chart[open]>summary::before{transform:rotate(90deg)}
.cat-popup-chart>summary:hover{color:#fde047}
.cat-chart-block{margin-top:0.4rem;display:flex;flex-direction:column;gap:0.45rem;background:rgba(0,0,0,0.18);border-radius:6px;padding:6px 4px 4px}
.cat-chart-row-label{display:flex;align-items:center;gap:0.35rem;font-size:0.7rem;font-weight:600;color:rgba(255,255,255,0.82);padding:0 4px;line-height:1}
.cat-chart-row-label .cat-chart-row-stats{margin-left:auto;color:rgba(255,255,255,0.55);font-weight:500;font-variant-numeric:tabular-nums;font-size:0.65rem}
.cat-chart-svg{display:block;width:100%;height:auto;overflow:visible}
.cat-chart-svg .cat-chart-val{font-size:8.5px;font-weight:600;fill:rgba(255,255,255,0.95);font-family:system-ui,-apple-system,sans-serif}
.cat-chart-svg .cat-chart-hour{font-size:8px;fill:rgba(255,255,255,0.5);font-family:system-ui,-apple-system,sans-serif;font-variant-numeric:tabular-nums}
.cat-chart-svg .cat-chart-bar-val{font-size:8px;font-weight:600;font-family:system-ui,-apple-system,sans-serif}
.cat-chart-svg .cat-chart-empty-msg{font-size:9.5px;font-style:italic;font-family:system-ui,-apple-system,sans-serif;fill:rgba(255,255,255,0.5)}
.cat-chart-empty{font-size:0.72rem;color:rgba(255,255,255,0.55);font-style:italic;padding:6px 4px;text-align:center}
/* === Tabs dins el popup (Ara/Gràfic/Fotografia) — CSS-only amb radios === */
.cat-popup-tabs-container{position:relative;margin-top:0.5rem}
.cat-popup-tabs-container>input[type="radio"]{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;pointer-events:none}
/* === Hero photo a l'inici de cada pestanya de guia === */
.mf-ecl-cta{display:block;width:100%;margin-top:0.55rem;padding:0.7rem 0.8rem;background:linear-gradient(135deg,#7c3aed,#4f46e5);color:#fff;border:none;border-radius:0.6rem;font-size:0.95rem;font-weight:800;cursor:pointer;box-shadow:0 3px 12px rgba(124,58,237,0.4);transition:transform 0.12s,box-shadow 0.12s;}
/* Pantalla gran: els botons de simulació no s'estiren a tota l'amplada
   (quedaven exagerats al PC/Mac). Mida segons contingut, més compactes,
   i el parell Street View + càmera va en línia. Mòbil: sense canvis. */
@media(min-width:700px){
  .mf-ecl-cta{display:inline-flex;align-items:center;justify-content:center;width:auto;padding:0.5rem 1.1rem;font-size:0.86rem;margin-top:0;box-shadow:0 2px 8px rgba(124,58,237,0.3);}
}
.mf-ecl-cta:hover{transform:translateY(-1px);box-shadow:0 5px 16px rgba(124,58,237,0.55);}
.mf-ecl-cta:active{transform:translateY(0);}
.guide-hero-photo{margin:-0.9rem 0 0.4rem;border-radius:0.8rem;overflow:hidden;background:var(--card-2);box-shadow:0 4px 16px rgba(0,0,0,0.25);position:relative}
@media(max-width:600px){.guide-hero-photo{margin-left:-1rem;margin-right:-1rem;border-radius:0;margin-top:-0.5rem}}
.guide-hero-photo.is-loading{min-height:200px;background:linear-gradient(110deg,var(--card-2) 30%,var(--card-3) 50%,var(--card-2) 70%);background-size:200% 100%;animation:guideHeroShimmer 1.4s ease-in-out infinite}
@keyframes guideHeroShimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
.guide-hero-photo.is-empty{display:none}
.guide-hero-photo img{width:100%;height:auto;max-height:420px;object-fit:cover;display:block}
@media(max-width:600px){.guide-hero-photo img{max-height:280px}}
.guide-hero-photo-caption{padding:0.6rem 0.95rem;font-size:0.82rem;color:var(--muted);background:rgba(0,0,0,0.6);position:absolute;bottom:0;left:0;right:0;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.guide-hero-photo-caption strong{color:#fff;font-weight:700}
.guide-hero-photo-caption a{color:#facc15;text-decoration:none}
.guide-hero-photo-caption a:hover{text-decoration:underline}
/* === Sub-tabs dins d'una pestanya de guia (només circumpolar de moment) === */
.guide-subnav{display:flex;gap:0.3rem;margin:0.4rem 0 1rem;border-bottom:2px solid var(--border);flex-wrap:wrap;background:var(--bg);padding-bottom:0}
.guide-subnav button{flex:1;min-width:110px;padding:0.7rem 0.5rem;background:transparent;border:none;border-bottom:3px solid transparent;margin-bottom:-2px;color:var(--muted);cursor:pointer;font-size:0.88rem;font-weight:600;transition:color 0.15s,border-bottom-color 0.15s;font-family:inherit;border-radius:0}
.guide-subnav button:hover{color:var(--text)}
.guide-subnav button.active{color:#06b6d4;border-bottom-color:#06b6d4}
.guide-subpane{display:flex;flex-direction:column;gap:1.5rem}
.guide-subpane[hidden]{display:none}
.guide-intro-card{background:linear-gradient(135deg,rgba(34,197,94,0.12),rgba(16,185,129,0.06));border-left:3px solid #10b981;padding:0.9rem 1rem !important}
.guide-intro-card p{color:var(--text);font-style:italic}
.guide-intro-card strong{color:#10b981;font-style:normal;font-weight:700}
.cat-popup-tabs-nav{display:flex;gap:0;border-bottom:1px solid rgba(255,255,255,0.15);margin-bottom:0.5rem}
.cat-popup-tabs-nav label{flex:1;cursor:pointer;padding:6px 3px;font-size:0.68rem;font-weight:700;text-transform:uppercase;letter-spacing:0.02em;color:rgba(255,255,255,0.5);text-align:center;border-bottom:2px solid transparent;margin-bottom:-1px;transition:color 0.15s,border-color 0.15s,background 0.15s;user-select:none;white-space:nowrap;line-height:1.15}
.cat-popup-tabs-nav label:hover{color:rgba(255,255,255,0.9);background:rgba(255,255,255,0.04)}
.cat-popup-pane{display:none;animation:catPopupFadeIn 0.18s ease-out}
@keyframes catPopupFadeIn{from{opacity:0;transform:translateY(-2px)}to{opacity:1;transform:translateY(0)}}
.cat-popup-tabs-container>input[id$="-ara"]:checked~.pane-ara,
.cat-popup-tabs-container>input[id$="-graf"]:checked~.pane-graf,
.cat-popup-tabs-container>input[id$="-foto"]:checked~.pane-foto,
.cat-popup-tabs-container>input[id$="-llamps"]:checked~.pane-llamps{display:block}
.cat-popup-tabs-container>input[id$="-ara"]:checked~.cat-popup-tabs-nav label[for$="-ara"],
.cat-popup-tabs-container>input[id$="-graf"]:checked~.cat-popup-tabs-nav label[for$="-graf"],
.cat-popup-tabs-container>input[id$="-foto"]:checked~.cat-popup-tabs-nav label[for$="-foto"],
.cat-popup-tabs-container>input[id$="-llamps"]:checked~.cat-popup-tabs-nav label[for$="-llamps"]{color:#facc15;border-bottom-color:#facc15;background:rgba(250,204,21,0.08)}
/* Dins els panells, eliminem els border-top redundants (ja no apileu seccions independents) */
.cat-popup-pane>.cat-popup-photo:first-child,
.cat-popup-pane>.cat-popup-synthesis:first-child{border-top:none;margin-top:0;padding-top:0}
.cat-popup-pane>.cat-popup-hourly{margin-top:0.6rem}
.cat-popup-pane>.cat-popup-chart{margin-top:0;padding-top:0;border-top:none}
/* === Modal flotant per a la info d'ubicació del mapa === */
.cat-map-modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,0.55);z-index:10000;opacity:0;transition:opacity 0.2s ease;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}
.cat-map-modal-backdrop.is-open{opacity:1}
.cat-map-modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-48%) scale(0.96);z-index:10001;width:min(360px,92vw);max-height:88vh;overflow-y:auto;background:linear-gradient(140deg,#1f2937 0%,#111827 100%);color:#fff;border:1px solid rgba(255,255,255,0.12);border-radius:12px;padding:14px 16px 16px;box-shadow:0 24px 64px rgba(0,0,0,0.55),0 4px 16px rgba(0,0,0,0.35);opacity:0;pointer-events:none;transition:opacity 0.2s ease,transform 0.22s cubic-bezier(0.16,1,0.3,1)}
.cat-map-modal.is-open{opacity:1;pointer-events:auto;transform:translate(-50%,-50%) scale(1)}
.cat-map-modal::-webkit-scrollbar{width:6px}
.cat-map-modal::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.2);border-radius:3px}
.cat-map-modal-close{position:absolute;top:8px;right:10px;background:rgba(255,255,255,0.08);border:none;color:rgba(255,255,255,0.7);width:28px;height:28px;border-radius:50%;cursor:pointer;font-size:18px;line-height:1;display:flex;align-items:center;justify-content:center;transition:background 0.15s,color 0.15s;z-index:2;padding:0}
.cat-map-modal-close:hover{background:rgba(255,255,255,0.18);color:#fff}
.cat-map-modal-close:focus{outline:2px solid #facc15;outline-offset:1px}
.cat-map-modal-content{display:block}
/* Navegador de dies dins del modal flotant del mapa (‹ data ›) */
.cat-popup-daynav{display:flex;align-items:stretch;gap:0.4rem;margin:0.3rem 0 0.55rem;padding:0.35rem 0.45rem;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);border-radius:0.55rem}
.cat-popup-daynav-btn{flex:0 0 auto;width:34px;background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.1);color:#facc15;font-size:1.15rem;font-weight:700;line-height:1;border-radius:0.4rem;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;transition:background 0.15s,border-color 0.15s,color 0.15s,transform 0.08s;font-family:inherit}
.cat-popup-daynav-btn:hover:not(:disabled){background:rgba(250,204,21,0.18);border-color:rgba(250,204,21,0.5);color:#fde047}
.cat-popup-daynav-btn:active:not(:disabled){transform:scale(0.94)}
.cat-popup-daynav-btn:focus-visible{outline:2px solid #facc15;outline-offset:1px}
.cat-popup-daynav-btn:disabled{opacity:0.28;cursor:default;color:rgba(255,255,255,0.4)}
.cat-popup-daynav-label{flex:1 1 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:1px;line-height:1.15;min-width:0;padding:0 0.2rem}
.cat-popup-daynav-date{font-size:0.82rem;font-weight:700;color:#fff;letter-spacing:-0.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.cat-popup-daynav-tag{font-size:0.6rem;font-weight:700;text-transform:uppercase;letter-spacing:0.05em;color:#0f172a;background:#facc15;padding:1px 5px;border-radius:3px;line-height:1.3;align-self:center;margin-top:1px}
.cat-popup-daynav-tag.future{background:rgba(99,102,241,0.85);color:#fff}
@media(max-width:480px){
  .cat-popup-daynav{gap:0.3rem;padding:0.3rem}
  .cat-popup-daynav-btn{width:30px;font-size:1.05rem}
  .cat-popup-daynav-date{font-size:0.78rem}
}
@media(max-width:480px){
  .cat-map-modal{width:94vw;padding:12px 12px 14px;max-height:90vh}
  .cat-map-modal-close{top:6px;right:8px;width:26px;height:26px;font-size:16px}
}
@media(max-width:600px){
  .cat-meteo-map{height:min(68vh,560px)}   /* 12-09 (Jaume): vertical al mòbil, aprofita la pantalla */
  .cat-mode-btn{font-size:0.72rem;padding:0.3rem 0.55rem}
  .cat-marker-icon{font-size:22px}
  .cat-marker-val{font-size:9.5px;min-width:26px;padding:1px 5px}
  .cat-marker-name{font-size:8px}
  .cat-popup-hourly-row{grid-template-columns:auto 1fr;gap:0.35rem}
  .cat-popup-hourly-row .hslot-time{grid-column:1;grid-row:2;font-size:0.62rem}
  .cat-popup-hourly-row .hslot-data{grid-column:2;grid-row:1/3}
}

/* === Presets de càmera per a guies fotogràfiques === */
.camera-presets-container{margin-bottom:1rem}
.camera-presets-title{font-size:1.05rem;font-weight:700;margin:0 0 0.5rem;color:var(--text);display:flex;align-items:center;gap:0.4rem}
.camera-presets-title small{font-size:0.78rem;font-weight:500;color:var(--muted)}
.camera-presets-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:0.7rem}
.camera-preset-card{background:var(--card);border:1px solid var(--border);border-radius:0.7rem;padding:0.75rem 0.9rem;display:flex;flex-direction:column;gap:0.4rem;box-shadow:0 1px 3px rgba(15,23,42,0.06),0 0 0 1px rgba(99,102,241,0.06)}
.camera-preset-card.preset-1{border-left:3px solid #10b981;background:linear-gradient(135deg,rgba(16,185,129,0.05),var(--card) 60%)}
.camera-preset-card.preset-2{border-left:3px solid #f59e0b;background:linear-gradient(135deg,rgba(245,158,11,0.05),var(--card) 60%)}
.camera-preset-card.preset-3{border-left:3px solid #ef4444;background:linear-gradient(135deg,rgba(239,68,68,0.05),var(--card) 60%)}
.camera-preset-header{font-size:0.92rem;line-height:1.35;color:var(--text);font-weight:700;border-bottom:2px solid var(--accent);padding-bottom:0.5rem;margin-bottom:0.4rem;letter-spacing:-0.01em}
.camera-preset-row{display:grid;grid-template-columns:1fr 1fr;gap:0.6rem;align-items:baseline;font-size:0.82rem;line-height:1.3}
.camera-preset-row .lbl{color:var(--muted);font-weight:500;text-align:right;padding-right:0.2rem}
.camera-preset-row .val{font-weight:700;color:var(--text);text-align:left;padding-left:0.2rem}
.camera-preset-mode{display:inline-block;background:#6366f1;color:white;font-size:0.7rem;font-weight:800;padding:0.1rem 0.4rem;border-radius:0.25rem;letter-spacing:0.04em}
.camera-preset-toggle{display:inline-flex;align-items:center;gap:0.2rem;font-size:0.72rem;font-weight:600;padding:0.1rem 0.4rem;border-radius:0.25rem}
.camera-preset-toggle.on{background:rgba(16,185,129,0.18);color:#059669}
.camera-preset-toggle.off{background:rgba(125,125,125,0.13);color:var(--muted)}
.camera-preset-toggles{display:flex;gap:0.3rem;flex-wrap:wrap;margin-top:0.2rem}
.camera-preset-notes{font-size:0.74rem;line-height:1.4;color:var(--muted);font-style:italic;border-top:1px dashed var(--border);padding-top:0.4rem;margin-top:0.2rem}
.camera-presets-loading{padding:1rem;text-align:center;color:var(--muted);font-size:0.85rem}
[data-theme="dark"] .camera-preset-card{background:linear-gradient(135deg,rgba(99,102,241,0.13),rgba(168,85,247,0.08));border-color:rgba(99,102,241,0.3);box-shadow:none}
[data-theme="dark"] .camera-preset-card.preset-1{background:linear-gradient(135deg,rgba(16,185,129,0.18),rgba(99,102,241,0.08))}
[data-theme="dark"] .camera-preset-card.preset-2{background:linear-gradient(135deg,rgba(245,158,11,0.18),rgba(99,102,241,0.08))}
[data-theme="dark"] .camera-preset-card.preset-3{background:linear-gradient(135deg,rgba(239,68,68,0.18),rgba(99,102,241,0.08))}
[data-theme="dark"] .camera-preset-toggle.on{background:rgba(16,185,129,0.28);color:#34d399}
.visibility-info{background:rgba(0,0,0,0.25);border-radius:0.7rem;padding:0.9rem;margin-top:1rem;font-size:0.9rem;line-height:1.5}
.visibility-info strong{color:#ffd166}

/* External / Sources */
.external-search{display:flex;flex-direction:column;gap:0.8rem}
.external-search input{flex:1 1 200px;padding:0.7rem 1rem;border:2px solid var(--border);border-radius:2.5rem;font-size:0.95rem;background:var(--input-bg);color:var(--text)}
.external-links{display:flex;flex-wrap:wrap;gap:0.5rem}
.sources-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:0.8rem}
.source-card{background:var(--card-2);border-radius:0.8rem;padding:1rem;display:flex;flex-direction:column;gap:0.4rem;transition:transform 0.2s,box-shadow 0.2s;text-decoration:none;color:inherit;border:1px solid var(--border)}
.source-card-featured{background:linear-gradient(135deg,rgba(22,138,173,0.08),rgba(167,139,250,0.08));border:2px solid var(--accent);position:relative}
.source-card-featured::before{content:"⭐";position:absolute;top:0.5rem;right:0.5rem;font-size:0.85rem;opacity:0.6}
.source-card-featured .src-title{color:var(--accent);font-weight:700}
.source-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-hover)}
.source-card .src-title{font-weight:600;color:var(--primary);font-size:0.95rem;display:flex;align-items:center;gap:0.4rem}
.source-card .src-desc{font-size:0.82rem;color:var(--muted);line-height:1.3}
.source-card .src-status{font-size:0.75rem;padding:0.15rem 0.5rem;border-radius:1rem;display:inline-block;align-self:flex-start;margin-top:0.2rem}
.src-ok{background:var(--success-bg);color:var(--success)}
.src-unchecked{background:var(--info-bg);color:var(--info)}

/* Photography / scoring */
.score-card{background:var(--card);border-radius:1.25rem;padding:1.4rem;box-shadow:var(--shadow);margin-bottom:1rem}
.score-card-header{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:0.5rem;margin-bottom:0.8rem}
.score-card-title{font-size:1.2rem;color:var(--primary);font-weight:600}
.score-display{display:flex;align-items:center;gap:0.5rem}
.score-num{font-size:2.5rem;font-weight:800;line-height:1}
.score-label{font-size:0.85rem;font-weight:600;text-transform:uppercase;letter-spacing:0.05em}
.score-bar-track{width:100%;height:8px;background:var(--card-2);border-radius:4px;overflow:hidden;margin:0.5rem 0}
.score-bar-fill{height:100%;border-radius:4px;transition:width 0.6s ease}
.score-bar-fill.s-low{background:linear-gradient(90deg,#d62828,#e76f51)}
.score-bar-fill.s-mid{background:linear-gradient(90deg,#f4a261,#ffd166)}
.score-bar-fill.s-good{background:linear-gradient(90deg,#a3d9a5,#52b788)}
.score-bar-fill.s-best{background:linear-gradient(90deg,#52b788,#2a9d8f)}
.score-recom{padding:0.7rem 0.9rem;background:var(--card-2);border-left:3px solid var(--primary);border-radius:0.4rem;font-size:0.92rem;line-height:1.4;margin:0.5rem 0;color:var(--text)}
.chip-row{display:flex;flex-wrap:wrap;gap:0.4rem;margin-top:0.6rem}
.chip{display:inline-flex;align-items:center;gap:0.3rem;padding:0.35rem 0.75rem;border-radius:1rem;font-size:0.82rem;font-weight:600;background:var(--card-2);color:var(--text);border:1px solid var(--border)}
.chip.ideal{background:linear-gradient(90deg,#52b788,#2a9d8f);color:white;border:none}
.chip.bo{background:linear-gradient(90deg,#a3d9a5,#52b788);color:white;border:none}
.chip.regular{background:linear-gradient(90deg,#ffd166,#f4a261);color:#333;border:none}
.chip.dolent{background:linear-gradient(90deg,#e76f51,#d62828);color:white;border:none}
.chip.npa{background:var(--muted-2);color:white;border:none;opacity:0.7}
.partial-note{font-size:0.75rem;color:var(--muted);font-style:italic;margin-top:0.4rem}
.factor-list{display:flex;flex-wrap:wrap;gap:0.3rem;margin-top:0.4rem}
.factor{font-size:0.75rem;background:var(--card-2);padding:0.2rem 0.55rem;border-radius:1rem;color:var(--text-2)}

/* Comparator */
.comparator-controls{display:flex;flex-wrap:wrap;gap:0.5rem;align-items:center;margin-bottom:1rem}
.comparator-controls select{padding:0.5rem 0.8rem;border:2px solid var(--border);border-radius:0.5rem;background:var(--input-bg);color:var(--text);font-size:0.9rem;cursor:pointer}
.comp-table{width:100%;border-collapse:collapse;font-size:0.85rem}
.comp-table th,.comp-table td{padding:0.55rem 0.5rem;text-align:left;border-bottom:1px solid var(--border)}
.comp-table th{background:var(--card-2);color:var(--primary);font-weight:600;font-size:0.78rem;text-transform:uppercase;letter-spacing:0.04em;position:sticky;top:0}
.comp-table tr:hover{background:var(--card-2)}
.comp-table .num-cell{text-align:right;font-weight:600}
.comp-wrap{overflow-x:auto;border-radius:0.7rem}

/* Sun and Moon */
.sm-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1rem}
.sm-block{background:var(--card-2);border-radius:0.8rem;padding:0.9rem 1rem}
.sm-row{display:flex;justify-content:space-between;align-items:center;padding:0.3rem 0;border-bottom:1px dashed var(--border);font-size:0.9rem}
.sm-row:last-child{border-bottom:none}
.sm-row .lbl{color:var(--muted)}
.sm-row .val{font-weight:600;color:var(--text)}
.moon-icon{font-size:3rem;text-align:center;margin:0.5rem 0}
.moon-illum-bar{height:6px;background:rgba(255,255,255,0.2);border-radius:3px;overflow:hidden;margin-top:0.3rem}
.moon-illum-fill{height:100%;background:linear-gradient(90deg,#fff,#ffd166);transition:width 0.6s}
.golden-block{background:linear-gradient(135deg,rgba(252,176,69,0.15),rgba(253,124,79,0.15));border-left:3px solid #fcb045;padding:0.6rem 0.9rem;border-radius:0.4rem;margin:0.4rem 0;font-size:0.88rem}
.blue-block{background:linear-gradient(135deg,rgba(95,179,214,0.15),rgba(30,96,145,0.15));border-left:3px solid #5fb3d6;padding:0.6rem 0.9rem;border-radius:0.4rem;margin:0.4rem 0;font-size:0.88rem}
/* Fila compacta de daurada/blava (matí + tarda) en una sola línia */
.gb-row{display:flex;flex-wrap:wrap;gap:0.4rem;margin:0.5rem 0 0;align-items:center}
.gb-chip{display:inline-flex;align-items:center;gap:0.3rem;padding:0.3rem 0.6rem;border-radius:0.4rem;font-size:0.78rem;line-height:1.3;flex:1 1 auto;min-width:140px;font-variant-numeric:tabular-nums;font-weight:500}
.gb-chip.golden{background:linear-gradient(135deg,rgba(252,176,69,0.18),rgba(253,124,79,0.12));border-left:3px solid #fcb045}
.gb-chip.blue{background:linear-gradient(135deg,rgba(95,179,214,0.18),rgba(30,96,145,0.12));border-left:3px solid #5fb3d6}
.gb-chip strong{font-weight:700;white-space:nowrap}
/* Sol/Lluna compacte */
#sunmoonCards .card{padding:0.7rem 0.9rem;margin-bottom:0.6rem}
.sm-compact-head{display:flex;justify-content:space-between;align-items:center;gap:0.5rem;flex-wrap:wrap;margin-bottom:0.45rem}
.sm-best-pill{font-size:0.78rem;background:linear-gradient(135deg,rgba(245,158,11,0.18),rgba(245,158,11,0.08));color:#f59e0b;border:1px solid rgba(245,158,11,0.35);padding:0.18rem 0.55rem;border-radius:0.5rem;font-weight:600;white-space:nowrap}
.sm-compact-row{display:flex;flex-wrap:wrap;align-items:center;gap:0.5rem;font-size:0.85rem;color:var(--text-2);font-variant-numeric:tabular-nums}
.sm-compact-row .sm-info{display:inline-flex;align-items:center;gap:0.4rem;flex-wrap:wrap}
.sm-compact-row .sm-ico{font-size:1rem}
.sm-compact-row .sm-mut{color:var(--muted);font-size:0.78rem}
.sm-compact-row .sm-sep{color:var(--muted-2);opacity:0.5}
/* Botons "Planificar matí/tarda/nit" a Sol/Lluna */
.sm-plan-row{display:flex;align-items:center;gap:0.4rem;flex-wrap:wrap;margin-top:0.55rem;padding-top:0.5rem;border-top:1px dashed var(--border)}
.sm-plan-lbl{font-size:0.78rem;color:var(--muted);font-weight:600}
.sm-plan-btn{display:inline-flex;align-items:center;gap:0.25rem;padding:0.3rem 0.55rem;border-radius:0.4rem;background:var(--card-2);border:1px solid var(--border);color:var(--text);cursor:pointer;font-size:0.78rem;font-weight:500;transition:background 0.12s,border-color 0.12s,transform 0.08s}
.sm-plan-btn:hover{background:rgba(22,138,173,0.12);border-color:var(--accent)}
.sm-plan-btn:active{transform:scale(0.96)}

/* Alerts */
.alert-rule{background:var(--card-2);border-radius:0.7rem;padding:0.9rem 1rem;margin-bottom:0.6rem;display:flex;justify-content:space-between;align-items:center;gap:0.5rem;flex-wrap:wrap}
.alert-rule-info{flex:1;min-width:200px}
.alert-rule-name{font-weight:600;color:var(--primary)}
.alert-rule-desc{font-size:0.82rem;color:var(--muted);margin-top:0.2rem}
.alert-fire{background:linear-gradient(135deg,rgba(231,111,81,0.15),rgba(214,40,40,0.1));border-left:3px solid #e76f51;padding:0.7rem 0.9rem;border-radius:0.4rem;margin-bottom:0.5rem}
.alert-fire-title{font-weight:600;color:var(--danger);font-size:0.92rem}
.alert-fire-detail{font-size:0.85rem;color:var(--text-2);margin-top:0.2rem}
.alert-form{display:grid;grid-template-columns:1fr 1fr;gap:0.5rem;margin-top:0.7rem}
@media(max-width:500px){.alert-form{grid-template-columns:1fr}}
.alert-form select,.alert-form input{padding:0.55rem 0.8rem;border:2px solid var(--border);border-radius:0.5rem;background:var(--input-bg);color:var(--text);font-size:0.9rem}

/* Astro events */
.event-card{background:var(--card-2);border-radius:0.7rem;padding:0.8rem 1rem;margin-bottom:0.5rem;display:flex;justify-content:space-between;align-items:center;gap:0.5rem;flex-wrap:wrap}
.event-card.featured{background:linear-gradient(135deg,#fcb045,#fd7c4f);color:white;font-weight:600}
.event-card.featured .ev-date,.event-card.featured .ev-detail{color:rgba(255,255,255,0.9)}
.ev-name{font-weight:600;color:var(--text)}
.ev-date{font-size:0.85rem;color:var(--muted)}
.ev-detail{font-size:0.8rem;color:var(--muted-2)}
.ev-countdown{font-weight:700;font-size:1.1rem;color:var(--accent)}
.event-card.featured .ev-countdown{color:white}

/* Loading skeleton */
.loading{text-align:center;padding:2rem;color:var(--muted)}
.loading::after{content:'...';animation:dots 1.5s infinite}
@keyframes dots{0%,20%{content:'.'}40%{content:'..'}60%,100%{content:'...'}}
.skeleton{background:linear-gradient(90deg,var(--card-2) 0%,var(--card-3) 50%,var(--card-2) 100%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:0.5rem;height:1rem;margin:0.4rem 0}
@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}

footer{margin-top:1rem;text-align:center;color:var(--muted);font-size:0.85rem}
a{color:var(--accent)}
.card.aurora a,.card.gradient a{color:#ffd166}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:var(--card-2)}
::-webkit-scrollbar-thumb{background:var(--border);border-radius:5px}
::-webkit-scrollbar-thumb:hover{background:var(--muted)}

/* Icon */
.svg-icon{display:inline-block;vertical-align:middle}

/* Webcams */
.webcams-block{margin-top:0.7rem;border-top:1px solid var(--border);padding-top:0.5rem}
.webcams-block summary{cursor:pointer;font-weight:600;color:var(--primary);padding:0.4rem 0;user-select:none;list-style:none;display:flex;align-items:center;gap:0.4rem;font-size:0.95rem}
.webcams-block summary::-webkit-details-marker{display:none}
.webcams-block summary::before{content:'▸';transition:transform 0.2s;display:inline-block}
.webcams-block[open] summary::before{transform:rotate(90deg)}
.wc-count{font-size:0.78rem;background:var(--card-2);padding:0.1rem 0.5rem;border-radius:1rem;color:var(--muted)}
.wc-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:0.6rem;margin:0.6rem 0}
.wc-item{background:var(--card-2);border-radius:0.6rem;overflow:hidden;display:flex;flex-direction:column;border:1px solid var(--border)}
.wc-header{display:flex;justify-content:space-between;align-items:center;padding:0.45rem 0.7rem;font-size:0.85rem;background:var(--card-3)}
.wc-name-txt{font-weight:600;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wc-remove{background:none;border:none;color:var(--danger);cursor:pointer;font-size:0.95rem;padding:0;opacity:0.7}
.wc-remove:hover{opacity:1}
.wc-media-wrap{position:relative;aspect-ratio:16/9;background:#000}
.wc-media{width:100%;height:100%;border:0;display:block;object-fit:cover}
.wc-error{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:0.5rem;color:white;background:#1a1a2e;font-size:0.85rem;text-align:center;padding:0.7rem}
.wc-error a{color:#ffd166;text-decoration:underline}
.wc-link-only{padding:1rem;text-align:center;background:var(--card-3)}
.wc-link-only a{display:inline-block;padding:0.5rem 1rem;background:var(--primary);color:white;border-radius:0.5rem;text-decoration:none;font-size:0.85rem}
.wc-actions{display:flex;gap:0.4rem;flex-wrap:wrap;margin-top:0.5rem}
.wc-actions .btn{padding:0.45rem 0.9rem;font-size:0.85rem}
.wc-form{display:none;flex-direction:column;gap:0.4rem;margin-top:0.5rem;background:var(--card-2);padding:0.7rem;border-radius:0.6rem}
.wc-form.open{display:flex}
.wc-form input{padding:0.55rem 0.8rem;border:2px solid var(--border);border-radius:0.5rem;background:var(--input-bg);color:var(--text);font-size:0.9rem}
.wc-form-row{display:flex;gap:0.4rem;flex-wrap:wrap}
.wc-tip{font-size:0.78rem;color:var(--muted);font-style:italic}
.wc-empty{font-size:0.85rem;color:var(--muted);font-style:italic;padding:0.5rem 0}
/* 26-09: 🧭 nord fàcil «Posa el nord a lloc» (js: bloc NORD FÀCIL) */
#mfEclSim.mf-sim-nc>*:not(#mfEclSimPano):not(#mfEclSimCanvas):not(#mfSvNcUi){visibility:hidden!important;pointer-events:none!important}
#mfSvNcUi{position:absolute;inset:0;z-index:95;pointer-events:none;font-family:system-ui,-apple-system,sans-serif}
#mfSvNcUi .nc-top{position:absolute;left:12px;right:12px;top:calc(12px + env(safe-area-inset-top,0px));max-width:520px;margin:0 auto;background:rgba(5,12,24,.92);border:1px solid rgba(56,189,248,.55);color:#eaf6ff;border-radius:14px;padding:10px 12px;font:700 15px/1.35 system-ui,-apple-system,sans-serif;pointer-events:auto}
#mfSvNcUi .nc-top small{display:block;color:#bae6fd;font-weight:500;font-size:14px;margin-top:3px}
#mfSvNcUi .nc-sheet{position:absolute;left:0;right:0;bottom:0;max-width:560px;margin:0 auto;max-height:52vh;overflow:auto;background:rgba(5,12,24,.94);border-top:1px solid rgba(56,189,248,.45);border-radius:18px 18px 0 0;padding:12px 12px calc(14px + env(safe-area-inset-bottom,0px));color:#eaf6ff;pointer-events:auto;box-sizing:border-box}
#mfSvNcUi .nc-q{margin:0 0 8px;font:700 15px/1.35 system-ui,-apple-system,sans-serif;color:#bae6fd}
#mfSvNcUi .nc-chips{display:flex;flex-wrap:wrap;gap:8px}
#mfSvNcUi .nc-chip{padding:10px 12px;border-radius:999px;background:rgba(56,189,248,.14);border:1px solid rgba(56,189,248,.5);color:#fff;font:700 15px system-ui,-apple-system,sans-serif;cursor:pointer}
#mfSvNcUi .nc-chip i{font-style:normal;color:#93c5fd;font-weight:500;font-size:13px}
#mfSvNcUi .nc-row{display:flex;gap:8px;margin-top:10px}
#mfSvNcUi .nc-btn{flex:1;padding:13px 10px;border-radius:12px;font:800 16px system-ui,-apple-system,sans-serif;border:1px solid rgba(255,255,255,.3);color:#fff;background:rgba(255,255,255,.08);cursor:pointer}
#mfSvNcUi .nc-btn.pri{background:#16a34a;border-color:#22c55e}
#mfSvNcUi .nc-line{position:absolute;left:50%;top:0;bottom:0;width:3px;margin-left:-1.5px;background:rgba(250,204,21,.95);box-shadow:0 0 0 1px rgba(0,0,0,.35)}
#mfSvNcUi .nc-lbl{position:absolute;left:50%;top:30%;transform:translateX(-50%);background:#facc15;color:#111;font:800 14px system-ui,-apple-system,sans-serif;padding:4px 8px;border-radius:8px;white-space:nowrap}
#mfSvNcUi canvas{position:absolute;inset:0;width:100%;height:100%}
#mfSvNcUi .nc-attr,#mfSvNcUi .nc-adm{font-size:11px;color:#94a3b8;margin-top:8px}

/* ============================================================
   🙂 MODE FÀCIL (12-10-2026, Jaume: «la gent no utilitza l'app… té massa coses»)
   Capa a pantalla sencera a sobre de l'app (js/easy.js). L'app continua viva a sota.
   Capes: per sobre dels botons flotants (9990) i per sota dels modals (9999+), del detall
   de proposta (10007) i del simulador (10012). Botons grossos (≥ 3 rem), lletra ≥ 16 px.
   La capçalera d'index.html posa html.mf-easy-on abans de pintar (i .mf-easy-hasloc si ja hi ha lloc).
   ============================================================ */
#mfEasy{display:none}
html.mf-easy-on #mfEasy,html.mf-easy-pick #mfEasy{display:block;position:fixed;inset:0;z-index:9995;background:#07111f;color:#eef6ff;font-family:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif}
html.mf-easy-on,html.mf-easy-on body{overflow:hidden!important}
html.mf-easy-pick #mfEasy{z-index:10040}   /* 12-10: «On vols fer fotos?» a sobre del simulador (#mfEclSim 10012) */
html.mf-easy-pick #mfEasy .mf-easy-full{visibility:hidden}
html.mf-easy-on .mf-ai-fab,html.mf-easy-on .mf-chat-fab,html.mf-easy-on #mfTourPill{display:none!important}
#mfEasy button{font-family:inherit;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
#mfEasy .mf-easy-scroll{position:absolute;inset:0;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:calc(env(safe-area-inset-top,0px) + .7rem) 1rem calc(env(safe-area-inset-bottom,0px) + 1.6rem)}
#mfEasy .mf-easy-in{max-width:30rem;margin:0 auto}
#mfEasy .mf-easy-top{display:flex;align-items:center;justify-content:space-between;gap:.6rem;margin:0 0 1.2rem}
#mfEasy .mf-easy-brand{display:inline-flex;align-items:center;gap:.45rem;font-family:'Archivo Black','Arial Black',system-ui,sans-serif;font-size:1.2rem;text-transform:uppercase;letter-spacing:-.01em;line-height:1;white-space:nowrap}
#mfEasy .mf-easy-brand img{height:2rem;width:auto}
#mfEasy .mf-easy-brand .n1{color:#e8edf5}
#mfEasy .mf-easy-brand .n2{color:#d4b889}
#mfEasy .mf-easy-full{flex:0 0 auto}   /* 15-10: ara és el selector «Fàcil | Complet» (.mf-mode-seg, més avall) */
#mfEasy .mf-easy-s{display:none}
#mfEasy[data-s="loc"] .mf-easy-s-loc,#mfEasy[data-s="home"] .mf-easy-s-home,#mfEasy[data-s="list"] .mf-easy-s-list,#mfEasy[data-s="det"] .mf-easy-s-det,#mfEasy[data-s="ai"] .mf-easy-s-ai,#mfEasy[data-s="wx"] .mf-easy-s-wx{display:block}
html.mf-easy-on:not(.mf-easy-hasloc) #mfEasy:not([data-s]) .mf-easy-s-loc,html.mf-easy-on.mf-easy-hasloc #mfEasy:not([data-s]) .mf-easy-s-home{display:block}
#mfEasy h1{font-size:1.8rem;line-height:1.15;margin:.2rem 0 .55rem;font-weight:850;letter-spacing:-.02em;color:#f8fafc}
#mfEasy h2{font-size:1.45rem;line-height:1.2;margin:.2rem 0 .5rem;font-weight:850;color:#f8fafc}
#mfEasy p{font-size:1.06rem;line-height:1.5;color:#cbd5e1;margin:0 0 1.1rem}
#mfEasy .mf-easy-s-loc h1,#mfEasy .mf-easy-s-loc>p{text-align:center}
#mfEasy .mf-easy-big{display:flex;flex-direction:column;align-items:flex-start;gap:.3rem;width:100%;min-height:4.4rem;padding:1.05rem 1.2rem;border-radius:1.05rem;border:none;color:#fff;font-size:1.25rem;font-weight:850;text-align:left;cursor:pointer;margin:0 0 .85rem;background:linear-gradient(135deg,#0284c7,#2563eb);box-shadow:0 8px 24px rgba(0,0,0,.35)}
#mfEasy .mf-easy-big small{font-size:1rem;font-weight:600;opacity:.95;line-height:1.35}
#mfEasy .mf-easy-big .mf-easy-n{align-self:flex-end;font-size:.95rem;font-weight:800;background:rgba(0,0,0,.22);border-radius:2rem;padding:.2rem .7rem;margin-top:.15rem}
#mfEasy .mf-easy-big.mf-easy-gold{background:linear-gradient(135deg,#b45309,#ea580c);min-height:6.2rem}
#mfEasy .mf-easy-big.mf-easy-violet{background:linear-gradient(135deg,#4c1d95,#7c3aed)}
#mfEasy .mf-easy-big.mf-easy-teal{background:linear-gradient(135deg,#0f766e,#0d9488)}
#mfEasy .mf-easy-big.mf-easy-tall{min-height:6.2rem}
/* 12-10 (Jaume: «a l'inici del mode fàcil queda molt espai buit a baix, reparteix-ho»): la pantalla d'inici omple l'alçada;
   els 3 botons creixen igual (fins a 12rem) amb el text més gran, i «Ja tens compte? Entra» baixa al peu */
#mfEasy[data-s="home"] .mf-easy-in,html.mf-easy-on.mf-easy-hasloc #mfEasy:not([data-s]) .mf-easy-in{min-height:100%;display:flex;flex-direction:column}
#mfEasy[data-s="home"] .mf-easy-s-home,html.mf-easy-on.mf-easy-hasloc #mfEasy:not([data-s]) .mf-easy-s-home{display:flex;flex-direction:column;flex:1 1 auto}
/*   reparteixen l'espai per igual (flex-basis 0) però mai més petits que el seu text (min-height:auto: abans, amb la targeta
     d'avisos, el títol de Propostes quedava tallat); a dins, una graella: títol i «N per avui» a la mateixa línia */
/* 12-10 (Jaume: «estil Apple»): targetes discretes (fons translúcid, vora fina, 22px), icona en un quadrat arrodonit, títol
   de pes mitjà, subtítol gris i ›. Altes: a la manera dels ginys de l'iPhone (icona a dalt, text a baix); mòbils baixos: en fila */
#mfEasy .mf-easy-hc{position:relative;flex:1 1 0;min-height:auto;max-height:12rem;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;gap:.75rem;width:100%;text-align:left;border-radius:22px;border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.06);color:#f5f5f7;padding:1rem 1.1rem 1.05rem;margin:0 0 .75rem;cursor:pointer;font-family:inherit;transition:transform .15s ease,background-color .15s ease}
#mfEasy .mf-easy-hc:active{transform:scale(.985);background:rgba(255,255,255,.1)}
#mfEasy .mf-easy-cic{flex:0 0 auto;width:60px;height:60px;border-radius:15px;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 10px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.18)}
#mfEasy .mf-easy-cic svg{width:34px;height:34px}
#mfEasy .mf-easy-cic-o{background:linear-gradient(160deg,#4a3410,#17110a)}
/* 12-10 (Jaume): la bombeta que s'encén de la pestanya «Proposa» del mode complet (keyframes mfBulb, a index.html), i el
   reflex de sol de les ulleres de «Simula» (mfSimGlint): s'alternen cada 6 s, com al menú del mode complet */
#mfEasy .mf-easy-bulb{font-size:34px;line-height:1;animation:mfBulb 6s ease-in-out infinite}
#mfEasy .mf-easy-cic-s{position:relative}
#mfEasy .mf-easy-cic-s::after{content:"";position:absolute;left:70%;top:52%;width:14px;height:14px;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(255,255,255,.95) 0%,rgba(255,225,140,.7) 40%,rgba(255,200,80,0) 70%);opacity:0;animation:mfSimGlint 6s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){#mfEasy .mf-easy-bulb,#mfEasy .mf-easy-cic-s::after{animation:none}}
#mfEasy .mf-easy-cic-s{background:linear-gradient(160deg,#1f3b7a,#0a1430)}
#mfEasy .mf-easy-cic-s img{width:56px;height:auto;display:block;filter:drop-shadow(0 1px 3px rgba(0,0,0,.45))}
#mfEasy .mf-easy-cic-a{background:linear-gradient(135deg,#a855f7,#3b82f6 55%,#14b8a6)}
#mfEasy .mf-easy-ctx{display:flex;flex-direction:column;gap:.22rem;min-width:0}
#mfEasy .mf-easy-ctx b{font-size:1.32rem;font-weight:650;letter-spacing:-.012em;line-height:1.2;color:#f5f5f7}
#mfEasy .mf-easy-ctx small{font-size:.98rem;font-weight:400;line-height:1.35;color:#a1a1aa}
#mfEasy .mf-easy-chev{position:absolute;right:1.05rem;top:1.05rem;font-size:1.75rem;font-weight:300;line-height:1;color:#6e6e73}
#mfEasy .mf-easy-hc .mf-easy-n{position:absolute;right:2.55rem;top:1.15rem;font-size:.85rem;font-weight:600;color:#ffb340;background:rgba(255,159,10,.16);border-radius:999px;padding:.25rem .65rem;white-space:nowrap}
/* 15-10: amb la 4a targeta («Quin temps farà») les altes només hi caben a partir de ~940 px; per sota, en fila (abans, 700 px) */
@media (max-height:940px){
  #mfEasy .mf-easy-hc{flex-direction:row;align-items:center;justify-content:flex-start;gap:.85rem;padding:.85rem 1rem}
  #mfEasy .mf-easy-cic{width:50px;height:50px;border-radius:12px}
  #mfEasy .mf-easy-cic svg{width:28px;height:28px}
  #mfEasy .mf-easy-cic-s img{width:46px}
  #mfEasy .mf-easy-bulb{font-size:29px}
  #mfEasy .mf-easy-ctx{flex:1 1 auto}
  #mfEasy .mf-easy-ctx b{font-size:1.2rem}
  #mfEasy .mf-easy-ctx small{font-size:.92rem}
  #mfEasy .mf-easy-chev,#mfEasy .mf-easy-hc .mf-easy-n{position:static;flex:0 0 auto}
  /* 15-10: la pastilla («1 per avui», «Avui 14° / 23°») sota el text, perquè el títol no es parteixi */
  #mfEasy .mf-easy-hc{display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"ic tx ch" "ic n ch";column-gap:.85rem;row-gap:.3rem;max-height:9rem}
  #mfEasy .mf-easy-cic{grid-area:ic}
  #mfEasy .mf-easy-ctx{grid-area:tx}
  #mfEasy .mf-easy-hc .mf-easy-n{grid-area:n;justify-self:start}
  #mfEasy .mf-easy-chev{grid-area:ch}
}
@media (max-width:400px){   /* 15-10: el logo i el selector «Fàcil | Complet» a la mateixa línia */
  #mfEasy .mf-easy-brand{font-size:1.08rem;gap:.4rem}
  #mfEasy .mf-easy-brand img{height:1.8rem}
}
#mfEasy .mf-easy-s-home #mfEasyAsk:empty{display:none}
#mfEasy .mf-easy-s-home .mf-easy-login{margin:.35rem 0 0;padding-top:0}
#mfEasy .mf-easy-s-home .mf-easy-login .mf-easy-link{color:#0a84ff;text-decoration:none;font-weight:600}   /* 12-10: estil Apple */
/* 12-10: la targeta d'avisos de l'inici, amb el mateix estil (només aquí; a les altres pantalles, la de sempre) */
#mfEasy .mf-easy-s-home .mf-easy-card{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.09);border-radius:22px;padding:1rem 1.1rem;margin:0 0 .75rem}
#mfEasy .mf-easy-s-home .mf-easy-card b{font-size:1.15rem;font-weight:650;color:#f5f5f7}
#mfEasy .mf-easy-s-home .mf-easy-card p{font-size:.98rem;line-height:1.4;color:#a1a1aa;margin:.4rem 0 .8rem}
#mfEasy .mf-easy-s-home .mf-easy-card .mf-easy-btn{background:#0a84ff;border-radius:12px;font-weight:600;font-size:1.02rem;min-height:2.9rem;padding:.7rem 1.15rem}
#mfEasy .mf-easy-s-home .mf-easy-card .mf-easy-link{color:#0a84ff;text-decoration:none;font-weight:600}
/* 12-10: 🤖 assistent IA — el bot «parla» en una bombolla quan encara no el pots fer servir */
#mfEasy .mf-easy-bot{display:flex;gap:.7rem;align-items:flex-start;margin:.4rem 0 1rem}
#mfEasy .mf-easy-bot-ic{flex:0 0 auto;font-size:2.3rem;line-height:1}
#mfEasy .mf-easy-bubble{flex:1;min-width:0;background:#0f2a2a;border:1px solid rgba(45,212,191,.4);border-radius:0 1.05rem 1.05rem 1.05rem;padding:.9rem 1rem;color:#e6fffb;font-size:1.06rem;line-height:1.5}
#mfEasy .mf-easy-bubble p{margin:0 0 .6rem;color:#e6fffb}
#mfEasy .mf-easy-bubble ul{margin:.2rem 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:.45rem}
#mfEasy .mf-easy-btn.mf-easy-btn-teal{background:linear-gradient(135deg,#0f766e,#0d9488);width:100%;margin:0 0 .6rem}
#mfEasy .mf-easy-btn.mf-easy-btn-gold{background:linear-gradient(135deg,#d97706,#ea580c);width:100%;margin:0 0 .6rem}
html.mf-easy-on .mf-ai-panel{z-index:9996}   /* el panell del bot, per sobre de la capa fàcil */
#mfEasy .mf-easy-big.mf-easy-c{align-items:center;text-align:center}
#mfEasy .mf-easy-or{text-align:center;color:#94a3b8;margin:.1rem 0 .75rem;font-size:1rem}
#mfEasy .mf-easy-big.mf-easy-sec{background:#1e293b;border:1px solid rgba(148,163,184,.45);box-shadow:none;min-height:3.6rem;font-size:1.15rem}   /* 12-10: 🗺️ Tria-ho al mapa */
#mfEasy .mf-easy-mapbox{margin:0 0 1rem}
#mfEasy .mf-easy-map{height:55vh;min-height:280px;max-height:520px;border-radius:1rem;overflow:hidden;border:1px solid rgba(125,211,252,.3);background:#0f1b2e}
#mfEasy .mf-easy-mappin{font-size:1.05rem;font-weight:700;color:#e2e8f0;text-align:center;margin:.65rem 0;min-height:1.4em}
#mfEasy .mf-easy-mapbtns{display:flex;gap:.6rem;align-items:center;justify-content:center;flex-wrap:wrap}
#mfEasy .mf-easy-btn[disabled]{opacity:.45;cursor:default}
#mfEasy .mf-easy-btn.mf-easy-btn-violet{background:linear-gradient(135deg,#4c1d95,#7c3aed)}   /* 12-10: 🌌 Torna al simulador */
/* 12-10: mapa a pantalla sencera (des del simulador molt fàcil): cercador a dalt, mapa a sota, tocar = simular aquí */
#mfEasy .mf-easy-fmap{position:fixed;inset:0;z-index:20;background:#07111f;display:flex;flex-direction:column}
#mfEasy .mf-easy-fmap[hidden]{display:none!important}
#mfEasy .mf-easy-fmap-top{flex:0 0 auto;padding:calc(env(safe-area-inset-top,0px) + .5rem) .75rem .5rem;max-width:32rem;width:100%;margin:0 auto;box-sizing:border-box}
#mfEasy .mf-easy-fmap-top .mf-easy-back{margin:0 0 .3rem}
#mfEasy .mf-easy-fmap-top .mf-easy-search{margin:0 0 .3rem}
#mfEasy .mf-easy-fmap-top .mf-easy-msg{margin:0;min-height:0}
#mfEasy .mf-easy-fmap-alt{display:flex;gap:.5rem;margin:0 0 .35rem}   /* 12-10: 📍 On soc ara · ⭐ Els meus llocs */
#mfEasy .mf-easy-fmap-alt button{flex:1;min-width:0;min-height:48px;font-size:1rem;font-weight:800;padding:0 .6rem;border-radius:.85rem;border:1px solid rgba(148,163,184,.4);background:#1e293b;color:#f1f5f9;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#mfEasy .mf-easy-fmap-alt button[hidden]{display:none}
#mfEasy .mf-easy-fmap-res{max-height:38vh;overflow-y:auto;margin:.3rem 0 0}
#mfEasy .mf-easy-fmap-wrap{flex:1;min-height:0;position:relative}
#mfEasy .mf-easy-fmap-map{position:absolute;inset:0;z-index:0}
#mfEasy .mf-easy-fmap-hint{position:absolute;left:50%;transform:translateX(-50%);bottom:calc(env(safe-area-inset-bottom,0px) + 1.2rem);z-index:1000;background:rgba(7,17,31,.92);border:1px solid rgba(255,255,255,.3);color:#fff;font-weight:800;font-size:1.05rem;padding:.6rem 1.1rem;border-radius:999px;pointer-events:none;white-space:nowrap}
#mfEasyFMapC .map-locate-btn,#mfEasyFMapC .map-fullscreen-btn{display:none!important}
.mf-easy-lyr{background:#fff;color:#111;border:2px solid rgba(0,0,0,.25);border-radius:10px;padding:.5rem .75rem;font:800 16px system-ui,-apple-system,sans-serif;cursor:pointer;box-shadow:0 1px 6px rgba(0,0,0,.45);touch-action:manipulation}   /* 12-10: 🛰️ Híbrid / 🗺️ Mapa */
#mfEasyMap .map-locate-btn,#mfEasyMap .map-fullscreen-btn{display:none!important}   /* l'app els afegeix a tots els mapes: aquí el GPS ja és a sobre i la pantalla completa taparia «Fes servir aquest lloc» */
#mfEasy .mf-easy-search{display:flex;gap:.5rem;margin:0 0 .8rem}
#mfEasy .mf-easy-search input{flex:1;min-width:0;font-size:17px;padding:.85rem .95rem;border-radius:.85rem;border:1px solid rgba(148,163,184,.45);background:#0f1b2e;color:#eef6ff;-webkit-appearance:none;appearance:none}
#mfEasy .mf-easy-search input::placeholder{color:#7b8aa0}
#mfEasy .mf-easy-search button{flex:0 0 auto;font-size:1.02rem;font-weight:800;padding:0 1.15rem;border-radius:.85rem;border:1px solid rgba(148,163,184,.4);background:#1e293b;color:#f1f5f9;min-height:3.2rem;cursor:pointer}
#mfEasy .mf-easy-res{display:flex;flex-direction:column;gap:.55rem;margin:0 0 .8rem}
#mfEasy .mf-easy-res button{text-align:left;padding:.85rem 1rem;border-radius:.85rem;border:1px solid rgba(125,211,252,.28);background:#0f1b2e;color:#eef6ff;font-size:1.08rem;font-weight:750;cursor:pointer;min-height:3.3rem}
#mfEasy .mf-easy-res small{display:block;font-size:.9rem;font-weight:500;color:#94a3b8;margin-top:.15rem}
#mfEasy .mf-easy-mine{display:flex;flex-direction:column;gap:.55rem;margin:.2rem 0 .8rem}   /* 12-10: preferent 💛 i favorites ⭐ */
#mfEasy .mf-easy-mine-t{font-size:1rem;font-weight:800;color:#e2e8f0;margin:.3rem 0 .1rem}
#mfEasy .mf-easy-mine button{text-align:left;padding:.85rem 1rem;border-radius:.85rem;border:1px solid rgba(250,204,21,.35);background:#14213a;color:#eef6ff;font-size:1.12rem;font-weight:800;cursor:pointer;min-height:3.4rem}
#mfEasy .mf-easy-msg{min-height:1.4rem;text-align:center;color:#fcd34d;font-size:1rem;margin:.2rem 0 .6rem}
#mfEasy .mf-easy-note{font-size:.97rem;color:#94a3b8;text-align:center;margin:.7rem 0}
#mfEasy .mf-easy-link{background:none;border:none;color:#7dd3fc;font-size:1.02rem;font-weight:750;cursor:pointer;padding:.55rem .3rem;text-decoration:underline;text-underline-offset:3px;min-height:2.6rem}
#mfEasy .mf-easy-locline{display:flex;align-items:center;gap:.35rem;flex-wrap:wrap;font-size:1.12rem;font-weight:750;margin:0 0 1rem;color:#e2e8f0}
#mfEasy .mf-easy-locline .mf-easy-link{font-size:1rem;padding:.4rem .3rem}
/* 12-10 (Jaume): a l'inici del mode fàcil, el lloc és un botó gros i centrat, com el de «Què vols veure?» del simulador molt fàcil */
#mfEasy .mf-easy-locwrap{display:flex;justify-content:center;margin:0 0 1.1rem}
#mfEasy .mf-easy-locbtn{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;min-width:min(14rem,100%);max-width:100%;min-height:54px;padding:0 1.35rem;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.08);color:#f5f5f7;font:600 1.3rem system-ui,-apple-system,'SF Pro Display','Segoe UI',Roboto,sans-serif;letter-spacing:-.01em;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}   /* 12-10: estil Apple */
#mfEasy .mf-easy-locbtn:active{background:rgba(255,255,255,.14)}
#mfEasy .mf-easy-locic{width:19px;height:19px;flex:0 0 auto;color:#0a84ff}
#mfEasy .mf-easy-locnm{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#mfEasy .mf-easy-locdd{width:17px;height:17px;flex:0 0 auto;color:#8e8e93}
/* 15-10 (Jaume: «posa rètol tria ubicació»): «Tria la ubicació» en petit a sobre del nom, dins del botó (tot el botó la canvia) */
#mfEasy .mf-easy-locbtn{min-height:60px;padding:.4rem 1.35rem}
#mfEasy .mf-easy-loctx{display:flex;flex-direction:column;align-items:flex-start;min-width:0;line-height:1.15}
#mfEasy .mf-easy-loctx small{font-size:.8rem;font-weight:600;letter-spacing:0;color:#8e8e93}
#mfEasy .mf-easy-loctx .mf-easy-locnm{max-width:100%}
html[data-theme="light"] #mfEasy .mf-easy-loctx small{color:#6e6e73}
#mfEasy .mf-easy-back{background:none;border:none;color:#7dd3fc;font-size:1.08rem;font-weight:800;cursor:pointer;padding:.5rem .1rem;margin:0 0 .3rem;min-height:2.8rem}
#mfEasy .mf-easy-days{display:flex;gap:.45rem;margin:0 0 1rem;overflow-x:auto;scrollbar-width:none}
#mfEasy .mf-easy-days button{flex:0 0 auto;padding:.55rem 1.05rem;border-radius:2rem;border:1px solid rgba(148,163,184,.4);background:#0f1b2e;color:#e2e8f0;font-size:1.02rem;font-weight:750;cursor:pointer;min-height:2.75rem}
#mfEasy .mf-easy-days button.on{background:#f1f5f9;color:#07111f;border-color:#f1f5f9}
#mfEasy .mf-easy-opp{display:flex;align-items:center;gap:.9rem;width:100%;text-align:left;padding:.9rem 1rem .9rem .9rem;border-radius:18px;border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.06);color:#f5f5f7;margin:0 0 .7rem;cursor:pointer}   /* 12-10: estil Apple, com l'inici */
#mfEasy .mf-easy-opp:active{background:rgba(255,255,255,.1)}
#mfEasy .mf-easy-opp-ic{flex:0 0 auto;display:flex;align-items:center;justify-content:center}
#mfEasy .mf-easy-opp-b{flex:1;min-width:0;display:flex;flex-direction:column;gap:.22rem}
#mfEasy .mf-easy-opp-b b{font-size:1.12rem;line-height:1.3;color:#f8fafc}
#mfEasy .mf-easy-opp-b span{font-size:1rem;color:#cbd5e1}
#mfEasy .mf-easy-arr{font-size:1.7rem;color:#64748b;flex:0 0 auto}
#mfEasy .mf-easy-q{font-weight:800;letter-spacing:.02em}
#mfEasy .mf-easy-q.q3{color:#4ade80!important}
#mfEasy .mf-easy-q.q2{color:#facc15!important}
#mfEasy .mf-easy-q.q1{color:#cbd5e1!important}
#mfEasy .mf-easy-q.q0{color:#fb923c!important}
/* 13-10 · ✨ nit d'estrelles (KPI > 90) a dalt de Propostes: vora verda fina i ▶ en lloc de › (un toc = simulador) */
#mfEasy .mf-easy-opp.mf-easy-star{border-color:rgba(74,222,128,.45);background:rgba(74,222,128,.08)}
#mfEasy .mf-easy-opp.mf-easy-star:active{background:rgba(74,222,128,.15)}
#mfEasy .mf-easy-play{flex:0 0 auto;display:flex;align-items:center;justify-content:center;width:2.4rem;height:2.4rem;border-radius:50%;background:#0a84ff;color:#fff}
#mfEasy .mf-easy-play svg{width:1.05rem;height:1.05rem;margin-left:.12rem}
#mfEasy .mf-easy-wait{text-align:center;color:#94a3b8;font-size:1.05rem;padding:1.6rem .5rem}
#mfEasy .mf-easy-det{text-align:center}
#mfEasy .mf-easy-det-ic{display:flex;justify-content:center;margin:.4rem 0 .8rem}
#mfEasy .mf-easy-det-ic .mf-ico{width:76px;height:76px;border-radius:19px}
/* 12-10 (Jaume): el títol de la llista amb la bombeta que s'encén de «Proposa» (no la càmera) */
#mfEasy .mf-easy-h1ic{display:flex;align-items:center;gap:.45rem}
#mfEasy .mf-easy-h1ic span{display:inline;font-size:inherit;font-weight:inherit;color:inherit;margin:0}   /* la regla global «h1 span» els feia petits i grisos */
#mfEasy .mf-easy-h1ic .mf-easy-bulb{font-size:1em}
#mfEasy .mf-easy-det .mf-easy-big{background:#0a84ff;box-shadow:none;border-radius:16px}   /* 12-10: «▶ Simula-ho» blau pla (estil Apple), sense el degradat lila */
/* 12-10 (Jaume: «icones més elegants i premium»): icones pròpies (window.mfEasyIcon a js/easy.js): glif blanc en un quadrat
   arrodonit amb degradat. Globals: també les fa servir el simulador molt fàcil (#mfSimTiny, fora de #mfEasy) */
.mf-ico{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:48px;height:48px;border-radius:12px;box-shadow:0 2px 8px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.16);vertical-align:middle}
.mf-ico svg{width:64%;height:64%;display:block;overflow:visible}
.mf-ico-em{font-size:2.1rem;line-height:1;display:inline-block;width:48px;text-align:center}
.mf-ico-set{background:linear-gradient(160deg,#ffb347,#f2542d)}
.mf-ico-rise{background:linear-gradient(160deg,#ffd27a,#f28c38)}
.mf-ico-moon{background:linear-gradient(160deg,#27407d,#0b1530)}
.mf-ico-mw{background:linear-gradient(160deg,#3b2a7a,#0a0f2c)}
.mf-ico-clouds{background:linear-gradient(160deg,#5ab0ff,#2b6fd6)}
.mf-ico-fog{background:linear-gradient(160deg,#9aa7b8,#556273)}
.mf-ico-storm{background:linear-gradient(160deg,#5b3cc4,#1f1747)}
.mf-ico-meteor{background:linear-gradient(160deg,#2a3a8f,#0b1029)}
.mf-ico-aurora{background:linear-gradient(160deg,#0f5b4f,#081c2a)}
.mf-ico-eclipse{background:linear-gradient(160deg,#30343c,#07080a)}
.mf-ico-conj{background:linear-gradient(160deg,#4a3f9e,#141533)}
.mf-ico-comet{background:linear-gradient(160deg,#1c6f8f,#0a1830)}
/* 12-10: les icones noves al simulador del mode complet (botó de mode, menú gran, botó de moments i el seu desplegable) */
#mfSimModeOne .mf-ico,#mfSimMomFab .mf-ico{width:26px;height:26px;border-radius:7px;box-shadow:none}
#mfSimModeBig .mf-mb-t .i .mf-ico{width:40px;height:40px;border-radius:10px}
.mf-rc-ic .mf-ico{width:22px;height:22px;border-radius:6px;box-shadow:none;vertical-align:-6px}
/* 12-10: 🌌 🌇 🌆 🌅 🌄 dins dels textos del simulador → la icona nova (js/easy.js, ieWatch; el fons el posa #mfIeCss). L'emoji hi és, invisible */
.mf-ie{display:inline-block;position:relative;flex:0 0 auto;width:1.18em;height:1.18em;vertical-align:-.22em;border-radius:.28em;margin:0 .06em;background:center/100% 100% no-repeat}
.mf-ie-t{position:absolute;left:0;top:0;width:100%;height:100%;overflow:hidden;opacity:0;pointer-events:none;font-size:.7em;line-height:1}
#mfEasy .mf-easy-det .mf-easy-q{font-size:1.1rem}
#mfEasy .mf-easy-facts{list-style:none;padding:0;margin:1.1rem 0;text-align:left;display:flex;flex-direction:column;gap:.5rem;font-size:1.1rem;color:#e2e8f0}
#mfEasy .mf-easy-why{text-align:left}
#mfEasy .mf-easy-warn{background:rgba(251,146,60,.14);border:1px solid rgba(251,146,60,.45);border-radius:.85rem;padding:.8rem .95rem;color:#fed7aa;text-align:left}
#mfEasy .mf-easy-card{background:#0f1b2e;border:1px solid rgba(125,211,252,.32);border-radius:1.05rem;padding:1rem 1.1rem;margin:.3rem 0 .9rem;text-align:left}
#mfEasy .mf-easy-card b{font-size:1.15rem;color:#f8fafc}
#mfEasy .mf-easy-card p{font-size:1.02rem;margin:.45rem 0 .85rem}
#mfEasy .mf-easy-card-b{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap}
#mfEasy .mf-easy-btn{border:none;border-radius:.85rem;padding:.8rem 1.25rem;font-size:1.08rem;font-weight:850;background:linear-gradient(135deg,#0284c7,#2563eb);color:#fff;cursor:pointer;min-height:3.1rem}
#mfEasy .mf-easy-status{font-size:1.02rem;color:#86efac;margin:.1rem 0 .8rem;text-align:center}
#mfEasy [hidden]{display:none!important}
/* 12-10 (Jaume): dia · nit · nocturn vermell a l'inici (selector segmentat a l'estil iPhone; el tema és el de tota l'app) */
#mfEasy .mf-easy-theme{display:flex;gap:2px;padding:2px;margin:auto auto 0;width:min(100%,21rem);border-radius:11px;background:rgba(118,118,128,.24)}
#mfEasy .mf-easy-s-home .mf-easy-theme{margin-top:auto}
#mfEasy .mf-easy-theme button{flex:1 1 0;min-width:0;display:inline-flex;align-items:center;justify-content:center;gap:.35rem;min-height:40px;border:0;border-radius:9px;background:transparent;color:#ebebf5;font:600 15px system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;cursor:pointer;padding:0 .4rem;touch-action:manipulation}
#mfEasy .mf-easy-theme button svg{width:17px;height:17px;flex:0 0 auto}
#mfEasy .mf-easy-theme button.on{background:#636366;color:#fff;box-shadow:0 3px 8px rgba(0,0,0,.12),0 3px 1px rgba(0,0,0,.04)}
#mfEasy .mf-easy-theme button[data-th="red"] svg{color:#ff453a}
/* 12-10 (Jaume: «el mode dia, tot més blanc»): el mode fàcil amb data-theme="light" — paleta clara de l'iPhone
   (fons #f2f2f7, targetes blanques, text #1c1c1e, secundari #6e6e73, blau #007aff). La nit (fosc) i el vermell, com sempre */
html[data-theme="light"] #mfEasy{background:#f2f2f7;color:#1c1c1e}
html[data-theme="light"] #mfEasy .mf-easy-brand .n1{color:#283758}
html[data-theme="light"] #mfEasy .mf-easy-brand .n2{color:#c6a877}
html[data-theme="light"] #mfEasy h1,html[data-theme="light"] #mfEasy h2{color:#1c1c1e}
html[data-theme="light"] #mfEasy p{color:#3a3a3c}
html[data-theme="light"] #mfEasy .mf-easy-hc{background:#fff;border-color:rgba(0,0,0,.06);color:#1c1c1e;box-shadow:0 1px 2px rgba(0,0,0,.04),0 6px 18px rgba(0,0,0,.05)}
html[data-theme="light"] #mfEasy .mf-easy-hc:active{background:#f7f7f9}
html[data-theme="light"] #mfEasy .mf-easy-ctx b{color:#1c1c1e}
html[data-theme="light"] #mfEasy .mf-easy-ctx small{color:#6e6e73}
html[data-theme="light"] #mfEasy .mf-easy-chev{color:#c7c7cc}
html[data-theme="light"] #mfEasy .mf-easy-hc .mf-easy-n{color:#c45d00;background:rgba(255,149,0,.14)}
html[data-theme="light"] #mfEasy .mf-easy-locbtn{background:#fff;border-color:rgba(0,0,0,.08);color:#1c1c1e;box-shadow:0 1px 2px rgba(0,0,0,.04)}
html[data-theme="light"] #mfEasy .mf-easy-locbtn:active{background:#f7f7f9}
html[data-theme="light"] #mfEasy .mf-easy-locic{color:#007aff}
html[data-theme="light"] #mfEasy .mf-easy-link,html[data-theme="light"] #mfEasy .mf-easy-back,html[data-theme="light"] #mfEasy .mf-easy-s-home .mf-easy-login .mf-easy-link{color:#007aff}
html[data-theme="light"] #mfEasy .mf-easy-card,html[data-theme="light"] #mfEasy .mf-easy-s-home .mf-easy-card{background:#fff;border-color:rgba(0,0,0,.07)}
html[data-theme="light"] #mfEasy .mf-easy-card b,html[data-theme="light"] #mfEasy .mf-easy-s-home .mf-easy-card b{color:#1c1c1e}
html[data-theme="light"] #mfEasy .mf-easy-card p,html[data-theme="light"] #mfEasy .mf-easy-s-home .mf-easy-card p{color:#6e6e73}
html[data-theme="light"] #mfEasy .mf-easy-s-home .mf-easy-card .mf-easy-btn{background:#007aff}
html[data-theme="light"] #mfEasy .mf-easy-s-home .mf-easy-card .mf-easy-link{color:#007aff}
html[data-theme="light"] #mfEasy .mf-easy-bubble{background:#e8f6f4;border-color:rgba(13,148,136,.3);color:#134e4a}
html[data-theme="light"] #mfEasy .mf-easy-bubble p{color:#134e4a}
html[data-theme="light"] #mfEasy .mf-easy-or,html[data-theme="light"] #mfEasy .mf-easy-note,html[data-theme="light"] #mfEasy .mf-easy-wait{color:#6e6e73}
html[data-theme="light"] #mfEasy .mf-easy-big.mf-easy-sec{background:#fff;border-color:rgba(0,0,0,.1);color:#1c1c1e}
html[data-theme="light"] #mfEasy .mf-easy-map{border-color:rgba(0,0,0,.1);background:#e5e5ea}
html[data-theme="light"] #mfEasy .mf-easy-mappin,html[data-theme="light"] #mfEasy .mf-easy-facts{color:#1c1c1e}
html[data-theme="light"] #mfEasy .mf-easy-fmap{background:#f2f2f7}
html[data-theme="light"] #mfEasy .mf-easy-fmap-alt button,html[data-theme="light"] #mfEasy .mf-easy-search button,html[data-theme="light"] #mfEasy .mf-easy-res button,html[data-theme="light"] #mfEasy .mf-easy-days button{background:#fff;border-color:rgba(0,0,0,.1);color:#1c1c1e}
html[data-theme="light"] #mfEasy .mf-easy-search button{color:#007aff}
html[data-theme="light"] #mfEasy .mf-easy-search input{background:#fff;border-color:rgba(60,60,67,.22);color:#1c1c1e}
html[data-theme="light"] #mfEasy .mf-easy-search input::placeholder{color:#8e8e93}
html[data-theme="light"] #mfEasy .mf-easy-res small{color:#6e6e73}
html[data-theme="light"] #mfEasy .mf-easy-mine-t{color:#3a3a3c}
html[data-theme="light"] #mfEasy .mf-easy-mine button{background:#fff;border-color:rgba(255,204,0,.55);color:#1c1c1e}
html[data-theme="light"] #mfEasy .mf-easy-msg{color:#b45309}
html[data-theme="light"] #mfEasy .mf-easy-locline{color:#3a3a3c}
html[data-theme="light"] #mfEasy .mf-easy-days button.on{background:#1c1c1e;border-color:#1c1c1e;color:#fff}
html[data-theme="light"] #mfEasy .mf-easy-opp{background:#fff;border-color:rgba(0,0,0,.06);color:#1c1c1e;box-shadow:0 1px 2px rgba(0,0,0,.04)}
html[data-theme="light"] #mfEasy .mf-easy-opp:active{background:#f7f7f9}
html[data-theme="light"] #mfEasy .mf-easy-opp-b b{color:#1c1c1e}
html[data-theme="light"] #mfEasy .mf-easy-opp-b span{color:#6e6e73}
html[data-theme="light"] #mfEasy .mf-easy-arr{color:#c7c7cc}
html[data-theme="light"] #mfEasy .mf-easy-q.q3{color:#1f9d55!important}
html[data-theme="light"] #mfEasy .mf-easy-q.q2{color:#b7791f!important}
html[data-theme="light"] #mfEasy .mf-easy-q.q1{color:#6e6e73!important}
html[data-theme="light"] #mfEasy .mf-easy-q.q0{color:#c2410c!important}
html[data-theme="light"] #mfEasy .mf-easy-opp.mf-easy-star{background:#f3fbf6;border-color:rgba(31,157,85,.4)}
html[data-theme="light"] #mfEasy .mf-easy-opp.mf-easy-star:active{background:#e8f6ee}
html[data-theme="light"] #mfEasy .mf-easy-play{background:#007aff}
html[data-theme="light"] #mfEasy .mf-easy-warn{background:rgba(255,149,0,.12);border-color:rgba(255,149,0,.35);color:#9a3412}
html[data-theme="light"] #mfEasy .mf-easy-status{color:#15803d}
html[data-theme="light"] #mfEasy .mf-easy-det .mf-easy-big{background:#007aff}
html[data-theme="light"] #mfEasy .mf-easy-theme{background:rgba(118,118,128,.12)}
html[data-theme="light"] #mfEasy .mf-easy-theme button{color:#1c1c1e}
html[data-theme="light"] #mfEasy .mf-easy-theme button.on{background:#fff;color:#1c1c1e}
/* 12-10: amb el vel vermell (multiply) el blau es torna negre: els enllaços, la fletxa del lloc i els botons blaus, en tons amb vermell */
html.mf-red #mfEasy .mf-easy-link,html.mf-red #mfEasy .mf-easy-back,html.mf-red #mfEasy .mf-easy-locic,html.mf-red #mfEasy .mf-easy-s-home .mf-easy-login .mf-easy-link,html.mf-red #mfEasy .mf-easy-s-home .mf-easy-card .mf-easy-link{color:#ffb4b4}
html.mf-red #mfEasy .mf-easy-play{background:#7a1f1f;color:#ffd6d6}   /* 13-10: el blau, amb el vel, seria negre */
html.mf-red #mfEasy .mf-easy-det .mf-easy-big,html.mf-red #mfEasy .mf-easy-s-home .mf-easy-card .mf-easy-btn,html.mf-red #mfEasy .mf-easy-btn{background:#7a1f1f}
/* 15-10 (Jaume: una amiga no sabia en quin mode era: el botó de dalt deia el nom de l'ALTRE mode, «Mode complet ›» al fàcil i
   «🙂 Mode fàcil» al complet). Selector «Fàcil | Complet» a dalt dels dos modes (index.html: .mf-easy-top i .mf-hdr-easy), amb el
   mode actual ple, com el de Dia · Nit · Vermell. Global: el del mode complet és fora de #mfEasy */
.mf-mode-seg{display:inline-flex;align-items:stretch;flex:0 0 auto;gap:2px;padding:3px;border-radius:999px;background:rgba(118,118,128,.24);border:1px solid rgba(148,163,184,.3)}
.mf-mode-seg button{display:inline-flex;align-items:center;justify-content:center;min-height:2.35rem;padding:0 .7rem;border:0;border-radius:999px;background:transparent;color:#e2e8f0;font:650 .92rem system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;line-height:1;white-space:nowrap;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.mf-mode-seg button.on{background:#f1f5f9;color:#0b1530;box-shadow:0 2px 6px rgba(0,0,0,.25);cursor:default}
html[data-theme="light"] .mf-mode-seg{background:rgba(118,118,128,.12);border-color:rgba(40,55,88,.16)}
html[data-theme="light"] .mf-mode-seg button{color:#283758}
html[data-theme="light"] .mf-mode-seg button.on{background:#283758;color:#fff;box-shadow:0 2px 6px rgba(40,55,88,.3)}
@media (max-width:380px){.mf-mode-seg button{padding:0 .55rem;font-size:.86rem}}
#mfEasy .mf-easy-top{flex-wrap:wrap;row-gap:.5rem}   /* si no hi cap (mòbils molt estrets), el selector baixa sota el logo */
/* 15-10 · 🌤️ Quin temps farà: 4a targeta de l'inici (la icona i la pastilla «Avui 14° / 23°» són les d'avui, js/easy.js) */
#mfEasy .mf-easy-cic-w{background:none}
#mfEasy .mf-easy-cic-w .mf-ico{width:100%;height:100%;border-radius:inherit;box-shadow:none}
#mfEasy .mf-easy-cic-w .mf-ico svg{width:62%;height:62%}
#mfEasy .mf-easy-hc .mf-easy-n-wx{color:#64b5ff;background:rgba(10,132,255,.16)}
/* 23-10 · 📲 la pastilla d'instal·lar l'app (js/easy.js, instPaint): un toc = el diàleg del navegador (Android, Chrome, Edge) o la guia de l'iPhone */
#mfEasy .mf-easy-inst{margin:-.35rem 0 .9rem}
#mfEasy .mf-easy-inst[hidden]{display:none}
#mfEasy .mf-easy-inst .mf-easy-instb{position:relative;display:flex;align-items:center;gap:.8rem;width:100%;padding:.8rem 2.4rem .8rem .9rem;border-radius:18px;border:1px solid rgba(10,132,255,.35);background:linear-gradient(135deg,rgba(10,132,255,.22),rgba(94,92,230,.18));color:#f5f5f7;text-align:left;cursor:pointer;font-family:inherit;transition:transform .15s ease}
#mfEasy .mf-easy-inst .mf-easy-instb:active{transform:scale(.985)}
#mfEasy .mf-easy-inst .mf-easy-insti{flex:0 0 auto;display:grid;place-items:center;width:40px;height:40px;border-radius:11px;background:#0a84ff;color:#fff;font-size:1.3rem;box-shadow:0 4px 12px rgba(10,132,255,.35)}
#mfEasy .mf-easy-inst .mf-easy-instx{display:flex;flex-direction:column;min-width:0;line-height:1.25}
#mfEasy .mf-easy-inst .mf-easy-instx b{font-size:1.08rem;font-weight:650;letter-spacing:-.01em}
#mfEasy .mf-easy-inst .mf-easy-instx small{font-size:.88rem;color:#c7d6ea}
#mfEasy .mf-easy-inst .mf-easy-instc{position:absolute;right:.5rem;top:.45rem;width:30px;height:30px;border:0;border-radius:50%;background:transparent;color:#a1a1aa;font-size:1.05rem;line-height:1;cursor:pointer;font-family:inherit}
#mfEasy .mf-easy-inst .mf-easy-instc:hover{background:rgba(255,255,255,.1)}
html[data-theme="light"] #mfEasy .mf-easy-inst .mf-easy-instb{background:linear-gradient(135deg,rgba(0,122,255,.12),rgba(88,86,214,.1));border-color:rgba(0,122,255,.3);color:#1c1c1e}
html[data-theme="light"] #mfEasy .mf-easy-inst .mf-easy-instx small{color:#3f5f8a}
html[data-theme="light"] #mfEasy .mf-easy-inst .mf-easy-instc{color:#6e6e73}
/*   la guia de l'iPhone: una fletxa que bota cap al botó Compartir (a baix al mig a l'iPhone; a dalt a la dreta a l'iPad) */
#mfIosInstall .mf-ios-arrow{position:fixed;left:50%;bottom:6px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:.1rem;color:#fbbf24;font-weight:800;text-shadow:0 2px 8px rgba(0,0,0,.8);pointer-events:none;z-index:2;animation:mfIosBounce 1.1s ease-in-out infinite}
#mfIosInstall .mf-ios-arrow span{font-size:.85rem;background:rgba(0,0,0,.65);padding:.25rem .6rem;border-radius:999px}
#mfIosInstall .mf-ios-arrow b{font-size:2.4rem;line-height:1}
#mfIosInstall.ipad .mf-ios-arrow{left:auto;right:10px;bottom:auto;top:6px;transform:none;flex-direction:column-reverse}
#mfIosInstall.ipad .mf-ios-arrow b{transform:rotate(180deg)}
#mfIosInstall.ipad .mf-ios-arrow{animation-name:mfIosBounceUp}
@keyframes mfIosBounce{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,10px)}}
@keyframes mfIosBounceUp{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@media (prefers-reduced-motion:reduce){#mfIosInstall .mf-ios-arrow{animation:none}}
/* 23-10 · 🌅🌇 la sortida i la posta del Sol a l'inici (js/easy.js, sunPaint): dues pastilles amb la icona, el nom i l'hora */
#mfEasy .mf-easy-sun{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;margin:-.15rem 0 .75rem}
#mfEasy .mf-easy-sun[hidden]{display:none}
#mfEasy .mf-easy-sun button{display:flex;align-items:center;gap:.65rem;min-width:0;padding:.6rem .75rem;border-radius:16px;border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.06);color:#f5f5f7;text-align:left;cursor:pointer;font-family:inherit;transition:transform .15s ease,background-color .15s ease}
#mfEasy .mf-easy-sun button:active{transform:scale(.98)}
#mfEasy .mf-easy-sun .mf-ico{flex:0 0 auto;width:38px;height:38px;border-radius:10px}
#mfEasy .mf-easy-sun .mf-ico svg{width:64%;height:64%}
#mfEasy .mf-easy-sun span{display:flex;flex-direction:column;min-width:0;line-height:1.2}
#mfEasy .mf-easy-sun small{font-size:.8rem;font-weight:500;color:#a1a1aa;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#mfEasy .mf-easy-sun b{font-size:1.22rem;font-weight:650;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
#mfEasy .mf-easy-sun b i{font-style:normal;font-size:.8rem;font-weight:500;color:#a1a1aa;margin-left:.35rem}
html[data-theme="light"] #mfEasy .mf-easy-sun button{background:#fff;border-color:rgba(0,0,0,.06);color:#1c1c1e;box-shadow:0 1px 2px rgba(0,0,0,.04),0 6px 18px rgba(0,0,0,.05)}
html[data-theme="light"] #mfEasy .mf-easy-sun small,html[data-theme="light"] #mfEasy .mf-easy-sun b i{color:#6e6e73}
@media (max-height:700px){ #mfEasy .mf-easy-sun button{padding:.45rem .65rem} #mfEasy .mf-easy-sun .mf-ico{width:32px;height:32px} #mfEasy .mf-easy-sun b{font-size:1.1rem} }
/*   la pantalla: 5 botons de dia (icona, màxima i mínima) i la targeta del dia triat, amb les caselles de la targeta Meteo
     (.mf-tdy-*, globals) i les seves variables (--tdy-*). Lliscar la targeta canvia de dia (touch-action:pan-y) */
:is(#mfEasy,.mf-wx5) .mf-easy-wxdays{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.4rem;margin:0 0 .9rem}
:is(#mfEasy,.mf-wx5) .mf-easy-wxdays button{display:flex;flex-direction:column;align-items:center;gap:.35rem;min-width:0;padding:.6rem .15rem .55rem;border-radius:16px;border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.06);color:#f5f5f7;cursor:pointer}
:is(#mfEasy,.mf-wx5) .mf-easy-wxdays .l{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.92rem;font-weight:650;line-height:1.1}
:is(#mfEasy,.mf-wx5) .mf-easy-wxdays .mf-ico{width:34px;height:34px;border-radius:9px;box-shadow:none}
:is(#mfEasy,.mf-wx5) .mf-easy-wxdays .t{display:flex;flex-direction:column;align-items:center;line-height:1.15;font-variant-numeric:tabular-nums}
:is(#mfEasy,.mf-wx5) .mf-easy-wxdays .t b{font-size:1.08rem;font-weight:650}
:is(#mfEasy,.mf-wx5) .mf-easy-wxdays .t i{font-style:normal;font-size:.9rem;color:#a1a1aa}
:is(#mfEasy,.mf-wx5) .mf-easy-wxdays button.on{background:#f1f5f9;border-color:#f1f5f9;color:#07111f}
:is(#mfEasy,.mf-wx5) .mf-easy-wxdays button.on .t i{color:#48484a}
:is(#mfEasy,.mf-wx5) .mf-easy-wxc{--tdy-tile:rgba(255,255,255,.06);--tdy-sep:rgba(255,255,255,.08);--tdy-track:rgba(255,255,255,.1);--tdy-ml:#7276ee;--text:#f5f5f7;--muted:#a1a1aa;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.09);border-radius:22px;padding:.95rem 1rem 1rem;color:var(--text);container-type:inline-size;touch-action:pan-y}
:is(#mfEasy,.mf-wx5) .mf-easy-wxc-h{margin:0 0 .8rem;font-size:.74rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
:is(#mfEasy,.mf-wx5) .mf-easy-wxp{margin:-.15rem 0 .85rem;font-size:1.12rem;font-weight:600;line-height:1.35;color:var(--text)}
html[data-theme="light"] #mfEasy .mf-easy-hc .mf-easy-n-wx{color:#0a63c9;background:rgba(0,122,255,.1)}
html[data-theme="light"] :is(#mfEasy,.mf-wx5) .mf-easy-wxdays button{background:#fff;border-color:rgba(0,0,0,.06);color:#1c1c1e;box-shadow:0 1px 2px rgba(0,0,0,.04)}
html[data-theme="light"] :is(#mfEasy,.mf-wx5) .mf-easy-wxdays .t i{color:#6e6e73}
html[data-theme="light"] :is(#mfEasy,.mf-wx5) .mf-easy-wxdays button.on{background:#1c1c1e;border-color:#1c1c1e;color:#fff}
html[data-theme="light"] :is(#mfEasy,.mf-wx5) .mf-easy-wxdays button.on .t i{color:#c7c7cc}
html[data-theme="light"] :is(#mfEasy,.mf-wx5) .mf-easy-wxc{--tdy-tile:rgba(118,118,128,.08);--tdy-sep:rgba(60,60,67,.12);--tdy-track:rgba(118,118,128,.16);--tdy-ml:#4b4ec4;--text:#1c1c1e;--muted:#6e6e73;
  background:#fff;border-color:rgba(0,0,0,.06);box-shadow:0 1px 2px rgba(0,0,0,.04),0 6px 18px rgba(0,0,0,.05)}
html.mf-red #mfEasy .mf-easy-hc .mf-easy-n-wx{color:#ffb0b0;background:rgba(255,176,176,.14)}
html.mf-red :is(#mfEasy,.mf-wx5) .mf-easy-wxc .mf-ico,html.mf-red :is(#mfEasy,.mf-wx5) .mf-easy-wxdays .mf-ico{background:rgba(255,255,255,.08)}   /* com la targeta Meteo: amb el vel vermell, el glif es veu sobre fosc */
html.mf-red :is(#mfEasy,.mf-wx5) .mf-easy-wxc .mf-tdy-fill,html.mf-red :is(#mfEasy,.mf-wx5) .mf-easy-wxc .mf-tdy-dot{background:#ffb0b0!important}
/*   15-10 · gràfica «Hora a hora» (js/easy.js, hhDraw): núvols a dalt (aigua-marina, àrea suau + línia de 2 px) i pluja a sota
     (barres blaves), nit ombrejada; colors validats (dataviz, contrast i daltonisme) contra la casella en dia i en nit */
:is(#mfEasy,.mf-wx5) .mf-hh{--hh-c:#8e8e93;--hh-r:#3987e5;--hh-t:#e0662f;--hh-n:rgba(0,0,0,.25);--hh-s:#1b2331}   /* 15-10: núvols en gris (Jaume), temperatura en taronja (validat contra el blau de la pluja) */
:is(#mfEasy,.mf-wx5) .mf-hh-rd{display:flex;flex-wrap:wrap;align-items:center;gap:.15rem .8rem;min-height:1.45rem;margin:.5rem 0 .35rem;font-size:.84rem;line-height:1.3;color:var(--muted)}
:is(#mfEasy,.mf-wx5) .mf-hh-rd b{font-weight:650;font-variant-numeric:tabular-nums;color:var(--text)}
:is(#mfEasy,.mf-wx5) .mf-hh-rd span{display:inline-flex;align-items:center;gap:.3rem}
:is(#mfEasy,.mf-wx5) .mf-hh-rd .k{display:inline-block;flex:0 0 auto;width:12px;height:2px;border-radius:1px}
:is(#mfEasy,.mf-wx5) .mf-hh-rd .kc{background:var(--hh-c)}
:is(#mfEasy,.mf-wx5) .mf-hh-rd .kr{width:7px;height:10px;border-radius:2px 2px 0 0;background:var(--hh-r)}
:is(#mfEasy,.mf-wx5) .mf-hh-plot{touch-action:pan-y;cursor:crosshair;outline:none;border-radius:6px;-webkit-tap-highlight-color:transparent}
:is(#mfEasy,.mf-wx5) .mf-hh-plot:focus-visible{box-shadow:0 0 0 2px var(--hh-r)}
:is(#mfEasy,.mf-wx5) .mf-hh-plot svg{display:block;width:100%;height:auto;overflow:visible}
:is(#mfEasy,.mf-wx5) .mf-hh svg .n{fill:var(--hh-n)}
:is(#mfEasy,.mf-wx5) .mf-hh svg .g{stroke:var(--tdy-sep);stroke-width:1}
:is(#mfEasy,.mf-wx5) .mf-hh svg .b{stroke:var(--tdy-track);stroke-width:1}
:is(#mfEasy,.mf-wx5) .mf-hh svg .ca{fill:var(--hh-c);opacity:.12}
:is(#mfEasy,.mf-wx5) .mf-hh svg .cl{fill:none;stroke:var(--hh-c);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
:is(#mfEasy,.mf-wx5) .mf-hh svg .rb{fill:var(--hh-r)}
:is(#mfEasy,.mf-wx5) .mf-hh svg .rb.on{opacity:.7}
:is(#mfEasy,.mf-wx5) .mf-hh svg .t{font:600 11px system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;fill:var(--muted)}
:is(#mfEasy,.mf-wx5) .mf-hh svg .xl{fill:none;stroke:var(--text);stroke-width:1;opacity:.45}
:is(#mfEasy,.mf-wx5) .mf-hh svg .xd{fill:var(--hh-c);stroke:var(--hh-s);stroke-width:2}
:is(#mfEasy,.mf-wx5) .mf-hh-ax{margin-top:.3rem}
html[data-theme="light"] :is(#mfEasy,.mf-wx5) .mf-hh{--hh-c:#48484a;--hh-r:#2a78d6;--hh-t:#e8622c;--hh-n:rgba(118,118,128,.1);--hh-s:#f6f6f7}
html.mf-red :is(#mfEasy,.mf-wx5) .mf-hh{--hh-c:#d08888;--hh-r:#ffb0b0;--hh-t:#ffd6d6;--hh-n:rgba(255,176,176,.06)}
:is(#mfEasy,.mf-wx5) .mf-hh-rd .kt{background:var(--hh-t)}
:is(#mfEasy,.mf-wx5) .mf-hh svg .tl{fill:none;stroke:var(--hh-t);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
:is(#mfEasy,.mf-wx5) .mf-hh svg .xt{fill:var(--hh-t);stroke:var(--hh-s);stroke-width:2}
/*   nitidesa en una caixa petita (una línia, el valor a la dreta) */
:is(#mfEasy,.mf-wx5) .mf-easy-sharp{display:flex;align-items:center;gap:.6rem;margin-top:.5rem;padding:.6rem .75rem;border-radius:14px;background:var(--tdy-tile)}
:is(#mfEasy,.mf-wx5) .mf-easy-sharp .mf-ico{width:26px;height:26px;border-radius:7px;box-shadow:none}
:is(#mfEasy,.mf-wx5) .mf-easy-sharp-t{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:.1rem}
:is(#mfEasy,.mf-wx5) .mf-easy-sharp-t span{font-size:.78rem;font-weight:600;color:var(--muted)}
:is(#mfEasy,.mf-wx5) .mf-easy-sharp-t small{font-size:.76rem;line-height:1.3;color:var(--muted)}
:is(#mfEasy,.mf-wx5) .mf-easy-sharp-v{flex:0 0 auto;font-size:1.3rem;font-weight:600;color:var(--text)}
:is(#mfEasy,.mf-wx5) .mf-easy-sharp-v small{margin-left:.05em;font-size:.6em;font-weight:500;color:var(--muted)}
/* 15-10 (Jaume: «quan triem ubicació no es veu clar; fes que sigui visualment molt fàcil»): «On vols fer fotos?» a l'estil de
   l'inici: el lloc d'ara (verd), dues targetes grosses (GPS i mapa), el cercador amb lupa i «Cerca» en blau, i els resultats i
   els llocs desats com a targetes amb ›. Tot dins de .mf-easy-s-loc: el cercador del mapa del simulador (.mf-easy-fmap) no canvia */
#mfEasy .mf-easy-locnow{width:max-content;max-width:100%;margin:-.35rem auto 1.1rem;padding:.4rem .95rem;border-radius:999px;background:rgba(48,209,88,.14);color:#4cd57a;font-size:.98rem;font-weight:650;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#mfEasy .mf-easy-locnow::before{content:'✓ '}
#mfEasy .mf-easy-ways{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin:0 0 .3rem}
#mfEasy .mf-easy-way{display:flex;flex-direction:column;align-items:flex-start;gap:.25rem;min-width:0;min-height:9.4rem;padding:1rem 1rem 1.05rem;border-radius:22px;border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.06);color:#f5f5f7;text-align:left;cursor:pointer;transition:transform .15s ease,background-color .15s ease}
#mfEasy .mf-easy-way:active{transform:scale(.97);background:rgba(255,255,255,.1)}
#mfEasy .mf-easy-wic{display:flex;align-items:center;justify-content:center;width:54px;height:54px;margin-bottom:auto;border-radius:14px;box-shadow:0 2px 10px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.18)}
#mfEasy .mf-easy-wic svg{width:30px;height:30px}
#mfEasy .mf-easy-wic-gps{background:linear-gradient(160deg,#4aa3ff,#0a6cf0)}
#mfEasy .mf-easy-wic-map{background:linear-gradient(160deg,#4cd27a,#1e9e4a)}
#mfEasy .mf-easy-way b{margin-top:.75rem;font-size:1.25rem;font-weight:650;letter-spacing:-.01em;line-height:1.2;color:#f5f5f7}
#mfEasy .mf-easy-way small{font-size:.92rem;line-height:1.3;color:#a1a1aa}
#mfEasy .mf-easy-s-loc .mf-easy-msg{margin:.45rem 0 .4rem}
#mfEasy .mf-easy-loclbl{display:block;margin:.9rem 0 .55rem;font-size:1.02rem;font-weight:600;line-height:1.35;color:#d1d5db;text-align:center}
#mfEasy .mf-easy-search-loc .mf-easy-qw input{min-height:3.3rem;padding-left:2.7rem;border-radius:14px}
#mfEasy .mf-easy-qi{position:absolute;left:.85rem;top:50%;width:20px;height:20px;transform:translateY(-50%);color:#8e8e93;pointer-events:none}
#mfEasy .mf-easy-search-loc button[type=submit]{min-height:3.3rem;padding:0 1.25rem;border-radius:14px;border-color:#0a84ff;background:#0a84ff;color:#fff;font-weight:700}
#mfEasy .mf-easy-s-loc .mf-easy-res button,#mfEasy .mf-easy-s-loc .mf-easy-mine button{position:relative;padding:.85rem 2.4rem .85rem 1rem;border-radius:16px;border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.06);font-weight:650}
#mfEasy .mf-easy-s-loc .mf-easy-res button::after,#mfEasy .mf-easy-s-loc .mf-easy-mine button::after{content:'›';position:absolute;right:1rem;top:50%;transform:translateY(-50%);font-size:1.6rem;font-weight:300;line-height:1;color:#6e6e73}
/* 16-10 · «Les teves ubicacions»: 💛 la preferent, ⭐ Preferides, 📁 les carpetes i 📍 Totes, amb icona en un quadrat i quantes n'hi ha */
#mfEasy .mf-easy-s-loc .mf-easy-mine button{display:flex;align-items:center;gap:.75rem;min-height:3.6rem;padding-top:.6rem;padding-bottom:.6rem}
#mfEasy .mf-easy-mine-ic{flex:0 0 auto;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:11px;background:rgba(118,118,128,.2);font-size:1.3rem;line-height:1}
#mfEasy .mf-easy-mine-tx{display:flex;flex-direction:column;gap:.1rem;min-width:0;font-size:1.1rem;line-height:1.2}
#mfEasy .mf-easy-mine-tx small{font-size:.88rem;font-weight:500;color:#a1a1aa}
html[data-theme="light"] #mfEasy .mf-easy-mine-ic{background:rgba(118,118,128,.12)}
html[data-theme="light"] #mfEasy .mf-easy-mine-tx small{color:#6e6e73}
html[data-theme="light"] #mfEasy .mf-easy-locnow{background:rgba(52,199,89,.13);color:#1f8a3e}
html[data-theme="light"] #mfEasy .mf-easy-way{background:#fff;border-color:rgba(0,0,0,.06);color:#1c1c1e;box-shadow:0 1px 2px rgba(0,0,0,.04),0 6px 18px rgba(0,0,0,.05)}
html[data-theme="light"] #mfEasy .mf-easy-way:active{background:#f7f7f9}
html[data-theme="light"] #mfEasy .mf-easy-way b{color:#1c1c1e}
html[data-theme="light"] #mfEasy .mf-easy-way small{color:#6e6e73}
html[data-theme="light"] #mfEasy .mf-easy-loclbl{color:#3a3a3c}
html[data-theme="light"] #mfEasy .mf-easy-search-loc button[type=submit]{border-color:#007aff;background:#007aff;color:#fff}
html[data-theme="light"] #mfEasy .mf-easy-s-loc .mf-easy-res button,html[data-theme="light"] #mfEasy .mf-easy-s-loc .mf-easy-mine button{background:#fff;border-color:rgba(0,0,0,.06);box-shadow:0 1px 2px rgba(0,0,0,.04)}
html[data-theme="light"] #mfEasy .mf-easy-s-loc .mf-easy-res button::after,html[data-theme="light"] #mfEasy .mf-easy-s-loc .mf-easy-mine button::after{color:#c7c7cc}
#mfEasy .mf-easy-s-loc .mf-easy-mapbtns .mf-easy-btn{border-radius:14px;background:#0a84ff;font-weight:700}   /* «✓ Fes servir aquest lloc» del mapa, blau pla com «Cerca» */
#mfEasy .mf-easy-s-loc .mf-easy-mapbtns .mf-easy-btn:disabled{opacity:.45}
html[data-theme="light"] #mfEasy .mf-easy-s-loc .mf-easy-mapbtns .mf-easy-btn{background:#007aff}
html.mf-red #mfEasy .mf-easy-locnow{background:rgba(255,214,214,.12);color:#ffd6d6}
html.mf-red #mfEasy .mf-easy-search-loc button[type=submit],html.mf-red #mfEasy .mf-easy-s-loc .mf-easy-mapbtns .mf-easy-btn{border-color:#7a1f1f;background:#7a1f1f}
/* 15-10 (Jaume: «si troba un o diversos llocs, que es posi davant amb botons grans perquè triïs quin vols»): els resultats de la
   cerca en una finestra al davant (js/easy.js, rsOpen), un botó gros per lloc. A sobre de tot el mode fàcil (també del mapa) */
#mfEasy .mf-easy-rs{position:fixed;inset:0;z-index:200;display:flex;align-items:flex-end;justify-content:center;background:rgba(0,0,0,.5);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);animation:mfRsIn .18s ease-out}
@keyframes mfRsIn{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){#mfEasy .mf-easy-rs{animation:none}}
#mfEasy .mf-easy-rs-box{box-sizing:border-box;width:100%;max-width:30rem;max-height:88vh;max-height:88dvh;overflow-y:auto;overscroll-behavior:contain;padding:1.3rem 1rem calc(1.1rem + env(safe-area-inset-bottom,0px));border-radius:24px 24px 0 0;background:#1c1c1e;color:#f5f5f7;box-shadow:0 -8px 30px rgba(0,0,0,.35)}
#mfEasy .mf-easy-rs-box:focus{outline:none}
@media (min-width:700px){#mfEasy .mf-easy-rs{align-items:center;padding:1rem}#mfEasy .mf-easy-rs-box{border-radius:24px}}
#mfEasy .mf-easy-rs-box h2{margin:0 0 .3rem;font-size:1.5rem;font-weight:750;line-height:1.2;text-align:center;color:#f5f5f7}
#mfEasy .mf-easy-rs-d{margin:0 0 1rem;font-size:1rem;line-height:1.4;text-align:center;color:#a1a1aa}
#mfEasy .mf-easy-rs-l{display:flex;flex-direction:column;gap:.6rem}
#mfEasy .mf-easy-rs-o{display:flex;align-items:center;gap:.85rem;width:100%;min-height:4.6rem;padding:.85rem 1rem;border-radius:18px;border:2px solid rgba(10,132,255,.55);background:rgba(10,132,255,.12);color:#f5f5f7;text-align:left;cursor:pointer;transition:transform .12s ease,background-color .12s ease}
#mfEasy .mf-easy-rs-o:active{transform:scale(.985);background:rgba(10,132,255,.24)}
#mfEasy .mf-easy-rs-o:focus-visible{outline:3px solid #0a84ff;outline-offset:2px}
#mfEasy .mf-easy-rs-ic{flex:0 0 auto;display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:12px;background:linear-gradient(160deg,#4aa3ff,#0a6cf0)}
#mfEasy .mf-easy-rs-ic svg{width:25px;height:25px}
#mfEasy .mf-easy-rs-em{font-size:1.45rem;line-height:1}   /* 16-10: «📁 Tota la carpeta» (botó 📍 del mode complet) */
#mfEasy .mf-easy-rs-whole .mf-easy-rs-ic{background:linear-gradient(160deg,#ffd27a,#f2a33a)}
#mfEasy .mf-easy-rs-tx{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:.15rem}
#mfEasy .mf-easy-rs-tx b{font-size:1.25rem;font-weight:700;line-height:1.2}
#mfEasy .mf-easy-rs-tx small{font-size:.92rem;line-height:1.3;color:#a1a1aa}
#mfEasy .mf-easy-rs-ch{flex:0 0 auto;font-size:1.9rem;font-weight:300;line-height:1;color:#0a84ff}
#mfEasy .mf-easy-rs-x{display:block;width:100%;min-height:3.2rem;margin:.9rem 0 0;border:0;border-radius:14px;background:rgba(118,118,128,.24);color:#f5f5f7;font-size:1.05rem;font-weight:600;cursor:pointer}
html[data-theme="light"] #mfEasy .mf-easy-rs-box{background:#fff;color:#1c1c1e;box-shadow:0 -8px 30px rgba(0,0,0,.18)}
html[data-theme="light"] #mfEasy .mf-easy-rs-box h2{color:#1c1c1e}
html[data-theme="light"] #mfEasy .mf-easy-rs-d,html[data-theme="light"] #mfEasy .mf-easy-rs-tx small{color:#6e6e73}
html[data-theme="light"] #mfEasy .mf-easy-rs-o{border-color:rgba(0,122,255,.45);background:rgba(0,122,255,.07);color:#1c1c1e}
html[data-theme="light"] #mfEasy .mf-easy-rs-o:active{background:rgba(0,122,255,.15)}
html[data-theme="light"] #mfEasy .mf-easy-rs-ch{color:#007aff}
html[data-theme="light"] #mfEasy .mf-easy-rs-x{background:rgba(118,118,128,.12);color:#007aff}
html.mf-red #mfEasy .mf-easy-rs-o{border-color:rgba(255,176,176,.5);background:rgba(255,176,176,.08)}   /* el blau, amb el vel vermell, seria negre */
html.mf-red #mfEasy .mf-easy-rs-ic{background:#7a1f1f}
html.mf-red #mfEasy .mf-easy-rs-ch{color:#ffb0b0}
/* 15-10 (Jaume: «l'enrere del mode fàcil, millor un botonet amb fletxa a l'esquerra»): tots els «‹ Enrere» del mode fàcil (també
   «‹ Propostes» i «‹ Torna al simulador») són un botó rodó amb una fletxa ←. El text hi és (el posa l'i18n i el llegeix el lector
   de pantalla), però no es veu. A «Quin temps farà», a l'esquerra del botó del lloc, a la mateixa fila */
#mfEasy .mf-easy-back{--bk:#7dd3fc;position:relative;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;min-height:44px;padding:0;margin:0 0 .6rem;border-radius:50%;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.08);font-size:0;line-height:0;color:transparent;overflow:hidden;cursor:pointer;transition:transform .12s ease}
#mfEasy .mf-easy-back::before{content:'';width:22px;height:22px;background:var(--bk);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 12H5.5M11.5 5.5 5 12l6.5 6.5' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 12H5.5M11.5 5.5 5 12l6.5 6.5' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}
#mfEasy .mf-easy-back:active{transform:scale(.92);background:rgba(255,255,255,.14)}
html[data-theme="light"] #mfEasy .mf-easy-back{--bk:#007aff;background:#fff;border-color:rgba(0,0,0,.08);box-shadow:0 1px 2px rgba(0,0,0,.05)}
html[data-theme="light"] #mfEasy .mf-easy-back:active{background:#f2f2f7}
html.mf-red #mfEasy .mf-easy-back{--bk:#ffb4b4}
#mfEasy .mf-easy-s-wx,#mfEasy .mf-easy-s-list{position:relative}   /* «Quin temps farà» i Propostes: la fletxa a l'esquerra del lloc */
#mfEasy .mf-easy-s-wx>.mf-easy-back,#mfEasy .mf-easy-s-list>.mf-easy-back{position:absolute;left:0;top:8px;margin:0;z-index:1}
#mfEasy .mf-easy-s-wx>.mf-easy-locwrap,#mfEasy .mf-easy-s-list>.mf-easy-locwrap{padding:0 3.3rem}
/* 15-10 (Jaume: «a quin temps farà, que no hi hagi scroll vertical»): tot més compacte perquè la pantalla hi càpiga sencera en un
   mòbil (~730 px d'alçada): botons de dia més baixos, temperatura i frase en un bloc, 4 caselles d'una línia i gràfica més baixa */
#mfEasy .mf-easy-s-wx>.mf-easy-locwrap{margin-bottom:.55rem}
#mfEasy .mf-easy-s-wx h1{margin:0 0 .5rem;font-size:1.4rem}
:is(#mfEasy,.mf-wx5) .mf-easy-wxdays{gap:.35rem;margin:0 0 .55rem}
:is(#mfEasy,.mf-wx5) .mf-easy-wxdays button{gap:.2rem;padding:.4rem .1rem .45rem;border-radius:14px}
:is(#mfEasy,.mf-wx5) .mf-easy-wxdays .l{font-size:.84rem}
:is(#mfEasy,.mf-wx5) .mf-easy-wxdays .mf-ico{width:28px;height:28px;border-radius:8px}
:is(#mfEasy,.mf-wx5) .mf-easy-wxdays .t{flex-direction:row;align-items:baseline;gap:.25rem}
:is(#mfEasy,.mf-wx5) .mf-easy-wxdays .t b{font-size:1rem}
:is(#mfEasy,.mf-wx5) .mf-easy-wxdays .t i{font-size:.82rem}
:is(#mfEasy,.mf-wx5) .mf-easy-wxc{padding:.7rem .8rem .75rem;border-radius:20px}
:is(#mfEasy,.mf-wx5) .mf-easy-wxc-h{margin:0 0 .45rem;font-size:.7rem}
:is(#mfEasy,.mf-wx5) .mf-easy-wxt{display:flex;align-items:center;gap:.7rem;margin:0 0 .55rem}
:is(#mfEasy,.mf-wx5) .mf-easy-wxt>.mf-ico{width:46px;height:46px;border-radius:12px;box-shadow:0 2px 8px rgba(0,0,0,.16)}
:is(#mfEasy,.mf-wx5) .mf-easy-wxt>div{min-width:0}
:is(#mfEasy,.mf-wx5) .mf-easy-wxt-v{display:block;font-size:1.55rem;font-weight:650;line-height:1.1;letter-spacing:-.02em;color:var(--text)}
:is(#mfEasy,.mf-wx5) .mf-easy-wxt .mf-easy-wxp{margin:.12rem 0 0;font-size:.95rem;line-height:1.3}
:is(#mfEasy,.mf-wx5) .mf-easy-wxg{display:grid;grid-template-columns:1fr 1fr;gap:.4rem}
:is(#mfEasy,.mf-wx5) .mf-easy-wxq{display:flex;align-items:center;gap:.45rem;min-width:0;padding:.45rem .55rem;border-radius:12px;background:var(--tdy-tile)}
:is(#mfEasy,.mf-wx5) .mf-easy-wxq .mf-ico{flex:0 0 auto;width:24px;height:24px;border-radius:7px;box-shadow:none}
:is(#mfEasy,.mf-wx5) .mf-easy-wxq>span:not(.mf-ico){flex:1 1 auto;min-width:0;font-size:.76rem;font-weight:600;line-height:1.15;color:var(--muted)}
:is(#mfEasy,.mf-wx5) .mf-easy-wxq b{flex:0 0 auto;font-size:1.05rem;font-weight:650;color:var(--text);font-variant-numeric:tabular-nums}
:is(#mfEasy,.mf-wx5) .mf-easy-wxq b small{font-size:.7em;font-weight:500;color:var(--muted)}
:is(#mfEasy,.mf-wx5) .mf-easy-wxc .mf-hh{margin-top:.4rem;padding:.55rem .65rem .5rem}
:is(#mfEasy,.mf-wx5) .mf-hh>.mf-tdy-ch{font-size:.76rem}
:is(#mfEasy,.mf-wx5) .mf-hh>.mf-tdy-ch .mf-ico{width:22px;height:22px;border-radius:6px}
:is(#mfEasy,.mf-wx5) .mf-hh-rd{min-height:1.25rem;margin:.3rem 0 .2rem;font-size:.8rem}
:is(#mfEasy,.mf-wx5) .mf-hh-ax{margin-top:.2rem}
:is(#mfEasy,.mf-wx5) .mf-easy-wxc .mf-easy-sharp{margin-top:.4rem;padding:.45rem .65rem}
:is(#mfEasy,.mf-wx5) .mf-easy-wxc .mf-easy-sharp .mf-ico{width:24px;height:24px}
:is(#mfEasy,.mf-wx5) .mf-easy-wxc .mf-easy-sharp-v{font-size:1.15rem}
/* 16-10 (Jaume: «la caixa Meteo de l'inici del mode complet igual que "Quin temps farà"»): el mateix giny dins de #todayMeteo
   (.mf-wx5, js/easy.js mfWx5Mount). Ja és dins d'una caixa: sense la segona targeta (fons, vora i marge fora) */
html body #todayMeteo.mf-wx5 .mf-easy-wxc{background:none;border:0;box-shadow:none;padding:0;border-radius:0}
html body #todayMeteo.mf-wx5 .mf-easy-wxc-h{margin-top:.15rem}
#todayMeteo.mf-wx5 .mf-wx5-wait{padding:.6rem 0;font-size:.88rem;color:var(--muted)}
@media (max-height:700px){   /* iPhone SE i semblants: fora el títol i la data de la targeta (el dia ja surt marcat als botons) */
  #mfEasy .mf-easy-s-wx h1,#mfEasy .mf-easy-wxc-h{display:none}
  #mfEasy .mf-easy-s-wx>.mf-easy-locwrap{margin-bottom:.45rem}
  #mfEasy[data-s="wx"] .mf-easy-scroll{padding-bottom:calc(env(safe-area-inset-bottom,0px) + .8rem)}
  #mfEasy .mf-hh-rd{margin-top:.15rem}
  #mfEasy .mf-easy-wxq{padding:.36rem .5rem}
}
/*   ⚡ hores amb tempesta a la gràfica: un llamp groc que parpelleja (quiet amb «reduir el moviment») */
:is(#mfEasy,.mf-wx5) .mf-hh svg .lt{fill:#ffd60a;stroke:#9a4a00;stroke-width:.8;stroke-linejoin:round;animation:mfBolt 1.1s ease-in-out infinite}
@keyframes mfBolt{0%,100%{opacity:1}50%{opacity:.2}}
@media (prefers-reduced-motion:reduce){:is(#mfEasy,.mf-wx5) .mf-hh svg .lt{animation:none}}
html.mf-red :is(#mfEasy,.mf-wx5) .mf-hh svg .lt{fill:#ffd6d6;stroke:none}   /* el blau, amb el vel vermell, seria negre */
/* 16-10 (Jaume: Meteo, la primera caixa de l'inici): a l'ordinador la caixa és una columna de ~230 px i les caselles «Núvols dia 69 %»
   i les temperatures dels dies es trepitjaven. Columna estreta (només el giny del mode complet, #todayMeteo.mf-wx5: amb id, perquè les regles :is(#mfEasy,.mf-wx5) ja pesen com un id): dies amb la màxima sobre
   la mínima i caselles amb l'etiqueta a dalt i el valor a sota */
@container (max-width:290px){
  #todayMeteo.mf-wx5 .mf-easy-wxdays{gap:.25rem}
  #todayMeteo.mf-wx5 .mf-easy-wxdays button{padding:.4rem .05rem .4rem;border-radius:12px}
  #todayMeteo.mf-wx5 .mf-easy-wxdays .l{font-size:.74rem}
  #todayMeteo.mf-wx5 .mf-easy-wxdays .mf-ico{width:24px;height:24px;border-radius:7px}
  #todayMeteo.mf-wx5 .mf-easy-wxdays .t{flex-direction:column;align-items:center;gap:0}
  #todayMeteo.mf-wx5 .mf-easy-wxdays .t b{font-size:.92rem}
  #todayMeteo.mf-wx5 .mf-easy-wxdays .t i{font-size:.74rem}
  #todayMeteo.mf-wx5 .mf-easy-wxq{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:.4rem;row-gap:0;align-items:center;padding:.4rem .45rem}
  #todayMeteo.mf-wx5 .mf-easy-wxq .mf-ico{grid-row:1/3;width:22px;height:22px}
  #todayMeteo.mf-wx5 .mf-easy-wxq>span:not(.mf-ico){white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.72rem}
  #todayMeteo.mf-wx5 .mf-easy-wxq b{font-size:.98rem}
}
/* 16-10 (Jaume: «com la 3Cat i el Meteocat, molt simple, molt visual, pim pam»): la targeta nova del dia (js/app.js, _mfEasyWxDays):
   pastilles de màxima i mínima, la frase, Matí · Tarda · Nit, la tira hora a hora que es llisca, la línia per a la foto i «Més detall» */
:is(#mfEasy,.mf-wx5){--wx-mx:#ffb340;--wx-mxbg:rgba(255,159,10,.18);--wx-mn:#64b5ff;--wx-mnbg:rgba(10,132,255,.2);--wx-rain:#64b5ff;--wx-link:#0a84ff}
html[data-theme="light"] :is(#mfEasy,.mf-wx5){--wx-mx:#b45309;--wx-mxbg:rgba(255,149,0,.15);--wx-mn:#0a5fb4;--wx-mnbg:rgba(0,122,255,.11);--wx-rain:#0a5fb4;--wx-link:#007aff}
:is(#mfEasy,.mf-wx5) .mf-easy-wxdays .t b{color:var(--wx-mx)}
:is(#mfEasy,.mf-wx5) .mf-easy-wxdays .t i{color:var(--wx-mn)}
html[data-theme="light"] :is(#mfEasy,.mf-wx5) .mf-easy-wxdays .t i{color:var(--wx-mn)}
:is(#mfEasy,.mf-wx5) .mf-easy-wxdays button.on .t b{color:#b45309}
:is(#mfEasy,.mf-wx5) .mf-easy-wxdays button.on .t i{color:#0a5fb4}
html[data-theme="light"] :is(#mfEasy,.mf-wx5) .mf-easy-wxdays button.on .t b{color:#ffb340}
html[data-theme="light"] :is(#mfEasy,.mf-wx5) .mf-easy-wxdays button.on .t i{color:#64b5ff}
:is(#mfEasy,.mf-wx5) .mf-wxn-h{display:flex;align-items:center;justify-content:space-between;gap:.4rem .6rem;flex-wrap:wrap;margin:0 0 .5rem}
:is(#mfEasy,.mf-wx5) .mf-wxn-d{font-size:.72rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
:is(#mfEasy,.mf-wx5) .mf-wxn-pl{display:flex;gap:.35rem}
:is(#mfEasy,.mf-wx5) .mf-wxn-pl i{font-style:normal;padding:.26rem .6rem;border-radius:999px;font-size:.92rem;font-weight:700;white-space:nowrap;font-variant-numeric:tabular-nums}
:is(#mfEasy,.mf-wx5) .mf-wxn-pl .mx{background:var(--wx-mxbg);color:var(--wx-mx)}
:is(#mfEasy,.mf-wx5) .mf-wxn-pl .mn{background:var(--wx-mnbg);color:var(--wx-mn)}
:is(#mfEasy,.mf-wx5) .mf-wxn-txt{margin:0 0 .65rem;font-size:1.02rem;font-weight:500;line-height:1.4;color:var(--text);text-wrap:pretty}
/* 17-10 · botó «Previsió per Catalunya» (a sota de la targeta) i la finestra */
:is(#mfEasy,.mf-wx5) .mf-wxn-cat{display:flex;align-items:center;gap:.6rem;width:100%;margin:.55rem 0 .2rem;padding:.7rem .9rem;border:0;border-radius:14px;background:var(--tdy-tile,rgba(255,255,255,.08));color:inherit;font:600 .98rem/1.2 system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;text-align:left;cursor:pointer}
:is(#mfEasy,.mf-wx5) .mf-wxn-cat .ic{font-size:1.25rem;line-height:1}
:is(#mfEasy,.mf-wx5) .mf-wxn-cat-top{margin:0 0 .6rem;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.09)}
html[data-theme="light"] :is(#mfEasy,.mf-wx5) .mf-wxn-cat-top{background:#fff;border-color:rgba(0,0,0,.06);box-shadow:0 1px 2px rgba(0,0,0,.04)}
:is(#mfEasy,.mf-wx5) .mf-wxn-cat span:nth-child(2){flex:1}
:is(#mfEasy,.mf-wx5) .mf-wxn-cat .ar{font-size:1.35rem;line-height:1;opacity:.55}
.mf-catfc{--cf-bg:#0b1626;--cf-card:#14243a;--cf-tx:#eef4fb;--cf-mu:#9fb2c8;--cf-acc:#ffcf5c;--cf-mx:#ffb06b;--cf-mn:#8cc4ff;--cf-zn:#7cc4ff;position:fixed;inset:0;z-index:2147483000;background:var(--cf-bg);color:var(--cf-tx);font-family:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif}
.mf-catfc[hidden]{display:none}
html[data-theme="light"] .mf-catfc{--cf-bg:#f2f2f7;--cf-card:#fff;--cf-tx:#1c1c1e;--cf-mu:#6e6e73;--cf-acc:#b45309;--cf-mx:#c2410c;--cf-mn:#1d4ed8;--cf-zn:#1d4ed8}
.mf-catfc-in{display:flex;flex-direction:column;height:100%;max-width:820px;margin:0 auto}
.mf-catfc-top{display:flex;align-items:center;gap:.75rem;padding:calc(env(safe-area-inset-top,0px) + .8rem) 1rem .5rem}
.mf-catfc-x{flex:none;width:42px;height:42px;border:0;border-radius:50%;background:var(--cf-card);color:var(--cf-tx);font-size:1.7rem;line-height:1;cursor:pointer}
.mf-catfc-h h2{margin:0;font-size:1.3rem;font-weight:700;color:var(--cf-tx)}
.mf-catfc-sub{margin:.1rem 0 0;font-size:.82rem;color:var(--cf-mu)}
.mf-catfc-tabs{display:flex;gap:.5rem;padding:.3rem 1rem .6rem}
.mf-catfc-tabs:empty{display:none}
.mf-catfc-tabs button{flex:1;padding:.6rem .5rem;border:0;border-radius:12px;background:var(--cf-card);color:var(--cf-tx);font-family:inherit;font-size:1rem;font-weight:600;line-height:1.2;cursor:pointer}
.mf-catfc-tabs button small{font-weight:500;color:var(--cf-mu)}
.mf-catfc-tabs button[aria-selected="true"]{background:#0a84ff;color:#fff}
.mf-catfc-tabs button[aria-selected="true"] small{color:rgba(255,255,255,.8)}
.mf-catfc-b{flex:1;overflow:auto;-webkit-overflow-scrolling:touch;padding:.2rem 1rem calc(env(safe-area-inset-bottom,0px) + 1.4rem)}
.mf-catfc-tit{margin:.4rem 0 .35rem;font-size:1.35rem;font-weight:700;line-height:1.25}
.mf-catfc-gen{margin:0 0 .8rem;font-size:1.02rem;line-height:1.5}
.mf-catfc-nt{color:var(--cf-mu)}
.mf-catfc-foto{display:grid;gap:.15rem;margin:0 0 1rem;padding:.7rem .9rem;border-radius:14px;background:var(--cf-card);font-size:.95rem;line-height:1.45}
.mf-catfc-foto b{font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--cf-acc)}
.mf-catfc-z{margin:0 0 1rem;padding:.8rem .9rem .7rem;border-radius:16px;background:var(--cf-card)}
.mf-catfc-z h3{margin:0 0 .25rem;font-size:1rem;font-weight:700;color:var(--cf-zn)}
.mf-catfc-z p{margin:0 0 .6rem;font-size:.95rem;line-height:1.45;color:var(--cf-tx)}
.mf-catfc-pts{display:grid;grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:.45rem .7rem}
.mf-catfc-pt{display:grid;grid-template-columns:32px minmax(0,1fr) auto;grid-template-rows:auto auto;column-gap:.5rem;align-items:center;min-width:0}
.mf-catfc-pt .ic{grid-column:1;grid-row:1 / 3;display:grid;place-items:center;width:32px;height:32px}
.mf-catfc-pt .ic > *{width:32px;height:32px}
.mf-catfc-pt b{grid-column:2;grid-row:1;font-size:.9rem;font-weight:600;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mf-catfc-pt .tt{grid-column:2;grid-row:2;font-size:.85rem;line-height:1.2}
.mf-catfc-pt .mx{font-style:normal;font-weight:700;color:var(--cf-mx);margin-right:.35rem}
.mf-catfc-pt .mn{font-style:normal;color:var(--cf-mn)}
.mf-catfc-pt em{grid-column:3;grid-row:1 / 3;font-style:normal;font-size:.82rem;color:#4aa3ff;white-space:nowrap}
.mf-catfc-pt em.sn{color:#9fd3ff}
.mf-catfc-pt em.no{color:var(--cf-mu);opacity:.6}
.mf-catfc-note{margin:.4rem 0 0;font-size:.8rem;line-height:1.4;color:var(--cf-mu);text-align:center}
.mf-catfc-msg{display:grid;justify-items:center;gap:.8rem;padding:3rem 1rem;text-align:center;color:var(--cf-mu)}
.mf-catfc-msg p{margin:0;max-width:26rem;line-height:1.45}
.mf-catfc-retry{padding:.6rem 1.2rem;border:0;border-radius:12px;background:#0a84ff;color:#fff;font-family:inherit;font-size:1rem;font-weight:600;cursor:pointer}
.mf-catfc-spin{width:34px;height:34px;border-radius:50%;border:3px solid rgba(127,160,200,.3);border-top-color:#0a84ff;animation:mfCatSpin .9s linear infinite}
@keyframes mfCatSpin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.mf-catfc-spin{animation:none}}
html.mf-catfc-on,html.mf-catfc-on body{overflow:hidden}
:is(#mfEasy,.mf-wx5) .mf-wxn-mtn{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.4rem;margin:0 0 .55rem}
:is(#mfEasy,.mf-wx5) .mf-wxn-p{display:grid;justify-items:center;gap:.22rem;min-width:0;padding:.55rem .25rem .5rem;border-radius:14px;background:var(--tdy-tile);text-align:center}
:is(#mfEasy,.mf-wx5) .mf-wxn-p .mf-ico{width:42px;height:42px;border-radius:11px;box-shadow:none}
:is(#mfEasy,.mf-wx5) .mf-wxn-p b{font-size:.95rem;font-weight:650;color:var(--text)}
:is(#mfEasy,.mf-wx5) .mf-wxn-p span{font-size:.8rem;color:var(--muted);font-variant-numeric:tabular-nums}
:is(#mfEasy,.mf-wx5) .mf-wxn-p span i{display:block;font-style:normal;font-weight:700;color:var(--wx-rain);white-space:nowrap}
:is(#mfEasy,.mf-wx5) .mf-wxn-hr{position:relative;display:flex;gap:.15rem;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;margin:0 -.2rem .5rem;padding:.1rem .2rem .3rem;scrollbar-width:none}
:is(#mfEasy,.mf-wx5) .mf-wxn-hr::-webkit-scrollbar{display:none}
/* 17-10 · com es mou la tira de les hores: vores esvaïdes on n'hi ha més, fletxes i arrossegar amb el ratolí */
:is(#mfEasy,.mf-wx5) .mf-wxn-hrw{position:relative}
:is(#mfEasy,.mf-wx5) .mf-wxn-hrw.fr .mf-wxn-hr{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 34px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 34px),transparent)}
:is(#mfEasy,.mf-wx5) .mf-wxn-hrw.fl .mf-wxn-hr{-webkit-mask-image:linear-gradient(90deg,transparent,#000 34px);mask-image:linear-gradient(90deg,transparent,#000 34px)}
:is(#mfEasy,.mf-wx5) .mf-wxn-hrw.fl.fr .mf-wxn-hr{-webkit-mask-image:linear-gradient(90deg,transparent,#000 34px,#000 calc(100% - 34px),transparent);mask-image:linear-gradient(90deg,transparent,#000 34px,#000 calc(100% - 34px),transparent)}
:is(#mfEasy,.mf-wx5) .mf-wxn-hb{display:none;position:absolute;top:calc(50% - .25rem);transform:translateY(-50%);z-index:2;width:34px;height:34px;padding:0;border:0;border-radius:50%;background:#2b3648;color:#f5f5f7;font-size:1.45rem;line-height:1;box-shadow:0 2px 10px rgba(0,0,0,.35);cursor:pointer}
:is(#mfEasy,.mf-wx5) .mf-wxn-hb span{display:block;margin-top:-.12em}
:is(#mfEasy,.mf-wx5) .mf-wxn-hb.l{left:-6px}
:is(#mfEasy,.mf-wx5) .mf-wxn-hb.r{right:-6px}
:is(#mfEasy,.mf-wx5) .mf-wxn-hb:hover{background:#384559}
html[data-theme="light"] :is(#mfEasy,.mf-wx5) .mf-wxn-hb{background:#fff;color:#1c1c1e;box-shadow:0 1px 3px rgba(0,0,0,.12),0 4px 14px rgba(0,0,0,.12)}
html[data-theme="light"] :is(#mfEasy,.mf-wx5) .mf-wxn-hb:hover{background:#f2f2f7}
@media (hover:hover) and (pointer:fine){ :is(#mfEasy,.mf-wx5) .mf-wxn-hb{display:grid;place-items:center} :is(#mfEasy,.mf-wx5) .mf-wxn-hr{cursor:grab;scroll-snap-type:none} :is(#mfEasy,.mf-wx5) .mf-wxn-hr.drag{cursor:grabbing;user-select:none;-webkit-user-select:none} }
:is(#mfEasy,.mf-wx5) .mf-wxn-hb[hidden]{display:none!important}
:is(#mfEasy,.mf-wx5) .mf-wxn-hr .c{flex:0 0 3.2rem;display:grid;justify-items:center;gap:.28rem;padding:.4rem 0 .35rem;border-radius:12px;scroll-snap-align:start;font-variant-numeric:tabular-nums}
:is(#mfEasy,.mf-wx5) .mf-wxn-hr .c.now{background:var(--tdy-tile)}
:is(#mfEasy,.mf-wx5) .mf-wxn-hr .h{font-size:.72rem;font-weight:600;color:var(--muted);white-space:nowrap}
:is(#mfEasy,.mf-wx5) .mf-wxn-hr .mf-ico{width:28px;height:28px;border-radius:8px;box-shadow:none}
:is(#mfEasy,.mf-wx5) .mf-wxn-hr b{font-size:1rem;font-weight:650;color:var(--text)}
:is(#mfEasy,.mf-wx5) .mf-wxn-hr .r{min-height:1.1em;font-size:.8rem;line-height:1.1;color:var(--muted)}
:is(#mfEasy,.mf-wx5) .mf-wxn-hr .r.y{font-weight:700;color:var(--wx-rain)}
:is(#mfEasy,.mf-wx5) .mf-wxn-hr .w{display:flex;align-items:center;gap:.1rem;font-size:.72rem;color:var(--muted)}
:is(#mfEasy,.mf-wx5) .mf-wxn-hr .w i{display:inline-flex;width:11px;height:11px}
:is(#mfEasy,.mf-wx5) .mf-wxn-hr .w svg{width:11px;height:11px}
:is(#mfEasy,.mf-wx5) .mf-wxn-foto{display:flex;align-items:center;gap:.55rem;margin:0 0 .35rem;padding:.45rem .6rem;border-radius:12px;background:var(--tdy-tile);font-size:.86rem;line-height:1.3;color:var(--text)}
:is(#mfEasy,.mf-wx5) .mf-wxn-foto .mf-ico{flex:none;width:26px;height:26px;border-radius:8px;box-shadow:none}
:is(#mfEasy,.mf-wx5) .mf-wxn-more>summary{display:inline-block;padding:.3rem 0;font-size:.88rem;font-weight:600;color:var(--wx-link);cursor:pointer;list-style:none;-webkit-tap-highlight-color:transparent}
:is(#mfEasy,.mf-wx5) .mf-wxn-more>summary::-webkit-details-marker{display:none}
:is(#mfEasy,.mf-wx5) .mf-wxn-more>summary::after{content:" ›"}
:is(#mfEasy,.mf-wx5) .mf-wxn-more[open]>summary{margin-bottom:.45rem}
:is(#mfEasy,.mf-wx5) .mf-wxn-more[open]>summary::after{content:" ⌄"}
html.mf-red :is(#mfEasy,.mf-wx5){--wx-mx:#ffd6d6;--wx-mn:#ffb4b4;--wx-rain:#ffb4b4;--wx-link:#ffb4b4}
/* Entrada al mode fàcil des del mode complet: pastilla a la foto de la Portada (cantonada de baix a l'esquerra) */
/* 12-10 (Jaume: «el botó mode fàcil més gran»): més gran i del color del botó de Propostes, perquè es vegi */
.mf-easy-foot{font-size:1.05rem!important;font-weight:800!important;padding:.65rem 1.3rem!important;border-radius:2rem!important;border:2px solid #ea580c!important;background:linear-gradient(135deg,#d97706,#ea580c)!important;color:#fff!important}

/* ============================================================
   🙂 SIMULADOR MOLT FÀCIL (12-10-2026, js/sim-tiny.js · PLA-SIMULADOR-MOLT-FACIL.md)
   #mfEclSim.mf-lvl-tiny AMAGA tots els controls del simulador (llista blanca: només la vista i la capa #mfSimTiny).
   L'especificitat (#id.classe > :not(#id)×6) guanya els !important dels <style> petits d'index.html; un botó nou que
   s'afegeixi al simulador en el futur també quedarà amagat sol. Botons de 56-84 px, lletra de 17 px o més.
   ============================================================ */
#mfEclSim.mf-lvl-tiny > :not(#mfEclSimPano):not(#mfEclSimCanvas):not(#mfEclSimVideo):not(#mfSimLoadOv):not(#mfEclSimAsk):not(#mfSimTiny){display:none!important}
#mfTbTinyMain{display:none!important}
/* 12-10: la pregunta «oficial o d'usuari» per sobre del panell del molt fàcil, i més gran */
#mfEclSim.mf-lvl-tiny #mfEclSimAsk{z-index:60!important}
#mfEclSim.mf-lvl-tiny #mfEclSimAskTitle{font-size:1.25rem!important}
#mfEclSim.mf-lvl-tiny #mfEclSimAskTxt{font-size:1.06rem!important;line-height:1.5!important}
#mfEclSim.mf-lvl-tiny #mfEclSimAsk .mf-oppm-guide{min-height:56px;font-size:1.06rem!important;font-weight:800}
/* 12-10 (Jaume): el «🙂 Molt fàcil» de baix a l'esquerra (#mfTbTinyMain) ja no surt: el botó de mode és a dalt a la dreta (#mfSimEasyFab) */
#mfSimEasyFab{position:absolute;top:calc(.55rem + env(safe-area-inset-top,0px));right:3.4rem;z-index:50;min-height:2.5rem;padding:0 .85rem;border-radius:2rem;border:1px solid rgba(148,163,184,.45);background:rgba(15,27,46,.9);color:#e2e8f0;font:750 .92rem system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;white-space:nowrap;cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);box-shadow:0 3px 14px rgba(0,0,0,.45);touch-action:manipulation;-webkit-tap-highlight-color:transparent}
#mfEclSim.mf-sim-cleanview #mfSimEasyFab,#mfEclSim.mf-sim-cal #mfSimEasyFab{display:none!important}
#mfEclSim.mf-sim-easyrow #mfEclSimTopWrap{top:calc(3.3rem + env(safe-area-inset-top,0px))!important}
@media (max-width:620px){#mfEclSim.mf-sim-easyrow #mfSimInfoTgl{top:-2.4rem!important}}
#mfSimTiny{position:absolute;inset:0;z-index:40;pointer-events:none;font-family:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;color:#fff}
#mfSimTiny[hidden]{display:none!important}
#mfSimTiny button{font-family:inherit;touch-action:manipulation;-webkit-tap-highlight-color:transparent;cursor:pointer}
#mfSimTiny .tt-top{pointer-events:auto;position:absolute;left:0;right:0;top:0;display:flex;align-items:center;justify-content:space-between;gap:.6rem;padding:calc(.6rem + env(safe-area-inset-top,0px)) .75rem .9rem;background:linear-gradient(rgba(0,0,0,.72),rgba(0,0,0,0))}
#mfSimTiny .tt-x{min-height:56px;padding:0 1.2rem;border-radius:999px;border:2px solid #fcd34d;background:rgba(0,0,0,.85);color:#fcd34d;font-size:19px;font-weight:800}
/* 12-10 (Jaume): a dalt, el lloc a l'esquerra; a la dreta, fer petit / gran el menú i ✕ (botons rodons) */
#mfSimTiny .tt-tr{flex:0 0 auto;display:flex;gap:.45rem}
#mfSimTiny .tt-x,#mfSimTiny .tt-min{width:52px;height:52px;min-height:0;padding:0;border-radius:50%;display:flex;align-items:center;justify-content:center;line-height:1}
#mfSimTiny .tt-x{font-size:24px;font-weight:900}
#mfSimTiny .tt-min{border:2px solid rgba(255,255,255,.5);background:rgba(0,0,0,.7);color:#fff}
#mfSimTiny .tt-min.on{border-color:#fcd34d;color:#fcd34d}
#mfSimTiny .tt-loc{font-size:19px;font-weight:800;color:#fff;text-shadow:0 1px 4px #000;min-width:0;max-width:calc(100% - 8rem);text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-height:52px;padding:0 1rem;border-radius:999px;border:2px solid rgba(255,255,255,.6);background:rgba(0,0,0,.65)}   /* 12-10: és un botó: canvia el lloc */
#mfSimTiny .tt-note{pointer-events:auto;position:absolute;left:.75rem;right:.75rem;top:calc(4.6rem + env(safe-area-inset-top,0px));padding:.55rem .8rem;border-radius:.8rem;background:rgba(8,12,24,.88);border:1px solid rgba(255,255,255,.18);font-size:16px;line-height:1.35;color:#e2e8f0;text-align:center}
#mfSimTiny .tt-panel{pointer-events:auto;position:absolute;left:0;right:0;bottom:0;margin:0 auto;max-width:32rem;padding:1rem .9rem calc(.8rem + env(safe-area-inset-bottom,0px));background:rgba(8,12,24,.94);border:1px solid rgba(255,255,255,.18);border-bottom:none;border-radius:1.2rem 1.2rem 0 0;box-shadow:0 -8px 30px rgba(0,0,0,.5)}
#mfSimTiny h2{margin:0 0 .75rem;font-size:22px;font-weight:800;text-align:center;color:#fff}
#mfSimTiny .tt-grid{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}
#mfSimTiny .tt-tile{min-height:84px;border-radius:1rem;border:2px solid rgba(255,255,255,.22);background:rgba(30,41,59,.92);color:#fff;font-size:18px;font-weight:800;line-height:1.2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.25rem;padding:.4rem}
#mfSimTiny .tt-tile .i{font-size:32px;line-height:1}
/* 12-10 (Jaume): menú petit (.tt-mini): dues files primes */
#mfSimTiny .tt-panel.tt-mini{padding:.45rem .5rem calc(.45rem + env(safe-area-inset-bottom,0px))}
#mfSimTiny .tt-mrow{display:flex;align-items:center;gap:.3rem}
#mfSimTiny .tt-mrow+.tt-mrow{margin-top:.35rem}
#mfSimTiny .tt-mrow button{flex:1 1 0;min-width:0;min-height:38px;border-radius:.6rem;border:1px solid rgba(255,255,255,.25);background:rgba(30,41,59,.9);color:#fff;font-size:14px;font-weight:800;padding:0 .15rem;white-space:nowrap;overflow:hidden}
#mfSimTiny .tt-mrow button.tt-mchip,#mfSimTiny .tt-mrow button.tt-mcam{font-size:20px}
#mfSimTiny .tt-mrow button.tt-mchip.on{background:#fcd34d;border-color:#fcd34d}
#mfSimTiny .tt-mrow button.tt-mcam.on{background:#0e7490;border-color:#22d3ee}
#mfSimTiny .tt-mclock{flex:0 0 auto;min-width:4.4rem;text-align:center;line-height:1.05;cursor:pointer;padding:.1rem .15rem;border-radius:.5rem}
#mfSimTiny .tt-mclock:active{background:rgba(255,255,255,.08)}
#mfSimTiny .tt-mclock b{display:block;font:800 19px ui-monospace,Menlo,monospace;color:#fcd34d}
#mfSimTiny .tt-mclock span{font-size:12px;color:#cbd5e1}
/* 12-10 (Jaume): pantalla B, els 4 astres a dalt; el triat en groc */
#mfSimTiny .tt-chips{display:grid;grid-template-columns:repeat(4,1fr);gap:.4rem;margin:0 0 .7rem}
#mfSimTiny .tt-chip{min-height:58px;border-radius:.9rem;border:2px solid rgba(255,255,255,.2);background:rgba(30,41,59,.85);color:#e2e8f0;font-size:14px;font-weight:800;line-height:1.1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.2rem;padding:.25rem .15rem;min-width:0}
#mfSimTiny .tt-chip .i{font-size:22px;line-height:1}
#mfSimTiny .tt-chip .i .mf-ico{width:30px;height:30px;border-radius:8px}   /* 12-10: icones noves (mfEasyIcon) */
#mfSimTiny .tt-say .mf-ico{width:1.25em;height:1.25em;border-radius:.32em;margin:-.15em .4em 0 0;box-shadow:none}
#mfSimTiny .tt-mrow .mf-ico{width:26px;height:26px;border-radius:7px}
#mfSimTiny .tt-chip.on{background:#fcd34d;border-color:#fcd34d;color:#111;box-shadow:0 0 0 3px rgba(252,211,77,.3)}
#mfSimTiny .tt-say{font-size:21px;line-height:1.35;font-weight:700;margin:0 0 .3rem;color:#fff}
#mfSimTiny .tt-sub{font-size:17px;line-height:1.4;color:#cbd5e1;margin:0 0 .35rem}
#mfSimTiny .tt-guide{font-size:19px;font-weight:800;color:#fcd34d;margin:0 0 .6rem;min-height:1.4em}
#mfSimTiny .tt-guide.tt-tap{cursor:pointer;border-radius:.6rem;padding:.15rem .3rem;margin-left:-.3rem;margin-right:-.3rem}   /* 12-10: tocar-la gira la vista cap a l'astre */
#mfSimTiny .tt-guide.tt-tap:active{background:rgba(252,211,77,.12)}
#mfSimTiny .tt-big{width:100%;min-height:60px;border-radius:1rem;border:none;background:linear-gradient(135deg,#f59e0b,#f97316);color:#111;font-size:20px;font-weight:900;margin:0 0 .6rem}
#mfSimTiny .tt-time{display:flex;align-items:center;gap:.5rem;margin:0 0 .5rem}
#mfSimTiny .tt-time button{flex:0 0 auto;min-width:6.4rem;min-height:56px;border-radius:.9rem;border:2px solid rgba(255,255,255,.3);background:rgba(30,41,59,.92);color:#fff;font-size:18px;font-weight:800}
/* 12-10 (Jaume): a cada costat del rellotge, «1 hora» i a sota «5 min» */
#mfSimTiny .tt-steps{flex:0 0 auto;display:flex;flex-direction:column;gap:.4rem}
#mfSimTiny .tt-time button.tt-s5{min-height:46px;font-size:16px;font-weight:700;border-color:rgba(255,255,255,.22);background:rgba(30,41,59,.7);color:#e2e8f0}
#mfSimTiny .tt-clock{flex:1;min-width:0;text-align:center;line-height:1.1}
#mfSimTiny .tt-clock b{display:block;font-size:30px;font-family:ui-monospace,Menlo,monospace;color:#fcd34d}
#mfSimTiny .tt-clock span{font-size:15px;color:#cbd5e1}
#mfSimTiny .tt-foot{display:flex;justify-content:space-between;gap:.5rem}
#mfSimTiny .tt-foot-r{justify-content:flex-end;margin-top:.4rem}
/* 12-10 (Jaume): «Mode complet ›» com el botó del mode fàcil (abans l'enllaç «Més opcions ›») */
#mfSimTiny .tt-full{flex:0 0 auto;min-height:48px;padding:0 1rem;border-radius:999px;border:1px solid rgba(148,163,184,.45);background:rgba(15,27,46,.9);color:#e2e8f0;font:750 16px system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;white-space:nowrap;cursor:pointer}
html[data-theme="light"] #mfSimTiny .tt-full{background:#fff;border-color:rgba(40,55,88,.22);color:#283758}
/* 12-10 (Jaume): «Mode complet ›» a dalt a la dreta: hi caben el lloc (s'escurça amb «…»), «Mode complet ›», — i ✕ */
#mfSimTiny .tt-top .tt-loc{max-width:none;flex:0 1 auto;font-size:18px;min-height:48px;padding:0 .85rem}
#mfSimTiny .tt-tr{align-items:center;gap:.4rem}
#mfSimTiny .tt-top .tt-full{min-height:46px;padding:0 .8rem;font-size:15px}
#mfSimTiny .tt-top .tt-x,#mfSimTiny .tt-top .tt-min{width:46px;height:46px}
@media (max-width:370px){#mfSimTiny .tt-top .tt-full{font-size:14px;padding:0 .6rem}#mfSimTiny .tt-top .tt-x,#mfSimTiny .tt-top .tt-min{width:42px;height:42px}#mfSimTiny .tt-top .tt-loc{font-size:16px;padding:0 .7rem}}
/* 15-10 (Jaume: «treu la creu de la dreta i posa el mateix botó enrere a l'esquerra de tot i després la ubicació»): la fletxa ←
   rodona del mode fàcil (.mf-easy-back) a l'esquerra de tot, que tanca el simulador; el lloc just al costat */
#mfSimTiny .tt-top .tt-loc{margin-right:auto}
#mfSimTiny .tt-goback{flex:0 0 auto;display:flex;align-items:center;justify-content:center;width:46px;height:46px;padding:0;border-radius:50%;border:2px solid rgba(255,255,255,.5);background:rgba(0,0,0,.7);font-size:0;color:transparent;cursor:pointer;touch-action:manipulation}
#mfSimTiny .tt-goback::before{content:'';width:22px;height:22px;background:#fff;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 12H5.5M11.5 5.5 5 12l6.5 6.5' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 12H5.5M11.5 5.5 5 12l6.5 6.5' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}
#mfSimTiny .tt-goback:active{transform:scale(.92)}
html[data-theme="light"] #mfSimTiny .tt-goback{background:rgba(255,255,255,.94);border:1px solid rgba(0,0,0,.1);box-shadow:0 2px 10px rgba(0,0,0,.15)}
html[data-theme="light"] #mfSimTiny .tt-goback::before{background:#007aff}
html.mf-red #mfSimTiny .tt-goback::before{background:#ffb4b4}
@media (max-width:370px){#mfSimTiny .tt-goback{width:42px;height:42px}}
#mfSimTiny .tt-link{min-height:48px;padding:0 .4rem;background:none;border:none;color:#93c5fd;font-size:17px;font-weight:700;text-decoration:underline;text-underline-offset:3px}
@media (max-width:360px){#mfSimTiny .tt-time button{min-width:5.4rem;font-size:16px}#mfSimTiny .tt-clock b{font-size:26px}#mfSimTiny .tt-say{font-size:19px}}
/* 12-10 (Jaume): ⬅ en lloc de «Una altra cosa», 📷 vista càmera, i tocar la data i l'hora obre el selector del mòbil */
#mfSimTiny .tt-foot{align-items:center}
#mfSimTiny .tt-back{flex:0 0 auto;width:56px;height:56px;border-radius:50%;border:2px solid rgba(255,255,255,.3);background:rgba(30,41,59,.92);color:#fff;font-size:26px;font-weight:900;line-height:1;padding:0}
#mfSimTiny .tt-cam{flex:1;min-width:0;min-height:56px;margin:0 .5rem;border-radius:999px;border:2px solid rgba(255,255,255,.3);background:rgba(30,41,59,.92);color:#fff;font-size:17px;font-weight:800;padding:0 .6rem}
#mfSimTiny .tt-cam.on{background:#0e7490;border-color:#22d3ee}
#mfSimTiny .tt-clock{position:relative;border-radius:.8rem;padding:.25rem 0;cursor:pointer}
#mfSimTiny .tt-clock:active{background:rgba(255,255,255,.08)}
/* 12-10 (Jaume): calendari propi per triar el dia i l'hora, amb «✓ Accepta» (js/sim-tiny.js, mfSimTinyCalOpen) */
#mfSimTinyCal{pointer-events:auto;position:absolute;inset:0;z-index:5;display:flex;align-items:flex-end;justify-content:center;background:rgba(0,0,0,.55)}
#mfSimTinyCal[hidden]{display:none!important}
#mfSimTiny .tt-cal{width:100%;max-width:32rem;max-height:100%;overflow:auto;-webkit-overflow-scrolling:touch;background:#0f172a;border:1px solid rgba(255,255,255,.18);border-bottom:none;border-radius:1.2rem 1.2rem 0 0;padding:1rem .9rem calc(.9rem + env(safe-area-inset-bottom,0px));box-shadow:0 -10px 40px rgba(0,0,0,.6)}
#mfSimTiny .tt-cal h2{margin:0 0 .6rem}
#mfSimTiny .tt-cal-nav{display:flex;align-items:center;justify-content:space-between;margin:0 0 .5rem}
#mfSimTiny .tt-cal-nav b{font-size:21px;font-weight:800}
#mfSimTiny .tt-cal-nav button{width:54px;height:50px;border-radius:.8rem;border:2px solid rgba(255,255,255,.25);background:rgba(30,41,59,.92);color:#fff;font-size:30px;font-weight:800;line-height:1}
#mfSimTiny .tt-cal-wd,#mfSimTiny .tt-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:.3rem;text-align:center}
#mfSimTiny .tt-cal-wd span{font-size:14px;font-weight:700;color:#94a3b8;text-transform:uppercase;padding:.15rem 0}
#mfSimTiny .tt-day{position:relative;height:44px;border-radius:.7rem;border:0;background:rgba(30,41,59,.75);color:#fff;font-size:18px;font-weight:700;padding:0}
#mfSimTiny .tt-day i{position:absolute;top:1px;right:2px;font-style:normal;font-size:15px;line-height:1}
#mfSimTiny .tt-cal-leg i{font-style:normal}
#mfSimTiny .tt-day i.n,#mfSimTiny .tt-cal-leg i.n{filter:drop-shadow(0 0 1.5px #e2e8f0) drop-shadow(0 0 1px #e2e8f0)}   /* la lluna nova és fosca: vora clara perquè es vegi */   /* 12-10: 🌑 lluna nova · 🌕 lluna plena */
#mfSimTiny .tt-cal-leg{text-align:center;font-size:14px;color:#94a3b8;margin:.45rem 0 0}
#mfSimTiny .tt-day.today{box-shadow:inset 0 0 0 2px #60a5fa}
#mfSimTiny .tt-day.sel{background:#fcd34d;color:#111;font-weight:900;box-shadow:0 0 0 3px rgba(252,211,77,.35)}
#mfSimTiny .tt-cal-time{display:flex;align-items:center;justify-content:center;gap:.45rem;margin:.85rem 0 .3rem}
#mfSimTiny .tt-cal-time span{font-size:18px;font-weight:700;color:#cbd5e1;margin-right:.35rem}
#mfSimTiny .tt-cal-time b{font-size:28px;color:#fcd34d}
#mfSimTiny .tt-cal-time select{font:800 28px ui-monospace,Menlo,monospace;color:#fcd34d;background:rgba(30,41,59,.92);border:2px solid rgba(255,255,255,.3);border-radius:.8rem;padding:.3rem .7rem;min-height:58px;-webkit-appearance:none;appearance:none;text-align:center;text-align-last:center;cursor:pointer}
#mfSimTiny .tt-cal-hint{text-align:center;font-size:16px;line-height:1.45;color:#cbd5e1;margin:.35rem 0 .75rem;min-height:1.45em}
#mfSimTiny .tt-cal-hint b{color:#fff;font-size:17px}
#mfSimTiny .tt-cal-foot{display:flex;gap:.6rem}
#mfSimTiny .tt-cal-no{flex:1;min-height:58px;border-radius:1rem;border:2px solid rgba(255,255,255,.3);background:transparent;color:#fff;font-size:17px;font-weight:800;padding:0 .25rem}
#mfSimTiny .tt-cal-now{flex:1;min-height:58px;border-radius:1rem;border:2px solid #60a5fa;background:rgba(37,99,235,.2);color:#dbeafe;font-size:17px;font-weight:800;padding:0 .25rem}
#mfSimTiny .tt-cal-ok{flex:1.6;min-height:58px;border-radius:1rem;border:0;background:linear-gradient(135deg,#f59e0b,#f97316);color:#111;font-size:21px;font-weight:900}
/* 12-10 (Jaume: «si entrem amb el mode dia, que la simulació també surti en mode dia; ara la part de baix surt negra»):
   el simulador molt fàcil amb data-theme="light": panell blanc translúcid, botons blancs, text negre; l'hora i la guia en ambre
   fosc (el groc clar no es llegeix sobre blanc); el triat continua en groc. El cel (foto o dibuix) no canvia */
html[data-theme="light"] #mfSimTiny{color:#1c1c1e}
html[data-theme="light"] #mfSimTiny .tt-x,html[data-theme="light"] #mfSimTiny .tt-min{background:rgba(255,255,255,.94);border:1px solid rgba(0,0,0,.1);color:#1c1c1e;box-shadow:0 2px 10px rgba(0,0,0,.15)}
html[data-theme="light"] #mfSimTiny .tt-min.on{border-color:#f59e0b;color:#b45309}
html[data-theme="light"] #mfSimTiny .tt-loc{background:rgba(255,255,255,.94);border:1px solid rgba(0,0,0,.08);color:#1c1c1e;text-shadow:none;box-shadow:0 2px 10px rgba(0,0,0,.15)}
html[data-theme="light"] #mfSimTiny .tt-note{background:rgba(255,255,255,.94);border-color:rgba(0,0,0,.08);color:#1c1c1e}
html[data-theme="light"] #mfSimTiny .tt-panel{background:rgba(248,248,250,.95);border-color:rgba(0,0,0,.08);box-shadow:0 -8px 30px rgba(0,0,0,.18);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
html[data-theme="light"] #mfSimTiny h2,html[data-theme="light"] #mfSimTiny .tt-say{color:#1c1c1e}
html[data-theme="light"] #mfSimTiny .tt-sub{color:#3a3a3c}
html[data-theme="light"] #mfSimTiny .tt-guide,html[data-theme="light"] #mfSimTiny .tt-clock b,html[data-theme="light"] #mfSimTiny .tt-mclock b,html[data-theme="light"] #mfSimTiny .tt-cal-time b{color:#b45309}
html[data-theme="light"] #mfSimTiny .tt-guide.tt-tap:active{background:rgba(245,158,11,.12)}
html[data-theme="light"] #mfSimTiny .tt-clock span,html[data-theme="light"] #mfSimTiny .tt-mclock span{color:#6e6e73}
html[data-theme="light"] #mfSimTiny .tt-clock:active,html[data-theme="light"] #mfSimTiny .tt-mclock:active{background:rgba(0,0,0,.05)}
html[data-theme="light"] #mfSimTiny .tt-tile,html[data-theme="light"] #mfSimTiny .tt-chip,html[data-theme="light"] #mfSimTiny .tt-time button,html[data-theme="light"] #mfSimTiny .tt-cam,html[data-theme="light"] #mfSimTiny .tt-back,html[data-theme="light"] #mfSimTiny .tt-mrow button{background:#fff;border-color:rgba(0,0,0,.1);color:#1c1c1e}
html[data-theme="light"] #mfSimTiny .tt-time button.tt-s5{background:#f7f7f9;border-color:rgba(0,0,0,.08);color:#3a3a3c}
html[data-theme="light"] #mfSimTiny .tt-chip.on,html[data-theme="light"] #mfSimTiny .tt-mrow button.tt-mchip.on{background:#fcd34d;border-color:#f5b800;color:#111}
html[data-theme="light"] #mfSimTiny .tt-cam.on,html[data-theme="light"] #mfSimTiny .tt-mrow button.tt-mcam.on{background:#0e7490;border-color:#0e7490;color:#fff}
html[data-theme="light"] #mfSimTiny .tt-link{color:#007aff}
html[data-theme="light"] #mfSimTiny #mfSimTinyCal{background:rgba(0,0,0,.3)}
html[data-theme="light"] #mfSimTiny .tt-cal{background:#fff;border-color:rgba(0,0,0,.08);box-shadow:0 -10px 40px rgba(0,0,0,.2)}
html[data-theme="light"] #mfSimTiny .tt-cal-nav button,html[data-theme="light"] #mfSimTiny .tt-day{background:#f2f2f7;border-color:rgba(0,0,0,.08);color:#1c1c1e}
html[data-theme="light"] #mfSimTiny .tt-day.today{box-shadow:inset 0 0 0 2px #007aff}
html[data-theme="light"] #mfSimTiny .tt-day.sel{background:#fcd34d;color:#111}
html[data-theme="light"] #mfSimTiny .tt-day i.n,html[data-theme="light"] #mfSimTiny .tt-cal-leg i.n{filter:none}
html[data-theme="light"] #mfSimTiny .tt-cal-wd span{color:#8e8e93}
html[data-theme="light"] #mfSimTiny .tt-cal-leg,html[data-theme="light"] #mfSimTiny .tt-cal-hint{color:#6e6e73}
html[data-theme="light"] #mfSimTiny .tt-cal-hint b{color:#1c1c1e}
html[data-theme="light"] #mfSimTiny .tt-cal-time span{color:#3a3a3c}
html[data-theme="light"] #mfSimTiny .tt-cal-time select{background:#f2f2f7;border-color:rgba(0,0,0,.1);color:#b45309}
html[data-theme="light"] #mfSimTiny .tt-cal-no{border-color:rgba(0,0,0,.15);color:#1c1c1e}
html[data-theme="light"] #mfSimTiny .tt-cal-now{border-color:#007aff;background:rgba(0,122,255,.1);color:#007aff}
@media (max-height:640px){#mfSimTiny .tt-day{height:38px}#mfSimTiny .tt-cal h2{font-size:19px;margin-bottom:.4rem}}
/* 12-10: mòbils baixos (≤700 px): el panell de la pantalla B més compacte, perquè es vegi el cel */
@media (max-height:700px){
#mfSimTiny .tt-panel{padding-top:.7rem}
#mfSimTiny .tt-chips{margin-bottom:.5rem;gap:.3rem}
#mfSimTiny .tt-chip{min-height:46px;font-size:13px;gap:.1rem}
#mfSimTiny .tt-chip .i{font-size:18px}
#mfSimTiny .tt-chip .i .mf-ico{width:24px;height:24px;border-radius:6px}
#mfSimTiny .tt-say{font-size:18px;line-height:1.3}
#mfSimTiny .tt-sub{font-size:15px;margin-bottom:.25rem}
#mfSimTiny .tt-guide{font-size:17px;margin-bottom:.4rem}
#mfSimTiny .tt-big{min-height:50px;font-size:18px;margin-bottom:.45rem}
#mfSimTiny .tt-time{margin-bottom:.4rem}
#mfSimTiny .tt-time button{min-height:46px}
#mfSimTiny .tt-time button.tt-s5{min-height:38px}
#mfSimTiny .tt-steps{gap:.3rem}
#mfSimTiny .tt-clock b{font-size:26px}
#mfSimTiny .tt-cam{min-height:48px}
#mfSimTiny .tt-note{top:calc(4.2rem + env(safe-area-inset-top,0px));padding:.4rem .7rem;font-size:15px}
}

/* ===== 13-10 · SIMULADOR: 🌤️ El temps i 📤 compartir (Jaume) =====
   Molt fàcil (js/sim-tiny.js): a baix, «📷 Vista càmera» · «🌤️ El temps» · 📤; al menú petit, 🌤️ i 📤 després de 📷.
   Finestra «El temps» (mfSimWxOpen, js/app.js): mateix estil que la targeta Meteo de la portada (classes .mf-tdy-* i .mf-tdk-*),
   amb les seves variables aquí perquè no és dins de .today-grid */
#mfSimTiny .tt-foot .tt-cam{margin:0;font-size:15px;padding:0 .35rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#mfSimTiny .tt-foot .tt-wx{flex:.8 1 0}
#mfSimTiny .tt-sh{flex:0 0 auto;width:48px;height:48px;border-radius:50%;border:2px solid rgba(255,255,255,.3);background:rgba(30,41,59,.92);color:#fff;display:flex;align-items:center;justify-content:center;padding:0}
#mfSimTiny .tt-mrow button.tt-msh svg{width:20px;height:20px;display:block;margin:0 auto}
html[data-theme="light"] #mfSimTiny .tt-sh{background:#fff;border-color:rgba(0,0,0,.1);color:#1c1c1e;box-shadow:0 2px 10px rgba(0,0,0,.12)}
@media (max-width:370px){#mfSimTiny .tt-foot .tt-cam{font-size:14px}#mfSimTiny .tt-sh{width:44px;height:44px}}
.mf-swx-ov{position:fixed;inset:0;z-index:2147483000;display:flex;align-items:flex-end;justify-content:center;background:rgba(0,0,0,.45);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
.mf-swx{--tdy-n:#2b3768;--tdy-b:#4f7fe0;--tdy-g:#f4b247;--tdy-d:#a6d3ff;--tdy-ml:#4b4ec4;--tdy-tile:rgba(118,118,128,.08);--tdy-sep:rgba(60,60,67,.12);--tdy-track:rgba(118,118,128,.16);
  --kpi-good:#1f9d4c;--kpi-good-bg:rgba(52,199,89,.15);--kpi-mid:#c27400;--kpi-mid-bg:rgba(255,159,10,.17);--kpi-bad:#d1372d;--kpi-bad-bg:rgba(255,59,48,.13);
  box-sizing:border-box;width:100%;max-width:440px;max-height:88vh;max-height:88dvh;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;
  background:var(--card);color:var(--text);border-radius:20px 20px 0 0;padding:.9rem 1rem calc(1.1rem + env(safe-area-inset-bottom,0px));
  box-shadow:0 -6px 30px rgba(0,0,0,.25);font-family:-apple-system,BlinkMacSystemFont,system-ui,'Segoe UI',Roboto,'Helvetica Neue',sans-serif;container-type:inline-size}
[data-theme="light"] .mf-swx{background:#fff}
[data-theme="dark"] .mf-swx{--tdy-n:#27325f;--tdy-b:#3b67cf;--tdy-g:#e8a23d;--tdy-d:#76b0e6;--tdy-ml:#7276ee;--tdy-tile:rgba(255,255,255,.05);--tdy-sep:rgba(255,255,255,.08);--tdy-track:rgba(255,255,255,.09);
  --kpi-good:#4cd57a;--kpi-good-bg:rgba(48,209,88,.18);--kpi-mid:#ffb340;--kpi-mid-bg:rgba(255,170,40,.17);--kpi-bad:#ff6b61;--kpi-bad-bg:rgba(255,90,80,.17)}
html.mf-red .mf-swx{--tdy-ml:#ffb0b0;--tdy-b:#ffb0b0;--tdy-sep:rgba(255,176,176,.14);--kpi-good:#ffd6d6;--kpi-good-bg:rgba(255,214,214,.22);--kpi-mid:#d08888;--kpi-mid-bg:rgba(208,136,136,.14);--kpi-bad:#8f5050;--kpi-bad-bg:rgba(143,80,80,.16)}
html.mf-red .mf-swx .mf-ico{background:rgba(255,255,255,.08)}
@media (min-width:700px){.mf-swx-ov{align-items:center;padding:1rem}.mf-swx{border-radius:20px;box-shadow:0 20px 60px rgba(0,0,0,.35)}}
.mf-swx-head{display:flex;align-items:flex-start;gap:.6rem;margin-bottom:.8rem}
.mf-swx-head>div{flex:1 1 auto;min-width:0}
.mf-swx-head b{display:block;font-size:1.05rem;font-weight:700;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mf-swx-head span{display:block;margin-top:.15rem;font-size:.85rem;color:var(--muted);font-variant-numeric:tabular-nums}
.mf-swx-x{flex:0 0 auto;width:36px;height:36px;border-radius:50%;border:0;background:var(--tdy-track);color:var(--text);font-size:1rem;line-height:1;cursor:pointer}
.mf-swx-sec{margin:1.05rem 0 .55rem;font-size:.72rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.mf-swx-body>.mf-swx-sec:first-child{margin-top:0}
.mf-swx-note{margin:.1rem 0 .3rem;font-size:.9rem;line-height:1.4;color:var(--muted)}
.mf-swx .mf-tdy-ml{margin:.5rem 0 0}
.mf-swx .mf-tdy-pair{margin-top:.5rem}
.mf-swx .mf-tdy-wx{margin-bottom:.6rem}
.mf-swx-clouds .mf-tdy-big{margin-bottom:.15rem}
.mf-swx-lay{display:grid;grid-template-columns:4.4rem minmax(0,1fr) 2.7rem;align-items:center;gap:.55rem;margin-top:.45rem;font-size:.8rem;color:var(--muted)}
.mf-swx-lay b{text-align:right;font-weight:600;color:var(--text);font-variant-numeric:tabular-nums}
.mf-swx-lay .mf-tdy-fill{background:var(--tdy-b)}
.mf-swx .mf-tdk-row{margin-bottom:0}

/* 13-10 (Jaume): ✕ petita dins dels cercadors del mode fàcil i del simulador (js/easy.js, qxSync); fora la creu del navegador */
#mfEasy .mf-easy-search .mf-easy-qw{position:relative;flex:1;min-width:0;display:flex}
#mfEasy .mf-easy-search .mf-easy-qw input{flex:1;min-width:0;padding-right:2.7rem}
#mfEasy .mf-easy-search input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none;display:none}
#mfEasy .mf-easy-search .mf-easy-qx{position:absolute;right:.5rem;top:50%;transform:translateY(-50%);width:1.85rem;height:1.85rem;min-height:0;padding:0;border:0;border-radius:50%;
  background:rgba(148,163,184,.32);color:#e2e8f0;font-size:.8rem;font-weight:800;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;-webkit-tap-highlight-color:transparent}
#mfEasy .mf-easy-search .mf-easy-qx[hidden]{display:none}
html[data-theme="light"] #mfEasy .mf-easy-search .mf-easy-qx{background:rgba(60,60,67,.16);border:0;color:#3c3c43}

/* 13-10 (Jaume): mapa de Google del simulador fàcil amb la cobertura de Street View (js/easy.js, gCreate): a dalt a la dreta,
   🛰️ Híbrid / 🗺️ Mapa i «Street View» (blau = línies blaves visibles) */
.mf-easy-gctl{display:flex;flex-direction:column;align-items:flex-end;gap:.45rem;margin:.6rem .6rem 0 0}
.mf-easy-cov{display:inline-flex;align-items:center;gap:.5rem}
.mf-easy-cov i{display:inline-block;width:18px;height:4px;border-radius:2px;background:#9aa0a6}
.mf-easy-cov.on{background:#1a73e8;border-color:#1a73e8;color:#fff}
.mf-easy-cov.on i{background:#fff}

/* 13-10: botons «Híbrid» i «SV» del mapa de Google del simulador fàcil com a capa pròpia (#mfEasyGCtl, js/easy.js gCreate) */
#mfEasyGCtl{position:absolute;top:0;right:0;z-index:6}
#mfEasyGCtl[hidden]{display:none}
/* 13-10: «⭐ Els meus llocs» per passos al mapa del simulador: «‹ grup» per tornar */
#mfEasy .mf-easy-fmap-res .mf-easy-mine-back{background:transparent!important;border-color:transparent!important;color:#7cc4ff;font-weight:800}
html[data-theme="light"] #mfEasy .mf-easy-fmap-res .mf-easy-mine-back{color:#007aff}

/* 13-10 (Jaume): mapa de l'editor d'ubicacions (alta i edició): «🛰️ Híbrid / 🗺️ Mapa» i «— SV» a dalt a la dreta; el de Google
   (#mfEditMapG) va a sobre del Leaflet (js/app.js, _mfEditSv) */
.mf-ed-mapw{position:relative;margin-bottom:.3rem}
.mf-ed-mapw #mfEditMap{isolation:isolate}
.mf-ed-mapg{position:absolute;inset:0;z-index:2;border-radius:.6rem;overflow:hidden;border:1px solid var(--border)}
.mf-ed-mapctl{position:absolute;top:.45rem;right:.45rem;z-index:3;display:flex;flex-direction:column;align-items:flex-end;gap:.35rem}
.mf-ed-mapctl .mf-easy-lyr{font-size:13px;padding:.3rem .55rem;border-width:1px;border-radius:8px}
.mf-easy-cov.is-busy{opacity:.55}

/* 13-10 (Jaume): 💾 desar el lloc al simulador molt fàcil (js/sim-tiny.js, mfSimTinySave): botó a baix i full com el del calendari */
#mfSimTiny .tt-foot .tt-cam{font-size:14px;padding:0 .3rem}
@media (max-width:370px){#mfSimTiny .tt-foot .tt-cam{font-size:13px}#mfSimTiny .tt-foot{gap:.4rem}}
#mfSimTinySave{pointer-events:auto;position:absolute;inset:0;z-index:5;display:flex;align-items:flex-end;justify-content:center;background:rgba(0,0,0,.55)}
#mfSimTinySave[hidden]{display:none!important}
#mfSimTiny .tt-sv-here{margin:0 0 .7rem;font-size:15px;color:#cbd5e1;font-variant-numeric:tabular-nums}
#mfSimTiny .tt-sv-p{margin:0 0 .9rem;font-size:17px;line-height:1.4;color:#e2e8f0}
#mfSimTiny .tt-sv-l{display:block;margin:0 0 .3rem;font-size:14px;font-weight:700;color:#94a3b8}
#mfSimTiny .tt-sv-in{display:block;box-sizing:border-box;width:100%;min-height:52px;margin:0 0 .6rem;padding:0 .85rem;border-radius:.85rem;border:1px solid rgba(148,163,184,.45);background:#0b1324;color:#f1f5f9;font-size:17px;font-family:inherit}
#mfSimTiny .tt-sv-new{display:block;width:100%;min-height:56px;margin:0 0 .4rem;font-size:19px}
#mfSimTiny .tt-sv-or{margin:.8rem 0 .4rem;font-size:15px;color:#94a3b8}
#mfSimTiny .tt-sv-list{display:flex;flex-direction:column;gap:.4rem;margin:0 0 .8rem;max-height:34vh;overflow-y:auto}
#mfSimTiny .tt-sv-list button{display:flex;flex-direction:column;align-items:flex-start;gap:.1rem;min-height:52px;padding:.5rem .8rem;border-radius:.85rem;border:1px solid rgba(255,255,255,.2);background:rgba(30,41,59,.92);color:#fff;font-size:17px;font-weight:800;text-align:left}
#mfSimTiny .tt-sv-list button small{font-size:13px;font-weight:600;color:#94a3b8}
#mfSimTiny .tt-sv-list button.arm{background:#b45309;border-color:#f59e0b;color:#fff;justify-content:center}
html[data-theme="light"] #mfSimTiny #mfSimTinySave{background:rgba(0,0,0,.3)}
/* 13-10 · molt fàcil: «💾 Desa aquest lloc» uns segons després de triar un lloc nou al mapa (js/sim-tiny.js, svHintFor) */
#mfSimTiny .tt-svh{pointer-events:auto;position:absolute;left:50%;top:calc(4.6rem + env(safe-area-inset-top,0px));transform:translateX(-50%);min-height:46px;padding:0 1.2rem;border:0;border-radius:999px;background:#2563eb;color:#fff;font-family:inherit;font-size:17px;font-weight:600;white-space:nowrap;box-shadow:0 6px 22px rgba(0,0,0,.4);cursor:pointer;animation:ttSvhIn .3s ease-out}
#mfSimTiny .tt-svh[hidden]{display:none}
@keyframes ttSvhIn{from{opacity:0;transform:translate(-50%,-8px)}to{opacity:1;transform:translateX(-50%)}}
html.mf-red #mfSimTiny .tt-svh{background:#7a1f1f;color:#ffd6d6}
html[data-theme="light"] #mfSimTiny .tt-sv-here,html[data-theme="light"] #mfSimTiny .tt-sv-or,html[data-theme="light"] #mfSimTiny .tt-sv-l{color:#6b7280}
html[data-theme="light"] #mfSimTiny .tt-sv-p{color:#1c1c1e}
html[data-theme="light"] #mfSimTiny .tt-sv-in{background:#fff;border-color:rgba(60,60,67,.22);color:#1c1c1e}
html[data-theme="light"] #mfSimTiny .tt-sv-list button{background:#fff;border-color:rgba(0,0,0,.1);color:#1c1c1e}
html[data-theme="light"] #mfSimTiny .tt-sv-list button small{color:#6b7280}
html[data-theme="light"] #mfSimTiny .tt-sv-list button.arm{background:#f59e0b;border-color:#f59e0b;color:#111}