/* STAX Phase 2 — shared product UI, intentionally dependency-free. */
:root{color-scheme:dark;--s-bg:#09090b;--s-surface:#0f0f12;--s-surface-2:#151518;--s-surface-3:#1c1c20;--s-line:rgba(255,255,255,.10);--s-line-strong:rgba(255,255,255,.16);--s-text:#fafafa;--s-muted:#a1a1aa;--s-subtle:#71717a;--s-accent:#f4f4f5;--s-positive:#34d399;--s-warning:#fbbf24;--s-danger:#fb7185;--s-r8:8px;--s-r12:12px;--s-r16:16px;--s-shadow:0 24px 64px rgba(0,0,0,.28);--s-content:1200px}
html{background:var(--s-bg);scroll-behavior:smooth}body.stax-dark{background:var(--s-bg);color:var(--s-text);font-family:Inter,Geist,Pretendard,"Noto Sans KR",system-ui,sans-serif;font-weight:400}body.stax-dark:before,body.stax-dark:after{display:none!important}.stax-dark :where(h1,h2,h3,h4,p){margin-top:0}.stax-dark :where(h1,h2,h3,h4,strong,b){font-weight:600}.stax-dark :where(a,button,input,select,textarea){transition:background-color .2s ease,border-color .2s ease,color .2s ease,opacity .2s ease,transform .2s ease}.stax-dark :where(a,button):active{transform:scale(.98)}.stax-dark :where(a,button,input,select,textarea):focus-visible{outline:2px solid #fff;outline-offset:3px}.stax-dark :where(button,input,select,textarea){min-height:44px}.stax-dark :where(input,select,textarea){border:1px solid var(--s-line);border-radius:var(--s-r8);background:#0b0b0e;color:var(--s-text)}.stax-dark :where(input,select,textarea)::placeholder{color:#52525b}.stax-dark :where(input,select,textarea):focus{border-color:rgba(255,255,255,.32);box-shadow:0 0 0 3px rgba(255,255,255,.06)}
.stax-dark .p-header{position:sticky;top:0;z-index:70;display:grid;grid-template-columns:auto 1fr auto;align-items:center;width:100%;height:64px;padding:0 max(24px,calc((100% - var(--s-content))/2));border-bottom:1px solid var(--s-line);background:rgba(9,9,11,.92);backdrop-filter:blur(18px)}.stax-dark .p-brand{display:inline-flex;align-items:center;gap:10px;color:var(--s-text);font-size:14px;text-decoration:none}.stax-dark .p-brand>span{display:grid;width:32px;height:32px;place-items:center;border:1px solid var(--s-line);border-radius:var(--s-r8);background:var(--s-surface-2);font-size:12px}.stax-dark .p-header nav{display:flex;justify-content:center;gap:2px}.stax-dark .p-header nav a,.stax-dark .p-actions>a:first-child{min-height:40px;display:inline-flex;align-items:center;padding:0 12px;border-radius:var(--s-r8);color:var(--s-muted);font-size:13px;text-decoration:none}.stax-dark .p-header nav a:hover,.stax-dark .p-header nav a[aria-current=page],.stax-dark .p-actions>a:first-child:hover{background:var(--s-surface-3);color:var(--s-text)}.stax-dark .p-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px}.stax-dark .nav-toggle{display:none;width:40px;height:40px;place-items:center;border:1px solid var(--s-line);border-radius:var(--s-r8);background:var(--s-surface-2);color:var(--s-text)}
.stax-dark .btn,.stax-dark .button,.stax-dark button:not(.nav-toggle):not(.danger-link){min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 16px;border:1px solid var(--s-line-strong);border-radius:var(--s-r8);background:var(--s-accent);color:#09090b;font-size:14px;font-weight:500;text-decoration:none;box-shadow:none}.stax-dark .btn:hover,.stax-dark .button:hover,.stax-dark button:not(.nav-toggle):not(.danger-link):hover{background:#fff}.stax-dark .btn.ghost,.stax-dark .button.secondary,.stax-dark .button.ghost{background:var(--s-surface-2);color:var(--s-text)}.stax-dark .btn.ghost:hover,.stax-dark .button.secondary:hover,.stax-dark .button.ghost:hover{background:var(--s-surface-3)}.stax-dark :where(.btn,.button,button):disabled{cursor:not-allowed;opacity:.42;transform:none}.stax-dark .small{min-height:36px;padding-inline:12px;font-size:12px}.stax-dark .overline{margin:0 0 16px;color:var(--s-subtle);font-size:11px;font-weight:600;letter-spacing:.12em;text-decoration:none}.stax-dark .status-badge{display:inline-flex;align-items:center;gap:7px;width:max-content;color:var(--s-muted);font-size:12px}.stax-dark .status-badge:before{content:"";width:7px;height:7px;border-radius:999px;background:var(--s-positive);box-shadow:0 0 0 3px rgba(52,211,153,.10)}
.stax-dark .hub-shell,.stax-dark .shop-catalog-v9,.stax-dark .pay-shell-v9,.stax-dark .p-section,.stax-dark .account-head,.stax-dark .auth-shell,.stax-dark .simple,.stax-dark .platform-admin{width:min(var(--s-content),calc(100% - 48px));margin-inline:auto}.stax-dark .hub-shell,.stax-dark .shop-catalog-v9,.stax-dark .pay-shell-v9{padding-block:72px 96px}.stax-dark .hub-top{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(320px,.7fr);gap:24px;align-items:stretch}.stax-dark .hub-copy,.stax-dark .hub-status,.stax-dark .hub-card,.stax-dark .service-tile,.stax-dark .wallet-card-v9,.stax-dark .pay-workspace-v9,.stax-dark .store-product,.stax-dark .form-card,.stax-dark .simple,.stax-dark .account-head>article,.stax-dark .admin-box,.stax-dark .manager-card,.stax-dark .status-card{border:1px solid var(--s-line);border-radius:var(--s-r16);background:var(--s-surface);box-shadow:none}.stax-dark .hub-copy{min-height:480px;display:flex;flex-direction:column;justify-content:space-between;padding:48px}.stax-dark .hub-copy h1,.stax-dark .shop-hero-v9 h1,.stax-dark .pay-shell-v9>header h1,.stax-dark .auth-copy h1,.stax-dark .simple h1,.stax-dark .status-hero h1{margin:0;color:var(--s-text);font-size:clamp(42px,6vw,72px);line-height:1.02;letter-spacing:-.055em}.stax-dark .hub-copy>div>p:last-child,.stax-dark .shop-hero-v9>div>span,.stax-dark .pay-shell-v9>header>span,.stax-dark .auth-copy>p:last-child{max-width:650px;margin:24px 0 0;color:var(--s-muted);font-size:16px;line-height:1.75;word-break:keep-all}.stax-dark .hub-actions{display:flex;gap:8px;margin-top:40px}.stax-dark .hub-status{padding:24px}.stax-dark .hub-status>header{display:flex;justify-content:space-between;align-items:center;padding-bottom:20px;border-bottom:1px solid var(--s-line)}.stax-dark .hub-status-list{display:grid}.stax-dark .hub-status-list a{display:flex;justify-content:space-between;align-items:center;min-height:72px;border-bottom:1px solid var(--s-line);color:var(--s-muted);text-decoration:none}.stax-dark .hub-status-list a:last-child{border-bottom:0}.stax-dark .hub-status-list a:hover{color:var(--s-text)}.stax-dark .hub-status-list b{color:var(--s-text)}.stax-dark .hub-services{margin-top:96px}.stax-dark .section-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:24px}.stax-dark .section-head h2{margin:0;font-size:clamp(28px,4vw,44px);letter-spacing:-.04em}.stax-dark .section-head>span{max-width:360px;color:var(--s-muted);font-size:14px}.stax-dark .hub-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.stax-dark .hub-card{min-height:320px;display:flex;flex-direction:column;justify-content:space-between;padding:24px;color:inherit;text-decoration:none}.stax-dark .hub-card:hover,.stax-dark .service-tile:hover,.stax-dark .store-product:hover{border-color:var(--s-line-strong);background:var(--s-surface-2)}.stax-dark .hub-card>header{display:flex;justify-content:space-between}.stax-dark .hub-card-icon,.stax-dark .tile-icon{display:grid;width:40px;height:40px;place-items:center;border:1px solid var(--s-line);border-radius:var(--s-r8);background:var(--s-surface-2)}.stax-dark .hub-card-icon svg,.stax-dark .tile-icon svg{width:20px;fill:none;stroke:currentColor;stroke-width:1.6}.stax-dark .hub-card h3{margin:0 0 12px;font-size:22px}.stax-dark .hub-card p{margin:0;color:var(--s-muted);font-size:14px;line-height:1.65}.stax-dark .hub-card>b{font-size:13px}