@font-face {
  font-family:Inter;
  src:url('./fonts/inter-latin.woff2') format('woff2');
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
}
:root {
  color-scheme:dark;
  --page:#070809;
  --surface:#0c0d0f;
  --surface-raised:#151618;
  --line:#ffffff0d;
  --control-line:#ffffff29;
  --text:#f5f5f6;
  --muted:#969698;
  --subtle:#87878b;
  --accent:#ff565e;
  --radius:12px;
  --max-width:1204px;
  font-family:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  font-synthesis:none;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:116px; scrollbar-gutter:stable; }
body { margin:0; background:var(--page); color:var(--text); font-size:15px; }
body.overlay-open { overflow:hidden; }
button,input,select { font:inherit; }
button,a,input,select,summary { -webkit-tap-highlight-color:transparent; }
button { color:inherit; cursor:pointer; }
button,a { touch-action:manipulation; }
button { border:0; background:none; }
a { color:inherit; text-decoration:none; }
p,h1,h2,h3 { margin:0; }
p { color:var(--muted); line-height:1.5; }
button:disabled { cursor:default; opacity:.5; }
button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible,[tabindex]:focus-visible { outline:2px solid var(--accent); outline-offset:4px; }
input:focus-visible { outline-offset:-2px; }
img,svg { display:block; }
svg { width:20px; height:20px; flex-shrink:0; }
[hidden] { display:none!important; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link { position:fixed; top:8px; left:16px; z-index:100; background:var(--text); color:var(--page); padding:16px; transform:translateY(-150%); }
.skip-link:focus { transform:translateY(0); }
.wrap { width:100%; max-width:var(--max-width); margin-inline:auto; padding-inline:32px; }
.button { min-height:44px; display:inline-flex; justify-content:center; align-items:center; gap:10px; border:1px solid #ffffff30; border-radius:8px; padding:10px 16px; font-weight:500; font-size:14px; background:linear-gradient(#292a2c,#191a1c); box-shadow:inset 0 1px 1px #ffffff12; transition:background-color .2s,border-color .2s,box-shadow .2s; }
.button:hover { border-color:#ffffff59; box-shadow:inset 0 1px 1px #ffffff26,0 0 16px #ffffff08; }
.button-light,.button-primary { background:#ededed; border-color:#fff6; color:#191a1c; box-shadow:0 0 18px #ffffff0f,inset 0 1px 1px #fff; }
.button-light:hover,.button-primary:hover { background:#fff; border-color:#fff; box-shadow:0 0 20px #ffffff20; }
.quiet-button { color:var(--muted); padding:12px 8px; min-height:44px; font-size:14px; }
.quiet-button:hover { color:var(--text); }
.nav-shell { position:fixed; top:max(16px,env(safe-area-inset-top)); left:16px; right:16px; z-index:30; pointer-events:none; }
.site-header { max-width:var(--max-width); margin:auto; padding:0 32px; border:1px solid #ffffff0f; border-radius:16px; background:linear-gradient(137deg,#111214bf 4.87%,#0c0d0fe6 75.88%); box-shadow:inset 0 1px 1px #ffffff26; -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); pointer-events:auto; }
.header-row { display:flex; align-items:center; gap:24px; height:74px; }
.wordmark { display:inline-flex; align-items:center; gap:7px; font-size:17px; font-weight:600; letter-spacing:-.3px; flex-shrink:0; min-height:44px; }
.desktop-nav { display:flex; align-items:center; gap:10px; margin-left:auto; }
.desktop-nav a { font-size:14px; font-weight:500; color:var(--muted); padding:14px 6px; transition:color .2s; }
.desktop-nav a:hover { color:var(--text); }
.desktop-actions { display:flex; align-items:center; gap:22px; margin-left:20px; }
.desktop-actions .button { min-height:36px; padding:8px 12px; }
.menu-toggle { display:none; position:relative; width:44px; height:44px; margin-right:-8px; margin-left:auto; }
.menu-toggle span { position:absolute; left:10px; width:24px; height:1px; background:#dedee0; transition:transform .35s,opacity .25s; }
.menu-toggle span:nth-child(1) { top:15px; }
.menu-toggle span:nth-child(2) { top:22px; }
.menu-toggle span:nth-child(3) { top:29px; }
.menu-toggle[aria-expanded=true] span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.menu-toggle[aria-expanded=true] span:nth-child(2) { opacity:0; }
.menu-toggle[aria-expanded=true] span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }
.mobile-navigation { padding-bottom:16px; animation:panel-in .25s ease-out; }
.mobile-links { display:flex; flex-direction:column; gap:2px; padding:32px 0; }
.mobile-links a,.mobile-secondary button { display:flex; align-items:center; min-height:44px; padding:10px 8px; color:#aaa9ac; font-size:16px; text-align:left; }
.mobile-links a:hover,.mobile-secondary button:hover { color:white; }
.mobile-secondary { border-top:1px solid #ffffff21; padding-top:28px; padding-bottom:4px; }
.nav-shell.menu-open { pointer-events:auto; inset:0; padding:max(16px,env(safe-area-inset-top)) 16px 16px; overflow-y:auto; overscroll-behavior:contain; }
.store-hero { position:relative; overflow:hidden; padding-top:540px; }
.hero-art { position:absolute; top:0; left:50%; width:1064px; min-width:470px; max-width:100%; aspect-ratio:1064/560; transform:translateX(-50%); pointer-events:none; }
.hero-background { width:100%; height:auto; animation:background-in 2s .15s both; }
.app-cloud { position:absolute; top:43.6%; left:17.1%; width:65.8%; animation:cloud-in 1.5s .35s both; }
.cloud-row { display:flex; justify-content:center; align-items:center; gap:2.6%; }
.cloud-row + .cloud-row { margin-top:2.5%; }
.cloud-tile { width:18.2%; aspect-ratio:1; display:flex; align-items:center; justify-content:center; border-radius:24%; border:1px solid #ffffff2b; background:linear-gradient(160deg,#0a0809eb,#050607f2); box-shadow:inset 0 1px 1px #ffffff21,0 8px 30px #0007; }
.cloud-tile img { width:62%; height:62%; border-radius:23%; box-shadow:0 6px 20px #0009; }
.cloud-row:first-child .cloud-tile:first-child,.cloud-row:first-child .cloud-tile:last-child { opacity:.3; filter:blur(1.7px); transform:scale(.93) translateY(5%); }
.cloud-row:first-child .cloud-tile:nth-child(2),.cloud-row:first-child .cloud-tile:nth-child(4) { transform:translateY(2%); }
.cloud-row:last-child { -webkit-mask-image:linear-gradient(#000 40%,transparent); mask-image:linear-gradient(#000 40%,transparent); }
.cloud-row:last-child .cloud-tile:first-child,.cloud-row:last-child .cloud-tile:last-child { opacity:.45; filter:blur(1px); }
.hero-content { position:relative; text-align:center; padding:0 24px; margin:0 auto 112px; }
.hero-content h1 { font-size:80px; line-height:1.075; font-weight:600; letter-spacing:1.2px; margin-bottom:20px; }
.hero-content p { max-width:560px; margin:0 auto 16px; font-size:20px; line-height:28px; color:#929295; text-wrap:pretty; }
.search-trigger { display:flex; justify-content:space-between; align-items:center; min-height:52px; padding:14px 16px; border:1px solid #ffffff29; border-radius:12px; background:#0c0d0fcc; color:var(--subtle); text-align:left; transition:border-color .2s,background-color .2s; }
.search-trigger:hover { border-color:#ffffff4a; background:#111214; }
.hero-search { width:min(476px,100%); margin:64px auto 0; }
.search-trigger-icon { display:none; }
.search-shortcut { display:flex; align-items:center; gap:5px; margin-left:16px; }
kbd { font-family:inherit; font-size:11px; line-height:18px; padding:0 4px; min-width:18px; text-align:center; border:1px solid #ffffff0f; border-radius:4px; background:#ffffff05; color:#929295; }
.explore-heading { text-align:center; margin-bottom:32px; }
.explore-heading h2 { font-size:40px; line-height:1.2; font-weight:600; letter-spacing:-1px; margin-bottom:16px; }
.explore-heading p { font-size:20px; }
.section-heading { margin-bottom:32px; }
.section-heading h3,.catalog-heading h2 { font-size:20px; font-weight:600; letter-spacing:-.4px; line-height:28px; margin-bottom:4px; }
.featured-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px; }
.featured-card { display:flex; flex-direction:column; align-items:center; text-align:center; padding:32px; min-height:364px; background:#0b0c0e; border:1px solid var(--line); border-radius:10px; box-shadow:inset 0 1px 1px #ffffff07; transition:border-color .25s,background-color .25s; }
.featured-card:hover,.product-card:hover { border-color:#ffffff21; background:#0e0f11; }
.featured-icon { width:96px; height:96px; display:grid; place-items:center; border-radius:21px; background:linear-gradient(145deg,#0f2e3c,#0a1b24); box-shadow:inset 0 0 0 1px #ffffff07,inset 1px 1px 1px #4db6eb21; margin-bottom:22px; }
.app-icon { display:block; flex-shrink:0; width:32px; height:32px; border-radius:22%; }
.featured-icon .app-icon { width:64px; height:64px; }
.featured-card h3 { font-size:20px; line-height:28px; letter-spacing:-.5px; font-weight:600; margin-bottom:6px; }
.featured-card h3 a:hover { color:white; }
.featured-card > p { font-size:15px; line-height:19px; min-height:38px; max-width:290px; }
.studio-credit { display:flex; align-items:center; gap:8px; font-size:13px; color:var(--muted); }
.studio-credit img { width:19px; height:19px; }
.featured-card .studio-credit { margin:26px 0; }
.featured-card .button { margin-top:auto; min-height:36px; padding:7px 12px; }
.catalog { margin-top:144px; }
.catalog-toolbar { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:48px; }
.browse-tabs { display:flex; align-items:center; padding:5px; border:1px solid #ffffff0b; border-radius:999px; background:#0c0d0f; box-shadow:inset 0 1px 1px #ffffff1a; }
.browse-tabs button { min-height:44px; padding:10px 14px; border-radius:999px; color:var(--muted); font-size:14px; white-space:nowrap; }
.browse-tabs button.active { background:linear-gradient(145deg,#333436,#151618); box-shadow:inset 0 1px 1px #ffffff16,0 0 0 1px #ffffff0f; color:white; }
.browse-tabs button:hover { color:white; }
.toolbar-right { display:flex; align-items:center; gap:8px; }
.platform-tabs { display:flex; padding:4px; border:1px solid var(--control-line); border-radius:12px; background:var(--surface); }
.platform-tabs button { min-width:36px; min-height:36px; padding:8px; display:grid; place-items:center; color:var(--subtle); border-radius:6px; font-size:14px; }
.platform-tabs button.active { background:#242527; color:var(--text); }
.platform-tabs svg { width:17px; height:17px; }
.catalog-search { width:270px; min-height:46px; padding:11px 12px; }
.mobile-platform { display:none; }
.catalog-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:32px; }
.catalog-heading > div:first-child { min-width:0; }
.catalog-heading p { overflow-wrap:anywhere; }
.catalog-selects { display:flex; gap:6px; flex-shrink:0; }
select { max-width:100%; min-height:44px; padding:8px 24px 8px 10px; color:var(--muted); background:var(--surface); border:1px solid var(--line); border-radius:8px; font-size:13px; }
.active-filters { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:24px; }
.active-filters button { max-width:100%; min-height:44px; padding:8px 12px; background:#151618; border:1px solid #ffffff1a; border-radius:8px; overflow-wrap:anywhere; text-align:left; }
.active-filters .reset { background:none; color:var(--muted); border-color:transparent; }
.product-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.product-card { min-width:0; display:flex; flex-direction:column; min-height:186px; padding:26px 32px 28px; border:1px solid var(--line); border-radius:12px; background:#0b0c0e; box-shadow:inset 0 1px 1px #ffffff09; transition:border-color .25s,background-color .25s; }
.product-top { display:flex; align-items:center; gap:16px; min-height:44px; }
.product-name { display:flex; align-items:center; gap:16px; min-width:0; min-height:44px; }
.product-name h3 { font-size:16px; font-weight:600; letter-spacing:-.35px; overflow-wrap:anywhere; }
.product-action { margin-left:auto; flex-shrink:0; min-height:36px; padding:7px 9px; }
.mobile-action { display:none; }
.product-card > p { margin-top:10px; font-size:15px; line-height:19px; }
.product-meta { margin-top:auto; padding-top:24px; display:flex; flex-wrap:wrap; align-items:center; gap:10px 16px; color:var(--muted); font-size:13px; }
.product-price { margin-left:auto; font-size:13px; white-space:nowrap; }
.product-platform { display:inline-flex; align-items:center; gap:6px; font-size:12px; }
.product-platform svg { width:14px; height:14px; }
.demo-note { text-align:center; font-size:13px; margin-top:36px; }
.empty-state { grid-column:1/-1; padding:64px 20px; text-align:center; border:1px solid var(--line); border-radius:12px; }
.empty-state > svg { margin:0 auto 20px; width:28px; height:28px; color:var(--muted); }
.empty-state h3 { margin-bottom:12px; font-size:20px; font-weight:500; }
.empty-state .button { margin-top:24px; }
.faq { margin-top:128px; display:grid; grid-template-columns:1fr 2fr; gap:64px; }
.faq h2 { font-size:28px; line-height:1.3; font-weight:500; letter-spacing:-.7px; }
.faq details { border-bottom:1px solid #ffffff15; }
.faq summary { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:20px 0; min-height:64px; list-style:none; cursor:pointer; font-size:15px; }
.faq summary::-webkit-details-marker { display:none; }
.faq summary svg { width:16px; height:16px; transition:transform .2s; }
.faq details[open] summary svg { transform:rotate(45deg); }
.faq details p { padding:0 32px 24px 0; font-size:14px; }
.site-footer { margin-top:140px; position:relative; overflow:hidden; padding-top:170px; }
.footer-art { position:absolute; top:0; left:50%; transform:translateX(-50%) rotate(180deg); width:850px; max-width:130%; height:360px; background:url('./images/store-background.png') center/cover no-repeat; opacity:.85; -webkit-mask-image:linear-gradient(transparent,#000 60%); mask-image:linear-gradient(transparent,#000 60%); pointer-events:none; }
.footer-inner { position:relative; padding-top:80px; }
.site-footer::before { content:''; position:absolute; top:170px; left:0; right:0; height:1px; background:#ffffff0d; }
.footer-columns { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:32px; padding-bottom:80px; }
.footer-columns h2 { font-size:14px; line-height:20px; font-weight:600; margin-bottom:24px; }
.footer-columns a,.footer-columns button { display:flex; align-items:center; text-align:left; font-size:14px; line-height:20px; color:var(--muted); min-height:40px; padding:8px 0; }
.footer-columns a:hover,.footer-columns button:hover { color:var(--text); }
.footer-bottom { border-top:1px solid #ffffff15; display:flex; justify-content:space-between; align-items:center; gap:24px; padding:32px 0 max(32px,env(safe-area-inset-bottom)); color:var(--muted); font-size:13px; }
.footer-bottom .wordmark { color:var(--text); }
.footer-bottom > a:last-child { padding-block:14px; }
dialog { color:var(--text); background:#0e0f11; border:1px solid #ffffff26; border-radius:18px; width:min(680px,calc(100% - 32px)); max-height:calc(100dvh - 48px); padding:0; overflow:auto; overscroll-behavior:contain; box-shadow:0 24px 100px #000b; }
dialog::backdrop { background:#0009; -webkit-backdrop-filter:blur(7px); backdrop-filter:blur(7px); }
dialog[open] { animation:panel-in .22s ease-out; }
.dialog-content { padding:40px; }
.dialog-close { position:absolute; top:14px; right:14px; width:44px; height:44px; display:grid; place-items:center; border-radius:10px; color:var(--muted); }
.dialog-close:hover { color:white; background:#ffffff0a; }
.dialog-header { display:flex; align-items:center; gap:18px; padding-right:28px; }
.dialog-header .app-icon { width:64px; height:64px; }
.dialog-header h2 { font-size:26px; font-weight:600; letter-spacing:-.7px; }
.dialog-subtitle { margin-top:5px; font-size:13px; }
.demo-tag { font-size:11px; margin-left:8px; border:1px solid #ffffff20; border-radius:4px; padding:2px 5px; }
.detail-art { display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:200px; gap:18px; margin-top:28px; background:radial-gradient(ellipse at top,#35121766,transparent 75%),#090a0c; border:1px solid var(--line); border-radius:12px; }
.detail-art .app-icon { width:80px; height:80px; box-shadow:0 12px 30px #0006; }
.detail-art p { color:#cacace; font-size:16px; text-align:center; padding:0 20px; }
.detail-tabs { display:flex; gap:24px; border-bottom:1px solid #ffffff14; margin-top:24px; }
.detail-tabs button { min-height:48px; padding:12px 0; border-bottom:2px solid transparent; font-size:14px; color:var(--muted); }
.detail-tabs [aria-selected=true] { color:white; border-bottom-color:var(--accent); }
.tab-panel { min-height:155px; padding:24px 0; font-size:14px; }
.tab-panel p + p { margin-top:16px; }
.detail-disclaimer { font-size:12px; line-height:1.5; color:var(--muted); }
.feature-list { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.feature-list li { display:flex; align-items:flex-start; gap:10px; color:#b8b8bd; }
.feature-list svg { width:16px; height:16px; color:var(--accent); }
.specs { margin:0; display:grid; grid-template-columns:1fr 1fr; gap:16px 24px; }
.specs dt { color:var(--muted); font-size:12px; margin-bottom:5px; }
.specs dd { margin:0; font-size:14px; }
.detail-purchase { display:flex; align-items:center; justify-content:space-between; gap:20px; border-top:1px solid #ffffff14; padding:24px 0 16px; }
.detail-purchase strong { font-size:22px; font-weight:500; }
.detail-purchase small { display:block; margin-top:4px; color:var(--muted); font-size:12px; }
.back-button { display:inline-flex; align-items:center; gap:8px; color:var(--muted); min-height:44px; margin-bottom:20px; padding:0; font-size:13px; }
.checkout-heading { font-size:28px; font-weight:500; letter-spacing:-.6px; padding-right:16px; }
.checkout-intro { margin:12px 0 24px; font-size:14px; }
.order-summary { border:1px solid #ffffff17; border-radius:12px; padding:20px; margin-bottom:24px; }
.order-line { display:flex; align-items:center; gap:12px; }
.order-line .app-icon { width:40px; height:40px; }
.order-line p { font-size:12px; margin-top:4px; }
.order-price { margin-left:auto; font-size:14px; white-space:nowrap; }
.checkout-breakdown { border-top:1px solid #ffffff12; margin-top:20px; padding-top:20px; display:flex; justify-content:space-between; gap:12px; font-size:14px; }
.payment-options { border:0; margin:0; padding:0; display:grid; gap:10px; }
.payment-options legend { margin-bottom:16px; font-size:14px; }
.payment-option { display:flex; gap:12px; align-items:center; padding:16px; border:1px solid #ffffff17; border-radius:10px; cursor:pointer; font-size:14px; }
.payment-option:has(input:checked) { border-color:#ff565e88; background:#ff565e06; }
.payment-option input { accent-color:var(--accent); width:18px; height:18px; flex-shrink:0; }
.payment-option small { display:block; color:var(--muted); font-size:12px; margin-top:5px; }
.simulation-note { background:#ffffff04; border:1px solid #ffffff0a; border-radius:8px; padding:14px; font-size:12px; margin-block:20px; }
.checkout-submit { width:100%; }
.success-screen { padding-block:28px 12px; text-align:center; }
.success-icon { width:64px; height:64px; border:1px solid #ffffff30; border-radius:50%; display:grid; place-items:center; margin:0 auto 24px; }
.success-icon svg { width:28px; height:28px; }
.success-screen h2 { font-size:28px; margin-bottom:16px; }
.success-screen > p { font-size:14px; }
.about-dialog { padding-top:12px; }
.about-dialog .wordmark { margin-bottom:32px; }
.about-dialog h2 { font-size:32px; font-weight:500; line-height:1.2; letter-spacing:-1px; margin-bottom:24px; }
.about-dialog p { font-size:14px; margin-bottom:20px; }
.about-dialog .button { margin-top:12px; }
.search-dialog { width:min(600px,calc(100% - 32px)); margin-top:min(20vh,160px); max-height:calc(100dvh - 100px); }
.search-dialog-top { display:flex; align-items:center; padding:10px 12px 10px 20px; gap:12px; border-bottom:1px solid #ffffff17; }
.search-dialog-top > span { color:var(--muted); }
.search-dialog input { color:var(--text); font-size:16px; min-height:44px; min-width:0; width:100%; border:0; background:none; padding:8px 0; outline:none; }
.search-dialog input:focus-visible { outline:2px solid var(--accent); outline-offset:2px; border-radius:4px; }
.search-dialog input::placeholder { color:var(--subtle); }
.search-dialog input::-webkit-search-cancel-button { display:none; }
.search-close,.clear-search { min-width:44px; height:44px; display:grid; place-items:center; border-radius:6px; color:var(--muted); font-size:12px; padding:8px; }
.search-close:hover,.clear-search:hover { background:#ffffff09; color:white; }
.search-results { padding:12px; max-height:min(450px,55dvh); overflow-y:auto; overscroll-behavior:contain; }
.search-group-title { font-size:12px; margin:8px 10px 10px; color:var(--muted); }
.search-result { display:flex; align-items:center; gap:14px; min-height:68px; padding:12px; border-radius:10px; }
.search-result:hover,.search-result:focus-visible { background:#ffffff08; }
.search-result .app-icon { width:38px; height:38px; }
.search-result > span { min-width:0; }
.search-result strong { font-weight:500; font-size:14px; }
.search-result small { display:block; color:var(--muted); font-size:12px; margin-top:4px; }
.search-result > svg { margin-left:auto; color:var(--subtle); width:16px; }
.search-empty { padding:28px 20px; text-align:center; }
.search-empty p { font-size:14px; }
.search-help { display:flex; justify-content:space-between; gap:16px; border-top:1px solid #ffffff12; padding:12px 20px; font-size:11px; color:var(--muted); }
@keyframes background-in { from { opacity:0; transform:scale(1.03); } to { opacity:1; transform:scale(1); } }
@keyframes cloud-in { from { opacity:0; transform:translateY(20px); } to { opacity:1; transform:translateY(0); } }
@keyframes panel-in { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:translateY(0); } }
@media (max-width:1150px) {
  .header-row { gap:16px; }
  .desktop-nav { gap:0; }
  .desktop-actions { gap:12px; margin-left:0; }
  .desktop-actions .quiet-button { display:none; }
  .catalog-search { width:210px; }
  .catalog-heading { align-items:flex-start; }
  .catalog-selects { flex-direction:column; }
  .featured-card { padding:28px 20px; }
  .product-meta .product-platform { display:none; }
}
@media (max-width:879px) {
  .desktop-nav,.desktop-actions { display:none; }
  .menu-toggle { display:block; }
  .site-header { padding:0 16px; }
  .header-row { height:56px; }
  .wordmark { font-size:17px; }
  .wrap { padding-inline:24px; }
  .catalog-toolbar { align-items:flex-start; }
  .catalog-search { width:46px; padding:12px; }
  .catalog-search > span:not(.search-trigger-icon) { display:none; }
  .catalog-search .search-trigger-icon { display:block; }
  .search-trigger-icon svg { width:18px; height:18px; }
  .catalog-search .search-shortcut { display:none; }
  .featured-grid { gap:16px; }
  .featured-card h3 { font-size:18px; }
  .featured-card > p { min-height:76px; }
  .product-card { padding:24px; }
  .footer-columns { grid-template-columns:repeat(3,minmax(0,1fr)); gap:36px; }
}
@media (max-width:719px) {
  html { scroll-padding-top:106px; scrollbar-gutter:auto; }
  .store-hero { padding-top:345px; }
  .hero-content h1 { font-size:44px; line-height:1.1; }
  .hero-content p { font-size:16px; line-height:24px; max-width:370px; }
  .desktop-break { display:none; }
  .hero-search { margin-top:64px; font-size:16px; }
  .search-shortcut { display:none; }
  .explore-heading h2 { font-size:32px; letter-spacing:-.7px; }
  .explore-heading p { font-size:16px; line-height:24px; }
  .explore-heading { margin-bottom:40px; }
  .section-heading { margin-bottom:24px; }
  .section-heading p { font-size:14px; }
  .featured-grid { grid-template-columns:1fr; }
  .featured-card { padding:32px; min-height:356px; }
  .featured-card > p { min-height:38px; }
  .featured-card h3 { font-size:20px; }
  .featured-card .button { min-height:44px; }
  .catalog { margin-top:112px; }
  .catalog-toolbar { gap:10px; margin:0 -16px 48px; align-items:center; }
  .browse-tabs { padding:4px; flex-shrink:0; }
  .browse-tabs button { font-size:12px; padding:10px 11px; min-height:44px; }
  .desktop-tab-label { display:none; }
  .mobile-tab-label { display:inline; }
  .toolbar-right { min-width:0; }
  .platform-tabs,.catalog-search { display:none; }
  .mobile-platform { display:block; font-size:13px; min-height:44px; width:132px; padding:10px 8px; border-color:#ffffff1a; border-radius:12px; }
  .catalog-heading { flex-direction:column; gap:16px; margin-bottom:28px; }
  .catalog-heading h2 { font-size:20px; }
  .catalog-heading p { font-size:15px; line-height:20px; }
  .catalog-selects { flex-direction:row; flex-wrap:wrap; }
  .catalog-selects select { font-size:13px; padding-left:0; background:transparent; border-color:transparent; }
  .product-grid { grid-template-columns:1fr; gap:16px; }
  .product-card { padding:26px 31px 30px; min-height:186px; }
  .product-top { gap:8px; }
  .product-name { gap:16px; }
  .product-action { background:none; box-shadow:none; border-color:transparent; padding:8px; min-height:44px; width:36px; margin-right:-8px; }
  .desktop-action { display:none; }
  .mobile-action { display:block; color:var(--muted); }
  .product-card > p { margin-top:12px; font-size:15px; line-height:20px; }
  .product-meta { padding-top:22px; gap:8px; }
  .product-price { font-size:12px; }
  .product-meta .studio-credit { font-size:12px; }
  .demo-note { max-width:270px; margin-inline:auto; line-height:20px; }
  .faq { grid-template-columns:1fr; gap:24px; margin-top:100px; }
  .faq h2 { font-size:24px; }
  .site-footer { margin-top:88px; padding-top:140px; }
  .site-footer::before { top:140px; }
  .footer-inner { padding-top:56px; }
  .footer-art { height:270px; }
  .footer-columns { grid-template-columns:repeat(2,minmax(0,1fr)); gap:36px 24px; padding-bottom:40px; }
  .footer-columns h2 { margin-bottom:16px; }
  .footer-columns a,.footer-columns button { min-height:44px; }
  .footer-bottom { flex-wrap:wrap; gap:12px; padding-top:24px; }
  .footer-bottom .wordmark { width:100%; }
  .footer-bottom > span { margin-right:auto; }
  dialog { width:calc(100% - 24px); max-height:calc(100dvh - 32px); border-radius:16px; }
  .dialog-content { padding:28px 24px max(24px,env(safe-area-inset-bottom)); }
  .dialog-header { gap:14px; }
  .dialog-header .app-icon { width:52px; height:52px; }
  .dialog-header h2 { font-size:23px; }
  .dialog-subtitle { font-size:11px; }
  .detail-art { min-height:180px; }
  .feature-list { grid-template-columns:1fr; }
  .detail-purchase { flex-direction:column; align-items:stretch; }
  .detail-purchase strong { font-size:24px; }
  .order-line { flex-wrap:wrap; }
  .order-price { margin-left:52px; }
  .search-dialog { margin-top:72px; }
  .search-dialog-top { padding:8px; gap:4px; }
  .search-dialog-top > span { display:none; }
  .search-dialog input { padding-left:10px; }
  .search-help > span:last-child { display:none; }
  .about-dialog h2 { font-size:28px; }
}
@media (min-width:720px) { .mobile-tab-label { display:none; } }
@media (max-width:359px) {
  .wrap { padding-inline:20px; }
  .hero-content { padding-inline:20px; }
  .catalog-toolbar { flex-wrap:wrap; margin-inline:0; }
  .browse-tabs { width:100%; justify-content:space-between; }
  .mobile-platform { width:100%; }
  .toolbar-right { width:100%; }
  .product-card { padding:24px; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation:none!important; transition:none!important; }
}

/* ── Halaman akun, checkout, pesanan, dan koleksi ──────────────────────────
   Memakai token yang sama dengan toko: latar hitam, aksen merah, Inter lokal.
   Tidak ada warna baru yang diperkenalkan di sini, supaya halaman baru tidak
   terlihat ditempel dari tempat lain. */
.nav-shell-halaman { position:sticky; top:max(16px,env(safe-area-inset-top)); }
.nav-shell-halaman .desktop-nav a[aria-current=page] { color:var(--text); }
.nav-pengguna { font-size:14px; color:var(--muted); max-width:180px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.halaman { width:100%; max-width:900px; margin-inline:auto; padding:120px 32px 96px; }
.halaman-lebar { max-width:1060px; }
.halaman-sempit { max-width:460px; padding-top:132px; }
.halaman-kepala { margin-bottom:32px; }
.halaman-kepala .eyebrow { font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--subtle); margin-bottom:12px; }
.halaman-kepala h1 { font-size:34px; letter-spacing:-.9px; line-height:1.1; }
.halaman-kepala p { margin-top:10px; font-size:15px; }
.kartu { border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); padding:28px; }
.kartu + .kartu { margin-top:20px; }
.kartu h2 { font-size:18px; letter-spacing:-.3px; }
.kartu h3 { font-size:15px; letter-spacing:-.2px; }
.kartu-kepala { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:20px; }
.kartu-kepala p { font-size:13px; margin-top:4px; }
.daftar-kosong { border:1px dashed var(--control-line); border-radius:var(--radius); padding:40px 28px; text-align:center; }
.daftar-kosong h3 { font-size:16px; margin-bottom:8px; }
.daftar-kosong p { font-size:14px; max-width:420px; margin-inline:auto; }
.daftar-kosong .button { margin-top:20px; }
.memuat { color:var(--subtle); font-size:14px; padding:32px 0; text-align:center; grid-column:1/-1; }

/* Borang */
.borang { display:flex; flex-direction:column; gap:18px; }
.medan { display:flex; flex-direction:column; gap:8px; }
.medan label { font-size:13px; font-weight:500; color:var(--text); }
.medan input,.medan select,.medan textarea { width:100%; min-height:46px; padding:12px 14px; border:1px solid var(--control-line); border-radius:8px; background:#0f1012; color:var(--text); font-size:16px; }
.medan textarea { min-height:96px; resize:vertical; }
.medan input::placeholder,.medan textarea::placeholder { color:#66666a; }
.medan input:focus-visible,.medan select:focus-visible,.medan textarea:focus-visible { outline:2px solid var(--accent); outline-offset:-1px; border-color:transparent; }
.medan .bantuan { font-size:12px; color:var(--subtle); }
.borang .button-primary { width:100%; }
.galat-borang { margin:0; padding:12px 14px; border:1px solid #ff565e4d; border-radius:8px; background:#ff565e14; color:#ffb4b7; font-size:13px; line-height:1.5; }
.sukses-borang { margin:0; padding:12px 14px; border:1px solid #52b78840; border-radius:8px; background:#52b78814; color:#8fd8b4; font-size:13px; line-height:1.5; }
.pemberitahuan { margin:0 0 24px; padding:14px 16px; border:1px solid var(--control-line); border-radius:10px; background:var(--surface-raised); font-size:13px; color:var(--muted); line-height:1.55; }
.pemberitahuan strong { color:var(--text); }
.pemberitahuan .button { margin-top:12px; min-height:38px; font-size:13px; }

/* Tab masuk dan daftar */
.tab-akun { display:flex; gap:4px; padding:4px; border:1px solid var(--line); border-radius:10px; background:var(--surface-raised); margin-bottom:24px; }
.tab-akun a { flex:1; text-align:center; padding:10px; border-radius:7px; font-size:14px; font-weight:500; color:var(--muted); min-height:44px; display:flex; align-items:center; justify-content:center; }
.tab-akun a[aria-current=page] { background:#26272a; color:var(--text); }
.tautan-kecil { font-size:13px; color:var(--muted); text-align:center; }
.tautan-kecil a { color:var(--text); text-decoration:underline; text-underline-offset:3px; }

/* Lencana status */
.lencana { display:inline-flex; align-items:center; gap:6px; padding:5px 10px; border-radius:999px; font-size:12px; font-weight:500; border:1px solid var(--control-line); color:var(--muted); white-space:nowrap; }
.lencana::before { content:''; width:6px; height:6px; border-radius:50%; background:currentColor; }
.lencana-lunas,.lencana-terkirim { color:#6fd39b; border-color:#6fd39b40; background:#6fd39b12; }
.lencana-menunggu,.lencana-tertunda_manual { color:#e2b35f; border-color:#e2b35f40; background:#e2b35f12; }
.lencana-gagal,.lencana-kedaluwarsa,.lencana-batal { color:#8d8d92; border-color:var(--control-line); }
.lencana-perlu_tinjau,.lencana-refund { color:#ff8e94; border-color:#ff565e40; background:#ff565e12; }
.jenis-tag { display:inline-block; padding:3px 8px; border:1px solid var(--control-line); border-radius:999px; font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:var(--subtle); }

/* Daftar pesanan */
.baris-pesanan { display:flex; align-items:center; gap:16px; padding:18px 0; border-top:1px solid var(--line); }
.baris-pesanan:first-child { border-top:0; }
.baris-pesanan-isi { flex:1; min-width:0; }
.baris-pesanan-isi strong { display:block; font-size:15px; font-weight:600; }
.baris-pesanan-isi span { display:block; font-size:13px; color:var(--subtle); margin-top:3px; }
.baris-pesanan-kanan { display:flex; align-items:center; gap:14px; flex-shrink:0; }
.harga-baris { font-size:15px; font-weight:600; white-space:nowrap; }

/* Checkout */
.pilihan-paket { display:flex; flex-direction:column; gap:12px; }
.pilihan-paket label { display:flex; gap:14px; align-items:flex-start; padding:18px; border:1px solid var(--control-line); border-radius:10px; cursor:pointer; transition:border-color .2s,background-color .2s; }
.pilihan-paket label:hover { border-color:#ffffff4d; }
.pilihan-paket label.terpilih { border-color:var(--accent); background:#ff565e0f; }
.pilihan-paket input { margin-top:3px; width:18px; height:18px; accent-color:var(--accent); flex-shrink:0; }
.paket-isi { flex:1; min-width:0; }
.paket-isi strong { display:block; font-size:15px; font-weight:600; }
.paket-isi small { display:block; font-size:13px; color:var(--subtle); margin-top:4px; line-height:1.5; }
.paket-harga { font-size:17px; font-weight:600; white-space:nowrap; }
.rincian-total { display:flex; align-items:center; justify-content:space-between; padding-top:18px; margin-top:18px; border-top:1px solid var(--line); }
.rincian-total span { font-size:14px; color:var(--muted); }
.rincian-total strong { font-size:22px; letter-spacing:-.4px; }
.ringkas-produk { display:flex; align-items:center; gap:16px; padding-bottom:20px; margin-bottom:20px; border-bottom:1px solid var(--line); }
.ringkas-produk .app-icon { width:48px; height:48px; border-radius:11px; }
.ringkas-produk div { min-width:0; }
.ringkas-produk strong { display:block; font-size:16px; font-weight:600; }
.ringkas-produk span { display:block; font-size:13px; color:var(--subtle); margin-top:3px; }

/* Aplikasi Saya */
.kartu-aplikasi { display:grid; gap:20px; }
.aplikasi-kepala { display:flex; align-items:flex-start; gap:16px; }
.aplikasi-kepala .app-icon { width:52px; height:52px; border-radius:12px; }
.aplikasi-kepala div { flex:1; min-width:0; }
.aplikasi-kepala h2 { font-size:17px; }
.aplikasi-kepala p { font-size:13px; margin-top:4px; }
.daftar-rilis { display:flex; flex-direction:column; gap:12px; }
.baris-rilis { display:flex; align-items:center; gap:14px; padding:14px 16px; border:1px solid var(--line); border-radius:10px; background:var(--surface-raised); }
.baris-rilis-isi { flex:1; min-width:0; }
.baris-rilis-isi strong { font-size:14px; font-weight:600; }
.baris-rilis-isi span { display:block; font-size:12px; color:var(--subtle); margin-top:4px; line-height:1.5; }
.baris-rilis .button { min-height:40px; padding:8px 14px; font-size:13px; flex-shrink:0; }
.kotak-lisensi { border:1px solid var(--control-line); border-radius:10px; padding:18px; }
.kunci-lisensi { display:flex; align-items:center; gap:12px; margin-top:12px; padding:12px 14px; border-radius:8px; background:#0f1012; border:1px solid var(--line); }
.kunci-lisensi code { flex:1; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:14px; letter-spacing:.08em; word-break:break-all; }
.kunci-lisensi button { min-height:36px; padding:6px 12px; border:1px solid var(--control-line); border-radius:7px; font-size:12px; flex-shrink:0; }
.daftar-perangkat { list-style:none; margin:14px 0 0; padding:0; display:flex; flex-direction:column; gap:8px; }
.daftar-perangkat li { display:flex; align-items:center; gap:12px; font-size:13px; color:var(--muted); }
.daftar-perangkat li span { flex:1; min-width:0; }
.daftar-perangkat button { font-size:12px; color:#ff8e94; text-decoration:underline; text-underline-offset:3px; min-height:36px; }

/* Halaman pesanan */
.papan-status { display:flex; align-items:center; gap:16px; padding:22px; border:1px solid var(--control-line); border-radius:12px; background:var(--surface-raised); margin-bottom:24px; }
.papan-status div { flex:1; min-width:0; }
.papan-status strong { display:block; font-size:16px; }
.papan-status p { font-size:13px; margin-top:5px; }
.rincian-daftar { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px 24px; margin:0; }
.rincian-daftar div { min-width:0; }
.rincian-daftar dt { font-size:12px; color:var(--subtle); margin-bottom:5px; }
.rincian-daftar dd { margin:0; font-size:14px; word-break:break-word; }
.aksi-baris { display:flex; flex-wrap:wrap; gap:12px; margin-top:24px; }
.hitung-mundur { font-variant-numeric:tabular-nums; }

@media (max-width:720px) {
  .halaman { padding:104px 20px 72px; }
  .halaman-sempit { padding-top:110px; }
  .halaman-kepala h1 { font-size:27px; }
  .kartu { padding:22px; }
  /* Judul kartu dan tombol di sebelahnya dibuat bisa turun baris.
     Pada 390px, tombol Aplikasi Saya di kartu Riwayat pesanan meluber 9px
     keluar layar dan membuat seluruh halaman bisa digeser ke samping. */
  .kartu-kepala { flex-wrap:wrap; }
  .kartu-kepala > .button { flex-shrink:0; }
  .nav-shell-halaman .desktop-nav { display:flex; gap:12px; overflow-x:auto; scrollbar-width:none; }
  .nav-shell-halaman .desktop-nav::-webkit-scrollbar { display:none; }
  .nav-shell-halaman .header-row { height:auto; padding:14px 0; gap:12px; flex-wrap:wrap; }
  .nav-shell-halaman .desktop-actions { margin-left:auto; gap:12px; }
  .nav-pengguna { display:none; }
  .rincian-daftar { grid-template-columns:1fr; gap:16px; }
  .baris-pesanan { flex-wrap:wrap; }
  /* Baris kanan dibuat bisa turun baris sendiri.
     Dengan space-between dan isi yang lebih lebar daripada wadahnya, item
     terakhir MELUBER keluar alih alih dipadatkan, dan tombol Detail menyembul
     9px di luar layar. Lencana seperti "Menunggu pembayaran" cukup panjang
     untuk memicunya. */
  .baris-pesanan-kanan { width:100%; justify-content:flex-start; flex-wrap:wrap; gap:10px; }
  .baris-pesanan-kanan .button { margin-left:auto; }
  .baris-rilis { flex-wrap:wrap; }
  .baris-rilis .button { width:100%; }
  .pilihan-paket label { padding:16px; }
  .paket-harga { font-size:15px; }
}