:root{
  --bg:#141719; --ink:#E8E6E1; --muted:#9A968F; --rule:#2C3034; --accent:#8FD6FF;
  color-scheme:dark;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--bg);color:var(--ink);
  font-family:system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased}

/* The canvas fills the window; the text sits over it and takes no pointer
   events except on its links, so dragging anywhere orbits the model. */
#stage{position:fixed;inset:0}
#stage canvas{display:block;width:100%;height:100%;touch-action:none}

.head{position:fixed;top:0;left:0;padding:16px;max-width:100%;pointer-events:none;z-index:2}
.head a{pointer-events:auto}
.eyebrow{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:0 0 6px}
a.home{color:inherit;text-decoration:none;border-bottom:1px solid var(--rule)}
a.home:hover{color:var(--accent);border-bottom-color:var(--accent)}
h1{font-size:clamp(22px,4vw,30px);font-weight:600;margin:0;line-height:1.15}
.title-row{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 16px}
/* Same hashed URL the viewer fetches, so the browser can serve the download
   from the copy it already has. The size is filled in by build.py. */
.dl{font-size:13px;color:var(--ink);text-decoration:none;white-space:nowrap;
  border:1px solid var(--rule);border-radius:6px;padding:3px 9px;background:rgba(20,23,25,.7)}
.dl:hover{color:var(--accent);border-color:var(--accent)}
/* Bottom bar: hint left, credits right; they stack when the window is narrow. */
.foot{position:fixed;left:0;right:0;bottom:0;padding:12px 16px 14px;z-index:2;
  display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 24px;
  font-size:12px;color:var(--muted);pointer-events:none}
.foot a{pointer-events:auto}

/* Loading screen: removed after the first frame is drawn. The fill is scaled
   from script via the style property (CSSOM), which the CSP allows - a
   style="" attribute would be blocked. */
.load{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);width:min(320px,80vw);
  text-align:center;z-index:3;color:var(--muted);font-size:13px}
.load[hidden]{display:none}
.load-stage{color:var(--ink);font-size:14px;margin-bottom:10px}
.bar{height:4px;border-radius:2px;background:var(--rule);overflow:hidden}
.bar i{display:block;height:100%;background:var(--accent);transform-origin:left;transform:scaleX(0)}
.bar.indeterminate i{transform:scaleX(1);opacity:.35}
.load-num{margin-top:8px;font-variant-numeric:tabular-nums}

/* Shown only when the model cannot be displayed. */
.err{position:fixed;left:16px;right:16px;top:50%;transform:translateY(-50%);
  text-align:center;color:#FF9B9B;font-size:15px;z-index:3}
.err[hidden]{display:none}