/* The nebula raster has 5 CSS-pixel blur and 30% opacity. All panes sample
   one viewport-sized image; the page canvas itself stays untouched. */
/* Important declarations in this layer override older per-feature materials
   without an escalating set of ID selectors. Tracker selectors never match. */
@layer orbunity-app-glass{
:root{
 --op-glass-light:linear-gradient(145deg,rgb(255 255 255 / .16),transparent 30% 70%,rgb(255 255 255 / .09));
 --op-glass-filter:blur(8px) saturate(1.15) brightness(.8);
 --op-glass-edge:#d7def052;
 --op-glass-shadow:inset 0 1px 0 #eff3ff40,inset 1px 0 0 #eff3ff29,inset 0 -1px 0 #9e90d342,0 3px 9px #0505092b;
}
html[data-app-glass=nebula] .op-nebula-pane{
 background-color:transparent!important;
 background-image:var(--op-glass-light),var(--op-nebula-image,none)!important;
 background-size:100% 100%,var(--op-nebula-size,100vw 100vh)!important;
 background-position:0 0,var(--op-nebula-x,0px) calc(var(--op-nebula-y,0px) + var(--op-nebula-follow-y,0px))!important;
 background-repeat:no-repeat!important;background-origin:border-box!important;
 background-attachment:scroll!important;
 border-color:var(--op-glass-edge)!important;
 box-shadow:var(--op-glass-shadow)!important;
 backdrop-filter:var(--op-glass-filter)!important;-webkit-backdrop-filter:var(--op-glass-filter)!important;
}
html[data-app-glass=nebula] .op-grey-glass{
 background-color:rgb(128 128 128 / .15)!important;
 background-image:var(--op-glass-light)!important;
 border-color:var(--op-glass-edge)!important;
 box-shadow:var(--op-glass-shadow)!important;
 backdrop-filter:blur(3px) saturate(1.1)!important;-webkit-backdrop-filter:blur(3px) saturate(1.1)!important;
}
html[data-app-glass=nebula] input.op-grey-glass::file-selector-button{background-color:rgb(128 128 128 / .15)!important;background-image:var(--op-glass-light)!important;border-color:var(--op-glass-edge)!important;color:inherit}
/* Selection, danger and focus remain legible on the same neutral glass. */
html[data-app-glass=nebula] :is(.op-nebula-pane,.op-grey-glass):is([aria-pressed=true],[aria-selected=true],.ct-card-selected,.is-complete){
 border-color:#e5c84a99!important;color:#e5c84a!important;outline-color:#e5c84a;
}
html[data-app-glass=nebula] :is(.ct-delete-action,.ct-deck-delete-button,.ct-owned-delete-corner,.ct-owned-delete-detail,.ct-hold-delete,#ct-edit-card-delete,#ct-want-delete,#ct-owned-delete).op-grey-glass{
 color:#ffabab!important;border-color:#ed6478!important;
}
html[data-app-glass=nebula] :is(.op-nebula-pane,.op-grey-glass):is(.is-error,.ct-deck-card-invalid,[aria-invalid=true],[data-state=error],[data-state=invalid]){border-color:#f2a193!important}
html[data-app-glass=nebula] .ct-history-delete-ready.op-nebula-pane{background-color:#942438!important;box-shadow:inset 0 0 0 2px #ed6478!important}
html[data-app-glass=nebula] .op-grey-glass:is([data-state=conflict],[data-state=offline],[data-state=remote],[data-state=reload]){border-color:#e5c84a!important;color:#fff2c1!important}
/* Primary actions now have translucent glass instead of the former pale fill. */
html[data-app-glass=nebula] .ct-primary:is(.op-nebula-pane,.op-grey-glass){color:#f1f2fa!important;text-shadow:0 1px 3px #050509b3;}
@media(hover:hover){html[data-app-glass=nebula] button:is(.op-nebula-pane,.op-grey-glass):not(:disabled):hover{border-color:#e5c84a80!important}}
/* The floating rail keeps its existing cutouts. Never paint its rectangle. */
html[data-app-glass=nebula] #commander-table .ct-app-nav{background-color:transparent!important;background-image:none!important;box-shadow:none!important}
html[data-app-glass=nebula] #commander-table .ct-app-nav #ct-nav-play::before{
 background-color:transparent!important;
 background-image:var(--op-glass-light),var(--op-nebula-image,none)!important;
 background-size:100% 100%,var(--op-nebula-size,100vw 100vh)!important;
 background-position:0 0,var(--op-nebula-position,0 0)!important;
 background-repeat:no-repeat!important;
 backdrop-filter:var(--op-glass-filter);-webkit-backdrop-filter:var(--op-glass-filter);
}
html[data-app-glass=nebula] #commander-table .ct-app-nav #ct-nav-play::after{background:rgb(128 128 128 / .15)!important}
/* Preserve clear, purpose-built controls and warning/invalid-state contrast. */
html[data-app-glass=nebula] .op-nebula-pane :is([role=alert]:not(:empty),.ct-deck-card-invalid,.is-error){text-shadow:0 1px 3px #000}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
 html[data-app-glass=nebula] :is(.op-nebula-pane,.op-grey-glass),html[data-app-glass=nebula] input.op-grey-glass::file-selector-button,html[data-app-glass=nebula] #commander-table .ct-app-nav #ct-nav-play::before{background:#202331!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
}
@media(prefers-reduced-transparency:reduce){
 html[data-app-glass=nebula] :is(.op-nebula-pane,.op-grey-glass),html[data-app-glass=nebula] input.op-grey-glass::file-selector-button,html[data-app-glass=nebula] #commander-table .ct-app-nav #ct-nav-play::before{background:#202331!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
}
@media(forced-colors:active){
 html[data-app-glass=nebula] :is(.op-nebula-pane,.op-grey-glass),html[data-app-glass=nebula] input.op-grey-glass::file-selector-button,html[data-app-glass=nebula] #commander-table .ct-app-nav #ct-nav-play::before{background:Canvas!important;color:CanvasText!important;border-color:ButtonText!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
 html[data-app-glass=nebula] .ct-primary:is(.op-nebula-pane,.op-grey-glass){color:ButtonText!important;text-shadow:none;}
}
}
