: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%, 62%);--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:12px;--font:"Pretendard Variable", Pretendard, "Pretendard JP Variable", -apple-system, BlinkMacSystemFont, system-ui, "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;--font-jp:"Pretendard JP Variable", "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, sans-serif;--ease:cubic-bezier(.22, 1, .36, 1);--fs-1:16px;--fs-2:18px;--fs-3:20px;--fs-4:24px;--fs-5:30px;--gutter:32px}*{box-sizing:border-box}html,body{margin:0;padding:0}html{-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}body{font-family:var(--font);font-size:var(--fs-1);letter-spacing:-.01em;font-feature-settings:"ss06";background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;min-height:100vh;line-height:1.5;overflow-x:hidden}button{cursor:pointer;letter-spacing:inherit;font-family:inherit}input,select,textarea{letter-spacing:inherit;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;padding:24px var(--gutter) 112px;margin:0 auto}.hero{background:var(--bg-2);isolation:isolate;align-items:flex-end;width:100%;min-height:clamp(380px,58vh,580px);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;padding:96px var(--gutter) 40px;margin:0 auto;position:relative}.hero h1{letter-spacing:-.035em;text-shadow:0 2px 24px #0009,0 1px 2px #0009;margin:0 0 24px;font-size:clamp(40px,5.4vw,68px);font-weight:800;line-height:1.08}.hero h1 .grad{color:var(--pink);display:block}.hero h1 .sub{color:#fff;letter-spacing:-.025em;text-wrap:balance;margin-top:10px;font-size:.56em;font-weight:700;line-height:1.25;display:block}.hero-credit{right:var(--gutter);z-index:2;max-width:60%;font-size:var(--fs-1);letter-spacing:0;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 14px;font-weight:600;line-height:1.5;text-decoration:none;transition:color .3s,border-color .3s;position:absolute;top:20px;overflow:hidden}.hero-credit:hover{color:var(--pink);border-color:var(--pink)}.hero-dots{right:var(--gutter);z-index:2;gap:8px;display:flex;position:absolute;bottom: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:12px;display:flex;position:relative}.stat{background:hsla(var(--hue), 10%, 12%, .72);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);min-width:132px;transition:transform .4s var(--ease), background .3s, border-color .3s;border:1px solid #ffffff14;border-radius:12px;flex-direction:column;gap:4px;padding:14px 20px;display:flex}.stat:hover{background:hsla(var(--hue), 10%, 16%, .9);border-color:var(--line);transform:translateY(-3px)}.stat .n{font-size:var(--fs-5);letter-spacing:-.03em;font-variant-numeric:tabular-nums;font-weight:800;line-height:1.1}.stat .l{font-size:var(--fs-1);color:var(--text-2);letter-spacing:0;font-weight:600;line-height:1.4}.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%, 14%, .78);-webkit-backdrop-filter:blur(16px)saturate(1.4);backdrop-filter:blur(16px)saturate(1.4);border:1px solid #ffffff1a;border-radius:16px;flex-direction:column;gap:12px;margin:24px 0;padding:16px;display:flex;position:sticky;top:12px;box-shadow:0 12px 36px #00000073,inset 0 1px #ffffff0f}.f-row{align-items:center;gap:12px;min-width:0;display:flex}.f-main .select{flex:0 0 176px}.f-sub{flex-wrap:wrap;row-gap:12px}.f-divider{background:#ffffff1f;flex:none;width:1px;height:24px}.search{flex:auto;min-width:0;position:relative}.search input{width:100%;height:48px;font-size:var(--fs-1);color:var(--text);background:var(--bg);transition:border-color .3s var(--ease), background .3s;border:2px solid #0000;border-radius:999px;outline:none;padding:0 16px 0 46px}.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:16px;transform:translateY(-50%)}.seg{background:var(--bg);border-radius:999px;gap:2px;padding:4px;display:flex;position:relative}.seg button{z-index:1;min-height:40px;color:var(--text-2);font-size:var(--fs-1);white-space:nowrap;background:0 0;border:0;border-radius:999px;padding:0 16px;font-weight:700;line-height:1;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{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.chips .lbl{font-size:var(--fs-1);color:var(--muted);letter-spacing:0;margin-right:6px;font-weight:600}.chip{min-height:40px;font-size:var(--fs-1);white-space:nowrap;background:var(--bg);color:var(--text-2);transition:all .3s var(--ease);border:1px solid #0000;border-radius:999px;padding:0 16px;font-weight:700;line-height:1}.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{height:48px;font-size:var(--fs-1);color:var(--text);background:var(--bg) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' 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 16px center;appearance:none;cursor:pointer;border:2px solid #0000;border-radius:999px;outline:none;padding:0 44px 0 18px;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);min-height:44px;color:var(--text-2);font-size:var(--fs-1);white-space:nowrap;background:0 0;border-radius:999px;padding:0 18px;font-weight:700}.reset:hover{color:var(--pink);border-color:var(--pink)}.result-line{color:var(--text-2);font-size:var(--fs-1);flex-wrap:wrap;align-items:baseline;gap:4px 16px;margin:0 4px 20px;line-height:1.5;display:flex}.result-line .count{white-space:nowrap;color:var(--text);align-items:baseline;gap:4px;font-weight:700;display:inline-flex}.result-line b{color:var(--text);font-size:var(--fs-4);letter-spacing:-.02em;line-height:1.2}.result-line .hint{color:var(--muted)}.grid-wrap{perspective:1400px}.grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:24px;display:grid}.cell{flex-direction:column;display:flex;position:relative}.cell.is-hover{z-index:3}hover-tilt.card-tilt{border-radius:var(--radius);flex-direction:column;flex:auto;display:flex}hover-tilt.card-tilt::part(container){border-radius:inherit;perspective:900px;touch-action:pan-y;flex-direction:column;flex:auto;display:flex}hover-tilt.card-tilt::part(tilt){flex-direction:column;flex:auto;display:flex}hover-tilt.card-tilt>.card{flex:auto}.card{--tx:var(--hover-tilt-x,.5);--ty:var(--hover-tilt-y,.5);--mx:calc(var(--tx) * 100%);--my:calc(var(--ty) * 100%);--from-center:var(--hover-tilt-at-edge,0);--hover:var(--hover-tilt-opacity,0);--accent:#f6a;--sun-1:#ff7a75;--sun-2:#ffed61;--sun-3:#a8ff61;--sun-4:#85fff7;--sun-5:#7a95ff;--sun-6:#d875ff;text-align:left;width:100%;color:var(--text);cursor:pointer;--card-fill:var(--bg-3);border-radius:var(--radius);background:linear-gradient(var(--card-fill), var(--card-fill)) padding-box, linear-gradient(hsla(var(--hue), 10%, 25%, calc(1 - var(--hover))), hsla(var(--hue), 10%, 25%, calc(1 - var(--hover)))) border-box, var(--tx-glitter) center / 90px 90px border-box, repeating-linear-gradient(-30deg, var(--sun-1) 0%, var(--sun-2) 6%, var(--sun-3) 12%, var(--sun-4) 18%, var(--sun-5) 24%, var(--sun-6) 30%, var(--sun-1) 36%) calc(var(--tx) * 100%) calc(var(--ty) * 100%) / 300% 300% border-box, linear-gradient(115deg, #74747c 0%, #f4f4f8 16%, #9a9aa2 30%, #fff 46%, #85858d 60%, #e6e6ee 76%, #6a6a73 100%) calc(100% - var(--tx) * 100%) calc(100% - var(--ty) * 100%) / 300% 300% border-box;background-blend-mode:normal, normal, screen, soft-light, normal;isolation:isolate;transform-style:flat;transition:box-shadow .45s var(--ease);border:2px solid #0000;flex-direction:column;gap:12px;padding:12px;display:flex;position:relative;overflow:clip;box-shadow:0 6px 20px #00000059}.cell.is-hover .card,.card:focus-visible{--card-fill:var(--bg-4);box-shadow:0 24px 50px #0000008c, 0 0 18px -6px #ffffff59, 0 0 50px -12px color-mix(in srgb, var(--accent) 60%, transparent);outline:none}.card .cover,.card .cover-shade,.card .holo,.card .glare{pointer-events:none;border-radius:calc(var(--radius) - 2px);position:absolute;inset:0}.card{--tx-glitter:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' seed='7' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 14 -9.6'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}.card .holo,.card .glare{will-change:opacity, background-position}.card .holo{z-index:3;background-image:var(--tx-glitter), repeating-linear-gradient(-30deg, var(--sun-1) 0%, var(--sun-2) 6%, var(--sun-3) 12%, var(--sun-4) 18%, var(--sun-5) 24%, var(--sun-6) 30%, var(--sun-1) 36%);background-size:180px 180px,300% 300%;background-position:center, calc(var(--tx) * 100%) calc(var(--ty) * 100%);background-blend-mode:overlay;mix-blend-mode:color-dodge;filter:brightness(.75)contrast(1.45)saturate(1.1);opacity:calc(var(--hover) * (.45 + var(--from-center) * .4) * .5)}.card .holo:after{content:"";border-radius:inherit;background-image:radial-gradient(farthest-corner circle at var(--mx) var(--my), #ffffffb3 0%, #ffffff1a 35%, transparent 70%);mix-blend-mode:soft-light;position:absolute;inset:0}.card .glare{z-index:4;background-image:radial-gradient(farthest-corner circle at var(--mx) var(--my), #ffffffc7 8%, #ffffff47 30%, #00000073 95%);mix-blend-mode:overlay;filter:brightness(.85)contrast(1.4);opacity:calc(var(--hover) * .75)}.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)}.cell.is-hover .card .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>.content{flex-direction:column;gap:12px;height:100%;display:flex;position:relative}.card>.content>:not(.art):not(.top){margin-left:4px;margin-right:4px}.card>.content>*{z-index:5;position:relative}.card>.content>:not(.art){text-shadow:0 1px 2px #000000bf,0 0 10px #00000073}.card>.content>.meta{margin-bottom:4px}.card .top{justify-content:space-between;align-items:center;gap:8px;display:flex}.card .tj{font-family:var(--font);font-variant-numeric:tabular-nums;font-size:var(--fs-4);letter-spacing:0;color:#fff;text-shadow:0 1px 3px #000000b3;font-weight:800;line-height:1.2}.card .tj small{font-size:var(--fs-1);color:var(--pink);letter-spacing:.04em;vertical-align:2px;margin-right:6px;font-weight:800}.badge{min-height:30px;font-size:var(--fs-1);letter-spacing:0;color:var(--bg);border-radius:999px;align-items:center;gap:4px;padding:0 12px;font-weight:800;line-height:1;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%);width:100%;transition:box-shadow .45s var(--ease);border-radius:8px;position:relative;overflow:hidden;box-shadow:0 8px 22px #00000080}.cell.is-hover .art{box-shadow:none}.art:before{content:"";z-index:1;pointer-events:none;border-radius:inherit;background:var(--tx-glitter,none) center / 150px 150px, radial-gradient(farthest-corner circle at var(--mx,50%) var(--my,50%), #ffffff8c 0%, #ffffff14 35%, transparent 65%), repeating-linear-gradient(-30deg, var(--sun-1) 0%, var(--sun-2) 6%, var(--sun-3) 12%, var(--sun-4) 18%, var(--sun-5) 24%, var(--sun-6) 30%, var(--sun-1) 36%) calc(var(--tx,.5) * 100%) calc(var(--ty,.5) * 100%) / 300% 300%;background-blend-mode:overlay, overlay, normal;mix-blend-mode:color-dodge;filter:brightness(.7)contrast(1.4)saturate(1.1);opacity:calc(var(--hover,0) * (.3 + var(--from-center,0) * .25));position:absolute;inset:0}.art:after{content:"";z-index:3;pointer-events:none;border-radius:inherit;background:var(--holo-edge,#ffffff1a) calc(100% - var(--tx,.5) * 100%) calc(100% - var(--ty,.5) * 100%) / 300% 300%;-webkit-mask-composite:xor;padding:1px;position:absolute;inset:0;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor,source-over;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}.art img{object-fit:cover;width:100%;height:100%;transition:transform .8s var(--ease);display:block;transform:scale(1.02)}.cell.is-hover .art img{transform:scale(1.08)}.art-fallback{font-family:var(--font-jp);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(#00000080 0%,#0000 38%,#0000008c 100%);position:absolute;inset:0}.art-top{z-index:2;justify-content:space-between;align-items:center;display:flex;position:absolute;top:10px;left:12px;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{z-index:5;pointer-events:none;position:absolute;top:12px;left:12px;right:12px}.play-anchor-ratio{aspect-ratio:16/9;width:100%;position:relative}.play-anchor .play{pointer-events:auto}.play-anchor .play:before{inset:-26px -26px -26px -40px}.card .title{font-size:var(--fs-3);letter-spacing:-.02em;color:#fff;text-wrap:balance;margin:0;font-weight:800;line-height:1.3}.card .jp{font-family:var(--font-jp);font-size:var(--fs-1);color:var(--text-2);letter-spacing:0;margin:-8px 0 0;line-height:1.45}.card .producer{font-size:var(--fs-1);color:var(--muted);margin:-6px 0 0;line-height:1.45}.card .producer b{color:var(--pink);font-weight:700}.card .producer .year{color:var(--muted)}.vocals{--chip-h:36px;min-height:calc(var(--chip-h) * 2 + 8px);flex-wrap:wrap;align-content:flex-start;gap:8px;display:flex;position:relative}.vocals .vocal{height:var(--chip-h);white-space:nowrap;max-width:100%}.vocals .vocal .chip-t{text-overflow:ellipsis;min-width:0;overflow:hidden}.vocals .vocal-more{flex:none;justify-content:center;max-width:none;padding:0 14px}.vocals .vocal-more .chip-t{overflow:visible}.vocals .is-off,.vocals .vocal-probe{visibility:hidden;pointer-events:none;position:absolute;top:0;left:0}.vocal{font-size:var(--fs-1);color:var(--text);background:hsla(var(--hue), 10%, 8%, .55);border:1px solid #ffffff14;border-radius:999px;align-items:center;gap:8px;padding:3px 10px 3px 3px;font-weight:600;line-height:1.4;display:inline-flex}.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{width:100%;height:100%;font-size:var(--fs-1);place-items:center;font-weight:800;line-height:1;display:grid}.engine-logo{flex:none;align-items:center;gap:4px;display:inline-flex}.engine-img{min-width:var(--s);height:var(--s);border-radius:6px;place-items:center;padding:2px;display:grid;overflow:hidden;box-shadow:0 1px 3px #0000004d}.engine-img img{width:calc(var(--s) - 4px);object-fit:contain;height:100%;display:block}.engine-text{font-size:var(--fs-1);letter-spacing:0;color:#fff;padding:0 4px;font-weight:800;line-height:1}.engine-ver,.engine-ai{font-size:var(--fs-1);letter-spacing:0;border-radius:5px;padding:0 6px;font-weight:800;line-height:1.4}.engine-ver{color:var(--bg);background:var(--c)}.engine-ai{color:#fff;background:#1b1b2a}.engine-name{font-size:var(--fs-1);font-weight:800}.meta{border-top:1px solid #ffffff14;grid-template-columns:1fr 1fr;gap:12px 16px;margin-top:auto;padding-top:12px;display:grid}.meta .k{font-size:var(--fs-1);color:var(--muted);letter-spacing:0;margin-bottom:4px;font-weight:600;line-height:1.4}.meta .v{font-size:var(--fs-2);color:var(--text);font-weight:800;line-height:1.35}.meta .v.range{font-family:var(--font);font-variant-numeric:tabular-nums;letter-spacing:0}.diff{align-items:center;gap:4px;display:flex}.diff i{width:16px;height:8px;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)}.cell.is-hover .diff i.on{transform:scaleY(1.4)}.diff span{font-size:var(--fs-1);color:var(--dc);white-space:nowrap;margin-left:6px;font-weight:800;line-height:1.4}.tags{height:calc(var(--fs-1) * 1.4 + 6px);flex-wrap:wrap;gap:6px;display:flex;overflow:hidden}.tag{font-size:var(--fs-1);background:hsla(var(--hue), 10%, 8%, .5);color:var(--text-2);border-radius:999px;padding:2px 10px;font-weight:500;line-height:1.4}.card{--rb-soft:repeating-linear-gradient(-30deg, color-mix(in srgb, var(--sun-1) calc(var(--hover) * 30%), transparent) 0%, color-mix(in srgb, var(--sun-2) calc(var(--hover) * 30%), transparent) 8%, color-mix(in srgb, var(--sun-3) calc(var(--hover) * 30%), transparent) 16%, color-mix(in srgb, var(--sun-4) calc(var(--hover) * 30%), transparent) 24%, color-mix(in srgb, var(--sun-5) calc(var(--hover) * 30%), transparent) 32%, color-mix(in srgb, var(--sun-6) calc(var(--hover) * 30%), transparent) 40%, color-mix(in srgb, var(--sun-1) calc(var(--hover) * 30%), transparent) 48%);--holo-edge:linear-gradient(115deg, color-mix(in srgb, #fff calc(var(--hover) * 100%), var(--edge-base)) 0%, color-mix(in srgb, var(--sun-1) calc(var(--hover) * 100%), var(--edge-base)) 14%, color-mix(in srgb, var(--sun-2) calc(var(--hover) * 100%), var(--edge-base)) 28%, color-mix(in srgb, #fff calc(var(--hover) * 100%), var(--edge-base)) 40%, color-mix(in srgb, var(--sun-3) calc(var(--hover) * 100%), var(--edge-base)) 52%, color-mix(in srgb, var(--sun-4) calc(var(--hover) * 100%), var(--edge-base)) 64%, color-mix(in srgb, var(--sun-5) calc(var(--hover) * 100%), var(--edge-base)) 76%, color-mix(in srgb, var(--sun-6) calc(var(--hover) * 100%), var(--edge-base)) 88%, color-mix(in srgb, #fff calc(var(--hover) * 100%), var(--edge-base)) 100%);--silver-line:linear-gradient(90deg, color-mix(in srgb, #c9c9d2 calc(var(--hover) * 45%), var(--edge-base)) 0%, color-mix(in srgb, #fff calc(var(--hover) * 55%), var(--edge-base)) 20%, color-mix(in srgb, var(--sun-5) calc(var(--hover) * 50%), var(--edge-base)) 40%, color-mix(in srgb, #fff calc(var(--hover) * 55%), var(--edge-base)) 60%, color-mix(in srgb, var(--sun-1) calc(var(--hover) * 50%), var(--edge-base)) 80%, color-mix(in srgb, #c9c9d2 calc(var(--hover) * 45%), var(--edge-base)) 100%);--edge-base:#ffffff14;--silver-edge:linear-gradient(115deg, color-mix(in srgb, #8a8a94 calc(var(--hover) * 100%), var(--edge-base)) 0%, color-mix(in srgb, #fff calc(var(--hover) * 100%), var(--edge-base)) 18%, color-mix(in srgb, var(--sun-5) calc(var(--hover) * 100%), var(--edge-base)) 34%, color-mix(in srgb, #fff calc(var(--hover) * 100%), var(--edge-base)) 50%, color-mix(in srgb, var(--sun-1) calc(var(--hover) * 100%), var(--edge-base)) 66%, color-mix(in srgb, #c9c9d2 calc(var(--hover) * 100%), var(--edge-base)) 82%, color-mix(in srgb, #8a8a94 calc(var(--hover) * 100%), var(--edge-base)) 100%)}.card .title,.card .tj,.card .meta .v{--ink:#fff}.card .jp{--ink:var(--text-2)}.card .producer,.card .producer .year,.card .meta .k{--ink:var(--muted)}.card .producer b{--ink:var(--pink)}.card .diff span{--ink:var(--dc)}.card .vocal .chip-t{--ink:var(--text)}.card .tag .chip-t{--ink:var(--text-2)}.card :is(.title,.tj,.meta .v,.jp,.producer,.producer b,.producer .year,.meta .k,.diff span,.chip-t){--foil-w:calc(1 - var(--hover));color:color-mix(in srgb, var(--ink) calc(var(--foil-w) * 100%), transparent);background-image:repeating-linear-gradient(-30deg, var(--sun-1) 0%, var(--sun-2) 8%, var(--sun-3) 16%, var(--sun-4) 24%, var(--sun-5) 32%, var(--sun-6) 40%, var(--sun-1) 48%), linear-gradient(115deg, color-mix(in srgb, var(--ink), #6e6e78 35%) 0%, color-mix(in srgb, var(--ink), #fff var(--foil-hi,65%)) 22%, color-mix(in srgb, var(--ink), #6e6e78 25%) 40%, color-mix(in srgb, var(--ink), #fff var(--foil-hi,65%)) 58%, color-mix(in srgb, var(--ink), #6e6e78 35%) 78%, color-mix(in srgb, var(--ink), #fff calc(var(--foil-hi,65%) * .77)) 100%);background-size:300% 300%,260% 260%;background-position:calc(var(--tx) * 100%) calc(var(--ty) * 100%), calc(100% - var(--tx) * 100%) calc(100% - var(--ty) * 100%);background-blend-mode:soft-light, normal;text-shadow:0 1px 2px rgba(0, 0, 0, calc(.75 * var(--foil-w))), 0 0 10px rgba(0, 0, 0, calc(.45 * var(--foil-w)));filter:drop-shadow(0 1px 1.5px rgba(0, 0, 0, calc(.85 * var(--hover))));-webkit-background-clip:text;background-clip:text}.card .producer :is(b,.year){filter:none;text-shadow:none}.card :is(.title,.jp,.producer){white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.card .tj small{-webkit-text-fill-color:var(--pink)}.card :is(.vocal,.tag){background:var(--rb-soft) calc(var(--tx) * 100%) calc(var(--ty) * 100%) / 300% 300% padding-box, linear-gradient(hsla(var(--hue), 10%, 8%, .6), hsla(var(--hue), 10%, 8%, .6)) padding-box, var(--holo-edge) calc(100% - var(--tx) * 100%) calc(100% - var(--ty) * 100%) / 300% 300% border-box;border:1px solid #0000}.card .meta{border-top:1px solid #0000;border-image:var(--silver-line) 1}.card .badge.F{--badge:var(--pink)}.card .badge.M{--badge:var(--blue)}.card .badge.B{--badge:var(--green)}.card .badge{background:linear-gradient(115deg, transparent 32%, hsla(0, 0%, 100%, calc(var(--hover) * .6)) 50%, transparent 68%) calc(100% - var(--tx) * 100%) 50% / 250% 100% padding-box, var(--rb-soft) calc(var(--tx) * 100%) calc(var(--ty) * 100%) / 300% 300% padding-box, linear-gradient(var(--badge), var(--badge)) padding-box, linear-gradient(115deg, color-mix(in srgb, #fff calc(var(--hover) * 100%), var(--badge)) 0%, color-mix(in srgb, var(--sun-1) calc(var(--hover) * 100%), var(--badge)) 18%, color-mix(in srgb, var(--sun-2) calc(var(--hover) * 100%), var(--badge)) 34%, color-mix(in srgb, #fff calc(var(--hover) * 100%), var(--badge)) 50%, color-mix(in srgb, var(--sun-4) calc(var(--hover) * 100%), var(--badge)) 66%, color-mix(in srgb, var(--sun-6) calc(var(--hover) * 100%), var(--badge)) 82%, color-mix(in srgb, #fff calc(var(--hover) * 100%), var(--badge)) 100%) calc(100% - var(--tx) * 100%) calc(100% - var(--ty) * 100%) / 300% 300% border-box;border:1px solid #0000}.card .badge .chip-t{--ink:var(--bg);--foil-hi:28%;text-shadow:none;filter:none}.empty{text-align:center;color:var(--text-2);font-size:var(--fs-2);padding:96px 24px;line-height:1.6}.empty .big{margin-bottom:16px;font-size:56px;line-height:1}.play{z-index:3;color:#fff;background:0 0;border:0;border-radius:50%;padding:0;display:block;position:relative}.play-inner{background:hsla(var(--hue), 10%, 10%, .85);color:#fff;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:50%;place-items:center;transition:transform .42s cubic-bezier(.34,1.56,.64,1),background .3s,color .3s,box-shadow .3s;display:grid;position:absolute;inset:0;box-shadow:0 6px 18px #00000080,inset 0 0 0 1px #ffffff26}.play:hover .play-inner{background:hsla(var(--hue), 10%, 16%, .95);transform:scale(1.18)}.play:active .play-inner{transition-duration:.12s;transform:scale(.92)}.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 .play-inner{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 .play-inner{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:24px;display:grid;position:fixed;inset:0}.shake-layer{width:min(800px,100%)}.modal{width:100%;position:relative}.modal-origin{position:relative}.modal .card{--mpad:28px;cursor:default;padding:var(--mpad);border-radius:16px;flex-direction:column;max-height:84dvh;display:flex}.modal .card>.content.modal-content{overscroll-behavior:contain;min-height:0;margin:0 calc(var(--mpad) * -1 + 4px) calc(var(--mpad) * -1);padding:0 calc(var(--mpad) - 4px) calc(var(--mpad) * 2);flex:auto;gap:0;overflow-y:auto;transform:none}.modal .card>.content.modal-content>*{margin-left:0;margin-right:0}.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 .glare{display:none}.modal .card .cover{opacity:.45}.modal .card .title{letter-spacing:-.03em;font-size:clamp(26px,3.6vw,36px);line-height:1.2}.modal .card .jp{font-size:var(--fs-2);margin:0}.modal .card .producer{margin:0}.modal .tj{font-size:var(--fs-5)}.modal .close{z-index:5;background:hsla(var(--hue), 10%, 8%, .7);width:44px;height:44px;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:16px;right:16px;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:12px;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 24px;display:flex;position:fixed;bottom:32px;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:16px;flex-direction:column;gap:4px;max-width:min(100%,760px);padding:14px 24px;display:flex;box-shadow:0 12px 36px #0000008c}.modal-caption .vc-jp{font-family:var(--font-jp);font-size:var(--fs-4);color:#fff;text-shadow:0 2px 10px #000c;letter-spacing:0;font-weight:800;line-height:1.35}.modal-caption .vc-ko{font-size:var(--fs-1);color:var(--pink);font-weight:700;line-height:1.45}.video-poster{filter:brightness(.6);color:var(--text-2);font-size:var(--fs-1);background-position:50%;background-size:cover;place-items:center;font-weight:700;display:grid;position:absolute;inset:0}.modal-title-row{grid-template-columns:104px 1fr;align-items:start;gap:20px;margin-top:20px;display:grid}.art-mini .art{aspect-ratio:1;border-radius:12px}.modal-title{flex-direction:column;gap:6px;min-width:0;display:flex}.modal-title .top{flex-wrap:wrap;gap:8px 12px;padding-right:56px}.modal-title .top .share-btn{margin-left:auto}.modal-title .src{font-size:var(--fs-1);color:var(--muted);margin:4px 0 0;font-style:italic;line-height:1.5}.detail-grid{grid-template-columns:repeat(auto-fit,minmax(176px,1fr));gap:12px;margin-top:24px;display:grid}.detail{background:hsla(var(--hue), 10%, 8%, .55);transition:transform .4s var(--ease), background .4s;border:1px solid #ffffff0f;border-radius:12px;padding:16px 18px}.detail:hover{background:hsla(var(--hue), 10%, 8%, .85);transform:translateY(-3px)}.detail .k{font-size:var(--fs-1);letter-spacing:0;color:var(--muted);margin-bottom:6px;font-weight:600;line-height:1.4}.detail .v{font-size:var(--fs-3);color:var(--text);font-weight:800;line-height:1.3}.detail .v.mono{font-family:var(--font);font-variant-numeric:tabular-nums;letter-spacing:0}.detail .v.small{font-size:var(--fs-1);color:var(--text-2);font-weight:600;line-height:1.55}.lyrics{background:hsla(var(--hue), 10%, 8%, .6);border:1px solid #ffffff0f;border-radius:12px;margin-top:24px;padding:20px 20px 16px}.lyrics .section-k{margin:0}.ly-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 12px;margin-bottom:12px;display:flex}.ly-head .section-k{line-height:1.5}.ly-tools{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:8px;display:flex}.ly-tools button{min-height:36px;color:var(--text-2);font-size:var(--fs-1);white-space:nowrap;background:0 0;border:1px solid #ffffff24;border-radius:999px;padding:0 14px;font-weight:700;line-height:1}.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;text-transform:none;letter-spacing:0;font-weight:700}.ly-offset{font-size:var(--fs-1);color:var(--muted);font-family:var(--font);font-variant-numeric:tabular-nums;text-align:center;white-space:nowrap;min-width:96px}.ly-list{scroll-behavior:smooth;max-height:260px;padding:12px 4px;position:relative;overflow:hidden auto;-webkit-mask-image:linear-gradient(#0000 0%,#000 18% 82%,#0000 100%);mask-image:linear-gradient(#0000 0%,#000 18% 82%,#0000 100%)}.ly-list::-webkit-scrollbar{width:6px}.ly-line{min-width:0;max-width:100%;color:var(--muted);cursor:default;transform-origin:0;transition:color .35s var(--ease), transform .45s var(--ease), opacity .35s;border-radius:8px;flex-direction:column;gap:2px;margin:2px 0;padding:8px 12px;display:flex}.ly-jp{font-family:var(--font-jp);font-size:var(--fs-2);letter-spacing:0;transition:font-size .3s var(--ease);font-weight:600;line-height:1.5}.ly-jp,.ly-ko,.modal-caption .vc-jp,.modal-caption .vc-ko{white-space:normal;overflow-wrap:anywhere;word-break:normal;line-break:strict}.ly-ko{font-size:var(--fs-1);color:hsl(var(--hue), 10%, 52%);font-weight:500;line-height:1.45}.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}.ly-line.on .ly-jp{font-weight:800;font-size:var(--fs-3);text-shadow:0 0 18px hsla(var(--hue), 100%, 70%, .55)}.ly-line.on .ly-ko{color:var(--pink);font-weight:600}.ly-src{font-size:var(--fs-1);color:var(--muted);margin-top:12px;line-height:1.5}.empty-lyrics p{font-size:var(--fs-1);color:var(--text-2);margin:8px 0 0;line-height:1.55}.section-k{font-size:var(--fs-1);letter-spacing:.02em;color:var(--pink);margin:32px 0 12px;font-weight:800;line-height:1.5}.vocal-detail{gap:12px;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:12px;grid-template-columns:auto 1fr auto;align-items:center;gap:16px;padding:16px 18px;display:grid}.vocal-card:hover{background:hsla(var(--hue), 10%, 8%, .85);border-color:var(--c);transform:translateY(-3px)}.vc-name{font-size:var(--fs-2);color:var(--text);font-weight:800;line-height:1.35}.vc-name small{font-family:var(--font-jp);color:var(--muted);font-weight:600;font-size:var(--fs-1);letter-spacing:0;margin-left:8px}.vc-company{font-size:var(--fs-1);color:var(--muted);margin-top:2px;line-height:1.45}.vc-engine{border-left:1px solid #ffffff1a;align-items:center;gap:12px;padding-left:16px;display:flex}.vc-engine-name{font-size:var(--fs-1);color:var(--text);align-items:center;gap:8px;font-weight:800;line-height:1.4;display:flex}.vc-engine-desc{font-size:var(--fs-1);color:var(--muted);max-width:260px;margin-top:2px;line-height:1.5}.ai-tag{font-size:var(--fs-1);background:var(--purple);color:var(--bg);letter-spacing:.02em;border-radius:999px;padding:0 8px;line-height:1.4}.actions{flex-wrap:wrap;gap:12px;margin-top:32px;display:flex}.btn{min-height:48px;font-size:var(--fs-1);letter-spacing:-.01em;white-space:nowrap;color:var(--bg);background:var(--pink);box-shadow:0 8px 24px hsla(var(--hue), 100%, 70%, .3);border:0;border-radius:999px;justify-content:center;align-items:center;gap:8px;padding:0 22px;font-weight:800;line-height:1;text-decoration:none;display:inline-flex}.btn.ghost{background:hsla(var(--hue), 10%, 8%, .6);color:var(--text);box-shadow:none;border:1px solid #ffffff24}.btn.ghost:hover{border-color:var(--pink);color:var(--pink)}.report-btn{margin-left:auto}.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:90;max-width:calc(100vw - 48px);font-size:var(--fs-2);letter-spacing:-.015em;color:#fff;-webkit-backdrop-filter:blur(14px)saturate(1.3);background:#0a0809b8;border:1px solid #ffffff24;border-radius:999px;padding:14px 26px;font-weight:800;line-height:1.4;position:fixed;top:24px;right:24px;box-shadow:0 16px 44px #0000008c}.icon-btn{background:hsla(var(--hue), 10%, 8%, .6);width:40px;height:40px;color:var(--text);cursor:pointer;border:1px solid #ffffff24;border-radius:50%;flex:none;place-items:center;padding:0;transition:background .25s,color .25s,border-color .25s;display:inline-grid}.icon-btn:hover{background:var(--pink);color:var(--bg);border-color:var(--pink)}.top-btn{z-index:40;background:hsla(var(--hue), 10%, 14%, .9);width:52px;height:52px;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:24px;right:24px}.top-btn:hover{background:var(--pink);color:var(--bg);border-color:var(--pink)}.footer{text-align:center;color:var(--muted);font-size:var(--fs-1);text-wrap:balance;margin-top:80px;padding:0 8px;line-height:1.75}.badge,.tj{white-space:nowrap}.report-backdrop{z-index:80;background:hsla(var(--hue), 10%, 4%, .6);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);place-items:center;padding:24px;display:grid;position:fixed;inset:0}.report-dialog{overscroll-behavior:contain;background:var(--bg-2);width:min(540px,100%);max-height:calc(100dvh - 48px);color:var(--text);border:1px solid hsla(var(--hue), 100%, 70%, .25);border-radius:20px;padding:28px;overflow-y:auto;box-shadow:0 24px 70px #0009}.rd-head{justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:24px;display:flex}.rd-eyebrow{font-size:var(--fs-1);letter-spacing:.02em;color:var(--pink);font-weight:800;line-height:1.4}.rd-title{font-size:var(--fs-4);letter-spacing:-.025em;margin:4px 0 0;font-weight:800;line-height:1.3}.rd-types{border:0;flex-wrap:wrap;gap:8px;margin:0 0 24px;padding:0;display:flex}.rd-types legend{font-size:var(--fs-2);margin-bottom:12px;padding:0;font-weight:800;line-height:1.4}.rd-types legend small,.rd-field small{font-size:var(--fs-1);color:var(--muted);margin-left:4px;font-weight:500}.rd-chip{cursor:pointer;position:relative}.rd-chip input{opacity:0;pointer-events:none;position:absolute}.rd-chip span{min-height:44px;font-size:var(--fs-1);background:var(--bg);color:var(--text-2);transition:border-color .2s var(--ease), color .2s var(--ease), box-shadow .2s var(--ease);border:1.5px solid #ffffff1f;border-radius:999px;align-items:center;gap:6px;padding:0 16px;font-weight:700;line-height:1;display:inline-flex}.rd-chip:hover span{border-color:var(--bg-5);color:var(--text)}.rd-chip.on span,.rd-chip.on:hover span{border-color:var(--pink);color:var(--pink);box-shadow:0 0 0 3px hsla(var(--hue), 100%, 70%, .12)}.rd-chip input:focus-visible+span{outline:2px solid var(--pink);outline-offset:3px}.rd-field{font-size:var(--fs-2);flex-direction:column;gap:8px;margin-bottom:20px;font-weight:800;line-height:1.4;display:flex;position:relative}.rd-field textarea,.rd-field input{resize:vertical;background:var(--bg);width:100%;color:var(--text);font:inherit;font-size:var(--fs-1);letter-spacing:-.01em;border:2px solid #0000;border-radius:12px;outline:none;padding:12px 16px;font-weight:500;line-height:1.6;transition:border-color .2s}.rd-field input{height:48px;padding-top:0;padding-bottom:0}.rd-field textarea:focus,.rd-field input:focus{border-color:var(--pink)}.rd-field textarea::placeholder,.rd-field input::placeholder{color:var(--muted)}.rd-count{font-style:normal;font-size:var(--fs-1);color:var(--muted);font-variant-numeric:tabular-nums;pointer-events:none;align-self:flex-end;margin-top:-2px;font-weight:500;line-height:1.4}.rd-hp{opacity:0;width:1px;height:1px;position:absolute;left:-9999px}.rd-note{font-size:var(--fs-1);color:var(--text-2);margin:0 0 20px;line-height:1.6}.rd-error{color:#ff9ab8;font-size:var(--fs-1);background:#3a1f28;border-radius:12px;margin-bottom:20px;padding:12px 16px;font-weight:600;line-height:1.55}.rd-error a{color:#fff;margin-left:4px;font-weight:800;text-decoration:none}.rd-actions{justify-content:flex-end;gap:12px;display:flex}.rd-actions .btn[disabled]{opacity:.6;cursor:progress}@media (width<=1024px){:root{--gutter:24px}.grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}.hero-inner{padding-top:88px;padding-bottom:36px}}@media (width<=768px){.filters{position:relative;top:auto}.f-main{flex-wrap:wrap}.f-main .search{flex:100%}.f-main .select{flex:1 1 0;min-width:0}.backdrop{padding:16px}.modal .card{--mpad:24px;max-height:88dvh}.modal-title-row{grid-template-columns:88px 1fr;gap:16px}.vocal-card{grid-template-columns:auto 1fr}.vc-engine{border-top:1px solid #ffffff1a;border-left:0;grid-column:1/-1;padding-top:12px;padding-left:0}.vc-engine-desc{max-width:none}}@media (width<=640px){:root{--gutter:16px;--fs-4:22px;--fs-5:26px}.app{padding-top:16px;padding-bottom:96px}.hero{min-height:340px}.hero-inner{padding-top:72px;padding-bottom:28px}.hero h1{margin-bottom:20px}.hero-credit{max-width:calc(100% - 32px);padding:4px 12px;top:12px}.hero-dots{bottom:14px}.stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.stat{min-width:0;padding:12px 16px}.filters{border-radius:14px;gap:12px;margin:16px 0 20px;padding:12px}.seg{width:100%}.seg button{flex:1 1 0;padding:0 8px}.chips{gap:8px 6px;width:100%}.chips .lbl{flex:100%;margin:0 0 -2px 4px}.chips .chip{flex:1 1 0;min-width:0;padding:0 4px}.f-divider{display:none}.reset{flex:100%}.grid{grid-template-columns:1fr;gap:16px}.result-line{margin-bottom:16px}.backdrop{padding:12px}.modal .card{--mpad:20px;border-radius:14px;max-height:92dvh}.modal .close{top:12px;right:12px}.modal-title-row{grid-template-columns:72px 1fr;gap:14px;margin-top:16px}.modal-title .top{padding-right:0}.detail-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:20px}.detail{padding:14px}.detail.span-2,.detail:nth-child(3),.detail:nth-child(6){grid-column:1/-1}.lyrics{margin-top:20px;padding:16px 12px 12px}.ly-head{flex-direction:column;align-items:flex-start}.ly-tools{justify-content:flex-start}.ly-list{max-height:240px}.ly-line{padding:8px 10px}.section-k{margin-top:28px}.vocal-card{gap:12px;padding:14px}.actions{gap:8px;margin-top:28px}.actions .btn{flex:100%;padding:0 16px}.report-btn{margin-left:0}.modal-caption-wrap{padding:0 12px;bottom:16px}.modal-caption{padding:12px 18px}.modal-caption .vc-jp{font-size:var(--fs-3)}.toast{max-width:calc(100vw - 24px);font-size:var(--fs-1);padding:12px 20px;top:12px;right:12px}.top-btn{width:48px;height:48px;bottom:16px;right:16px}.report-backdrop{align-items:end;padding:12px}.report-dialog{border-radius:20px;max-height:calc(100dvh - 24px);padding:20px}.rd-head{margin-bottom:20px}.rd-actions .btn{flex:1 1 0}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}