/* Keep the ambient canvas independent of body height and scrolling containers. */
html[data-variant="classic-2-illuminated"] {
 --ill-ambient:4%; --ill-button:8%;
 background-color:var(--hx-bg);
 background-image:radial-gradient(ellipse 85% 75% at 50% 15%,color-mix(in srgb,var(--hx-accent) var(--ill-ambient),transparent) 0%,transparent 100%);
 background-attachment:fixed;
 background-size:100% 100vh;
 background-repeat:no-repeat;
}
html[data-variant="classic-2-illuminated"][data-theme="dark"] { --ill-ambient:7%; --ill-button:12%; }
html[data-variant="classic-2-illuminated"] body.hx-site { background:transparent; }
html[data-variant="classic-2-illuminated"] body.hx-site :is(.card,.card-fit-screen,.card-login,.c2-admin-panel):not(.card .card):not(.c2-admin-panel .card) {
 background-color:var(--hx-surface);
 background-image:linear-gradient(135deg,color-mix(in srgb,var(--hx-accent) 2%,transparent),transparent 65%);
 box-shadow:0 8px 24px #00000018,inset 0 1px 0 color-mix(in srgb,var(--hx-accent) 10%,transparent);
}
html[data-variant="classic-2-illuminated"] body.hx-site .main-header { box-shadow:0 2px 12px #00000012; }
html[data-variant="classic-2-illuminated"] body.hx-site :is(.btn-primary,.btn-upload) { box-shadow:0 3px 10px color-mix(in srgb,var(--hx-accent) var(--ill-button),transparent),inset 0 1px 0 #ffffff14; }
html[data-variant="classic-2-illuminated"] body.hx-site .card-header :is(.card-title,.ecu-brand) > i { box-shadow:none; }