:root{--bg:#0a0a0b;--fg:#f5f0e8;--muted:#8f8981;--dim:#68656a;--card:#141416;--line:rgba(245,240,232,.11);--accent:#ef6a4d;--accent2:#f38c73}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 88% 4%,rgba(239,106,77,.13),transparent 28rem),radial-gradient(circle at 8% 18%,rgba(231,175,80,.07),transparent 24rem),var(--bg);color:var(--fg);font-family:"Space Grotesk",Arial,sans-serif}a{color:inherit}input,textarea,button{font:inherit}button{cursor:pointer}.mono,.eyebrow,.section-label,.tag,.song-meta,.brand small,.account a,.stats{font-family:"DM Mono",monospace;text-transform:uppercase;letter-spacing:.14em;font-size:10px}.mono,.eyebrow,.section-label{color:var(--accent)}.login-shell,.shell{min-height:100vh;padding:24px 4vw}.topbar{max-width:1180px;margin:auto;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);padding-bottom:18px}.sj-brand{display:flex;align-items:center;gap:16px}.sj-brand img{display:block;width:116px;height:76px;object-fit:contain;object-position:center}.sj-brand .mono{color:var(--dim);font-size:9px}.brand{display:flex;align-items:center;gap:11px}.brand b{display:block;font-size:15px;letter-spacing:-.03em}.brand small{display:block;color:var(--dim);font-size:9px;margin-top:4px}.mark{display:flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:12px;background:var(--accent);color:#1a0e0b;font-size:22px;box-shadow:0 0 28px rgba(239,106,77,.2)}.account{font-size:12px;text-align:right}.account a{display:block;color:var(--dim);text-decoration:none;margin-top:5px}.login-grid{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:1.08fr .92fr;gap:8vw;align-items:center;padding:13vh 0 8vh}.hero h1,.page-head h1{font-size:clamp(3.3rem,8vw,7.4rem);line-height:.87;letter-spacing:-.075em;margin:22px 0 30px}.hero h1 em{font-style:normal;color:var(--accent)}.hero p,.page-head p{max-width:520px;color:#a39c94;line-height:1.8;font-size:15px}.stats{display:flex;gap:26px;border-top:1px solid var(--line);padding-top:18px;margin-top:45px;color:var(--dim)}.panel,.admin-card,.song{border:1px solid var(--line);background:rgba(20,20,22,.9);border-radius:18px;padding:30px;box-shadow:0 24px 80px rgba(0,0,0,.25)}.login-card h2,.admin-card h2{font-size:25px;letter-spacing:-.04em;margin:18px 0 10px}.icon{width:44px;height:44px;background:rgba(239,106,77,.11);color:var(--accent);border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:24px}.muted{color:var(--muted);line-height:1.65;font-size:14px}.stack{display:grid;gap:16px;margin-top:24px}label{display:grid;gap:7px;color:#aaa39a;font-size:12px}input,textarea{width:100%;background:#0c0c0e;border:1px solid var(--line);border-radius:10px;color:var(--fg);padding:12px 13px;outline:none}textarea{min-height:78px;resize:vertical}input:focus,textarea:focus{border-color:var(--accent)}.button{border:0;background:var(--accent);color:#1a0e0b;border-radius:11px;padding:13px 16px;font-weight:600;display:flex;justify-content:space-between;align-items:center}.button.secondary{background:#262528;color:var(--fg)}.security{border-top:1px solid var(--line);padding-top:16px;margin-top:18px;color:var(--dim);font-size:11px;line-height:1.6}.notice{padding:12px 14px;border-radius:10px;font-size:12px;margin:16px 0}.notice.error{background:rgba(228,87,87,.12);border:1px solid rgba(228,87,87,.3);color:#ffaaa0}.notice.success{background:rgba(98,180,121,.12);border:1px solid rgba(98,180,121,.3);color:#9de0aa}.shell{max-width:1280px;margin:auto}.page-head{max-width:1180px;margin:0 auto;padding:65px 0 38px;border-bottom:1px solid var(--line)}.page-head h1{font-size:clamp(2.8rem,6vw,5rem);margin:17px 0 20px}.content{max-width:1180px;margin:0 auto;padding:32px 0 80px}.section-label{margin-bottom:16px}.song{padding:0;margin:15px 0;overflow:hidden}.song-head{display:flex;justify-content:space-between;gap:18px;padding:20px;border-bottom:1px solid var(--line)}.song h2{font-size:17px;margin:0 0 6px}.song-head p{margin:0;color:var(--muted);font-size:12px}.tag{display:inline-flex;align-items:center;height:24px;padding:0 9px;border:1px solid rgba(239,106,77,.28);border-radius:99px;color:var(--accent2);background:rgba(239,106,77,.1);font-size:9px}.song audio{display:block;width:calc(100% - 40px);margin:17px 20px;accent-color:var(--accent)}.comment-box{border-top:1px solid var(--line);padding:18px 20px 20px}.comment-box form{display:flex;gap:14px;align-items:flex-end;flex-wrap:wrap}.comment-box form textarea{flex:1;min-width:220px}.comment-tools{display:flex;align-items:center;gap:12px;width:100%;padding-top:2px}.comment-tools>.button{margin-left:auto}.time-button{border:1px solid rgba(239,106,77,.55);background:rgba(239,106,77,.14);color:var(--accent2);border-radius:8px;padding:9px 12px;font-size:10px;letter-spacing:.08em}.time-button:hover{background:rgba(239,106,77,.25);color:var(--fg)}.time-status{color:var(--dim);font:9px "DM Mono",monospace;text-transform:uppercase;letter-spacing:.08em}.timestamp{border:1px solid rgba(239,106,77,.3);background:rgba(239,106,77,.1);color:var(--accent2);border-radius:5px;padding:2px 6px;margin-right:7px;font:9px "DM Mono",monospace;cursor:pointer}.comment-box textarea{min-height:58px;flex:1}.comment-list{display:grid;gap:14px;margin-top:22px;padding-top:4px}.comment{border:1px solid rgba(245,240,232,.1);border-left:3px solid var(--accent);background:rgba(12,12,14,.65);border-radius:10px;padding:13px 15px;color:#c0b8af;font-size:13px;line-height:1.65;box-shadow:0 8px 24px rgba(0,0,0,.12)}.comment small{display:block;color:var(--dim);font:9px "DM Mono",monospace;text-transform:uppercase;letter-spacing:.1em;margin-bottom:8px}.song-meta{display:flex;justify-content:space-between;gap:15px;padding:0 20px 18px;color:var(--dim);font-size:9px}.notes{border-left:2px solid var(--accent);margin:0 20px 20px;padding-left:12px;color:#aaa39a;font-size:12px;line-height:1.6}.empty{border:1px dashed rgba(245,240,232,.16);border-radius:16px;text-align:center;padding:70px 20px;color:var(--muted)}.empty p{font-size:13px}.empty.small{padding:18px;text-align:left}.footer{max-width:1180px;margin:auto;border-top:1px solid var(--line);padding:18px 0;color:#5d595f;font:9px "DM Mono",monospace;text-transform:uppercase;letter-spacing:.15em;display:flex;justify-content:space-between}.admin-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.full{grid-column:1/-1}.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}.divider{border-top:1px solid var(--line);margin:28px 0}.admin-song{display:flex;align-items:center;gap:10px;padding:13px 0;border-bottom:1px solid rgba(245,240,232,.07)}.admin-song>div{min-width:0;flex:1}.admin-song b,.admin-song small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.admin-song b{font-size:13px}.admin-song small{color:var(--dim);font:10px "DM Mono",monospace;margin-top:5px}.muted-tag{color:var(--dim);border-color:var(--line);background:transparent}.text-button{border:0;background:none;color:var(--dim);font:9px "DM Mono",monospace;text-transform:uppercase;letter-spacing:.12em}.text-button:hover{color:var(--accent)}.comment-tools .time-button{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--accent);background:var(--accent);color:#1a0e0b;border-radius:9px;padding:11px 15px;font:600 11px "Space Grotesk",Arial,sans-serif;letter-spacing:.02em;box-shadow:0 6px 18px rgba(239,106,77,.2);transition:transform .16s ease,background .16s ease}.comment-tools .time-button:hover{background:var(--accent2);color:#1a0e0b;transform:translateY(-1px)}code{color:var(--accent2)}.narrow{max-width:650px;margin:auto}.narrow .panel{margin-top:60px}
@media(max-width:800px){.sj-brand img{width:92px;height:64px}.sj-brand .mono{display:none}.login-grid,.admin-grid{grid-template-columns:1fr}.login-grid{padding-top:70px;gap:50px}.hero h1{font-size:clamp(3.3rem,16vw,6rem)}.stats{gap:12px;flex-wrap:wrap}.page-head{padding-top:50px}.panel,.admin-card{padding:22px}.two{grid-template-columns:1fr}.song-meta{display:block;line-height:1.8}.song-meta span{display:block}}
@media(max-width:800px){.comment-tools{align-items:stretch;flex-wrap:wrap}.comment-tools .button{margin-left:auto}.time-status{width:100%}}
.comment-done{opacity:.72;border-left-color:#75c98a}.comment-body{margin-bottom:10px}.comment-actions{display:flex;align-items:center;gap:10px;border-top:1px solid rgba(245,240,232,.08);padding-top:9px}.comment-status{font:9px "DM Mono",monospace;letter-spacing:.12em;color:var(--accent2)}.comment-status.done{color:#9de0aa}.text-button.danger{color:#e48a82}.text-button.danger:hover{color:#ffaaa0}