
:root{
  --bg:#071118;
  --panel:#0d1b23;
  --panel-2:#10232d;
  --panel-3:#08141b;
  --text:#f4f6f7;
  --muted:#c5d0d6;
  --line:#ffffff18;
  --line-strong:#ffffff26;
  --orange:#f6903d;
  --max:1200px;
  --shadow:0 20px 60px rgba(0,0,0,.35);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.55 system-ui,sans-serif}
a,button,input,textarea{font:inherit}
img{display:block;max-width:100%}
header{position:sticky;top:0;z-index:20;display:flex;justify-content:space-between;align-items:center;padding:1rem max(5vw,calc((100vw - var(--max))/2));background:#071118e8;border-bottom:1px solid var(--line);backdrop-filter:blur(8px)}
.brand,nav a{color:#fff;text-decoration:none}
.brand{font-weight:700;letter-spacing:.02em}
nav{display:flex;gap:1rem;align-items:center}
nav a{opacity:.9}
nav a:hover{opacity:1;color:var(--orange)}
#menu{display:none;padding:.55rem .8rem;border:1px solid var(--line);border-radius:12px;background:transparent;color:#fff}
section{padding:6rem max(5vw,calc((100vw - var(--max))/2))}
.hero{min-height:88vh;display:grid;grid-template-columns:minmax(320px,1fr) minmax(360px,1.1fr);align-items:center;gap:3rem;background:radial-gradient(circle at 78% 18%,rgba(28,58,74,.8),transparent 33%)}
.hero-copy h1{font-size:clamp(4rem,9vw,8rem);line-height:.86;margin:.45rem 0 1rem}
.hero-copy h1 span,.eyebrow{color:var(--orange)}
.hero-text{font-size:1.2rem;max-width:520px;color:#eef4f7}
.hero-actions{display:flex;gap:1rem;flex-wrap:wrap;margin:1.8rem 0 1rem}
.hero-note{display:flex;align-items:center;gap:.45rem;color:var(--muted);margin:0}
.button,button{padding:.9rem 1.15rem;border:1px solid var(--line-strong);border-radius:14px;background:var(--orange);color:#111;text-decoration:none;cursor:pointer;transition:transform .18s ease, filter .18s ease, background .18s ease}
.button:hover,button:hover{transform:translateY(-1px);filter:brightness(1.03)}
.button.secondary{background:rgba(255,255,255,.04);color:#fff}
.hero-visual{display:flex;flex-direction:column;align-items:flex-end;gap:.7rem}
.compare-card{position:relative;width:min(100%,680px);aspect-ratio:1.18/1;border-radius:34px;overflow:hidden;background:#0b171f;border:1px solid var(--line);box-shadow:var(--shadow)}
.compare-base,.compare-overlay{position:absolute;inset:0}
.compare-base img,.compare-overlay img{width:100%;height:100%;object-fit:cover}
.compare-overlay{clip-path:inset(0 0 0 50%);transition:clip-path .45s ease}
.compare-card.hero-active .compare-overlay{clip-path:inset(0 0 0 0)}
.compare-card.hero-real .compare-overlay{clip-path:inset(0 100% 0 0)}
.compare-card::after{content:"";position:absolute;top:0;bottom:0;left:50%;width:2px;background:rgba(255,255,255,.7);box-shadow:0 0 18px rgba(255,255,255,.45);transform:translateX(-1px);transition:left .45s ease, opacity .35s ease}
.compare-card.hero-active::after{left:100%;opacity:0}
.compare-card.hero-real::after{left:0;opacity:0}
.image-badge{position:absolute;top:18px;z-index:2;padding:.45rem .8rem;border-radius:999px;background:rgba(7,17,24,.78);border:1px solid var(--line);font-size:.78rem;font-weight:700;letter-spacing:.12em}
.image-badge.left{left:18px}
.image-badge.right{right:18px}
.compare-handle{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:3;width:64px;height:64px;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:rgba(40,24,16,.92);color:#fff;display:grid;place-items:center;font-size:1.45rem;box-shadow:0 10px 35px rgba(0,0,0,.35);transition:left .45s ease, transform .18s ease, opacity .35s ease}
.compare-card.hero-active .compare-handle{left:100%;opacity:.92}
.compare-card.hero-real .compare-handle{left:0;opacity:.92}
.compare-caption{margin:0;color:#9fb3be;font-size:.95rem}
.dark{background:#0b171f}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.cards article{padding:1.4rem;border:1px solid var(--line);border-radius:18px;background:var(--panel)}
.timeline{display:grid}.timeline article{display:grid;grid-template-columns:180px 1fr;padding:1rem;border-bottom:1px solid var(--line)}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.gallery figure{margin:0;overflow:hidden;border-radius:18px;border:1px solid var(--line)}.gallery img{width:100%;height:300px;object-fit:cover}.gallery figcaption{padding:.8rem;background:var(--panel)}
.map{position:relative;height:420px;border:1px solid var(--line);border-radius:22px;background:radial-gradient(circle,#193b4b,#071118)}.map button{position:absolute;left:var(--x);top:var(--y)}.map p{position:absolute;left:1rem;bottom:1rem}
form{display:grid;gap:1rem;max-width:700px}input,textarea{padding:.8rem;border:1px solid var(--line-strong);border-radius:12px;background:#071118;color:#fff}textarea{min-height:140px}footer{padding:2rem max(5vw,calc((100vw - var(--max))/2));border-top:1px solid var(--line)}

/* Sprint 41 — The Legacy Trail */
.legacy{position:relative;overflow:hidden;background:radial-gradient(circle at 80% 5%,rgba(246,144,61,.14),transparent 32%),#08141b}
.legacy-intro{max-width:760px;color:var(--muted);font-size:1.05rem}
.legacy-gate{display:grid;grid-template-columns:.9fr 1.1fr;min-height:390px;margin-top:2rem;border:1px solid var(--line);border-radius:24px;overflow:hidden;background:#0d1b23}
.legacy-sky{position:relative;min-height:390px;background:radial-gradient(circle at 48% 45%,rgba(246,144,61,.2),transparent 18%),linear-gradient(145deg,#071118,#173144)}
.legacy-sky:before,.legacy-sky:after{content:"";position:absolute;width:150px;height:260px;bottom:-70px;border-radius:70% 70% 10% 10%;background:linear-gradient(#0d202b,#071118);filter:blur(1px)}
.legacy-sky:before{left:20%;transform:rotate(-8deg)}.legacy-sky:after{right:20%;transform:rotate(8deg)}
.flight-mark{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%);font-size:4rem;color:var(--orange);text-shadow:0 0 35px rgba(246,144,61,.8);animation:legacy-float 3s ease-in-out infinite}
.star{position:absolute;color:#fff8;animation:legacy-pulse 2.4s ease-in-out infinite}.star.one{left:18%;top:18%}.star.two{right:20%;top:22%;animation-delay:.7s}.star.three{right:34%;bottom:24%;animation-delay:1.2s}
.legacy-copy{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:2rem}.legacy-copy h3{margin:.3rem 0;font-size:clamp(1.7rem,4vw,3rem);line-height:1.05}.legacy-copy>p:not(.eyebrow){color:var(--muted)}
.heir-cards{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:1rem}.heir-cards[hidden]{display:none}.heir-cards article{padding:1.4rem;border:1px solid var(--line);border-radius:18px;background:linear-gradient(145deg,#10232d,#0b171f);animation:legacy-rise .7s both}.heir-cards article:nth-child(2){animation-delay:.12s}.heir-cards article>span{font-size:2rem}.heir-cards h3{margin:.3rem 0}.heir-cards p:last-child{color:var(--muted)}
.legacy-whisper{text-align:center;color:#c7a78f;font-style:italic;margin:1.3rem 0 0}
.final-teaser{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:1.2rem;padding:2rem max(1.2rem,calc((100vw - var(--max))/2));background:linear-gradient(90deg,#0c1d27,#172f3c);border-top:1px solid var(--line)}.final-teaser>span{font-size:2.6rem}.final-teaser h2,.final-teaser p{margin:.15rem 0}.final-teaser p:last-child{color:var(--muted)}

@keyframes legacy-float{50%{transform:translate(-50%,-62%) rotate(-4deg)}}
@keyframes legacy-pulse{50%{opacity:.3;transform:scale(.8)}}
@keyframes legacy-rise{from{opacity:0;transform:translateY(18px)}}

@media(max-width:980px){
  .hero{grid-template-columns:1fr;min-height:auto;padding-top:4rem}
  .hero-visual{align-items:stretch}
  .compare-card{width:100%;max-width:720px}
}
@media(max-width:800px){
  nav{display:none;position:absolute;top:64px;left:1rem;right:1rem;padding:1rem;background:#071118;border:1px solid var(--line)}
  nav.open{display:grid}
  #menu{display:block}
  .cards,.gallery,.heir-cards{grid-template-columns:1fr}
  .timeline article{grid-template-columns:1fr}
  .legacy-gate{grid-template-columns:1fr}
  .legacy-sky{min-height:280px}
  .final-teaser{grid-template-columns:auto 1fr}
  .final-teaser .button{grid-column:1/-1}
  .hero-copy h1{font-size:clamp(3rem,16vw,5.4rem)}
  .compare-card{aspect-ratio:1/1.08;border-radius:26px}
  .compare-handle{width:58px;height:58px}
}

/* Sprint 43 — public polish, power gallery, heirs */
header{gap:1rem}.os-link{margin-left:.4rem;padding:.55rem .85rem;border:1px solid rgba(246,144,61,.45);border-radius:999px;color:#f8a660;text-decoration:none;font-size:.78rem;white-space:nowrap}.os-link:hover{background:rgba(246,144,61,.1)}
.hero{grid-template-columns:minmax(540px,.96fr) minmax(540px,1.04fr);gap:2rem}.hero-copy{position:relative;z-index:3;min-width:0}.hero-copy h1{font-size:clamp(4rem,7vw,7.1rem);letter-spacing:-.055em;line-height:.82}.superdog-word{display:block;white-space:nowrap}.hero-visual{position:relative;z-index:1}.hero-note{color:#bfd0d8;font-style:italic}.hero-note::first-letter{color:var(--orange)}
.power-gallery-section{background:radial-gradient(circle at 80% 10%,rgba(246,144,61,.09),transparent 30%)}.gallery-intro{max-width:720px;color:var(--muted)}.power-gallery{display:grid;grid-template-columns:1.35fr 1fr;grid-template-rows:repeat(2,minmax(270px,1fr));gap:1rem;margin-top:2rem}.gallery-card{position:relative;min-height:270px;padding:0;overflow:hidden;border:1px solid var(--line);border-radius:22px;background:#0d1b23;color:#fff;text-align:left}.gallery-card-large{grid-row:span 2}.gallery-card img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}.gallery-card:hover img{transform:scale(1.025)}.gallery-card span{position:absolute;left:0;right:0;bottom:0;display:grid;gap:.15rem;padding:1.2rem;background:linear-gradient(transparent,rgba(3,10,15,.92))}.gallery-card b{font-size:1.15rem}.gallery-card small{color:#d2dde2}.gallery-dialog{width:min(94vw,1100px);padding:0;border:1px solid var(--line);border-radius:24px;background:#071118;color:#fff}.gallery-dialog::backdrop{background:rgba(0,0,0,.86);backdrop-filter:blur(6px)}.gallery-dialog img{width:100%;max-height:78vh;object-fit:contain;background:#03080b}.gallery-dialog h3{margin:0;padding:1rem 1.2rem}.gallery-dialog button{position:absolute;right:1rem;top:1rem;z-index:2;width:44px;height:44px;padding:0;border-radius:50%;background:rgba(7,17,24,.88);color:#fff}.heir-icon{width:72px;height:72px;margin-bottom:.8rem;filter:drop-shadow(0 12px 20px rgba(0,0,0,.25))}.heir-card{position:relative;overflow:hidden}.heir-card::after{content:"";position:absolute;width:110px;height:110px;right:-40px;top:-40px;border-radius:50%;background:rgba(246,144,61,.06)}
@media(max-width:1240px){.hero{grid-template-columns:1fr}.hero-copy h1{font-size:clamp(4rem,12vw,7.5rem)}.hero-visual{max-width:760px}.superdog-word{white-space:normal}.os-link{margin-left:auto}}
@media(max-width:800px){header{flex-wrap:wrap}.os-link{order:2}.power-gallery{grid-template-columns:1fr;grid-template-rows:auto}.gallery-card-large{grid-row:auto}.gallery-card{min-height:300px}}

/* Sprint 44 — manifest-driven gallery */
.section-heading-row{display:flex;justify-content:space-between;align-items:end;gap:1.2rem;margin-bottom:1.4rem}
.section-heading-row h2{margin:.35rem 0}
.gallery-all-link{white-space:nowrap}
.gallery-loading{grid-column:1/-1;padding:2rem;text-align:center;color:var(--muted)}
.gallery-dialog p{margin:.3rem 0 0;color:var(--muted)}
.full-gallery-hero{padding-bottom:3rem;background:radial-gradient(circle at 78% 25%,rgba(246,144,61,.12),transparent 30%)}
.full-gallery-hero h1{font-size:clamp(3.8rem,10vw,8rem);line-height:.82;margin:.5rem 0 1rem}
.full-gallery-hero h1 span{color:var(--orange)}
.full-gallery-hero>p:not(.eyebrow){max-width:680px;color:var(--muted);font-size:1.05rem}
.full-gallery-section{padding-top:2rem}
.gallery-filter-bar{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1rem}
.full-gallery-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.full-gallery-card{position:relative;min-height:300px;padding:0;overflow:hidden;border:1px solid var(--line);border-radius:20px;background:var(--panel);color:#fff;text-align:left}
.full-gallery-card img{width:100%;height:100%;min-height:300px;object-fit:cover;transition:transform .35s ease}
.full-gallery-card:hover img{transform:scale(1.025)}
.full-gallery-card span{position:absolute;left:0;right:0;bottom:0;display:grid;gap:.2rem;padding:1rem;background:linear-gradient(transparent,rgba(4,12,17,.95))}
.full-gallery-card small{color:#d5dfe4}
.gallery-empty{padding:3rem;text-align:center;border:1px dashed var(--line-strong);border-radius:20px;color:var(--muted)}
@media(max-width:900px){.full-gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.section-heading-row{align-items:flex-start;flex-direction:column}.full-gallery-grid{grid-template-columns:1fr}.gallery-all-link{width:100%;text-align:center}}

/* Sprint 45 — public polish */
.compare-handle:hover,
.compare-handle:focus-visible{
  transform:translate(-50%,-50%);
  filter:brightness(1.04);
}
.compare-card.hero-active .compare-handle:hover,
.compare-card.hero-active .compare-handle:focus-visible{
  transform:translate(-50%,-50%);
}
.compare-card.hero-real .compare-handle:hover,
.compare-card.hero-real .compare-handle:focus-visible{
  transform:translate(-50%,-50%);
}

/* Sprint 46 — heir pages */
.heir-hero{min-height:78vh;display:grid;grid-template-columns:1fr .8fr;gap:3rem;align-items:center;background:radial-gradient(circle at 78% 35%,rgba(246,144,61,.17),transparent 30%)}
.heir-hero.aquadog{background:radial-gradient(circle at 78% 35%,rgba(80,180,255,.18),transparent 32%)}
.heir-hero h1{font-size:clamp(4rem,10vw,8rem);line-height:.82;margin:.4rem 0 1rem}
.heir-hero h1 span{color:var(--orange)}.heir-hero.aquadog h1 span{color:#6ed4ff}
.heir-lead{max-width:680px;color:var(--muted);font-size:1.15rem}
.heir-emblem{position:relative;display:grid;place-items:center;aspect-ratio:1;border:1px solid var(--line);border-radius:50%;background:radial-gradient(circle,#173344,#08141b 65%);box-shadow:var(--shadow)}
.heir-emblem span{font-size:clamp(7rem,18vw,13rem);filter:drop-shadow(0 18px 30px rgba(0,0,0,.35))}
.heir-emblem i{position:absolute;inset:10%;border:1px solid rgba(255,255,255,.08);border-radius:50%}
.heir-chapter h2,.heir-mystery h2{font-size:clamp(2.2rem,6vw,4.8rem);line-height:1;margin:.4rem 0 1.5rem}
.heir-mystery{text-align:center}.heir-mystery>p{color:var(--muted)}
@media(max-width:850px){.heir-hero{grid-template-columns:1fr}.heir-emblem{max-width:480px;width:100%;margin:auto}}

/* Sprint 47 — public dropdown + build visibility */
.nav-menu-group{position:relative;display:flex;align-items:center}
.nav-menu-group>.nav-menu-toggle{padding:.2rem .35rem;border:0;background:transparent;color:#fff}
.nav-submenu{display:none;position:absolute;top:calc(100% + .6rem);left:0;min-width:180px;padding:.45rem;border:1px solid var(--line);border-radius:12px;background:#071118;box-shadow:var(--shadow)}
.nav-menu-group.open .nav-submenu,.nav-menu-group:hover .nav-submenu{display:grid}
.nav-submenu a{padding:.55rem .7rem;border-radius:8px}.nav-submenu a:hover{background:#ffffff0b}
.public-build{margin-left:auto;color:#6f858f;font-size:.68rem}
@media(max-width:800px){.nav-menu-group{display:grid}.nav-submenu{position:static;box-shadow:none;margin:.25rem 0 0 .6rem}.nav-menu-toggle{position:absolute;right:.4rem;top:.2rem}}

/* Sprint 51 — public legacy interaction repair */
.nav-menu-group{padding-bottom:.65rem;margin-bottom:-.65rem}
.nav-menu-group::after{content:"";position:absolute;left:0;right:0;top:100%;height:.8rem}
.nav-submenu{top:100%;margin-top:.45rem}
.nav-menu-group:hover .nav-submenu,
.nav-menu-group:focus-within .nav-submenu,
.nav-menu-group.open .nav-submenu{display:grid}
.heir-cards .heir-card{display:block;padding:1.4rem;border:1px solid var(--line);border-radius:18px;background:linear-gradient(145deg,#10232d,#0b171f);color:var(--text);text-decoration:none;animation:legacy-rise .7s both;transition:transform .18s ease,border-color .18s ease}
.heir-cards .heir-card:hover,.heir-cards .heir-card:focus-visible{transform:translateY(-3px);border-color:rgba(246,144,61,.5);outline:none}
.heir-card-link{display:block;margin-top:.9rem;color:var(--orange);font-weight:700}

/* Sprint 53 — cinematic Story Mode */
.story-mode-dialog{width:min(94vw,920px);padding:0;border:1px solid var(--line);border-radius:28px;background:#071118;color:#fff}
.story-mode-dialog::backdrop{background:rgba(0,0,0,.9);backdrop-filter:blur(10px)}
.story-mode-shell{position:relative;min-height:560px;display:flex;flex-direction:column;justify-content:center;padding:clamp(2rem,7vw,5rem);overflow:hidden;background:radial-gradient(circle at 75% 20%,rgba(246,144,61,.16),transparent 35%),linear-gradient(145deg,#071118,#102734)}
.story-mode-shell::before{content:"🐾";position:absolute;right:-2rem;bottom:-5rem;font-size:18rem;opacity:.035;transform:rotate(-18deg)}
.story-mode-close{position:absolute;right:1rem;top:1rem;width:46px;height:46px;border-radius:50%;background:#0d1b23;color:#fff}
.story-mode-progress{display:flex;gap:.4rem;margin-bottom:2rem}.story-mode-progress i{width:38px;height:4px;border-radius:4px;background:#ffffff20}.story-mode-progress i.active{background:var(--orange)}
.story-mode-chapter{position:relative;max-width:720px}.story-mode-chapter h2{font-size:clamp(2.8rem,8vw,6rem);line-height:.9;margin:.5rem 0 1.2rem}.story-mode-chapter>p:last-child{color:#d1dce1;font-size:1.15rem;max-width:650px}
.story-mode-controls{position:relative;display:flex;gap:.7rem;margin-top:2rem}

/* SUPERDOG Social Footer */
.public-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1.25rem;
  padding:2rem max(5vw,calc((100vw - var(--max))/2));
  border-top:1px solid var(--line);
}

.public-footer-copy{
  display:grid;
  gap:.25rem;
}

.social-links{
  display:flex;
  align-items:center;
  gap:.65rem;
}

.social-links a{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  min-height:44px;
  padding:.55rem .8rem;
  border:1px solid var(--line);
  border-radius:999px;
  color:inherit;
  text-decoration:none;
  transition:
    transform .18s ease,
    border-color .18s ease,
    background-color .18s ease;
}

.social-links a:hover,
.social-links a:focus-visible{
  transform:translateY(-2px);
  border-color:var(--line-strong);
  background:rgba(255,255,255,.06);
}

.social-links img{
  display:block;
  width:28px;
  height:28px;
  object-fit:contain;
}

.social-links span{
  font-size:.82rem;
  font-weight:700;
}

@media(max-width:700px){
  .public-footer{
    align-items:flex-start;
    flex-direction:column;
  }

  .social-links{
    width:100%;
    flex-wrap:wrap;
  }
}

@media(prefers-reduced-motion:reduce){
  .social-links a{
    transition:none;
  }

  .social-links a:hover,
  .social-links a:focus-visible{
    transform:none;
  }
}


/* Public Build 0.55.0 */
.os-link,.admin-entry{font-size:.78rem;opacity:.62;text-decoration:none;border:1px solid rgba(255,255,255,.14);padding:.45rem .7rem;border-radius:999px;transition:opacity .2s ease,border-color .2s ease}
.os-link:hover,.os-link:focus-visible,.admin-entry:hover,.admin-entry:focus-visible{opacity:1;border-color:rgba(255,216,75,.65)}
.skip-link{position:fixed;left:1rem;top:-5rem;z-index:9999;background:#ffd84b;color:#071016;padding:.7rem 1rem;border-radius:.5rem;font-weight:800}.skip-link:focus{top:1rem}
.dynamic-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.dynamic-grid article{min-height:100%}.place-detail{min-height:4rem;margin-top:1rem}.portal-note{font-size:.78rem;opacity:.7}.story-editor-grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
@media(max-width:800px){.dynamic-grid{grid-template-columns:1fr}}
