.page{align-content:start;gap:14px;max-width:62ch;padding:clamp(20px,3.4vw,40px) 0 0;display:grid}.page h1{letter-spacing:-.035em;font-size:clamp(24px,3.4vw,32px);font-weight:600}.page h2{letter-spacing:-.01em;margin-top:8px;font-size:15px;font-weight:600}.page p,.page li{color:var(--muted);font-size:14px;line-height:1.6}.page ul{gap:8px;padding-left:18px;display:grid}.page a{color:var(--accent)}.page a:hover{text-decoration:underline}:root{--font:"Space Grotesk", "Noto Sans KR", "Malgun Gothic", system-ui, -apple-system, sans-serif;--mono:"DM Mono", "Consolas", monospace;--r-lg:16px;--r-card:12px;--r-md:10px;--max:880px;--pad:clamp(18px, 4vw, 28px);--gap-x:clamp(14px, 2.2vw, 22px);--gap-y:clamp(14px, 2.2vw, 22px);--cols:2;--card-aspect:16/9}:root[data-theme=d1]{--paper:#101114;--surface:#16181d;--surface-2:#1d2026;--ink:#f1f2f4;--muted:#888b95;--line:#292b31;--accent-mono:#f1f2f4;--on-accent-mono:#101114;--glow:#f1f2f412}:root[data-theme=d2]{--paper:#0e1116;--surface:#151a21;--surface-2:#1c222b;--ink:#e6e9ef;--muted:#8a93a0;--line:#232a33;--accent-mono:#e6e9ef;--on-accent-mono:#0e1116;--glow:#e6e9ef12}:root[data-theme=l1]{--paper:#fff;--surface:#f6f6f7;--surface-2:#efeff1;--ink:#0b0d12;--muted:#6b7280;--line:#e5e7eb;--accent-mono:#111;--on-accent-mono:#fff;--glow:#0b0d120d}:root[data-theme=l2]{--paper:#fbf7f2;--surface:#f3ece3;--surface-2:#ebe2d6;--ink:#1a1a1a;--muted:#7a6f63;--line:#e7ded2;--accent-mono:#1a1a1a;--on-accent-mono:#fff;--glow:#7a6f6317}:root[data-theme=l3]{--paper:#f5f6f8;--surface:#eceef1;--surface-2:#e3e6ea;--ink:#14161a;--muted:#6b7280;--line:#e1e4e8;--accent-mono:#14161a;--on-accent-mono:#fff;--glow:#14161a0d}:root[data-theme=d3]{--paper:#131211;--surface:#1a1817;--surface-2:#221f1d;--ink:#f2efec;--muted:#948d88;--line:#2c2825;--accent-mono:#f2efec;--on-accent-mono:#131211;--glow:#f2efec12}:root[data-accent=lime]{--accent:#c5f36b;--on-accent:#171a13;--accent-soft:#c5f36b29}:root[data-accent=cyan]{--accent:#4cc9f0;--on-accent:#06232e;--accent-soft:#4cc9f029}:root[data-accent=coral]{--accent:#ff5c39;--on-accent:#fff;--accent-soft:#ff5c3924}:root[data-accent=indigo]{--accent:#4f46e5;--on-accent:#fff;--accent-soft:#4f46e526}:root[data-accent=orange]{--accent:#ff8a3d;--on-accent:#22130a;--accent-soft:#ff8a3d29}:root[data-accent=mono]{--accent:var(--accent-mono);--on-accent:var(--on-accent-mono);--accent-soft:var(--glow)}:root[data-card=l9]{--card-aspect:16/9}:root[data-card=p5]{--card-aspect:4/5}:root[data-cols="2"]{--cols:2}:root[data-cols="3"]{--cols:3}:root[data-cols="4"]{--cols:4}:root[data-cols="5"]{--cols:5}:root[data-rank=none] .hero-rank{display:none}@media (width<=900px){:root[data-cols="5"]{--cols:4}:root[data-cols="4"]{--cols:3}}@media (width<=768px){:root[data-cols="4"],:root[data-cols="5"]{--cols:3}}@media (width<=560px){:root[data-cols]{--cols:2}:root{--gap-x:14px;--gap-y:18px}}*{box-sizing:border-box;margin:0}html{scroll-behavior:smooth;min-width:320px}body{min-width:320px;min-height:100vh;font-family:var(--font);color:var(--ink);-webkit-font-smoothing:antialiased;background:var(--paper);font-size:14px;line-height:1.5;transition:background-color .25s,color .25s}img{object-fit:cover;width:100%;height:100%;display:block}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0}:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.wrap{width:min(var(--max), calc(100% - var(--pad) * 2));margin:0 auto}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;padding:0;position:absolute;overflow:hidden}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}:root[data-head=logo] .search{display:none}.header{z-index:30;background:var(--paper);border-bottom:1px solid var(--line);position:sticky;top:0}.header .wrap{align-items:center;gap:clamp(14px,2.6vw,28px);height:64px;display:flex}.brand{letter-spacing:-.035em;white-space:nowrap;align-items:center;gap:8px;margin-right:auto;font-size:15.5px;font-weight:600;display:inline-flex}.brand-mark{width:26px;height:26px}.brand em{color:var(--accent);font-style:normal}.theme-toggle{background:var(--surface);border:1px solid var(--line);width:36px;height:36px;color:var(--muted);border-radius:50%;place-items:center;transition:color .15s,border-color .15s,background-color .15s;display:grid}.theme-toggle:hover{color:var(--ink);border-color:var(--muted)}.theme-icon{width:16px;height:16px;display:block}.theme-icon-sun{display:none}:root[data-theme^=d] .theme-icon-sun{display:block}:root[data-theme^=d] .theme-icon-moon{display:none}.search{background:var(--surface);color:var(--muted);border:1px solid #0000;border-radius:999px;flex:0 240px;align-items:center;gap:8px;padding:9px 14px;transition:border-color .18s;display:flex}.search:focus-within{border-color:var(--line)}.search svg{flex:none}.search input{min-width:0;color:var(--ink);font:inherit;background:0 0;border:0;outline:none;flex:1;font-size:13px}.search input::placeholder{color:var(--muted)}.footer{border-top:1px solid var(--line);color:var(--muted);margin-top:clamp(48px,7vw,84px);padding:24px 0 40px;font-size:12.5px}.footer .wrap{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px 24px;display:flex}.footer-links{gap:18px;display:flex}.footer a{transition:color .15s}.footer a:hover{color:var(--ink)}@media (width<=768px){.search{flex:auto;max-width:190px}}@media (width<=560px){.header .wrap{height:56px}.brand-mark{width:24px;height:24px}.theme-toggle{width:32px;height:32px}}.rotate-notice{z-index:40;top:0;height:calc(30px + env(safe-area-inset-top));padding-top:env(safe-area-inset-top);padding-inline:max(16px, env(safe-area-inset-left)) max(16px, env(safe-area-inset-right));background:var(--accent);color:var(--on-accent);font-family:var(--mono);letter-spacing:.08em;text-transform:uppercase;text-align:center;justify-content:center;align-items:center;gap:7px;font-size:10px;display:flex;position:fixed;inset-inline:0}.rotate-notice p{margin:0}.rotate-notice-icon{flex:none}:root[data-device=mobile][data-orientation=landscape] body{padding-top:calc(30px + env(safe-area-inset-top))}:root[data-device=mobile][data-orientation=landscape] .header{top:calc(30px + env(safe-area-inset-top))}.hero{padding:clamp(18px,3vw,32px) 0 clamp(12px,2.2vw,22px);position:relative}.hero:before{content:"";z-index:0;background:radial-gradient(56% 100% at 50% 0, var(--accent-soft), transparent 76%);pointer-events:none;width:min(1160px,100%);height:clamp(160px,26vw,260px);position:absolute;top:0;left:50%;transform:translate(-50%)}.hero>.wrap{z-index:1;position:relative}.hero-cover{border-radius:var(--r-lg);aspect-ratio:21/9;min-height:clamp(150px,22vw,210px);position:relative;overflow:hidden}.hero-cover.is-loading{background:linear-gradient(150deg, var(--surface-2), var(--surface))}.hero-cover img{position:absolute;inset:0}.hero-cover:after{content:"";background:linear-gradient(90deg,#000000a3,#00000042 62%,#00000014);position:absolute;inset:0}.hero-cover-body{z-index:1;color:#fff;flex-direction:column;justify-content:center;align-items:flex-start;height:100%;padding:clamp(16px,2.4vw,28px);display:flex;position:relative}.hero-title{letter-spacing:-.045em;color:#fff;font-size:clamp(26px,3.9vw,38px);font-weight:600;line-height:1.06}.hero-text{color:#ffffffd9;max-width:32ch;margin-top:11px;font-size:14px;line-height:1.55}.hero-actions{flex-wrap:wrap;align-items:center;gap:14px;margin-top:16px;display:flex}.hero-cta{border-radius:var(--r-md);background:var(--accent);height:42px;color:var(--on-accent);letter-spacing:-.01em;align-items:center;padding:0 22px;font-size:14px;font-weight:600;transition:opacity .18s,transform .18s;display:inline-flex}.hero-cta:hover{opacity:.88;transform:translateY(-1px)}.hero-note{color:#ffffffa6;font-size:12px}.hero-top{font-family:var(--mono);letter-spacing:.15em;text-transform:uppercase;color:#fffc;background:#ffffff26;border-radius:999px;align-items:center;gap:8px;margin-bottom:11px;padding:3px 11px 3px 4px;font-size:9.5px;display:inline-flex}.hero-top b{background:var(--accent);min-width:22px;height:17px;color:var(--on-accent);letter-spacing:0;border-radius:999px;justify-content:center;align-items:center;padding:0 6px;font-size:10.5px;font-weight:600;display:inline-flex}.hero-rank{justify-content:center;align-items:center;gap:10px;margin-top:clamp(12px,2vw,16px);display:flex}.pager-arrow{background:var(--surface);width:28px;height:28px;color:var(--muted);border-radius:50%;place-items:center;transition:background .15s,color .15s;display:grid}.pager-arrow:hover{color:var(--ink)}.pager-dots{align-items:center;gap:7px;display:flex}.pager-dot{background:var(--muted);opacity:.4;border-radius:999px;width:8px;height:8px;transition:width .18s,opacity .18s,background .18s}.pager-dot:hover{opacity:.75}.pager-dot.is-active{background:var(--accent);opacity:1;width:22px}.cats{flex-wrap:wrap;gap:clamp(16px,2.6vw,30px);padding:clamp(6px,1.4vw,14px) 0 clamp(22px,3.4vw,36px);display:flex}.cat{color:var(--muted);padding:6px 0;font-size:14px;transition:color .15s}.cat:hover{color:var(--accent)}.cat.is-active{color:var(--ink);font-weight:500}.grid-count{color:var(--muted);text-align:right;margin-bottom:14px;font-size:12px}.grid{grid-template-columns:repeat(var(--cols), minmax(0, 1fr));gap:var(--gap-y) var(--gap-x);display:grid}.card{display:block}.card-media{border-radius:var(--r-card);background:var(--surface);aspect-ratio:var(--card-aspect);position:relative;overflow:hidden}.card-media img{transition:transform .5s cubic-bezier(.2,.7,.3,1)}.card:hover .card-media img{transform:scale(1.045)}.card-media.ph{background:linear-gradient(150deg, var(--surface-2), var(--surface))}.card-dot{background:var(--accent);border-radius:50%;width:6px;height:6px;position:absolute;top:9px;right:9px}.card-play{background:var(--accent);width:38px;height:38px;color:var(--on-accent);opacity:0;border-radius:50%;place-items:center;transition:opacity .2s,transform .2s;display:grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)scale(.92)}.card-play svg{margin-left:2px}.card:hover .card-play,.card:focus-visible .card-play{opacity:1;transform:translate(-50%,-50%)scale(1)}.card-body{flex-direction:column;gap:1px;margin-top:9px;display:flex}.card-name{letter-spacing:-.012em;font-size:13.5px;font-weight:500;transition:color .15s}.card:hover .card-name{color:var(--accent)}.card-meta{color:var(--muted);font-size:11px}.card.is-placeholder .card-play{display:none}.card.is-placeholder:hover .card-name{color:var(--ink)}.card.is-placeholder:hover .card-media img{transform:none}.empty-state{text-align:center;color:var(--muted);justify-items:center;gap:12px;padding:clamp(28px,5vw,48px) 0 clamp(36px,6vw,60px);display:grid}@media (hover:none){.card-play{display:none}}@media (width<=560px){.cats{scrollbar-width:none;flex-wrap:nowrap;gap:18px;padding-bottom:18px;overflow-x:auto}.cats::-webkit-scrollbar{display:none}.hero{padding-top:16px}.hero-actions{margin-top:16px}.hero-cover{min-height:210px}}