/* L2Tools tokens from src/app/site-relook.css, with the site's own fonts. */
@font-face{font-family:Cinzel;src:url('./branding/fonts/cinzel-latin.woff2') format('woff2');font-weight:500 700;font-display:swap}
@font-face{font-family:'Source Sans 3';src:url('./branding/fonts/source-sans-3-latin.woff2') format('woff2');font-weight:400 700;font-display:swap}
:root{color-scheme:dark;--bg:#090f17;--surface-1:#101923;--surface-2:#141e2a;--surface-3:#1c2835;--line:#34404b;--line-soft:#43505c;--ui-border:rgb(204 178 129 / 24%);--ui-field:#0c141f;--text-primary:#ece7dd;--text-secondary:#c3c9d1;--text-muted:#a4afbf;--text-heading:#d6b77d;--accent:#c7a56b;--accent-strong:#e0c48d;--accent-ink:#201a10;--ui-hover:rgb(214 183 125 / 7%);--ui-selected:rgb(214 183 125 / 13%);--success:#add0b4;--danger:#e7a49a;--shadow:rgb(0 0 0 / 25%);--hud-top:max(16px,env(safe-area-inset-top));--hud-height:64px;font:15px/1.5 'Source Sans 3',sans-serif;background:var(--bg);color:var(--text-primary)}
html[data-theme=light]{color-scheme:light;--bg:#eee6d8;--surface-1:#faf5eb;--surface-2:#f4eddf;--surface-3:#eae1d2;--line:#d8ccb7;--line-soft:#baab92;--ui-border:rgb(134 97 50 / 25%);--ui-field:#fbf7ee;--text-primary:#443727;--text-secondary:#605747;--text-muted:#786c5b;--text-heading:#866132;--accent:#866132;--accent-strong:#75522c;--accent-ink:#fff9ef;--ui-hover:rgb(134 97 50 / 7%);--ui-selected:rgb(134 97 50 / 12%);--success:#2d6a3f;--danger:#a13a2f;--shadow:rgb(72 53 30 / 16%)}
*{box-sizing:border-box;scrollbar-width:thin;scrollbar-color:var(--line-soft) transparent}[hidden]{display:none!important}
body{margin:0;height:100dvh;display:grid;grid-template-columns:300px 1fr;overflow:hidden}
h1,h2,h3{font-family:Cinzel,Georgia,serif;font-weight:500;color:var(--text-heading);line-height:1.25}h1{font-size:30px;margin:0 0 12px}h2{font-size:24px;margin:0}h3{font-size:17px}
p{color:var(--text-muted);font-size:13px;line-height:1.6;margin:10px 0}a{color:var(--text-heading);text-underline-offset:4px}a:hover{color:var(--accent-strong)}
button,input,select{font:inherit;color:var(--text-primary);border:1px solid var(--ui-border);border-radius:6px;background:var(--ui-field)}
button{min-height:40px;padding:8px 13px;cursor:pointer;font-weight:600;transition:background-color 120ms,border-color 120ms,color 120ms}button:hover{background:var(--surface-3);border-color:var(--accent)}button:disabled{opacity:.45;cursor:default}
:is(button,input,select,summary,a):focus-visible{outline:2px solid var(--accent-strong);outline-offset:3px}
button.primary-button{background:linear-gradient(130deg,#e0c28b,#c7a363);border-color:#dbc28e;color:#21180e;box-shadow:0 1px 0 #ffffff40 inset}button.primary-button:hover{background:#edd2a0}
input,select{width:100%;padding:10px 12px;min-width:0;min-height:42px}input[type=range]{appearance:auto;min-height:24px;padding:0;border:0;background:none;accent-color:var(--accent);cursor:pointer}input[type=checkbox]{width:17px;min-height:17px;height:17px;margin:0;accent-color:var(--accent);flex:none}
label{display:block;margin:0 0 7px;color:var(--text-secondary);font-size:14px;font-weight:600}.check{display:flex;align-items:center;gap:10px;margin:0;min-height:26px;font-weight:500;cursor:pointer}output{float:right;margin-left:10px;color:var(--text-heading);font-variant-numeric:tabular-nums;font-weight:500}
.row{display:flex;gap:8px;align-items:center}.row input{min-width:0}.row button{flex:none}.icon-button{display:inline-grid;place-items:center;width:40px;padding:0;font-size:21px;font-weight:400}hr{border:0;border-top:1px solid var(--ui-border);margin:20px 0}
kbd{display:inline-block;border:1px solid var(--line);border-radius:3px;padding:0 4px;background:var(--surface-3);color:var(--text-secondary);font:11px/1.6 ui-monospace,monospace}
.eyebrow{display:block;color:var(--text-heading);font-size:10px;font-weight:650;letter-spacing:.16em;text-transform:uppercase}.field-help{font-size:12px;margin:7px 0 0;line-height:1.5;color:var(--text-muted)}.ui-field{margin:0 0 20px}.ui-field:last-child{margin-bottom:0}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.control-group{border-top:1px solid var(--ui-border);margin-top:20px}.control-group>summary{cursor:pointer;padding:15px 0;color:var(--text-primary);font-size:14px;font-weight:600;list-style:none}.control-group>summary::after{content:'+';float:right;color:var(--text-heading);font-size:18px;line-height:20px}.control-group[open]>summary::after{content:'−'}summary::-webkit-details-marker{display:none}.control-group-body{padding:4px 0 6px}
#view{position:relative;min-width:0;min-height:0;overflow:hidden;background:var(--bg)}#view>canvas{display:block;touch-action:none;outline:none}
/* Primary navigation above, quick world controls below. */
#photo-toolbar{position:absolute;z-index:5;top:var(--hud-top);left:16px;right:16px;min-height:var(--hud-height);display:flex;align-items:center;gap:15px;padding:10px 13px;background:var(--surface-1);border:1px solid var(--ui-border);border-radius:12px;box-shadow:0 6px 24px var(--shadow)}
.explorer-brand{display:flex;align-items:center;gap:7px;white-space:nowrap;text-decoration:none;color:var(--text-heading);font:500 15px Cinzel,Georgia,serif}.explorer-brand img{width:30px;height:30px;object-fit:contain}.explorer-title{padding-left:15px;border-left:1px solid var(--ui-border);white-space:nowrap;font:500 14px Cinzel,Georgia,serif}.explorer-title small{display:block;margin-top:3px;font:10px 'Source Sans 3',sans-serif;text-transform:uppercase;letter-spacing:.14em;color:var(--text-muted)}
.main-actions{display:flex;align-items:center;gap:3px}.view-actions{display:flex;align-items:center;gap:5px;margin-left:auto}#photo-toolbar button{display:flex;align-items:center;justify-content:center;gap:7px;white-space:nowrap;font-size:13px;min-height:40px}.main-actions button{border-color:transparent;background:transparent;padding:9px 12px;color:var(--text-secondary)}.main-actions button:hover,.main-actions button[aria-expanded=true]{border-color:var(--ui-border);background:var(--ui-selected);color:var(--text-heading)}
:is(#photo-toolbar,#quick-toolbar) svg{width:17px;height:17px;flex:none}#share-view,#fullscreen{padding:8px 10px}#share-view span,#fullscreen span{display:none}
#quick-toolbar{position:absolute;z-index:5;bottom:max(18px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);display:flex;gap:3px;align-items:center;padding:5px;background:var(--surface-1);border:1px solid var(--ui-border);border-radius:9px;box-shadow:0 4px 20px var(--shadow)}
#quick-toolbar button{display:flex;align-items:center;gap:8px;background:none;border-color:transparent;font-size:13px;min-height:36px;white-space:nowrap;padding:7px 11px}#quick-toolbar button:hover{background:var(--ui-hover);border-color:var(--ui-border)}#quick-toolbar button[aria-pressed=true],#quick-toolbar button[data-mode=walk],#quick-toolbar button[data-mode=collision]{color:var(--text-heading)}#fps-toggle{min-width:54px;font-variant-numeric:tabular-nums}
#control-bar{position:absolute;z-index:5;left:16px;bottom:max(18px,env(safe-area-inset-bottom));display:flex;gap:6px}#control-bar button{background:var(--surface-1);font-size:12px;box-shadow:0 2px 16px var(--shadow)}#control-bar #help-toggle{font:500 18px Cinzel,serif}#look[aria-pressed=true]{color:var(--text-heading);border-color:var(--accent)}
#mouse-status,#walk-status,#toolbar-status{position:absolute;z-index:6;max-width:min(480px,calc(100% - 32px));margin:0;padding:8px 12px;border:1px solid var(--ui-border);border-radius:6px;background:var(--surface-1);color:var(--text-secondary);font-size:12px;pointer-events:none}#mouse-status,#walk-status{left:16px;bottom:72px}#walk-status{bottom:116px;color:var(--text-heading)}#toolbar-status{left:16px;top:calc(var(--hud-top) + var(--hud-height) + 10px)}:is(#mouse-status,#walk-status,#toolbar-status):empty{display:none}
/* Welcome and preparation use the site's hero and panel proportions. */
#launch{position:absolute;inset:0;z-index:10;overflow:auto;display:grid;place-items:center;padding:30px;background:radial-gradient(ellipse at 70% 10%,var(--surface-3),transparent 65%),var(--bg)}
.launch-card{position:relative;isolation:isolate;display:grid;grid-template-columns:1.04fr 1fr;width:min(900px,100%);overflow:hidden;border:1px solid var(--ui-border);border-radius:16px;box-shadow:0 18px 55px var(--shadow);background:var(--surface-1)}
.launch-scene{position:absolute;z-index:-1;inset:0 48% 0 0;background:linear-gradient(180deg,#101923bb 0%,#10192344 45%,#101923de 100%),url('./branding/explorer-cover.webp') 44% center/cover}
.launch-intro{position:relative;padding:38px 32px;color:#f5eee0;min-height:450px;display:flex;flex-direction:column}.launch-intro::after{content:'';position:absolute;left:18px;bottom:18px;width:30px;height:30px;border-left:1px solid #d6b77d88;border-bottom:1px solid #d6b77d88;pointer-events:none}
.launch-brand{display:flex;align-items:center;gap:9px;margin-bottom:45px;font-size:10px;letter-spacing:.15em;text-transform:uppercase;color:#e5cda2;font-weight:650}.launch-brand img{object-fit:contain}.launch-brand i{margin:0 8px;opacity:.4;font-style:normal}
.launch-intro h1{font-size:clamp(42px,5vw,66px);line-height:1.09;letter-spacing:-.035em;color:#f5eee0;text-shadow:0 2px 16px #0005;font-weight:500}.launch-intro h1 span{color:#e2bc79}.launch-description{color:#e5e2de;font-size:14px;text-shadow:0 1px 5px #0009;line-height:1.8;margin-top:20px}.launch-caption{margin-top:auto;padding-top:40px;font-size:11px;color:#e0d7c9}
.launch-setup{padding:38px 32px;background:var(--surface-1)}.launch-setup h2{font-size:24px;margin:10px 0 15px;color:var(--text-primary)}#launch-message{font-size:14px;margin:0 0 22px}.launch-options{padding-top:20px;border-top:1px solid var(--ui-border)}#launch-preset{font-size:16px;font-weight:600}#preset-description{min-height:42px;font-size:12px;margin:9px 0 22px}.launch-options .check{font-size:14px}#launch-button{width:100%;margin-top:24px;min-height:46px}#launch-recover{width:100%;margin-top:10px}#launch-stop-detail{font-size:11px;color:var(--danger)}#launch-stop-detail:empty{display:none}.launch-settings-note{font-size:11px;text-align:center;margin:12px 0 0}#preset-summary{font-size:11px;color:var(--text-heading)}
#preload-panel{position:absolute;inset:0;z-index:10;display:grid;place-items:center;padding:24px;background:#090f1799;overflow:auto}.preload-card{width:min(500px,100%);padding:28px;border:1px solid var(--ui-border);border-radius:14px;background:var(--surface-1);box-shadow:0 15px 60px #0005}.loading-brand{display:flex;align-items:center;gap:10px;margin-bottom:23px}.loading-brand img{object-fit:contain}
.preload-heading{display:flex;align-items:start;justify-content:space-between;gap:20px;color:var(--text-primary);font-size:18px;line-height:1.3}.preload-heading strong{font-size:16px;color:var(--text-heading);white-space:nowrap;font-variant-numeric:tabular-nums}.preload-card progress{display:block;width:100%;height:7px;margin:22px 0;accent-color:var(--accent);border:0;border-radius:5px;background:var(--surface-3);overflow:hidden}progress::-webkit-progress-bar{background:var(--surface-3);border-radius:5px}progress::-webkit-progress-value{background:var(--accent);border-radius:5px}
.preload-transfer{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;font-size:14px;color:var(--text-heading);font-variant-numeric:tabular-nums}.preload-card [data-detail]{font-size:12px;margin:10px 0 0}.preload-card [data-note]{font-size:11px}.preload-card .row{margin-top:24px}.preload-card .row button{flex:1;font-size:14px}
body:has(#launch:not([hidden])) :is(#photo-toolbar,#quick-toolbar,#control-bar,#perf,#toggle-panel,#touch-move),body:has(#preload-panel:not([hidden])) :is(#quick-toolbar,#control-bar,#touch-move){visibility:hidden}
/* Developer side panel and diagnostics placement. */
aside{background:var(--surface-1);border-right:1px solid var(--ui-border);overflow:auto;padding:22px 18px;z-index:7;overscroll-behavior:contain}.developer-heading{display:flex;gap:12px;align-items:center;justify-content:space-between}.developer-heading h2{font-size:20px;margin-top:6px}.developer-heading button{flex:none;background:none;border:0}#gpu{font:10px/1.6 ui-monospace,monospace;overflow-wrap:anywhere;margin-top:15px}aside .control-group{margin-top:12px}aside .ui-field{margin-bottom:18px}aside .field-grid{grid-template-columns:1fr;gap:0}.dev-section{border-top:1px solid var(--ui-border);padding:15px 0;margin-top:12px}.dev-section>summary{cursor:pointer;font-size:14px;font-weight:600;color:var(--text-primary);margin-bottom:10px}
#controls-debug>button{width:100%;margin-top:12px}#controls-debug .row button{flex:1;font-size:12px;padding-inline:8px}#map{width:100%;height:180px;display:block;border:1px solid var(--ui-border);border-radius:8px;background:var(--bg);cursor:crosshair}#issues{font-size:11px;white-space:pre-wrap;max-height:140px;overflow:auto;color:var(--danger)}#coverage{font-size:11px}#status{position:absolute;bottom:0;left:0;right:0;min-height:27px;padding:6px 14px;background:var(--surface-1);color:var(--text-muted);font:10px ui-monospace,monospace;pointer-events:none}
body.developer-mode #control-bar,body.developer-mode #quick-toolbar{bottom:39px}body.developer-mode #photo-toolbar .explorer-title{display:none}#toggle-panel{display:none}.touch-help{display:none}
#perf{position:absolute;right:16px;top:calc(var(--hud-top) + var(--hud-height) + 12px);z-index:4;padding:14px;width:232px;background:var(--surface-1);border:1px solid var(--ui-border);border-radius:10px;font-variant-numeric:tabular-nums}#perf strong{font-size:27px;color:var(--success)}#perf .metrics{display:flex;justify-content:space-between;color:var(--text-muted);font-size:10px}.metrics b{color:var(--text-heading)}#graph{width:100%;height:52px;margin:8px 0}#stream,#coverage-status{font-size:11px;line-height:1.6;white-space:pre-line;margin-top:8px;color:var(--text-muted)}#coverage-status{color:var(--text-heading)}
#memory-notice{position:absolute;bottom:80px;left:50%;transform:translateX(-50%);z-index:8;background:var(--surface-1);border:1px solid var(--ui-border);border-radius:8px;padding:10px 14px;color:var(--text-heading);font-size:12px;max-width:80%;pointer-events:none}
/* Touch controls and responsive safe areas. */
#touch-move{display:none;pointer-events:none;position:absolute;inset:auto 16px max(22px,env(safe-area-inset-bottom));z-index:5;justify-content:space-between;align-items:end;gap:16px}#touch-move .move-pad{display:grid;grid-template-columns:repeat(3,48px);gap:5px}#touch-move .altitude-pad{display:grid;grid-template-columns:48px;gap:5px}#touch-move button{pointer-events:auto;touch-action:none;user-select:none;-webkit-user-select:none;min-width:48px;height:48px;padding:0;background:var(--surface-1);font-size:21px;box-shadow:0 2px 12px var(--shadow)}#touch-move button.pressed{background:var(--ui-selected);border-color:var(--accent)}body.touch-controls #touch-move{display:flex}body.touch-controls #look{display:none}body.touch-controls .touch-help{display:block}body.touch-controls #control-bar{bottom:140px}body.touch-controls #quick-toolbar{bottom:30px}
body.immersive{grid-template-columns:1fr}body.immersive aside{position:absolute;inset:0 auto 0 0;width:300px;transform:translateX(-100%)}body.immersive.settings aside{transform:none}body.immersive #toggle-panel{display:block}
@media(max-width:1120px){.explorer-title{display:none}#photo-toolbar{gap:12px}.main-actions button{padding-inline:9px}}
@media(max-width:760px){
  :root{--hud-top:max(10px,env(safe-area-inset-top));--hud-height:102px}body{grid-template-columns:1fr}aside{position:absolute;inset:0 auto 0 0;width:min(320px,100%);transform:translateX(-100%)}body.settings aside{transform:none}
  #photo-toolbar{left:max(10px,env(safe-area-inset-left));right:max(10px,env(safe-area-inset-right));display:grid;grid-template-columns:1fr auto;gap:5px 12px;padding:8px}.explorer-brand{padding-left:4px}.explorer-brand img{width:28px;height:28px}.explorer-brand span{font-size:14px}.main-actions{grid-row:2;grid-column:1/-1;border-top:1px solid var(--ui-border);padding-top:5px;display:grid;grid-template-columns:repeat(3,1fr)}.view-actions{grid-column:2;grid-row:1}.main-actions button{font-size:13px}#photo-toolbar button{min-height:40px}#photo-quick span{display:none}#photo-quick{width:40px;padding:9px}
  #quick-toolbar,body.developer-mode #quick-toolbar,body.touch-controls #quick-toolbar{top:calc(var(--hud-top) + var(--hud-height) + 13px);bottom:auto;max-width:calc(100% - 20px);gap:0}#quick-toolbar button{min-height:36px;padding:6px 10px;font-size:12px}#sound-toggle span{display:none}#control-bar,body.developer-mode #control-bar{left:10px;bottom:max(18px,env(safe-area-inset-bottom))}#touch-move{left:max(10px,env(safe-area-inset-left));right:max(10px,env(safe-area-inset-right))}body.touch-controls #control-bar{bottom:142px}#mouse-status{bottom:70px;left:10px}#walk-status{bottom:116px;left:10px}#toolbar-status{top:calc(var(--hud-top) + var(--hud-height) + 65px);left:10px}
  #toggle-panel,body.immersive #toggle-panel{position:absolute;display:block;right:10px;top:calc(var(--hud-top) + var(--hud-height) + 67px);z-index:8;padding:6px 10px}#perf{top:calc(var(--hud-top) + var(--hud-height) + 118px);width:204px;right:10px}
  #launch{padding:20px}.launch-card{max-width:520px;grid-template-columns:1fr}.launch-scene{inset:0 0 auto;height:260px;background-position:45% 55%}.launch-intro{min-height:245px;padding:24px}.launch-brand{margin-bottom:24px}.launch-intro h1{font-size:42px}.launch-intro h1 br{display:none}.launch-intro h1 span::before{content:' '}.launch-description{font-size:13px;line-height:1.6;margin-top:4px}.launch-caption{display:none}.launch-setup{padding:25px}.launch-setup h2{font-size:23px}.launch-intro::after{display:none}#launch-message{margin-bottom:16px}.launch-options{padding-top:16px}#preset-description{margin-bottom:18px;min-height:0}.preload-card{padding:24px}#preload-panel{padding:18px}.preload-card .row button{padding:10px 8px}
}
@media(max-height:540px){#launch{place-items:start center;padding:18px}.launch-card{grid-template-columns:1fr 1fr;max-width:850px}.launch-scene{inset:0 50% 0 0;height:auto}.launch-intro{min-height:350px}.launch-setup{padding:24px}.launch-setup h2{font-size:21px}.launch-brand{margin-bottom:25px}.launch-intro h1{font-size:42px}.launch-intro h1 br{display:block}.launch-intro h1 span::before{content:none}.launch-description{font-size:12px}#preload-panel{place-items:start center}#touch-move button{height:40px;min-width:40px}#touch-move .move-pad{grid-template-columns:repeat(3,40px)}#touch-move .altitude-pad{grid-template-columns:40px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
@media(max-height:540px) and (min-width:600px){
  .launch-intro{min-height:330px;padding:24px}.launch-setup{padding:18px 24px}.launch-setup>.eyebrow,.launch-settings-note,.launch-options>.field-help{display:none}.launch-setup h2{font-size:20px;margin:0 0 8px}#launch-message{font-size:12px;margin-bottom:12px}.launch-options{padding-top:12px}.launch-options label{font-size:12px}#launch-preset{font-size:14px;min-height:38px;padding:8px 10px}#preset-description{font-size:11px;min-height:0;margin:7px 0 14px}#launch-button{margin-top:16px;min-height:40px}.launch-caption{padding-top:20px}
}

/* Navigation mode hint tooltip */
@keyframes nav-hint-bob{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(-6px)}}
#nav-hint{
  position:fixed;
  z-index:200;
  pointer-events:none;
  opacity:0;
  transition:opacity .3s ease;
  transform:translateX(-50%);
}
#nav-hint.nav-hint-show{
  opacity:1;
  pointer-events:auto;
  cursor:pointer;
  animation:nav-hint-bob 1.8s ease-in-out infinite;
}
#nav-hint.nav-hint-out{
  opacity:0;
  pointer-events:none;
  animation:none;
  transition:opacity .4s ease;
}
#nav-hint span{
  display:block;
  background:var(--surface-1);
  border:1px solid var(--ui-border);
  border-radius:6px;
  padding:7px 13px;
  font-size:12px;
  color:var(--text-secondary);
  white-space:nowrap;
  box-shadow:0 4px 16px var(--shadow);
  position:relative;
  user-select:none;
}
#nav-hint span::before{
  content:'';
  position:absolute;
  bottom:-8px;
  left:50%;
  transform:translateX(-50%);
  border-left:8px solid transparent;
  border-right:8px solid transparent;
  border-top:8px solid var(--ui-border);
}
#nav-hint span::after{
  content:'';
  position:absolute;
  bottom:-6px;
  left:50%;
  transform:translateX(-50%);
  border-left:7px solid transparent;
  border-right:7px solid transparent;
  border-top:7px solid var(--surface-1);
}