/* Theme-native relay curves; no character art or raster requests. */
.has-panel-art{position:relative;isolation:isolate;overflow:hidden}
.brand-graphic{display:block;width:100%;height:100%;color:var(--baton-action);pointer-events:none}
.has-panel-art>.app-panel-art{position:absolute;inset:0 0 0 auto;width:38%;height:100%;pointer-events:none;z-index:-1;opacity:.16;mask-image:linear-gradient(90deg,transparent,black 40%,black 85%,transparent)}
.console-cover>.brand-graphic{position:absolute;inset:0;width:100%;height:100%;opacity:.24;transition:opacity 180ms ease}
.console-cover>svg:not(.brand-graphic){position:absolute;left:12px;top:12px;width:24px;height:24px;opacity:.7}
.console-tile:is(:hover,[data-selected="true"]) .brand-graphic{opacity:.36}
.console-preview{grid-template-columns:minmax(0,1fr) minmax(270px,42%);gap:20px}
.console-preview-art{height:240px;min-height:0;overflow:hidden;background:radial-gradient(ellipse at 70% 50%,color-mix(in srgb,var(--baton-action) 8%,transparent),transparent 70%)}
.console-preview-art>.brand-graphic{position:absolute;inset:0;width:100%;height:100%;opacity:.2}
@media(max-width:700px){.has-panel-art>.app-panel-art{width:32%;opacity:.1}}
@media(prefers-reduced-motion:reduce){.console-cover>.brand-graphic{transition:none}}

.console-cover>.brand-graphic path{opacity:.35}.console-preview-art>.brand-graphic path{opacity:.45}
/* Sparse original branded orbit artwork, once per viewport, never a sticker layer. */
.console-body{isolation:isolate}
.console-body:before,body.mobile-app main:before{content:"";position:absolute;inset:0;background:url('/art/ambient-orbit-v1.webp?v=3907cd52b495') center 24px/min(100%,1400px) auto no-repeat;opacity:.065;z-index:-1;pointer-events:none;user-select:none}
body.mobile-app main{position:relative;isolation:isolate}
body.mobile-app main:before{background-size:100% auto;opacity:.045}
html[data-theme="dark"] .console-body:before,html[data-theme="dark"] body.mobile-app main:before{opacity:.085}

/* A shared, original line-art wallpaper sits above existing art, below content.
   The parent alpha mask clips the moving color ribbon to doodle strokes only. */
.baton-tab-pattern{display:none;position:absolute;inset:0;z-index:-1;pointer-events:none;user-select:none;overflow:hidden;background-color:var(--baton-text);opacity:var(--pattern-pump-opacity,.12);mask-image:var(--pattern-mask);mask-mode:alpha;mask-repeat:repeat;mask-size:var(--pattern-size,600px) var(--pattern-size,600px);-webkit-mask-image:var(--pattern-mask);-webkit-mask-repeat:repeat;-webkit-mask-size:var(--pattern-size,600px) var(--pattern-size,600px)}
html[data-theme="dark"] .baton-tab-pattern{opacity:var(--pattern-dark-opacity,.16)}
body.console-mode .console-body>.baton-tab-pattern{display:block}
.console-body:before,body.mobile-app main:before{z-index:-2}
body.mobile-app main>.baton-tab-pattern{display:block;position:fixed;inset:100px 0 calc(var(--mobile-bar-height,64px) + env(safe-area-inset-bottom))}
.baton-pattern-shine{position:absolute;inset:0 -80%;background:linear-gradient(112deg,transparent 20%,#ef93b1 33%,#f4cf81 36%,#b0dda1 39%,#8cdadf 42%,#b6a3ee 45%,#eaa5d8 48%,transparent 61%);opacity:.9;animation:baton-pattern-sheen var(--pattern-sheen-duration,120s) linear infinite alternate;animation-delay:var(--pattern-sheen-delay,-37s);will-change:transform}
@keyframes baton-pattern-sheen{from{transform:translate3d(-28%,0,0)}to{transform:translate3d(28%,0,0)}}
.baton-pattern-paused .baton-pattern-shine{animation-play-state:paused}
html[data-theme] .console-home :is(h1,h2){color:var(--baton-text)}
@media(prefers-reduced-motion:reduce){.baton-pattern-shine{animation:none;will-change:auto;transform:none}}