:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#0b0d10;--panel:#14171b;--border:#262b31;--text:#e7e9ec;--muted:#8b939d;--accent:#5eead4;--accent-panel:#10201c;--danger:#f87171;--danger-panel:#2a1414;font:16px/1.5 system-ui,Segoe UI,Roboto,sans-serif}body{background:var(--bg);color:var(--text);margin:0}.error-state{background:var(--danger-panel);border:1px solid var(--danger);color:var(--danger);border-radius:8px;margin:12px 0 0;padding:14px 16px;font-size:14px}.home-page{max-width:480px;margin:0 auto;padding:16px}.home-page h1{margin:12px 0 16px;font-size:18px}.song-list{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.song-list a{background:var(--panel);border:1px solid var(--border);color:var(--text);border-radius:8px;padding:14px 16px;font-weight:600;text-decoration:none;display:block}.song-list a:hover{border-color:var(--accent)}.empty-state{color:var(--muted);font-size:14px}.chord-diagram svg{max-width:100%;height:auto}.chord-help{position:absolute;top:8px;right:8px}.chord-help-trigger{border:1px solid var(--border);background:var(--bg);width:22px;height:22px;color:var(--muted);font:inherit;cursor:pointer;border-radius:999px;justify-content:center;align-items:center;padding:0;font-size:13px;font-weight:700;line-height:1;display:flex}.chord-help-trigger:hover,.chord-help-trigger[aria-expanded=true]{border-color:var(--accent);color:var(--accent)}.chord-help-popover{background:var(--bg);border:1px solid var(--border);text-align:left;z-index:20;border-radius:8px;width:min(240px,100vw - 64px);padding:12px;position:absolute;top:calc(100% + 8px);right:0;box-shadow:0 8px 24px #0006}.chord-help-legend{color:var(--text);flex-direction:column;gap:6px;margin:0 0 10px;padding:0;font-size:13px;list-style:none;display:flex}.chord-help-legend li{align-items:center;gap:8px;display:flex}.chord-help-glyph{flex:none;justify-content:center;align-items:center;width:14px;height:14px;display:flex}.chord-help-glyph-dot{background:var(--accent);border-radius:999px}.chord-help-glyph-ring{border:2px solid var(--accent);border-radius:999px}.chord-help-glyph-text{color:var(--text);font-size:13px;font-weight:700}.chord-help-note{border-left:2px solid var(--border);color:var(--muted);margin:0 0 10px;padding-left:8px;font-size:12px;line-height:1.4}.chord-help-contact{color:var(--muted);margin:0;font-size:12px}.chord-help-contact a{color:var(--accent)}.song-page{max-width:480px;margin:0 auto;padding:16px}.song-page h1{margin:12px 0 4px;font-size:18px}.capo-note{color:var(--muted);margin:0 0 16px;font-size:14px}.player-wrap{aspect-ratio:16/9;background:#000;border-radius:8px;width:100%;margin-bottom:16px;position:relative;overflow:hidden}.player-wrap iframe{width:100%;height:100%}.now-playing{background:var(--panel);border:1px solid var(--border);border-radius:8px;align-items:center;gap:16px;margin-bottom:16px;padding:16px;display:flex;position:relative}.current-block{text-align:center;flex:1.4}.next-block{text-align:center;opacity:.6;flex:1}.chord-label{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:4px;font-size:12px}.chord-name{font-size:20px;font-weight:700}.current-block .chord-name{color:var(--accent);font-size:28px}.chord-list{flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none;display:flex}.chord-list button{font:inherit;background:var(--panel);border:1px solid var(--border);color:var(--text);cursor:pointer;border-radius:6px;padding:10px 14px}.chord-list button:hover{border-color:var(--accent)}.chord-list button.active{background:var(--accent-panel);border-color:var(--accent);color:var(--accent)}
