/* Portable full-viewport Amber scenery. Load once; styling is scoped to .inclusion-host. */
.inclusion-host { position: relative; isolation: isolate; min-height: 100vh; min-height: 100svh; background: #100b06; color: #fff7e7; color-scheme: dark; }
.inclusion-host .inclusion-scene { position: fixed; inset: 0; z-index: -1; pointer-events: none; background: linear-gradient(#0b07036b,#0b07036b), url('./assets/amber-cabinet.webp') center / cover; }
.inclusion-host .inclusion-scene canvas { position: absolute; inset: 0; width: 100%; height: 100%; contain: strict; }
.inclusion-host .inclusion-scene[hidden], .inclusion-host .inclusion-scene canvas[hidden] { display: none !important; }
.inclusion-host [data-amber-surface] { color: #fff7e7; background: #160f09ee; border: 1px solid #b88e5570; border-radius: 1rem; padding: 1.4rem; }
.inclusion-host [data-amber-surface] :is(button,select,input,textarea) { color: #fff7e7; background: #22170e; border: 1px solid #b88e55; border-radius: .4rem; font: inherit; }
.inclusion-host [data-amber-surface] button { min-height: 44px; padding: .5rem .85rem; cursor: pointer; }
.inclusion-host [data-amber-surface] :is(a,summary) { color: #ffe4ac; }
.inclusion-host :is(dialog,[role=menu],[role=listbox],option,optgroup) { color: #fff7e7; background: #160f09; }
.inclusion-host :focus-visible { outline: 2px solid #fff1c6; outline-offset: 3px; }
@media (max-aspect-ratio: 4/5) { .inclusion-host .inclusion-scene { background: linear-gradient(#0b07036b,#0b07036b), url('./assets/amber-cabinet-mobile.webp') center / contain no-repeat; background-color: #100b06; } }
@media (prefers-reduced-motion: reduce) { .inclusion-host .inclusion-scene canvas { display: none !important; } }

.inclusion-host .big-scene { background: linear-gradient(#030709b5,#030709b5), url('./assets/big.webp?v=2') center / cover no-repeat; background-color:#050707; }
@media (max-aspect-ratio:4/5) { .inclusion-host .big-scene { background-size:contain; } }