/* r38: fitted, opaque room chrome. Fixed-size vector inlays never stretch.
   Original controls/actions remain in their native owners. */
#sanctuary-view[data-room-hub][data-hud-r38]{
 --hud38-base:#29231b;--hud38-face:#382f24;--hud38-well:#211d17;--hud38-line:#a78a61;--hud38-ink:#fff0d7;--hud38-muted:#d9c7a9;--hud38-accent:#e9cd93;--hud38-radius:5px;--hud38-inlay:url('/assets/sanctuary/ui-r38/chapel-inlay.svg');--hub-bar:72px;
}
#sanctuary-view[data-hud-r38][data-scene=youth]{--hud38-base:#203f32;--hud38-face:#2c503c;--hud38-well:#183328;--hud38-line:#91b57d;--hud38-ink:#fff8df;--hud38-muted:#d5e2bf;--hud38-accent:#f1dfa1;--hud38-radius:12px;--hud38-inlay:url('/assets/sanctuary/ui-r38/youth-inlay.svg')}
#sanctuary-view[data-hud-r38][data-scene=solomon]{--hud38-base:#31221d;--hud38-face:#49332a;--hud38-well:#251b17;--hud38-line:#b08b62;--hud38-ink:#f8e9d5;--hud38-muted:#d9c5ab;--hud38-accent:#ead1a3;--hud38-radius:5px;--hud38-inlay:url('/assets/sanctuary/ui-r38/snowy-inlay.svg')}
#sanctuary-view[data-hud-r38][data-scene=auriela]{--hud38-base:#34262c;--hud38-face:#49343d;--hud38-well:#2b2026;--hud38-line:#b78998;--hud38-ink:#fff0f2;--hud38-muted:#e2c5ce;--hud38-accent:#f2c9d7;--hud38-radius:9px 3px;--hud38-inlay:url('/assets/sanctuary/ui-r38/auriela-inlay.svg')}
#sanctuary-view[data-hud-r38][data-scene=cyber]{--hud38-base:#261c2b;--hud38-face:#3c2940;--hud38-well:#201723;--hud38-line:#ac7e9c;--hud38-ink:#ffebf5;--hud38-muted:#dfc2d7;--hud38-accent:#f7c3e1;--hud38-radius:8px;--hud38-inlay:url('/assets/sanctuary/ui-r38/azeroth-inlay.svg')}
#sanctuary-view[data-hud-r38][data-scene=agandar]{--hud38-base:#1b1c21;--hud38-face:#29292e;--hud38-well:#14151a;--hud38-line:#90635e;--hud38-ink:#fae8e3;--hud38-muted:#d5bcb7;--hud38-accent:#e4a097;--hud38-radius:2px;--hud38-inlay:url('/assets/sanctuary/ui-r38/agandar-inlay.svg')}
/* The backing fills the whole viewport rail, not just a clipped source rectangle. */
#sanctuary-view[data-room-hub][data-hud-r38][data-scene] .room-hub-toolbar{
 box-sizing:border-box;display:grid;grid-template-columns:minmax(160px,240px) minmax(0,1fr) auto;align-items:center;gap:12px;inset:0 0 auto;width:100%;height:var(--hub-bar);padding:9px max(16px,env(safe-area-inset-right)) 9px max(16px,env(safe-area-inset-left));
 background-color:var(--hud38-base)!important;background-image:linear-gradient(180deg,#ffffff0a,transparent 36%,#00000018)!important;border:0;border-block:1px solid var(--hud38-line);border-radius:0;box-shadow:inset 0 3px 0 #ffffff05,inset 0 -3px 0 #0005,0 3px 8px #0006;overflow:visible;clip-path:none!important;isolation:isolate;
}
#sanctuary-view[data-hud-r38] :is(.room-hub-toolbar,.room-hub-options,.sanctuary-home-menu,.sanctuary-window-head,.hud38-window-options) .room-hub-material-art{display:none!important}
#sanctuary-view[data-room-hub][data-hud-r38][data-scene] :is(.room-hub-start,.room-hub-primary,.room-hub-end){display:flex;align-items:center;gap:8px;height:auto;min-width:0;overflow:visible}
#sanctuary-view[data-hud-r38] .room-hub-primary{justify-content:center}
#sanctuary-view[data-hud-r38] .room-hub-end{justify-content:flex-end}
#sanctuary-view[data-room-hub][data-hud-r38][data-scene] :is(.room-hub-toolbar,.room-hub-options,.sanctuary-home-menu,.sanctuary-window-head,.hud38-window-options) :is(button,a,select){
 box-sizing:border-box;position:relative;flex-shrink:0;min-width:44px;min-height:44px;margin:0;padding:8px 11px;clip-path:none!important;border:1px solid var(--hud38-line)!important;border-radius:var(--hud38-radius)!important;background:var(--hud38-well)!important;color:var(--hud38-ink)!important;text-shadow:none!important;box-shadow:inset 0 1px 0 #ffffff0c,0 1px 2px #0004!important;font:500 13px/1.25 var(--hub-body);text-decoration:none;cursor:pointer;
}
#sanctuary-view[data-room-hub][data-hud-r38][data-scene] :is(.room-hub-toolbar,.room-hub-options,.sanctuary-home-menu,.sanctuary-window-head,.hud38-window-options) :is(button,a,select):hover{background:var(--hud38-face)!important;color:var(--hud38-accent)!important}
#sanctuary-view[data-room-hub][data-hud-r38][data-scene] :is(.room-hub-toolbar,.room-hub-options,.sanctuary-home-menu,.sanctuary-window-head,.hud38-window-options) :is(button,a,select):is([aria-expanded=true],[aria-pressed=true],[aria-checked=true]){background:var(--hud38-face)!important;border-color:var(--hud38-accent)!important;box-shadow:inset 0 0 0 1px var(--hud38-accent)!important}
#sanctuary-view[data-room-hub][data-hud-r38][data-scene] :is(button,a,select,input):focus-visible{outline:2px solid var(--hud38-accent)!important;outline-offset:3px!important}
#sanctuary-view[data-room-hub][data-hud-r38][data-scene] .room-hub-toolbar .room-hub-action{flex:0 1 auto;flex-direction:row;gap:7px;width:auto;max-width:none;height:48px;min-width:44px;padding:8px 12px}
#sanctuary-view[data-hud-r38] .room-hub-toolbar .room-hub-icon{width:23px;height:23px;flex-shrink:0}
#sanctuary-view[data-room-hub][data-hud-r38][data-scene] #sanctuary-return{flex:0 0 44px;width:44px;height:48px;min-height:44px;padding:8px}
#sanctuary-view[data-room-hub][data-hud-r38][data-scene] #sanctuary-scene-choice{flex:1 1 auto;min-width:0;max-width:190px;margin:0;padding:0}
#sanctuary-view[data-room-hub][data-hud-r38][data-scene] .sanctuary-home-toggle{width:100%;height:48px;min-height:44px;min-width:0;padding:8px 10px;font-size:13px;text-transform:none;letter-spacing:0;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#sanctuary-view[data-room-hub][data-hud-r38][data-scene] :is(#room-hub-more,.hud38-window-gear){display:grid;place-items:center;flex:0 0 44px;width:44px;height:48px;min-width:44px;padding:8px;align-self:center;margin:0}
#sanctuary-view[data-hud-r38] .hud38-gear{display:block;width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.55;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
/* Entire scrolling panels retain their solid backing at every content height.
   Each room has a restrained, fixed 72px authored inlay instead of blown-up wells. */
#sanctuary-view[data-room-hub][data-hud-r38][data-scene] :is(.room-hub-options,.sanctuary-home-menu,.hud38-window-options){box-sizing:border-box;position:fixed;z-index:120;max-width:calc(100vw - 16px);padding:12px;border:1px solid var(--hud38-line);border-radius:var(--hud38-radius);background-color:var(--hud38-base)!important;background-image:var(--hud38-inlay),linear-gradient(140deg,#ffffff06,transparent 65%)!important;background-position:right 12px top 12px,0 0;background-size:72px 72px,100% 100%;background-repeat:no-repeat;color:var(--hud38-ink);box-shadow:inset 0 0 0 3px #0002,0 10px 32px #0007;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;isolation:isolate}
#sanctuary-view[data-room-hub][data-hud-r38][data-scene] .sanctuary-home-menu [role=menuitemradio]{display:flex;gap:10px;align-items:center;width:100%;min-height:48px;padding:10px 12px;border:1px solid transparent!important;border-radius:5px!important;background:transparent!important;box-shadow:none!important;font-size:15px;line-height:1.3}
#sanctuary-view[data-room-hub][data-hud-r38][data-scene] .sanctuary-home-menu [role=menuitemradio]:is(:hover,[aria-checked=true]){background:var(--hud38-face)!important;border-color:var(--hud38-line)!important;box-shadow:none!important}
#sanctuary-view[data-hud-r38] .sanctuary-home-menu .hub-theme-icon{display:grid;place-items:center;flex:0 0 30px;width:30px;height:30px;border:0;background:none;color:var(--hud38-accent);font-size:19px}
#sanctuary-view[data-hud-r38] .sanctuary-home-menu .hub-theme-check{color:var(--hud38-muted);font-size:12px}
#sanctuary-view[data-hud-r38] .sanctuary-home-menu [aria-disabled=true]{color:var(--hud38-muted)!important}
#sanctuary-view[data-hud-r38] .room-hub-native-controls{display:flex;flex-wrap:wrap;gap:8px}
#sanctuary-view[data-hud-r38] :is(.room-hub-options,.hud38-window-options) :is(.room-hub-label,.room-hub-action .room-hub-label){position:static;width:auto;height:auto;overflow:visible;clip-path:none;white-space:normal}
#sanctuary-view[data-hud-r38] .hud38-volume{box-sizing:border-box;display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px 12px;flex:1 0 100%;width:100%;padding:12px 2px 2px;color:var(--hud38-ink);font:13px/1.4 var(--hub-body);border-top:1px solid var(--hud38-line)}
#sanctuary-view[data-hud-r38] .hud38-volume input{display:block;grid-column:1/-1;box-sizing:border-box;width:100%;min-width:0;min-height:28px;margin:0;accent-color:var(--hud38-accent)}
#sanctuary-view[data-hud-r38] .hud38-volume small{grid-column:1/-1;font-size:11px;color:var(--hud38-muted)}
#sanctuary-view[data-hud-r38] .hud38-options-title{margin:0 0 10px;padding:0 0 7px;border-bottom:1px solid var(--hud38-line);color:var(--hud38-accent);font:600 12px/1.4 var(--hub-body);letter-spacing:.04em}
/* Close-up/window views use the same complete rail and an inset far-right gear. */
#sanctuary-view[data-room-hub][data-hud-r38][data-scene] #sanctuary-window-view .sanctuary-window-head{box-sizing:border-box;display:flex;align-items:center;gap:12px;min-height:var(--hub-bar);height:auto;max-width:100%;padding:10px max(16px,env(safe-area-inset-right)) 10px max(16px,env(safe-area-inset-left));border:0;border-block:1px solid var(--hud38-line);border-radius:0;background:var(--hud38-base)!important;box-shadow:inset 0 -3px 0 #0004;clip-path:none;overflow:visible;color:var(--hud38-ink)}
#sanctuary-view[data-hud-r38] .sanctuary-window-head>div:not(.sanctuary-window-controls){min-width:0;flex:1 1 auto}
#sanctuary-view[data-hud-r38] .sanctuary-window-head h2{color:var(--hud38-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#sanctuary-view[data-hud-r38] .sanctuary-window-head p{color:var(--hud38-muted)}
#sanctuary-view[data-room-hub][data-hud-r38][data-scene] #sanctuary-window-view .sanctuary-window-controls{display:flex;flex:0 0 auto;align-items:center;gap:8px;margin-left:auto;min-width:44px;max-width:100%;overflow:visible}
#sanctuary-view[data-hud-r38] .hud38-window-options{display:grid;grid-template-columns:1fr;gap:8px}
#sanctuary-view[data-hud-r38] .hud38-window-options[hidden]{display:none!important}
#sanctuary-view[data-hud-r38][data-user-motion-paused=true] :is(.sanctuary-scene,.sanctuary-scene *,#sanctuary-window-plane *){animation-play-state:paused!important}
@media(max-width:1179px){
 #sanctuary-view[data-room-hub][data-hud-r38][data-scene] .room-hub-toolbar{grid-template-columns:minmax(150px,210px) minmax(0,1fr) auto;gap:8px;padding-inline:12px}
 #sanctuary-view[data-room-hub][data-hud-r38][data-scene] .room-hub-toolbar .room-hub-action{flex-direction:column;gap:2px;padding:5px 8px;font-size:11px}
 #sanctuary-view[data-hud-r38] .room-hub-toolbar .room-hub-icon{width:20px;height:20px}
}
@media(max-width:879px){#sanctuary-view[data-room-hub][data-hud-r38][data-scene] .room-hub-toolbar{grid-template-columns:minmax(150px,220px) minmax(0,1fr) auto}}
@media(max-width:639px){
 #sanctuary-view[data-room-hub][data-hud-r38][data-scene] .room-hub-toolbar{grid-template-columns:minmax(120px,1fr) auto auto;gap:6px;padding-inline:10px}
 #sanctuary-view[data-room-hub][data-hud-r38][data-scene] :is(.room-hub-start,.room-hub-primary,.room-hub-end){gap:5px}
 #sanctuary-view[data-room-hub][data-hud-r38][data-scene] .room-hub-toolbar .room-hub-action{width:44px;min-width:44px;padding:8px}
 #sanctuary-view[data-hud-r38] .room-hub-toolbar .room-hub-action>.room-hub-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
 #sanctuary-view[data-room-hub][data-hud-r38][data-scene] #sanctuary-window-view .sanctuary-window-head{padding-inline:10px;gap:8px}
 #sanctuary-view[data-hud-r38] .sanctuary-window-head>div:not(.sanctuary-window-controls){display:none}
}
@media(max-width:539px){
 #sanctuary-view[data-room-hub][data-hud-r38][data-scene] .room-hub-toolbar{grid-template-columns:minmax(88px,1fr) 44px auto;gap:6px}
 #sanctuary-view[data-room-hub][data-hud-r38][data-scene] #sanctuary-scene-choice{max-width:190px}
 #sanctuary-view[data-room-hub][data-hud-r38][data-scene] .sanctuary-home-toggle{font-size:12px;padding-inline:8px}
}
@media(prefers-reduced-motion:reduce){#sanctuary-view[data-hud-r38] :is(button,a){transition:none!important}}
@media(forced-colors:active){
 #sanctuary-view[data-room-hub][data-hud-r38][data-scene]{--hud38-base:Canvas;--hud38-face:Canvas;--hud38-well:ButtonFace;--hud38-line:ButtonText;--hud38-ink:CanvasText;--hud38-muted:CanvasText;--hud38-accent:Highlight}
 #sanctuary-view[data-room-hub][data-hud-r38][data-scene] :is(.room-hub-toolbar,.room-hub-options,.sanctuary-home-menu,.sanctuary-window-head,.hud38-window-options){background:Canvas!important;background-image:none!important;color:CanvasText!important;box-shadow:none!important}
 #sanctuary-view[data-room-hub][data-hud-r38][data-scene] :is(.room-hub-toolbar,.room-hub-options,.sanctuary-home-menu,.sanctuary-window-head,.hud38-window-options) :is(button,a,select){background:ButtonFace!important;color:ButtonText!important;border-color:ButtonText!important;box-shadow:none!important}
}
html[data-reading-contrast=high] #sanctuary-view[data-hud-r38],body[data-reading-contrast=high] #sanctuary-view[data-hud-r38]{--hud38-base:#101010;--hud38-face:#222;--hud38-well:#080808;--hud38-line:#fff;--hud38-ink:#fff;--hud38-muted:#eee;--hud38-accent:#ffe091;--hud38-inlay:none}
/* Azeroth's explicit Show UI escape hatch stays available after Hide UI.
   The same native toggle moves out of the closed gear only while restoring. */
#sanctuary-view[data-room-hub][data-hud-r38][data-scene=cyber] #sanctuary-window-view[data-controls-hidden=true] .sanctuary-window-head{background:transparent!important;border-color:transparent;box-shadow:none!important}
/* Cottage: interior lights are separate from the saved Day / Night scene. */
#sanctuary-view[data-hud-r38] .hud38-room-lights{box-sizing:border-box;display:flex;align-items:center;gap:12px;flex:1 0 100%;min-height:56px;padding:11px 12px;border:1px solid var(--hud38-line);border-radius:var(--hud38-radius);background:var(--hud38-well);color:var(--hud38-ink);font:500 13px/1.4 var(--hub-body);cursor:pointer}
#sanctuary-view[data-hud-r38] .hud38-room-lights[hidden]{display:none!important}
#sanctuary-view[data-hud-r38] .hud38-room-lights input[type=checkbox]{appearance:auto;box-sizing:border-box;display:block;flex:0 0 22px;width:22px;height:22px;min-width:22px;min-height:22px;margin:0;padding:0;accent-color:var(--hud38-accent);cursor:pointer}
#sanctuary-view[data-hud-r38] .hud38-lights-copy{display:grid;grid-template-columns:1fr auto;gap:3px 12px;flex:1;min-width:0}
#sanctuary-view[data-hud-r38] .hud38-lights-state{color:var(--hud38-accent);font-size:12px}
#sanctuary-view[data-hud-r38] .hud38-lights-copy small{grid-column:1/-1;color:var(--hud38-muted);font:11px/1.4 var(--hub-body)}
@media(forced-colors:active){#sanctuary-view[data-hud-r38] .hud38-room-lights{background:Canvas;color:CanvasText;border-color:ButtonText}#sanctuary-view[data-hud-r38] .hud38-room-lights input[type=checkbox]{forced-color-adjust:auto}}
/* Day / Night is a primary action for rooms with independent night lighting.
   Reuse the native action node; retain an icon-only 44px target on narrow rails. */
#sanctuary-view[data-room-hub][data-hud-r38][data-scene] .room-hub-toolbar [data-time-control=true]{box-sizing:border-box;display:inline-flex;flex:0 0 76px;flex-direction:column;align-items:center;justify-content:center;gap:2px;width:76px;height:48px;padding:4px 5px;font-size:11px;line-height:1.2}
#sanctuary-view[data-hud-r38] .room-hub-toolbar [data-time-control=true] .room-hub-icon{width:20px;height:20px}
#sanctuary-view[data-hud-r38] .room-hub-toolbar [data-time-control=true] .room-hub-label{white-space:nowrap}
@media(max-width:639px){
 #sanctuary-view[data-room-hub][data-hud-r38][data-scene] .room-hub-toolbar [data-time-control=true]{flex-basis:44px;width:44px;padding:8px}
 #sanctuary-view[data-hud-r38] .room-hub-toolbar [data-time-control=true] .room-hub-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
}
@media(max-width:539px){#sanctuary-view[data-room-hub][data-hud-r38]:is([data-scene=auriela],[data-scene=youth]) .room-hub-toolbar{grid-template-columns:minmax(88px,1fr) 93px auto}}
