:root{--bg:#070707;--surface:#0d0d0d;--surface-2:#121212;--surface-3:#171717;--line:#262626;--line-soft:#1a1a1a;--text:#f3f3f3;--muted:#8b8b8b;--muted-2:#646464;--white:#fff;--black:#050505;--radius:18px}*{box-sizing:border-box}html{background:var(--bg);scroll-behavior:smooth}body{background:var(--bg);min-height:100vh;color:var(--text);-webkit-font-smoothing:antialiased;margin:0;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;overflow-x:hidden}a{color:inherit;text-decoration:none}button,input{font:inherit}button{color:inherit}img{max-width:100%;display:block}::selection{color:#090909;background:#f2f2f2}.container{width:min(1160px,100% - 40px);margin-inline:auto}.nav-shell{z-index:50;border-bottom:1px solid var(--line-soft);background:#070707f7;position:sticky;top:0}.nav{justify-content:space-between;align-items:center;gap:24px;height:68px;display:flex}.brand{align-items:center;gap:11px;min-width:max-content;display:flex}.brand-image-wrap{border:1px solid var(--line);background:#111;border-radius:9px;flex:none;width:58px;height:40px;overflow:hidden}.brand-image-wrap img{object-fit:cover;object-position:center;filter:grayscale()contrast(1.08);width:100%;height:100%}.brand-copy{flex-direction:column;gap:1px;display:flex}.brand-copy strong{letter-spacing:.1em;font-size:12px;line-height:1.1}.brand-copy small{color:#777;letter-spacing:.15em;font-size:8px}.nav-links{color:#a5a5a5;align-items:center;gap:26px;font-size:13px;display:flex}.nav-links>a:not(.button){transition:color .15s}.nav-links>a:not(.button):hover{color:#fff}.menu-button{cursor:pointer;background:0 0;border:0;width:42px;height:42px;padding:11px;display:none}.menu-button span{background:#e5e5e5;height:1px;margin:6px 0;display:block}.button{color:#090909;cursor:pointer;background:#ededed;border:1px solid #e7e7e7;border-radius:11px;justify-content:center;align-items:center;gap:14px;min-height:46px;padding:0 18px;font-size:12px;font-weight:750;transition:background .15s,border-color .15s,color .15s;display:inline-flex}.button:hover:not(:disabled){background:#fff;border-color:#fff}.button:active:not(:disabled){background:#dcdcdc}.button:disabled{opacity:.36;cursor:not-allowed}.button-small{min-height:38px;padding:0 14px;font-size:11px}.button-ghost{color:#d0d0d0;background:0 0;border-color:#333}.button-ghost:hover:not(:disabled){background:#141414;border-color:#4a4a4a}.button-light{color:#fff;background:#0b0b0b;border-color:#0b0b0b}.button-light:hover:not(:disabled){background:#191919;border-color:#191919}.button-wide{justify-content:space-between;width:100%;padding-inline:18px}.eyebrow,.kicker{letter-spacing:.16em;color:#858585;text-transform:uppercase;font-size:9px;font-weight:750;line-height:1.2}.page-intro{margin-bottom:34px}.page-intro h1,.section-head h2,.feature-copy h2,.cta-block h2{letter-spacing:-.05em;margin:11px 0 0;font-size:clamp(34px,4vw,54px);line-height:1}.page-intro p,.section-head p,.feature-copy p{color:#858585;max-width:600px;margin:14px 0 0;font-size:13px;line-height:1.7}.enter-up,.reveal{opacity:1;transform:none}.delay-1,.delay-2{transition-delay:0s}.hero{grid-template-columns:minmax(0,1fr) minmax(380px,.9fr);align-items:center;gap:68px;min-height:650px;padding:74px 0 56px;display:grid}.hero h1{letter-spacing:-.065em;margin:20px 0;font-size:clamp(54px,6vw,86px);line-height:.94}.hero h1 span{color:#747474;font-weight:650}.hero-lead{color:#969696;max-width:610px;margin:0;font-size:15px;line-height:1.75}.hero-actions{gap:10px;margin-top:28px;display:flex}.micro-trust{flex-wrap:wrap;gap:8px;margin-top:24px;display:flex}.micro-trust span{border:1px solid var(--line);color:#777;letter-spacing:.04em;background:#0b0b0b;border-radius:999px;padding:7px 10px;font-size:9px}.brand-showcase{border:1px solid var(--line);background:#0b0b0b;border-radius:22px;overflow:hidden}.brand-media{aspect-ratio:4/3;background:#111;overflow:hidden}.brand-media img{object-fit:cover;filter:grayscale()contrast(1.08);opacity:.88;width:100%;height:100%}.brand-showcase-foot{border-top:1px solid var(--line);justify-content:space-between;align-items:center;gap:16px;min-height:74px;padding:16px 18px;display:flex}.brand-showcase-foot>div{flex-direction:column;gap:4px;display:flex}.brand-showcase-foot span{letter-spacing:.13em;color:#656565;font-size:8px}.brand-showcase-foot strong{font-size:12px}.status-pill{color:#bdbdbd;letter-spacing:.08em;border:1px solid #3a3a3a;border-radius:999px;padding:6px 9px;font-size:8px}.quick-strip{border:1px solid var(--line);background:#0b0b0b;border-radius:16px;grid-template-columns:repeat(4,1fr);display:grid;overflow:hidden}.quick-strip>div{border-right:1px solid var(--line);align-items:center;gap:12px;min-height:66px;padding:15px 18px;display:flex}.quick-strip>div:last-child{border-right:0}.quick-strip span{color:#555;letter-spacing:.1em;font-size:8px}.quick-strip strong{font-size:11px;font-weight:650}.section{padding:96px 0 8px}.section-head{grid-template-columns:1fr .55fr;align-items:end;gap:36px;margin-bottom:32px;display:grid}.steps-grid{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.steps-grid-four{grid-template-columns:repeat(4,1fr)}.step-card{border:1px solid var(--line);background:#0c0c0c;border-radius:16px;min-height:225px;padding:22px}.step-number{color:#555;letter-spacing:.13em;font-size:8px}.step-card h3{letter-spacing:-.025em;margin:55px 0 9px;font-size:18px}.step-card p{color:#777;margin:0;font-size:11px;line-height:1.65}.interactive-card{transition:border-color .15s,background .15s}.interactive-card:hover{background:#101010;border-color:#3b3b3b}.feature-panel{border:1px solid var(--line);background:#0b0b0b;border-radius:20px;grid-template-columns:.85fr 1.15fr;gap:66px;padding:44px;display:grid}.feature-copy{align-self:center}.feature-copy p{max-width:430px}.text-link{color:#c7c7c7;border-bottom:1px solid #3a3a3a;align-items:center;gap:12px;margin-top:24px;padding-bottom:5px;font-size:11px;display:inline-flex}.feature-list{border-top:1px solid var(--line)}.feature-row{border-bottom:1px solid var(--line);grid-template-columns:38px 1fr;gap:14px;padding:20px 0;display:grid}.feature-row>span{color:#555;letter-spacing:.12em;font-size:8px}.feature-row strong{font-size:13px}.feature-row p{color:#707070;margin:6px 0 0;font-size:11px;line-height:1.6}.cta-block{color:#080808;background:#e8e8e8;border-radius:20px;justify-content:space-between;align-items:center;gap:34px;padding:40px 44px;display:flex}.cta-block .kicker{color:#5c5c5c}.cta-block h2{font-size:clamp(38px,5vw,62px)}.cta-block p{color:#5f5f5f;margin:10px 0 0;font-size:12px}.footer{border-top:1px solid var(--line);color:#606060;justify-content:space-between;align-items:center;gap:24px;margin-top:88px;padding:30px 0 42px;display:flex}.footer-brand{flex-direction:column;gap:3px;display:flex}.footer-brand span{color:#aaa;letter-spacing:.1em;font-size:11px;font-weight:750}.footer-brand small,.footer p{letter-spacing:.08em;font-size:8px}.page-shell{min-height:calc(100vh - 68px);padding-top:68px;padding-bottom:92px}.narrow-page{max-width:940px}.topup-layout{grid-template-columns:minmax(0,1fr) 330px;align-items:start;gap:12px;display:grid}.topup-main{gap:10px;display:grid}.flow-card,.order-summary,.admin-table-wrap,.checkout-card,.payment-card{border:1px solid var(--line);background:#0c0c0c;border-radius:16px;padding:22px}.flow-heading{align-items:flex-start;gap:14px;margin-bottom:20px;display:flex}.flow-heading>span{color:#555;border:1px solid var(--line);border-radius:7px;flex:none;padding:5px 6px;font-size:8px}.flow-heading h2{letter-spacing:-.015em;margin:0 0 5px;font-size:15px}.flow-heading p{color:#6d6d6d;margin:0;font-size:10px;line-height:1.5}.username-form{grid-template-columns:1fr auto;gap:8px;display:grid}.input-wrap{border:1px solid var(--line);background:#080808;border-radius:10px;align-items:center;height:48px;padding:0 14px;transition:border-color .15s;display:flex}.input-wrap:focus-within{border-color:#555}.input-wrap>span{color:#555;margin-right:7px;font-size:11px}.input-wrap input{color:#f2f2f2;background:0 0;border:0;outline:0;width:100%}.input-wrap input::placeholder{color:#4d4d4d}.alert{border-radius:9px;margin-top:12px;padding:11px 12px;font-size:10px}.alert-error{color:#bdbdbd;background:#121212;border:1px solid #363636}.account-card{border:1px solid var(--line);background:#101010;border-radius:12px;grid-template-columns:48px 1fr auto;align-items:center;gap:11px;margin-top:12px;padding:11px;display:grid}.account-avatar{color:#111;background:#e4e4e4;border-radius:10px;place-items:center;width:48px;height:48px;font-weight:850;display:grid;overflow:hidden}.account-avatar img{object-fit:cover;width:100%;height:100%}.account-meta{flex-direction:column;gap:3px;display:flex}.account-meta strong{font-size:13px}.account-meta span{color:#6f6f6f;font-size:9px}.verified-badge{color:#a9a9a9;white-space:nowrap;border:1px solid #333;border-radius:999px;padding:6px 8px;font-size:8px}.muted-section{opacity:.48}.community-card{border:1px solid var(--line);background:#090909;border-radius:12px;justify-content:space-between;align-items:center;gap:14px;padding:13px;display:flex}.community-card>div:first-child{grid-template-columns:10px 1fr;align-items:center;column-gap:9px;display:grid}.community-dot{background:#555;border-radius:50%;width:7px;height:7px}.community-card strong{font-size:11px}.community-card small{color:#666;grid-column:2;margin-top:3px;font-size:8px;line-height:1.5}.community-card.is-joined{background:#101010;border-color:#383838}.community-card.is-joined .community-dot{background:#e5e5e5}.community-card.is-warning .community-dot{background:#777}.community-card.is-muted{opacity:.55}.community-actions{flex-wrap:wrap;grid-template-columns:none!important;gap:7px!important;display:flex!important}.product-grid{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.product-card{border:1px solid var(--line);text-align:left;cursor:pointer;background:#090909;border-radius:11px;min-height:106px;padding:13px;transition:border-color .15s,background .15s;position:relative}.product-card:not(:disabled):hover{background:#0e0e0e;border-color:#414141}.product-card.selected{background:#141414;border-color:#a5a5a5}.product-card:disabled{cursor:not-allowed}.product-card strong{letter-spacing:-.045em;margin-top:13px;font-size:20px;display:block}.product-card strong small{color:#777;font-size:8px}.product-card>span{color:#777;margin-top:6px;font-size:8px;display:block}.product-card i{color:#858585;font-size:9px;font-style:normal;position:absolute;bottom:10px;right:11px}.product-card em{color:#0a0a0a;text-transform:uppercase;letter-spacing:.07em;background:#dedede;border-radius:999px;padding:3px 5px;font-size:6px;font-style:normal;position:absolute;top:9px;right:9px}.product-card.sold-out{opacity:.35;filter:grayscale()}.product-card.sold-out:hover{border-color:var(--line);background:#090909}.order-summary{position:sticky;top:84px}.order-summary h3{letter-spacing:-.06em;margin:18px 0 24px;font-size:44px}.summary-lines{border-top:1px solid var(--line)}.summary-lines>div{border-bottom:1px solid var(--line);justify-content:space-between;gap:14px;padding:11px 0;font-size:9px;display:flex}.summary-lines span{color:#626262}.summary-lines strong{color:#b5b5b5;text-align:right;font-weight:600}.summary-total{justify-content:space-between;align-items:flex-end;margin-top:20px;display:flex}.summary-total span{color:#707070;font-size:9px}.summary-total strong{font-size:17px}.summary-note{color:#565656;margin:18px 0 0;font-size:8px;line-height:1.65}.history-list{gap:8px;display:grid}.history-card{border:1px solid var(--line);background:#0c0c0c;border-radius:13px;grid-template-columns:46px 1fr auto;align-items:center;gap:13px;padding:13px;display:grid}.history-icon{color:#bdbdbd;background:#111;border:1px solid #303030;border-radius:10px;place-items:center;width:46px;height:46px;font-size:10px;display:grid}.history-main{flex-direction:column;gap:4px;display:flex}.history-main small{color:#595959;font-size:8px}.history-main strong{font-size:14px}.history-main span{color:#727272;font-size:9px}.history-side{text-align:right;flex-direction:column;align-items:flex-end;gap:7px;display:flex}.history-side b{font-size:11px}.status{letter-spacing:.07em;color:#aaa;white-space:nowrap;background:#101010;border:1px solid #333;border-radius:999px;align-items:center;width:max-content;padding:5px 7px;font-size:7px;display:inline-flex}.status-success{color:#e4e4e4;border-color:#5c5c5c}.status-processing{color:#b0b0b0}.status-expired{color:#707070;opacity:.7}.checkout-grid{grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);gap:12px;display:grid}.checkout-head{justify-content:space-between;align-items:flex-start;gap:18px;margin:15px 0 22px;display:flex}.checkout-head h1{letter-spacing:-.055em;margin:0;font-size:50px}.checkout-head p{color:#666;margin:5px 0 0;font-size:11px}.checkout-detail-list{border-top:1px solid var(--line)}.checkout-detail-list>div{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:18px;padding:13px 0;font-size:9px;display:flex}.checkout-detail-list span{color:#656565}.checkout-detail-list button{color:#c7c7c7;cursor:pointer;background:0 0;border:0}.checkout-detail-list button small{color:#5f5f5f;margin-left:7px}.reservation-box{background:#101010;border:1px solid #303030;border-radius:12px;margin-top:18px;padding:15px}.reservation-box>span{letter-spacing:.1em;color:#616161;font-size:7px;display:block}.reservation-box strong{margin:7px 0;font-size:25px;display:block}.reservation-box p{color:#626262;margin:0;font-size:8px;line-height:1.65}.payment-card h2{letter-spacing:-.04em;margin:13px 0 18px;font-size:36px}.payment-card>p{color:#5d5d5d;margin:15px 0 0;font-size:8px;line-height:1.7}.qris-placeholder{text-align:center;background:#080808;border:1px dashed #303030;border-radius:13px;place-items:center;min-height:255px;margin-bottom:11px;padding:20px;display:grid}.qris-placeholder span{color:#565656;max-width:220px;font-size:8px;line-height:1.6}.qr-grid{opacity:.5;filter:grayscale();background:repeating-linear-gradient(90deg,#d7d7d7 0 4px,#111 4px 8px),repeating-linear-gradient(0deg,#0000 0 6px,#000 6px 9px);border-radius:8px;width:132px;height:132px}.admin-login-page{place-items:center;min-height:calc(100vh - 68px);padding:56px 0;display:grid}.admin-login-card{border:1px solid var(--line);background:#0c0c0c;border-radius:18px;width:min(440px,100%);padding:30px}.admin-lock-mark{color:#090909;background:#e5e5e5;border-radius:10px;place-items:center;width:44px;height:44px;margin-bottom:26px;font-size:11px;font-weight:850;display:grid}.admin-login-card h1{letter-spacing:-.05em;margin:10px 0;font-size:38px}.admin-login-card>p{color:#747474;margin:0 0 23px;font-size:11px;line-height:1.7}.admin-login-card>small{color:#505050;margin-top:15px;font-size:8px;line-height:1.6;display:block}.admin-login-form{gap:9px;display:grid}.admin-login-form label{color:#676767;letter-spacing:.1em;text-transform:uppercase;font-size:8px}.admin-title-row{justify-content:space-between;align-items:flex-start;gap:24px;display:flex}.admin-title-row .page-intro{margin-bottom:28px}.metric-grid{grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:10px;display:grid}.metric-card{border:1px solid var(--line);background:#0c0c0c;border-radius:13px;flex-direction:column;justify-content:space-between;min-height:112px;padding:16px;display:flex}.metric-card>span{color:#626262;font-size:8px}.metric-card strong{letter-spacing:-.035em;font-size:19px}.metric-card small{color:#777;letter-spacing:.06em;font-size:7px}.metric-warning{color:#d5d5d5!important}.inventory-panel{border:1px solid var(--line);background:#0c0c0c;border-radius:16px;grid-template-columns:.8fr 1.2fr;gap:38px;margin-bottom:10px;padding:25px;display:grid}.inventory-copy h2{letter-spacing:-.04em;margin:9px 0;font-size:27px}.inventory-copy p{color:#707070;max-width:400px;margin:0;font-size:10px;line-height:1.7}.inventory-controls{grid-template-columns:1fr 1fr;gap:9px;display:grid}.inventory-controls label{gap:6px;display:grid}.inventory-controls label span{color:#666;font-size:8px}.inventory-controls input{border:1px solid var(--line);color:#fff;background:#080808;border-radius:9px;outline:none;width:100%;height:45px;padding:0 12px}.inventory-controls input:focus{border-color:#4d4d4d}.wide-field{grid-column:1/-1}.sales-toggle{border:1px solid var(--line);text-align:left;cursor:pointer;background:#090909;border-radius:11px;grid-column:1/-1;align-items:center;gap:11px;padding:11px;display:flex}.toggle-dot{background:#242424;border-radius:999px;flex:none;width:32px;height:18px;position:relative}.toggle-dot:after{content:"";background:#777;border-radius:50%;width:12px;height:12px;position:absolute;top:3px;left:3px}.sales-toggle.is-on .toggle-dot{background:#e2e2e2}.sales-toggle.is-on .toggle-dot:after{background:#111;left:17px}.sales-toggle div{flex-direction:column;gap:2px;display:flex}.sales-toggle strong{font-size:10px}.sales-toggle small{color:#626262;font-size:8px}.inventory-controls>.button,.admin-message{grid-column:1/-1}.admin-message{color:#848484;padding:2px;font-size:9px}.admin-table-wrap{padding:20px}.admin-table-head{justify-content:space-between;align-items:center;gap:18px;margin-bottom:14px;display:flex}.admin-table-head h2{margin:6px 0 0;font-size:15px}.table-scroll{overflow-x:auto}table{border-collapse:collapse;width:100%;min-width:680px}th,td{text-align:left;border-bottom:1px solid var(--line);padding:12px 9px;font-size:9px}th{color:#555;font-weight:600}td{color:#aaa}@media (hover:hover){.step-card,.flow-card,.order-summary,.history-card,.metric-card,.checkout-card,.payment-card{transition:border-color .15s}.step-card:hover,.history-card:hover{border-color:#383838}}@media (max-width:980px){.hero{grid-template-columns:1fr;gap:30px;min-height:auto;padding-top:58px}.brand-showcase{width:100%;max-width:680px;margin-inline:auto}.hero-copy{text-align:left}.section-head{grid-template-columns:1fr}.steps-grid-four{grid-template-columns:repeat(2,1fr)}.feature-panel{grid-template-columns:1fr;gap:34px}.topup-layout{grid-template-columns:1fr}.order-summary{position:static}.checkout-grid{grid-template-columns:1fr}.metric-grid{grid-template-columns:repeat(2,1fr)}.inventory-panel{grid-template-columns:1fr}}@media (max-width:700px){.container{width:min(100% - 24px,1160px)}.nav{height:60px}.brand-image-wrap{width:46px;height:32px}.brand-copy strong{font-size:10px}.brand-copy small{font-size:7px}.menu-button{display:block}.nav-links{border:1px solid var(--line);background:#0b0b0b;border-radius:12px;flex-direction:column;align-items:stretch;gap:0;padding:7px;display:none;position:absolute;top:60px;left:12px;right:12px}.nav-links.open{display:flex}.nav-links>a{border-radius:8px;padding:12px 11px}.nav-links .button{margin-top:4px}.hero{padding:44px 0 38px}.hero h1{font-size:clamp(46px,14vw,68px)}.hero-lead{font-size:13px}.hero-actions{flex-direction:column}.micro-trust{gap:6px}.brand-showcase{border-radius:16px}.brand-showcase-foot{min-height:66px;padding:13px 14px}.quick-strip{grid-template-columns:1fr 1fr}.quick-strip>div:nth-child(2){border-right:0}.quick-strip>div:nth-child(-n+2){border-bottom:1px solid var(--line)}.section{padding-top:70px}.section-head h2,.feature-copy h2,.page-intro h1{font-size:36px}.steps-grid,.steps-grid-four{grid-template-columns:1fr}.step-card{min-height:175px}.step-card h3{margin-top:34px}.feature-panel,.cta-block{border-radius:16px;padding:25px}.cta-block{flex-direction:column;align-items:flex-start}.footer{flex-direction:column;align-items:flex-start;margin-top:68px}.page-shell{padding-top:50px}.page-intro{margin-bottom:25px}.username-form{grid-template-columns:1fr}.product-grid{grid-template-columns:repeat(2,1fr)}.flow-card,.order-summary,.admin-table-wrap,.checkout-card,.payment-card{padding:17px}.account-card{grid-template-columns:44px 1fr}.account-avatar{width:44px;height:44px}.verified-badge{grid-column:2;width:max-content}.community-card{flex-direction:column;align-items:flex-start}.community-actions{width:100%}.community-actions .button{flex:1}.history-card{grid-template-columns:42px 1fr}.history-icon{width:42px;height:42px}.history-side{text-align:left;flex-direction:row;grid-column:2;align-items:flex-start}.checkout-head{flex-direction:column}.checkout-head h1{font-size:42px}.metric-grid{grid-template-columns:1fr 1fr}.admin-title-row{flex-direction:column}.admin-title-row>.button{align-self:flex-end;margin-top:-58px}.inventory-controls{grid-template-columns:1fr}.inventory-controls label,.wide-field,.sales-toggle,.inventory-controls>.button,.admin-message{grid-column:1}.admin-login-card{padding:23px}}@media (max-width:420px){.product-grid,.metric-grid,.quick-strip{grid-template-columns:1fr}.quick-strip>div{border-bottom:1px solid var(--line);border-right:0!important}.quick-strip>div:last-child{border-bottom:0}.hero h1{font-size:46px}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button,.nav-links>a,.input-wrap,.product-card,.interactive-card{transition:none!important}}
