.t10{--t-bg:#0b0b0b;--t-ink:#fff;--t-card:#161616;--t-line:#2a2a2a;--t-veil:rgba(11,11,11,.84);--t-r1:linear-gradient(180deg,#fff 0%,#e6e6e6 34%,#9a9a9a 66%,#d8d8d8 100%);position:relative;background:var(--t-bg);color:var(--t-ink);padding:clamp(64px,9vw,140px) 0 clamp(56px,7vw,120px);border-top:1px solid var(--t-line);overflow:hidden}.rok-v3 .t10{--t-bg:#fff;--t-ink:#0b0b0b;--t-card:#f1f1ef;--t-line:#dcdcd8;--t-veil:rgba(255,255,255,.93);--t-r1:linear-gradient(180deg,#0b0b0b 0%,#4a4a4a 40%,#8a8a8a 62%,#1a1a1a 100%) }.t10__wrap{width:100%;max-width:var(--max,1320px);margin:0 auto;padding:0 var(--gut,16px)}.t10__h,.rok-v3 .t10 .t10__h{margin:0;font-family:var(--rok-display);font-stretch:125%;font-weight:900;text-transform:uppercase;letter-spacing:-.02em;line-height:.9;color:var(--t-ink);font-size:clamp(34px,9.4vw,112px)}.t10__rail{margin-top:clamp(32px,5vw,72px);overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-left:var(--gut,16px);scrollbar-width:none;-webkit-overflow-scrolling:touch;cursor:grab;outline:0}.t10__rail::-webkit-scrollbar{display:none}.t10__rail.is-drag{cursor:grabbing;scroll-snap-type:none}.t10__list{display:flex;align-items:flex-end;gap:12px;margin:0;padding:0 var(--gut,16px);list-style:none;width:max-content}@media(min-width:1400px){.t10__list{padding-left:calc((100vw - var(--max,1320px)) / 2 + var(--gut,16px))}}.t10__card{flex:none;width:56vw;scroll-snap-align:start}.t10__card--top{width:70vw}@media(min-width:700px){.t10__card{width:clamp(200px,22vw,250px)}.t10__card--top{width:clamp(260px,30vw,340px)}}@media(min-width:1100px){.t10__list{gap:16px}.t10__card{width:clamp(190px,14vw,230px)}.t10__card--top{width:clamp(260px,21vw,320px)}}.t10__media{position:relative;aspect-ratio:9/16;border-radius:6px;overflow:hidden;background:var(--t-card);border:1px solid var(--t-line);isolation:isolate}.t10__video,.t10__poster{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover}.t10__card:not(.t10__card--empty) .t10__media:after{content:"";position:absolute;inset:auto 0 0;height:45%;background:linear-gradient(transparent,#000c);pointer-events:none;z-index:1}.t10__rank{position:absolute;left:12px;bottom:6px;z-index:2;font-family:var(--rok-display);font-stretch:125%;font-weight:900;line-height:.82;letter-spacing:-.04em;color:var(--t-ink);font-size:clamp(64px,16vw,84px);font-variant-numeric:tabular-nums}.t10__card--top .t10__rank{font-size:clamp(96px,26vw,132px)}@media(min-width:700px){.t10__rank{font-size:clamp(56px,6vw,80px)}.t10__card--top .t10__rank{font-size:clamp(84px,8vw,128px)}}.t10__card:not(.t10__card--empty) .t10__rank{color:#fff}.t10__card:first-child .t10__rank{background:var(--t-r1);-webkit-background-clip:text;background-clip:text;color:transparent}.t10__card:not(.t10__card--empty):first-child .t10__rank{background:linear-gradient(180deg,#fff,#e6e6e6 34%,#9a9a9a 66%,#d8d8d8);-webkit-background-clip:text;background-clip:text}.t10__card--empty .t10__media{background:var(--t-card) url(rok-scroll-vitrail-repeat.png) center/240px repeat;background-blend-mode:luminosity}.t10__card--empty .t10__media:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:var(--t-veil);z-index:0}.t10__who{margin:14px 2px 0;font-family:var(--rok-display);font-stretch:125%;font-weight:800;font-size:clamp(18px,4.6vw,22px);line-height:1.1;color:var(--t-ink)}.t10__who a{color:inherit;text-decoration:none}.t10__who a:hover{text-decoration:underline}.t10__sound{position:absolute;right:10px;top:10px;z-index:3;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:#0b0b0b99;color:#fff;border:1px solid rgba(255,255,255,.25)}.t10__sound svg{width:20px;height:20px}.t10__join{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:clamp(32px,4vw,56px);min-height:64px;padding:0 28px;background:var(--t-ink);color:var(--t-bg);border-radius:4px;text-decoration:none;font-family:var(--rok-display);font-stretch:125%;font-weight:800;text-transform:uppercase;letter-spacing:.02em;font-size:clamp(18px,4.6vw,22px);transition:transform .25s}.t10__join:hover{transform:translateY(-2px)}@media(min-width:700px){.t10__join{display:inline-flex}}
/*# sourceMappingURL=/cdn/shop/t/12/assets/rok-top10.css.map */