
html,body{overflow-x:hidden}
.s2{--hd:64px;box-sizing:border-box;min-height:calc(100svh - var(--hd));display:grid;align-content:center;padding:14px 0}
.s2 .sun{background:radial-gradient(900px 520px at 40% 45%,rgba(255,110,40,.08),transparent 70%)}
.s2-grid{display:grid;grid-template-columns:auto minmax(250px,330px);grid-template-areas:"stage head" "stage side";grid-template-rows:auto 1fr;column-gap:28px;align-items:start;justify-content:center}
.s2-head{grid-area:head}
.s2-side{grid-area:side;display:flex;flex-direction:column;gap:14px;min-width:0}
.s2 .kick{margin:0 0 8px}
.s2 .big{font-family:var(--serif);font-weight:800;font-size:clamp(30px,3.3vw,48px);line-height:.98;letter-spacing:-.03em;color:#fff;margin:0;text-wrap:balance}
.s2 .big em{font-style:italic;font-weight:500;color:var(--gold)}
.s2 .sub{font-size:15px;line-height:1.4;color:var(--ink-dim);margin:10px 0 16px}
.sun-stage{grid-area:stage;aspect-ratio:1600/1098;width:min(calc(100vw - 56px - 330px - 28px),calc((100svh - var(--hd) - 30px) * 1.4572),1080px);touch-action:none;cursor:crosshair;user-select:none;-webkit-user-select:none}
.sun-world{position:absolute;inset:0;transform-origin:0 0;will-change:transform;transition:transform .7s cubic-bezier(.2,.75,.2,1)}
.sun-world video,.sun-world img,.sun-world canvas{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:fill}
.sun-world canvas{pointer-events:none}
.sun-stage.mono .sun-world canvas,.sun-stage.nopaint .sun-world canvas,.sun-stage.nogl .sun-world canvas{visibility:hidden}
.sun-stage.nogl:not(.mono) video{filter:url(#haFilter)}
.sun-world img{opacity:0;transition:opacity .35s ease}
.sun-stage.fin .sun-world img{opacity:1}
.sun-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.sun-line line{stroke:#bfe3ff;stroke-width:var(--lw,3);stroke-linecap:round;filter:drop-shadow(0 0 4px rgba(0,0,0,.9))}
.sun-line circle{fill:#bfe3ff;stroke:#0b1220;stroke-width:var(--sw,2)}
.sun-earth{cursor:grab}
.sun-earth .halo{fill:transparent;stroke:rgba(170,205,255,.85);stroke-width:var(--sw,2);stroke-dasharray:4 4}
.sun-earth .ball{fill:#4f8ff0;stroke:#d6e6ff;stroke-width:calc(var(--sw,2) * .6)}
.sun-stage.dragE .sun-earth{cursor:grabbing}
.sun-earthbtn{position:absolute;right:10px;top:10px;z-index:3;display:flex;align-items:center;gap:7px;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);background:rgba(7,11,19,.72);border:1px solid rgba(143,186,255,.5);border-radius:999px;padding:6px 11px;min-height:32px;cursor:pointer}
.sun-earthbtn i{display:block;width:9px;height:9px;border-radius:50%;background:#4f8ff0;box-shadow:0 0 0 1px #d6e6ff}
.sun-tag{position:absolute;left:0;top:0;margin:0;z-index:3;pointer-events:none;font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:#0b1220;background:#bfe3ff;padding:4px 9px;border-radius:999px;white-space:nowrap;opacity:0;transition:opacity .2s ease;will-change:transform}
.sun-tag.on{opacity:1}
.sun-tools{position:absolute;left:10px;bottom:10px;z-index:3;display:flex;gap:8px;align-items:center}
.sun-play{background:rgba(7,11,19,.72);padding:6px 12px;min-height:34px;font-size:10px}
.sun-tone{display:inline-flex;padding:3px;gap:2px;border-radius:999px;border:1px solid rgba(255,170,110,.55);background:rgba(7,11,19,.78);cursor:pointer;font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;min-height:34px;align-items:stretch;touch-action:manipulation}
.sun-tone span{display:flex;align-items:center;padding:0 10px;border-radius:999px;color:var(--ink-dim);transition:background .2s,color .2s}
.sun-tone[aria-pressed="true"] .c{background:linear-gradient(90deg,#b8410f,#f39638);color:#1a0800;font-weight:600}
.sun-tone[aria-pressed="false"] .m{background:#d8dbe2;color:#0b0f18;font-weight:600}
.sun-stage.fin::after{content:"My finished edit";position:absolute;right:10px;bottom:10px;z-index:3;font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#16120a;background:var(--gold);padding:6px 11px;border-radius:999px}
.sun-chips{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.sun-chips .fx-btn{padding:7px 10px;min-height:36px;font-size:10px;letter-spacing:.1em}
.s2-read .fx-num{font-size:clamp(48px,5vw,76px)}
.s2-read .fx-quip{font-size:clamp(19px,1.6vw,23px);min-height:3.5em;margin-top:6px}
#sunHold{touch-action:none;align-self:flex-start}
.s2-scope{margin:0;font-size:13px;color:var(--ink-dim);line-height:1.4}
.s2-scope a{color:var(--gold)}
.s2-honest{margin:0;font-size:11.5px;line-height:1.5;color:var(--ink-faint)}
@media (max-width:899px){
  .s2{--hd:64px;padding:10px 0 8px;align-content:start}
  .wrap.wide.s2-grid{padding:0 16px}
  .s2-grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"head" "stage" "side";grid-template-rows:auto;justify-content:stretch}
  .s2 .kick{display:none}
  .s2 .big{font-size:28px}
  .s2 .sub{font-size:13.5px;margin:6px 0 10px}
  .sun-stage{width:100%}
  .s2-side{gap:9px;margin-top:10px}
  .sun-chips{grid-template-columns:repeat(4,auto);gap:6px;justify-content:start}
  .sun-chips .fx-btn{padding:5px 8px;min-height:34px;font-size:9px;letter-spacing:.06em}
  .s2-read{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:center}
  .s2-read .fx-num{font-size:44px}
  .s2-read .fx-num small{display:block;margin:4px 0 0;font-size:11px}
  .s2-read .fx-quip{font-size:17px;min-height:3.45em;margin:0}
  .s2-scope{font-size:12px}
  .s2-honest{font-size:10.5px}
  .sun-earthbtn{font-size:9px;padding:4px 9px;right:7px;top:7px;min-height:28px}
  .sun-stage .fx-badge{font-size:9px;padding:4px 8px;left:7px;top:7px}
  .sun-tools{left:7px;bottom:7px;gap:6px}
  .sun-play{min-height:30px;padding:4px 10px;font-size:9px}
  .sun-tone{min-height:30px;font-size:9px}
  .sun-tone span{padding:0 8px}
}
@media (max-width:380px){.sun-chips{grid-template-columns:1fr 1fr}}
@media (prefers-reduced-motion:reduce){.sun-world,.sun-tone span,.sun-tag{transition:none}}
