:root{--hn-red:#e11d48;--hn-ease-out:cubic-bezier(.16, 1, .3, 1);--hn-ease-spring:cubic-bezier(.34, 1.4, .64, 1)}.hn-skel{background:#1c1c1c;border-radius:4px;position:relative;overflow:hidden}.hn-skel:after{content:"";background:linear-gradient(90deg,#0000,#ffffff0f,#0000);animation:1.4s infinite hn-shimmer;position:absolute;top:0;bottom:0;left:0;right:0;transform:translate(-100%)}@keyframes hn-shimmer{to{transform:translate(100%)}}.hn-skel-hero{border-radius:0;width:100%;height:min(75svh,760px)}.hn-skel-title{width:180px;height:18px;margin:0 4vw .6rem}.hn-skel-row{gap:8px;margin-bottom:2.2vw;padding:0 4vw;display:flex}.hn-skel-card{aspect-ratio:2/3;border-radius:10px;flex:none;width:clamp(132px,14vw,210px)}@media (prefers-reduced-motion:reduce){.hn-skel:after{animation:none}}.hn-row{margin-bottom:3.6vw}.hn-row-head{justify-content:space-between;align-items:center;margin-bottom:.85rem;padding:0 4vw;display:flex}.hn-row-title{letter-spacing:-.021em;color:#fff;margin:0;font-family:Archivo,Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;font-size:clamp(1.3rem,2vw,2rem);font-weight:700;font-stretch:92%}.hn-pages{opacity:0;gap:2px;transition:opacity .2s;display:flex}.group\/row:hover .hn-pages{opacity:1}.hn-pages span{background:#4e4144;width:12px;height:2px;transition:background .2s}.hn-pages span.is-active{background:var(--hn-red)}.hn-row-body{position:relative}.hn-arrow{z-index:30;color:#fff;cursor:pointer;opacity:0;background:#1a141699;border:none;place-items:center;width:4vw;min-width:36px;transition:opacity .2s,background .2s;display:grid;position:absolute;top:0;bottom:0}.hn-row-body:hover .hn-arrow{opacity:1}.hn-arrow:hover{background:#1a1416e6}.hn-arrow:hover svg{transform:scale(1.25)}.hn-arrow:active svg{transform:scale(.9)}.hn-arrow svg{transition:transform .18s var(--hn-ease-spring)}.hn-arrow:focus-visible{opacity:1;box-shadow:inset 0 0 0 2px var(--hn-red);outline:none}.hn-arrow--left{left:0}.hn-arrow--right{right:0}@media (hover:none){.hn-arrow{display:none}}.hn-viewport{padding:0 4vw;overflow:visible}.hn-track{gap:12px;display:flex}.hn-card{flex:none;width:clamp(156px,16.5vw,256px);position:relative}.hn-card--ranked{align-items:flex-end;gap:0;width:auto;display:flex}.hn-rank{z-index:2;text-align:right;white-space:nowrap;letter-spacing:-.03em;color:#1a1416;-webkit-text-stroke:3px #e11d4885;-webkit-user-select:none;user-select:none;flex:none;width:clamp(58px,7vw,116px);min-width:0;margin-right:-1.4vw;font-family:Archivo,Inter,ui-sans-serif,sans-serif;font-size:clamp(112px,15vw,224px);font-weight:800;font-stretch:85%;line-height:.72;position:relative}.hn-thumb-wrap{flex:none;min-width:0;position:relative}.hn-card--ranked .hn-thumb-wrap{width:clamp(130px,15vw,210px)}.hn-card--ranked .hn-thumb{aspect-ratio:2/3}.hn-top10{z-index:3;background:var(--hn-red);color:#fff;letter-spacing:.5px;text-align:center;clip-path:polygon(0 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%);border-bottom-right-radius:4px;padding:3px 4px;font-size:9px;font-weight:800;line-height:1;position:absolute;top:0;left:0}.hn-new{z-index:3;background:var(--hn-red);color:#fff;letter-spacing:.3px;text-transform:uppercase;clip-path:polygon(0 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%);border-radius:3px;padding:2px 7px;font-size:10px;font-weight:700;position:absolute;top:8px;left:8px}.hn-thumb{aspect-ratio:2/3;width:100%;transition:transform .35s var(--hn-ease-out), box-shadow .35s var(--hn-ease-out);background:#2c2325;border-radius:10px;display:block;position:relative;overflow:hidden}.hn-thumb img{-o-object-fit:cover;object-fit:cover;width:100%;height:100%;transition:transform .5s var(--hn-ease-out);display:block}.hn-thumb:hover img{transform:scale(1.06)}.hn-thumb:focus-visible{box-shadow:0 0 0 2px #fff, 0 0 0 4px var(--hn-red);outline:none}@media (hover:none){.hn-card{transition:transform .18s var(--hn-ease-out)}.hn-card:active{transform:scale(.96)}.hn-thumb:active{box-shadow:0 0 0 2px #e11d4899}}.hn-thumb-fallback{text-align:center;color:#fff;place-items:center;width:100%;height:100%;padding:8px;font-size:.85rem;font-weight:700;display:grid}.hn-thumb-grad{pointer-events:none;background:linear-gradient(#0000 45%,#000000bf 100%);position:absolute;top:0;bottom:0;left:0;right:0}.hn-thumb-logo{-o-object-fit:contain;object-fit:contain;-o-object-position:left bottom;object-position:left bottom;filter:drop-shadow(0 2px 6px #000000b3);max-width:55%;max-height:34%;position:absolute;bottom:10px;left:10px;width:auto!important;height:auto!important}.hn-thumb-title{color:#fff;-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:.85rem;font-weight:700;line-height:1.15;display:-webkit-box;position:absolute;bottom:8px;left:10px;right:10px;overflow:hidden}.hn-progress{background:#ffffff40;height:3px;position:absolute;bottom:0;left:0;right:0}.hn-progress>span{background:var(--hn-red);height:100%;display:block}.hn-remove{z-index:5;color:#fff;opacity:0;width:28px;height:28px;transition:opacity .2s, background .2s, transform .18s var(--hn-ease-spring);background:#000000b3;border-radius:9999px;place-items:center;display:grid;position:absolute;top:6px;right:6px}.hn-thumb-wrap:hover .hn-remove{opacity:1}.hn-remove:hover{background:var(--hn-red);transform:scale(1.15)}.hn-remove:active{transform:scale(.9)}@media (hover:none){.hn-remove{opacity:1;background:#0000008c}}.hn-preview{opacity:0;pointer-events:none;z-index:40;width:150%;transition:opacity .22s var(--hn-ease-out), transform .28s var(--hn-ease-spring);background:#1a1416;border-radius:6px;position:absolute;top:50%;left:50%;overflow:hidden;transform:translate(-50%,-50%)scale(.82);box-shadow:0 18px 50px #000000e6,0 0 0 1px #ffffff0f}@media (hover:hover){.hn-card:hover{z-index:41}.hn-card:hover .hn-preview{opacity:1;pointer-events:auto;transition-delay:.3s;transform:translate(-50%,-50%)scale(1)}.hn-track>.hn-card:first-child .hn-preview{left:0;transform:translateY(-50%)scale(.82)}.hn-track>.hn-card:first-child:hover .hn-preview{transform:translateY(-50%)scale(1)}.hn-track>.hn-card:last-child .hn-preview{left:auto;right:0;transform:translateY(-50%)scale(.82)}.hn-track>.hn-card:last-child:hover .hn-preview{transform:translateY(-50%)scale(1)}}@media (hover:none){.hn-preview{display:none}}.hn-row-title:after{content:" ›";color:var(--hn-red);opacity:0;margin-left:4px;font-weight:800;transition:opacity .2s,margin-left .2s}.group\/row:hover .hn-row-title:after{opacity:1;margin-left:8px}.hn-preview-thumb{aspect-ratio:16/9;background:#2c2325;width:100%;display:block;position:relative;overflow:hidden}.hn-preview-thumb img{-o-object-fit:cover;object-fit:cover;width:100%;height:100%;display:block}.hn-preview-video{pointer-events:none;border:0;width:100%;height:100%;position:absolute;top:0;bottom:0;left:0;right:0}.hn-mute{z-index:4;color:#fff;width:28px;height:28px;transition:border-color .2s, transform .18s var(--hn-ease-spring), background .2s;background:#0006;border:1px solid #ffffff80;border-radius:9999px;place-items:center;display:grid;position:absolute;bottom:10px;right:10px}.hn-mute:hover{background:#0009;border-color:#fff;transform:scale(1.12)}.hn-mute:active{transform:scale(.92)}.hn-preview-body{padding:12px 14px 14px}.hn-genres{color:#ddd;margin-top:8px;font-size:.76rem}.hn-actions{align-items:center;gap:8px;margin-bottom:10px;display:flex}.hn-play,.hn-more{width:36px;height:36px;transition:background .2s, border-color .2s, transform .18s var(--hn-ease-spring), box-shadow .2s;border-radius:9999px;place-items:center;display:grid}.hn-play{color:#000;background:#fff}.hn-play:hover{background:#fff;transform:scale(1.12);box-shadow:0 4px 14px #ffffff59}.hn-play:active{transform:scale(.94)}.hn-more{color:#fff;background:#0000004d;border:2px solid #fff6}.hn-more:hover{border-color:#fff;transform:scale(1.12)}.hn-more:active{transform:scale(.94)}.hn-play:focus-visible{box-shadow:0 0 0 2px #000, 0 0 0 4px var(--hn-red);outline:none}.hn-more:focus-visible{box-shadow:0 0 0 2px #000, 0 0 0 4px var(--hn-red);outline:none}.hn-meta{color:#ddd;flex-wrap:wrap;align-items:center;gap:8px;font-size:.78rem;display:flex}.hn-rating{color:#fff;align-items:center;gap:4px;font-weight:700;display:inline-flex}.hn-rating svg{width:13px;height:13px;color:var(--brand-400,#fb7185);fill:currentColor}.hn-badge{text-transform:uppercase;letter-spacing:.3px;border:1px solid #ffffff59;padding:0 5px;font-size:.68rem}.hn-hd{color:#bbb;border:1px solid #ffffff40;border-radius:3px;padding:0 4px;font-size:.62rem}.hn-overview{color:#b3b3b3;-webkit-line-clamp:3;-webkit-box-orient:vertical;margin:8px 0 0;font-size:.76rem;line-height:1.35;display:-webkit-box;overflow:hidden}@media (prefers-reduced-motion:reduce){.hn-preview{transition:none}}.hn-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 8px;padding:0 4vw;display:grid}@media (min-width:600px){.hn-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (min-width:900px){.hn-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}@media (min-width:1200px){.hn-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}@media (min-width:1600px){.hn-grid{grid-template-columns:repeat(6,minmax(0,1fr))}}.hn-grid>.hn-card{width:100%}.hn-grid-ranked{flex-wrap:wrap;justify-content:center;gap:28px 1.5vw;padding:0 4vw;display:flex}.hn-grid-ranked>.hn-card--ranked{margin:0}@media (hover:hover){.hn-grid>.hn-card .hn-preview{width:132%}.hn-card:hover .hn-preview,.hn-track>.hn-card:first-child:hover .hn-preview,.hn-track>.hn-card:last-child:hover .hn-preview{opacity:0;pointer-events:none;transition-delay:0s;transform:translate(-50%,-50%)scale(.82)}.hn-card{transition:transform .22s var(--hn-ease-out)}.hn-card:hover{z-index:2;transform:translateY(-6px)}.hn-card:hover .hn-thumb{box-shadow:0 10px 28px #0000008c,0 0 0 2px #e11d48}.hn-card:hover .hn-thumb img{transform:scale(1.03)}}.hn-card:focus-within .hn-thumb{box-shadow:0 10px 28px #0000008c,0 0 0 2px #e11d48}.hn-card--ranked .hn-thumb{border-radius:10px}@media (hover:none){.hn-thumb:active{box-shadow:0 0 0 2px #e11d48a6}}@keyframes hn-billboard-zoom{0%{transform:scale(1)}to{transform:scale(1.08)}}.hn-billboard-zoom{will-change:transform;animation:20s ease-out forwards hn-billboard-zoom}@media (prefers-reduced-motion:reduce){.hn-billboard-zoom{animation:none}}
