:root{color-scheme:dark;--bg:#09070a;--panel:#141116;--panel-soft:#1b151c;--line:rgba(255,237,243,.12);--line-strong:rgba(255,237,243,.2);--ink:#f7f2f4;--muted:#a49aa0;--soft:#776d74;--pink:#f20b72;--pink-deep:#bb0055;--rose:#ff83ad;--green:#55d89b;--sans:"DM Sans",Inter,system-ui,sans-serif;--serif:Italiana,Georgia,serif}*{box-sizing:border-box}html{min-height:100%;background:var(--bg);scroll-behavior:smooth}body{margin:0;min-height:100vh;color:var(--ink);font-family:var(--sans);background:radial-gradient(ellipse at 52% -5%,rgba(106,10,54,.18),transparent 39%),radial-gradient(ellipse at 8% 75%,rgba(53,11,39,.12),transparent 30%),var(--bg)}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{color:inherit}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible,.clip-scroll:focus-visible{outline:2px solid var(--rose);outline-offset:3px}.topbar{position:sticky;z-index:20;top:0;display:grid;height:72px;grid-template-columns:minmax(220px,1fr) minmax(300px,650px) minmax(220px,1fr);align-items:center;gap:24px;padding:0 clamp(18px,3vw,46px);border-bottom:1px solid var(--line);background:rgba(10,8,11,.9);backdrop-filter:blur(22px)}.brand-area{display:flex;align-items:center;gap:19px}.menu-toggle{display:flex;width:24px;height:34px;flex-direction:column;justify-content:center;gap:5px;padding:0;border:0;background:none;cursor:pointer}.menu-toggle span{width:17px;height:1px;background:#d7ced2;transition:width .18s}.menu-toggle:hover span:nth-child(2){width:12px}.brand{display:inline-flex;align-items:center;gap:10px;font-size:12px;font-weight:700;letter-spacing:.23em;white-space:nowrap}.brand b{font-weight:400;color:#bdb1b8}.brand-mark{display:grid;width:36px;height:36px;place-items:center;border:1px solid rgba(255,42,126,.72);border-radius:50%;color:#ff83ad;font:24px/1 var(--serif);box-shadow:0 0 20px rgba(237,8,102,.12),inset 0 0 12px rgba(237,8,102,.08)}.global-search{display:flex;width:100%;height:42px;align-items:center;gap:12px;padding:0 14px;border:1px solid var(--line-strong);border-radius:999px;background:rgba(255,255,255,.035);color:#9f969d}.global-search>span{font:25px/1 var(--serif)}.global-search input{width:100%;min-width:0;border:0;outline:0;color:#f4edf1;background:transparent;font-size:12px}.global-search input::placeholder{color:#8e858b}.global-search kbd{flex:none;padding:4px 7px;border:1px solid var(--line);border-radius:6px;color:#91868e;font:9px var(--sans)}.header-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px}.signin-link,.join-link{display:inline-flex;min-height:38px;align-items:center;justify-content:center;gap:11px;padding:0 14px;border:1px solid var(--line);border-radius:9px;color:#e7dfe3;font-size:11px;font-weight:600;white-space:nowrap}.signin-link:hover{border-color:rgba(255,131,173,.35);background:rgba(255,255,255,.04)}.join-link{border-color:rgba(255,110,166,.48);background:linear-gradient(120deg,var(--pink),var(--pink-deep));box-shadow:0 8px 22px rgba(170,0,67,.19);color:#fff}.join-link:hover{filter:brightness(1.08)}.join-link span{font-size:14px}.icon-rail{position:fixed;z-index:10;top:72px;bottom:0;left:0;display:flex;width:72px;flex-direction:column;align-items:center;gap:7px;padding:17px 10px;border-right:1px solid var(--line);background:rgba(12,10,12,.88)}.rail-link{display:grid;width:48px;height:48px;flex:none;place-items:center;border:1px solid transparent;border-radius:12px;color:#a59ba1;background:transparent;cursor:pointer;transition:color .18s,background .18s,border-color .18s}.rail-link svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.rail-link:hover,.rail-link.is-active{border-color:rgba(242,11,114,.32);color:#ff8bb6;background:rgba(242,11,114,.12)}.rail-link.rail-bottom{margin-top:auto}.preview-main{min-height:calc(100vh - 72px);margin-left:72px;padding:18px clamp(18px,3vw,44px) 18px}.feed-controls{display:grid;justify-items:center;gap:12px;margin:0 auto 17px}.mode-tabs{display:flex;align-items:center;gap:3px;padding:4px;border:1px solid var(--line);border-radius:999px;background:rgba(20,17,21,.85)}.mode-tab{min-width:91px;height:36px;padding:0 15px;border:0;border-radius:999px;color:#b8afb4;background:transparent;font-size:11px;font-weight:600;cursor:pointer;transition:color .18s,background .18s}.mode-tab:hover{color:#fff}.mode-tab.is-active{color:#fff;background:linear-gradient(125deg,var(--pink),var(--pink-deep));box-shadow:0 5px 17px rgba(237,8,102,.18)}.filter-row{display:flex;width:100%;align-items:center;justify-content:center;gap:12px;overflow-x:auto;scrollbar-width:none}.filter-row::-webkit-scrollbar{display:none}.filter-group{display:flex;align-items:center;gap:7px;flex:none}.filter-chip{min-height:34px;padding:0 15px;border:1px solid var(--line-strong);border-radius:999px;color:#c7bec3;background:rgba(255,255,255,.025);font-size:10px;font-weight:600;white-space:nowrap;cursor:pointer;transition:border-color .18s,color .18s,background .18s}.filter-chip:hover{border-color:rgba(255,131,173,.48);color:#fff}.filter-chip.is-active{border-color:transparent;color:#fff;background:var(--pink);box-shadow:0 4px 14px rgba(237,8,102,.14)}.filter-chip.category-chip.is-active{border-color:var(--pink);background:rgba(242,11,114,.11);color:#ff93b9;box-shadow:none}.filter-divider{width:1px;height:22px;flex:none;background:var(--line-strong)}.sample-banner{display:flex;min-height:28px;align-items:center;justify-content:center;gap:8px;margin:0;color:#9d939a;font-size:10px;text-align:center}.sample-banner strong{color:#e4d8df;font-size:10px}.sample-dot{width:7px;height:7px;flex:none;border-radius:50%;background:#67dca7;box-shadow:0 0 9px rgba(85,216,155,.35)}.feed-layout{display:grid;width:min(1440px,100%);grid-template-columns:minmax(205px,245px) minmax(420px,640px) minmax(240px,310px);align-items:start;justify-content:center;gap:clamp(15px,1.8vw,27px);margin:0 auto}.side-panel{position:sticky;top:91px;max-height:calc(100vh - 109px);overflow-y:auto;padding:19px 17px 15px;border:1px solid var(--line);border-radius:17px;background:linear-gradient(145deg,rgba(27,20,28,.94),rgba(15,13,17,.96));box-shadow:0 18px 42px rgba(0,0,0,.18);scrollbar-width:thin;scrollbar-color:rgba(255,131,173,.17) transparent}.side-panel::-webkit-scrollbar{width:4px}.side-panel::-webkit-scrollbar-thumb{border-radius:5px;background:rgba(255,131,173,.17)}.panel-heading,.queue-heading{display:flex;align-items:center;justify-content:space-between;gap:8px}.eyebrow{margin:0;color:#9f8996;font-size:8px;font-weight:700;letter-spacing:.2em}.panel-heading h1,.queue-heading h2{margin:6px 0 0;color:#f6eff3;font-size:20px;letter-spacing:-.045em;line-height:1}.trending-tag{display:inline-flex;align-items:center;gap:6px;padding:6px 8px;border:1px solid rgba(242,11,114,.3);border-radius:999px;color:#ff83ad;font-size:7px;font-weight:700;letter-spacing:.1em}.trending-tag i{width:5px;height:5px;border-radius:50%;background:var(--pink)}.panel-copy{margin:13px 0 9px;color:#a79ba3;font-size:10px;line-height:1.55}.creator-list{display:grid;gap:1px;margin:7px 0 12px;padding:0;list-style:none}.creator-row{display:grid;width:100%;min-height:52px;grid-template-columns:24px 36px minmax(0,1fr) 13px;align-items:center;gap:8px;padding:5px 2px;border:0;border-radius:9px;background:transparent;text-align:left;cursor:pointer;transition:background .16s}.creator-row:hover,.creator-row.is-selected{background:rgba(255,255,255,.045)}.creator-rank{color:#877c85;font-size:8px;font-weight:600}.creator-avatar{position:relative;display:grid;width:36px;height:36px;flex:none;place-items:center;overflow:hidden;border:1px solid rgba(255,237,243,.37);border-radius:50%;color:#fff;background:linear-gradient(145deg,#714657,#27202b);font:14px var(--serif);box-shadow:0 0 0 2px rgba(255,255,255,.025)}.portrait{background-image:url('/assets/creator-portraits.png');background-repeat:no-repeat;background-size:200% 200%}.portrait-luna{background-position:0 0}.portrait-marco{background-position:100% 0}.portrait-nia{background-position:0 100%}.portrait-aria{background-position:100% 100%}.avatar-jules{background:linear-gradient(145deg,#80624f,#322c32)}.avatar-selene{background:linear-gradient(145deg,#744e67,#2b2033)}.avatar-daniel{background:linear-gradient(145deg,#536a73,#24242f)}.avatar-maya{background:linear-gradient(145deg,#85645c,#382634)}.avatar-theo{background:linear-gradient(145deg,#7f6751,#262a32)}.avatar-rafi{background:linear-gradient(145deg,#6c5548,#252b38)}.avatar-amara{background:linear-gradient(145deg,#795965,#2c2034)}.avatar-esme{background:linear-gradient(145deg,#916071,#30223d)}.creator-copy{min-width:0}.creator-copy strong,.creator-copy small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.creator-copy strong{color:#ece4e9;font-size:10px;font-weight:700}.creator-copy small{margin-top:4px;color:#928791;font-size:8px}.creator-arrow{color:#847983;font-size:12px}.panel-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:11px 0 12px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.panel-foot>span{color:#80747d;font-size:7px}.panel-foot button{padding:0;border:0;color:#ff87b1;background:none;font-size:9px;font-weight:700;cursor:pointer}.panel-foot button span{margin-left:4px}.panel-live-link{display:flex;min-height:40px;align-items:center;gap:9px;margin-top:12px;padding:0 10px;border:1px solid var(--line);border-radius:10px;background:rgba(255,255,255,.025);color:#d9cfd5;font-size:9px}.live-indicator{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 10px rgba(85,216,155,.4)}.panel-live-link b{margin-left:auto;color:#ff83ad}.outline-action{display:flex;width:100%;min-height:38px;align-items:center;justify-content:space-between;margin-top:8px;padding:0 11px;border:1px solid var(--line);border-radius:10px;color:#d5cbd2;background:rgba(255,255,255,.025);font-size:9px;cursor:pointer}.outline-action:hover{border-color:rgba(255,131,173,.38);color:#ffb4ce}.clip-column{min-width:0;position:relative}.clip-scroll{display:flex;height:clamp(490px,calc(100vh - 194px),790px);min-height:490px;flex-direction:column;gap:13px;overflow-y:auto;overscroll-behavior:contain;padding:0 4px 0 0;scrollbar-width:thin;scrollbar-color:rgba(255,131,173,.2) transparent;scroll-snap-type:y mandatory}.clip-scroll::-webkit-scrollbar{width:5px}.clip-scroll::-webkit-scrollbar-thumb{border-radius:6px;background:rgba(255,131,173,.23)}.sample-reel{position:relative;display:flex;min-height:100%;flex:0 0 100%;flex-direction:column;justify-content:flex-end;overflow:hidden;border:1px solid rgba(255,131,173,.31);border-radius:18px;background:#171116;isolation:isolate;scroll-snap-align:start;scroll-snap-stop:always;box-shadow:0 24px 64px rgba(0,0,0,.28)}.sample-reel:before{position:absolute;z-index:-2;inset:0;background-position:center;background-size:cover;content:"";transition:transform .65s}.sample-reel:hover:before{transform:scale(1.018)}.sample-reel:after{position:absolute;z-index:-1;inset:0;background:linear-gradient(0deg,rgba(5,5,7,.96) 0%,rgba(8,5,9,.7) 23%,rgba(8,5,9,.09) 60%,rgba(0,0,0,.38) 100%),linear-gradient(90deg,rgba(3,3,4,.32),transparent 55%,rgba(0,0,0,.25));content:""}.scene-city:before{background-image:url('/assets/reel-city.webp');background-position:54% center}.scene-listening:before{background-image:url('/assets/thumb-listening.webp');background-position:center}.scene-lounge:before{background-image:url('/assets/thumb-lounge.webp');background-position:center 54%}.scene-rooftop:before{background-image:url('/assets/thumb-rooftop.webp');background-position:center}.scene-live:before{background-image:url('/assets/reel-live.webp');background-position:center}.scene-collab:before{background-image:radial-gradient(ellipse at 26% 35%,rgba(184,94,133,.32),transparent 37%),radial-gradient(ellipse at 77% 40%,rgba(126,96,146,.32),transparent 38%),linear-gradient(135deg,#292027,#171317 50%,#261a22)}.reel-top{position:absolute;top:14px;right:15px;left:15px;display:flex;align-items:center;justify-content:space-between;gap:8px}.clip-label,.preview-label{display:inline-flex;min-height:27px;align-items:center;gap:7px;padding:0 10px;border:1px solid rgba(255,255,255,.18);border-radius:999px;color:#f2eaee;background:rgba(9,7,10,.58);font-size:8px;font-weight:700;letter-spacing:.09em;backdrop-filter:blur(14px)}.clip-label .sample-dot{width:5px;height:5px}.preview-label{color:#ffb5cd}.sample-play{position:absolute;top:44%;left:50%;display:flex;width:56px;height:56px;align-items:center;justify-content:center;gap:5px;transform:translate(-50%,-50%);border:1px solid rgba(255,255,255,.65);border-radius:50%;color:#fff;background:rgba(10,8,11,.35);font-size:15px;cursor:pointer;backdrop-filter:blur(12px);transition:transform .18s,background .18s}.sample-play:hover{transform:translate(-50%,-50%) scale(1.08);background:rgba(242,11,114,.66)}.sample-play span{position:absolute;top:calc(100% + 8px);left:50%;width:max-content;transform:translateX(-50%);color:#f6edf1;font-size:8px;font-weight:600;text-shadow:0 2px 8px #000}.live-stage{position:absolute;top:35%;left:50%;display:flex;align-items:center;gap:14px;transform:translate(-50%,-50%);padding:14px 19px;border:1px solid rgba(255,255,255,.23);border-radius:17px;background:rgba(10,8,11,.3);backdrop-filter:blur(7px)}.stage-avatar{width:57px;height:57px;border:2px solid rgba(255,255,255,.72);box-shadow:0 5px 18px rgba(0,0,0,.3)}.stage-plus{color:#ffe8f0;font:22px var(--serif)}.reel-caption{position:relative;z-index:2;max-width:78%;padding:0 22px 22px;text-shadow:0 3px 22px rgba(0,0,0,.5)}.reel-category{display:block;margin-bottom:10px;color:#ffb2ca;font-size:8px;font-weight:700;letter-spacing:.2em;text-transform:uppercase}.reel-caption h2{max-width:520px;margin:0;color:#fff9fc;font-size:clamp(31px,3.4vw,52px);font-weight:600;letter-spacing:-.055em;line-height:.95}.reel-caption h2 em{color:#ff7cab;font-style:normal}.reel-caption p{margin:10px 0 0;color:#ded4da;font-size:10px;line-height:1.5}.reel-ui{position:absolute;z-index:3;right:12px;bottom:106px;display:flex;flex-direction:column;align-items:center;gap:15px}.reel-tool{display:flex;min-width:38px;flex-direction:column;align-items:center;gap:4px;padding:0;border:0;color:#fff;background:none;text-shadow:0 2px 8px #000;cursor:pointer}.reel-tool svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.reel-tool small{font-size:8px}.reel-tool:hover{color:#ff99bc}.reel-meta{position:relative;z-index:2;display:flex;align-items:center;gap:10px;padding:0 19px 12px}.reel-meta .creator-avatar{width:38px;height:38px}.reel-creator-copy{min-width:0}.reel-creator-copy strong,.reel-creator-copy small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.reel-creator-copy strong{font-size:10px}.reel-creator-copy small{margin-top:4px;color:#c1b7bd;font-size:8px}.reel-follow{min-height:31px;margin-left:auto;padding:0 11px;border:1px solid rgba(255,255,255,.39);border-radius:8px;color:#fff;background:rgba(255,255,255,.08);font-size:9px;font-weight:700;cursor:pointer}.reel-follow:hover{border-color:#ff83ad;background:rgba(242,11,114,.2)}.reel-description{position:relative;z-index:2;margin:0;padding:0 19px 13px;color:#e5dce1;font-size:9px;line-height:1.45}.reel-description span{color:#ff98bb}.reel-progress{position:relative;z-index:2;height:2px;margin:0 19px 15px;overflow:hidden;background:rgba(255,255,255,.34)}.reel-progress:before{display:block;width:var(--progress,35%);height:100%;background:linear-gradient(90deg,#f20b72,#ff9abd);content:""}.no-results{margin:20px;padding:20px;border:1px dashed var(--line-strong);border-radius:12px;color:#b7aeb4;font-size:12px;text-align:center}.queue-panel{padding:19px 15px 14px}.queue-count{display:grid;width:28px;height:24px;place-items:center;border:1px solid var(--line);border-radius:7px;color:#bdb0b8;font-size:9px}.queue-list{display:grid;gap:9px;margin-top:16px}.queue-card{display:grid;width:100%;min-height:80px;grid-template-columns:96px minmax(0,1fr);align-items:stretch;gap:10px;overflow:hidden;padding:0;border:1px solid transparent;border-radius:11px;background:rgba(255,255,255,.035);text-align:left;cursor:pointer;transition:border-color .18s,background .18s,transform .18s}.queue-card:hover,.queue-card.is-current{transform:translateY(-1px);border-color:rgba(255,131,173,.32);background:rgba(255,255,255,.065)}.queue-art{position:relative;display:block;min-height:80px;overflow:hidden;background-position:center;background-size:cover}.queue-art:after{position:absolute;inset:40% 0 0;background:linear-gradient(transparent,rgba(0,0,0,.48));content:""}.queue-art.scene-city{background-image:url('/assets/reel-city.webp')}.queue-art.scene-listening{background-image:url('/assets/thumb-listening.webp')}.queue-art.scene-lounge{background-image:url('/assets/thumb-lounge.webp')}.queue-art.scene-rooftop{background-image:url('/assets/thumb-rooftop.webp')}.queue-art.scene-collab{background-image:radial-gradient(circle at 30% 40%,#69434f,transparent 42%),radial-gradient(circle at 75% 50%,#4b3f57,transparent 44%),linear-gradient(135deg,#342831,#171317)}.queue-art.scene-live{background-image:url('/assets/reel-live.webp')}.queue-number,.queue-duration{position:absolute;z-index:1;padding:4px 6px;border:1px solid rgba(255,255,255,.2);border-radius:5px;color:#fff;background:rgba(8,7,9,.72);font-size:7px;font-weight:700}.queue-number{top:6px;right:6px}.queue-duration{right:6px;bottom:6px}.queue-copy{display:flex;min-width:0;flex-direction:column;justify-content:center;gap:5px;padding:8px 8px 8px 0}.queue-copy small{color:#ff87b1;font-size:7px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}.queue-copy strong{display:-webkit-box;overflow:hidden;color:#f0e8ed;font-size:10px;line-height:1.25;-webkit-box-orient:vertical;-webkit-line-clamp:2}.queue-copy>span{overflow:hidden;color:#968a93;font-size:8px;text-overflow:ellipsis;white-space:nowrap}.queue-foot{margin:14px 1px 0;padding-top:12px;border-top:1px solid var(--line);color:#807680;font-size:8px;line-height:1.55}.preview-footer{display:flex;max-width:1440px;justify-content:space-between;gap:15px;margin:14px auto 0;padding:11px 2px 4px;color:#756a73;font-size:8px;letter-spacing:.1em}.preview-footer span:last-child{font-size:8px;letter-spacing:0;text-align:right}.preview-dialog{position:fixed;width:min(430px,calc(100% - 28px));padding:28px;border:1px solid rgba(255,131,173,.34);border-radius:19px;color:var(--ink);background:linear-gradient(145deg,#241720,#111014);box-shadow:0 30px 120px rgba(0,0,0,.68)}.preview-dialog::backdrop{background:rgba(4,3,5,.76);backdrop-filter:blur(8px)}.dialog-close{position:absolute;top:12px;right:12px;width:31px;height:31px;border:1px solid var(--line);border-radius:50%;color:#ddd2d9;background:rgba(255,255,255,.04);font-size:20px;cursor:pointer}.dialog-mark{display:grid;width:44px;height:44px;place-items:center;margin-bottom:19px;border:1px solid rgba(255,42,126,.65);border-radius:50%;color:#ff83ad;font:26px var(--serif)}.preview-dialog h2{margin:8px 0 9px;font-size:24px;letter-spacing:-.04em}.preview-dialog>p:not(.eyebrow){margin:0;color:#b8adb5;font-size:12px;line-height:1.7}.dialog-actions{display:grid;gap:9px;margin-top:19px}.dialog-actions .join-link{width:100%}.dialog-secondary{min-height:38px;border:1px solid var(--line);border-radius:9px;color:#d7ccd3;background:rgba(255,255,255,.035);font-size:11px;cursor:pointer}.preview-footer+.preview-dialog{color:var(--ink)}
@media(max-width:1120px){.topbar{grid-template-columns:minmax(180px,1fr) minmax(270px,520px) minmax(180px,1fr);gap:13px;padding-inline:20px}.feed-layout{grid-template-columns:minmax(400px,640px) minmax(230px,290px);width:min(960px,100%)}.creator-panel{display:none}.clip-scroll{height:clamp(490px,calc(100vh - 194px),790px)}}
@media(max-width:760px){.topbar{height:62px;grid-template-columns:auto minmax(130px,1fr) auto;gap:10px;padding:0 13px}.brand-area{gap:10px}.brand{gap:7px;font-size:10px;letter-spacing:.17em}.brand-mark{width:31px;height:31px;font-size:21px}.menu-toggle{width:18px}.global-search{height:37px;gap:7px;padding-inline:10px}.global-search>span{font-size:20px}.global-search input{font-size:10px}.global-search kbd{display:none}.header-actions{gap:5px}.signin-link{min-height:34px;padding:0 9px;font-size:9px}.join-link{min-height:34px;padding:0 10px;font-size:9px}.join-link span{display:none}.icon-rail{display:none}.preview-main{min-height:calc(100vh - 62px);margin:0;padding:12px 14px 18px}.feed-controls{gap:9px;margin-bottom:12px}.mode-tabs{max-width:100%;overflow-x:auto;scrollbar-width:none}.mode-tab{min-width:auto;height:33px;padding:0 12px;font-size:10px}.filter-row{justify-content:flex-start;padding-bottom:2px}.filter-group{gap:6px}.filter-chip{min-height:31px;padding:0 12px;font-size:9px}.sample-banner{justify-content:flex-start;flex-wrap:wrap;gap:5px 7px;padding:0 3px;font-size:8px}.sample-banner strong{font-size:9px}.feed-layout{display:block;width:min(640px,100%)}.queue-panel{display:none}.clip-scroll{height:clamp(480px,calc(100dvh - 196px),760px);min-height:480px;padding:0;scrollbar-width:none}.clip-scroll::-webkit-scrollbar{display:none}.sample-reel{border-radius:15px}.reel-top{top:11px;right:11px;left:11px}.clip-label,.preview-label{min-height:24px;padding:0 8px;font-size:7px}.reel-caption{max-width:82%;padding:0 17px 17px}.reel-caption h2{font-size:clamp(32px,9vw,50px)}.reel-caption p{font-size:9px}.reel-ui{right:8px;bottom:90px;gap:12px}.reel-tool svg{width:21px;height:21px}.reel-meta{padding:0 15px 9px}.reel-meta .creator-avatar{width:34px;height:34px}.reel-description{padding:0 15px 10px;font-size:8px}.reel-progress{margin:0 15px 12px}.preview-footer{flex-direction:column;margin-top:9px;font-size:7px}.preview-footer span:last-child{text-align:left}.live-stage{top:33%;gap:10px;padding:10px 13px}.stage-avatar{width:49px;height:49px}}
@media(max-width:430px){.topbar{grid-template-columns:auto minmax(80px,1fr) auto;gap:7px;padding-inline:9px}.menu-toggle{display:none}.brand-area{gap:0}.brand{font-size:9px;letter-spacing:.12em}.brand-mark{width:28px;height:28px;font-size:19px}.signin-link{min-height:31px;padding:0 7px;font-size:8px}.join-link{min-height:31px;padding:0 8px;font-size:8px}.global-search{height:33px;padding-inline:8px}.global-search input{font-size:9px}.preview-main{padding-inline:9px}.filter-row{gap:8px}.filter-chip{padding-inline:10px}.filter-divider{height:18px}.clip-scroll{height:calc(100dvh - 185px);min-height:430px}.sample-play{width:48px;height:48px;font-size:13px}.reel-ui{bottom:84px}.reel-tool small{font-size:7px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important}}
.mode-row{position:relative;display:flex;width:min(1500px,100%);align-items:center;justify-content:center}.scroll-hint{position:absolute;right:0;display:flex;align-items:center;gap:8px;color:#8e858d;font-size:9px}.scroll-hint button{display:grid;width:35px;height:35px;place-items:center;border:1px solid var(--line-strong);border-radius:10px;color:#e9dfe5;background:rgba(255,255,255,.035);font-size:16px;cursor:pointer}.scroll-hint button:hover{border-color:rgba(255,131,173,.44);color:#ff9abd;background:rgba(242,11,114,.08)}.feed-layout{width:min(1500px,100%);grid-template-columns:minmax(200px,.9fr) minmax(400px,1.55fr) minmax(240px,.9fr)}.preview-footer{max-width:1500px}.queue-tools{display:flex;align-items:center;gap:8px}.autoplay-label{color:#c8bec4;font-size:8px;font-weight:600}.autoplay-toggle{position:relative;width:36px;height:21px;flex:none;padding:0;border:1px solid rgba(255,255,255,.19);border-radius:999px;background:#2b252c;cursor:pointer;transition:background .18s}.autoplay-toggle span{position:absolute;top:3px;left:3px;width:13px;height:13px;border-radius:50%;background:#aaa0a7;transition:transform .18s,background .18s}.autoplay-toggle[aria-checked="true"]{border-color:var(--pink);background:var(--pink)}.autoplay-toggle[aria-checked="true"] span{transform:translateX(15px);background:#fff}.sample-reel.progress-0 .reel-progress:before{width:31%}.sample-reel.progress-1 .reel-progress:before{width:44%}.sample-reel.progress-2 .reel-progress:before{width:55%}.sample-reel.progress-3 .reel-progress:before{width:62%}.sample-reel.progress-4 .reel-progress:before{width:70%}.sample-reel.progress-5 .reel-progress:before{width:76%}.sample-reel.progress-6 .reel-progress:before{width:81%}.sample-reel.progress-7 .reel-progress:before{width:85%}.sample-reel.progress-8 .reel-progress:before{width:89%}.sample-reel.progress-9 .reel-progress:before{width:92%}.icon-rail,.preview-main{transition:width .2s,margin .2s}.icon-rail.expanded{width:174px;align-items:stretch;padding-inline:12px}.icon-rail.expanded .rail-link{display:flex;width:100%;justify-content:flex-start;gap:13px;padding:0 13px}.icon-rail.expanded .rail-link:after{content:attr(data-label);color:#c6bbc3;font-size:11px;font-weight:600}.icon-rail.expanded .rail-link:hover:after,.icon-rail.expanded .rail-link.is-active:after{color:#ff91b8}.preview-page.nav-open .preview-main{margin-left:174px}
@media(max-width:1120px){.feed-layout{width:min(1080px,100%);grid-template-columns:minmax(360px,1fr) minmax(230px,300px)}.scroll-hint{display:none}}
@media(max-width:760px){.mode-row{width:100%}.feed-layout{width:min(640px,100%);grid-template-columns:1fr}.icon-rail.expanded{display:none}.preview-page.nav-open .icon-rail{position:fixed;top:62px;bottom:0;left:0;display:flex;width:190px;align-items:stretch;padding:14px 12px;border-right:1px solid var(--line-strong);background:rgba(15,11,16,.97);box-shadow:18px 0 44px rgba(0,0,0,.45)}.preview-page.nav-open .icon-rail .rail-link{display:flex;width:100%;justify-content:flex-start;gap:13px;padding:0 13px}.preview-page.nav-open .icon-rail .rail-link:after{content:attr(data-label);color:#c6bbc3;font-size:11px;font-weight:600}.preview-page.nav-open .preview-main{margin-left:0}}
.creator-panel{padding:15px 13px 12px}.panel-copy{margin:9px 0 5px}.creator-list{gap:0;margin:4px 0 8px}.creator-row{min-height:39px;grid-template-columns:21px 28px minmax(0,1fr) 12px;gap:7px;padding:3px 2px}.creator-avatar{width:28px;height:28px}.creator-copy strong{font-size:9px}.creator-copy small{margin-top:3px;font-size:7px}.panel-foot{padding:8px 0}.panel-live-link{min-height:34px;margin-top:8px}.outline-action{min-height:34px;margin-top:6px}
button.signin-link{background:transparent;cursor:pointer}.signin-link[hidden]{display:none}.signin-link:disabled{color:#92d5b4;border-color:rgba(85,216,155,.22);cursor:default}