/* Lucian UX/UI Prompt #037 · MIT License (c) 2026 Seokwoooo · https://lucianlabs.dev/uxui-prompt/#037 */
/* Owner-approved User Web Premium V4. Native Figma structure, assets and 74-token source retained. */
:root[data-store-v4]{color-scheme:dark;--page:#071426;--text:#edf3ff;--secondary:#b5c7de;--muted:#a6b9d1;--border:#2a4260;--field-border:#42607e;--button-surface:#183453;--button-text:#edf3ff;--interaction-hover:#1b3b60;--interaction-active:#22466f;--success:#62d5a0;--danger:#ff8f99;--warning:#ffd28b;--success-surface:#102f2b;--toggle-surface:#102744;--toggle-border:#45617c;--shadow-panel:0 16px 44px rgba(0,8,23,.24);--shadow-focus:0 0 0 3px rgba(129,178,255,.28);--ux-ink-3:var(--muted);--ux-surface-2:#173452;--ux-line-2:#53799e;--ux-danger:var(--danger);--ux-shadow-strong:rgba(0,0,0,.55)}
html[data-store-v4],html[data-store-v4] body,html[data-store-v4] #app{background:#071426}
.premium-shell{position:relative;isolation:isolate;background:transparent}.premium-shell>header,.premium-shell>main,.premium-shell>footer{position:relative}.premium-route{background:transparent}.premium-stage{z-index:1;min-height:calc(100svh - 250px)}
.v4-backdrop{position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 25% 15%,#133563 0,transparent 60%),#071426;overflow:hidden}
.v4-backdrop picture{display:block;position:absolute;inset:0}.v4-backdrop img{width:100%;height:100%;object-fit:cover;object-position:72% top}.v4-backdrop::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,15,31,.72),rgba(7,20,38,.34) 60%,rgba(5,16,30,.18)),linear-gradient(0deg,#071426 0,rgba(7,20,38,.22) 75%);pointer-events:none}
.premium-header{background:rgba(7,24,50,.98);border-bottom:1px solid #29496e;box-shadow:0 6px 24px rgba(0,0,0,.16);z-index:25}.premium-header [data-name="Store navigation / five destinations"]{width:auto;gap:28px;align-items:center}.premium-header [data-name="Header row / logo + download + navigation"]{min-height:44px}.premium-header a{color:#edf3ff}.premium-header a[aria-current=page]{color:#fff}.premium-header .premium-nav-indicator{background:#70a8ff}
.v4-download-button{display:flex;align-items:center;justify-content:center;gap:8px;flex-shrink:0;background:#2a69dc;box-shadow:0 4px 14px rgba(0,27,80,.32)}.v4-download-icon{display:grid;place-items:center;width:18px;height:18px;flex:none}.v4-download-icon svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;color:#fff}.v4-download-button p{color:#fff}
.premium-content{padding-top:36px;padding-bottom:48px;gap:28px}.premium-footer{background:#091b31;border-top:1px solid #2a4260}.premium-footer>div{background:transparent}.premium-footer a{color:#a5c7ff}.premium-footer a:hover{color:#fff}.premium-content a:not([data-button-style]):hover{text-decoration:underline;text-underline-offset:4px}
.premium-content :is([data-name^="Auth /"],[data-name="Account information"],[data-name="Order history"],[data-name="Current plan / Demo"],[data-sku]){box-shadow:0 20px 54px rgba(0,7,20,.3);border-color:#3c5775}
.premium-content [data-name="Field"]{background:#0a1e36;border-color:#56708c}.premium-content input{color:#edf3ff}.premium-content input::placeholder{color:#a6b9d1}.premium-content [data-name="Field"]:focus-within{border-color:#92baff;box-shadow:var(--shadow-focus)}
.premium-content [data-name^="Main hero /"]{background:linear-gradient(110deg,rgba(7,22,43,.88),rgba(10,31,57,.57));border-color:#3b5e84;box-shadow:0 20px 60px rgba(0,0,0,.18)}
.premium-content [data-component="AoeStore03AdPlacement"]{background:linear-gradient(155deg,rgba(12,35,64,.80),rgba(7,20,38,.4));border-color:#42658b;box-shadow:inset 0 1px rgba(173,204,242,.06)}
.premium-content [data-name="Hero product introduction"]>p:first-child{letter-spacing:.1em;font-size:11px;color:#a4c8ff}.premium-content [data-name="Hero product introduction"]>p:nth-child(2){font-size:clamp(38px,3.5vw,64px);line-height:1.08;letter-spacing:-.045em;color:#fff}
.premium-content [data-name="Hero product introduction"]{gap:22px}.premium-content [data-name="Product feature strip"]{background:rgba(11,30,53,.96);border-color:#385776}
.premium-content [data-name^="Feature /"]{border:1px solid transparent}.premium-content [data-name^="Feature /"]:hover{background:rgba(24,56,91,.55);border-color:#4c7299;box-shadow:none}
.premium-content [data-component="AoeStore03ProductDemoCarousel"]{background:rgba(11,29,51,.97);border-color:#507295}.premium-content [data-name="Demo toolbar"]>p:first-child{color:#9bc3ff}
.premium-content [data-name="Editable Overlay HUD illustration"]{box-shadow:0 12px 30px rgba(0,0,0,.22)}
.premium-content [data-name="Pricing help"]{border-color:#466887}.premium-content [data-sku][data-selected=true]{background:linear-gradient(155deg,#14345b,#10243f)}.premium-content [data-sku] [data-button-style=Primary]{min-height:44px}
.premium-content [data-button-style=Primary]{background:#2a69dc;color:#fff;border-color:#5488e2;transition:background .2s,box-shadow .2s,transform .2s}.premium-content [data-button-style=Primary] p{color:#fff}.premium-content [data-button-style=Primary]:hover{background:var(--primary-hover,#306dcc);box-shadow:0 7px 20px rgba(0,22,66,.3)}.premium-content [data-button-style=Primary]:active{transform:translateY(1px)}
.premium-content [data-button-style=Secondary]{background:#193957;border-color:#567899}.premium-content [data-button-style=Secondary] p{color:#edf3ff}.premium-content [data-button-style=Secondary]:hover{background:#234b70}
.premium-content :is(button,a):focus-visible{outline:3px solid #a2c8ff;outline-offset:4px}.premium-content .feedback-live.error{background:#351c30}.premium-content .otp-help,.premium-content .u026-s{color:#bdcce0}.premium-content .u026-msg{color:#a6b9d1}.premium-content .u026-real{color:transparent}.premium-content .u026{--ux-surface:#142e4d;--ux-line:#52708f;--ux-ink:#edf3ff;--ux-ink-2:#bbcee4;--ux-accent:#8ab9ff;--ux-success:#62d5a0;--ux-danger:#ff8f99}
/* Lucian UX/UI Prompt #037 · MIT License (c) 2026 Seokwoooo · https://lucianlabs.dev/uxui-prompt/#037 */
/* Same menu radius22, row52, stagger32ms, .45/.5 spring; topbar opens downward and uses existing38px trigger slot. */
.v4-account{position:relative;width:120px;flex:none;--ux-surface:#0f2947;--ux-ink:#edf3ff;--ux-ink-2:#bfd0e5;--ux-line:#3a5c80;--ux-accent:#91baff}
.v4-account .u037-chip{position:relative;display:flex;align-items:center;justify-content:center;gap:8px;width:120px;height:38px;padding:0 14px;border:1px solid #56799d;border-radius:6px;background:#153453;color:#edf3ff;transition:transform .4s var(--ux-spring),box-shadow .3s;cursor:pointer}.v4-account .u037-chip::after{content:'';width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .45s var(--ux-spring)}.v4-account.is-open .u037-chip::after{transform:rotate(225deg)}
.v4-account .u037-menu{position:absolute;right:0;top:calc(100% + 12px);width:320px;max-width:calc(100vw - 32px);padding:8px;border-radius:22px;background:var(--ux-surface);box-shadow:0 0 0 1px var(--ux-line),0 34px 64px -30px var(--ux-shadow-strong);transform-origin:90% 0;opacity:0;transform:translateY(-6px);visibility:hidden;transition:opacity .2s var(--ux-ease),transform .24s var(--ux-ease),visibility 0s .24s;z-index:50}
.v4-account.is-open .u037-menu{opacity:1;transform:translateY(0);visibility:visible;transition:opacity .2s var(--ux-ease),transform .24s var(--ux-ease)}.u037-sec{margin:6px 10px;font-size:11.5px;font-weight:750;letter-spacing:.06em;color:var(--ux-ink-3);overflow-wrap:anywhere}.u037-list{position:relative;margin:0;padding:0}.u037-hl{position:absolute;left:0;right:0;top:0;height:var(--h,52px);border-radius:14px;background:var(--ux-surface-2);transform:translateY(var(--y,0));opacity:0;transition:transform .2s var(--ux-ease),height .2s var(--ux-ease),opacity .2s;pointer-events:none}.u037-list.is-hl .u037-hl{opacity:1}
.v4-account .u037-it{position:relative;display:flex;align-items:center;justify-content:flex-start;gap:12px;width:100%;height:52px;padding:0 10px;border:0;border-radius:14px;background:none;color:var(--ux-ink);font-size:14.5px;font-weight:630;text-align:left;opacity:0;transform:none;transition:opacity .2s var(--ux-ease)}.v4-account.is-open .u037-it{opacity:1;transform:none;transition-delay:0s}.v4-account .u037-it:focus-visible{outline:2px solid var(--ux-accent);outline-offset:-2px}.v4-account .u037-it.out{color:#ff9ba6}.v4-account .u037-chip:active{transform:scale(.98)}
@media(min-width:1440px){.premium-content [data-name="Three-column hero / LEFT AD — DEMO — RIGHT AD"]>*{min-height:650px}.premium-content [data-name="Hero body"]{grid-template-columns:minmax(250px,.85fr) minmax(0,1.5fr)}}
@media(max-width:767px){.premium-content{padding-top:24px;gap:20px}.v4-backdrop img{object-position:70% top}.v4-backdrop::after{background:linear-gradient(0deg,#071426 0,rgba(7,20,38,.65) 70%,rgba(7,20,38,.3))}.premium-header [data-name="Brand and download"]{gap:8px}.v4-account{margin-left:auto}.v4-account .u037-menu{right:0}.premium-content [data-name="Hero product introduction"]>p:nth-child(2){font-size:42px}.premium-content [data-name^="Auth /"]{box-shadow:0 16px 40px rgba(0,0,0,.32)}}
@media(prefers-reduced-motion:reduce){.v4-backdrop *, .u037 *, .u037 *::after{animation:none!important;transition:none!important}.premium-content [data-button-style=Primary]:active{transform:none}}

:where(html[data-store-v4]) :is(.fg46){background:rgba(13,31,54,.94)}

:where(html[data-store-v4]) :is(.fg136){color:#f0f5ff}

:where(html[data-store-v4]) :is(.fg21){color:#92baff}

:where(html[data-store-v4]) :is(.fg11){background:#183453}

:where(html[data-store-v4]) :is(.fg108){background:transparent}

:where(html[data-store-v4]) :is(.fg13){background:#102f2b}

.premium-content [role="checkbox"]{background:#102744!important;color:#d6e4f7;border-color:#506b88}.premium-content [role="checkbox"] p{color:#d6e4f7}
.v4-backdrop:has(picture:is([data-warrior="login"],[data-warrior="register"],[data-warrior="otp"],[data-warrior="forgot"],[data-warrior="reset"])) img{filter:blur(1px)}

.premium-content .v4-dot-target{width:24px;height:24px;display:grid;place-items:center}.v4-dot-art{display:block;position:relative;width:8px;height:8px}.premium-content .otp-panel a{color:#99c1ff}

/* Lucian UX/UI Prompt #083 · MIT License (c) 2026 Seokwoooo · https://lucianlabs.dev/uxui-prompt/#083 */
/* Identical1.6s curves/ranges as left/right animation, expressed as GPU transforms. */
.premium-u083 .segment{left:0;right:auto;width:100%;transform-origin:0 50%;will-change:transform}
.premium-u083 .s0{animation:v4-queue-a 1.6s cubic-bezier(.65,.05,.35,1) infinite}
.premium-u083 .s1{animation:v4-queue-b 1.6s cubic-bezier(.25,.6,.4,1) .55s infinite}
@keyframes v4-queue-a{0%{transform:translateX(-35%) scaleX(.35)}60%,100%{transform:translateX(100%) scaleX(.9)}}
@keyframes v4-queue-b{0%{transform:translateX(-200%) scaleX(2)}60%,100%{transform:translateX(107%) scaleX(.01)}}
/* Footer follows a complete viewport of content; differing route heights cannot pull it into view late. */
.premium-stage{min-height:calc(100svh - var(--store-header-height,68px))}
/* One persistent customer notice; no internal environment details in route content. */
.customer-staging-note{margin:0;padding:5px 16px;text-align:center;font:400 12px/18px Inter,system-ui,sans-serif;color:#c7d7ee;background:#102547;border-top:1px solid #294260;}
.customer-registration-info{min-height:24px;display:inline-flex;align-items:center;}
.premium-plan-grid>[data-sku]>a:last-child{margin-top:auto;}
