/* Shared design system for the public site, account and administration. */
:root {
  color-scheme: dark;
  --bg:#09090b; --bg2:#101013; --bg3:#17171c;
  --card:rgba(255,255,255,.03); --card-hi:rgba(255,255,255,.055);
  --border:rgba(255,255,255,.08); --border-hi:rgba(190,173,255,.32);
  --text:#f2f0f8; --fg:#f2f0f8; --muted:#96939f; --muted2:#75717e;
  --violet:#a18bff; --violet-hi:#c2b4ff; --violet-deep:#7660d4;
  --pink:#d2a7e8; --green:#91dfbb;
  --t-smooth:cubic-bezier(.22,1,.36,1);
}
html { scroll-behavior:smooth; scroll-padding-top:110px; }
body { background:#09090b; line-height:1.65; overflow-x:hidden; user-select:auto; -webkit-user-select:auto; }
body::before { background:radial-gradient(ellipse 75% 35% at 50% 0,rgba(139,116,223,.12),transparent 75%),radial-gradient(ellipse at 50% 40%,transparent 35%,rgba(0,0,0,.32)); }
body::after { opacity:.15; }
::selection { background:rgba(161,139,255,.3); color:#fff; }
::-webkit-scrollbar { width:7px; height:7px; }
::-webkit-scrollbar-track { background:#09090b; }
::-webkit-scrollbar-thumb { background:#35313e; border-radius:99px; }
::-webkit-scrollbar-thumb:hover { background:#665780; }
.nav { position:fixed; top:16px; left:50%; width:min(1220px,calc(100% - 36px)); transform:translateX(-50%); border:1px solid var(--border); border-radius:18px; background:rgba(16,16,20,.78); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); box-shadow:0 12px 48px rgba(0,0,0,.2); }
.nav-inner { min-height:70px; padding:10px 24px; gap:24px; }
.nav .logo { letter-spacing:-.065em; font-size:26px; }
.nav .links { gap:7px; }
.nav .links a { font-size:13px; font-weight:500; padding:8px 12px; color:#a7a2b0; }
.nav .links a.active { color:#faf8ff; background:rgba(255,255,255,.065); border-radius:9px; }
.nav .actions { gap:9px; }
.nav-glider { opacity:.2; }
.hero { padding-top:190px; min-height:680px; }
.hero h1,.hero-title { letter-spacing:-.07em; }
.hero .lead { max-width:540px; margin-inline:auto; color:#a4a0ad; font-size:17px; }
.section { padding-block:90px; }
.section .heading { margin-bottom:36px; }
.heading h2 { font-size:clamp(28px,3.4vw,46px); letter-spacing:-.045em; line-height:1.15; }
.heading p { max-width:580px; margin:16px auto 0; color:var(--muted); }
.container { width:min(1160px,calc(100% - 40px)); }
.tag { letter-spacing:.18em; font-size:10px; color:#b1a4d6; }
.feature-card,.feat,.product,.shop-card,.auth-card,.profile-card,.card,.panel,.stat-card,.review-card,.team-card,details { border:1px solid var(--border); background:rgba(255,255,255,.03); border-radius:20px; backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); box-shadow:0 10px 35px rgba(0,0,0,.08); transition:border-color .25s,background .25s,transform .3s var(--t-smooth); }
.feature-card:hover,.feat:hover,.product:hover,.shop-card:hover,.team-card:hover { border-color:var(--border-hi); background:rgba(255,255,255,.045); transform:translateY(-3px); }
.product,.shop-card { display:flex; flex-direction:column; height:100%; padding:28px; }
.product .buy-btn { margin-top:auto; }
.features-grid,.products-grid,.shop-row { align-items:stretch; gap:20px; }
input,select,textarea { border:1px solid var(--border); background:rgba(0,0,0,.22); border-radius:10px; color:var(--fg); min-height:44px; outline:none; max-width:100%; }
input:focus,select:focus,textarea:focus { border-color:#a18bff; box-shadow:0 0 0 3px rgba(161,139,255,.09); }
.btn,button { transition:transform .25s var(--t-smooth),background .25s,border-color .25s,box-shadow .25s; }
.btn { border-radius:11px; min-height:42px; font-weight:600; letter-spacing:0; }
.btn-primary { background:#b8a5ff; border-color:#b8a5ff; color:#17121f; box-shadow:0 3px 20px rgba(160,134,240,.1); }
.btn-primary:hover { background:#c8b8ff; border-color:#c8b8ff; color:#17121f; box-shadow:0 5px 25px rgba(160,134,240,.2); transform:translateY(-2px); }
.btn:active,button:active { transform:scale(.98); }
:focus-visible { outline:2px solid #c2b4ff; outline-offset:4px; }
button:disabled,.btn[aria-disabled=true] { opacity:.55; cursor:wait; }
.is-loading::after { content:''; display:inline-block; width:13px; height:13px; margin-left:9px; border:2px solid currentColor; border-right-color:transparent; border-radius:50%; animation:soloma-spin .7s linear infinite; vertical-align:middle; }
@keyframes soloma-spin { to { transform:rotate(360deg); } }
.soloma-status { display:inline-flex; align-items:center; gap:7px; white-space:nowrap; color:#a6ddc4; font:500 10px/1.2 Inter,sans-serif; letter-spacing:.03em; }
.soloma-status::before { content:''; width:5px; height:5px; background:#9ce4bd; border-radius:50%; box-shadow:0 0 0 4px rgba(156,228,189,.07); animation:soloma-status-pulse 3s ease-in-out infinite; }
@keyframes soloma-status-pulse { 50% { opacity:.55; } }
.site-toast-region { position:fixed; right:24px; bottom:24px; z-index:100000; display:grid; gap:10px; max-width:min(400px,calc(100vw - 36px)); }
.site-toast { padding:16px 20px; border:1px solid var(--border-hi); border-radius:14px; color:#f1eef9; background:rgba(29,26,36,.92); backdrop-filter:blur(16px); box-shadow:0 12px 50px #0005; animation:soloma-toast-in .25s var(--t-smooth); }
.site-toast.error { border-color:#fb71854d; }
@keyframes soloma-toast-in { from { opacity:0; transform:translateY(10px); } }
.site-scroll-top { position:fixed; bottom:28px; left:28px; z-index:1000; width:44px; height:44px; border:1px solid var(--border); border-radius:14px; background:#1a1723b3; color:#ded5f5; backdrop-filter:blur(16px); cursor:pointer; transition:opacity .2s,transform .2s; }
.site-scroll-top[hidden] { display:block; opacity:0; transform:translateY(12px); pointer-events:none; }
.site-lightbox,.soloma-video { position:fixed; inset:0; margin:auto; padding:22px; width:min(1100px,95vw); max-height:92vh; background:#121116; border:1px solid var(--border); border-radius:20px; color:var(--text); box-shadow:0 30px 120px #0009; }
.site-lightbox::backdrop,.soloma-video::backdrop { background:#050509b8; backdrop-filter:blur(16px); }
.site-lightbox img { max-height:76vh; width:100%; object-fit:contain; border-radius:10px; }
.site-lightbox-close,.soloma-video-close { position:absolute; top:12px; right:12px; width:36px; height:36px; border-radius:50%; background:#121116db; color:white; border:1px solid var(--border); z-index:2; cursor:pointer; font-size:23px; }
.soloma-video iframe { width:100%; aspect-ratio:16/9; border:0; border-radius:12px; display:block; }
[data-site-lightbox] { overflow:hidden; cursor:zoom-in; border-radius:18px; border:1px solid var(--border); }
[data-site-lightbox] img { transition:transform .45s var(--t-smooth); }
[data-site-lightbox]:hover img { transform:scale(1.03); }
.sidebar { background:#0e0d12d9; border-right:1px solid var(--border); backdrop-filter:blur(16px); }
.content { max-width:1800px; min-width:0; }
.card { padding:24px; }
.card form { display:grid; gap:18px; }
.card pre { white-space:pre-wrap; overflow-wrap:anywhere; }
.table-wrap { max-width:100%; overflow-x:auto; }
.footer { border-top:1px solid var(--border); background:rgba(0,0,0,.12); }
.profile { padding-top:125px; }
.profile-grid { grid-template-columns:210px minmax(0,1fr); gap:32px; }
.profile-side { align-self:start; }
.profile-grid>div { min-width:0; }
.settings-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; margin-top:20px; align-items:start; }
.settings-card { padding:24px; display:flex; flex-direction:column; gap:16px; min-width:0; }
.settings-card h3 { font-size:19px; margin:0; }
.settings-card form { display:grid; gap:14px; }
.settings-card label { display:grid; gap:7px; color:var(--muted); font-size:12px; }
.settings-card input,.settings-card select,.settings-card textarea { width:100%; padding:10px 12px; font:inherit; color:var(--fg); }
.settings-card .btn { width:fit-content; max-width:100%; }
.settings-card input[type=file] { font-size:11px; }
.settings-facts { display:grid; grid-template-columns:95px minmax(0,1fr); gap:12px; font-size:13px; }
.settings-facts dt { color:var(--muted); }.settings-facts dd { overflow-wrap:anywhere; }
.settings-actions { display:flex; gap:10px; flex-wrap:wrap; }
.settings-wide { grid-column:1/-1; }
.settings-avatar { width:80px; height:80px; border-radius:22px; object-fit:cover; }
.settings-avatar-empty { display:grid; place-items:center; color:#c2b4ff; font-size:32px; background:#b8a5ff14; border:1px solid var(--border-hi); }
.settings-banner { width:100%; aspect-ratio:4/1; object-fit:cover; border-radius:14px; }
.settings-qr { width:210px; height:210px; background:white; border-radius:12px; }
.settings-backup { user-select:text; font:14px/1.8 monospace; padding:16px; border:1px dashed var(--border-hi); border-radius:10px; }
.screenshot-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.screenshot-preview { display:block; width:100%; min-width:0; padding:0; color:var(--fg); background:var(--card); text-align:left; }
.screenshot-preview img { width:100%; height:auto; aspect-ratio:16/9; object-fit:cover; }
.screenshot-preview>span { padding:16px; display:flex; justify-content:space-between; font-size:13px; }
@media(max-width:800px) { .profile-grid,.settings-grid,.screenshot-grid { grid-template-columns:1fr; } .profile { padding-top:110px; } .settings-wide { grid-column:auto; } }
@media(max-width:900px) { .soloma-status { display:none; } .nav { top:10px; width:calc(100% - 24px); } .nav-inner { padding:10px 16px; gap:14px; } .nav .links a { padding:8px; } .section { padding-block:64px; } }
@media(max-width:768px) { .nav.open .links,.nav.open .actions,.nav.open .nav-rail { display:flex!important; } .nav.open .links { flex-direction:column; align-items:stretch; } .hero { padding-top:145px; min-height:600px; } .container { width:calc(100% - 32px); } .product,.shop-card,.card { padding:22px; } .site-toast-region { right:16px; bottom:16px; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { animation-duration:.01ms!important; transition-duration:.01ms!important; scroll-behavior:auto!important; } }

/* Product direction: editorial type, calm surfaces, compact purposeful content. */
body { background:#0b0b0e!important; font-family:Inter,system-ui,sans-serif!important; padding-top:0!important; }
body::after { display:none!important; }
.nav { position:fixed!important; top:18px!important; left:50%!important; transform:translateX(-50%)!important; width:min(1200px,calc(100% - 40px))!important; background:rgba(17,17,22,.78)!important; border-radius:15px!important; border:1px solid rgba(255,255,255,.09)!important; }
.nav-inner { min-height:62px!important; }
.nav .logo { background:none!important; -webkit-text-fill-color:#f4f1ff!important; color:#f4f1ff!important; text-shadow:none!important; font-weight:750!important; letter-spacing:-.06em!important; }
main { margin-top:0!important; }
.landing-refresh { margin-top:0; }
.studio-hero { position:relative; min-height:770px; display:flex; align-items:center; padding:155px 0 95px; overflow:hidden; border-bottom:1px solid rgba(255,255,255,.06); }
.studio-hero-layout { position:relative; display:grid; grid-template-columns:1fr 1.08fr; gap:56px; align-items:center; }
.studio-eyebrow { display:block; font:500 10px/1.4 Inter,sans-serif; letter-spacing:.16em; text-transform:uppercase; color:#91899e; }
.studio-hero h1 { font:650 clamp(54px,5.6vw,82px)/1.04 Inter,sans-serif; letter-spacing:-.07em; margin:26px 0; color:#f5f2fa; }
.studio-hero h1 span { color:#a38de8; }
.studio-hero-copy>p { font-size:15px; line-height:1.8; max-width:420px; color:#9c96a8; }
.studio-hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:24px; margin-top:32px; }
.studio-hero-actions .btn { display:inline-flex; gap:36px; padding:13px 22px; }
.studio-text-link { display:inline-flex; gap:16px; align-items:center; color:#c9c3d5; font-size:12px; text-decoration:none; }
.studio-text-link:hover { color:white; }
.studio-hero-meta { display:flex; gap:28px; margin-top:56px; font:500 9px Inter,sans-serif; letter-spacing:.12em; color:#77707e; }
.studio-product-shot { transform:perspective(1000px) rotateY(-5deg) rotateX(2deg); border:1px solid rgba(255,255,255,.12); border-radius:14px; background:#131218; overflow:hidden; box-shadow:0 30px 80px #0008,0 0 60px #8b5cf60b; }
.studio-window-bar { display:flex; justify-content:space-between; padding:14px 16px; color:#726d7d; font:10px Inter,sans-serif; }
.studio-window-dots { color:#4b4556; letter-spacing:3px; font-size:7px; }
.studio-product-shot button { display:block; padding:0; border:0; border-radius:0; width:100%; background:none; cursor:zoom-in; }
.studio-product-shot img { display:block; width:100%; height:auto; aspect-ratio:16/10; object-fit:cover; max-height:420px; }
.studio-shot-caption { display:flex; justify-content:space-between; padding:14px 16px; color:#8e879b; font:8px Inter,sans-serif; letter-spacing:.12em; }
.studio-section { padding:84px 0; border-bottom:1px solid rgba(255,255,255,.045); }
.studio-section-top { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:30px; }
.studio-section h2,.access-page h1 { font:600 clamp(29px,3.2vw,44px)/1.14 Inter,sans-serif; letter-spacing:-.045em; margin:0 0 28px; color:#edeaf3; }
.studio-section-lead { max-width:560px; color:#968fa3; font-size:14px; line-height:1.8; margin:-10px 0 32px; }
.studio-feature-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; margin-top:38px; }
.studio-feature { padding:26px 0; border-top:1px solid #ffffff12; }
.studio-feature>span { font:10px Inter,sans-serif; color:#806ba6; }
.studio-feature h3 { font:600 17px Inter,sans-serif; margin:24px 0 12px; letter-spacing:-.025em; }
.studio-feature p { font-size:13px; color:#938c9f; line-height:1.8; max-width:290px; }
.studio-gallery { gap:24px; margin-top:32px; }
.studio-gallery .screenshot-preview { border:1px solid #ffffff10; background:#111116; border-radius:14px; }
.studio-gallery .screenshot-preview img { aspect-ratio:16/10; max-height:360px; }
.studio-caption { color:#77707e; font-size:11px; }
.studio-plans { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.studio-plan { padding:32px; display:flex; flex-direction:column; align-items:start; border:1px solid #ffffff12; border-radius:16px; background:linear-gradient(140deg,#ffffff04,transparent); }
.studio-plan:first-child { border-color:#ad8de833; background:linear-gradient(140deg,#ad8de80c,transparent); }
.studio-plan h3 { font:550 34px Inter,sans-serif; letter-spacing:-.04em; margin:30px 0 12px; }
.studio-plan>p { font-size:13px; color:#958ca4; margin-bottom:24px; }
.studio-plan ul { display:grid; gap:14px; padding-top:24px; border-top:1px solid #ffffff10; width:100%; margin-bottom:30px; }
.studio-plan li { color:#beb7c9; font-size:13px; }
.studio-plan li::before { content:'↳'; margin-right:12px; color:#9d82d1; }
.studio-plan>.btn { margin-top:auto; min-width:180px; }
.studio-review { display:grid; grid-template-columns:.9fr 1.1fr; gap:70px; align-items:center; }
.studio-review h2 { margin-top:26px; }
.studio-review p { color:#938c9f; font-size:14px; max-width:310px; }
.studio-video-preview { position:relative; border:1px solid #ffffff15; border-radius:16px; overflow:hidden; padding:0; cursor:pointer; background:#141119; }
.studio-video-preview img { width:100%; height:auto; aspect-ratio:16/9; object-fit:cover; opacity:.65; }
.studio-video-preview>span { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); display:grid; place-items:center; width:56px; height:56px; border:1px solid #ffffff33; border-radius:50%; backdrop-filter:blur(12px); color:white; }
.studio-faq { display:grid; grid-template-columns:.9fr 1.1fr; gap:70px; }
.studio-faq h2 { margin-top:26px; }
.studio-faq-items { display:grid; gap:0; }
.studio-faq-items details { padding:22px 0; background:none; border-radius:0; border:0; border-bottom:1px solid #ffffff13; box-shadow:none; backdrop-filter:none; }
.studio-faq-items summary { cursor:pointer; color:#d9d2e5; font-size:14px; }
.studio-faq-items details p { color:#8f879d; font-size:13px; margin-top:15px; line-height:1.8; }
.studio-faq-items>.studio-text-link { margin-top:25px; }
.access-page { padding:150px 0 90px; min-height:75vh; }
.access-grid { display:grid; grid-template-columns:1.1fr .9fr; gap:24px; margin-top:36px; }
.access-card { padding:30px; border:1px solid #ffffff12; border-radius:18px; background:linear-gradient(140deg,#ffffff04,transparent); }
.access-card h2 { font:600 24px/1.2 Inter,sans-serif; margin:24px 0; letter-spacing:-.03em; }
.access-card p { color:#938c9f; font-size:13px; line-height:1.8; }
.access-note { margin-top:22px; font-size:11px!important; }
.purchase-options { display:grid; gap:10px; width:100%; }
.purchase-option { display:flex; align-items:center; gap:14px; min-width:0; padding:16px; border:1px solid #ffffff0d; border-radius:12px; background:#ffffff03; color:var(--fg); transition:background .2s,border-color .2s,transform .2s; }
.purchase-option:hover { background:#b8a5ff0a; border-color:#b8a5ff33; color:white; transform:translateY(-2px); }
.purchase-option>span:nth-child(2) { display:grid; gap:5px; min-width:0; }
.purchase-option strong { font:550 13px Inter,sans-serif; overflow-wrap:anywhere; }
.purchase-option small { color:#8d859c; font-size:11px; }
.purchase-icon { display:grid; place-items:center; flex-shrink:0; width:36px; height:36px; background:#9d82d114; color:#c5ace9; border:1px solid #9d82d122; border-radius:10px; font-size:18px; }
.purchase-funpay { font:700 12px Inter,sans-serif; color:#8dbbff; background:#4488dd14; border-color:#4488dd22; }
.purchase-arrow { margin-left:auto; color:#80738f; }
.access-activation form { display:grid; gap:18px; margin-top:28px; }
.access-activation label { display:grid; gap:10px; color:#a096b1; font-size:11px; }
.access-activation input { width:100%; padding:12px; font:13px monospace; }
.access-activation .btn { width:fit-content; }
.access-help { display:flex; gap:16px; padding-top:26px; margin-top:36px; border-top:1px solid #ffffff10; color:#a38de8; }
.access-help p { font-size:11px; }
@media(max-width:900px) { .studio-hero-layout { gap:32px; } .studio-hero h1 { font-size:58px; } .studio-review,.studio-faq { gap:35px; } }
@media(max-width:700px) { .studio-hero { min-height:0; padding:135px 0 60px; } .studio-hero-layout,.studio-review,.studio-faq,.studio-feature-grid,.studio-plans,.access-grid { grid-template-columns:1fr; } .studio-hero-layout { gap:46px; } .studio-hero h1 { font-size:58px; } .studio-product-shot { transform:none; } .studio-hero-meta { margin-top:32px; } .studio-feature-grid { gap:8px; } .studio-section { padding:56px 0; } .studio-section-top { margin-bottom:22px; } .studio-caption { display:none; } .studio-plan,.access-card { padding:24px; } .access-page { padding:125px 0 60px; } .nav { top:12px!important; width:calc(100% - 24px)!important; } }

/* Monochrome direction: centered typography and atmospheric game imagery. */
:root { --accent:#ededed; --accent-hover:#fff; }
body { background-color:#080809; }
.nav { border-radius:18px!important; background:rgba(9,9,10,.78)!important; border-color:#ffffff0d!important; }
.nav .brand,.nav .logo,.footer-logo { color:#f0f0f2!important; }
.btn-primary { background:#efefef!important; color:#101012!important; border-color:#efefef!important; box-shadow:none!important; }
.btn-primary:hover { background:#fff!important; box-shadow:0 6px 24px #ffffff16!important; }
.studio-hero { position:relative; overflow:hidden; min-height:0; padding:155px 0 70px; background:#080809; }
.studio-hero-layout { position:relative; display:flex; flex-direction:column; gap:56px; }
.studio-hero-copy { width:100%; max-width:760px; text-align:center; margin:auto; }
.studio-eyebrow { color:#919196; }
.studio-hero h1 { font-family:Georgia,'Times New Roman',serif; font-size:clamp(58px,7.8vw,106px); font-weight:400; line-height:.98; letter-spacing:-.065em; margin:24px 0 30px; color:#f2f2f3; }
.studio-hero h1 span { color:#f2f2f3; }
.studio-hero-copy>p { max-width:510px; margin:0 auto; color:#aaaab0; font-size:14px; line-height:1.7; }
.studio-hero-actions { justify-content:center; margin-top:28px; }
.studio-hero-actions .btn { border-radius:100px; padding:13px 25px; }
.studio-text-link { color:#b3b3ba; }
.studio-hero-meta { justify-content:center; gap:28px; margin-top:30px; color:#707077; }
.studio-product-shot { width:100%; max-width:1050px; margin:auto; transform:none; border:1px solid #ffffff26; border-radius:22px; background:#101012; box-shadow:0 -12px 70px #ffffff0a,0 30px 80px #000a; overflow:hidden; }
.studio-product-shot img { aspect-ratio:16/9; max-height:none; }
.studio-window-bar,.studio-shot-caption { color:#85858d; }
.studio-section h2,.access-page h1 { color:#eeeef0; }
.studio-feature>span,.studio-plan li::before { color:#9999a3; }
.studio-feature p,.studio-section-lead,.studio-plan>p,.studio-review p,.studio-faq-items details p,.access-card p { color:#94949e; }
.studio-plan:first-child { border-color:#ffffff28; background:linear-gradient(140deg,#ffffff08,transparent); }
.studio-feature h3,.studio-plan h3,.access-card h2 { color:#e5e5e9; }
.purchase-option:hover { background:#ffffff08; border-color:#ffffff30; }
.purchase-icon { background:#ffffff08; border-color:#ffffff12; color:#d7d7df; }
.purchase-funpay { color:#b4ccf1; }
.access-help { color:#b7b7c1; }
@media(max-width:700px) {
 .studio-hero { padding:125px 0 48px; }
 .studio-hero-layout { gap:38px; }
 .studio-hero h1 { font-size:clamp(50px,14vw,78px); }
 .studio-hero-copy>p { font-size:13px; }
 .studio-hero-actions { flex-wrap:wrap; gap:18px; }
 .studio-hero-meta { gap:18px; font-size:9px; }
 .studio-product-shot { border-radius:14px; }
 .studio-shot-caption { font-size:7px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto!important; } *,*::before,*::after { animation:none!important; transition:none!important; } }
.studio-hero h1 { font-family:Georgia,'Times New Roman',serif!important; font-weight:400!important; }
