.hero{position:relative;min-height:100svh;display:grid;align-content:end;overflow:hidden;isolation:isolate}.hero .art{position:absolute;inset:0;z-index:-2;background:url(/art/hero-backdrop.webp) center 22%/cover no-repeat;animation:drift 48s ease-in-out infinite alternate}@keyframes drift{0%{transform:scale(1)}to{transform:scale(1.06)}}.hero .veil{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(11,5,23,.55) 0%,rgba(11,5,23,.05) 28%,rgba(11,5,23,.15) 50%,rgba(11,5,23,.86) 76%,var(--night) 100%),radial-gradient(60% 40% at 50% 100%,rgba(255,41,117,.28),transparent 70%)}.hero-inner{position:relative;z-index:2;width:min(1240px,100%);margin:0 auto;padding:120px 34px 42px;display:grid;grid-template-columns:230px minmax(0,1fr);gap:38px;align-items:end;min-width:0}@media(max-width:900px){.hero-inner{grid-template-columns:1fr;gap:22px;padding:110px 20px 34px}}.featured{display:grid;gap:10px;justify-items:start}.featured .tag{font-family:var(--display);font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--cyan);text-shadow:0 0 10px rgba(0,231,255,.6)}.featured .cover{width:230px;aspect-ratio:2/3;border-radius:12px;overflow:hidden;background:var(--night-2);border:1px solid rgba(0,231,255,.5);box-shadow:0 0 0 1px #ff2d9540,0 0 28px #00e7ff59,0 30px 60px -20px #000;transform:rotate(-2deg);display:block}.featured .cover img{width:100%;height:100%;object-fit:cover}.featured .cap{font-family:var(--script);font-size:24px;color:var(--pink);text-shadow:0 0 12px rgba(255,45,149,.7);margin-left:6px;max-width:230px;line-height:1.1}@media(max-width:900px){.featured{display:none!important}}.console{min-width:0;max-width:100%;background:linear-gradient(180deg,#140a2bc7,#0b0517e6);border:1px solid var(--line);border-radius:20px;padding:22px 26px;backdrop-filter:blur(14px);box-shadow:0 0 0 1px #00e7ff1f,0 0 40px #9b4dff40,0 40px 80px -40px #000;position:relative}.console:before{content:"";position:absolute;inset:-1px;border-radius:21px;padding:1px;background:linear-gradient(120deg,#00e7ff99,#9b4dff33 40%,#ff2d9599);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}.row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:22px;align-items:center}@media(max-width:700px){.row{grid-template-columns:1fr}}.score{min-width:0;display:flex;align-items:center;gap:16px}.slider{flex:1;display:grid;gap:4px;min-width:0}input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:30px;background:transparent;margin:0;cursor:pointer}input[type=range]::-webkit-slider-runnable-track{height:8px;border-radius:4px;background:linear-gradient(90deg,var(--cyan),var(--violet) 50%,var(--pink)) 0 0/var(--fill,70%) 100% no-repeat,#9b4dff2e;box-shadow:inset 0 0 0 1px #9b4dff4d}input[type=range]::-moz-range-track{height:8px;border-radius:4px;background:#9b4dff2e}input[type=range]::-moz-range-progress{height:8px;border-radius:4px;background:linear-gradient(90deg,var(--cyan),var(--pink))}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;border-radius:50%;background:#fff;border:3px solid var(--night);box-shadow:0 0 0 2px var(--pink),0 0 22px #ff2d95e6;margin-top:-9px}input[type=range]::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:#fff;border:3px solid var(--night);box-shadow:0 0 0 2px var(--pink),0 0 22px #ff2d95e6}.readout{display:flex;justify-content:space-between;align-items:baseline;font-family:var(--display);font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-dim)}.readout output{font-size:22px;font-weight:800;letter-spacing:.02em;color:#fff;text-shadow:0 0 14px rgba(255,45,149,.8)}.readout output small{font-size:10px;color:var(--ink-dim);letter-spacing:.2em;margin-left:6px;text-shadow:none}.genres{margin-top:18px;min-width:0}.tiles{max-width:100%;min-width:0;display:grid;grid-auto-flow:column;grid-auto-columns:96px;gap:10px;overflow-x:auto;padding:6px 4px 10px;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:var(--violet) transparent}.tile{scroll-snap-align:start;aspect-ratio:2/3;border-radius:10px;border:1px solid var(--line);background:var(--night-2) center/cover;position:relative;overflow:hidden;cursor:pointer;padding:0;transition:transform .15s,box-shadow .15s,border-color .15s}.tile:after{content:attr(data-name);position:absolute;left:0;right:0;bottom:0;padding:22px 6px 7px;font-family:var(--display);font-weight:700;font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:#fff;text-align:center;background:linear-gradient(180deg,transparent,rgba(11,5,23,.92))}.tile:hover{transform:translateY(-3px)}.tile[aria-pressed=true]{border-color:var(--pink);box-shadow:0 0 0 1px var(--pink),0 0 22px #ff2d95cc;transform:translateY(-3px) scale(1.04)}.tile.any{display:grid;place-items:center;background:linear-gradient(160deg,var(--sky-mid),var(--night-2))}.tile.any span{font-family:var(--script);font-size:30px;color:var(--cyan);text-shadow:0 0 12px rgba(0,231,255,.8);transform:rotate(-8deg)}.go-row{display:flex;justify-content:center;margin-top:16px}.stage{position:relative;z-index:2;padding-top:36px}.stage[hidden]{display:none}.riffle{position:relative;height:320px;overflow:hidden;border-radius:18px;border:1px solid var(--line);background:var(--night-2);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);box-shadow:0 0 40px #9b4dff33}.riffle .track{position:absolute;top:26px;left:0;display:flex;gap:14px;will-change:transform;animation:riffle 1s linear infinite}.riffle .track .poster{width:160px;height:240px;flex:0 0 auto;filter:blur(1px) brightness(.8)}@keyframes riffle{to{transform:translate(-50%)}}.riffle .counter{position:absolute;left:0;right:0;bottom:14px;text-align:center;font-family:var(--display);font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--cyan);text-shadow:0 0 12px rgba(0,231,255,.8)}.riffle .counter:before{content:"▮ ";animation:blink .6s steps(1) infinite}@keyframes blink{50%{opacity:0}}.riffle .beam{position:absolute;left:50%;top:-60px;width:220px;height:420px;transform:translate(-50%);background:radial-gradient(closest-side,rgba(255,45,149,.35),transparent);pointer-events:none}.result{display:grid;gap:26px}.top{position:relative;display:grid;grid-template-columns:280px minmax(0,1fr);gap:34px;align-items:center;padding:30px;border-radius:22px;border:1px solid var(--line);background:linear-gradient(180deg,#140a2be6,#0b0517f2);overflow:hidden;box-shadow:0 0 0 1px #00e7ff1f,0 0 50px #ff2d952e;animation:rise .55s cubic-bezier(.2,.7,.2,1) both}.top:before{content:"";position:absolute;left:-60px;top:-160px;width:520px;height:520px;background:radial-gradient(closest-side,rgba(255,45,149,.35),transparent 70%);pointer-events:none}.top .poster{width:280px;height:420px;--ts:26px;transform:rotate(-1.5deg);border:1px solid rgba(0,231,255,.45);box-shadow:0 0 28px #00e7ff4d,0 30px 60px -20px #000;animation:settle .7s cubic-bezier(.2,.7,.2,1) both}@keyframes settle{0%{transform:rotate(-7deg) scale(.94);opacity:0}}@keyframes rise{0%{transform:translateY(14px);opacity:0}}.top .eyebrow{font-family:var(--script);font-size:30px;color:var(--cyan);text-shadow:0 0 12px rgba(0,231,255,.7);margin:0 0 4px}.top h2{font-family:var(--display);font-weight:800;font-size:clamp(26px,3.6vw,42px);line-height:1.08;letter-spacing:.01em;margin:0 0 8px;text-wrap:balance;color:#fff;text-shadow:0 0 18px rgba(255,45,149,.45)}.top h2 a{text-decoration:none}.top .meta{font-family:var(--display);font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-dim);margin:0 0 16px}.top .hook{font-size:20px;font-weight:500;line-height:1.35;color:var(--ink);margin:0 0 18px;max-width:60ch;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}.scores{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 16px}.actions{display:flex;gap:10px;flex-wrap:wrap}@media(max-width:720px){.top{grid-template-columns:1fr;padding:22px}.top .poster{margin:0 auto}}.alts-label{font-family:var(--script);font-size:26px;color:var(--pink);text-shadow:0 0 12px rgba(255,45,149,.7);margin:0 0 -12px}.alts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}@media(max-width:720px){.alts{grid-template-columns:repeat(2,minmax(0,1fr))}}.alt{border:1px solid var(--line);background:#140a2bb3;border-radius:16px;padding:12px;text-align:left;cursor:pointer;display:grid;gap:10px;animation:rise .5s cubic-bezier(.2,.7,.2,1) both;animation-delay:var(--d);transition:transform .15s,box-shadow .15s,border-color .15s}.alt:hover{transform:translateY(-4px);border-color:var(--cyan);box-shadow:0 0 22px #00e7ff59}.alt .poster{width:100%;--ts:14px}.alt .at{font-family:var(--display);font-weight:700;font-size:12px;letter-spacing:.04em;line-height:1.3;color:#fff}.alt .am{display:flex;gap:10px;flex-wrap:wrap;font-family:var(--body);font-weight:600;font-size:13px;color:var(--ink-dim)}.alt .am b{color:#fff;font-weight:700}.empty{padding:34px;border:1px dashed var(--line);border-radius:18px;text-align:center;color:var(--ink-dim);font-size:20px;animation:rise .4s both}.empty b{color:#fff}.more{margin-top:70px}.ways{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px}.way{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:16px;min-height:150px;padding:16px;text-decoration:none;display:grid;align-content:end;gap:6px;background:var(--night-2) var(--img) center/cover;transition:transform .15s,box-shadow .15s,border-color .15s;text-align:left;cursor:pointer;color:inherit;font:inherit}.way:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#0b05171a,#0b0517eb 70%)}.way>*{position:relative}.way b{font-family:var(--display);font-weight:800;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:#fff;text-shadow:0 0 10px rgba(0,231,255,.5)}.way span{font-size:16px;font-weight:500;color:var(--ink-dim);line-height:1.3}.way:hover{transform:translateY(-3px);border-color:var(--pink);box-shadow:0 0 22px #ff2d9580}@media(prefers-reduced-motion:reduce){.hero .art,.riffle .track,.top,.top .poster,.alt,.empty,.riffle .counter:before{animation:none}}