/* index.css — extracted from inline <style> blocks. Generated by scripts/h1-extract.mjs */
:root { color-scheme: dark; }
  html, body { margin: 0; height: 100%; background: #0a0a0f; color: #e8e8ef;
    font: 13px/1.4 -apple-system, Segoe UI, Roboto, sans-serif; overflow: hidden; }
  #stage { position: fixed; inset: 0; display: block; width: 100%; height: 100%; }
  #panel {
    position: fixed; top: 12px; left: 12px; width: 260px;
    background: rgba(15,15,22,0.82); backdrop-filter: blur(8px);
    border: 1px solid #2a2a3a; border-radius: 10px; padding: 14px 16px;
    box-shadow: 0 10px 30px rgba(0,0,0,.45);
  }
  #panel h1 { margin: 0 0 10px; font-size: 14px; letter-spacing: .3px; }
  #panel .row { display: flex; align-items: center; justify-content: space-between;
    gap: 8px; margin: 8px 0; }
  #panel label { flex: 0 0 90px; color: #b8b8c8; font-size: 12px; }
  #panel input[type=range] { flex: 1; accent-color: #7aa2ff; }
  #panel .val { flex: 0 0 38px; text-align: right; color: #9aa0b4; font-variant-numeric: tabular-nums; }
  #panel .hint { margin-top: 10px; color: #8a8fa3; font-size: 11px; line-height: 1.5; }
  #fps { position: fixed; top: 12px; right: 12px; padding: 6px 10px;
    background: rgba(15,15,22,0.82); border: 1px solid #2a2a3a; border-radius: 8px;
    font-variant-numeric: tabular-nums; color: #b8b8c8; }
  .sep { height: 1px; background: #24243a; margin: 10px -4px; }
  button { width: 100%; padding: 7px 10px; background: #1a1a2a; color: #e8e8ef;
    border: 1px solid #2e2e44; border-radius: 6px; cursor: pointer; font: inherit; }
  button:hover { background: #222236; }

  @media (max-width: 768px) {
    #panel {
      top: 8px; left: 8px; right: 8px; width: auto;
      max-height: 45vh; overflow-y: auto;
      padding: 12px 14px;
    }
    #panel h1 { font-size: 15px; }
    #panel label { flex: 0 0 80px; font-size: 13px; min-height: 44px; display: flex; align-items: center; }
    #panel .val { font-size: 13px; }
    #panel input[type=range] { min-height: 44px; }
    #panel .row { margin: 4px 0; }
    #panel .hint { font-size: 12px; }
    button { min-height: 44px; font-size: 14px; }
    #fps { top: auto; bottom: 8px; right: 8px; font-size: 12px; padding: 6px 10px; }
  }

  @media (max-width: 480px) {
    #panel {
      max-height: 50vh;
      padding: 10px 12px;
    }
    #panel h1 { font-size: 14px; margin-bottom: 6px; }
    #panel label { flex: 0 0 72px; font-size: 12px; }
    #panel .val { font-size: 12px; flex: 0 0 34px; }
    #panel .hint { font-size: 11px; }
    #fps { font-size: 11px; }
  }