:root{--bg:#090909;--panel:#111;--text:#f2f2f2;--muted:#9b9b9b;--accent:#f39200;--line:#2a2a2a}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text);font-family:Arial,Helvetica,sans-serif}body{overflow-x:hidden}
.noise{position:fixed;inset:0;pointer-events:none;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E")}
.app{width:min(1180px,92%);margin:auto}.topbar{height:86px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:12px;color:var(--text);text-decoration:none}.brand-mark{display:grid;place-items:center;width:42px;height:42px;border:2px solid var(--accent);font-weight:900;transform:skew(-8deg)}
.brand-text{display:flex;flex-direction:column;line-height:.9;letter-spacing:.08em}.brand-text strong{font-size:18px}.brand-text small{font-size:11px;color:var(--accent);margin-top:5px}.live-pill{font-size:12px;letter-spacing:.14em;font-weight:800}.dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#e21b1b;margin-right:7px;box-shadow:0 0 14px #e21b1b}
.hero{min-height:650px;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:30px;padding:58px 0 35px}.eyebrow{font-size:12px;letter-spacing:.28em;color:var(--accent);font-weight:800}
h1{font-size:clamp(56px,8vw,104px);line-height:.82;margin:18px 0;font-weight:1000;letter-spacing:-.06em}h1 em{font-style:normal;color:transparent;-webkit-text-stroke:1px #eee}.tagline{font-size:20px;color:#c8c8c8;margin:0 0 30px}
.player-card{display:grid;grid-template-columns:76px 1fr 64px;gap:18px;align-items:center;padding:18px;background:rgba(255,255,255,.045);border:1px solid var(--line);backdrop-filter:blur(8px)}
.cover{width:76px;height:76px;display:grid;place-items:center;background:#151515;border:1px solid #303030}.vinyl{width:55px;height:55px;border-radius:50%;display:grid;place-items:center;background:repeating-radial-gradient(circle,#111 0 3px,#292929 4px 5px);border:2px solid #444}.vinyl span{font-size:9px;font-weight:900;color:var(--accent);background:#0c0c0c;border-radius:50%;width:25px;height:25px;display:grid;place-items:center}
.label{margin:0 0 6px;color:var(--accent);font-size:10px;letter-spacing:.18em;font-weight:900}.track-info h2{font-size:18px;margin:0 0 5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.track-info #status{margin:0;color:var(--muted);font-size:13px}
.play{width:58px;height:58px;border-radius:50%;border:0;background:var(--accent);color:#111;font-size:21px;cursor:pointer;transition:transform .15s,filter .15s}.play:hover{transform:scale(1.06);filter:brightness(1.08)}
.volume-row{display:flex;align-items:center;gap:10px;margin-top:13px;color:#aaa;font-size:12px}.volume-row input{width:180px;accent-color:var(--accent)}.error{color:#ff7777;background:#250f0f;border:1px solid #5b2222;padding:10px 12px;font-size:12px;margin-top:12px}
.hero-art img{
    width:100%;
    height:100%;
    object-fit:contain;
    display:block;
    margin:auto;
}

.info-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.info-grid article{padding:30px;border-right:1px solid var(--line)}.info-grid article:last-child{border-right:0}.num{color:var(--accent);font-size:11px;font-weight:900;letter-spacing:.2em}.info-grid h3{margin:10px 0 8px;font-size:16px}.info-grid p{color:var(--muted);line-height:1.6;font-size:13px;margin:0}
footer{height:90px;display:flex;align-items:center;justify-content:space-between;color:#666;font-size:10px;letter-spacing:.15em}
@media(max-width:800px){.hero{grid-template-columns:1fr;padding-top:40px}.hero-art{height:270px;order:-1}.hero-copy{padding-bottom:20px}.train{transform:scale(.75) skewX(-5deg);transform-origin:left bottom}.info-grid{grid-template-columns:1fr}.info-grid article{border-right:0;border-bottom:1px solid var(--line)}.info-grid article:last-child{border-bottom:0}footer{height:auto;padding:28px 0;gap:14px;flex-direction:column;align-items:flex-start}}

.whatsapp-request{
    margin-top:16px;
}

.whatsapp-request a{
    display:inline-block;
    padding:12px 18px;
    border:1px solid var(--accent);
    color:var(--accent);
    text-decoration:none;
    font-size:12px;
    font-weight:900;
    letter-spacing:.08em;
    transition:.2s ease;
}

.whatsapp-request a:hover{
    background:var(--accent);
    color:#090909;
}
