:root{
    color-scheme:dark;
    --bg:#07101c;
    --panel:#0c1320;
    --panel-2:#111b2c;
    --line:rgba(104,214,255,.22);
    --gold:#f4c873;
    --gold-2:#fff0bd;
    --amber:#c8923a;
    --mint:#53e4d7;
    --text:#f7fbff;
    --muted:#aeb9c8;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
*{-webkit-tap-highlight-color:transparent}
::selection{
    background:rgba(255,217,120,.28);
    color:var(--gold-2);
}
body{
    margin:0;
    min-height:100vh;
    font-family:Inter,Segoe UI,Arial,sans-serif;
    background:
        radial-gradient(circle at 50% -10%,rgba(78,190,255,.22),transparent 28%),
        radial-gradient(circle at 12% 22%,rgba(244,200,115,.14),transparent 24%),
        linear-gradient(145deg,#030712 0%,#07111e 48%,#111827 100%);
    color:var(--text);
    overflow-x:hidden;
    -webkit-font-smoothing:antialiased;
    text-rendering:optimizeLegibility;
}
body::before{
    content:"";
    position:fixed;
    inset:0;
    pointer-events:none;
    background:
        linear-gradient(115deg,transparent 0%,rgba(102,221,255,.08) 35%,transparent 54%),
        repeating-linear-gradient(90deg,rgba(255,255,255,.025) 0 1px,transparent 1px 120px);
    mix-blend-mode:screen;
    animation:cinemaSweep 8s ease-in-out infinite;
}
@keyframes cinemaSweep{
    0%,100%{opacity:.32;transform:translateX(-4%)}
    50%{opacity:.72;transform:translateX(4%)}
}
.nav{
    position:sticky;
    top:0;
    z-index:5;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:16px;
    padding:18px clamp(18px,4vw,56px);
    background:rgba(5,5,5,.76);
    border-bottom:1px solid var(--line);
    backdrop-filter:blur(18px);
    box-shadow:0 12px 40px rgba(0,0,0,.28);
}
.menu-toggle{
    width:52px;
    min-height:46px;
    margin:0;
    padding:0;
    display:inline-grid;
    place-items:center;
    gap:5px;
    border:1px solid rgba(255,217,120,.34);
    border-radius:8px;
    background:linear-gradient(145deg,rgba(255,217,120,.12),rgba(255,255,255,.03));
    box-shadow:0 0 26px rgba(255,217,120,.12), inset 0 0 18px rgba(255,217,120,.05);
    transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.menu-toggle span{
    display:block;
    width:22px;
    height:2px;
    border-radius:999px;
    background:var(--gold-2);
    box-shadow:0 0 12px rgba(255,217,120,.55);
}
.menu-toggle:hover{
    border-color:rgba(255,217,120,.7);
    box-shadow:0 0 34px rgba(255,217,120,.22), inset 0 0 20px rgba(255,217,120,.07);
}
.menu-backdrop{
    position:fixed;
    inset:0;
    z-index:19;
    background:rgba(0,0,0,.66);
    opacity:0;
    pointer-events:none;
    transition:opacity .18s ease;
    backdrop-filter:blur(4px);
}
.menu-drawer{
    position:fixed;
    top:0;
    right:0;
    z-index:20;
    width:min(390px,calc(100vw - 28px));
    height:100vh;
    padding:18px;
    display:flex;
    flex-direction:column;
    gap:14px;
    overflow-y:auto;
    transform:translateX(104%);
    transition:transform .22s ease;
    border-left:1px solid rgba(255,217,120,.34);
    background:
        radial-gradient(circle at 30% 0%,rgba(255,217,120,.18),transparent 28%),
        linear-gradient(160deg,rgba(5,10,18,.98),rgba(10,24,42,.96));
    box-shadow:-24px 0 70px rgba(0,0,0,.62), inset 0 0 42px rgba(255,217,120,.05);
}
body.menu-open{overflow:hidden}
body.menu-open .menu-backdrop{opacity:1;pointer-events:auto}
body.menu-open .menu-drawer{transform:translateX(0)}
.drawer-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding-bottom:14px;
    border-bottom:1px solid var(--line);
}
.drawer-brand{
    display:flex;
    align-items:center;
    gap:10px;
    color:var(--gold-2);
    font-weight:900;
    letter-spacing:.12em;
    text-transform:uppercase;
}
.drawer-brand img{
    width:42px;
    height:42px;
    object-fit:contain;
    filter:drop-shadow(0 0 14px rgba(255,217,120,.42));
}
.drawer-close{
    width:42px;
    min-height:42px;
    margin:0;
    padding:0;
}
.drawer-section-title{
    margin-top:6px;
    color:var(--muted);
    font-size:12px;
    letter-spacing:.16em;
    text-transform:uppercase;
}
.drawer-links.nav-links,
.drawer-user{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
}
.drawer-links.nav-links a,
.drawer-user a{
    width:100%;
    min-height:48px;
    justify-content:space-between;
}
.drawer-user .user-pill{
    border-radius:8px;
    justify-content:flex-start;
}
.nav-links{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:8px;
}
.nav-links a{
    min-height:38px;
    display:inline-flex;
    align-items:center;
    padding:8px 11px;
    font-size:12px;
    letter-spacing:.08em;
    text-transform:uppercase;
}
.brand{
    display:flex;
    align-items:center;
    gap:12px;
    font-weight:900;
    letter-spacing:.12em;
    text-transform:uppercase;
    text-shadow:0 0 18px rgba(255,217,120,.46);
}
.brand-logo{
    width:46px;
    height:46px;
    object-fit:contain;
    filter:drop-shadow(0 0 16px rgba(255,217,120,.5));
}
.nav a,.link-btn,.menu-drawer a{
    color:var(--text);
    text-decoration:none;
    border:1px solid rgba(255,217,120,.28);
    padding:10px 14px;
    border-radius:8px;
    background:linear-gradient(145deg,rgba(255,217,120,.1),rgba(255,255,255,.03));
    box-shadow:0 0 22px rgba(255,217,120,.08), inset 0 0 16px rgba(255,217,120,.04);
    transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
.nav a:hover,.link-btn:hover,.menu-drawer a:hover{
    border-color:rgba(255,217,120,.66);
    background:linear-gradient(145deg,rgba(255,217,120,.16),rgba(255,255,255,.045));
    box-shadow:0 0 28px rgba(255,217,120,.18), inset 0 0 18px rgba(255,217,120,.06);
    transform:translateY(-1px);
}
.user-pill{
    display:inline-flex;
    align-items:center;
    gap:8px;
    color:var(--text);
    text-decoration:none;
    border:1px solid var(--line);
    padding:7px 12px 7px 7px;
    border-radius:999px;
    background:rgba(255,255,255,.04);
    font-weight:800;
}
.nav-avatar{
    width:28px;
    height:28px;
    border-radius:50%;
    object-fit:cover;
}
.wrap{
    width:min(1120px,100%);
    margin:0 auto;
    padding:44px 18px 28px;
}
.hero{
    display:grid;
    grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);
    gap:22px;
    align-items:stretch;
}
.headline{
    position:relative;
    overflow:hidden;
    padding:38px;
    border:1px solid rgba(255,217,120,.24);
    background:
        linear-gradient(160deg,rgba(255,217,120,.11),rgba(255,255,255,.035)),
        radial-gradient(circle at 70% 12%,rgba(255,217,120,.12),transparent 28%);
    border-radius:8px;
    box-shadow:0 0 60px rgba(255,217,120,.1), inset 0 0 60px rgba(255,217,120,.035);
}
.headline::after{
    content:"";
    position:absolute;
    top:0;
    left:-80%;
    width:58%;
    height:100%;
    background:linear-gradient(100deg,transparent,rgba(255,241,184,.16),transparent);
    transform:skewX(-18deg);
    animation:shimmer 5.5s ease-in-out infinite;
}
@keyframes shimmer{
    0%,42%{left:-80%}
    70%,100%{left:130%}
}
h1{
    margin:0;
    max-width:720px;
    font-size:clamp(36px,6vw,76px);
    line-height:.98;
    letter-spacing:0;
    color:var(--gold-2);
    text-shadow:0 0 24px rgba(255,217,120,.22),0 8px 30px rgba(0,0,0,.45);
}
.sub{
    color:var(--muted);
    max-width:640px;
    margin:18px 0 0;
    font-size:17px;
    line-height:1.7;
}
.stats{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:10px;
    margin-top:28px;
}
.public-plan-panel{
    position:relative;
    margin-top:16px;
    padding:15px;
    border:1px solid rgba(255,217,120,.2);
    border-radius:8px;
    overflow:hidden;
    isolation:isolate;
    background:
        linear-gradient(150deg,rgba(255,217,120,.085),rgba(255,255,255,.025) 42%,rgba(0,0,0,.22)),
        rgba(0,0,0,.2);
    box-shadow:0 20px 60px rgba(0,0,0,.22), inset 0 0 28px rgba(255,217,120,.045);
}
.public-plan-panel::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:-1;
    background:linear-gradient(110deg,transparent 0%,rgba(255,241,184,.1) 46%,transparent 62%);
    transform:translateX(-85%) skewX(-16deg);
    animation:softPanelSweep 8s ease-in-out infinite;
}
@keyframes softPanelSweep{
    0%,52%{transform:translateX(-85%) skewX(-16deg);opacity:.18}
    76%{transform:translateX(85%) skewX(-16deg);opacity:.38}
    100%{transform:translateX(85%) skewX(-16deg);opacity:0}
}
.public-plan-title{
    display:flex;
    justify-content:space-between;
    align-items:end;
    gap:12px;
}
.public-plan-title strong{
    display:block;
    margin-top:5px;
    color:var(--gold-2);
    font-size:18px;
}
.public-plan-grid{
    display:grid;
    grid-auto-flow:column;
    grid-auto-columns:minmax(218px,236px);
    grid-template-columns:none;
    gap:10px;
    margin-top:12px;
    overflow-x:auto;
    overscroll-behavior-x:contain;
    scroll-snap-type:x proximity;
    scrollbar-width:thin;
    scrollbar-color:rgba(255,217,120,.65) rgba(255,255,255,.06);
    padding:2px 2px 12px;
}
.public-plan-grid::-webkit-scrollbar,.plan-grid::-webkit-scrollbar{
    height:8px;
}
.public-plan-grid::-webkit-scrollbar-track,.plan-grid::-webkit-scrollbar-track{
    background:rgba(255,255,255,.055);
    border-radius:999px;
}
.public-plan-grid::-webkit-scrollbar-thumb,.plan-grid::-webkit-scrollbar-thumb{
    background:linear-gradient(90deg,var(--gold-2),var(--amber));
    border-radius:999px;
    box-shadow:0 0 16px rgba(255,217,120,.32);
}
.public-plan-card{
    position:relative;
    display:grid;
    align-content:start;
    gap:8px;
    min-height:118px;
    border:1px solid rgba(255,217,120,.24);
    border-radius:8px;
    padding:13px;
    overflow:hidden;
    isolation:isolate;
    scroll-snap-align:start;
    background:
        radial-gradient(circle at 18% 0%,rgba(255,241,184,.14),transparent 34%),
        linear-gradient(155deg,rgba(255,217,120,.105),rgba(255,255,255,.026));
    cursor:pointer;
    transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease,opacity .18s ease,filter .18s ease;
}
.public-plan-card::before,.plan-card::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:-1;
    background:
        linear-gradient(115deg,transparent 0%,rgba(255,241,184,.16) 44%,transparent 58%),
        linear-gradient(180deg,rgba(255,255,255,.045),transparent 38%);
    opacity:.24;
    transform:translateX(-58%) skewX(-15deg);
    transition:transform .45s ease,opacity .2s ease;
}
.public-plan-card:hover,.public-plan-card.active{
    border-color:rgba(255,217,120,.72);
    transform:translateY(-1px);
    background:
        radial-gradient(circle at 18% 0%,rgba(255,241,184,.2),transparent 36%),
        linear-gradient(155deg,rgba(255,217,120,.16),rgba(255,255,255,.035));
    box-shadow:0 0 30px rgba(255,217,120,.2),0 20px 40px rgba(0,0,0,.2), inset 0 0 24px rgba(255,217,120,.055);
}
.public-plan-card:hover::before,.public-plan-card.active::before,
.plan-card:hover::before,.plan-card.active::before{
    transform:translateX(58%) skewX(-15deg);
    opacity:.42;
}
.public-plan-card strong{
    display:block;
    color:var(--gold-2);
    font-size:21px;
    line-height:1.05;
}
.public-plan-card span{
    display:block;
    color:var(--muted);
    font-size:12px;
    line-height:1.45;
    margin-top:6px;
}
.public-plan-card .price{
    color:var(--gold);
    font-size:22px;
    font-weight:900;
    margin-top:2px;
    text-shadow:0 0 18px rgba(255,217,120,.24);
}
.plan-card-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:8px;
}
.plan-card-head em{
    flex:0 0 auto;
    border:1px solid rgba(255,217,120,.42);
    border-radius:999px;
    padding:4px 8px;
    color:#1b1203;
    background:linear-gradient(135deg,var(--gold-2),var(--amber));
    font-size:10px;
    font-style:normal;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
    white-space:nowrap;
    box-shadow:0 0 18px rgba(255,217,120,.22);
}
.public-plan-card .plan-period,.plan-card .plan-period{
    color:var(--muted);
    font-size:12px;
    line-height:1.45;
    margin-top:0;
}
.plan-feature-list{
    display:grid;
    gap:5px;
    margin-top:2px;
}
.plan-feature-list small{
    display:flex;
    align-items:center;
    gap:7px;
    color:#dccb9c;
    font-size:12px;
    line-height:1.35;
}
.plan-feature-list small::before{
    content:"";
    width:6px;
    height:6px;
    flex:0 0 6px;
    border-radius:50%;
    background:var(--mint);
    box-shadow:0 0 12px rgba(84,221,178,.5);
}
.public-plan-card .plan-status,.plan-card .plan-status{
    align-self:end;
    width:max-content;
    max-width:100%;
    padding:5px 9px;
    border:1px solid rgba(255,217,120,.22);
    border-radius:999px;
    color:#f8df98;
    background:rgba(255,217,120,.075);
    font-size:11px;
    font-weight:800;
    letter-spacing:.02em;
    line-height:1.25;
}
.public-plan-pay{
    margin-top:12px;
}
.selected-plan-note{
    margin-top:10px;
    color:var(--muted);
    font-size:13px;
    line-height:1.5;
}
.logo-showcase{
    position:relative;
    display:grid;
    place-items:center;
    min-height:clamp(360px,42vw,560px);
    margin-top:28px;
    overflow:hidden;
    border:1px solid rgba(255,217,120,.18);
    border-radius:8px;
    background:
        radial-gradient(circle at 50% 42%,rgba(255,217,120,.24),transparent 24%),
        radial-gradient(circle at 50% 62%,rgba(201,136,47,.16),transparent 34%),
        linear-gradient(160deg,rgba(5,5,5,.26),rgba(255,217,120,.055));
    box-shadow:inset 0 0 70px rgba(255,217,120,.05),0 0 54px rgba(255,217,120,.08);
}
.logo-showcase::before{
    content:"R3Y";
    position:absolute;
    top:-8%;
    left:50%;
    transform:translateX(-50%);
    font-size:clamp(86px,15vw,190px);
    line-height:1;
    font-weight:1000;
    letter-spacing:.08em;
    color:rgba(255,217,120,.055);
    text-shadow:0 0 42px rgba(255,217,120,.12);
}
.logo-showcase::after{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(110deg,transparent 18%,rgba(255,241,184,.12) 43%,transparent 62%),
        repeating-linear-gradient(0deg,rgba(255,255,255,.022) 0 1px,transparent 1px 5px);
    mix-blend-mode:screen;
    opacity:.58;
    animation:logoShimmer 7s ease-in-out infinite;
}
.logo-showcase img{
    position:relative;
    z-index:1;
    width:min(430px,72%);
    max-height:82%;
    object-fit:contain;
    opacity:.95;
    filter:drop-shadow(0 0 22px rgba(255,217,120,.5)) drop-shadow(0 28px 46px rgba(0,0,0,.62));
    animation:logoFloat 5.8s ease-in-out infinite;
}
.logo-showcase span{
    position:absolute;
    left:18px;
    bottom:16px;
    z-index:2;
    color:rgba(255,241,184,.72);
    font-size:12px;
    font-weight:900;
    letter-spacing:.18em;
    text-transform:uppercase;
}
@keyframes logoFloat{
    0%,100%{transform:translateY(0) scale(1)}
    50%{transform:translateY(-8px) scale(1.02)}
}
@keyframes logoShimmer{
    0%,100%{opacity:.36;transform:translateX(-4%)}
    50%{opacity:.74;transform:translateX(4%)}
}
.stat,.panel,.history,.reviews{
    border:1px solid rgba(255,217,120,.22);
    background:linear-gradient(160deg,rgba(17,16,18,.92),rgba(23,19,13,.86));
    border-radius:8px;
    box-shadow:0 0 34px rgba(255,217,120,.08), inset 0 0 28px rgba(255,217,120,.035);
}
.stat{padding:16px}
.label{
    color:var(--muted);
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:.12em;
}
.muted{color:var(--muted)}
.value{font-size:22px;font-weight:800;margin-top:7px}
.panel{padding:22px}
.drop{
    display:grid;
    place-items:center;
    min-height:230px;
    padding:24px;
    text-align:center;
    border:1.5px dashed rgba(255,217,120,.62);
    background:linear-gradient(180deg,rgba(255,217,120,.1),rgba(255,255,255,.02));
    border-radius:8px;
    cursor:pointer;
    transition:.18s ease;
    box-shadow:inset 0 0 28px rgba(255,217,120,.04);
}
.drop.active{
    border-color:var(--mint);
    background:rgba(84,221,178,.09);
    box-shadow:0 0 30px rgba(84,221,178,.18), inset 0 0 24px rgba(84,221,178,.08);
}
.drop strong{display:block;font-size:22px;margin-bottom:8px}
.drop span{color:var(--muted);line-height:1.5}
input[type=file]{display:none}
.url-box{
    margin:14px 0 18px;
    border:1px solid rgba(255,217,120,.22);
    background:rgba(255,255,255,.035);
    border-radius:8px;
    padding:14px;
}
.url-box label{
    display:block;
    color:var(--gold);
    font-weight:800;
    margin-bottom:8px;
}
.url-row{
    display:grid;
    grid-template-columns:1fr auto;
    gap:10px;
    align-items:center;
}
.url-row input{
    width:100%;
    min-height:44px;
    border:1px solid rgba(255,217,120,.18);
    border-radius:8px;
    background:rgba(0,0,0,.35);
    color:var(--text);
    outline:none;
    padding:0 13px;
    font:inherit;
}
.url-row input:focus{
    border-color:rgba(255,217,120,.58);
    box-shadow:0 0 0 3px rgba(255,217,120,.12);
}
.url-box small{
    display:block;
    color:var(--muted);
    line-height:1.5;
    margin-top:8px;
}
.file-name{
    margin-top:12px;
    color:var(--gold);
    overflow-wrap:anywhere;
}
.audio-lab{
    display:grid;
    gap:14px;
    margin-top:16px;
}
.setting-card{
    border:1px solid rgba(255,217,120,.18);
    border-radius:8px;
    padding:16px;
    background:rgba(5,6,10,.62);
    box-shadow:inset 0 0 24px rgba(255,217,120,.035);
}
.setting-top{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:12px;
    margin-bottom:12px;
}
.setting-title{
    font-weight:900;
    color:var(--gold-2);
}
.setting-copy{
    margin:6px 0 0;
    color:var(--muted);
    line-height:1.55;
    font-size:14px;
}
.value-chip{
    min-width:86px;
    text-align:center;
    border:1px solid rgba(255,217,120,.38);
    border-radius:8px;
    padding:9px 10px;
    color:var(--gold);
    background:rgba(201,136,47,.13);
    font-weight:900;
    box-shadow:0 0 18px rgba(255,217,120,.12);
}
.range{
    width:100%;
    accent-color:var(--gold);
    display:block;
}
.range-scale{
    display:flex;
    justify-content:space-between;
    color:#7f8797;
    font-size:12px;
    margin-top:8px;
}
.preset-row{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:14px;
}
.preset-btn{
    width:auto;
    min-height:36px;
    margin:0;
    padding:8px 12px;
    color:var(--gold);
    background:linear-gradient(145deg,rgba(255,217,120,.1),rgba(255,255,255,.025));
    border:1px solid rgba(255,217,120,.24);
    box-shadow:0 0 14px rgba(255,217,120,.08);
}
.preset-btn.active{
    color:#18130a;
    background:linear-gradient(135deg,var(--gold-2),var(--gold),var(--amber));
    box-shadow:0 0 22px rgba(255,217,120,.32);
}
.preset-btn:disabled{
    color:#697184;
    opacity:.8;
    cursor:not-allowed;
    box-shadow:none;
}
.recommend-box{
    border:1px solid rgba(255,217,120,.24);
    border-radius:8px;
    margin-top:14px;
    padding:14px;
    background:rgba(255,217,120,.075);
    color:#f4ddaa;
    line-height:1.55;
    font-size:14px;
}
.recommend-box strong{color:var(--gold-2)}
button{
    width:100%;
    min-height:48px;
    margin-top:14px;
    border:0;
    border-radius:8px;
    color:#18130a;
    position:relative;
    overflow:hidden;
    background:linear-gradient(135deg,var(--gold-2),var(--gold) 42%,var(--amber));
    font-weight:800;
    cursor:pointer;
    box-shadow:0 0 24px rgba(255,217,120,.32),0 0 50px rgba(201,136,47,.12), inset 0 1px 0 rgba(255,255,255,.42);
    transition:transform .16s ease, box-shadow .16s ease;
}
button::after{
    content:"";
    position:absolute;
    inset:0;
    left:-120%;
    width:70%;
    background:linear-gradient(100deg,transparent,rgba(255,255,255,.42),transparent);
    transform:skewX(-18deg);
    transition:left .45s ease;
}
button:hover{
    transform:translateY(-1px);
    box-shadow:0 0 32px rgba(255,217,120,.48),0 0 70px rgba(201,136,47,.2), inset 0 1px 0 rgba(255,255,255,.5);
}
button:hover::after{left:130%}
button span{position:relative;z-index:1}
button:not(:has(span)){z-index:0}
button:not(:has(span))::before{
    content:"";
    position:absolute;
    inset:0;
}
button.secondary{
    color:var(--text);
    background:linear-gradient(145deg,rgba(255,217,120,.1),rgba(255,255,255,.035));
    border:1px solid rgba(255,217,120,.28);
}
button:disabled{opacity:.55;cursor:not-allowed}
.bar{
    height:10px;
    background:#232735;
    margin-top:16px;
    border-radius:999px;
    overflow:hidden;
}
.bar span{
    display:block;
    height:100%;
    width:0%;
    background:linear-gradient(90deg,var(--mint),var(--gold-2));
    box-shadow:0 0 20px rgba(255,217,120,.35);
    transition:.2s;
}
#status{min-height:24px;margin-top:12px;color:var(--muted);line-height:1.5}
.roblox-upload-card{
    display:none;
    margin-top:14px;
    padding:14px;
    border:1px solid rgba(255,217,120,.24);
    border-radius:8px;
    background:linear-gradient(145deg,rgba(255,217,120,.1),rgba(0,0,0,.26));
    box-shadow:0 0 24px rgba(255,217,120,.08);
}
.roblox-upload-card.is-open{display:block}
.roblox-upload-card strong{display:block;color:var(--gold-2);margin-bottom:6px}
.roblox-upload-card p{margin:0 0 12px;color:var(--muted);line-height:1.5;font-size:14px}
.roblox-upload-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.roblox-upload-actions button{min-height:42px}
#robloxUploadBtn,#robloxStatusBtn{color:var(--gold-2)!important}
#robloxUploadBtn:disabled,#robloxStatusBtn:disabled{color:var(--gold-2)!important;opacity:.72}
.roblox-upload-card .roblox-small{font-size:12px;color:var(--muted);margin-top:10px}
.history-actions{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:8px;
}
.history-btn{
    width:auto;
    min-height:34px;
    padding:8px 10px;
    font-size:12px;
}
.history{
    margin-top:22px;
    padding:22px;
}
.business-section{
    margin-top:22px;
    padding:24px;
    border:1px solid rgba(255,217,120,.22);
    border-radius:8px;
    background:
        radial-gradient(circle at 78% 0%,rgba(255,217,120,.12),transparent 24%),
        linear-gradient(160deg,rgba(17,16,18,.9),rgba(23,19,13,.82));
    box-shadow:0 0 34px rgba(255,217,120,.08), inset 0 0 28px rgba(255,217,120,.035);
}
.section-head{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:18px;
    margin-bottom:16px;
}
.section-head h2{
    margin:0;
    color:var(--gold-2);
    font-size:26px;
}
.section-head p{
    margin:8px 0 0;
    max-width:720px;
    color:var(--muted);
    line-height:1.65;
}
.info-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:12px;
}
.info-card{
    min-height:148px;
    padding:16px;
    border:1px solid rgba(255,217,120,.18);
    border-radius:8px;
    background:linear-gradient(155deg,rgba(255,217,120,.08),rgba(0,0,0,.26));
}
.info-card h3{
    margin:0 0 9px;
    color:var(--gold-2);
    font-size:18px;
}
.info-card p,.info-card li{
    color:var(--muted);
    line-height:1.55;
    font-size:14px;
}
.info-card ul,.info-card ol{
    margin:0;
    padding-left:19px;
}
.info-card .price{
    margin-top:10px;
    color:var(--gold);
    font-size:20px;
    font-weight:900;
}
.legal-strip{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:14px;
}
.legal-strip a{
    color:var(--gold-2);
    text-decoration:none;
    border:1px solid rgba(255,217,120,.22);
    border-radius:8px;
    padding:9px 12px;
    background:rgba(255,255,255,.035);
}
.history-head{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    margin-bottom:10px;
}
.history h2{margin:0;font-size:22px}
#history{
    max-height:min(460px,58vh);
    overflow-y:auto;
    padding-right:8px;
    scrollbar-color:rgba(255,217,120,.55) rgba(255,255,255,.06);
}
#history::-webkit-scrollbar{width:8px}
#history::-webkit-scrollbar-track{
    background:rgba(255,255,255,.06);
    border-radius:999px;
}
#history::-webkit-scrollbar-thumb{
    background:linear-gradient(var(--gold-2),var(--amber));
    border-radius:999px;
}
.history-item{
    display:grid;
    grid-template-columns:1fr auto;
    gap:12px;
    align-items:center;
    padding:14px 0;
    border-top:1px solid var(--line);
}
.history-item a{color:var(--gold);text-decoration:none;font-weight:700}
.reviews{
    margin-top:22px;
    padding:22px;
}
.reviews-head{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:14px;
    margin-bottom:18px;
}
.reviews h2{
    margin:0;
    color:var(--gold-2);
    font-size:24px;
}
.review-metrics{
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-end;
    gap:8px;
}
.review-pill{
    display:inline-flex;
    align-items:center;
    gap:7px;
    min-height:32px;
    padding:7px 11px;
    border:1px solid rgba(255,217,120,.28);
    border-radius:999px;
    background:rgba(255,217,120,.08);
    color:var(--gold-2);
    font-size:13px;
    font-weight:900;
}
.review-form{
    display:grid;
    grid-template-columns:auto 1fr;
    gap:12px;
    padding:16px;
    border:1px solid rgba(255,217,120,.18);
    border-radius:8px;
    background:rgba(0,0,0,.22);
}
.review-avatar{
    width:42px;
    height:42px;
    display:grid;
    place-items:center;
    border-radius:50%;
    border:1px solid rgba(255,217,120,.4);
    background:linear-gradient(145deg,rgba(255,217,120,.2),rgba(201,136,47,.12));
    color:var(--gold-2);
    font-weight:900;
    overflow:hidden;
    box-shadow:0 0 22px rgba(255,217,120,.16);
}
.review-avatar img{
    width:100%;
    height:100%;
    object-fit:cover;
}
.rating-row{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:10px;
    margin-bottom:10px;
}
.rating-stars{
    display:flex;
    gap:3px;
}
.rating-star{
    width:28px;
    min-height:28px;
    margin:0;
    padding:0;
    border:0;
    background:transparent;
    box-shadow:none;
    color:#555b66;
    font-size:24px;
    line-height:1;
    text-shadow:none;
}
.rating-star:hover{
    transform:translateY(-1px) scale(1.05);
    color:var(--gold);
    box-shadow:none;
}
.rating-star.active{
    color:var(--gold);
    text-shadow:0 0 12px rgba(255,217,120,.48);
}
.rating-star::after{display:none}
.review-compose textarea{
    width:100%;
    min-height:88px;
    resize:vertical;
    border:1px solid rgba(255,217,120,.18);
    border-radius:8px;
    background:rgba(0,0,0,.34);
    color:var(--text);
    outline:none;
    padding:13px;
    font:inherit;
    line-height:1.5;
}
.review-compose textarea:focus{
    border-color:rgba(255,217,120,.58);
    box-shadow:0 0 0 3px rgba(255,217,120,.12);
}
.review-compose-footer{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    margin-top:10px;
}
.review-post{
    width:auto;
    min-width:104px;
    min-height:40px;
    margin-top:0;
}
#reviewStatus{
    min-height:20px;
    margin-top:10px;
    color:var(--muted);
    line-height:1.5;
}
#reviewList{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:12px;
    max-height:min(650px,72vh);
    overflow-y:auto;
    margin-top:20px;
    padding-right:8px;
    scrollbar-color:rgba(255,217,120,.55) rgba(255,255,255,.06);
}
#reviewList::-webkit-scrollbar{width:8px}
#reviewList::-webkit-scrollbar-track{
    background:rgba(255,255,255,.06);
    border-radius:999px;
}
#reviewList::-webkit-scrollbar-thumb{
    background:linear-gradient(var(--gold-2),var(--amber));
    border-radius:999px;
}
.review-card{
    min-height:136px;
    padding:15px;
    border:1px solid rgba(255,217,120,.18);
    border-radius:8px;
    background:linear-gradient(155deg,rgba(255,217,120,.08),rgba(0,0,0,.28));
    box-shadow:inset 0 0 24px rgba(255,217,120,.025);
}
.review-card:hover{
    border-color:rgba(255,217,120,.42);
    box-shadow:0 0 24px rgba(255,217,120,.12), inset 0 0 22px rgba(255,217,120,.035);
}
.review-card-top{
    display:grid;
    grid-template-columns:auto 1fr auto;
    gap:10px;
    align-items:start;
}
.review-name{
    color:var(--gold-2);
    font-weight:900;
    overflow-wrap:anywhere;
}
.review-meta{
    margin-top:3px;
    color:var(--muted);
    font-size:12px;
    line-height:1.4;
}
.review-stars-display{
    color:var(--gold);
    font-size:13px;
    letter-spacing:1px;
    margin-top:7px;
    text-shadow:0 0 10px rgba(255,217,120,.28);
}
.review-comment{
    margin:12px 0 0;
    color:var(--text);
    line-height:1.55;
    overflow-wrap:anywhere;
}
.review-badge-row{margin-top:12px}
.review-empty{
    grid-column:1/-1;
    padding:18px;
    border:1px dashed rgba(255,217,120,.2);
    border-radius:8px;
    color:var(--muted);
    text-align:center;
}
.review-like{
    width:auto;
    min-width:44px;
    min-height:42px;
    margin:0;
    padding:8px 10px;
    color:var(--gold-2);
    background:rgba(255,255,255,.04);
    border:1px solid rgba(255,217,120,.18);
    box-shadow:0 0 14px rgba(255,217,120,.06);
}
.review-like.liked{
    color:#18130a;
    background:linear-gradient(135deg,var(--gold-2),var(--gold),var(--amber));
}
.review-like::after{display:none}
.badge{
    display:inline-flex;
    align-items:center;
    min-height:26px;
    padding:5px 9px;
    border-radius:999px;
    background:rgba(246,197,96,.14);
    color:var(--gold);
    border:1px solid rgba(246,197,96,.25);
    font-size:12px;
    font-weight:800;
}
.footer{
    color:var(--muted);
    text-align:center;
    padding:28px 18px 36px;
}
.footer a{
    color:var(--gold);
    text-decoration:none;
}
.footer-links{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:12px;
    margin-bottom:12px;
}
.pay-modal[hidden]{display:none}
.pay-modal{
    position:fixed;
    inset:0;
    z-index:20;
    display:grid;
    place-items:center;
    padding:clamp(10px,2vw,18px);
    background:rgba(0,0,0,.72);
    backdrop-filter:blur(14px);
}
.pay-sheet{
    position:relative;
    width:min(980px,100%);
    max-height:calc(100dvh - 24px);
    overflow:auto;
    display:grid;
    grid-template-columns:minmax(250px,.8fr) minmax(0,1fr);
    gap:20px;
    padding:22px;
    border:1px solid rgba(255,217,120,.28);
    border-radius:10px;
    background:
        radial-gradient(circle at 20% 0%,rgba(255,217,120,.16),transparent 30%),
        linear-gradient(145deg,rgba(8,8,10,.98),rgba(24,19,12,.97));
    box-shadow:0 0 80px rgba(255,217,120,.18), inset 0 0 36px rgba(255,217,120,.045);
}
.modal-close{
    position:absolute;
    top:12px;
    right:12px;
    width:38px;
    min-height:38px;
    margin:0;
    color:var(--gold-2);
    background:rgba(255,255,255,.04);
}
.qris-frame{
    display:grid;
    gap:12px;
    align-content:start;
    justify-items:center;
    min-width:0;
}
.qris-frame img{
    display:block;
    width:min(100%,340px);
    height:auto;
    max-height:min(58dvh,520px);
    object-fit:contain;
    border-radius:8px;
    background:#fff;
    border:1px solid rgba(255,217,120,.32);
    box-shadow:0 0 34px rgba(255,217,120,.16);
}
.qris-download{
    width:min(100%,340px);
    min-height:44px;
    margin:0;
}
.qris-frame .recommend-box{
    width:min(100%,340px);
}
.pay-content h2{
    margin:8px 0 6px;
    color:var(--gold-2);
    font-size:clamp(28px,4vw,46px);
    line-height:1;
}
.plan-grid{
    display:grid;
    grid-auto-flow:column;
    grid-auto-columns:minmax(206px,224px);
    grid-template-columns:none;
    gap:10px;
    margin:16px 0;
    overflow-x:auto;
    overscroll-behavior-x:contain;
    scroll-snap-type:x proximity;
    scrollbar-width:thin;
    scrollbar-color:rgba(255,217,120,.65) rgba(255,255,255,.06);
    padding:2px 2px 12px;
}
.plan-card{
    position:relative;
    display:grid;
    align-content:start;
    gap:8px;
    min-height:158px;
    border:1px solid rgba(255,217,120,.25);
    border-radius:8px;
    padding:14px;
    overflow:hidden;
    isolation:isolate;
    scroll-snap-align:start;
    background:
        radial-gradient(circle at 18% 0%,rgba(255,241,184,.12),transparent 34%),
        linear-gradient(155deg,rgba(255,217,120,.08),rgba(255,255,255,.028));
    cursor:pointer;
    transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease,opacity .18s ease,filter .18s ease;
}
.plan-card:hover,.plan-card.active{
    border-color:rgba(255,217,120,.76);
    transform:translateY(-1px);
    background:
        radial-gradient(circle at 18% 0%,rgba(255,241,184,.2),transparent 36%),
        linear-gradient(160deg,rgba(255,217,120,.16),rgba(255,255,255,.04));
    box-shadow:0 0 28px rgba(255,217,120,.2),0 18px 38px rgba(0,0,0,.2), inset 0 0 22px rgba(255,217,120,.05);
}
.plan-card.locked,.public-plan-card.locked{
    opacity:.5;
    cursor:not-allowed;
    filter:grayscale(.25);
}
.plan-card.locked:hover,.public-plan-card.locked:hover{
    transform:none;
    box-shadow:none;
    border-color:rgba(255,217,120,.18);
}
.plan-card strong{display:block;color:var(--gold-2);font-size:20px;line-height:1.05}
.plan-card span{display:block;color:var(--muted);font-size:13px;margin-top:6px}
.plan-card .price{color:var(--gold);font-weight:900;font-size:22px;margin-top:2px;text-shadow:0 0 18px rgba(255,217,120,.24)}
.order-box{
    margin-top:14px;
    padding:14px;
    border:1px solid rgba(255,217,120,.24);
    border-radius:8px;
    background:rgba(255,217,120,.07);
    white-space:pre-wrap;
    overflow-wrap:anywhere;
    color:#f4ddaa;
    line-height:1.55;
    font-size:14px;
}
.manual-actions{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:10px;
}
.manual-actions button{margin-top:0}
.payment-actions{
    display:grid;
    grid-template-columns:1.15fr .85fr;
    gap:10px;
}
.payment-actions button{margin-top:0}
.payment-hint{
    margin:10px 0 0;
    color:var(--muted);
    font-size:13px;
    line-height:1.55;
}
.promo-float{
    position:fixed;
    left:18px;
    bottom:18px;
    z-index:18;
    width:min(330px,calc(100vw - 28px));
    display:none;
    overflow:hidden;
    border:1px solid rgba(255,217,120,.34);
    border-radius:8px;
    background:linear-gradient(160deg,rgba(8,8,10,.97),rgba(31,22,8,.94));
    box-shadow:0 0 44px rgba(255,217,120,.18), inset 0 0 28px rgba(255,217,120,.04);
}
.promo-float.is-open{display:block}
.promo-float img{
    display:block;
    width:100%;
    aspect-ratio:16/9;
    object-fit:cover;
}
.promo-close{
    position:absolute;
    top:8px;
    right:8px;
    width:34px;
    min-height:34px;
    margin:0;
    z-index:1;
    padding:0;
    color:var(--gold-2);
    background:rgba(0,0,0,.58);
    border:1px solid rgba(255,217,120,.34);
}
.promo-caption{
    display:grid;
    gap:3px;
    padding:11px 12px 12px;
}
.promo-caption strong{
    color:var(--gold-2);
    font-size:13px;
    letter-spacing:.08em;
    text-transform:uppercase;
}
.promo-caption span{
    color:var(--muted);
    font-size:12px;
    line-height:1.45;
}
@media (max-width:860px){
    .hero{grid-template-columns:1fr}
    .headline{padding:26px}
    .stats{grid-template-columns:1fr}
    .public-plan-title{align-items:flex-start;flex-direction:column}
    .public-plan-grid{
        grid-auto-columns:minmax(238px,82vw);
        margin-right:-12px;
        padding-right:18px;
        scroll-snap-type:x mandatory;
    }
    .logo-showcase{min-height:280px}
    .logo-showcase img{width:min(280px,78%)}
    .nav{align-items:center}
    .brand span{font-size:14px}
    .brand-logo{width:42px;height:42px}
    .info-grid{grid-template-columns:1fr}
    .section-head{flex-direction:column}
    .url-row{grid-template-columns:1fr}
    .pay-modal{
        place-items:start center;
        overflow-y:auto;
    }
    .pay-sheet{
        width:100%;
        max-height:none;
        min-height:0;
        grid-template-columns:minmax(0,1fr);
        gap:16px;
        padding:18px 14px 16px;
        overflow:visible;
    }
    .qris-frame{padding-top:28px}
    .qris-frame img{
        width:min(100%,280px);
        max-height:390px;
    }
    .qris-download,.qris-frame .recommend-box{width:min(100%,280px)}
    .pay-content{min-width:0}
    .pay-content h2{font-size:30px}
    .plan-grid{
        grid-auto-columns:minmax(224px,82vw);
        margin-right:-10px;
        padding-right:16px;
        scroll-snap-type:x mandatory;
    }
    .manual-actions,.payment-actions,.roblox-upload-actions{grid-template-columns:1fr}
    .history-item{grid-template-columns:1fr;align-items:start}
    .reviews-head{flex-direction:column}
    .review-metrics{justify-content:flex-start}
    .review-form{grid-template-columns:1fr}
    #reviewList{grid-template-columns:1fr;max-height:560px}
    .review-compose-footer{align-items:flex-start;flex-direction:column}
    .review-post{width:100%}
    .promo-float{
        left:12px;
        right:12px;
        bottom:12px;
        width:auto;
    }
}
@media (max-width:480px){
    .pay-modal{padding:8px}
    .pay-sheet{
        gap:14px;
        padding:14px 12px 14px;
        border-radius:8px;
    }
    .modal-close{top:8px;right:8px}
    .qris-frame{padding-top:30px}
    .qris-frame img{
        width:min(100%,236px);
        max-height:330px;
    }
    .qris-download,.qris-frame .recommend-box{width:min(100%,236px)}
    .plan-grid{
        grid-auto-columns:minmax(210px,82vw);
        margin-right:-6px;
        padding-right:12px;
    }
    .manual-actions,.payment-actions{gap:8px}
    .order-box{font-size:13px}
}
@media (prefers-reduced-motion:reduce){
    html{scroll-behavior:auto}
    *,*::before,*::after{
        animation-duration:.01ms!important;
        animation-iteration-count:1!important;
        scroll-behavior:auto!important;
        transition-duration:.01ms!important;
    }
}