:root{
    --ocean-deep:#0B3D2E;
    --ocean-mid:#12523D;
    --turquoise:#008751;
    --turquoise-bright:#28C878;
    --sand:#F4F1EA;
    --sand-dim:#E6E1D5;
    --coral:#D4622A;
    --sargassum:#6E7F52;
    --amber:#D9A520;
    --ink:#0B3D2E;
    --paper:#FFFFFF;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    background:var(--sand);
    color:var(--ink);
    font-family:'Manrope', sans-serif;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  h1,h2,h3, .display{font-family:'Space Grotesk', sans-serif;}
  .mono{font-family:'IBM Plex Mono', monospace;}

  @media (prefers-reduced-motion: reduce){
    *{animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important; scroll-behavior:auto !important;}
  }

  a{color:inherit;}
  ::selection{background:var(--turquoise-bright); color:var(--ocean-deep);}

  /* ---------- TICKER ---------- */
  .ticker-bar{
    background:var(--ocean-deep);
    color:var(--sand);
    overflow:hidden;
    white-space:nowrap;
    position:sticky; top:0; z-index:50;
    border-bottom:1px solid rgba(255,255,255,0.08);
  }
  .ticker-track{
    display:inline-flex;
    animation:ticker 38s linear infinite;
    padding:9px 0;
  }
  .ticker-track span{
    padding:0 2.2rem;
    font-family:'IBM Plex Mono', monospace;
    font-size:0.78rem;
    letter-spacing:0.02em;
    display:inline-flex;
    align-items:center;
    gap:0.5rem;
  }
  .ticker-track span::before{content:"●"; color:var(--coral); font-size:0.55rem;}
  @keyframes ticker{
    0%{transform:translateX(0);}
    100%{transform:translateX(-50%);}
  }

  /* ---------- NAV ---------- */
  header.nav{
    position:sticky; top:33px; z-index:49;
    background:rgba(244,241,234,0.92);
    backdrop-filter:blur(10px);
    border-bottom:1px solid rgba(11,61,46,0.1);
  }
  .nav-inner{
    max-width:1180px; margin:0 auto;
    display:flex; align-items:center; justify-content:space-between;
    padding:0.9rem 1.5rem;
  }
  .brand{
    display:flex; align-items:baseline; gap:0.5rem; white-space:nowrap; flex-shrink:0;
    font-family:'Space Grotesk', sans-serif; font-weight:700; font-size:1.15rem;
    letter-spacing:-0.01em;
  }
  .brand .dot{width:8px; height:8px; border-radius:50%; background:var(--turquoise); display:inline-block; animation:pulse 2.2s ease-in-out infinite;}
  @keyframes pulse{
    0%,100%{opacity:1; box-shadow:0 0 0 0 rgba(0,135,81,0.5);}
    50%{opacity:0.7; box-shadow:0 0 0 6px rgba(0,135,81,0);}
  }
  .brand small{font-family:'Manrope', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; font-weight:600; font-size:0.65rem; text-transform:uppercase; letter-spacing:0.12em; color:var(--turquoise); background:rgba(0,135,81,0.12); padding:2px 7px; border-radius:20px;}
  nav.links{display:flex; gap:1.6rem; font-size:0.82rem; font-weight:600;}
  nav.links a{text-decoration:none; opacity:0.75; transition:opacity 0.2s;}
  nav.links a:hover, nav.links a:focus-visible{opacity:1; color:var(--turquoise);}
  .lang-toggle{
    font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.72rem; border:1px solid rgba(11,61,46,0.25);
    border-radius:20px; padding:5px 12px; background:transparent; cursor:pointer; color:var(--ink);
  }
  .nav-toggle{
    display:none; flex-direction:column; justify-content:center; gap:4px;
    background:none; border:none; cursor:pointer; padding:8px; margin:-8px 0 -8px -8px;
  }
  .nav-toggle span{width:20px; height:2px; background:var(--ink); display:block; border-radius:2px; transition:transform 0.2s, opacity 0.2s;}
  .nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg);}
  .nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0;}
  .nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg);}
  @media (max-width:560px){
    .brand{font-size:0.92rem; gap:0.35rem;}
    .brand small{font-size:0.55rem; padding:2px 5px;}
    .me-chip span:not(.avatar){max-width:80px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
    .nav-inner{padding:0.7rem 0.9rem; gap:0.4rem;}
  }
  @media (max-width:820px){
    .nav-toggle{display:flex;}
    nav.links{
      display:none; position:absolute; top:100%; left:0; right:0;
      flex-direction:column; gap:0; background:var(--sand);
      padding:0.3rem 1.5rem 1rem; border-bottom:1px solid rgba(11,61,46,0.1);
      box-shadow:0 12px 20px -12px rgba(11,61,46,0.25);
    }
    nav.links.open{display:flex;}
    nav.links a{padding:0.85rem 0.1rem; border-bottom:1px solid rgba(11,61,46,0.07); font-size:0.95rem;}
  }

  /* ---------- HERO ---------- */
  .hero{
    position:relative; overflow:hidden;
    max-width:1180px; margin:0 auto;
    padding:3.4rem 1.5rem 2.2rem;
    display:grid; grid-template-columns:1.1fr 0.9fr; gap:2.5rem; align-items:center;
  }
  @media (max-width:900px){ .hero{grid-template-columns:1fr; padding-top:2.2rem;} }

  .hero-spine{
    position:absolute; right:-2%; top:1rem; width:38%; opacity:0.5; z-index:0; pointer-events:none;
  }
  @media (max-width:900px){ .hero-spine{opacity:0.25; width:52%; right:-6%; top:0.5rem;} }

  .eyebrow{
    font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.75rem; text-transform:uppercase; letter-spacing:0.14em;
    color:var(--turquoise); margin-bottom:0.9rem; display:flex; align-items:center; gap:0.5rem;
  }
  .hero h1{
    font-size:clamp(2.3rem, 5vw, 3.6rem); line-height:1.02; letter-spacing:-0.02em; font-weight:700;
    max-width:11ch;
  }
  .hero p.lede{
    margin-top:1.1rem; font-size:1.05rem; line-height:1.55; max-width:42ch; color:rgba(11,61,46,0.75);
  }
  .hero-cta{margin-top:1.6rem; display:flex; gap:0.8rem; flex-wrap:wrap;}
  .btn{
    font-weight:700; font-size:0.85rem; padding:0.75rem 1.3rem; border-radius:10px; text-decoration:none;
    display:inline-flex; align-items:center; gap:0.5rem; border:1px solid transparent; cursor:pointer;
  }
  .btn-primary{background:var(--ocean-deep); color:var(--sand);}
  .btn-primary:hover{background:#0d3a46;}
  .btn-ghost{border-color:rgba(11,61,46,0.25); background:transparent; color:var(--ink);}
  .btn-ghost:hover{border-color:var(--ocean-deep);}

  /* weather card */
  .weather-card{
    position:relative; z-index:1;
    background:var(--ocean-deep); color:var(--sand);
    border-radius:20px; padding:1.8rem;
    box-shadow:0 20px 40px -18px rgba(11,61,46,0.5);
  }
  .weather-top{display:flex; justify-content:space-between; align-items:flex-start;}
  .weather-loc{font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.72rem; text-transform:uppercase; letter-spacing:0.1em; color:var(--turquoise-bright);}
  .weather-temp{font-family:'Space Grotesk', 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size:4rem; font-weight:700; line-height:1; margin-top:0.6rem;}
  .weather-temp sup{font-size:1.6rem; font-weight:500; opacity:0.8;}
  .weather-cond{font-size:1rem; margin-top:0.2rem; opacity:0.85;}
  .weather-datetime{font-size:0.7rem; opacity:0.6; margin-top:0.35rem; letter-spacing:0.02em;}
  .wx-locate{
    background:rgba(255,255,255,0.12); border:1px solid rgba(255,255,255,0.2); border-radius:50%;
    width:36px; height:36px; cursor:pointer; font-size:1rem; flex-shrink:0;
  }
  .wx-locate:hover{background:rgba(255,255,255,0.22);}
  .wx-source{font-size:0.62rem; opacity:0.45; margin-top:0.9rem;}
  .weather-grid{
    display:grid; grid-template-columns:repeat(3,1fr); gap:0.7rem; margin-top:1.4rem;
    border-top:1px solid rgba(255,255,255,0.12); padding-top:1.2rem;
  }
  .weather-grid div{font-size:0.72rem; opacity:0.65; text-transform:uppercase; letter-spacing:0.06em; font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace;}
  .weather-grid strong{display:block; font-family:'Space Grotesk', 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size:1.05rem; opacity:1; margin-top:0.25rem; color:var(--sand); text-transform:none; letter-spacing:0;}
  .sargassum-pill{
    margin-top:1.3rem; display:flex; align-items:center; gap:0.6rem;
    background:rgba(110,127,82,0.22); border:1px solid rgba(110,127,82,0.5);
    padding:0.6rem 0.9rem; border-radius:10px; font-size:0.8rem;
  }
  .sargassum-pill .swatch{width:10px; height:10px; border-radius:3px; background:var(--sargassum); flex-shrink:0;}

  /* ---------- SECTION SHELL ---------- */
  section.module{
    max-width:1180px; margin:0 auto; padding:3.4rem 1.5rem;
    border-top:1px solid rgba(11,61,46,0.09);
  }
  .module-head{
    display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:1.8rem; gap:1rem; flex-wrap:wrap;
  }
  .module-head .tag{
    font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.72rem; text-transform:uppercase; letter-spacing:0.12em; color:var(--turquoise);
    display:block; margin-bottom:0.4rem;
  }
  .module-head h2{font-size:1.8rem; letter-spacing:-0.01em;}
  .module-head .note{font-size:0.82rem; color:rgba(11,61,46,0.55); max-width:32ch; text-align:right;}
  @media (max-width:700px){ .module-head .note{text-align:left;} }

  /* ---------- TRANSIT ---------- */
  .transit-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1.1rem;}
  @media (max-width:820px){ .transit-grid{grid-template-columns:1fr;} }
  .route-card{
    background:var(--paper); border:1px solid rgba(11,61,46,0.1); border-radius:16px; padding:1.4rem;
  }
  .route-card .route-top{display:flex; justify-content:space-between; align-items:center; margin-bottom:0.9rem;}
  .route-badge{
    font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.7rem; font-weight:600; padding:3px 9px; border-radius:20px;
  }
  .badge-flow{background:rgba(0,135,81,0.14); color:#0d8078;}
  .badge-slow{background:rgba(212,98,42,0.14); color:#c94a30;}
  .transit-ref .route-card{opacity:0.9;}
  .traffic-card{border-left:3px solid var(--amber);}
  .traffic-card .traffic-when{font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.66rem; color:rgba(11,61,46,0.5); margin-top:0.5rem;}
  .route-card h3{font-size:1.05rem; margin-bottom:0.3rem;}
  .route-card p{font-size:0.85rem; color:rgba(11,61,46,0.65); line-height:1.5;}
  .route-meta{display:flex; gap:1.2rem; margin-top:1rem; font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.75rem; color:rgba(11,61,46,0.55);}
  .route-meta strong{display:block; color:var(--ink); font-size:0.95rem; font-family:'Space Grotesk', 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif;}

  /* ---------- ALERTS ---------- */
  .alert-list{display:flex; flex-direction:column; gap:0.8rem;}
  .alert-row{
    display:grid; grid-template-columns:auto 1fr auto; gap:1rem; align-items:center;
    background:var(--paper); border-left:3px solid var(--coral); border-radius:0 12px 12px 0; padding:1rem 1.2rem;
  }
  .alert-row.info{border-left-color:var(--turquoise);}
  .alert-icon{font-size:1.3rem;}
  .alert-row h4{font-size:0.95rem; margin-bottom:0.2rem;}
  .alert-row p{font-size:0.82rem; color:rgba(11,61,46,0.6);}
  .alert-time{font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.72rem; color:rgba(11,61,46,0.45); white-space:nowrap;}

  /* ---------- CURRENCY ---------- */
  .fx-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:1rem;}
  @media (max-width:820px){ .fx-grid{grid-template-columns:repeat(2,1fr);} }
  .fx-card{background:var(--ocean-deep); color:var(--sand); border-radius:14px; padding:1.2rem;}
  .fx-card .pair{font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.75rem; color:var(--turquoise-bright); margin-bottom:0.4rem;}
  .fx-card .rate{font-family:'Space Grotesk', 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size:1.6rem; font-weight:700;}
  .fx-card .delta{font-size:0.75rem; margin-top:0.3rem; font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace;}
  .fx-meta{font-size:0.68rem; color:rgba(11,61,46,0.5); margin-top:0.9rem;}
  .delta.up{color:#7CE0B8;} .delta.down{color:#FF9C85;}

  /* ---------- EVENTS ---------- */
  .events-row{display:grid; grid-template-columns:repeat(3,1fr); gap:1.1rem;}
  @media (max-width:820px){ .events-row{grid-template-columns:1fr;} }
  .event-card{
    border-radius:16px; overflow:hidden; background:var(--paper); border:1px solid rgba(11,61,46,0.1);
    cursor:pointer; transition:transform 0.15s, box-shadow 0.15s; text-align:left; width:100%;
  }
  .event-card:hover, .event-card:focus-visible{transform:translateY(-2px); box-shadow:0 14px 24px -16px rgba(11,61,46,0.35); outline:none; border-color:var(--turquoise);}
  .event-card .ecolor{height:6px; background:var(--turquoise);}
  .event-card .ebody{padding:1.2rem;}
  .event-card .etime{font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.72rem; color:var(--turquoise); text-transform:uppercase; letter-spacing:0.06em;}
  .event-card h3{font-size:1rem; margin:0.4rem 0 0.3rem;}
  .event-card p{font-size:0.82rem; color:rgba(11,61,46,0.6);}
  .event-tap-hint{font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.68rem; color:var(--turquoise); margin-top:0.7rem; opacity:0.8;}

  /* ---------- EVENT DETAIL MODAL ---------- */
  .modal-overlay{
    position:fixed; inset:0; background:rgba(11,61,46,0.55); backdrop-filter:blur(2px);
    display:flex; align-items:center; justify-content:center; z-index:100; padding:1.2rem;
    animation:fadeIn 0.15s ease;
  }
  .modal-overlay[hidden]{display:none;}
  @keyframes fadeIn{ from{opacity:0;} to{opacity:1;} }
  .modal-card{
    background:var(--paper); border-radius:18px; max-width:440px; width:100%; position:relative;
    overflow:hidden; box-shadow:0 30px 60px -20px rgba(11,61,46,0.5); animation:modalIn 0.18s ease;
    max-height:88vh; overflow-y:auto;
  }
  @keyframes modalIn{ from{opacity:0; transform:translateY(10px) scale(0.98);} to{opacity:1; transform:translateY(0) scale(1);} }
  .modal-topbar{height:8px; background:var(--turquoise);}
  .modal-close{
    position:absolute; top:0.9rem; right:0.9rem; width:32px; height:32px; border-radius:50%;
    border:none; background:rgba(11,61,46,0.08); color:var(--ink); font-size:1.3rem; line-height:1;
    cursor:pointer; display:flex; align-items:center; justify-content:center;
  }
  .modal-close:hover{background:rgba(11,61,46,0.16);}
  .modal-body{padding:1.6rem;}
  .modal-time{font-size:0.75rem; color:var(--turquoise); text-transform:uppercase; letter-spacing:0.06em; margin-bottom:0.5rem;}
  .modal-body h3{font-size:1.3rem; line-height:1.25; margin-bottom:0.6rem; padding-right:1.6rem;}
  .modal-location{display:flex; align-items:center; gap:0.4rem; font-size:0.85rem; color:rgba(11,61,46,0.65); margin-bottom:0.9rem;}
  .modal-detail{font-size:0.9rem; line-height:1.6; color:rgba(11,61,46,0.8); margin-bottom:1.4rem;}

  /* ---------- EVENT SUBMISSION ---------- */
  .submit-event-cta{
    display:flex; align-items:center; gap:1rem; flex-wrap:wrap;
    margin-top:1.4rem; padding-top:1.4rem; border-top:1px dashed rgba(11,61,46,0.18);
  }
  .submit-event-note{font-size:0.82rem; color:rgba(11,61,46,0.55);}
  .submit-intro{font-size:0.86rem; color:rgba(11,61,46,0.65); line-height:1.5; margin-bottom:1.2rem;}
  #eventForm{display:flex; flex-direction:column; gap:0.7rem;}
  #eventForm label{font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.7rem; text-transform:uppercase; letter-spacing:0.06em; color:rgba(11,61,46,0.55); margin-bottom:-0.35rem;}
  #eventForm input[type="text"], #eventForm input[type="url"], #eventForm input[type="datetime-local"], #eventForm textarea{
    font-family:'Manrope', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; font-size:0.88rem; padding:0.6rem 0.8rem; border-radius:10px;
    border:1px solid rgba(11,61,46,0.2); background:var(--sand); color:var(--ink); width:100%;
  }
  #eventForm textarea{min-height:80px; resize:vertical;}
  #eventForm input:focus-visible, #eventForm textarea:focus-visible{outline:2px solid var(--turquoise); outline-offset:1px;}
  .poster-drop{
    border:1px dashed rgba(11,61,46,0.3); border-radius:10px; padding:0.9rem; text-align:center;
    font-size:0.82rem; color:rgba(11,61,46,0.6); cursor:pointer;
  }
  .poster-drop:hover{border-color:var(--turquoise); color:var(--turquoise);}
  .poster-preview{position:relative; margin-top:0.5rem;}
  .poster-preview img{width:100%; border-radius:10px; display:block;}
  .modal-poster{width:100%; border-radius:12px; margin-bottom:1rem; display:block;}
  .modal-organizer{font-size:0.72rem; color:rgba(11,61,46,0.5); margin-bottom:1rem;}
  .event-status{font-size:0.8rem; margin-top:0.8rem; min-height:1em;}
  .event-status.ok{color:#0d8078;}
  .event-status.err{color:#c94a30;}
  .pending-badge{
    font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.62rem; font-weight:700; letter-spacing:0.05em;
    background:var(--amber); color:#3d2a05; padding:2px 7px; border-radius:20px; text-transform:uppercase;
  }
  .mod-card .mod-poster{width:100%; max-width:220px; border-radius:8px; margin:0.6rem 0; display:block;}

  /* ---------- ORGANIZER DASHBOARD ---------- */
  body.view-community #organizer{display:block;}
  .org-summary{display:grid; grid-template-columns:repeat(4,1fr); gap:0.9rem; margin-bottom:1.6rem;}
  @media (max-width:760px){ .org-summary{grid-template-columns:repeat(2,1fr);} }
  .org-stat{background:var(--ocean-deep); color:var(--paper); border-radius:14px; padding:1.1rem;}
  .org-stat .n{font-family:'Space Grotesk', 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size:1.9rem; font-weight:700; line-height:1;}
  .org-stat .l{font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.66rem; text-transform:uppercase; letter-spacing:0.07em; opacity:0.7; margin-top:0.4rem;}
  .org-event-stats{display:flex; gap:1.4rem; margin:0.7rem 0; flex-wrap:wrap;}
  .org-event-stats div{font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.68rem; text-transform:uppercase; letter-spacing:0.05em; color:rgba(11,61,46,0.5);}
  .org-event-stats strong{display:block; font-family:'Space Grotesk', 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size:1.15rem; color:var(--ink); text-transform:none; letter-spacing:0; margin-top:0.15rem;}
  .status-live{background:rgba(0,135,81,0.15); color:#046b41;}
  .org-hint{font-size:0.78rem; color:rgba(11,61,46,0.5); line-height:1.5; margin-top:1.2rem;}

  /* ---------- NOTIFICATIONS ---------- */
  .bell-btn{
    position:relative; background:none; border:none; cursor:pointer; padding:4px 6px;
    font-size:1.05rem; line-height:1; display:flex; align-items:center;
  }
  .bell-btn:hover{opacity:0.75;}
  .bell-badge{
    position:absolute; top:-2px; right:-2px; min-width:16px; height:16px; padding:0 4px;
    background:var(--coral); color:#fff; border-radius:20px;
    font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.6rem; font-weight:700;
    display:flex; align-items:center; justify-content:center;
  }
  .notif-item{
    background:var(--paper); border:1px solid rgba(11,61,46,0.1); border-radius:12px;
    padding:0.9rem 1rem; cursor:pointer;
  }
  .notif-item:hover{border-color:var(--turquoise);}
  .notif-item h4{font-size:0.92rem; margin-bottom:0.2rem;}
  .notif-item .notif-meta{font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.68rem; color:rgba(11,61,46,0.5);}
  .notif-empty{font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.8rem; color:rgba(11,61,46,0.45); text-align:center; padding:1.4rem 0;}

  /* ---------- LIVE STREAMING ---------- */
  .live-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1.1rem;}
  @media (max-width:820px){ .live-grid{grid-template-columns:1fr;} }
  .live-card{
    background:var(--paper); border:1px solid rgba(11,61,46,0.1); border-radius:16px;
    padding:1.2rem; cursor:pointer; text-align:left; width:100%; transition:transform 0.15s, box-shadow 0.15s;
  }
  .live-card:hover{transform:translateY(-2px); box-shadow:0 14px 24px -16px rgba(11,61,46,0.35); border-color:var(--coral);}
  .live-dot{
    display:inline-flex; align-items:center; gap:0.4rem;
    font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.66rem; font-weight:700; letter-spacing:0.08em;
    color:#fff; background:#a8431a; padding:3px 9px; border-radius:20px; text-transform:uppercase;
  }
  .live-dot::before{content:"●"; font-size:0.6rem; animation:pulse 1.8s ease-in-out infinite;}
  .live-card h3{font-size:1rem; margin:0.6rem 0 0.25rem;}
  .live-card p{font-size:0.8rem; color:rgba(11,61,46,0.6);}
  .live-empty{
    font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.82rem; color:rgba(11,61,46,0.45);
    text-align:center; padding:2rem 1rem; border:1px dashed rgba(11,61,46,0.18); border-radius:14px;
  }
  .modal-wide{max-width:760px;}
  .video-wrap{position:relative; padding-top:56.25%; border-radius:12px; overflow:hidden; background:#000;}
  .video-wrap iframe{position:absolute; inset:0; width:100%; height:100%; border:none;}
  .fs-btn{
    position:absolute; bottom:0.7rem; right:0.7rem; z-index:5;
    width:36px; height:36px; border-radius:8px; border:none; cursor:pointer;
    background:rgba(0,0,0,0.55); color:#fff; font-size:1rem;
  }
  .fs-btn:hover{background:rgba(0,0,0,0.75);}
  .fs-chat-toggle{
    position:absolute; bottom:0.7rem; right:3.4rem; z-index:6;
    width:36px; height:36px; border-radius:8px; border:none; cursor:pointer;
    background:rgba(0,0,0,0.55); color:#fff; font-size:1rem;
  }
  .fs-chat-toggle.active{background:var(--turquoise);}
  .fs-chat{
    position:absolute; right:0; bottom:0; top:0; width:min(320px, 42%);
    background:rgba(0,0,0,0.55); backdrop-filter:blur(6px);
    display:flex; flex-direction:column; z-index:5;
  }
  @media (max-width:640px){ .fs-chat{width:70%;} }
  .fs-chat-messages{flex:1; overflow-y:auto; padding:0.7rem; color:#fff; font-size:0.8rem;}
  .fs-chat-messages .chat-msg{color:#fff; text-shadow:0 1px 2px rgba(0,0,0,0.6);}
  .fs-chat-messages .chat-msg .who{color:var(--turquoise-bright);}
  .fs-chat-form{display:flex; gap:0.35rem; padding:0.5rem;}
  .fs-chat-form input{
    flex:1; border:none; border-radius:20px; padding:0.45rem 0.8rem; font-size:0.82rem;
    background:rgba(255,255,255,0.9); font-family:'Manrope', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  }
  .fs-chat-form button{
    border:none; border-radius:50%; width:32px; height:32px; cursor:pointer;
    background:var(--turquoise); color:#fff; font-size:0.9rem; flex-shrink:0;
  }
  .zoom-controls{
    position:absolute; bottom:0.7rem; left:0.7rem; display:flex; align-items:center; gap:0.4rem;
    background:rgba(0,0,0,0.55); border-radius:20px; padding:0.25rem 0.5rem;
  }
  .zoom-btn{
    width:26px; height:26px; border-radius:50%; border:none; cursor:pointer;
    background:rgba(255,255,255,0.2); color:#fff; font-size:1rem; line-height:1;
    display:flex; align-items:center; justify-content:center;
  }
  .zoom-btn:hover{background:rgba(255,255,255,0.35);}
  .zoom-level{font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.7rem; color:#fff; min-width:32px; text-align:center;}
  #camPreview{transform-origin:center center; transition:transform 0.12s;}
  .chat-wrap{margin-top:1rem; border:1px solid rgba(11,61,46,0.12); border-radius:12px; overflow:hidden;}
  .chat-head{
    display:flex; justify-content:space-between; align-items:center;
    background:var(--sand); padding:0.6rem 0.9rem;
    font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.7rem; text-transform:uppercase; letter-spacing:0.07em;
    color:rgba(11,61,46,0.6); border-bottom:1px solid rgba(11,61,46,0.1);
  }
  .chat-messages{max-height:230px; overflow-y:auto; padding:0.7rem 0.9rem; background:var(--paper);}
  .chat-msg{font-size:0.85rem; line-height:1.45; margin-bottom:0.5rem; display:flex; gap:0.4rem; align-items:baseline;}
  .chat-msg .who{font-family:'Space Grotesk', 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif; font-weight:600; flex-shrink:0; cursor:pointer;}
  .chat-msg .who:hover{text-decoration:underline;}
  .chat-msg .mod-tag{font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.58rem; background:var(--turquoise); color:#fff; padding:1px 5px; border-radius:20px; text-transform:uppercase;}
  .chat-msg .host-tag{background:var(--coral);}
  .chat-msg .txt{flex:1; word-break:break-word;}
  .chat-msg .del{background:none; border:none; cursor:pointer; color:rgba(11,61,46,0.35); font-size:0.85rem; padding:0 0.2rem;}
  .chat-msg .del:hover{color:var(--coral);}
  .chat-empty{font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.76rem; color:rgba(11,61,46,0.4); text-align:center; padding:1.2rem 0;}
  .chat-form{display:flex; gap:0.4rem; padding:0.6rem; border-top:1px solid rgba(11,61,46,0.1); background:var(--sand);}
  .chat-form input{flex:1; font-size:0.85rem; padding:0.5rem 0.7rem;}
  .chat-form button{
    font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.74rem; font-weight:600;
    background:var(--ocean-deep); color:var(--paper); border:none; border-radius:8px;
    padding:0 0.9rem; cursor:pointer;
  }
  .chat-form button:disabled{opacity:0.5; cursor:not-allowed;}
  .chat-note{font-size:0.72rem; color:rgba(11,61,46,0.5); padding:0.5rem 0.9rem; background:var(--sand);}
  .chat-actions{
    position:absolute; background:var(--paper); border:1px solid rgba(11,61,46,0.15);
    border-radius:10px; box-shadow:0 10px 24px -12px rgba(11,61,46,0.4); padding:0.35rem; z-index:120;
  }
  .chat-actions button{
    display:block; width:100%; text-align:left; background:none; border:none; cursor:pointer;
    font-size:0.78rem; padding:0.45rem 0.7rem; border-radius:6px; color:var(--ink); white-space:nowrap;
  }
  .chat-actions button:hover{background:rgba(11,61,46,0.07);}
  .chat-actions button.danger{color:#c94a30;}
  .live-tabs{display:flex; gap:0.4rem; margin-bottom:1.1rem;}
  .live-tab{
    flex:1; font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.75rem; font-weight:600; padding:0.55rem;
    border-radius:8px; border:1px solid rgba(11,61,46,0.15); background:transparent; cursor:pointer;
    color:var(--ink); opacity:0.55;
  }
  .live-tab.active{opacity:1; background:var(--ocean-deep); color:var(--paper); border-color:var(--ocean-deep);}
  .key-row{margin-bottom:0.9rem;}
  .key-row label{
    font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.66rem; text-transform:uppercase; letter-spacing:0.06em;
    color:rgba(11,61,46,0.55); display:block; margin-bottom:0.25rem;
  }
  .key-value{
    display:flex; gap:0.4rem; align-items:center;
    background:var(--sand); border:1px solid rgba(11,61,46,0.15); border-radius:8px; padding:0.5rem 0.7rem;
  }
  .key-value code{
    font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.72rem; word-break:break-all; flex:1; color:var(--ink);
  }
  .copy-btn{
    font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.66rem; font-weight:600; border:none; background:var(--ocean-deep);
    color:var(--paper); border-radius:6px; padding:0.3rem 0.6rem; cursor:pointer; flex-shrink:0;
  }
  .cam-wrap{position:relative; margin-bottom:0.9rem;}
  #camPreview{width:100%; border-radius:12px; background:#000; display:block; aspect-ratio:16/9; object-fit:cover;}
  .flip-btn{
    position:absolute; bottom:0.7rem; right:0.7rem;
    width:40px; height:40px; border-radius:50%; border:none; cursor:pointer;
    background:rgba(0,0,0,0.55); color:#fff; font-size:1.15rem; line-height:1;
    display:flex; align-items:center; justify-content:center;
  }
  .flip-btn:hover{background:rgba(0,0,0,0.75);}
  .card-follow{position:absolute; bottom:0.8rem; right:0.8rem;}
  .event-card-wrap{position:relative;}
  .people-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:0.9rem;}
  @media (max-width:820px){ .people-grid{grid-template-columns:1fr;} }
  .person-card{
    display:flex; align-items:center; gap:0.8rem;
    background:var(--paper); border:1px solid rgba(11,61,46,0.1); border-radius:14px; padding:0.9rem 1rem;
  }
  .person-card .avatar{width:38px; height:38px; font-size:1rem; flex-shrink:0;}
  .avatar-wrap{position:relative; display:inline-flex; flex-shrink:0;}
  body.view-events .home-view{display:none;}
  body.view-events #comunidad, body.view-events #people, body.view-events #myprofile,
  body.view-events #organizer, body.view-events #moderacion{display:none !important;}
  body.view-events #allevents{display:block;}
  body.view-profile .home-view{display:none;}
  body.view-profile #comunidad,
  body.view-profile #organizer, body.view-profile #moderacion{display:none !important;}
  body.view-profile #myprofile{display:block;}
  .my-profile-head{
    display:flex; align-items:center; gap:1rem; flex-wrap:wrap;
    background:var(--paper); border:1px solid rgba(11,61,46,0.1);
    border-radius:16px; padding:1.3rem; margin-bottom:1.6rem;
  }
  .my-profile-head .avatar{width:58px; height:58px; font-size:1.4rem;}
  .my-profile-head h2{font-size:1.35rem; margin-bottom:0.2rem;}
  .my-profile-meta{font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.72rem; color:rgba(11,61,46,0.55);}
  .my-profile-actions{display:flex; gap:0.5rem; margin-left:auto; flex-wrap:wrap;}
  .activity-item{
    background:var(--paper); border:1px solid rgba(11,61,46,0.1); border-radius:12px;
    padding:0.9rem 1.1rem; cursor:pointer;
  }
  .activity-item:hover{border-color:var(--turquoise);}
  .activity-kind{
    font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.62rem; text-transform:uppercase; letter-spacing:0.06em;
    padding:2px 7px; border-radius:20px; margin-right:0.4rem;
  }
  .k-post{background:rgba(11,61,46,0.08); color:rgba(11,61,46,0.6);}
  .k-event{background:rgba(0,135,81,0.14); color:#046b41;}
  .k-live{background:var(--coral); color:#fff;}
  .activity-item p{font-size:0.87rem; margin-top:0.4rem; color:rgba(11,61,46,0.8);}
  .offline-dot{
    position:absolute; bottom:0; right:0; width:11px; height:11px; border-radius:50%;
    background:#cbd5cd; border:2px solid var(--paper);
  }
  .online-count{cursor:pointer;}
  .online-count:hover{color:var(--turquoise);}
  .online-dot{
    position:absolute; bottom:0; right:0; width:11px; height:11px; border-radius:50%;
    background:#22c55e; border:2px solid var(--paper);
  }
  .online-text{color:#15803d; font-weight:600;}
  .people-controls{display:flex; gap:0.6rem; align-items:center; margin-bottom:1.2rem; flex-wrap:wrap;}
  .people-controls .text-input{max-width:320px;}
  .visibility-row{margin-top:0.9rem; padding-top:0.9rem; border-top:1px solid rgba(11,61,46,0.08);}
  .vis-toggle{display:flex; align-items:center; gap:0.5rem; font-size:0.8rem; color:rgba(11,61,46,0.7); cursor:pointer;}
  .vis-toggle input{width:16px; height:16px; accent-color:var(--turquoise);}
  .online-count{
    font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.74rem; color:rgba(11,61,46,0.6);
    margin-bottom:0.8rem; display:flex; align-items:center;
  }
  .person-info{flex:1; min-width:0; cursor:pointer;}
  .person-info strong{display:block; font-family:'Space Grotesk', 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size:0.92rem;}
  .person-info span{font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.66rem; color:rgba(11,61,46,0.72);}
  .people-empty{font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.82rem; color:rgba(11,61,46,0.45); padding:1.4rem 0;}
  .profile-share{
    font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.7rem; font-weight:600; background:none;
    border:1px solid rgba(11,61,46,0.2); border-radius:20px; padding:0.4rem 0.9rem;
    cursor:pointer; color:var(--ink); width:100%; margin-bottom:1rem;
  }
  .profile-share:hover{border-color:var(--turquoise); color:var(--turquoise);}
  .profile-report{
    font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.68rem; background:none; border:none;
    color:rgba(11,61,46,0.7); cursor:pointer; width:100%; padding:0.4rem; text-decoration:underline;
  }
  .profile-report:hover{color:var(--coral);}
  .dob-label{
    font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.66rem; text-transform:uppercase; letter-spacing:0.06em;
    color:rgba(11,61,46,0.55); margin-bottom:-0.35rem;
  }
  .dob-note{font-size:0.72rem; color:rgba(11,61,46,0.5); line-height:1.45; margin-top:-0.2rem;}
  .post-share{
    font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.76rem; background:none;
    border:1px solid rgba(11,61,46,0.15); border-radius:20px; padding:0.4rem 0.9rem;
    cursor:pointer; color:var(--ink);
  }
  .post-share:hover{border-color:var(--turquoise); color:var(--turquoise);}
  .live-status{font-size:0.82rem; margin-top:0.8rem; line-height:1.5;}
  .live-status.ok{color:#046b41;}
  .live-status.err{color:#c94a30;}
  .live-hint{font-size:0.78rem; color:rgba(11,61,46,0.55); line-height:1.55; margin-bottom:1rem;}
  .live-card-wrap{position:relative;}
  .share-btn{
    position:absolute; top:0.7rem; right:0.7rem;
    font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.62rem; font-weight:600;
    background:rgba(11,61,46,0.08); border:none; border-radius:20px;
    padding:0.3rem 0.7rem; cursor:pointer; color:var(--ink);
  }
  .share-btn:hover{background:var(--turquoise); color:var(--paper);}
  .upcoming-head{
    font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.72rem; text-transform:uppercase; letter-spacing:0.1em;
    color:rgba(11,61,46,0.5); margin:1.6rem 0 0.8rem;
  }
  .upcoming-item{
    display:flex; justify-content:space-between; align-items:center; gap:1rem;
    background:var(--paper); border:1px solid rgba(11,61,46,0.1); border-left:3px solid var(--amber);
    border-radius:0 12px 12px 0; padding:0.85rem 1rem; margin-bottom:0.6rem; font-size:0.88rem;
  }
  .upcoming-item strong{font-family:'Space Grotesk', 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size:0.92rem;}

  /* ---------- AIRPORT ---------- */
  .flight-table{width:100%; border-collapse:collapse; font-size:0.85rem;}
  .flight-table th{
    text-align:left; font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.7rem; text-transform:uppercase; letter-spacing:0.08em;
    color:rgba(11,61,46,0.5); padding:0.6rem 0.8rem; border-bottom:1px solid rgba(11,61,46,0.12);
  }
  .flight-table td{padding:0.9rem 0.8rem; border-bottom:1px solid rgba(11,61,46,0.07);}
  .flight-status{font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.72rem; font-weight:600; padding:3px 9px; border-radius:20px;}
  .st-ontime{background:rgba(0,135,81,0.14); color:#0d8078;}
  .st-delayed{background:rgba(212,98,42,0.14); color:#c94a30;}
  .st-landed{background:rgba(11,61,46,0.1); color:rgba(11,61,46,0.6);}
  .table-wrap{overflow-x:auto; background:var(--paper); border-radius:16px; border:1px solid rgba(11,61,46,0.1); padding:0.4rem;}

  /* ---------- PLACES ---------- */
  .places-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:1rem;}
  @media (max-width:900px){ .places-grid{grid-template-columns:repeat(2,1fr);} }
  .place-card{background:var(--paper); border:1px solid rgba(11,61,46,0.1); border-radius:14px; padding:1.1rem;}
  .place-card .ptag{font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.68rem; text-transform:uppercase; color:var(--turquoise); letter-spacing:0.08em;}
  .place-card h4, .place-card .place-name{font-size:0.95rem; font-weight:600; margin:0.35rem 0 0.25rem; font-family:'Space Grotesk', 'Manrope', system-ui, sans-serif;}
  .place-card p{font-size:0.78rem; color:rgba(11,61,46,0.55);}
  .place-card{cursor:pointer; transition:transform 0.15s, box-shadow 0.15s; position:relative; overflow:hidden;}
  .place-card:hover{transform:translateY(-2px); box-shadow:0 14px 24px -16px rgba(11,61,46,0.35); border-color:var(--turquoise);}
  .place-card .pphoto{width:calc(100% + 2.2rem); margin:-1.1rem -1.1rem 0.7rem; height:110px; object-fit:cover; display:block;}
  .place-meta{display:flex; flex-wrap:wrap; gap:1rem; margin-bottom:1.1rem;}
  .place-meta div{font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.66rem; text-transform:uppercase; letter-spacing:0.05em; color:rgba(11,61,46,0.5);}
  .place-meta strong{display:block; font-family:'Manrope', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; font-size:0.88rem; color:var(--ink); text-transform:none; letter-spacing:0; margin-top:0.15rem;}
  .place-actions{display:grid; grid-template-columns:1fr 1fr; gap:0.5rem;}
  .place-actions .btn{justify-content:center; font-size:0.8rem; padding:0.65rem 0.8rem;}
  .place-actions .btn.full{grid-column:1 / -1;}
  #placeForm{display:flex; flex-direction:column; gap:0.7rem;}
  #placeForm label{font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.7rem; text-transform:uppercase; letter-spacing:0.06em; color:rgba(11,61,46,0.55); margin-bottom:-0.35rem;}
  #placeForm input, #placeForm textarea, #placeForm select{
    font-family:'Manrope', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; font-size:0.88rem; padding:0.6rem 0.8rem; border-radius:10px;
    border:1px solid rgba(11,61,46,0.2); background:var(--sand); color:var(--ink); width:100%;
  }
  #placeForm textarea{min-height:70px; resize:vertical;}

  /* ---------- AUTH WIDGET (nav) ---------- */
  #authWidget{display:flex; align-items:center; gap:0.6rem;}
  .auth-pill{
    font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.75rem; font-weight:600; border:none; cursor:pointer;
    background:var(--ocean-deep); color:var(--sand); padding:0.5rem 1rem; border-radius:20px;
  }
  .auth-pill:hover{background:#0d3a46;}
  .me-chip{display:flex; align-items:center; gap:0.5rem; font-size:0.82rem;}
  .avatar{
    width:26px; height:26px; border-radius:50%; background:var(--turquoise); color:var(--ocean-deep);
    display:flex; align-items:center; justify-content:center; font-family:'Space Grotesk', 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif; font-weight:700; font-size:0.8rem;
    flex-shrink:0;
  }
  .signout-link{font-size:0.72rem; text-decoration:underline; opacity:0.6; background:none; border:none; cursor:pointer; font-family:'Manrope', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; color:var(--ink);}
  .signout-link:hover{opacity:1;}

  /* ---------- COMMUNITY / COMPOSER ---------- */
  .composer{
    background:var(--paper); border:1px solid rgba(11,61,46,0.1); border-radius:16px; padding:1.3rem;
    margin-bottom:1.6rem;
  }
  .composer-join{display:flex; gap:0.7rem; flex-wrap:wrap; align-items:center;}
  .composer-join p{font-size:0.88rem; color:rgba(11,61,46,0.65); flex:1 1 220px;}
  .join-form{display:flex; gap:0.6rem; flex:1 1 260px;}
  .text-input{
    flex:1; font-family:'Manrope', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; font-size:0.88rem; padding:0.65rem 0.9rem; border-radius:10px;
    border:1px solid rgba(11,61,46,0.2); background:var(--sand); color:var(--ink);
  }
  .text-input:focus-visible, .composer textarea:focus-visible, .comment-form input:focus-visible{outline:2px solid var(--turquoise); outline-offset:1px;}
  .composer-post-as{display:flex; justify-content:space-between; align-items:center; margin-bottom:0.9rem; font-size:0.82rem; color:rgba(11,61,46,0.6);}
  .composer-post-as strong{color:var(--ink); font-family:'Space Grotesk', 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif;}
  .composer select{
    font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.78rem; padding:0.5rem 0.8rem; border-radius:8px;
    border:1px solid rgba(11,61,46,0.2); background:var(--sand); margin-bottom:0.7rem; color:var(--ink);
  }
  .composer textarea{
    width:100%; min-height:70px; font-family:'Manrope', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; font-size:0.9rem; padding:0.8rem 0.9rem;
    border-radius:10px; border:1px solid rgba(11,61,46,0.2); resize:vertical; margin-bottom:0.8rem; background:var(--sand); color:var(--ink);
  }

  .cat-badge{font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.68rem; font-weight:600; padding:3px 9px; border-radius:20px; text-transform:uppercase; letter-spacing:0.04em; white-space:nowrap;}
  .cat-traffic{background:rgba(217,165,32,0.16); color:#7a4f0f;}
  .cat-weather{background:rgba(110,127,82,0.18); color:#5c6337;}
  .cat-event{background:rgba(0,135,81,0.14); color:#0a5e58;}
  .cat-safety{background:rgba(212,98,42,0.14); color:#9a3a22;}
  .cat-other{background:rgba(11,61,46,0.08); color:rgba(11,61,46,0.8);}

  .feed{display:flex; flex-direction:column; gap:1rem;}
  .feed-filters{display:flex; gap:0.5rem; margin-bottom:1rem; flex-wrap:wrap; align-items:center;}
  .filter-chip{
    font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.72rem; font-weight:600; padding:0.42rem 0.85rem;
    border-radius:20px; border:1px solid rgba(11,61,46,0.18); background:transparent; cursor:pointer;
    color:var(--ink); opacity:0.85;
  }
  .filter-chip:hover{opacity:1;}
  .filter-chip.active{opacity:1; background:var(--ocean-deep); color:var(--sand); border-color:var(--ocean-deep);}
  .feed-refresh{
    margin-left:auto; background:none; border:1px solid rgba(11,61,46,0.18); border-radius:50%;
    width:32px; height:32px; cursor:pointer; font-size:1rem; color:var(--ink); flex-shrink:0;
  }
  .feed-refresh:hover{border-color:var(--turquoise); color:var(--turquoise);}
  .feed-refresh.spinning{animation:spin 0.6s linear;}
  @keyframes spin{ to{transform:rotate(360deg);} }
  .char-count{font-size:0.7rem; color:rgba(11,61,46,0.7); text-align:right; margin-top:-0.45rem;}
  .char-count.near-limit{color:var(--coral);}
  .feed-loading, .feed-empty{font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.82rem; color:rgba(11,61,46,0.5); padding:1.5rem 0; text-align:center;}
  .post-card{background:var(--paper); border:1px solid rgba(11,61,46,0.1); border-radius:16px; padding:1.2rem 1.3rem;}
  .post-top{display:flex; align-items:center; gap:0.7rem; margin-bottom:0.7rem;}
  .post-author{font-family:'Space Grotesk', 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif; font-weight:600; font-size:0.9rem;}
  .post-time{font-size:0.72rem; color:rgba(11,61,46,0.7);}
  .post-top .cat-badge{margin-left:auto;}
  .post-text{font-size:0.92rem; line-height:1.55; color:rgba(11,61,46,0.85); margin-bottom:0.9rem;}
  .post-image{width:100%; max-height:420px; object-fit:cover; border-radius:12px; margin-bottom:0.9rem; display:block;}
  .photo-preview{position:relative; display:inline-block; margin-top:0.8rem; max-width:220px;}
  .photo-preview img{width:100%; border-radius:10px; display:block;}
  .photo-remove{
    position:absolute; top:-8px; right:-8px; width:26px; height:26px; border-radius:50%;
    background:var(--ocean-deep); color:var(--paper); border:2px solid var(--paper); cursor:pointer;
    font-size:1rem; line-height:1; display:flex; align-items:center; justify-content:center;
  }
  .composer-footer{display:flex; justify-content:space-between; align-items:center; gap:0.7rem;}
  .post-actions{display:flex; gap:1rem;}
  .action-btn{
    font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.76rem; background:none; border:1px solid rgba(11,61,46,0.15);
    border-radius:20px; padding:0.4rem 0.9rem; cursor:pointer; color:var(--ink); display:flex; align-items:center; gap:0.4rem;
  }
  .action-btn:hover{border-color:var(--turquoise); color:var(--turquoise);}
  .action-btn.liked{background:rgba(212,98,42,0.12); border-color:var(--coral); color:#c94a30;}
  .comments-block{margin-top:1rem; padding-top:1rem; border-top:1px solid rgba(11,61,46,0.08);}
  .comment-item{font-size:0.85rem; margin-bottom:0.6rem; line-height:1.5;}
  .comment-item strong{font-family:'Space Grotesk', 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif; margin-right:0.3rem;}
  .comment-item .time{margin-left:0.4rem; color:rgba(11,61,46,0.4);}
  .comment-form{display:flex; gap:0.5rem; margin-top:0.8rem;}
  .comment-form input{padding:0.55rem 0.8rem; font-size:0.82rem;}
  .comment-form button{
    font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.75rem; font-weight:600; background:var(--ocean-deep); color:var(--sand);
    border:none; border-radius:8px; padding:0 1rem; cursor:pointer; flex-shrink:0;
  }

  .auth-tabs{display:flex; gap:0.4rem; margin-bottom:1rem;}
  .auth-tab{flex:1; font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.78rem; font-weight:600; padding:0.55rem; border-radius:8px; border:1px solid rgba(11,61,46,0.15); background:transparent; cursor:pointer; color:var(--ink); opacity:0.55;}
  .auth-tab.active{opacity:1; background:var(--ocean-deep); color:var(--sand); border-color:var(--ocean-deep);}
  #authForm{display:flex; flex-direction:column; gap:0.65rem;}
  .password-wrap{position:relative;}
  .password-wrap input{padding-right:3.2rem; width:100%;}
  .pw-toggle{
    position:absolute; right:0.6rem; top:50%; transform:translateY(-50%);
    background:none; border:none; cursor:pointer; font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.68rem;
    color:rgba(11,61,46,0.5); text-transform:uppercase; letter-spacing:0.04em;
  }
  .pw-toggle:hover{color:var(--turquoise);}
  .btn:disabled, .action-btn:disabled{opacity:0.6; cursor:not-allowed;}
  .action-btn.reported{background:rgba(217,165,32,0.14); border-color:var(--amber); color:#a5701f;}

  .mod-list{display:flex; flex-direction:column; gap:0.8rem;}
  .storage-meter{
    height:14px; background:rgba(11,61,46,0.1); border-radius:20px; overflow:hidden; margin-bottom:0.5rem;
  }
  .storage-fill{height:100%; background:var(--turquoise); border-radius:20px; transition:width 0.3s, background 0.3s;}
  .storage-fill.warn{background:var(--amber);}
  .storage-fill.danger{background:var(--coral);}
  .mod-empty{font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.8rem; color:rgba(11,61,46,0.45);}
  .mod-card{background:var(--paper); border:1px solid rgba(11,61,46,0.1); border-radius:14px; padding:1rem 1.2rem;}
  .mod-card-top{display:flex; justify-content:space-between; align-items:flex-start; gap:1rem; margin-bottom:0.5rem;}
  .mod-card h4{font-size:0.9rem;}
  .mod-card .mod-meta{font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.72rem; color:rgba(11,61,46,0.5); margin-top:0.2rem;}
  .mod-card p{font-size:0.85rem; color:rgba(11,61,46,0.75); margin:0.5rem 0;}
  .mod-reasons{font-size:0.78rem; color:rgba(11,61,46,0.55); line-height:1.5; margin-bottom:0.7rem;}
  .mod-actions{display:flex; gap:0.6rem;}
  .mod-btn{
    font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.72rem; font-weight:600; border-radius:8px; padding:0.4rem 0.8rem;
    cursor:pointer; border:1px solid rgba(11,61,46,0.2); background:transparent; color:var(--ink);
  }
  .mod-btn.danger{border-color:var(--coral); color:#c94a30;}
  .mod-btn.danger:hover{background:rgba(212,98,42,0.1);}
  .mod-btn:hover{border-color:var(--turquoise); color:var(--turquoise);}
  .admin-pill{
    font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.68rem; font-weight:700; background:var(--coral); color:#fff;
    padding:2px 8px; border-radius:20px; margin-left:0.4rem; text-decoration:none;
  }
  .suspended-banner{
    background:rgba(212,98,42,0.14); border:1px solid rgba(212,98,42,0.4); border-radius:10px;
    padding:0.9rem 1rem; font-size:0.85rem; line-height:1.5;
  }

  /* ---------- COMMUNITY AS A SEPARATE PAGE ---------- */
  body.view-community .home-view{display:none;}
  body.view-community #comunidad{display:block;}
  .back-to-hub{
    display:none; align-items:center; gap:0.4rem; font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.78rem; font-weight:600;
    color:var(--turquoise); text-decoration:none; margin-bottom:1rem;
  }
  body.view-community .back-to-hub{display:inline-flex;}

  .feed-mode-tabs{display:flex; gap:0.6rem; margin-bottom:1.4rem;}
  .mode-tab{
    font-family:'Space Grotesk', 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif; font-weight:600; font-size:0.88rem; padding:0.6rem 1.2rem; border-radius:20px;
    border:1px solid rgba(11,61,46,0.18); background:transparent; cursor:pointer; color:var(--ink); opacity:0.55;
  }
  .mode-tab.active{opacity:1; background:var(--ocean-deep); color:var(--paper); border-color:var(--ocean-deep);}
  .mode-tab:hover{opacity:0.85;}

  .follow-chip{
    font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.68rem; font-weight:600; padding:3px 10px; border-radius:20px;
    border:1px solid var(--turquoise); background:transparent; color:var(--turquoise); cursor:pointer; white-space:nowrap;
  }
  .follow-chip.following{background:var(--turquoise); color:var(--paper); border-color:var(--turquoise);}
  .follow-chip:hover{opacity:0.85;}
  .profile-clickable{cursor:pointer;}
  .profile-clickable:hover{text-decoration:underline;}
  .auth-row{display:flex; justify-content:space-between; align-items:center; gap:0.8rem;}
  .or-divider{text-align:center; font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.68rem; color:rgba(11,61,46,0.4); margin:1rem 0; text-transform:uppercase; letter-spacing:0.08em;}
  .auth-error{font-size:0.78rem; margin-top:0.7rem; min-height:1em; color:#c94a30;}
  .auth-success{color:#0d8078;}
  .verify-banner{background:rgba(217,165,32,0.14); border:1px solid rgba(217,165,32,0.4); padding:0.65rem 0.9rem; border-radius:10px; font-size:0.78rem; margin-bottom:0.9rem; line-height:1.5;}
  .config-warning{font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.78rem; line-height:1.6; color:rgba(11,61,46,0.65);}

  /* ---------- FOOTER / ARCHITECTURE NOTE ---------- */
  footer{
    background:var(--ocean-deep); color:var(--sand);
    padding:3rem 1.5rem 2.2rem; margin-top:1rem;
  }
  .footer-inner{max-width:1180px; margin:0 auto;}
  footer h3{font-size:1.2rem; margin-bottom:0.8rem;}
  footer p{font-size:0.88rem; line-height:1.6; color:rgba(244,241,234,0.75); max-width:62ch;}
  .footer-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; margin-top:1.8rem;}
  @media (max-width:820px){ .footer-grid{grid-template-columns:1fr;} }
  .footer-grid div{border-top:1px solid rgba(255,255,255,0.15); padding-top:0.9rem;}
  .footer-grid strong{display:block; font-family:'Space Grotesk', 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size:0.9rem; margin-bottom:0.3rem; color:var(--turquoise-bright);}
  .footer-grid p{font-size:0.8rem;}
  .legal-links{
    display:flex; flex-wrap:wrap; gap:0.3rem 1.2rem; margin-top:2rem;
    padding-top:1.4rem; border-top:1px solid rgba(255,255,255,0.15);
  }
  .legal-link{
    background:none; border:none; cursor:pointer; padding:0;
    font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.72rem; color:rgba(244,241,234,0.7);
    text-decoration:underline;
  }
  .legal-link:hover{color:var(--turquoise-bright);}
  .legal-body{font-size:0.86rem; line-height:1.65; color:rgba(11,61,46,0.82); max-height:60vh; overflow-y:auto;}
  .legal-body h4{font-family:'Space Grotesk', 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif; font-size:0.95rem; margin:1.3rem 0 0.4rem; color:var(--ink);}
  .legal-body h4:first-child{margin-top:0;}
  .legal-body p{margin-bottom:0.7rem;}
  .legal-body ul{margin:0 0 0.8rem 1.1rem;}
  .legal-body li{margin-bottom:0.35rem;}
  .legal-updated{font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.68rem; color:rgba(11,61,46,0.45); margin-top:1.4rem;}
  .legal-warn{
    background:rgba(212,98,42,0.1); border-left:3px solid var(--coral);
    padding:0.8rem 1rem; border-radius:0 8px 8px 0; margin-bottom:1rem; font-size:0.84rem;
  }
  .foot-bottom{margin-top:2.4rem; font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.72rem; opacity:0.5;}

  /* ---------- DECORATIVE MOTIF STRIP (step-fret pattern) ---------- */
  .motif-strip{
    height:13px;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='13' viewBox='0 0 40 13'%3E%3Cpath d='M0 13 L0 6.5 L6.5 6.5 L6.5 0 L13 0 L13 6.5 L19.5 6.5 L19.5 0 L26 0 L26 6.5 L32.5 6.5 L32.5 0 L40 0' fill='none' stroke='%23D9A520' stroke-width='1.6'/%3E%3C/svg%3E");
    background-repeat:repeat-x;
    background-size:40px 13px;
    opacity:0.85;
  }


/* ---------- HOME HUB CARDS (multi-page) ---------- */
.hub-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:1rem;}
@media (max-width:900px){ .hub-grid{grid-template-columns:repeat(2,1fr);} }
.hub-card{
  display:block; text-decoration:none; color:inherit;
  background:var(--paper); border:1px solid rgba(11,61,46,0.1); border-radius:16px; padding:1.3rem 1.2rem;
  transition:transform 0.15s, box-shadow 0.15s, border-color 0.15s;
}
.hub-card:hover{transform:translateY(-2px); box-shadow:0 14px 24px -16px rgba(11,61,46,0.35); border-color:var(--turquoise);}
.hub-icon{font-size:1.6rem; margin-bottom:0.6rem;}
.hub-card h3{font-size:1.02rem; margin-bottom:0.3rem;}
.hub-card p{font-size:0.8rem; color:rgba(11,61,46,0.6); line-height:1.45;}
/* On dedicated pages these sections should always show */
#comunidad, #allevents, #myprofile, #people, #organizer{display:block;}

.post-flash{animation:postFlash 2.2s ease;}
@keyframes postFlash{ 0%,60%{box-shadow:0 0 0 3px var(--turquoise);} 100%{box-shadow:none;} }

.post-loc{
  display:inline-block; font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.72rem; color:var(--turquoise);
  text-decoration:none; margin:0.3rem 0 0.6rem; padding:0.25rem 0.6rem; border-radius:20px;
  background:rgba(0,135,81,0.08); border:1px solid rgba(0,135,81,0.25);
}
.post-loc:hover{background:var(--turquoise); color:var(--paper);}

.legal-inline{background:none; border:none; padding:0; font:inherit; color:var(--turquoise); text-decoration:underline; cursor:pointer;}

/* ---------- PROFILE PHOTOS ---------- */
.avatar-photo{padding:0; overflow:hidden; background:var(--sand);}
.avatar-photo img{width:100%; height:100%; object-fit:cover; display:block; border-radius:50%;}

/* ---------- BUSINESS PROFILES ---------- */
.biz-tag{font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.58rem; text-transform:uppercase; letter-spacing:0.05em; background:var(--amber); color:#fff; padding:1px 6px; border-radius:20px; vertical-align:middle;}
.verified-badge{display:inline-flex; align-items:center; justify-content:center; width:16px; height:16px; border-radius:50%; background:var(--turquoise); color:#fff; font-size:0.65rem; font-weight:700; vertical-align:middle;}

.admin-count{display:inline-block; background:#fff; color:var(--coral); border-radius:20px; padding:0 5px; font-size:0.62rem; margin-left:2px; font-weight:700;}

  /* ---------- OPERATING COMPANY / LEGAL FOOTER ---------- */
  .foot-legal{margin-top:2.4rem; border-top:1px solid rgba(255,255,255,0.10); padding-top:1.4rem;}
  .foot-legal .foot-company{font-weight:600; font-size:0.82rem; opacity:0.75; margin-bottom:0.4rem;}
  .foot-legal .foot-reg{font-size:0.72rem; line-height:1.55; opacity:0.5; max-width:60ch;}
  .foot-legal .foot-bottom{margin-top:1.1rem;}

  /* ---------- HIDDEN ATTRIBUTE ----------
     The [hidden] attribute is a UA-level rule, so any author rule that sets
     display (e.g. .btn{display:inline-flex}) silently defeats it. That is why
     "Get tickets" appeared on events with no ticket link. Make it authoritative. */
  [hidden]{display:none !important;}

  /* Reserve space for feed and listing images so the page does not jump
     as they arrive on a slow connection. */
  .post-image, .pphoto, .mod-poster{background:rgba(11,61,46,0.06);}

  /* Touch targets: 44px is the accessible minimum. */
  .btn, .chip, .filter-chip, .legal-link, .icon-btn{min-height:44px;}
  .legal-link{padding:0.5rem 0.2rem;}

  /* Visible keyboard focus — there was none. */
  a:focus-visible, button:focus-visible, input:focus-visible,
  select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible{
    outline:3px solid var(--ocean-deep, #0B3D2E); outline-offset:2px; border-radius:4px;
    box-shadow:0 0 0 6px #fff;
  }
  /* On the dark weather card and footer, invert the ring so it stays visible. */
  .wx-card :focus-visible, footer :focus-visible, .site-footer :focus-visible, .hero-wx :focus-visible{
    outline-color:#fff; box-shadow:0 0 0 6px var(--ocean-deep, #0B3D2E);
  }

  /* Skip link for screen-reader and keyboard users. */
  .skip-link{position:absolute; left:-9999px; top:0; z-index:200;
    background:var(--ocean-deep,#0B3D2E); color:#fff; padding:0.8rem 1.2rem; border-radius:0 0 8px 0;}
  .skip-link:focus{left:0;}

  /* Empty/error states were the lowest-contrast text on the site. */
  .live-empty, .feed-empty, .muted, .notif-meta{opacity:1; color:var(--ink-soft,#4a5a55);}

  @media (prefers-reduced-motion: reduce){
    .ticker-track{animation:none !important;}
    *{animation-duration:0.01ms !important; transition-duration:0.01ms !important;}
  }

  /* Account controls (data export / delete) on the profile page. */
  .account-controls{width:100%; display:flex; gap:0.6rem; flex-wrap:wrap;
    margin-top:1.2rem; padding-top:1.2rem; border-top:1px solid rgba(11,61,46,0.12);}
  .btn.danger{color:#8b1f1f; border-color:rgba(139,31,31,0.35);}
  .btn.danger:hover{background:rgba(139,31,31,0.06);}

  /* Page heading — every page needs exactly one h1 for structure and search. */
  .page-h1{font-family:'Space Grotesk',sans-serif; font-size:1.6rem; margin:0 0 1.2rem;}

  /* Tables inside the legal documents (lawful bases, retention periods). */
  .legal-table{width:100%; border-collapse:collapse; margin:0.8rem 0 1.2rem; font-size:0.85rem;}
  .legal-table th, .legal-table td{border:1px solid rgba(11,61,46,0.18); padding:0.5rem 0.6rem; text-align:left; vertical-align:top;}
  .legal-table th{background:rgba(11,61,46,0.06); font-weight:700;}

  /* Report control on the live viewer. */
  .report-live{color:#8b1f1f;}

  /* ---------- BUSINESS PROFILE FORM ----------
     This form had no styling at all: labels rendered inline next to the previous
     input, and nothing had a border or a width. Mirrors #eventForm / #placeForm. */
  #bizForm{display:flex; flex-direction:column; gap:0.7rem;}
  #bizForm label{
    display:block;
    font-family:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size:0.7rem; text-transform:uppercase;
    letter-spacing:0.06em; color:rgba(11,61,46,0.55); margin-bottom:-0.35rem;
  }
  #bizForm input[type="text"], #bizForm input[type="url"], #bizForm input[type="tel"],
  #bizForm textarea, #bizForm select{
    font-family:'Manrope', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; font-size:0.88rem; padding:0.6rem 0.8rem; border-radius:10px;
    border:1px solid rgba(11,61,46,0.2); background:var(--sand); color:var(--ink);
    width:100%; max-width:100%;
  }
  #bizForm textarea{min-height:80px; resize:vertical;}
  #bizForm input:focus-visible, #bizForm textarea:focus-visible, #bizForm select:focus-visible{
    outline:2px solid var(--turquoise); outline-offset:1px;
  }
  #bizForm .poster-drop{margin-top:0.2rem;}

  /* Same guard for every other form rendered into a modal, so a new form can
     never ship unstyled again. */
  .modal-body form label, .overlay-body form label{display:block;}

  /* Technical detail under a failure message — small, but visible in a screenshot
     from a phone, where there is no console to read. */
  .err-detail{
    display:block; margin-top:0.35rem; font-size:0.68rem; opacity:0.75;
    word-break:break-word;
  }

  /* ---------- TOUCH TARGETS, ROUND TWO ----------
     The first pass only covered five class names, so every control added since
     (resend, report-live, share, the identity picker) was still 12-20px tall. */
  .btn, .chip, .filter-chip, .legal-link, .icon-btn,
  .signout-link, .report-live, .post-share, .profile-share, .profile-report,
  .mode-tab, .follow-chip, .mod-btn, .auth-tab, .pw-toggle,
  .nav-toggle, .lang-toggle, .bell-btn, .wx-locate,
  .modal-close, .fs-btn, .fs-chat-toggle, .photo-remove,
  .chat-form button, .chat-form input{
    min-height:44px;
  }
  .nav-toggle, .lang-toggle, .bell-btn, .modal-close, .fs-btn, .photo-remove, .wx-locate{
    min-width:44px;
  }
  .vis-toggle{display:flex; align-items:center; gap:0.6rem; min-height:44px;}
  .vis-toggle input[type=checkbox]{width:22px; height:22px;}

  /* Identity rows are keyboard-reachable now, so they need a focus style. */
  [data-profile][role="link"]:focus-visible{outline:3px solid var(--ocean-deep,#0B3D2E); outline-offset:2px; box-shadow:0 0 0 6px #fff;}

  /* ---------- NARROW PHONES ----------
     At 360px, signed in, the header pushed the document 41px wider than the
     viewport and the whole page scrolled sideways. */
  @media (max-width:420px){
    .nav-inner{padding:0.7rem 0.6rem; gap:0.35rem;}
    .nav-inner > div:last-child{min-width:0; flex-shrink:1;}
    .me-chip{min-width:0;}
    .me-chip #navMyProfile{display:none;}
    .lang-toggle{padding:0 0.5rem;}
    .nav-inner .live-pill, .nav-inner .nav-live{display:none;}
  }
  .signout-link{white-space:nowrap;}
  .me-chip-link{display:inline-flex; align-items:center; gap:0.5rem; min-height:44px; min-width:44px;
    justify-content:center; color:inherit; text-decoration:none; border-radius:22px; padding:0 0.2rem;}
  .me-chip-link:hover #navMyName{text-decoration:underline;}
  .auth-pill{min-height:44px;}
  .share-btn, .back-to-hub, .feed-refresh{min-height:44px;}
  .feed-refresh{width:44px; height:44px;}
  .post-author-link{display:inline-flex; align-items:center; gap:0.5rem; min-height:44px;}
  /* Marquee: honour reduced motion and give keyboard users a pause. */
  .ticker-track.paused, .ticker-track:hover, .ticker-track:focus-within{animation-play-state:paused;}
  .ticker-bar{position:sticky;}
  .ticker-pause{position:absolute; right:0; top:0; height:100%; background:var(--ocean-deep,#0B3D2E); border:none; border-left:1px solid rgba(255,255,255,0.2);
    color:var(--sand,#F4F1EA); font-size:0.7rem; padding:0 0.7rem; min-width:44px; cursor:pointer;}
  .ticker-pause:hover{background:var(--ocean-mid,#12523D);}
  /* Clickable list rows rendered as real buttons now — strip default button chrome. */
  button.place-card, button.notif-item, button.activity-item, .online-count-btn{
    font:inherit; color:inherit; text-align:left; width:100%; background:var(--paper); cursor:pointer; display:block;
  }
  .online-count-btn{background:none; border:none; padding:0.5rem 0; min-height:44px; width:auto; font-family:inherit; font-size:inherit; color:inherit; display:inline-flex; align-items:center;}
  .online-count-btn:hover{color:var(--turquoise);}
  button.activity-item{border-radius:10px;}
  .sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;}
  /* Business status line in the owner's profile list. */
  .biz-status-line{font-size:0.75rem; margin:0.25rem 0 0; color:rgba(11,61,46,0.75);}
  .biz-status-line.rejected{color:#9a3a22;}
  .verify-banner{display:flex; gap:0.6rem; align-items:center; flex-wrap:wrap; font-size:0.82rem;
    background:rgba(217,165,32,0.14); border:1px solid rgba(217,165,32,0.5); border-radius:10px; padding:0.7rem 0.9rem; margin-bottom:0.8rem;}
  .verify-banner .btn{min-height:36px;}
  .edited-flag{font-family:'IBM Plex Mono', ui-monospace, monospace; font-size:0.62rem; background:rgba(11,61,46,0.08); border-radius:20px; padding:2px 7px; margin-left:0.4rem;}
  .listener-error{font-family:'IBM Plex Mono', ui-monospace, monospace; font-size:0.8rem; color:#9a3a22; padding:1rem; text-align:center;}
  .listener-error button{margin-left:0.5rem;}
  html{overflow-x:hidden;}
  .signin-note{font-size:0.8rem; margin-top:0.6rem; padding:0.5rem 0.7rem; border-radius:8px; background:rgba(217,165,32,0.14); color:var(--ink);}
  .signin-note a{color:var(--ocean-deep); font-weight:600;}

  /* ---------- EDIT PROFILE DIALOG ---------- */
  .profile-bio{font-size:0.9rem; color:rgba(11,61,46,0.85); margin:0.4rem 0 0; max-width:48ch; white-space:pre-line;}
  .edit-photo-row{display:flex; align-items:center; gap:1rem; margin-bottom:0.6rem; flex-wrap:wrap;}
  .edit-photo-row .avatar-lg{width:72px; height:72px; font-size:1.6rem;}
  .edit-photo-btns{display:flex; gap:0.5rem; flex-wrap:wrap;}
  #editProfileForm label{display:block; margin-top:0.8rem; margin-bottom:0.3rem; font-size:0.82rem; font-weight:600;}
  #editProfileForm .vis-toggle{margin-top:0.8rem;}
  #editProfileForm textarea{width:100%; min-height:70px; font-family:'Manrope', system-ui, sans-serif; font-size:0.9rem; padding:0.7rem 0.8rem; border-radius:10px; border:1px solid rgba(11,61,46,0.2); background:var(--sand); color:var(--ink); resize:vertical;}
  .edit-profile-actions{display:flex; gap:0.5rem; justify-content:flex-end; flex-wrap:wrap; margin-top:0.8rem;}

  /* ---------- PROFILE TABS: HAPPENING / MINE / AROUND ME ---------- */
  #profileActivity .post-card{margin-bottom:1rem;}
  #profileActivity .upcoming-head{margin-top:1.2rem;}
  .near-bar{display:flex; flex-wrap:wrap; gap:0.6rem; align-items:center; justify-content:space-between; margin-bottom:1rem;}
  .near-where{font-size:0.9rem; font-weight:600;}
  .near-radius{display:flex; gap:0.4rem; flex-wrap:wrap;}
  .near-dist{font-size:0.68rem; color:rgba(11,61,46,0.7); margin:0 0 0.25rem 0.4rem;}
  .geo-toggle{font-size:0.78rem;}
  .me-chip-avatar{min-width:44px; padding:0;}
  .me-chip .me-chip-link + .me-chip-link{margin-left:-0.3rem;}
  .edit-section-head{font-size:0.78rem; letter-spacing:0.08em; text-transform:uppercase; color:rgba(11,61,46,0.6); margin:1.4rem 0 0.5rem; padding-top:1rem; border-top:1px solid rgba(11,61,46,0.1);}
  #editProfileBody .account-controls{margin-top:0.2rem;}

  /* ---------- GLOBAL LOCATION FIELDS ---------- */
  .two-col{display:grid; grid-template-columns:1fr 1fr; gap:0.6rem;}
  @media (max-width:480px){ .two-col{grid-template-columns:1fr;} }
  .venue-geo{display:flex; align-items:center; gap:0.6rem; flex-wrap:wrap; margin:0.4rem 0 0.8rem;}
  .ecity{font-size:0.72rem; color:rgba(11,61,46,0.75); margin:0.1rem 0 0.3rem;}
  /* ---------- LANGUAGE MENU + RTL ---------- */
  .lang-menu{position:absolute; z-index:120; background:var(--paper); border:1px solid rgba(11,61,46,0.15); border-radius:12px; box-shadow:0 14px 30px -12px rgba(11,61,46,0.4); padding:0.4rem; display:grid; gap:2px; min-width:180px;}
  .lang-menu button{display:flex; justify-content:space-between; align-items:center; gap:1rem; width:100%; background:none; border:none; padding:0.55rem 0.7rem; border-radius:8px; font:inherit; color:var(--ink); cursor:pointer; min-height:40px; text-align:start;}
  .lang-menu button:hover, .lang-menu button:focus-visible{background:rgba(11,61,46,0.07);}
  .lang-menu button[aria-checked="true"]{font-weight:700;}
  .lang-menu .lang-code{font-family:'IBM Plex Mono', ui-monospace, monospace; font-size:0.65rem; opacity:0.6;}
  [dir="rtl"] body, [dir="rtl"]{text-align:start;}
  [dir="rtl"] .post-top .cat-badge{margin-left:0; margin-right:auto;}
  [dir="rtl"] .feed-refresh{margin-left:0; margin-right:auto;}
  [dir="rtl"] .my-profile-actions{margin-left:0; margin-right:auto;}
  [dir="rtl"] .ticker-track{animation-direction:reverse;}
  [dir="rtl"] .back-to-hub{direction:rtl;}
  /* ---------- MESSAGES ---------- */
  .msg-card{max-width:560px;}
  .conv-list{display:flex; flex-direction:column; gap:2px;}
  .conv-item{display:flex; align-items:center; gap:0.7rem; width:100%; padding:0.6rem 0.4rem; background:none; border:none; border-bottom:1px solid rgba(11,61,46,0.08); font:inherit; color:inherit; text-align:start; cursor:pointer; min-height:56px;}
  .conv-item:hover{background:rgba(11,61,46,0.05);}
  .conv-item.unread strong{font-weight:800;}
  .conv-main{flex:1; min-width:0; display:flex; flex-direction:column;}
  .conv-last{font-size:0.8rem; color:rgba(11,61,46,0.7); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
  .conv-meta{font-size:0.68rem; color:rgba(11,61,46,0.6); display:flex; flex-direction:column; align-items:flex-end; gap:0.2rem;}
  .conv-badge{position:static;}
  .thread-head{display:flex; justify-content:space-between; align-items:center; gap:0.5rem; margin-bottom:0.5rem;}
  .thread-actions{display:flex; gap:0.3rem;}
  .thread-actions .btn{min-width:44px; padding:0 0.6rem;}
  .thread-menu{display:flex; gap:1rem; margin:0 0 0.5rem; padding:0.4rem 0.6rem; background:rgba(11,61,46,0.05); border-radius:8px;}
  .thread-msgs{max-height:48vh; min-height:180px; overflow-y:auto; display:flex; flex-direction:column; gap:0.35rem; padding:0.5rem 0.2rem; scroll-behavior:smooth;}
  .msg-bubble{max-width:82%; align-self:flex-start; background:rgba(11,61,46,0.07); padding:0.5rem 0.7rem; border-radius:14px 14px 14px 4px; font-size:0.92rem; line-height:1.4; white-space:pre-wrap; word-break:break-word;}
  .msg-bubble.mine{align-self:flex-end; background:var(--ocean-deep); color:var(--sand); border-radius:14px 14px 4px 14px;}
  .msg-time{display:block; font-size:0.62rem; opacity:0.7; margin-top:0.2rem; text-align:end;}
  .thread-form{margin-top:0.6rem;}
  .msg-open{white-space:nowrap;}
  [dir="rtl"] .msg-bubble{border-radius:14px 14px 4px 14px;} [dir="rtl"] .msg-bubble.mine{border-radius:14px 14px 14px 4px;}
  .contact-prefs{border:1px solid rgba(11,61,46,0.15); border-radius:10px; padding:0.6rem 0.8rem 0.4rem; margin:0.8rem 0;}
  .contact-prefs legend{font-size:0.82rem; font-weight:700; padding:0 0.3rem;}
  /* ---------- CALLS ---------- */
  .call-overlay{background:rgba(11,61,46,0.92);}
  .call-card{background:#0b1f18; color:#fff; max-width:640px;}
  .call-stage{display:flex; flex-direction:column; align-items:center; gap:0.8rem; text-align:center; position:relative;}
  .call-stage h4{margin:0; font-size:1.2rem;}
  .call-stage p{margin:0; opacity:0.85;}
  .call-stage .avatar-lg{width:88px; height:88px; font-size:2rem;}
  .call-stage video{background:#000; border-radius:12px;}
  #remoteVideo{width:100%; max-height:60vh; object-fit:cover;}
  .local-pip{position:absolute; top:0.5rem; right:0.5rem; width:28%; max-width:160px; aspect-ratio:3/4; object-fit:cover; border:2px solid rgba(255,255,255,0.6);}
  .call-btns{display:flex; gap:0.6rem; flex-wrap:wrap; justify-content:center; margin-top:0.4rem;}
  .call-card .btn-ghost{color:#fff; border-color:rgba(255,255,255,0.5);}
  .call-card .btn.danger{background:#b3261e; border-color:#b3261e; color:#fff;}
  .call-card :focus-visible{outline-color:#fff; box-shadow:0 0 0 6px #0b1f18;}

/* ---- r13: end-to-end encryption gate ---- */
.e2e-gate{display:flex;flex-direction:column;gap:0.6rem;align-items:stretch;max-width:380px;margin:0.5rem auto;text-align:center}
.e2e-gate h4{margin:0;font-size:1.05rem}
.e2e-gate .e2e-lock{font-size:2.2rem;line-height:1}
.e2e-gate .text-input{width:100%}
.e2e-gate .form-error{color:var(--coral,#e5533d);margin:0;font-size:0.9rem}
.e2e-gate .e2e-note{font-size:0.78rem;opacity:0.8}
.e2e-wait{margin:0.6rem 0 0}
.msg-bubble.undecryptable{opacity:0.7;font-style:italic}

/* ---- r14: privacy mode (disappearing + scheduled) ---- */
.pm-indicator{margin:0 0 0.4rem;font-size:0.82rem;opacity:0.85}
.pm-ttl{display:flex;flex-wrap:wrap;gap:0.35rem;align-items:center;margin-bottom:0.4rem}
.pm-ttl .filter-chip{font-size:0.8rem;padding:0.15rem 0.6rem}
.pm-schedule{display:flex;flex-wrap:wrap;gap:0.4rem;align-items:center;margin-top:0.4rem;font-size:0.85rem}
.pm-schedule .text-input{width:auto}
.thread-form #threadClock{padding:0.3rem 0.5rem}
.msg-bubble.scheduled{opacity:0.75;border-style:dashed}
.msg-bubble .msg-time button{margin-left:0.3rem}

/* ---- r15: people near you ---- */
.people-scope{display:flex;flex-wrap:wrap;gap:0.4rem;margin:0.2rem 0 0.5rem}
.ep-location{display:grid;gap:0.3rem;margin-top:0.6rem}
.e2e-guide{text-align:left;font-size:0.85rem;margin-top:0.4rem;border:1px solid rgba(0,0,0,0.12);border-radius:10px;padding:0.4rem 0.7rem}
.e2e-guide summary{cursor:pointer;font-weight:600}
.e2e-guide ol{margin:0.4rem 0 0.2rem 1.1rem;padding:0;display:grid;gap:0.35rem}
.pm-indicator.biz-plain{background:rgba(0,0,0,0.05);border-radius:8px;padding:0.3rem 0.5rem}

/* ---- r17: two kinds of ✓ — gold for businesses, blue for people ---- */
.verified-badge.biz{background:#c9971d;color:#1b1b1b}
.verified-badge.person{background:#1d6fe0;color:#fff}
.verify-box{display:grid;gap:0.5rem;margin-bottom:0.8rem}
.verify-box textarea{width:100%}
.verify-ok{margin:0;font-weight:600}
.flights-intro{display:grid;gap:0.6rem;justify-items:center}
.mod-excerpt{margin-top:0.4rem;font-size:0.85rem}
.mod-excerpt summary{cursor:pointer}
.excerpt-list{display:grid;gap:0.25rem;margin-top:0.3rem;max-height:260px;overflow:auto;padding:0.4rem;background:rgba(0,0,0,0.04);border-radius:8px}
.excerpt-line.them{color:#7a1f1f}

/* ---- r19: push notifications ---- */
.push-banner{display:flex;flex-wrap:wrap;gap:0.5rem;align-items:center;justify-content:space-between;padding:0.6rem 0.8rem;margin-bottom:0.7rem;border-radius:10px;background:rgba(34,178,160,0.12);font-size:0.9rem}
.push-banner span{flex:1 1 220px}
.push-toast{position:fixed;left:50%;bottom:1.2rem;transform:translateX(-50%);max-width:min(92vw,420px);background:var(--ocean-deep,#0f3d2e);color:#fff;padding:0.7rem 1rem;border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,0.25);z-index:9999;display:grid;gap:0.15rem;cursor:pointer}
.push-toast span{opacity:0.9;font-size:0.9rem}
.push-setting{margin-bottom:0.8rem}

/* ---- r19: auth action page ---- */
.auth-action-card{max-width:480px;margin:1rem auto;padding:1.4rem;border-radius:16px;background:#fff;box-shadow:0 6px 24px rgba(0,0,0,0.08)}
.aa-done{text-align:center;display:grid;gap:0.6rem;justify-items:center}
.aa-icon{font-size:2.4rem}
.aa-form{display:grid;gap:0.5rem}