html, body {
    background: #000000;
    font-family: 'Inter', ui-sans-serif, system-ui, sans-serif;
    -webkit-font-smoothing: antialiased;
  }
  .nums { font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1; }
  .noise-overlay {
    position: fixed;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    opacity: .03;
    mix-blend-mode: overlay;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  }

  /* ---------- Fond : noir pur + étoiles fixes (même traitement que les
     autres pages du site — plus de nappes vertes/bleues animées) ---------- */
  .aurora-field {
    position: fixed; inset: 0; z-index: 0; overflow: hidden; pointer-events: none;
    background: #000000;
  }
  .aurora-field::before{
    content:""; position:absolute; inset:0;
    background-image:
      radial-gradient(1.5px 1.5px at 8% 15%, rgba(255,255,255,.7), transparent),
      radial-gradient(1px 1px at 22% 55%, rgba(255,255,255,.5), transparent),
      radial-gradient(1px 1px at 38% 8%, rgba(255,255,255,.45), transparent),
      radial-gradient(1.5px 1.5px at 52% 70%, rgba(255,255,255,.5), transparent),
      radial-gradient(1px 1px at 68% 25%, rgba(255,255,255,.4), transparent),
      radial-gradient(1px 1px at 82% 60%, rgba(255,255,255,.55), transparent),
      radial-gradient(1px 1px at 94% 12%, rgba(255,255,255,.4), transparent),
      radial-gradient(1.5px 1.5px at 12% 85%, rgba(255,255,255,.45), transparent),
      radial-gradient(1px 1px at 45% 40%, rgba(255,255,255,.35), transparent),
      radial-gradient(1px 1px at 75% 90%, rgba(255,255,255,.4), transparent);
    background-repeat: repeat;
    background-size: 700px 700px;
    opacity:.55;
    /* étoiles fixes : aucune animation */
  }
  /* Nappes de lumière (glow-blob) retirées du rendu : le HTML peut garder
     ses <div class="glow-blob">, elles restent juste invisibles. */
  .glow-blob{ display:none; }

  .glass {
    background: linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0)), #0D1526;
    border: 1px solid rgba(255,255,255,.07);
  }
  .dashboard-frame { border-radius: 22px; }
  .divide-hairline > :not([hidden]) ~ :not([hidden]) { border-color: rgba(255,255,255,.07); }
  .day-hours-col .hour-row:not(:last-child) {
    border-bottom: 1px dashed rgba(255,255,255,.07);
  }
  .bar-track { position: relative; height: 8px; border-radius: 999px; background: rgba(255,255,255,.06); overflow: hidden; }
  .bar-fill  { position: absolute; inset: 0; width: 0%; border-radius: 999px; transition: width 1s cubic-bezier(.16,.8,.24,1); }
  .ring-progress { transition: stroke-dashoffset 1.3s cubic-bezier(.16,.8,.24,1); }
  .day-row { opacity: 0; animation: fadeSlideUp .7s cubic-bezier(.16,.8,.24,1) forwards; }
  @keyframes fadeSlideUp { from{opacity:0; transform:translateY(14px);} to{opacity:1; transform:translateY(0);} }
  .day-row:hover { background: rgba(255,255,255,.012); transition: background .3s ease; }
  .pill-btn {
    display: inline-flex; align-items: center; gap: 8px;
    border-radius: 999px; border: 1px solid rgba(255,255,255,.07);
    background: rgba(255,255,255,.03);
    padding: 10px 20px; font-size: 13px; font-weight: 500;
    transition: background-color .3s ease, border-color .3s ease;
    white-space: nowrap;
  }
  .pill-btn:hover { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.14); }
  .modal-backdrop { transition: opacity .25s ease; }
  .modal-panel { transition: transform .3s cubic-bezier(.16,.8,.24,1), opacity .3s ease; }
  [data-modal-state="closed"] .modal-backdrop { opacity: 0; pointer-events: none; }
  [data-modal-state="closed"] .modal-panel { opacity: 0; transform: translateY(12px) scale(.98); }
  [data-modal-state="open"] { pointer-events: auto; }
  a:focus-visible, button:focus-visible {
    outline: 2px solid #22C55E; outline-offset: 2px; border-radius: 8px;
  }
  @media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
      animation-duration: .001ms !important;
      animation-iteration-count: 1 !important;
      transition-duration: .001ms !important;
    }
  }
