@charset "UTF-8";:root{--accent: #6c63ff;--accent-h: #5a52d5;--danger: #e53e3e;--navbar-h: calc(52px + env(safe-area-inset-top, 0px)) ;--bg: #12102a;--surface: #1c1c2a;--surface2: #2a2a3a;--border: #2a2a3a;--border2: #333;--text: #e8e8f0;--text-muted:#888;--shadow: rgba(0,0,0,.4)}body.light{--bg: #ede9f7;--surface: #ffffff;--surface2: #ebebf3;--border: #dddde8;--border2: #d0d0e0;--text: #18181f;--text-muted:#666;--shadow: rgba(0,0,0,.12)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background-color:var(--bg);background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScyMDAnIGhlaWdodD0nMjAwJyB2aWV3Qm94PScwIDAgMjAwIDIwMCc+CiAgPGcgZmlsbD0nbm9uZScgc3Ryb2tlPScjZmZmZmZmJyBzdHJva2Utb3BhY2l0eT0nMC4wMzInIHN0cm9rZS13aWR0aD0nMS41Jz4KICAgIDxsaW5lIHgxPScwJyB5MT0nMjAnIHgyPScyMDAnIHkyPScyMCcvPgogICAgPGxpbmUgeDE9JzAnIHkxPScyOCcgeDI9JzIwMCcgeTI9JzI4Jy8+CiAgICA8bGluZSB4MT0nMCcgeTE9JzM2JyB4Mj0nMjAwJyB5Mj0nMzYnLz4KICAgIDxsaW5lIHgxPScwJyB5MT0nNDQnIHgyPScyMDAnIHkyPSc0NCcvPgogICAgPGxpbmUgeDE9JzAnIHkxPSc1MicgeDI9JzIwMCcgeTI9JzUyJy8+CiAgICA8bGluZSB4MT0nMCcgeTE9JzE0MicgeDI9JzIwMCcgeTI9JzE0MicvPgogICAgPGxpbmUgeDE9JzAnIHkxPScxNTAnIHgyPScyMDAnIHkyPScxNTAnLz4KICAgIDxsaW5lIHgxPScwJyB5MT0nMTU4JyB4Mj0nMjAwJyB5Mj0nMTU4Jy8+CiAgICA8bGluZSB4MT0nMCcgeTE9JzE2NicgeDI9JzIwMCcgeTI9JzE2NicvPgogICAgPGxpbmUgeDE9JzAnIHkxPScxNzQnIHgyPScyMDAnIHkyPScxNzQnLz4KICA8L2c+CiAgPGcgZmlsbD0nI2ZmZmZmZicgZmlsbC1vcGFjaXR5PScwLjA0Mic+CiAgICA8Y2lyY2xlIGN4PScyOCcgY3k9JzUwJyByPSc1Jy8+CiAgICA8cmVjdCB4PSczMicgeT0nMTQnIHdpZHRoPScyJyBoZWlnaHQ9JzM2Jy8+CiAgICA8cGF0aCBkPSdNMzIgMTQgcTE2IDMgMTEgMTcgcS0yLTktMTEtMTAgWicvPgogICAgPGNpcmNsZSBjeD0nMTU4JyBjeT0nNTAnIHI9JzUnLz4KICAgIDxyZWN0IHg9JzE2MicgeT0nMTQnIHdpZHRoPScyJyBoZWlnaHQ9JzM2Jy8+CiAgICA8Y2lyY2xlIGN4PSc2OCcgY3k9JzE3MCcgcj0nNScvPgogICAgPHJlY3QgeD0nNzInIHk9JzEyOCcgd2lkdGg9JzInIGhlaWdodD0nNDInLz4KICAgIDxjaXJjbGUgY3g9JzEwNCcgY3k9JzE3MCcgcj0nNScvPgogICAgPHJlY3QgeD0nMTA2JyB5PScxMjgnIHdpZHRoPScyJyBoZWlnaHQ9JzQyJy8+CiAgICA8cmVjdCB4PSc3MicgeT0nMTI2JyB3aWR0aD0nMzYnIGhlaWdodD0nNCcvPgogIDwvZz4KPC9zdmc+Cg==);background-repeat:repeat;background-size:130px 130px;background-attachment:fixed;color:var(--text);min-height:100vh;transition:background-color .2s,color .2s}body.light{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScyMDAnIGhlaWdodD0nMjAwJyB2aWV3Qm94PScwIDAgMjAwIDIwMCc+CiAgPGcgZmlsbD0nbm9uZScgc3Ryb2tlPScjNmM2M2ZmJyBzdHJva2Utb3BhY2l0eT0nMC4wNycgc3Ryb2tlLXdpZHRoPScxLjUnPgogICAgPGxpbmUgeDE9JzAnIHkxPScyMCcgeDI9JzIwMCcgeTI9JzIwJy8+CiAgICA8bGluZSB4MT0nMCcgeTE9JzI4JyB4Mj0nMjAwJyB5Mj0nMjgnLz4KICAgIDxsaW5lIHgxPScwJyB5MT0nMzYnIHgyPScyMDAnIHkyPSczNicvPgogICAgPGxpbmUgeDE9JzAnIHkxPSc0NCcgeDI9JzIwMCcgeTI9JzQ0Jy8+CiAgICA8bGluZSB4MT0nMCcgeTE9JzUyJyB4Mj0nMjAwJyB5Mj0nNTInLz4KICAgIDxsaW5lIHgxPScwJyB5MT0nMTQyJyB4Mj0nMjAwJyB5Mj0nMTQyJy8+CiAgICA8bGluZSB4MT0nMCcgeTE9JzE1MCcgeDI9JzIwMCcgeTI9JzE1MCcvPgogICAgPGxpbmUgeDE9JzAnIHkxPScxNTgnIHgyPScyMDAnIHkyPScxNTgnLz4KICAgIDxsaW5lIHgxPScwJyB5MT0nMTY2JyB4Mj0nMjAwJyB5Mj0nMTY2Jy8+CiAgICA8bGluZSB4MT0nMCcgeTE9JzE3NCcgeDI9JzIwMCcgeTI9JzE3NCcvPgogIDwvZz4KICA8ZyBmaWxsPScjNmM2M2ZmJyBmaWxsLW9wYWNpdHk9JzAuMTEnPgogICAgPGNpcmNsZSBjeD0nMjgnIGN5PSc1MCcgcj0nNScvPgogICAgPHJlY3QgeD0nMzInIHk9JzE0JyB3aWR0aD0nMicgaGVpZ2h0PSczNicvPgogICAgPHBhdGggZD0nTTMyIDE0IHExNiAzIDExIDE3IHEtMi05LTExLTEwIFonLz4KICAgIDxjaXJjbGUgY3g9JzE1OCcgY3k9JzUwJyByPSc1Jy8+CiAgICA8cmVjdCB4PScxNjInIHk9JzE0JyB3aWR0aD0nMicgaGVpZ2h0PSczNicvPgogICAgPGNpcmNsZSBjeD0nNjgnIGN5PScxNzAnIHI9JzUnLz4KICAgIDxyZWN0IHg9JzcyJyB5PScxMjgnIHdpZHRoPScyJyBoZWlnaHQ9JzQyJy8+CiAgICA8Y2lyY2xlIGN4PScxMDQnIGN5PScxNzAnIHI9JzUnLz4KICAgIDxyZWN0IHg9JzEwNicgeT0nMTI4JyB3aWR0aD0nMicgaGVpZ2h0PSc0MicvPgogICAgPHJlY3QgeD0nNzInIHk9JzEyNicgd2lkdGg9JzM2JyBoZWlnaHQ9JzQnLz4KICA8L2c+Cjwvc3ZnPgo=)}.page{max-width:900px;margin:0 auto;padding:calc(var(--navbar-h) + 20px) 20px 20px}.page-header{display:flex;align-items:center;gap:16px;margin-bottom:24px}.page-header h1{flex:1;font-size:1.8rem;min-width:0}@media(max-width:600px){.page-header{gap:8px}.page-header h1{font-size:1.3rem;min-width:0}.page-header .btn-label{display:none}.page-header .btn-primary,.page-header .btn-secondary,.page-header .btn-danger{padding:10px;gap:0}.page-header .btn-primary svg,.page-header .btn-secondary svg,.page-header .btn-danger svg{width:18px;height:18px}}.card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:16px}.back-btn{display:inline-flex;align-items:center;gap:4px;padding:8px 14px;border-radius:8px;background:var(--accent);border:1px solid var(--accent);color:#fff;text-decoration:none;font-size:.9rem;cursor:pointer}.back-btn:hover{background:var(--accent-h);border-color:var(--accent-h);color:#fff}a{color:var(--accent)}input,textarea,select{width:100%;padding:12px;background:var(--surface);border:1px solid var(--border2);border-radius:8px;color:var(--text);font-size:1rem;transition:border-color .15s}input:focus,textarea:focus,select:focus{outline:none;border-color:var(--accent)}label{color:var(--text-muted);font-size:.9rem}.form-group{margin-bottom:16px}.form-group label{display:block;margin-bottom:6px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.title-artist-row{grid-template-columns:2fr 1fr}.form-actions{display:flex;gap:12px;margin-top:24px}button{border:none;border-radius:8px;cursor:pointer;font-size:1rem;transition:opacity .15s,transform .1s}button:disabled{opacity:.5;cursor:not-allowed}.btn-primary,.btn-secondary,.btn-danger{display:inline-flex;align-items:center;flex-shrink:0;white-space:nowrap;gap:6px;padding:10px 20px;border-radius:8px;font-size:1rem;text-decoration:none;cursor:pointer;border:none}.btn-primary svg,.btn-secondary svg,.btn-danger svg{width:16px;height:16px;flex-shrink:0}.btn-primary:disabled,.btn-secondary:disabled,.btn-danger:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover:not(:disabled){background:var(--accent-h)}.btn-secondary{background:var(--surface2);color:var(--text);border:1px solid var(--border)}.btn-danger{background:var(--danger);color:#fff}.key-badge,.type-badge{display:inline-block;padding:2px 8px;border-radius:4px;font-size:.75rem;margin-right:4px;background:var(--surface2);color:var(--text-muted)}.song-card{background:var(--surface);border-radius:12px;padding:16px;border:1px solid var(--border);position:relative;transition:border-color .15s,box-shadow .15s}.song-card:hover{border-color:var(--accent);box-shadow:0 2px 12px var(--shadow)}.song-card a{text-decoration:none;color:inherit;display:block}.song-card h3{font-size:1.1rem;margin-bottom:4px}.song-card p{color:var(--text-muted);font-size:.9rem}.songs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;margin-top:16px}.session-card{background:var(--surface);border-radius:12px;padding:16px;border:1px solid var(--border);margin-bottom:12px}.session-card.active{border-color:var(--accent)}.session-card a{text-decoration:none;color:inherit;display:flex;gap:16px;align-items:center}.session-card h3{flex:1}.session-code{background:var(--surface2);color:var(--text);padding:4px 10px;border-radius:6px;font-family:monospace;font-size:1.1rem;letter-spacing:2px}.auth-page{position:relative;max-width:460px;margin:80px auto;padding:40px;background:var(--surface);border-radius:16px;border:1px solid var(--border);box-shadow:0 4px 24px var(--shadow)}.auth-page h1{margin-bottom:24px;text-align:center}.auth-page input{margin-bottom:12px}.auth-page button{width:100%;margin-top:8px;padding:12px 20px;background:var(--accent);color:#fff}.auth-page p{margin-top:16px;text-align:center;color:var(--text-muted)}.auth-page a{color:var(--accent)}.auth-page .auth-theme-toggle{position:absolute;top:14px;right:14px;width:34px;height:34px;border-radius:8px;border:1px solid var(--border);background:var(--surface2);cursor:pointer;color:var(--accent);display:flex;align-items:center;justify-content:center;transition:background .15s,border-color .15s;width:34px!important;margin:0!important;padding:0!important}.auth-page .auth-theme-toggle svg{width:18px;height:18px;display:block}.auth-page .auth-theme-toggle:hover{border-color:var(--accent);background:#6c63ff14}@media(max-width:600px){.auth-page{max-width:100%;min-height:100dvh;margin:0;padding:40px 24px;border-radius:0;border:none;box-shadow:none}}.error{color:var(--danger);margin-top:8px;font-size:.9rem}.loading{text-align:center;padding:40px;color:var(--text-muted)}.empty{color:var(--text-muted);text-align:center;padding:40px}.hint{color:var(--text-muted);font-size:.9rem}.search-bar{margin-bottom:20px;position:relative}.fav-btn{background:none;border:none;color:gold;font-size:1.4rem;padding:4px;cursor:pointer}.zoom-controls{display:flex;gap:8px;align-items:center;margin-bottom:16px}.song-content{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:24px;white-space:pre-wrap;font-family:Courier New,monospace;line-height:1.8}.session-layout{display:grid;grid-template-columns:1fr 300px;gap:20px;margin-top:20px}.songs-panel,.chat-panel{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:16px}.songs-panel h3,.chat-panel h3{margin-bottom:12px}.session-song-item{padding:10px;border-radius:8px;cursor:pointer}.session-song-item:hover{background:var(--surface2)}.session-song-item.current{background:#6c63ff22;border-left:3px solid var(--accent)}.chat-messages{height:300px;overflow-y:auto;margin-bottom:12px}.chat-msg{padding:6px 0;font-size:.9rem}.chat-input{display:flex;gap:8px}.chat-input input{flex:1}.session-actions{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:24px}.create-session,.join-session{display:flex;flex-direction:column;gap:8px}.create-session button,.join-session button{background:var(--accent);color:#fff;padding:12px 20px}.page-nav{display:flex;gap:16px;margin-top:40px;padding-top:20px;border-top:1px solid var(--border)}.page-nav a{color:var(--text-muted);text-decoration:none}.page-nav a:hover{color:var(--text)}.page-nav button{background:none;color:var(--text-muted);padding:0;border:none;font-size:1rem}.page-nav button:hover{color:var(--text)}.profile-info{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:16px;margin-bottom:24px}.profile-info p{padding:8px 0}@media print{.app-navbar,.theme-toggle{display:none!important}.page{padding-top:0!important;max-width:100%!important}}
