/* Shared Lumexus surface system. Existing content, assets and accent colors remain. */
:root{--lx-edge:rgba(135,202,255,.27);--lx-radius:24px;color-scheme:dark}
html{background:#000;scroll-behavior:smooth;scroll-padding-top:110px}
body{background-color:#000!important;overflow-x:clip}
[hidden]{display:none!important}
:where(button,.button,.cta,.primary,.secondary,.navCta,.launch,summary,input,select,textarea){border-radius:16px!important}
:where(article,.card,.brainCard,.module,.decisionPanel,.terminal,.lead,.panel,.metric,.notice,.preview,.mockBrowser,.product,.productArt,.productBadge,.preview-tags span,.lesson,.camera-card,.playback-card,.mission,.world-picker,.sticker-book,.hint-panel,.reading-progress-summary,.toast,dialog,form,.table-scroll,details,.filters,.modes,.feedback,.support,.progress,.lesson-list,.nav,.topbar,.sidebar,.topbar-actions,.demo-strip,.fixed-footer,.message-row,.mail-card,.compose-panel){border-radius:var(--lx-radius)!important}
:where(img,video,iframe,canvas){border-radius:20px}
:where(img,video){max-width:100%}
:where(button,.button,.cta,.primary,.secondary,.navCta,.launch,summary){min-height:44px;touch-action:manipulation;transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;}
:where(button,.button,.cta,.primary,.secondary,.navCta,.launch):not(:disabled){background:linear-gradient(125deg,rgba(99,168,255,.23),rgba(25,46,78,.6) 55%,rgba(132,109,255,.18)),#07121f!important;color:#edf8ff!important;border:1px solid rgba(149,209,255,.38)!important;box-shadow:inset 0 1px 0 #ffffff24,inset 0 -1px 0 #0009,0 6px 18px #0005;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
:where(button,.button,.cta,.primary,.secondary,.navCta,.launch):disabled{opacity:.55;cursor:not-allowed}
:where(button,.button,.cta,.primary,.secondary,.navCta,.launch):active{transform:translateY(1px) scale(.985)!important}
:where(button,a,input,select,textarea,summary):focus-visible{outline:3px solid #8bdfff!important;outline-offset:4px}
:where(button[aria-pressed=true],button.active,.primary,.cta){border-color:#88ddff!important;box-shadow:inset 0 1px 0 #fff4,0 0 20px #388cff26!important}
:where(input,select,textarea){max-width:100%;accent-color:#6ed8ff}
dialog{max-height:calc(100dvh - 40px);overflow:auto;box-shadow:0 40px 100px #000b,inset 0 1px 0 #fff2}
dialog::backdrop{background:#000b;backdrop-filter:blur(12px)}
:where(.brainCard,.module,.decisionPanel,.terminal,.card,.product,.work-card,.panel,.metric){border:1px solid var(--lx-edge);box-shadow:inset 0 1px 0 #ffffff0d,0 18px 48px #0005}
.lx-tilt{transform:perspective(1200px) rotateX(var(--lx-rx,0deg)) rotateY(var(--lx-ry,0deg));transition:transform .28s ease,box-shadow .28s ease;position:relative}
.lx-tilt:after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;background:radial-gradient(circle at var(--lx-x,50%) var(--lx-y,0%),#a8dfff16,transparent 48%);opacity:0;transition:opacity .25s}
.lx-masthead{display:block;width:min(880px,calc(100% - 32px));margin:12px auto 20px;position:relative;text-align:center;border:1px solid var(--lx-edge);border-radius:32px;background:radial-gradient(ellipse at 50% 100%,#102b5e99,transparent 70%),#000;box-shadow:inset 0 1px 0 #fff2,0 24px 70px #0009;overflow:hidden}
.lx-masthead img{display:block;width:100%;height:clamp(240px,32vw,410px);object-fit:contain;border-radius:30px;filter:drop-shadow(0 12px 26px #245fe033)}
.lx-masthead span{display:block;position:absolute;bottom:14px;left:0;right:0;font:600 10px/1.5 system-ui;letter-spacing:.22em;color:#9ab9d9;text-transform:uppercase}
.lx-motion-toggle{position:fixed;bottom:16px;left:16px;z-index:70;font:600 11px/1.3 system-ui;letter-spacing:.04em;padding:10px 13px;min-height:42px;border-radius:30px!important;color:#cbeaff}
.lx-reveal{animation:lx-arrive .65s ease both}
@keyframes lx-arrive{from{opacity:.3;translate:0 14px}to{opacity:1;translate:0 0}}
@media(hover:hover) and (pointer:fine){:where(button,.button,.cta,.primary,.secondary,.navCta,.launch):not(:disabled):hover{transform:translateY(-3px);border-color:#b5e9ff!important;box-shadow:inset 0 1px 0 #fff5,0 10px 28px #3687ff33}.lx-tilt:hover:after{opacity:1}}
@media(max-width:700px){:root{--lx-radius:20px}.lx-masthead{margin:10px auto 14px;border-radius:24px}.lx-masthead img{height:280px}.lx-motion-toggle{bottom:10px;left:10px;font-size:10px;padding:8px 11px}:where(button,.button,.cta,.primary,.secondary){backdrop-filter:blur(8px)}.lx-tilt{transform:none!important}footer{padding-bottom:80px!important}}
/* Motion preferences also cover pre-existing animations on every page. */
html.lx-motion-off{scroll-behavior:auto!important}
html.lx-motion-off *,html.lx-motion-off *:before,html.lx-motion-off *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
html.lx-motion-off .lx-tilt{transform:none!important}
html.lx-motion-off .reveal{opacity:1!important;transform:none!important}
/* Keep the existing learning and Sentinel accent identities. */
[data-lx-page=learning] :is(button[aria-pressed=true],.primary){border-color:#77ead9!important;background:linear-gradient(130deg,#205d57dd,#0b282f)!important;color:#e5fff6!important}
[data-lx-page=learning] button[aria-pressed=true]>span{color:#a9ffe7!important}
[data-lx-page=learning] .note{background:#0a1b2a!important;color:#b9cedf!important;border:1px solid #49728f55;border-radius:16px;padding:16px}
[data-lx-page=reading] :is(.welcome-line,.page-heading,.section-head,.shelf-note,footer){color:#e1f5ef}
[data-lx-page=reading] :is(.welcome-line p,.page-heading p){color:#acc4bc}
[data-lx-page=reading] .tiny-pill{color:#155b51}
[data-lx-page=reading] .quick-card :is(h3,.eyebrow,.arrow){color:#e8fff6!important}
[data-lx-page=reading] .quick-card p{color:#b9d9cb!important}
[data-lx-page=reading] :is(button.active,.primary){background:linear-gradient(130deg,#185f54,#0b2e28)!important;border-color:#79d0af!important;color:#e8fff6!important}
[data-lx-page=reading] .lx-motion-toggle{bottom:90px}
body:has(.brandmark) :is(button,.glass):not(:disabled){background:linear-gradient(130deg,#775032d9,#241b17)!important;border-color:#9b724d!important;color:#ffe7cb!important}
:where(.hero,.heroBackdrop,.preview-scene,.image-link,.logo-stage,.message-column,.message-detail,.compose,.folder,.reader,.message-item,.steps,.camera-card video){border-radius:24px!important}
body:has(#store-film) nav{gap:16px;flex-wrap:wrap;border-radius:24px;margin:10px 16px;width:calc(100% - 32px);padding:18px 22px;font-size:13px;border:1px solid #86caff2b}
body:has(#store-film) .heroMark{position:relative;inset:auto;width:210px;height:210px;object-fit:contain;opacity:1;margin-bottom:15px;display:none}
body:has(#store-film) .hero{min-height:0;padding:55px 28px;background:#07101a;overflow:hidden;margin-top:24px}
body:has(#store-film) .heroBackdrop{opacity:.35}
body:has(#store-film) .heroBackdrop video{object-fit:contain;background:#000}
body:has(#store-film) .hero:before{background:linear-gradient(100deg,#000d,#0007);inset:0}
body:has(#store-film) .hero:after{border-radius:40px;right:5%;top:20%;width:180px;height:180px}
body:has(.work-grid) .logo-stage{display:none}
@media(max-width:700px){body:has(#store-film) nav{padding:15px;gap:14px;font-size:11px}body:has(#store-film) .hero{padding:34px 20px}body:has(#store-film) .hero h1{font-size:clamp(36px,10vw,60px)}body:has(#store-film) .cinemaControls{gap:9px}body:has(#store-film) .cinemaControls button{font-size:11px}body:has(#store-film) .productInfo{padding:20px 16px;gap:10px}body:has(#store-film) .productInfo h3{font-size:22px}body:has(#store-film) .productInfo b{font-size:18px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.lx-tilt{transform:none!important}.reveal{opacity:1!important;transform:none!important}}
