:root{
  --miracle-cyan:#69f7ff;
  --miracle-violet:#9578ff;
  --miracle-pink:#ff7fd4;
  --miracle-panel:rgba(18,20,29,.84);
  --miracle-line:rgba(255,255,255,.13);
}
html{scroll-behavior:smooth;}
body.miracle-page{
  min-height:100vh;
  background:
    radial-gradient(circle at 82% 6%,rgba(105,247,255,.17),transparent 26%),
    radial-gradient(circle at 12% 16%,rgba(149,120,255,.2),transparent 27%),
    radial-gradient(circle at 56% 42%,rgba(255,127,212,.08),transparent 28%),
    linear-gradient(145deg,#080a10 0%,#11101b 48%,#06080d 100%);
  color:#fff;
}
.miracle-page:before{
  content:"";position:fixed;inset:0;pointer-events:none;opacity:.14;z-index:0;
  background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
  background-size:44px 44px;mask-image:linear-gradient(to bottom,black,transparent 72%);
}
.miracle-shell{position:relative;z-index:1;min-height:100vh;}
.miracle-header{padding:22px clamp(18px,4vw,56px) 46px;border-bottom:1px solid var(--miracle-line);background:linear-gradient(180deg,rgba(3,5,10,.9),rgba(8,8,15,.58));}
.miracle-nav{display:flex;align-items:center;justify-content:space-between;gap:16px;max-width:1500px;margin:0 auto 48px;}
.miracle-back{color:#d7d7df;text-decoration:none;font-weight:900;font-size:13px;letter-spacing:.02em;border:1px solid var(--miracle-line);border-radius:999px;padding:10px 14px;background:rgba(255,255,255,.045);}
.miracle-back:hover{border-color:var(--miracle-cyan);color:#fff;}
.miracle-nav-tag{font-size:11px;letter-spacing:.2em;color:var(--miracle-cyan);font-weight:1000;}
.miracle-hero-copy{max-width:1500px;margin:0 auto;}
.miracle-kicker{font-size:12px;letter-spacing:.22em;color:#b7b8c3;font-weight:900;margin-bottom:12px;}
.miracle-hero-copy h1{font-size:clamp(46px,8vw,104px);line-height:.86;margin:0;letter-spacing:-.055em;font-weight:1000;}
.miracle-hero-copy h1 em{font-style:normal;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.58);text-shadow:0 0 42px rgba(105,247,255,.08);}
.miracle-hero-copy p{max-width:740px;color:#bdbec8;font-size:15px;line-height:1.7;margin:24px 0 24px;}
.miracle-stats{display:flex;flex-wrap:wrap;gap:10px;}
.miracle-stats span{font-size:11px;letter-spacing:.1em;font-weight:900;color:#c9cad2;border:1px solid var(--miracle-line);background:rgba(255,255,255,.04);padding:8px 11px;border-radius:7px;}
.miracle-stats b{color:var(--miracle-cyan);}
.miracle-main{max-width:1500px;margin:0 auto;padding:42px clamp(18px,4vw,56px) 72px;}
.miracle-section-heading{display:flex;justify-content:space-between;align-items:end;gap:22px;margin-bottom:20px;}
.miracle-section-heading span{font-size:10px;letter-spacing:.2em;color:var(--miracle-cyan);font-weight:1000;}
.miracle-section-heading h2{font-size:30px;margin:5px 0 0;letter-spacing:-.04em;}
.miracle-search-wrap{display:flex;gap:8px;min-width:min(420px,100%);}
.miracle-search-wrap input{flex:1;border:1px solid var(--miracle-line);background:rgba(7,9,14,.84);color:#fff;border-radius:10px;padding:12px 14px;outline:none;font-size:14px;}
.miracle-search-wrap input:focus{border-color:rgba(105,247,255,.7);box-shadow:0 0 0 3px rgba(105,247,255,.08);}
.miracle-search-wrap button{border:1px solid var(--miracle-line);background:rgba(255,255,255,.06);color:#ddd;border-radius:10px;padding:0 13px;font-weight:900;}
.miracle-artist-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(155px,1fr));gap:14px;}
.miracle-artist-card{position:relative;border:1px solid var(--miracle-line);border-radius:13px;overflow:hidden;background:#0c0d13;padding:0;color:white;text-align:left;transition:.18s transform,.18s border-color,.18s box-shadow;box-shadow:0 10px 24px rgba(0,0,0,.2);}
.miracle-artist-card:hover{transform:translateY(-4px);border-color:rgba(105,247,255,.58);box-shadow:0 16px 34px rgba(0,0,0,.36),0 0 22px rgba(105,247,255,.06);}
.miracle-artist-card.active{border-color:var(--miracle-cyan);box-shadow:0 0 0 1px var(--miracle-cyan),0 14px 38px rgba(0,0,0,.44),0 0 30px rgba(105,247,255,.1);}
.miracle-artist-card img{display:block;width:100%;aspect-ratio:477/680;object-fit:cover;background:#12131a;}
.miracle-card-overlay{position:absolute;inset:auto 0 0;padding:42px 10px 10px;background:linear-gradient(transparent,rgba(3,4,7,.94));}
.miracle-card-number{position:absolute;top:8px;left:8px;background:rgba(4,6,10,.78);border:1px solid rgba(255,255,255,.2);backdrop-filter:blur(8px);font-size:10px;font-weight:1000;padding:5px 7px;border-radius:6px;}
.miracle-card-name{font-size:13px;font-weight:1000;line-height:1.2;text-shadow:0 2px 7px #000;}
.miracle-card-count{font-size:10px;color:#b8bac4;margin-top:4px;letter-spacing:.04em;}
.miracle-card-count.has-song{color:var(--miracle-cyan);}
.artist-detail{margin-top:48px;border:1px solid var(--miracle-line);border-radius:20px;background:linear-gradient(145deg,rgba(17,19,28,.92),rgba(7,8,13,.92));min-height:260px;overflow:hidden;box-shadow:0 22px 60px rgba(0,0,0,.3);}
.detail-empty{min-height:260px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:#70727e;text-align:center;padding:30px;}
.detail-empty strong{color:#a4a6b2;letter-spacing:.18em;font-size:14px;}
.miracle-detail-head{display:grid;grid-template-columns:230px 1fr;gap:28px;padding:26px;border-bottom:1px solid var(--miracle-line);background:radial-gradient(circle at 14% 25%,rgba(149,120,255,.16),transparent 38%);}
.miracle-detail-poster{width:100%;border-radius:12px;aspect-ratio:477/680;object-fit:cover;border:1px solid rgba(255,255,255,.13);box-shadow:0 18px 34px rgba(0,0,0,.32);}
.miracle-detail-copy{min-width:0;display:flex;flex-direction:column;justify-content:center;}
.miracle-detail-index{color:var(--miracle-cyan);font-size:11px;font-weight:1000;letter-spacing:.2em;}
.miracle-detail-copy h2{font-size:clamp(34px,5vw,64px);margin:8px 0 7px;line-height:1;letter-spacing:-.045em;overflow-wrap:anywhere;}
.miracle-detail-copy p{color:#aeb0bc;margin:0 0 18px;line-height:1.6;}
.detail-actions{display:flex;flex-wrap:wrap;gap:8px;}
.detail-actions button{border:1px solid var(--miracle-line);border-radius:9px;background:rgba(255,255,255,.055);color:#fff;padding:10px 12px;font-weight:900;}
.detail-actions button:hover{border-color:var(--miracle-cyan);}
.miracle-player{padding:0 26px 26px;display:none;}
.miracle-player.active{display:block;}
.player-frame{position:relative;aspect-ratio:16/9;max-height:620px;background:#000;border-radius:0 0 14px 14px;overflow:hidden;border:1px solid var(--miracle-line);border-top:0;}
.player-frame iframe{width:100%;height:100%;border:0;display:block;}
.now-playing{display:flex;justify-content:space-between;gap:14px;align-items:center;background:#08090d;border:1px solid var(--miracle-line);border-bottom:0;padding:12px 14px;border-radius:12px 12px 0 0;}
.now-playing strong{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.now-playing span{font-size:10px;color:var(--miracle-cyan);letter-spacing:.13em;font-weight:1000;}
.miracle-playlist{padding:20px 26px 28px;}
.playlist-title-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;}
.playlist-title-row h3{font-size:18px;margin:0;}
.playlist-title-row span{font-size:11px;color:#858793;}
.song-list{display:grid;gap:7px;}
.miracle-song{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:14px;padding:11px 12px;border:1px solid rgba(255,255,255,.09);border-radius:10px;background:rgba(255,255,255,.035);}
.miracle-song.playing{border-color:rgba(105,247,255,.62);background:rgba(105,247,255,.055);}
.song-main{min-width:0;display:flex;align-items:center;gap:11px;}
.song-order{flex:0 0 28px;color:#686a74;font-size:11px;font-weight:1000;text-align:right;}
.song-text{min-width:0;}
.song-name{font-size:14px;font-weight:1000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.song-credit{font-size:11px;color:#9496a2;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.song-meta{display:flex;align-items:center;gap:6px;justify-content:flex-end;}
.song-badge{border:1px solid rgba(255,255,255,.12);border-radius:999px;padding:4px 7px;font-size:9px;font-weight:1000;color:#bbb;white-space:nowrap;}
.song-badge.credit{color:#d1c7ff;border-color:rgba(149,120,255,.28);}
.song-badge.feature{color:#ffb9e5;border-color:rgba(255,127,212,.28);}
.song-play,.song-youtube{border:1px solid rgba(255,255,255,.13);border-radius:8px;background:#151720;color:#fff;font-weight:1000;font-size:11px;padding:8px 10px;text-decoration:none;white-space:nowrap;}
.song-play:hover{border-color:var(--miracle-cyan);color:var(--miracle-cyan);}.song-youtube:hover{border-color:#ff6877;color:#ff8c96;}
.song-no-video{font-size:10px;color:#60626b;padding:0 5px;white-space:nowrap;}
.no-linked-songs{padding:42px 18px;text-align:center;border:1px dashed rgba(255,255,255,.12);border-radius:12px;color:#858793;line-height:1.7;}
.no-linked-songs strong{display:block;color:#d3d4db;margin-bottom:5px;}
.miracle-footer{max-width:1500px;margin:0 auto;padding:24px clamp(18px,4vw,56px) 38px;border-top:1px solid var(--miracle-line);display:flex;justify-content:space-between;gap:12px;font-size:10px;letter-spacing:.13em;color:#6f717a;font-weight:900;}
.miracle-footer a{color:#aeb0b9;text-decoration:none;}
.miracle-entry-btn{border-color:rgba(105,247,255,.4)!important;color:#bdfbff!important;background:rgba(105,247,255,.08)!important;}
@media(max-width:800px){
  .miracle-header{padding-bottom:34px}.miracle-nav{margin-bottom:34px}.miracle-nav-tag{display:none}
  .miracle-main{padding-top:30px}.miracle-section-heading{align-items:stretch;flex-direction:column}.miracle-search-wrap{min-width:0;width:100%}
  .miracle-artist-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.miracle-card-name{font-size:11px}.miracle-card-overlay{padding:34px 8px 8px}
  .miracle-detail-head{grid-template-columns:112px 1fr;gap:16px;padding:16px}.miracle-detail-copy h2{font-size:30px}.miracle-detail-copy p{font-size:12px;margin-bottom:12px}
  .miracle-player,.miracle-playlist{padding-left:14px;padding-right:14px}.miracle-playlist{padding-top:14px}
  .miracle-song{grid-template-columns:1fr;gap:8px}.song-meta{justify-content:flex-start;padding-left:39px}.song-order{flex-basis:28px}
}
@media(max-width:480px){
  .miracle-artist-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.miracle-detail-head{grid-template-columns:88px 1fr}.miracle-detail-copy h2{font-size:25px}.detail-actions button{font-size:11px;padding:8px 9px}.miracle-detail-copy p{display:none}
}