/* Continuous gradient surfaces: one canvas, no repeating card backgrounds. */
:root{
 --surface-text:#26313c;--surface-muted:#57616c;
 --ac-ink:var(--surface-text);--sx-text:var(--surface-text);--ink:var(--surface-text);--ac-muted:var(--surface-muted);--sx-muted:var(--surface-muted);--muted:var(--surface-muted);
 --surface-base:#f5f5f3;
 --surface-canvas:radial-gradient(ellipse 1050px 650px at 98% 0%,#ead4b343 0%,#ead4b300 72%),radial-gradient(ellipse 1000px 850px at 0% 36%,#c7dce63d 0%,#c7dce600 76%),linear-gradient(135deg,#fcfbf8 0%,#f5f6f6 47%,#edf1f5 100%);
 --surface-header:linear-gradient(110deg,#ffffffed 0%,#f4f7f9e8 52%,#faf1e4e0 100%);
 --surface-feature:radial-gradient(ellipse at 94% 8%,#edc68b4d 0%,#edc68b00 58%),linear-gradient(120deg,#f9f4e9 0%,#eef4f7 56%,#e2eaf0 100%);
 --surface-footer:linear-gradient(180deg,#eef2f400 0%,#e5ebf066 100%);
 --surface-control:linear-gradient(165deg,#ffffff 0%,#f7f8fa 100%);
 --surface-row:linear-gradient(90deg,#e8d5b52e 0%,#d4e3ed2e 55%,#d4e3ed00 100%);
 --surface-rail:radial-gradient(ellipse 420px 420px at 0% 0%,#b5844a24 0%,#b5844a00 80%),linear-gradient(165deg,#233241 0%,#18232f 48%,#101923 100%);
}
html[data-sx-theme=dark]{
 --surface-text:#edf0f4;--surface-muted:#b0bac6;
 --ac-ink:var(--surface-text);--sx-text:var(--surface-text);--ink:var(--surface-text);--ac-muted:var(--surface-muted);--sx-muted:var(--surface-muted);--muted:var(--surface-muted);
 --surface-base:#151d27;
 --surface-canvas:radial-gradient(ellipse 1100px 650px at 98% 0%,#b57b3824 0%,#b57b3800 73%),radial-gradient(ellipse 1100px 850px at 0% 36%,#31557d42 0%,#31557d00 76%),linear-gradient(135deg,#111821 0%,#1a2430 51%,#121b25 100%);
 --surface-header:linear-gradient(110deg,#192331f2 0%,#202c39ee 56%,#312c26e6 100%);
 --surface-feature:radial-gradient(ellipse at 94% 8%,#c08a4333 0%,#c08a4300 60%),linear-gradient(120deg,#242b34 0%,#233344 55%,#192432 100%);
 --surface-footer:linear-gradient(180deg,#0f172000 0%,#0c14208c 100%);
 --surface-control:linear-gradient(165deg,#253140 0%,#1c2633 100%);
 --surface-row:linear-gradient(90deg,#d7ad6b15 0%,#557da52b 55%,#557da500 100%);
}
html{background-color:var(--surface-base)!important}
body{background-color:var(--surface-base)!important;background-image:var(--surface-canvas)!important;background-repeat:no-repeat!important;background-attachment:fixed!important;min-height:100vh}
/* Let the canvas remain visible through the document's structural containers. */
#container,#page,#content,#inner,.shell,.workspace{background:transparent!important}
/* MyBB Admin CP and public masthead: a single softly lit horizontal surface. */
#logo,#menu,#header,.topbar{background:var(--surface-header)!important}
#header .sx-masthead,#panel .upper,#panel .lower{background:transparent!important}
#left_menu{background:linear-gradient(90deg,#ffffff16 0%,#ffffff00 100%)!important}
#left_menu .left_menu_box,#left_menu .left_menu_box .title{background:transparent!important}
.sx-hero,.welcome-hero{background:var(--surface-feature)!important;border-radius:0;box-shadow:none}
.rail,.auth-story,.profile-cover{background:var(--surface-rail)!important}
.rail-note{background:linear-gradient(135deg,#ffffff08,#ffffff00)!important}
/* The sign-in split has a feathered wash, with no outline or floating frame. */
.atelier-admin-login #container,.atelier-admin-login #content{background:transparent!important}
.atelier-admin-login #header{background:var(--surface-feature)!important}
.atelier-admin-login #logo{background:transparent!important}
.sx-auth-intro{background:var(--surface-feature)!important}
/* Highlight controls without changing their compact geometry or text contrast. */
input[type=text],input[type=email],input[type=password],input[type=search],input[type=number],input.text_input,input.textbox,textarea,select{background-image:var(--surface-control)!important}
.global-search input,#panel .sx-quicksearch input{background:transparent!important}
/* Hover light crosses the whole row, rather than restarting in each cell. */
#content table.general tr:hover>td,#content .border_wrapper tbody tr:hover>td,.sx-forum-row:hover>td,.sx-member-row:hover>td,.sx-thread-table tr.inline_row:hover>td{background:transparent!important}
#content table.general tbody>tr:hover,.sx-forum-row:hover,.sx-member-row:hover,.sx-thread-table tr.inline_row:hover,.thread-row:hover{background:var(--surface-row)!important}
#footer{background:var(--surface-footer)!important}
.sx-footer-grid,.sx-footer-bottom,.page-footer{background:transparent!important}
.thread-excerpt,.thread-byline,.thread-byline>a:first-child,.thread-metrics,.thread-metrics>span,.section-intro p,.side-description,.thread-byline time,.discussion-meta,.sidebar-footnote,.page-footer,.field-help,.member-card p,.member-card small,.profile-main p,.profile-meta,.auth-card>p,.auth-switch,.composer-bottom small,.notification-item p,.notification-item small,.audit-row,.community-note p,.community-note ol,.community-numbers span,.admin-stat>span,.admin-stat small,.admin-member-name small{color:var(--surface-muted)}
/* Fixed canvas gradients are static: no background-position animation or blur. */
@media(max-width:700px){body{background-attachment:scroll!important}}
@media(forced-colors:active){body,#logo,#menu,#header,.topbar,.rail,.sx-hero,.welcome-hero,.auth-story,.profile-cover,.atelier-admin-login #header,.sx-auth-intro,input,textarea,select{background-image:none!important}}
