/* The Paddock 3D: user-supplied model styles (unchanged) + mobile/caption additions at the end */
/* Layout: full-bleed 3D viewport, one floating control panel top-left, hint chip bottom. Single committed dark look. */
:root{
  --bg:#0E0F11; --panel:#17191C; --line:#2C3035; --fg:#F2F0EA; --muted:#A8A7A1;
  --accent:#F5C518; --accent-ink:#121314;
  --display:'Barlow Condensed', 'Arial Narrow', sans-serif;
  --body:'Barlow', 'Helvetica Neue', Arial, sans-serif;
  color-scheme:dark;
}
html,body{height:100%}
body{background:var(--bg);color:var(--fg);font-family:var(--body);overflow:hidden}
#stage{position:relative;height:100%;width:100%}
#stage canvas{display:block;width:100%;height:100%;outline:none}
.panel{position:absolute;top:calc(16px + env(safe-area-inset-top,0px));left:max(16px, env(safe-area-inset-left,0px));
  width:300px;max-width:calc(100% - 32px);box-sizing:border-box;background:color-mix(in srgb, var(--panel) 92%, transparent);
  border:1px solid var(--line);border-radius:10px;padding:16px;display:flex;flex-direction:column;gap:14px;backdrop-filter:blur(6px)}
.eyebrow{font-family:var(--display);font-weight:600;letter-spacing:.18em;text-transform:uppercase;font-size:12px;color:var(--accent)}
h1{margin:2px 0 0;font-family:var(--display);font-weight:700;font-size:34px;line-height:1;text-transform:uppercase;letter-spacing:.02em;text-wrap:balance}
.sub{font-size:13px;color:var(--muted);margin-top:6px;line-height:1.4}
.group{display:flex;flex-direction:column;gap:6px}
.label{font-family:var(--display);font-weight:600;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.seg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.seg.views{grid-template-columns:repeat(2,minmax(0,1fr))}
button{font:500 14px/1.2 var(--body);color:var(--fg);background:transparent;border:1px solid var(--line);border-radius:6px;
  padding:9px 10px;cursor:pointer;text-align:left;min-height:40px}
button:hover{border-color:var(--muted)}
button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
button[aria-pressed="true"]{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.note{font-size:13px;color:var(--muted);line-height:1.45;min-height:38px}
.hint{position:absolute;bottom:calc(16px + env(safe-area-inset-bottom,0px));right:max(16px, env(safe-area-inset-right,0px));
  font-size:12px;color:var(--muted);background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:6px 12px}
.body{display:flex;flex-direction:column;gap:14px}
.toggle{display:none}
@media (max-width:560px){
  .panel{width:auto;right:max(16px, env(safe-area-inset-right,0px));padding:12px;gap:10px}
  h1{font-size:26px}
  .sub{display:none}
  .toggle{display:block;position:absolute;top:10px;right:10px;min-height:32px;padding:4px 10px;font-size:12px}
  .panel.collapsed .body{display:none}
  .hint{display:none}
}

/* ---- Added for gtarcade.com.au ---- */
#stage canvas{touch-action:none} /* r128 OrbitControls does not set this: lets one-finger orbit and pinch work on phones */
.back{font:500 12px/1 var(--body);color:var(--muted);text-decoration:none;display:inline-block;margin-bottom:8px}
.back:hover{color:var(--fg)}
.fitted{position:absolute;bottom:calc(16px + env(safe-area-inset-bottom,0px));left:max(16px, env(safe-area-inset-left,0px));
  max-width:calc(100% - 32px);font-size:12px;color:var(--muted);background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:6px 12px}
@media (min-width:561px){.fitted{max-width:calc(100% - 420px)}}
html,body{margin:0}
