:root { --ink:#16002f; --violet:#3f10bf; --purple:#7b27e8; --pink:#ff4ee4; --yellow:#eaff52; --cream:#fffaf1; --line:rgba(255,255,255,.62); }
* { box-sizing:border-box; }
html { min-width:320px; background:var(--ink); }
body { margin:0; color:var(--cream); font-family:Outfit,Arial,sans-serif; background:radial-gradient(circle at 50% 0%,#5d1dd0 0 16%,transparent 47%),linear-gradient(160deg,#24005e 0%,#5c16c5 38%,#16002f 100%); min-height:100svh; }
.page-shell { width:min(100%,640px); min-height:100svh; margin:auto; padding:22px 22px 28px; position:relative; overflow:hidden; isolation:isolate; }
.ambient { position:absolute; border-radius:50%; filter:blur(1px); opacity:.75; z-index:-2; }
.ambient-one { width:420px; height:420px; top:185px; right:-330px; background:#ff4ee4; }
.ambient-two { width:330px; height:330px; bottom:150px; left:-270px; background:#06e5e5; }
.noise { position:absolute; inset:0; opacity:.17; pointer-events:none; z-index:-1; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E"); mix-blend-mode:soft-light; }
.hero { text-align:center; position:relative; padding:22px 0 31px; }
.share { position:absolute; right:0; top:0; display:inline-flex; align-items:center; gap:7px; border:1px solid rgba(255,255,255,.55); background:rgba(22,0,47,.32); color:var(--cream); font:500 11px/1 'DM Mono',monospace; letter-spacing:.05em; padding:9px 10px; border-radius:99px; cursor:pointer; backdrop-filter:blur(8px); }
.share:hover { background:var(--cream); color:var(--ink); }
.share svg { width:15px; height:15px; fill:none; stroke:currentColor; stroke-linecap:round; stroke-linejoin:round; stroke-width:1.8; }
.portrait-wrap { width:120px; height:120px; border:3px solid var(--cream); outline:4px solid var(--pink); border-radius:50%; overflow:hidden; margin:7px auto 20px; box-shadow:8px 8px 0 #110022; position:relative; }
.portrait-wrap img { width:100%; height:100%; object-fit:cover; object-position:center; }
.live-dot { position:absolute; width:17px; height:17px; border-radius:50%; background:var(--yellow); right:2px; bottom:3px; border:2px solid var(--ink); box-shadow:0 0 0 2px var(--cream); }
.kicker,.section-label,footer p { font:500 10px/1.3 'DM Mono',monospace; letter-spacing:.13em; }
.kicker { margin:0 0 8px; color:var(--yellow); }
.brand-lockup { width:min(100%,330px); height:auto; line-height:0; margin:0 auto; filter:drop-shadow(4px 4px 0 #1d0042); }
.brand-lockup img { display:block; width:100%; height:auto; filter:brightness(0) invert(1); }
.intro { margin:21px auto 0; font-size:16px; line-height:1.3; font-weight:600; }
.links { display:grid; gap:12px; }
.link-card { min-height:75px; padding:10px 15px 10px 11px; display:grid; grid-template-columns:51px 1fr 20px; align-items:center; gap:12px; color:var(--ink); text-decoration:none; background:var(--cream); border:2px solid var(--ink); border-radius:16px; box-shadow:6px 6px 0 var(--ink); transition:transform .16s ease,box-shadow .16s ease,background .16s ease; }
.link-card:hover,.link-card:focus-visible { transform:translate(3px,3px); box-shadow:3px 3px 0 var(--ink); outline:none; }
.link-card:focus-visible { box-shadow:3px 3px 0 var(--ink),0 0 0 3px var(--yellow); }
.link-card.featured { background:var(--pink); min-height:86px; }
.link-card.song-request { background:#baf7f4; min-height:86px; }
.link-card.contact { background:var(--yellow); }
.link-card.partner { background:#baf7f4; }
.card-icon { width:43px; height:43px; display:grid; place-items:center; border:2px solid var(--ink); border-radius:12px; background:var(--ink); color:var(--cream); font:800 13px/1 Outfit,sans-serif; }
.ticket { background:var(--yellow); color:var(--ink); border-radius:50%; font-size:25px; transform:rotate(-9deg); }
.music-note { background:var(--violet); color:var(--yellow); border-radius:50%; font-size:27px; }
.contact .card-icon { background:var(--pink); color:var(--ink); }
.card-icon svg { width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.instagram { background:linear-gradient(145deg,#ffce4d,#ff4b8e 42%,#a02de4); }.tiktok { background:#101014; color:#fff; font-size:28px; text-shadow:2px 0 #00f2ea,-2px 0 #ff0050; }.youtube { background:#f01717; color:#fff; }.messenger { background:#197cff; }.facebook { background:#165bcb; }
.card-copy { min-width:0; display:grid; gap:4px; }.card-copy strong { font-size:14px; letter-spacing:.035em; line-height:1.08; }.card-copy small { font-size:12px; font-weight:600; opacity:.72; line-height:1.12; }.arrow { font-size:25px; font-weight:700; justify-self:end; }
.section-label { color:var(--yellow); display:flex; gap:9px; align-items:center; justify-content:center; margin:17px 0 1px; }.section-label span { width:22px; height:1px; background:currentColor; opacity:.75; }
footer { padding:36px 0 5px; text-align:center; } footer p { color:var(--yellow); margin:0 0 10px; } footer a { color:var(--cream); font:500 12px 'DM Mono',monospace; text-decoration-thickness:1px; text-underline-offset:3px; }.pulse { display:inline-block; vertical-align:middle; width:8px; height:8px; margin-right:4px; border-radius:50%; background:var(--yellow); box-shadow:0 0 0 0 rgba(234,255,82,.65); animation:pulse 1.8s infinite; }
@keyframes pulse { 70% { box-shadow:0 0 0 8px rgba(234,255,82,0); } 100% { box-shadow:0 0 0 0 rgba(234,255,82,0); } }
@media (min-width:641px) { .page-shell { padding-top:34px; } .hero { padding-bottom:36px; } .link-card { min-height:78px; } }
@media (max-width:390px) { .page-shell { padding-inline:16px; } .intro { font-size:15px; } .link-card { grid-template-columns:44px 1fr 16px; gap:10px; padding-right:11px; }.card-icon { width:40px;height:40px; }.card-copy strong { font-size:12.5px; }.card-copy small { font-size:11.5px; } }
@media (prefers-reduced-motion:reduce) { *,*:before,*:after { animation-duration:.01ms!important; transition-duration:.01ms!important; } }