:root{color-scheme:dark;--bg:#09090d;--panel:#111117;--panel2:#17171f;--line:#292933;--muted:#92929f;--text:#f7f7fa;--pink:#ed1455;--pink2:#ff4778;--cyan:#75e7df;--radius:18px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:"DM Sans",sans-serif;font-size:15px}button,input,select{font:inherit}button{cursor:pointer;color:inherit}.hidden{display:none!important}.muted{color:var(--muted)}.app-shell{min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:248px;padding:27px 18px 18px;background:#0d0d12;border-right:1px solid var(--line);display:flex;flex-direction:column;z-index:20}.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:white;font:700 17px "Space Grotesk";letter-spacing:-.5px;padding:0 8px 42px}.brand-light{color:#a4a4b0}.brand-mark{width:38px;height:38px;border-radius:12px;background:linear-gradient(145deg,#ff376f,#bd073e);display:grid;place-items:center;font:700 25px "Space Grotesk";box-shadow:0 7px 24px #e9165540}.brand-mark.large{width:58px;height:58px;font-size:34px;margin:0 auto 20px;border-radius:17px}.side-label{font-size:10px;font-weight:800;letter-spacing:1.7px;color:#666674;padding:0 12px 12px}.second-label{margin-top:31px}.side-nav{display:grid;gap:5px}.nav-link{border:0;background:transparent;color:#a4a4b0;text-align:left;display:flex;align-items:center;gap:13px;padding:12px 13px;border-radius:11px;font-weight:600;transition:.2s}.nav-link>span{font-size:20px;width:22px;text-align:center;color:#858592}.nav-link:hover,.nav-link.active{background:#20121a;color:white}.nav-link.active>span,.nav-link:hover>span{color:var(--pink2)}.tiny-pro{font-style:normal;font-size:9px;letter-spacing:1px;color:#ff8baa;background:#421325;padding:3px 6px;border-radius:5px;margin-left:auto}.sidebar-bottom{margin-top:auto}.pro-card{background:linear-gradient(145deg,#24101b,#15131b);border:1px solid #57233a;border-radius:15px;padding:15px;margin:0 3px 15px}.pro-icon{color:#ff6592;font-size:21px}.pro-card strong{display:block;margin:8px 0 4px}.pro-card p{font-size:12px;line-height:1.55;color:#aaa3ad;margin:0 0 13px}.side-foot{font-size:10px;color:#686875;padding:14px 12px 0}.main{margin-left:248px;min-height:100vh;display:flex;flex-direction:column}.topbar{height:76px;position:sticky;top:0;z-index:15;background:#0b0b10eF;backdrop-filter:blur(18px);border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 42px;gap:25px}.search-box{height:43px;max-width:510px;flex:1;border:1px solid #33313b;border-radius:12px;background:#14141b;display:flex;align-items:center;padding:0 13px;gap:10px;color:#888}.search-box:focus-within{border-color:#a92b53;box-shadow:0 0 0 3px #ed14551a}.search-box>span{font-size:23px}.search-box input{border:0;outline:0;background:transparent;color:white;width:100%;font-size:13px}.search-box kbd{font-size:10px;border:1px solid #383843;border-radius:5px;padding:3px 6px}.top-actions{display:flex;align-items:center;gap:12px;margin-left:auto}.btn{border:0;border-radius:10px;padding:12px 17px;font-weight:700;transition:.2s}.btn:hover{transform:translateY(-1px);filter:brightness(1.1)}.btn-primary{background:linear-gradient(110deg,#f01a5c,#c90c49);color:white;box-shadow:0 7px 20px #e914542b}.btn-outline{background:transparent;border:1px solid #633048;color:#ff80a4}.btn-ghost{background:#22222b;border:1px solid #3a3a46}.btn-glass{background:#ffffff0c;border:1px solid #ffffff25}.btn-small{padding:9px 13px;font-size:12px}.avatar{width:38px;height:38px;border-radius:50%;border:1px solid #4a3942;background:#24131c;color:#ff8aaa;font-weight:800}.content{width:min(1440px,100%);margin:0 auto;padding:34px 42px 45px;flex:1}.hero{min-height:340px;border:1px solid #32202b;border-radius:23px;background:radial-gradient(ellipse at 75% 45%,#4b152b 0,transparent 39%),linear-gradient(115deg,#191017,#111117 60%,#1b1018);padding:42px 45px;display:grid;grid-template-columns:1.15fr .85fr;align-items:center;overflow:hidden;position:relative}.hero:after{content:"";position:absolute;width:390px;height:390px;border:1px solid #ffffff0b;border-radius:50%;right:6%;top:-25%}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:800;color:#e86b91;margin:0 0 13px}.live-dot{display:inline-block;width:7px;height:7px;background:#ff4778;border-radius:50%;box-shadow:0 0 12px #ff4778;margin-right:7px}.hero h1{font:700 clamp(34px,4vw,54px)/1.06 "Space Grotesk";letter-spacing:-2px;margin:0}.hero h1 span{color:#ff4778}.hero-copy>p:not(.eyebrow){max-width:470px;color:#aaa3ad;line-height:1.7;font-size:14px;margin:17px 0 22px}.hero-actions{display:flex;gap:10px;flex-wrap:wrap}.hero-meta{display:flex;gap:18px;flex-wrap:wrap;color:#99919c;font-size:11px;margin-top:25px}.hero-art{height:245px;position:relative;display:grid;place-items:center}.art-glow{position:absolute;width:230px;height:200px;background:#ef14554a;filter:blur(65px);border-radius:50%}.art-window{width:min(330px,90%);height:205px;border:1px solid #ffffff2a;border-radius:17px;background:linear-gradient(145deg,#3b2432,#171820 65%);box-shadow:0 25px 70px #0008;position:relative;padding:15px;transform:rotate(4deg);z-index:1}.art-top{display:flex;justify-content:space-between;font-size:8px;letter-spacing:1px;color:#c5b7c0}.art-live{color:#ff7097}.art-play{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);width:55px;height:55px;display:grid;place-items:center;border-radius:50%;background:#f01a5c;color:white;padding-left:4px;box-shadow:0 0 0 12px #f01a5c22}.art-bottom{position:absolute;bottom:15px;left:17px;right:17px;display:flex;align-items:end;justify-content:space-between}.art-bottom b{font:700 18px/1.05 "Space Grotesk"}.art-bottom span{font-size:8px;color:#c3a9b6}.floating-tag{position:absolute;bottom:2px;right:4%;z-index:2;background:#21131d;border:1px solid #723049;border-radius:8px;padding:9px 12px;font-size:9px;letter-spacing:1px;color:#ff8aaa;transform:rotate(-5deg)}.section-heading{display:flex;align-items:end;justify-content:space-between;margin:39px 0 18px}.section-heading h2{font:700 25px "Space Grotesk";margin:0;letter-spacing:-.6px}.section-heading .eyebrow{margin-bottom:6px}.text-link{border:0;background:none;color:#ff7299;font-weight:700;font-size:12px}.text-link span{font-size:17px;margin-left:5px}.video-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:21px}.video-card{min-width:0;cursor:pointer}.thumb{position:relative;aspect-ratio:16/10;overflow:hidden;border-radius:13px;background:linear-gradient(135deg,#29212b,#15151d);border:1px solid #ffffff12}.thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}.video-card:hover .thumb img{transform:scale(1.055)}.thumb-placeholder{width:100%;height:100%;display:grid;place-items:center;background:radial-gradient(circle at 65% 35%,#5b263c,#211722 60%,#15151b);font:700 36px "Space Grotesk";color:#ff7199}.duration{position:absolute;bottom:9px;right:9px;background:#08080dcc;padding:4px 7px;border-radius:5px;font-size:10px}.exclusive-tag{position:absolute;top:10px;left:10px;background:#10151bdf;border:1px solid #69d9d2;color:#8ce8df;border-radius:6px;padding:5px 7px;font-size:9px;font-weight:800}.save-btn{position:absolute;top:8px;right:8px;width:30px;height:30px;border:1px solid #ffffff30;border-radius:8px;background:#11111199;font-size:16px}.video-info{padding:11px 2px 0}.video-info h3{font-size:13px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0 0 6px}.video-info p{font-size:11px;color:#898995;margin:0}.section-spaced{margin-top:48px}.section-subtitle{font-size:12px;margin:7px 0 0}.filter-row{display:flex;align-items:center;justify-content:space-between;margin:20px 0}.filter-tabs{display:flex;gap:8px}.filter-tab{background:transparent;border:1px solid #353540;color:#aaaab5;border-radius:9px;padding:9px 15px;font-size:12px;font-weight:700}.filter-tab.active{background:#e81755;border-color:#e81755;color:white}.filter-tab span{color:#ffb2c8}.sort-select{background:#15151d;border:1px solid #34343e;color:#ccc;border-radius:8px;padding:9px 11px;font-size:11px}.loading-card{grid-column:1/-1;color:#888;padding:30px 0}.empty-state{text-align:center;padding:45px 0;color:#999}.empty-state>div{font-size:38px}.empty-state h3{color:white}.pagination{display:flex;justify-content:center;gap:8px;padding:28px}.page-btn{background:#17171f;border:1px solid #33333d;border-radius:8px;padding:8px 12px}.page-btn.active{background:#e81755;border-color:#e81755}.footer{border-top:1px solid var(--line);padding:20px 42px;display:flex;justify-content:space-between;gap:15px;color:#777783;font-size:10px}.footer button{border:0;background:none;color:#ff7da0;font-size:10px}.mobile-menu,.mobile-brand{display:none}.modal-backdrop{position:fixed;inset:0;z-index:50;background:#000b;backdrop-filter:blur(8px);display:grid;place-items:center;padding:18px}.modal{position:relative;width:min(540px,100%);max-height:90vh;overflow:auto;background:#13131a;border:1px solid #37313b;border-radius:20px;padding:30px;box-shadow:0 30px 100px #000a}.modal-close{position:absolute;right:16px;top:13px;border:0;background:#24242d;border-radius:8px;width:32px;height:32px;font-size:22px;color:#aaa}.modal h2{font:700 25px "Space Grotesk";margin:0 35px 8px 0}.modal p{color:#a4a4af;font-size:13px;line-height:1.6}.form-stack{display:grid;gap:13px;margin-top:20px}.field{display:grid;gap:7px}.field label{font-size:11px;color:#bcbcc6;font-weight:700}.field input,.field select,.field textarea{width:100%;background:#0c0c12;border:1px solid #383843;border-radius:9px;padding:12px;color:white;outline:none}.field input:focus,.field textarea:focus{border-color:#d83769}.form-stack .btn{width:100%}.form-foot{text-align:center;font-size:12px!important}.inline-link{color:#ff7098;border:0;background:none;padding:0;font-weight:700}.plans{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:20px 0}.plan{border:1px solid #38313b;border-radius:13px;padding:15px;background:#19171e}.plan.featured{border-color:#e52b64;background:#28131e}.plan h3{font-size:14px;margin:0 0 8px}.plan strong{font:700 23px "Space Grotesk"}.plan p{font-size:11px;margin:7px 0}.plan button{width:100%;margin-top:9px}.status-pill{display:inline-block;padding:5px 8px;border-radius:6px;background:#332b17;color:#f4cb78;font-size:10px;font-weight:800}.status-pill.approved{background:#12352b;color:#7ee0b2}.video-player{width:100%;aspect-ratio:16/9;background:#050508;border-radius:12px;display:grid;place-items:center;margin:16px 0;overflow:hidden}.video-player video{width:100%;height:100%;object-fit:contain}.admin-list{display:grid;gap:10px;margin-top:15px}.admin-row{padding:13px;border:1px solid #33313b;border-radius:10px;display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:12px}.admin-row small{display:block;color:#999;margin-top:4px}.admin-actions{display:flex;gap:6px}.admin-actions button{font-size:10px;padding:7px;border-radius:6px;border:1px solid #45414a;background:#222}.toast-region{position:fixed;right:20px;bottom:20px;z-index:100;display:grid;gap:8px}.toast{background:#25232b;border:1px solid #4a414c;padding:12px 16px;border-radius:10px;box-shadow:0 10px 30px #0008;font-size:12px}.age-gate{position:fixed;inset:0;z-index:200;background:radial-gradient(circle at 50% 40%,#30101f,#09090d 60%);display:grid;place-items:center;padding:20px}.age-card{width:min(460px,100%);text-align:center;background:#111117;border:1px solid #44303b;border-radius:22px;padding:36px 30px;box-shadow:0 25px 90px #0009}.age-card h1{font:700 30px/1.15 "Space Grotesk";margin:8px 0 12px}.age-card h1 span{color:#ff5483}.age-card>p:not(.eyebrow){font-size:13px;line-height:1.7}.age-actions{display:grid;gap:9px;margin:22px 0 16px}.age-card small{color:#777;font-size:10px;line-height:1.5}.age-card .eyebrow{font-size:9px}.mobile-brand .brand-mark{width:31px;height:31px;font-size:20px;border-radius:9px}@media(max-width:1150px){.video-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.content{padding-inline:28px}.topbar{padding-inline:28px}.hero{padding:34px}.hero-art{transform:scale(.9)}}@media(max-width:800px){.sidebar{transform:translateX(-105%);transition:transform .25s;box-shadow:20px 0 60px #0008}.sidebar.open{transform:translateX(0)}.main{margin-left:0}.topbar{height:65px;padding:0 16px;gap:12px}.mobile-menu{display:block}.mobile-brand{display:flex;align-items:center;gap:8px;text-decoration:none;color:white;font:700 12px "Space Grotesk";white-space:nowrap}.search-box{margin-left:auto;max-width:230px;height:39px}.search-box kbd{display:none}.top-actions .btn{display:none}.content{padding:20px 16px 35px}.hero{grid-template-columns:1fr;padding:27px 23px;min-height:unset}.hero h1{font-size:40px}.hero-art{height:190px;margin-top:12px}.art-window{height:165px}.hero-meta{gap:10px;font-size:9px}.video-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:17px 12px}.section-heading h2{font-size:22px}.footer{padding:17px;flex-wrap:wrap}.footer span:last-of-type{order:3;width:100%}}@media(max-width:390px){.mobile-brand{font-size:0}.mobile-brand .brand-mark{font-size:20px}.search-box{max-width:none}.hero h1{font-size:34px}.video-info h3{font-size:12px}.modal{padding:25px 19px}.plans{grid-template-columns:1fr}}
.upload-promo{margin:16px 0;padding:15px 16px;border:1px solid #573047;border-radius:12px;background:linear-gradient(135deg,#24131d,#17151d)}.upload-promo strong{display:block;color:#fff;font-size:13px}.upload-promo p{margin:7px 0;color:#d0c2cb;font-size:12px;line-height:1.65}.upload-promo small{display:block;color:#a99aa4;font-size:10px;line-height:1.55}

.qris-payment{margin:18px 0;padding:16px;border:1px solid var(--border,#30303a);border-radius:14px;background:var(--card,#111)}.qris-payment h3{margin:0 0 7px;font-size:16px}.qris-payment p,.qris-payment small{display:block;color:var(--muted,#aaa);font-size:12px;line-height:1.6}.qris-payment img{display:block;width:min(100%,360px);height:auto;object-fit:contain;margin:14px auto;border-radius:8px;background:#fff}.qris-payment small{text-align:center}

/* Easier mobile navigation and slide dismissal */
.sidebar-close{display:none}
.sidebar-overlay{display:none}
@media(max-width:800px){
 .sidebar{padding-top:76px}
 .sidebar-close{display:grid;place-items:center;position:absolute;top:18px;right:16px;width:40px;height:40px;border:1px solid #393541;border-radius:11px;background:#211e27;color:#fff;font-size:27px;line-height:1;z-index:2}
 .sidebar-overlay.visible{display:block;position:fixed;inset:0;background:rgba(0,0,0,.68);backdrop-filter:blur(2px);z-index:19}
 .sidebar{z-index:20}
 body.sidebar-open{overflow:hidden}
 .modal-backdrop{padding:10px;align-items:center}
 .modal{max-height:calc(100dvh - 20px);overflow-y:auto;overscroll-behavior:contain;padding-top:58px}
 .modal-close{position:sticky;float:right;top:-45px;margin-top:-42px;margin-right:-10px;z-index:5;width:38px;height:38px;font-size:26px;background:#34313d;color:#fff;box-shadow:0 3px 12px #0008}
}


/* Reliable close controls and visible payment states */
.modal-close{position:absolute!important;top:12px!important;right:12px!important;float:none!important;margin:0!important;z-index:100!important;display:grid;place-items:center;pointer-events:auto;cursor:pointer;width:38px;height:38px;background:#34313d;color:#fff;border:1px solid #514b5b;border-radius:10px;font-size:26px;line-height:1}
.modal{position:relative}
.payment-history{margin-top:22px;padding-top:16px;border-top:1px solid #37313b}
.payment-history h3,.admin-qris h3{font-size:15px;margin:0 0 12px}
.payment-status-row{padding:12px 0;border-bottom:1px solid #302d37}
.payment-status-row strong,.payment-status-row small{display:block}
.payment-status-row strong{font-size:12px;margin-bottom:8px}
.payment-status-row small{font-size:10px;color:#9995a2;margin-top:6px}
.status-pill{display:inline-flex;align-items:center;width:max-content;padding:6px 9px;border-radius:999px;background:#292630;color:#d9d3df;font-size:10px;font-weight:700}
.status-pill.pending{background:#3b2d17;color:#ffd48a}
.status-pill.approved{background:#173a2b;color:#8be0b0}
.status-pill.rejected{background:#421e2a;color:#ff9eb3}
.qris-missing{padding:24px 14px;border:1px dashed #66505b;border-radius:12px;text-align:center;color:#d7b9c4;font-size:12px;line-height:1.6;background:#1b151d}
.admin-qris{margin:0 0 22px;padding:16px;border:1px solid #39313e;border-radius:14px;background:#17141b}
.admin-qris small{display:block;margin-top:10px;color:#a9a2ad;font-size:11px;line-height:1.5}
.admin-qris-preview{display:block;max-width:min(100%,260px);max-height:260px;object-fit:contain;background:#fff;border-radius:10px;padding:8px;margin:12px auto}
.payment-pending{text-align:left}
.payment-pending .pending-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:#3b2d17;color:#ffd48a;font-size:27px;margin-bottom:14px}
.payment-summary{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:14px;margin:18px 0;border:1px solid #39313e;border-radius:12px;background:#19161e}
.payment-summary span{font-size:11px;color:#aaa2b0}
.payment-summary strong{font-size:12px;text-align:right}
.payment-summary .pending-text{color:#ffd48a}
.video-card[role=button]{cursor:pointer}
.video-card[role=button]:focus-visible{outline:2px solid var(--pink2);outline-offset:4px}
@media(max-width:800px){.modal-close{top:10px!important;right:10px!important}.modal{padding-top:58px}}


/* Video player: natural aspect ratio, usable native controls and optional zoom */
.modal-backdrop.player-mode{position:fixed;inset:0;z-index:150;padding:0;display:block;overflow-y:auto;background:rgba(3,3,7,.98);backdrop-filter:blur(14px)}
.modal-backdrop.player-mode.hidden{display:none!important}
.modal.player-modal{position:relative;width:100%;max-width:none;min-height:100dvh;max-height:none;margin:0;padding:0;overflow:visible;border:0;border-radius:0;background:#08080c;box-shadow:none}
.modal.player-modal>.modal-close{display:none!important}
.player-page{width:min(1180px,100%);min-height:100dvh;margin:0 auto;padding:16px 28px 44px}
.player-toolbar{min-height:48px;display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.player-brand{font:800 12px "Space Grotesk";letter-spacing:1.3px;color:#f7f7fa}
.player-brand i{font-style:normal;color:#777783;font-weight:500}
.player-actions{display:flex;align-items:center;gap:8px}
.player-tool,.player-close{min-height:38px;padding:0 13px;border:1px solid #393944;border-radius:10px;background:#17171f;color:#f5f5f7;font-size:12px;font-weight:700}
.player-tool[aria-pressed="true"]{border-color:#ed1455;background:#351321;color:#ff9ab7}
.player-close{width:40px;padding:0;border-radius:50%;font-size:25px;line-height:1}
.player-title{margin:0 0 14px;font:700 clamp(18px,2.4vw,25px) "Space Grotesk";overflow-wrap:anywhere}
.modal.player-modal .video-player{display:flex;align-items:center;justify-content:center;width:100%;height:auto;min-height:0;aspect-ratio:auto;margin:0 auto 14px;overflow:hidden;border:1px solid #292933;border-radius:12px;background:#000}
.modal.player-modal .video-player video{display:block;width:100%;height:auto;max-height:calc(100dvh - 150px);object-fit:contain;background:#000;transform:scale(1);transform-origin:center;transition:transform .2s ease}
.modal.player-modal .video-player video.video-zoomed{transform:scale(1.25);cursor:zoom-out}
.player-description{max-width:900px;margin:10px 0 0;color:#a5a5b1;font-size:13px;line-height:1.7}
.player-hint{margin:9px 0 0;color:#747481;font-size:11px;line-height:1.6}
.player-error{padding:30px 16px;text-align:center;color:#ff9ab4;font-size:13px}
.video-player:fullscreen{width:100vw;height:100vh;max-width:none;max-height:none;aspect-ratio:auto;background:#000}
.video-player:fullscreen video{width:100%;height:100%;max-height:100vh;object-fit:contain}
@media(max-width:700px){
 .player-page{padding:10px 12px 28px}
 .player-toolbar{align-items:center;margin-bottom:12px}
 .player-brand{font-size:10px;letter-spacing:.8px}
 .player-actions{gap:5px}
 .player-tool{min-height:36px;padding:0 9px;font-size:10px}
 .player-close{width:36px;min-height:36px;font-size:23px}
 .modal.player-modal .video-player{border-radius:8px}
 .modal.player-modal .video-player video{max-height:calc(100dvh - 125px)}
 .player-title{font-size:18px}
}
@media(max-width:380px){.player-brand{display:none}.player-toolbar{justify-content:flex-end}}


/* Video player controls: keep zoom visible and controls usable on narrow screens */
.modal.player-modal .video-player.video-zoom-active{overflow:visible}
@media(max-width:700px){
 .player-toolbar{flex-wrap:wrap}
 .player-brand{display:none}
 .player-actions{width:100%;justify-content:flex-end;flex-wrap:wrap}
}


/* ASUPANMEME player v2: intrinsic-ratio frame and always-visible play/pause */
.modal.player-modal .video-player{
 display:flex;
 flex-direction:column;
 align-items:center;
 justify-content:flex-start;
 gap:12px;
 width:100%;
 height:auto;
 min-height:0;
 aspect-ratio:auto;
 overflow:visible;
 padding:0 0 14px;
 border:0;
 background:transparent;
}
.modal.player-modal .video-frame{
 display:block;
 position:relative;
 width:100%;
 max-width:100%;
 max-height:72dvh;
 aspect-ratio:16 / 9;
 margin:0 auto;
 overflow:hidden;
 border:1px solid #33333d;
 border-radius:12px;
 background:#000;
}
.modal.player-modal .video-frame video{
 display:block;
 width:100%;
 height:100%;
 max-height:72dvh;
 object-fit:contain;
 background:#000;
 transform:none;
}
.modal.player-modal .video-frame video.video-zoomed{
 transform:scale(1.18);
}
.video-controls{
 display:flex;
 align-items:center;
 justify-content:flex-start;
 gap:12px;
 width:100%;
 max-width:100%;
 padding:11px 13px;
 border:1px solid #34313c;
 border-radius:12px;
 background:#14131a;
}
.video-play-button{
 display:inline-flex;
 align-items:center;
 justify-content:center;
 min-width:142px;
 min-height:42px;
 padding:0 17px;
 border:1px solid #ff4778;
 border-radius:10px;
 background:linear-gradient(110deg,#ed1455,#bd0c45);
 color:#fff;
 font-size:13px;
 font-weight:800;
 box-shadow:0 6px 20px #ed145533;
}
.video-play-button[aria-pressed="true"]{background:#29202a;border-color:#765064}
.video-status{color:#aaa5b1;font-size:12px}
.video-frame:fullscreen{
 width:100vw!important;
 height:100vh!important;
 max-width:100vw!important;
 max-height:100vh!important;
 aspect-ratio:auto!important;
 border:0;
 border-radius:0;
}
.video-frame:fullscreen video{width:100%;height:100%;max-height:100vh;object-fit:contain}
.modal.player-modal .player-hint{margin-top:0}

/* Compact, balanced login and registration dialogs */
.modal.auth-modal{
 width:min(430px,calc(100vw - 28px));
 max-width:430px;
 max-height:min(86dvh,720px);
 padding:28px 28px 24px;
 border-radius:18px;
 overflow-y:auto;
}
.modal.auth-modal h2{
 margin:0 34px 8px 0;
 font-size:22px;
 line-height:1.2;
}
.modal.auth-modal>p:not(.eyebrow){font-size:12px;line-height:1.55;margin:9px 0}
.modal.auth-modal .form-stack{gap:10px;margin-top:16px}
.modal.auth-modal .field{gap:6px}
.modal.auth-modal .field label{font-size:11px}
.modal.auth-modal .field input{
 min-height:43px;
 padding:10px 12px;
 border-radius:9px;
 font-size:13px;
}
.modal.auth-modal .form-stack>.btn{min-height:43px;font-size:13px}
.modal.auth-modal .form-foot{margin:14px 0 0;font-size:11px!important}
.modal.auth-modal .modal-close{top:12px!important;right:12px!important}
@media(max-width:600px){
 .modal.auth-modal{
  width:min(400px,calc(100vw - 24px));
  max-height:calc(100dvh - 28px);
  padding:24px 20px 20px;
  border-radius:16px;
 }
 .modal.auth-modal h2{font-size:20px}
 .modal.auth-modal .field input{min-height:42px}
 .modal.player-modal .player-page{padding:10px 12px 26px}
 .modal.player-modal .video-frame{max-height:68dvh;border-radius:8px}
 .modal.player-modal .video-frame video{max-height:68dvh}
 .video-controls{padding:9px;gap:9px}
 .video-play-button{min-width:130px;min-height:40px;padding:0 12px;font-size:12px}
 .video-status{font-size:11px}
}


/* Fullscreen sizing override for the intrinsic-ratio video frame */
.modal.player-modal .video-frame:fullscreen{width:100vw!important;height:100vh!important;max-width:100vw!important;max-height:100vh!important;aspect-ratio:auto!important;border:0;border-radius:0}
.modal.player-modal .video-frame:fullscreen video{width:100%;height:100%;max-height:100vh;object-fit:contain}


/* Membership payment notice: clear hierarchy, readable spacing, responsive layout */
.payment-notice{
 display:block;
 margin:18px 0 20px;
 padding:16px 18px;
 border:1px solid rgba(226,174,91,.34);
 border-left:3px solid #d7a451;
 border-radius:13px;
 background:linear-gradient(135deg,rgba(112,77,29,.20),rgba(34,29,25,.72));
 box-shadow:0 8px 24px rgba(0,0,0,.12);
 color:#eee7dc;
}
.payment-notice-heading{
 display:flex;
 align-items:center;
 gap:10px;
 margin:0 0 9px;
}
.payment-notice-heading strong{
 color:#f3d49e;
 font-size:13px;
 line-height:1.45;
 letter-spacing:.1px;
}
.payment-notice-icon{
 display:inline-grid;
 flex:0 0 23px;
 width:23px;
 height:23px;
 place-items:center;
 border:1px solid rgba(235,190,116,.48);
 border-radius:50%;
 background:rgba(215,164,81,.14);
 color:#f1c77e;
 font-size:13px;
 font-weight:800;
}
.payment-notice p{
 margin:0;
 color:#d0c7ba;
 font-size:12px;
 line-height:1.75;
 overflow-wrap:anywhere;
}
.payment-notice-compact{
 margin:14px 0 18px;
 padding:14px 15px;
}
.payment-notice-compact .payment-notice-heading{margin-bottom:7px}
.payment-notice-compact p{font-size:11.5px;line-height:1.7}
@media(max-width:600px){
 .payment-notice{margin:14px 0 17px;padding:13px 14px;border-radius:11px}
 .payment-notice-heading{align-items:flex-start;gap:8px}
 .payment-notice-heading strong{font-size:12px}
 .payment-notice p{font-size:11px;line-height:1.7}
 .payment-notice-compact{padding:12px 13px}
}

/* Compact pagination, avoid horizontal page expansion */
.content{padding-top:26px}
.pagination{display:flex;justify-content:center;align-items:center;width:100%;max-width:100%;padding:24px 0 8px;overflow:hidden}
.pagination-controls{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:7px;max-width:100%;min-width:0}
.page-btn{min-width:38px;height:38px;padding:0 10px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;color:#e7e5eb;white-space:nowrap}
.page-btn.page-arrow{font-size:20px}
.page-ellipsis{padding:0 2px;color:#777783}
.recommendation-pagination{display:flex;justify-content:center;align-items:center;max-width:100%;padding:18px 0 2px;overflow:hidden}
.recommendation-pagination .pagination-controls{gap:6px}
.recommendation-pagination .page-btn{min-width:34px;height:34px}
.video-grid,.recommendation-grid{min-width:0;max-width:100%}
@media(max-width:520px){
 .content{padding-top:20px}
 .pagination{padding-top:20px}
 .pagination-controls{gap:5px}
 .page-btn{min-width:34px;height:34px;padding:0 8px}
 .recommendation-pagination .page-btn{min-width:32px;height:32px}
}

/* Creator upload dialog: refined hierarchy, spacing and file-field presentation */
.upload-dialog{width:100%;max-width:620px;margin:0 auto}
.upload-dialog-heading{margin:0 0 20px;padding:2px 2px 17px;border-bottom:1px solid #302d38}
.upload-kicker{display:inline-block;margin-bottom:9px;color:#ed7b9b;font-size:9px;font-weight:800;letter-spacing:1.7px}
.upload-dialog-heading h2{margin:0 34px 7px 0;font:700 clamp(22px,4vw,28px) "Space Grotesk";letter-spacing:-.7px}
.upload-dialog-heading>p{margin:0;color:#aaa5b1;font-size:12px;line-height:1.65}
.upload-promo{display:flex;align-items:flex-start;gap:13px;margin:0 0 22px;padding:15px 16px;border:1px solid #45313d;border-radius:13px;background:linear-gradient(125deg,rgba(111,34,62,.24),rgba(28,25,34,.94))}
.upload-promo-mark{display:grid;flex:0 0 34px;width:34px;height:34px;place-items:center;border:1px solid #774056;border-radius:10px;background:#321d2a;color:#ff8eaf;font-size:16px}
.upload-promo strong{display:block;color:#f8edf1;font-size:12px;line-height:1.5}
.upload-promo p{margin:4px 0;color:#c2b7c0;font-size:11px;line-height:1.65}
.upload-promo small{display:block;color:#9f929e;font-size:10px;line-height:1.55}
.upload-form{gap:14px}
.upload-section-label{margin:2px 0 -3px;color:#ed8aa7;font-size:9px;font-weight:800;letter-spacing:1.45px}
.upload-form .field{gap:7px}
.upload-form .field label{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:5px;color:#eeeaf0;font-size:11px;font-weight:700}
.upload-form .field label>span{color:#8e8995;font-size:9px;font-weight:500}
.field-optional{color:#8f8997;font-size:8px;font-weight:700;letter-spacing:.7px}
.upload-form input:not([type=file]),.upload-form textarea,.upload-form select{width:100%;border:1px solid #393541;border-radius:10px;background:#121118;color:#f7f4f8;padding:12px 13px;font-size:12px;outline:none;transition:border-color .18s,box-shadow .18s}
.upload-form input:focus,.upload-form textarea:focus,.upload-form select:focus{border-color:#c94b72;box-shadow:0 0 0 3px #c94b721c}
.upload-form input[type=file]{width:100%;min-height:48px;padding:9px;border:1px dashed #514653;border-radius:10px;background:#15131b;color:#bcb5c2;font-size:10px}
.upload-form input[type=file]::file-selector-button{margin-right:10px;padding:8px 11px;border:1px solid #604052;border-radius:7px;background:#30202b;color:#ffd9e4;font-size:10px;font-weight:700;cursor:pointer}
.upload-submit{display:flex;align-items:center;justify-content:space-between;min-height:47px;margin-top:5px;padding:0 16px;border-radius:11px;font-size:12px}
@media(max-width:600px){.upload-dialog-heading{margin-bottom:16px;padding-bottom:14px}.upload-promo{gap:10px;padding:12px}.upload-form{gap:12px}.upload-form .field label{font-size:10px}.upload-form input[type=file]{font-size:9px}}
