/* Central artwork. Copy occupies the quiet upper-left corner of the galaxy. */
.site-header,.hero{--hero-header:78px;--hero-edge:clamp(22px,2.6vw,50px)}
.site-header{height:var(--hero-header);padding:0 var(--hero-edge);display:flex;align-items:center;gap:24px;position:relative;z-index:10;background:transparent}
.site-header .brand{font-size:32px}.site-header nav{gap:24px;font-size:12px}.header-actions{gap:18px}
.hero{height:calc(100svh - var(--hero-header));min-height:570px;max-height:none;display:block;padding:0;position:relative;isolation:isolate;overflow:visible}
.hero-copy{position:absolute;top:22px;left:var(--hero-edge);width:340px;max-width:38%;display:flex;flex-direction:column;gap:12px;margin:0;z-index:3;pointer-events:auto}
.hero-copy .eyebrow{font-size:9px;letter-spacing:1.35px;margin:0;line-height:1.5}
.hero h1{font-size:clamp(32px,2.65vw,44px);line-height:1.06;letter-spacing:-.05em;margin:0}
.hero .hero-description{max-width:270px;font-size:12px;line-height:1.65;margin:0}
.hero .hero-start{display:flex;align-items:center;flex-direction:row;flex-wrap:wrap;gap:5px 18px;margin:0}
.hero-copy .button{padding:10px 16px;min-height:44px;font-size:12px;gap:16px;border-radius:8px}
.hero-copy .text-link{font-size:11px;min-height:36px;padding:7px 0}
.hero-visual{position:absolute;left:0;right:0;top:42px;bottom:80px;width:100%;height:calc(100% - 122px);min-height:0;margin:0;mask-image:none;overflow:visible;opacity:1;z-index:1}
.hero .scene-drag-hint{bottom:-22px;font-size:10px;line-height:1.5;color:#bbcbd2;white-space:normal;width:230px;text-align:center}
.hero .scene-explore{left:50%;bottom:4px;background:#101a23e8;font-size:11px;min-height:38px;padding:9px 16px}
.hero-bottom{position:absolute;left:var(--hero-edge);right:var(--hero-edge);bottom:18px;gap:12px;z-index:4}
.hero-bottom .scroll-cue{font-size:9px;letter-spacing:1px}
.hero-bottom .motion-control{font-size:10px;min-height:40px;padding:9px 13px}
#scene-reset{width:40px;height:40px;min-height:40px;flex-basis:40px}
.galaxy-view-controls{position:absolute;left:var(--hero-edge);bottom:70px;width:204px;font-size:10px;z-index:6;background:#101a23ee}
.galaxy-view-controls:not([open]){display:block}
.galaxy-view-controls[open]{position:fixed;left:var(--hero-edge);bottom:20px;width:min(280px,calc(100vw - 44px));max-height:calc(100svh - 40px);overflow:auto;z-index:30}
.galaxy-number-controls select{display:block;width:100%;padding:10px 12px;margin-top:8px;border:1px solid #465360;border-radius:7px;background:#111d26;color:#edf2f5;font:inherit;font-size:13px}
.galaxy-number-controls input:disabled{opacity:.3;cursor:not-allowed}
.galaxy-number-controls label:has(input:disabled){color:#8c9ba5}
.galaxy-number-controls p{font-size:12px;line-height:1.55;color:#adbac2}
.galaxy-view-controls[open]{background:#111d26;font-size:12px;left:clamp(20px,2.6vw,50px);width:min(310px,calc(100vw - 44px));overflow-anchor:none}
@media(max-width:1100px) and (min-width:801px){
 .hero-copy{width:305px;gap:10px;max-width:36%}.hero h1{font-size:32px}.hero .hero-description{max-width:235px;font-size:11px}.hero-copy .button{font-size:11px;padding:9px 13px}.hero-copy .text-link{font-size:10px}
 .hero-visual{top:80px;height:calc(100% - 160px)}
}
@media(max-width:800px){
 .site-header,.hero{--hero-header:98px}
 .site-header{display:grid;grid-template-columns:1fr auto;grid-template-rows:40px 30px;gap:3px 16px;padding:12px var(--hero-edge)}
 .site-header .brand{font-size:29px}.site-header nav{grid-column:1/-1;grid-row:2;gap:23px;margin:0;font-size:11px}.site-header nav a{min-height:30px;padding:5px 0}
 .header-actions{grid-column:2;grid-row:1;gap:14px}.header-cta{font-size:11px;gap:10px}.header-actions select{font-size:10px;min-width:62px}
 .hero{height:calc(100svh - var(--hero-header));min-height:620px;padding:0}
 .hero-copy{top:22px;left:var(--hero-edge);width:310px;max-width:calc(100% - 44px);gap:10px}
 .hero-copy .eyebrow{font-size:8px}.hero h1{font-size:32px}.hero .hero-description{font-size:12px;line-height:1.6;max-width:285px}
 .hero .hero-start{gap:2px 16px}.hero-copy .button{font-size:11px;padding:9px 13px;min-height:42px}.hero-copy .text-link{font-size:10px;min-height:36px}
 .hero-visual{position:absolute;left:0;right:0;top:236px;bottom:80px;width:100%;height:calc(100% - 316px);min-height:0;margin:0;overflow:visible}
 .hero-bottom{left:var(--hero-edge);right:var(--hero-edge);bottom:15px;gap:8px}.hero-bottom .motion-control{font-size:9px;min-height:40px;padding:9px 10px}.hero-bottom .scroll-cue{font-size:7px;gap:8px}
 .galaxy-view-controls:not([open]){bottom:84px;left:var(--hero-edge);width:calc(50% - 30px);font-size:9px}.galaxy-view-controls summary{padding:9px 11px;min-height:36px}
 .hero .scene-drag-hint{bottom:-20px;font-size:9px;width:190px}.hero .scene-explore{left:auto;right:var(--hero-edge);transform:none;bottom:4px;width:calc(50% - 30px);font-size:10px;min-height:34px}
}
@media(min-width:1700px){.hero-copy{width:380px}.hero .hero-description{max-width:300px;font-size:13px}.hero-visual{top:38px;height:calc(100% - 118px)}}
@media(max-height:700px) and (min-width:801px){.hero-copy{top:12px;gap:8px}.hero h1{font-size:30px}.hero .hero-description{font-size:11px;max-width:250px}.hero{min-height:520px}.hero-visual{top:75px;height:calc(100% - 150px)}}
.galaxy-number-controls input#galaxy-numberHue{--number-track:linear-gradient(90deg,#0ff 0%,#00f 16.667%,#b000ff 33.333%,#f00 50%,#ff0 66.667%,#0f0 83.333%,#0ff 100%)}
.galaxy-number-controls input#galaxy-numberSaturation{--number-track:linear-gradient(90deg,#808080,#f00)}
.galaxy-number-controls input:is(#galaxy-numberHue,#galaxy-numberSaturation){
  -webkit-appearance:none;appearance:none;box-sizing:border-box;
  width:100%;height:26px;min-height:26px;padding:0;border:0;
  background:transparent;box-shadow:none;border-radius:4px;
}
.galaxy-number-controls input:is(#galaxy-numberHue,#galaxy-numberSaturation)::-webkit-slider-runnable-track{height:6px;border:0;border-radius:999px;background:var(--number-track);box-shadow:none}
.galaxy-number-controls input:is(#galaxy-numberHue,#galaxy-numberSaturation)::-moz-range-track{height:6px;border:0;border-radius:999px;background:var(--number-track);box-shadow:none}
.galaxy-number-controls input:is(#galaxy-numberHue,#galaxy-numberSaturation)::-moz-range-progress{height:6px;border:0;background:transparent;box-shadow:none}
.galaxy-number-controls input:is(#galaxy-numberHue,#galaxy-numberSaturation)::-webkit-slider-thumb{
  -webkit-appearance:none;appearance:none;box-sizing:border-box;
  width:16px;height:16px;margin-top:-5px;border:1px solid #17232b;
  border-radius:50%;background:#f4f3ed;box-shadow:none;
}
.galaxy-number-controls input:is(#galaxy-numberHue,#galaxy-numberSaturation)::-moz-range-thumb{
  box-sizing:border-box;width:16px;height:16px;border:1px solid #17232b;
  border-radius:50%;background:#f4f3ed;box-shadow:none;
}
.galaxy-number-controls input:is(#galaxy-numberHue,#galaxy-numberSaturation):focus-visible{outline:2px solid #ddc18b;outline-offset:2px}