:root{--hue:333;--bg:hsl(var(--hue), 10%, 10%);--bg-2:hsl(var(--hue), 10%, 15%);--bg-3:hsl(var(--hue), 10%, 20%);--bg-4:hsl(var(--hue), 10%, 25%);--bg-5:hsl(var(--hue), 10%, 30%);--line:hsl(var(--hue), 10%, 28%);--text:hsl(var(--hue), 10%, 92%);--text-2:hsl(var(--hue), 10%, 75%);--muted:hsl(var(--hue), 10%, 58%);--pink:hsl(var(--hue), 100%, 70%);--pink-2:hsl(var(--hue), 100%, 60%);--pink-dim:hsl(var(--hue), 60%, 45%);--blue:#6cf;--green:#b3ff66;--purple:#a8f;--radius:10px;--font:"Pretendard", "Noto Sans KR", "Noto Sans JP", system-ui, -apple-system, sans-serif;--ease:cubic-bezier(.22, 1, .36, 1)}*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:var(--font);background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;min-height:100vh;overflow-x:hidden}button{cursor:pointer;font-family:inherit}input,select{font-family:inherit}::selection{background:hsla(var(--hue), 100%, 70%, .35)}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-thumb{background:var(--bg-4);border:2px solid var(--bg);border-radius:10px}.bg{z-index:-1;background:var(--bg);position:fixed;inset:0;overflow:hidden}.bg .orb{display:none}.bg .grid{opacity:.5;background:radial-gradient(1200px 500px at 50% -10%, hsla(var(--hue), 60%, 35%, .35) 0%, transparent 70%), repeating-linear-gradient(60deg, hsla(var(--hue), 20%, 100%, .012) 0 2px, transparent 2px 46px), repeating-linear-gradient(-60deg, hsla(var(--hue), 20%, 100%, .012) 0 2px, transparent 2px 46px), repeating-linear-gradient(0deg, hsla(var(--hue), 20%, 100%, .012) 0 2px, transparent 2px 46px);position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000 0% 50%,#0000 100%);mask-image:linear-gradient(#000 0% 50%,#0000 100%)}.app{max-width:1320px;margin:0 auto;padding:24px 20px 96px}.hero{background:var(--bg-2);isolation:isolate;align-items:flex-end;width:100%;min-height:clamp(360px,56vh,560px);display:flex;position:relative;overflow:hidden}.hero-bg{z-index:0;position:absolute;inset:0;overflow:hidden}.hero-slide{position:absolute;inset:0}.hero-slide img{object-fit:cover;will-change:transform;width:100%;height:100%;display:block}.hero-shade{pointer-events:none;background:linear-gradient(180deg, hsla(var(--hue), 10%, 10%, .25) 0%, hsla(var(--hue), 10%, 10%, .15) 35%, hsla(var(--hue), 10%, 10%, .75) 78%, var(--bg) 100%), linear-gradient(90deg, hsla(var(--hue), 10%, 10%, .55) 0%, transparent 45%);position:absolute;inset:0}.hero:after{content:"";z-index:2;background:linear-gradient(90deg, var(--pink), var(--pink-2) 40%, transparent);height:3px;position:absolute;bottom:0;left:0;right:0}.hero-inner{z-index:1;width:100%;max-width:1320px;margin:0 auto;padding:80px 20px 30px;position:relative}.hero h1{letter-spacing:-.03em;text-shadow:0 2px 24px #0009,0 1px 2px #0009;margin:0 0 16px;font-size:clamp(28px,4.6vw,54px);font-weight:800;line-height:1.05}.hero h1 .grad{color:var(--pink);display:block}.hero h1 .sub{color:#fff;margin-top:4px;font-size:.72em;display:block}.hero-credit{z-index:2;max-width:60%;color:var(--text-2);white-space:nowrap;text-overflow:ellipsis;background:hsla(var(--hue), 10%, 8%, .55);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid #ffffff1a;border-radius:999px;padding:6px 12px;font-size:11px;font-weight:700;text-decoration:none;transition:color .3s,border-color .3s;position:absolute;top:14px;right:16px;overflow:hidden}.hero-credit:hover{color:var(--pink);border-color:var(--pink)}.hero-dots{z-index:2;gap:6px;display:flex;position:absolute;bottom:16px;right:20px}.hero-dots button{background:#ffffff59;border:0;border-radius:50%;width:8px;height:8px;padding:0;transition:background .3s,transform .3s}.hero-dots button.on{background:var(--pink);transform:scale(1.3)}.stats{flex-wrap:wrap;gap:10px;display:flex;position:relative}.stat{background:hsla(var(--hue), 10%, 12%, .72);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);min-width:110px;transition:transform .4s var(--ease), background .3s, border-color .3s;border:1px solid #ffffff14;border-radius:8px;flex-direction:column;gap:2px;padding:10px 14px;display:flex}.stat:hover{background:hsla(var(--hue), 10%, 16%, .9);border-color:var(--line);transform:translateY(-3px)}.stat .n{letter-spacing:-.02em;font-size:24px;font-weight:800}.stat .l{color:var(--muted);letter-spacing:.06em;text-transform:uppercase;font-size:11px;font-weight:700}.stat.f .n{color:var(--pink)}.stat.m .n{color:var(--blue)}.stat.b .n{color:var(--green)}.filters{z-index:20;background:hsla(var(--hue), 10%, 15%, .92);border:1px solid var(--bg-4);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-radius:12px;flex-wrap:wrap;align-items:center;gap:10px 14px;margin:18px 0 16px;padding:12px 14px;display:flex;position:sticky;top:10px;box-shadow:0 10px 30px #00000059}.search{flex:260px;min-width:200px;position:relative}.search input{width:100%;color:var(--text);background:var(--bg);transition:border-color .3s var(--ease), background .3s;border:2px solid #0000;border-radius:999px;outline:none;padding:11px 14px 11px 40px;font-size:14px}.search input::placeholder{color:var(--muted)}.search input:focus{border-color:var(--pink);background:var(--bg-2)}.search svg{color:var(--muted);position:absolute;top:50%;left:14px;transform:translateY(-50%)}.seg{background:var(--bg);border-radius:999px;gap:2px;padding:3px;display:flex;position:relative}.seg button{z-index:1;color:var(--text-2);background:0 0;border:0;border-radius:999px;padding:7px 12px;font-size:12.5px;font-weight:700;transition:color .3s;position:relative}.seg button:hover{color:var(--text)}.seg button.on{color:var(--bg)}.seg .pill{background:var(--pink);border-radius:999px}.seg.gender .pill.F{background:var(--pink)}.seg.gender .pill.M{background:var(--blue)}.seg.gender .pill.B{background:var(--green)}.chips{align-items:center;gap:4px;display:flex}.chips .lbl{color:var(--muted);letter-spacing:.08em;text-transform:uppercase;margin-right:4px;font-size:10.5px;font-weight:800}.chip{background:var(--bg);color:var(--text-2);transition:all .3s var(--ease);border:1px solid #0000;border-radius:999px;padding:6px 10px;font-size:12px;font-weight:800}.chip:hover{color:var(--text);border-color:var(--line)}.chip.on{color:var(--bg);border-color:#0000}.chip.d1.on{background:#88b300}.chip.d2.on{background:#6cf}.chip.d3.on{background:#fc2}.chip.d4.on{background:#f6a}.chip.d5.on{background:#a8f}.select{color:var(--text);background:var(--bg) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23ff66aa' stroke-width='3'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center;appearance:none;cursor:pointer;border:2px solid #0000;border-radius:999px;outline:none;padding:9px 32px 9px 14px;font-size:12.5px;font-weight:700;transition:border-color .3s}.select:hover,.select:focus{border-color:var(--pink)}.select option{color:var(--text);background:var(--bg-2)}.select option:checked{color:var(--bg);background:var(--pink)}.reset{border:1px solid var(--line);color:var(--text-2);background:0 0;border-radius:999px;padding:8px 12px;font-size:12px;font-weight:700}.reset:hover{color:var(--pink);border-color:var(--pink)}.result-line{color:var(--muted);align-items:baseline;gap:10px;margin:0 4px 14px;font-size:13px;display:flex}.result-line b{color:var(--text);font-size:18px}.grid-wrap{perspective:1400px}.grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;display:grid}.card-wrap{transform-style:preserve-3d;will-change:transform;flex-direction:column;display:flex}.card-wrap>.card{flex:auto}.card{--mx:50%;--my:50%;--px:50%;--py:50%;--hover:0;--accent:#f6a;text-align:left;width:100%;color:var(--text);cursor:pointer;border-radius:var(--radius);border:1px solid hsla(var(--hue), 10%, 100%, .06);background:var(--bg-3);isolation:isolate;transform-style:preserve-3d;transition:box-shadow .45s var(--ease), border-color .45s var(--ease), background .45s;flex-direction:column;gap:10px;padding:12px;display:flex;position:relative;overflow:hidden;box-shadow:0 6px 20px #00000059}.card:hover,.card:focus-visible{border-color:hsla(var(--hue), 10%, 100%, .16);background:var(--bg-4);box-shadow:0 24px 50px #0000008c, 0 0 0 1px color-mix(in srgb, var(--accent) 35%, transparent), 0 0 50px -12px color-mix(in srgb, var(--accent) 60%, transparent);outline:none}.card .cover,.card .cover-shade,.card .holo,.card .glare,.card .sparkle{pointer-events:none;border-radius:inherit;position:absolute;inset:0}.card .cover{z-index:0;filter:blur(18px)saturate(1.3)brightness(.55);opacity:.55;background-position:50%;background-size:cover;transition:opacity .5s,filter .5s;transform:scale(1.2)}.card:hover .cover{opacity:.75;filter:blur(14px)saturate(1.5)brightness(.6)}.card .cover-shade{z-index:0;background:linear-gradient(180deg, hsla(var(--hue), 10%, 15%, .35) 0%, hsla(var(--hue), 10%, 15%, .82) 45%, hsla(var(--hue), 10%, 15%, .96) 100%)}.card .holo{z-index:1;background-image:linear-gradient(115deg,#0000 18%,#ff0084b3 34%,#ffd60099 42%,#0fa9 50%,#00c8ffb3 58%,#be50ffb3 66%,#0000 82%);background-size:250% 250%;background-position:var(--px) var(--py);mix-blend-mode:color-dodge;filter:brightness(.7)contrast(1.5)saturate(1.4);opacity:calc(var(--hover) * .55);transition:opacity .45s var(--ease)}.card .holo:after{content:"";border-radius:inherit;background:conic-gradient(from 0deg at var(--mx) var(--my), #ff5c7a, #ffb347, #fff176, #7ee8a2, #4dd0e1, #7c9cff, #c77dff, #ff5c7a);mix-blend-mode:color-dodge;filter:blur(14px)saturate(1.4)brightness(.55);-webkit-mask-image:radial-gradient(circle at var(--mx) var(--my), #000 0%, transparent 70%);mask-image:radial-gradient(circle at var(--mx) var(--my), #000 0%, transparent 70%);opacity:calc(var(--hover) * .5);transition:opacity .45s var(--ease);position:absolute;inset:0}.card .sparkle{z-index:1;background-image:repeating-radial-gradient(circle at 20% 30%,#fffffff2 0 .6px,#0000 1px 7px),repeating-radial-gradient(circle at 70% 60%,#ffffffd9 0 .6px,#0000 1px 9px);background-size:180px 180px,240px 240px;background-position:calc(var(--mx) * -.3) calc(var(--my) * -.3), calc(var(--mx) * .2) calc(var(--my) * .2);mix-blend-mode:screen;opacity:calc(var(--hover) * .4);-webkit-mask-image:radial-gradient(circle at var(--mx) var(--my), #000 0%, transparent 60%);mask-image:radial-gradient(circle at var(--mx) var(--my), #000 0%, transparent 60%);transition:opacity .45s var(--ease)}.card .glare{z-index:1;background:radial-gradient(circle at var(--mx) var(--my), #ffffff4d 0%, #ffffff0f 30%, transparent 60%);mix-blend-mode:soft-light;opacity:calc(var(--hover) * 1);transition:opacity .45s var(--ease)}.card>.content{z-index:2;flex-direction:column;gap:9px;height:100%;display:flex;position:relative;transform:translateZ(30px)}.card .top{justify-content:space-between;align-items:center;gap:8px;display:flex}.card .tj{letter-spacing:.02em;color:#fff;text-shadow:0 1px 3px #000000b3;font-family:ui-monospace,JetBrains Mono,Consolas,monospace;font-size:20px;font-weight:800}.card .tj small{color:var(--pink);letter-spacing:.14em;vertical-align:3px;margin-right:5px;font-size:10px;font-weight:800}.badge{letter-spacing:.04em;text-transform:uppercase;color:var(--bg);border-radius:999px;align-items:center;gap:4px;padding:4px 9px;font-size:10.5px;font-weight:800;display:inline-flex}.badge.F{background:var(--pink)}.badge.M{background:var(--blue)}.badge.B{background:var(--green)}.art{aspect-ratio:16/9;background:linear-gradient(135deg, color-mix(in srgb, var(--accent) 65%, #000) 0%, color-mix(in srgb, var(--accent) 25%, #000) 100%);border-radius:8px;width:100%;position:relative;overflow:hidden;box-shadow:0 6px 18px #0006}.art img{object-fit:cover;width:100%;height:100%;transition:transform .8s var(--ease);display:block;transform:scale(1.02)}.card:hover .art img{transform:scale(1.08)}.art-fallback{font-family:"Noto Sans JP", var(--font);color:#ffffffd9;text-shadow:0 4px 20px #0006;place-items:center;font-size:56px;font-weight:800;display:grid;position:absolute;inset:0}.art-shade{pointer-events:none;background:linear-gradient(#00000073 0%,#0000 35%,#0000008c 100%);position:absolute;inset:0}.art-top{z-index:2;justify-content:space-between;align-items:center;display:flex;position:absolute;top:8px;left:10px;right:10px}.play.on-art{position:absolute;bottom:12px;right:12px}.play:before{content:"";border-radius:50%;position:absolute;inset:-18px}.play-anchor .play:before{border-radius:40px;inset:-22px -22px -22px -34px}.play-anchor{aspect-ratio:16/9;z-index:5;pointer-events:none;position:absolute;top:12px;left:12px;right:12px;transform:translateZ(40px)}.play-anchor .play{pointer-events:auto}.card .title{letter-spacing:-.02em;color:#fff;margin:2px 0 0;font-size:18px;font-weight:800;line-height:1.25}.card .jp{font-family:"Noto Sans JP", var(--font);color:var(--text-2);margin:0;font-size:12.5px}.card .producer{color:var(--muted);margin:0;font-size:12px}.card .producer b{color:var(--pink);font-weight:700}.card .producer .year{color:var(--muted)}.vocals{flex-wrap:wrap;gap:6px;display:flex}.vocal{color:var(--text);background:hsla(var(--hue), 10%, 8%, .55);transition:transform .3s var(--ease), background .3s, border-color .3s;border:1px solid #ffffff14;border-radius:999px;align-items:center;gap:6px;padding:3px 7px 3px 3px;font-size:11.5px;font-weight:700;display:inline-flex}.vocal:hover{background:hsla(var(--hue), 10%, 8%, .85);border-color:var(--c);transform:translateY(-2px)}.avatar{background:var(--bg-2);border:1.5px solid var(--c,#fff);border-radius:50%;flex:none;display:inline-block;overflow:hidden;box-shadow:0 1px 4px #0006}.avatar img{object-fit:cover;width:100%;height:100%;display:block}.avatar-fallback{place-items:center;width:100%;height:100%;font-size:11px;font-weight:800;display:grid}.engine-logo{flex:none;align-items:center;gap:4px;display:inline-flex}.engine-img{width:var(--s);height:var(--s);border-radius:5px;place-items:center;padding:2px;display:grid;overflow:hidden;box-shadow:0 1px 3px #0000004d}.engine-img img{object-fit:contain;width:100%;height:100%;display:block}.engine-text{color:#fff;font-size:9px;font-weight:800}.engine-ver{color:var(--bg);background:var(--c);border-radius:4px;padding:1px 5px;font-size:10px;font-weight:900;line-height:1.3}.engine-ai{color:#fff;letter-spacing:.06em;background:#1b1b2a;border-radius:4px;padding:1px 5px;font-size:9px;font-weight:900;line-height:1.3}.engine-name{font-size:13px;font-weight:800}.meta{border-top:1px solid #ffffff14;grid-template-columns:1fr 1fr;gap:10px;margin-top:auto;padding-top:10px;display:grid}.meta .k{color:var(--muted);letter-spacing:.1em;text-transform:uppercase;margin-bottom:4px;font-size:10px;font-weight:800}.meta .v{color:var(--text);font-size:14px;font-weight:800}.meta .v.range{letter-spacing:.02em;font-family:ui-monospace,Consolas,monospace}.diff{align-items:center;gap:4px;display:flex}.diff i{width:14px;height:7px;transition:transform .4s var(--ease);background:#ffffff1f;border-radius:3px}.diff i.on{background:var(--dc);box-shadow:0 0 8px color-mix(in srgb, var(--dc) 60%, transparent)}.card:hover .diff i.on{transform:scaleY(1.4)}.diff span{color:var(--dc);margin-left:4px;font-size:12px;font-weight:800}.tags{flex-wrap:wrap;gap:5px;display:flex}.tag{background:hsla(var(--hue), 10%, 8%, .5);color:var(--text-2);border-radius:999px;padding:3px 8px;font-size:10.5px;font-weight:600}.empty{text-align:center;color:var(--muted);padding:80px 20px}.empty .big{margin-bottom:10px;font-size:48px}.play{background:hsla(var(--hue), 10%, 10%, .85);color:#fff;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:3;border:0;border-radius:50%;place-items:center;padding:0;transition:background .3s,color .3s,box-shadow .3s;display:grid;position:relative;box-shadow:0 6px 18px #00000080,inset 0 0 0 1px #ffffff26}.play:hover{background:hsla(var(--hue), 10%, 16%, .95)}.play .rings{width:100%;height:100%;position:absolute;inset:0}.play .rings circle{fill:none;stroke-width:3px}.play .rings .track{stroke:#ffffff24}.play .rings .ring{stroke:var(--accent,#f6a);stroke-linecap:round;filter:drop-shadow(0 0 5px var(--accent,#f6a))}.play .rings .spin{stroke:var(--accent,#f6a);stroke-dasharray:18 90;stroke-linecap:round;opacity:0;transform-origin:50%}.play.loading .rings .spin{opacity:1;animation:.9s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.play .icon{z-index:1;place-items:center;width:100%;height:100%;display:grid;position:relative}.play .icon svg{fill:currentColor;width:42%;height:42%}.play.playing{background:var(--pink);color:var(--bg);box-shadow:0 8px 24px hsla(var(--hue), 100%, 70%, .5)}.play.playing .rings .track{stroke:#0003}.play.playing .rings .ring{stroke:#fff;filter:drop-shadow(0 0 5px #fff)}.play.playing .icon svg{animation:1.6s ease-in-out infinite pulse-icon}@keyframes pulse-icon{0%,to{transform:scale(1)}50%{transform:scale(.88)}}.play.error{color:#ff6b8a;background:#3a1f28}.play.big .rings circle{stroke-width:2.6px}.backdrop{z-index:50;background:hsla(var(--hue), 10%, 5%, .7);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);place-items:center;padding:20px;display:grid;position:fixed;inset:0}.shake-layer{width:min(780px,100%)}.modal{width:100%;position:relative}.modal-origin{position:relative}.modal .card{cursor:default;border-radius:14px;flex-direction:column;max-height:80vh;padding:22px;display:flex}.modal .card>.content.modal-content{overscroll-behavior:contain;flex:auto;min-height:0;margin:0 -18px -22px;padding:0 18px 44px;overflow-y:auto;transform:none}.modal .card>.content.modal-content::-webkit-scrollbar{width:8px}.modal .card>.content.modal-content::-webkit-scrollbar-thumb{background:#ffffff26;border-radius:8px}.modal .card .holo,.modal .card .sparkle,.modal .card .glare{display:none}.modal .card .cover{opacity:.45}.modal .card .title{font-size:clamp(24px,3.6vw,34px)}.modal .tj{font-size:28px}.modal .close{z-index:5;background:hsla(var(--hue), 10%, 8%, .7);width:38px;height:38px;color:var(--text);transition:background .3s, transform .3s var(--ease), color .3s;border:0;border-radius:50%;place-items:center;display:grid;position:absolute;top:12px;right:12px;box-shadow:0 4px 14px #0000004d}.modal .close:hover{background:var(--pink);color:var(--bg);transform:rotate(90deg)scale(1.1)}.video-wrap{aspect-ratio:16/9;background:#000;border-radius:10px;flex:none;width:100%;margin-right:0;position:relative;overflow:hidden;box-shadow:0 10px 30px #00000080}.yt-host,.yt-host>div,.yt-host iframe{border:0;width:100%;height:100%;display:block;position:absolute;inset:0}.modal-caption-wrap{z-index:70;pointer-events:none;justify-content:center;padding:0 20px;display:flex;position:fixed;bottom:28px;left:0;right:0}.modal-caption{text-align:center;background:hsla(var(--hue), 10%, 6%, .86);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid hsla(var(--hue), 100%, 70%, .25);border-radius:14px;flex-direction:column;gap:4px;max-width:100%;padding:12px 22px;display:flex;box-shadow:0 12px 36px #0000008c}.modal-caption .vc-jp{font-family:"Noto Sans JP", var(--font);color:#fff;text-shadow:0 2px 10px #000c;font-size:22px;font-weight:800;line-height:1.35}.modal-caption .vc-ko{color:var(--pink);font-size:14px;font-weight:700}.video-poster{filter:brightness(.6);color:var(--text-2);background-position:50%;background-size:cover;place-items:center;font-size:13px;font-weight:700;display:grid;position:absolute;inset:0}.modal-title-row{grid-template-columns:84px 1fr;align-items:start;gap:14px;margin-top:12px;display:grid}.art-mini .art{aspect-ratio:1;border-radius:10px}.modal-title{flex-direction:column;gap:6px;min-width:0;display:flex}.modal-title .top{padding-right:44px}.modal-title .src{color:var(--muted);margin:0;font-size:11.5px;font-style:italic}.detail-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-top:10px;display:grid}.detail{background:hsla(var(--hue), 10%, 8%, .55);transition:transform .4s var(--ease), background .4s;border:1px solid #ffffff0f;border-radius:8px;padding:12px 14px}.detail:hover{background:hsla(var(--hue), 10%, 8%, .85);transform:translateY(-3px)}.detail .k{letter-spacing:.1em;color:var(--muted);text-transform:uppercase;margin-bottom:6px;font-size:10px;font-weight:800}.detail .v{color:var(--text);font-size:16px;font-weight:800}.detail .v.mono{font-family:ui-monospace,Consolas,monospace}.detail .v.small{color:var(--text-2);font-size:13px;font-weight:700}.lyrics{background:hsla(var(--hue), 10%, 8%, .6);border:1px solid #ffffff0f;border-radius:10px;margin-top:12px;padding:12px 14px 10px}.lyrics .section-k{margin:0}.ly-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px;display:flex}.ly-tools{align-items:center;gap:6px;display:flex}.ly-tools button{color:var(--text-2);background:0 0;border:1px solid #ffffff1f;border-radius:999px;padding:4px 8px;font-size:11px;font-weight:700}.ly-tools button:hover:not(:disabled){color:var(--pink);border-color:var(--pink)}.ly-tools button:disabled{opacity:.4;cursor:default}.ly-tools .ly-reset{color:var(--pink)}.ly-tools .ly-cal.on{background:var(--pink);color:var(--bg);border-color:var(--pink)}.lyrics.calibrating .ly-line{outline:1px dashed hsla(var(--hue), 100%, 70%, .35)}.ly-warn{color:#fc2;font-weight:700}.ly-offset{color:var(--muted);text-align:center;min-width:84px;font-family:ui-monospace,Consolas,monospace;font-size:11px}.ly-list{scroll-behavior:smooth;max-height:168px;padding:8px 6px;position:relative;overflow-y:auto;-webkit-mask-image:linear-gradient(#0000 0%,#000 22% 78%,#0000 100%);mask-image:linear-gradient(#0000 0%,#000 22% 78%,#0000 100%)}.ly-list::-webkit-scrollbar{width:6px}.ly-line{color:var(--muted);cursor:default;transform-origin:0;transition:color .35s var(--ease), transform .45s var(--ease), opacity .35s;border-radius:6px;flex-direction:column;gap:1px;margin:2px 0;padding:5px 8px;display:flex}.ly-jp{font-family:"Noto Sans JP", var(--font);font-size:14px;font-weight:600;line-height:1.45}.ly-ko{color:hsl(var(--hue), 10%, 48%);font-size:11.5px;font-weight:600;line-height:1.4}.lyrics.live .ly-line{cursor:pointer}.lyrics.live .ly-line:hover{color:var(--text-2);background:#ffffff0a}.ly-line.past{opacity:.5}.ly-line.on{color:#fff;opacity:1;transform:scale(1.08)}.ly-line.on .ly-jp{text-shadow:0 0 18px hsla(var(--hue), 100%, 70%, .55);font-size:15px;font-weight:800}.ly-line.on .ly-ko{color:var(--pink)}.ly-list{max-height:200px}.ly-src{color:var(--muted);margin-top:6px;font-size:10.5px}.empty-lyrics p{color:var(--muted);margin:6px 0 0;font-size:12.5px}.section-k{letter-spacing:.12em;color:var(--pink);text-transform:uppercase;margin:14px 0 6px;font-size:10px;font-weight:800}.vocal-detail{gap:8px;display:grid}.vocal-card{background:hsla(var(--hue), 10%, 8%, .55);transition:transform .4s var(--ease), background .4s, border-color .3s;border:1px solid #ffffff0f;border-radius:10px;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;padding:10px 14px;display:grid}.vocal-card:hover{background:hsla(var(--hue), 10%, 8%, .85);border-color:var(--c);transform:translateY(-3px)}.vc-name{color:var(--text);font-size:15px;font-weight:800}.vc-name small{font-family:"Noto Sans JP", var(--font);color:var(--muted);margin-left:6px;font-size:12px;font-weight:600}.vc-company{color:var(--muted);margin-top:2px;font-size:11.5px}.vc-engine{border-left:1px solid #ffffff1a;align-items:center;gap:10px;padding-left:14px;display:flex}.vc-engine-name{color:var(--text);align-items:center;gap:6px;font-size:13px;font-weight:800;display:flex}.vc-engine-desc{color:var(--muted);max-width:220px;margin-top:2px;font-size:11px}.ai-tag{background:var(--purple);color:var(--bg);letter-spacing:.08em;border-radius:999px;padding:2px 6px;font-size:9px}.actions{flex-wrap:wrap;gap:10px;margin-top:16px;display:flex}.btn{color:var(--bg);background:var(--pink);box-shadow:0 8px 24px hsla(var(--hue), 100%, 70%, .3);border:0;border-radius:999px;align-items:center;gap:8px;padding:11px 18px;font-size:14px;font-weight:800;text-decoration:none;display:inline-flex}.btn.ghost{background:hsla(var(--hue), 10%, 8%, .6);color:var(--text);box-shadow:none;border:1px solid #ffffff1f}.btn.ghost:hover{border-color:var(--pink);color:var(--pink)}.shards{pointer-events:none;position:absolute;inset:0}.shard{will-change:transform, opacity;position:absolute;inset:0}.shard .card{box-shadow:0 20px 40px #0009}.shockwave{pointer-events:none;z-index:7;border:2px solid hsla(var(--hue), 100%, 82%, .95);width:28px;height:28px;box-shadow:0 0 18px hsla(var(--hue), 100%, 70%, .7), inset 0 0 10px hsla(var(--hue), 100%, 70%, .4);border-radius:50%;margin:-14px 0 0 -14px;position:absolute}.debris{z-index:8;pointer-events:none;position:absolute}.debris i{background:linear-gradient(135deg, #fff, var(--pink));box-shadow:0 0 8px hsla(var(--hue), 100%, 70%, .8);border-radius:1px;margin:-4px 0 0 -4px;display:block;position:absolute}.debris i.tri{clip-path:polygon(50% 0,100% 100%,0 100%)}.toast{z-index:60;background:var(--pink);color:var(--bg);border-radius:999px;padding:11px 18px;font-size:13px;font-weight:800;position:fixed;bottom:28px;left:50%;box-shadow:0 12px 40px #00000080}.top-btn{z-index:40;background:hsla(var(--hue), 10%, 14%, .9);width:48px;height:48px;color:var(--pink);cursor:pointer;box-shadow:0 10px 30px #00000080, 0 0 0 1px hsla(var(--hue), 100%, 70%, .15);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid #ffffff24;border-radius:50%;place-items:center;transition:background .3s,color .3s,border-color .3s;display:grid;position:fixed;bottom:22px;right:22px}.top-btn:hover{background:var(--pink);color:var(--bg);border-color:var(--pink)}.footer{text-align:center;color:var(--muted);margin-top:56px;font-size:12px;line-height:1.8}@media (width<=640px){.app{padding:14px 12px 80px}.hero{min-height:240px}.hero-inner{padding:56px 14px 26px}.hero-credit{max-width:70%;font-size:10px}.filters{top:8px}.grid{grid-template-columns:1fr}.modal .card{padding:16px}.modal-title-row{grid-template-columns:64px 1fr}.vocal-card{grid-template-columns:auto 1fr}.vc-engine{border-top:1px solid #ffffff1a;border-left:0;grid-column:1/-1;padding-top:10px;padding-left:0}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}