/* Live reference: jlu.online — full canvas, compact corner HUD, dark pixel bevels. */
:root{--jlu-panel:#3a3446;--jlu-edge:#1e1a22;--jlu-light:#6b6478;--jlu-text:#f4f1de;--jlu-gold:#f2c14e}
.app-layout,.roaming .app-layout{position:fixed;inset:0;display:block;height:100dvh}
.sidebar{display:none!important}.map-shell,.roaming .map-shell{height:100%;border:0;box-shadow:none}
.map-topbar,.compass{display:none!important}
.site-header,.roaming .site-header,.night.roaming .site-header{position:fixed;top:8px;left:8px;right:auto;width:auto;height:30px;max-width:calc(100% - 180px);display:flex;gap:5px;padding:0;background:none;border:0;color:var(--jlu-text);z-index:8;pointer-events:none}
.site-header .brand,.site-header button{pointer-events:auto;font-family:var(--pixel)}
.site-header .brand{gap:5px;padding:3px 7px;background:var(--jlu-panel);border:2px solid var(--jlu-edge);box-shadow:inset 0 0 0 1px var(--jlu-light);height:30px}
.site-header .brand img{width:20px;height:20px}.site-header .brand strong,.roaming .brand strong{font:14px/20px var(--pixel);color:var(--jlu-text)}
.site-header .brand strong .pixel{font-size:14px}.site-header .brand small,.header-note,.site-header .guide-button{display:none}
.site-header .header-actions{gap:5px}.site-header .text-button{height:30px;padding:4px 7px;border:2px solid var(--jlu-edge);background:var(--jlu-panel);box-shadow:inset 0 0 0 1px var(--jlu-light);color:var(--jlu-text)}
.site-header .favorites-label{display:none}.site-header .count-badge{background:none;color:#d0c5b3;height:auto;min-width:8px}
.site-header .header-walk,.night.roaming .site-header .header-walk{height:30px;padding:4px 9px;gap:3px;font:12px/16px var(--pixel);background:var(--jlu-gold);color:#27212a;border:2px solid var(--jlu-edge);box-shadow:inset 0 0 0 1px #fff3c4;transform:none}
.site-header .header-walk svg{display:none}
.jlu-corner-nav{position:absolute;top:8px;right:8px;display:flex;gap:5px;z-index:7}
.jlu-corner-nav button{height:30px;padding:4px 9px;font:12px/16px var(--pixel);background:var(--jlu-panel);color:var(--jlu-text);border:2px solid var(--jlu-edge);box-shadow:inset 0 0 0 1px var(--jlu-light)}
.roaming .roam-hud,.night.roaming .roam-hud{top:46px;left:8px;width:230px;padding:8px;background:var(--jlu-panel);color:var(--jlu-text);border:2px solid var(--jlu-edge);box-shadow:inset 0 0 0 1px var(--jlu-light)}
.roam-hud .roam-heading strong{font-size:15px;line-height:1.35;color:var(--jlu-text)}
.roam-heading>div>span,.night .roam-heading>div>span{color:#c7bbcc;font-size:9px}
.roam-heading>.roam-avatar,.night .roam-heading>.roam-avatar{background:#50495e;border-color:#797183}
.roam-heading>#roam-help,.night .roam-heading>#roam-help{background:#50495e;border:1px solid #82788f;color:var(--jlu-text)}
.roam-hud>#roam-status,.night #roam-status{font:10px/1.6 var(--pixel);border-color:#696175;color:#d2c8d6;min-height:25px}
.roam-hud>#scene-selector-wrap{color:#d2c8d6}.roam-hud select,.night .roam-hud select{background:#282330;border-color:#80748c;color:var(--jlu-text);font:11px var(--pixel)}
.roam-hud .roam-objective,.night .roam-objective{background:#2b2634;border:1px solid #766983;padding:7px}
.roam-hud .roam-objective>span{color:#b6a6c5}.roam-hud .roam-objective>strong{font:11px/1.6 var(--pixel);color:#f0d494}
#hud-toggle,.night #hud-toggle{font:10px var(--pixel);color:#d3c5db;margin-top:6px}
.roam-hud>#scene-exit,.night .roam-hud>#scene-exit{background:#514458;border-color:#8b798a;color:#f0dec2;font:10px var(--pixel)}
.roaming .mini-map,.night.roaming .mini-map{top:46px;right:8px;width:148px;border:3px solid var(--jlu-edge);outline:1px solid var(--jlu-light);box-shadow:inset 0 0 0 1px var(--jlu-light);background:var(--jlu-panel)}
.roaming .mini-map canvas{width:142px;height:98px}.roaming .mini-map>div{color:#d0c4d6;font:9px var(--pixel);padding:4px 5px}
.roaming .mini-clock{display:grid;grid-template-columns:1fr auto;padding:7px;background:#f4edd2;border-top:3px solid var(--jlu-edge);color:#3b3440}
.mini-clock>span{font:10px var(--pixel);color:#5f4d48}.mini-clock time{font:24px/1.1 var(--pixel);color:#332b34}
.mini-clock #mini-location{display:block;grid-column:1/-1;font:10px/1.5 var(--pixel);color:#5f4d48;margin-top:4px;overflow-wrap:anywhere}
.roaming .map-controls,.night.roaming .map-controls{top:250px;right:8px;padding:3px;display:flex;flex-direction:row;gap:1px;transform:none;background:var(--jlu-panel);border:2px solid var(--jlu-edge);box-shadow:inset 0 0 0 1px var(--jlu-light)}
.roaming .map-controls button{width:25px;height:27px;font:19px var(--pixel);color:var(--jlu-text)}.map-controls .control-divider{display:none}.sound-off,.night .sound-off{background:#d3c4db}
.roaming .roam-tools,.night .roam-tools{bottom:12px;left:50%;right:auto;transform:translateX(-50%);background:var(--jlu-panel);border:2px solid var(--jlu-edge);box-shadow:inset 0 0 0 1px var(--jlu-light);padding:3px;gap:3px}
.roam-tools button,.night .roam-tools button{font:11px var(--pixel);background:#484052;color:var(--jlu-text);border:1px solid #81748c;min-height:30px;padding:5px 8px;gap:4px}
.roam-tools kbd,.night .roam-tools kbd{color:#b8aac3;border-color:#766780;font:8px monospace}
.roaming .map-bottom,.night.roaming .map-bottom{background:none;backdrop-filter:none;border:0;min-height:22px;bottom:0;padding:4px 8px;color:#eee2c7;text-shadow:1px 1px #24202c;pointer-events:none;max-width:220px;font:9px var(--pixel)}
.map-help,.map-bottom .mobile-guide{display:none!important}
.roaming .enter-hint,.night.roaming .enter-hint{bottom:65px;background:var(--jlu-panel);border:2px solid var(--jlu-edge);box-shadow:inset 0 0 0 1px var(--jlu-light);color:var(--jlu-text);padding:8px 12px}
.roaming .enter-hint>span{font-size:16px}.roaming .enter-hint button,.night .enter-hint button{color:#f2c972;font:11px var(--pixel)}
.roaming .interact-button,.night.roaming .interact-button{right:12px;bottom:16px;width:58px;height:58px;background:var(--jlu-panel);color:#c2b4cf;border:2px solid var(--jlu-edge);box-shadow:inset 0 0 0 1px var(--jlu-light)}
.roaming .interact-button.ready,.night.roaming .interact-button.ready{background:var(--jlu-gold);color:#2b2330;box-shadow:inset 0 0 0 1px #fff3c4}
.roaming .walking-pad button,.night.roaming .walking-pad button{background:#3a3446e8;color:#f4f1de;border:2px solid #1e1a22;box-shadow:inset 0 0 0 1px #6b6478}
.scene-menu-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.scene-menu-item{border:2px solid #82758e;background:#433b4e;text-align:left;padding:12px;font:15px var(--pixel);color:#f2e8d4;min-height:65px}.scene-menu-item small{display:block;font:10px/1.6 var(--pixel);color:#c4b5cd;margin-top:5px}
.roaming dialog,.roaming .night dialog,.roaming dialog.activity-dialog{background:#342e3f;color:#f4f1de;border:3px solid #1e1a22;box-shadow:inset 0 0 0 1px #776b83,5px 5px 0 #14101c66}
.roaming dialog .dialog-heading{background:#3a3446;border-color:#766780;color:#f4f1de}.roaming dialog .dialog-heading h2{color:#efdb9c}.roaming dialog .icon-button{background:#51465f;color:#f4e8d4}.roaming dialog .eyebrow{color:#bdaacb}
.roaming dialog .dialog-content{font-family:var(--pixel);color:#eee4d1}.roaming dialog .dialog-content p{font-size:13px}
/* A flat scrim keeps long-panel scrolling independent of the world canvas. */
#content-dialog::backdrop{background:#201b2ba8;backdrop-filter:none;-webkit-backdrop-filter:none}
#content-dialog{--scroll-track:#e8e8d8;--scroll-thumb:#859575;--scroll-hover:#647850;overscroll-behavior:contain;scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:var(--scroll-thumb) var(--scroll-track)}
.roaming #content-dialog,.night #content-dialog{--scroll-track:#2a2433;--scroll-thumb:#9e89ae;--scroll-hover:#efcf83}
#content-dialog .home-edit-map-wrap{scrollbar-width:thin;scrollbar-color:var(--scroll-thumb) var(--scroll-track)}
@supports selector(::-webkit-scrollbar){
  #content-dialog,#content-dialog .home-edit-map-wrap{scrollbar-width:auto;scrollbar-color:auto}
  #content-dialog::-webkit-scrollbar,#content-dialog .home-edit-map-wrap::-webkit-scrollbar{width:12px;height:12px}
  #content-dialog::-webkit-scrollbar-track,#content-dialog .home-edit-map-wrap::-webkit-scrollbar-track{background:var(--scroll-track)}
  #content-dialog::-webkit-scrollbar-thumb,#content-dialog .home-edit-map-wrap::-webkit-scrollbar-thumb{background:var(--scroll-thumb);border:3px solid var(--scroll-track);border-radius:0;min-height:36px;min-width:36px}
  #content-dialog::-webkit-scrollbar-thumb:hover,#content-dialog .home-edit-map-wrap::-webkit-scrollbar-thumb:hover{background:var(--scroll-hover)}
  #content-dialog::-webkit-scrollbar-corner,#content-dialog .home-edit-map-wrap::-webkit-scrollbar-corner{background:var(--scroll-track)}
  #content-dialog::-webkit-scrollbar-button,#content-dialog .home-edit-map-wrap::-webkit-scrollbar-button{display:none;width:0;height:0}
}
.roaming [class^="act-"],.roaming [class*=" act-"]{--act-paper:#3b3448;--act-ink:#f1e5cf;--act-edge:#82738e;--act-muted:#c4b5cd;--act-soft:#453b52;--act-gold:#e8c05e;--act-selected:#5e4c38;--act-green:#a4bb87;--act-done:#364a41;--act-danger:#e7a2a0;font-family:var(--pixel)}
.roaming .act-button.primary{background:#e3ba57;color:#29212e;border-color:#a18142}.roaming .act-fields input{background:#292331;color:#f0e3ca;border-color:#8a7999}
.roaming .toast{bottom:65px;background:#3a3446;border:2px solid #1e1a22;box-shadow:inset 0 0 0 1px #776b83;font-family:var(--pixel)}
@media(max-width:760px){
  .site-header,.roaming .site-header{max-width:calc(100% - 144px);gap:3px;top:6px;left:6px}.site-header .brand{padding:3px 5px}.site-header .brand img{display:none}.site-header .brand strong,.site-header .brand strong .pixel{font-size:12px}.site-header .text-button{display:none}.site-header .header-walk{font-size:10px;padding:3px 6px}
  .jlu-corner-nav{top:6px;right:6px;gap:3px}.jlu-corner-nav button{font-size:11px;padding:3px 6px}
  .roaming .roam-hud{top:42px;left:6px;width:calc(100% - 130px);max-width:230px;padding:7px}.roam-hud .roam-heading strong{font-size:13px}.roam-heading>div>span{font-size:8px}.roam-hud .roam-objective>strong{font-size:10px}
  .roaming .mini-map{top:42px;right:6px;width:110px}.roaming .mini-map canvas{width:104px;height:72px}.roaming .mini-clock{display:flex;flex-direction:column;align-items:flex-start;padding:5px}.mini-clock time{font-size:22px}.mini-clock #mini-location{font-size:9px;max-width:100%;margin-top:3px}
  .roaming .map-controls{top:233px;right:6px;display:grid;grid-template-columns:repeat(3,27px);gap:2px}.roaming .map-controls button{width:27px;height:28px}
  .roaming .roam-tools{left:10px;right:10px;bottom:125px;transform:none;grid-template-columns:repeat(4,minmax(0,1fr));width:auto}.roam-tools button{padding:4px 2px;font-size:10px;min-height:34px;gap:3px}
  .roaming .enter-hint{bottom:181px;max-width:calc(100% - 20px);padding:7px;gap:5px}.roaming .enter-hint>span{font-size:13px}.roaming .enter-hint button{font-size:10px;margin-left:1px}
  .roaming .walking-pad{bottom:18px;left:12px}.roaming .interact-button{right:14px;bottom:20px;width:60px;height:60px}
  .scene-menu-grid{grid-template-columns:1fr}.scene-menu-item{min-height:52px;padding:10px}
}
@media(max-width:360px){.site-header .brand strong .pixel{display:none}.roam-heading>#roam-help{display:none}.roam-hud .roam-heading strong{font-size:12px}.roaming .roam-hud{width:calc(100% - 126px)}}