:root {
  color-scheme: dark;
  --space:#05080d;
  --space-soft:#0a1018;
  --surface:#101923;
  --surface-raised:#151f2b;
  --surface-glass:rgba(13,21,30,.88);
  --ink:#f3f6f7;
  --muted:#9fadb8;
  --line:rgba(190,215,226,.17);
  --line-strong:rgba(190,215,226,.32);
  --lunar:#dfe6e7;
  --cyan:#6ce4ed;
  --cyan-soft:rgba(108,228,237,.13);
  --amber:#e8bd6d;
  --max:1480px;
  --radius:16px;
  --shadow:0 24px 80px rgba(0,0,0,.28);
}

.lb-site {
  margin:0;
  padding:0;
  min-height:100%;
  background:
    radial-gradient(circle at 14% 4%, rgba(93,139,164,.12), transparent 30rem),
    radial-gradient(circle at 88% 28%, rgba(132,113,82,.08), transparent 26rem),
    var(--space);
  color:var(--ink);
  font:15px/1.58 Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.lb-site *, .lb-site *::before, .lb-site *::after { box-sizing:border-box; }
.lb-site a { color:var(--cyan); text-underline-offset:3px; }
.lb-site a:hover { color:#b9f7fb; }

.project-header {
  position:relative;
  display:block;
  isolation:isolate;
  width:100%;
  min-height:166px;
  padding:0;
  margin:0;
  overflow:hidden;
  border:0;
  border-bottom:1px solid var(--line);
  background:
    radial-gradient(circle at 7% 25%, rgba(255,255,255,.72) 0 1px, transparent 1.5px),
    radial-gradient(circle at 31% 17%, rgba(255,255,255,.45) 0 1px, transparent 1.4px),
    radial-gradient(circle at 65% 23%, rgba(255,255,255,.58) 0 1px, transparent 1.5px),
    radial-gradient(circle at 84% 15%, rgba(255,255,255,.42) 0 1px, transparent 1.4px),
    linear-gradient(115deg, #07101a 0%, #0c1722 54%, #0b1119 100%);
  box-shadow:0 16px 45px rgba(0,0,0,.22);
}

.project-header::after {
  content:"";
  position:absolute;
  z-index:-1;
  width:560px;
  height:560px;
  right:-190px;
  top:68px;
  border-radius:50%;
  background:
    radial-gradient(circle at 36% 31%, rgba(20,27,31,.22) 0 4%, transparent 4.6%),
    radial-gradient(circle at 61% 24%, rgba(20,27,31,.17) 0 6%, transparent 6.6%),
    radial-gradient(circle at 51% 54%, rgba(20,27,31,.16) 0 9%, transparent 9.6%),
    radial-gradient(circle at 72% 67%, rgba(20,27,31,.14) 0 5%, transparent 5.6%),
    linear-gradient(145deg, #edf0eb 0%, #afb7b5 43%, #6d7778 68%, #202a30 100%);
  opacity:.28;
  box-shadow:-34px -12px 90px rgba(180,222,231,.12);
}

.project-header__inner {
  width:min(var(--max), calc(100% - 40px));
  min-height:165px;
  margin:auto;
  display:grid;
  grid-template-columns:minmax(290px, 1fr) auto;
  grid-template-rows:1fr auto;
  align-items:center;
  gap:16px 32px;
  padding:24px 0 17px;
}

.project-identity {
  display:flex;
  align-items:center;
  gap:15px;
  align-self:center;
  color:var(--ink) !important;
  text-decoration:none;
  width:max-content;
  max-width:100%;
}

.project-moon {
  position:relative;
  flex:0 0 52px;
  width:52px;
  height:52px;
  border-radius:50%;
  background:
    radial-gradient(circle at 31% 32%, rgba(58,68,71,.42) 0 7%, transparent 8%),
    radial-gradient(circle at 67% 28%, rgba(58,68,71,.26) 0 9%, transparent 10%),
    radial-gradient(circle at 57% 66%, rgba(58,68,71,.28) 0 12%, transparent 13%),
    linear-gradient(135deg, #f0f2ee 0%, #aeb7b7 55%, #56636a 100%);
  box-shadow:0 0 0 1px rgba(255,255,255,.22), 0 0 38px rgba(164,217,225,.18);
}

.project-moon::after {
  content:"";
  position:absolute;
  inset:-8px;
  border:1px solid rgba(108,228,237,.28);
  border-left-color:transparent;
  border-radius:50%;
  transform:rotate(-27deg);
}

.project-copy { min-width:0; }
.project-kicker {
  display:block;
  margin-bottom:2px;
  color:var(--cyan);
  font-size:10px;
  font-weight:700;
  letter-spacing:.2em;
  text-transform:uppercase;
}
.project-name {
  display:block;
  font:600 clamp(21px, 2.1vw, 30px)/1.1 ui-serif, Georgia, serif;
  letter-spacing:-.02em;
}
.project-byline {
  display:block;
  margin-top:4px;
  color:var(--muted);
  font-size:12px;
  letter-spacing:.02em;
}

.project-nav {
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  align-self:end;
  gap:5px;
}
.project-nav a {
  position:relative;
  display:block;
  padding:8px 12px;
  border:1px solid transparent;
  border-radius:999px;
  color:#c2ccd2;
  font-size:12px;
  font-weight:600;
  letter-spacing:.03em;
  text-decoration:none;
  transition:.18s ease;
}
.project-nav a:hover {
  border-color:var(--line-strong);
  background:rgba(255,255,255,.04);
  color:var(--ink);
}
.project-nav a[aria-current="page"] {
  border-color:rgba(108,228,237,.42);
  background:var(--cyan-soft);
  color:#c7f8fb;
}
.project-coordinate {
  grid-column:1;
  align-self:end;
  color:#71818d;
  font:10px/1.2 ui-monospace, SFMono-Regular, Menlo, monospace;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.page-intro {
  width:min(var(--max), calc(100% - 28px));
  margin:24px auto 12px;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:22px;
}
.page-intro__copy { max-width:820px; }
.page-intro .eyebrow, .report-eyebrow {
  margin:0 0 7px;
  color:var(--cyan);
  font-size:10px;
  font-weight:700;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.page-intro h1 {
  margin:0;
  color:var(--ink);
  font:500 clamp(25px, 3vw, 40px)/1.1 ui-serif, Georgia, serif;
  letter-spacing:-.025em;
}
.page-intro p { margin:8px 0 0; color:var(--muted); max-width:760px; }
.page-intro .badge {
  flex:0 0 auto;
  color:var(--amber);
  border:1px solid rgba(232,189,109,.42);
  background:rgba(232,189,109,.07);
  border-radius:999px;
  padding:7px 11px;
  font-size:11px;
  white-space:nowrap;
}

.known-issue {
  width:min(var(--max), calc(100% - 28px));
  margin:0 auto 16px;
  padding:13px 16px;
  border:1px solid rgba(232,189,109,.48);
  border-left:3px solid var(--amber);
  border-radius:11px;
  background:rgba(74,52,20,.28);
  color:#d9c9a8;
  font-size:13px;
  box-shadow:0 16px 42px rgba(0,0,0,.18);
}
.known-issue strong { color:#ffd995; }
.known-issue code { color:#ffe7b9; }

.lb-site button, .lb-site select {
  border:1px solid var(--line-strong);
  border-radius:9px;
  background:#131d27;
  color:var(--ink);
  transition:border-color .16s ease, background .16s ease, transform .16s ease;
}
.lb-site button:hover, .lb-site select:hover {
  border-color:rgba(108,228,237,.65);
  background:#192633;
}
.lb-site button:active { transform:translateY(1px); }
.lb-site input[type="range"] { accent-color:var(--cyan); }

.lb-site .stage-card, .lb-site .side, .lb-site .below,
.lb-site .viewport, .lb-site .panel, .lb-site main > section, .lb-site main > aside {
  border-color:var(--line);
  box-shadow:var(--shadow);
}
.lb-site .workspace { width:min(var(--max), calc(100% - 28px)); }
.lb-evidence .workspace { padding:0; margin:0 auto 16px; }
.lb-evidence .below { width:min(var(--max), calc(100% - 28px)); margin:0 auto 26px; }
.lb-evidence .side { max-height:min(78vh, 860px); }
.lb-metrology main { width:min(var(--max), calc(100% - 28px)); padding:0; margin:0 auto 28px; }
.lb-metrology main > section { padding:10px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); }
.lb-metrology aside { border-radius:var(--radius); background:var(--surface); }
.lb-metrology .stage { width:min(76vh, 100%); margin:8px auto 0; border-radius:10px; overflow:hidden; }
.lb-hypothesis main { width:min(1600px, calc(100% - 28px)); max-width:none; }
.lb-hypothesis .workspace { width:100%; }

.report-shell { width:min(1240px, calc(100% - 32px)); margin:0 auto; }
.report-hero {
  display:grid;
  grid-template-columns:minmax(0, .95fr) minmax(420px, 1.05fr);
  min-height:590px;
  margin:34px 0 18px;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:22px;
  background:var(--surface);
  box-shadow:var(--shadow);
}
.report-hero__copy { padding:clamp(34px, 5vw, 70px); align-self:center; }
.report-hero h1 {
  margin:0;
  max-width:12ch;
  font:500 clamp(42px, 5.7vw, 76px)/.99 ui-serif, Georgia, serif;
  letter-spacing:-.045em;
}
.report-hero__lede { max-width:630px; margin:24px 0; color:#bcc7ce; font-size:17px; }
.report-byline { display:flex; align-items:center; gap:10px; color:var(--muted); font-size:12px; }
.report-byline::before { content:""; width:28px; height:1px; background:var(--cyan); }
.report-hero__image { position:relative; min-height:460px; overflow:hidden; background:#080b0e; }
.report-hero__image img { width:100%; height:100%; object-fit:cover; object-position:52% 56%; filter:contrast(1.04) brightness(.84); }
.report-hero__image::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg, var(--surface), transparent 20%), linear-gradient(0deg, rgba(2,5,8,.78), transparent 45%); }
.report-hero__caption { position:absolute; z-index:1; left:24px; right:24px; bottom:21px; color:#c8d1d5; font-size:11px; }

.stat-strip { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; margin:0 0 18px; overflow:hidden; border:1px solid var(--line); border-radius:var(--radius); background:var(--line); }
.stat { padding:23px; background:var(--surface); }
.stat strong { display:block; color:var(--ink); font:500 28px/1 ui-serif, Georgia, serif; }
.stat span { display:block; margin-top:7px; color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.08em; }

.report-section { padding:clamp(28px, 5vw, 58px); margin:18px 0; border:1px solid var(--line); border-radius:var(--radius); background:rgba(16,25,35,.78); }
.report-section h2 { margin:0 0 18px; font:500 clamp(27px,3vw,40px)/1.12 ui-serif, Georgia, serif; letter-spacing:-.025em; }
.report-section h3 { margin:25px 0 8px; font-size:15px; }
.report-section p { color:#b4c0c7; }
.report-section p:first-of-type { margin-top:0; }
.report-section strong { color:var(--ink); }
.report-section code { color:#d9f5f7; overflow-wrap:anywhere; }
.report-grid { display:grid; grid-template-columns:1fr 1fr; gap:28px; }
.finding { padding-left:17px; border-left:2px solid var(--cyan); }
.boundary { padding-left:17px; border-left:2px solid var(--amber); }
.evidence-table { width:100%; border-collapse:collapse; font-size:13px; }
.evidence-table th, .evidence-table td { padding:11px 10px; border-bottom:1px solid var(--line); text-align:left; }
.evidence-table th { color:#82919c; font-size:10px; letter-spacing:.08em; text-transform:uppercase; }
.evidence-table td { color:#c4cdd2; }
.evidence-table tr:last-child td { border-bottom:0; }

.experience-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin:18px 0; }
.experience-card { display:flex; min-height:430px; flex-direction:column; overflow:hidden; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); color:var(--ink) !important; text-decoration:none; box-shadow:var(--shadow); transition:transform .2s ease, border-color .2s ease; }
.experience-card:hover { transform:translateY(-3px); border-color:rgba(108,228,237,.46); }
.experience-card__image { height:260px; overflow:hidden; background:#05070a; }
.experience-card__image img { width:100%; height:100%; object-fit:cover; filter:saturate(.35) contrast(1.04); transition:transform .4s ease; }
.experience-card:hover img { transform:scale(1.025); }
.experience-card:nth-child(1) img { object-position:50% 46%; }
.experience-card:nth-child(2) img { object-position:50% 60%; }
.experience-card__copy { padding:22px; }
.experience-card__copy span { color:var(--cyan); font-size:10px; letter-spacing:.14em; text-transform:uppercase; }
.experience-card__copy h3 { margin:6px 0 8px; font:500 23px/1.1 ui-serif, Georgia, serif; }
.experience-card__copy p { margin:0; color:var(--muted); font-size:13px; }

.method-list { counter-reset:step; display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin:24px 0 0; padding:0; list-style:none; }
.method-list li { counter-increment:step; min-height:140px; padding:18px; border:1px solid var(--line); border-radius:12px; background:rgba(255,255,255,.018); color:#aebbc3; }
.method-list li::before { content:"0" counter(step); display:block; margin-bottom:14px; color:var(--cyan); font:11px ui-monospace, monospace; }
.source-links { display:flex; flex-wrap:wrap; gap:8px; margin-top:24px; }
.source-links a { padding:8px 11px; border:1px solid var(--line); border-radius:999px; text-decoration:none; font-size:12px; }
.site-footer { display:flex; justify-content:space-between; gap:20px; padding:30px 4px 48px; color:#71808b; font-size:11px; }

@media (max-width:980px) {
  .project-header__inner { grid-template-columns:1fr; grid-template-rows:auto auto auto; padding-top:20px; }
  .project-nav { justify-content:flex-start; align-self:auto; }
  .project-coordinate { grid-row:3; }
  .project-header::after { right:-300px; }
  .page-intro { align-items:flex-start; flex-direction:column; }
  .report-hero { grid-template-columns:1fr; }
  .report-hero__copy { grid-row:1; }
  .report-hero__image { min-height:520px; grid-row:2; }
  .report-hero__image::after { background:linear-gradient(180deg, var(--surface), transparent 23%), linear-gradient(0deg, rgba(2,5,8,.62), transparent 45%); }
  .experience-grid { grid-template-columns:1fr; }
  .experience-card { min-height:0; display:grid; grid-template-columns:minmax(220px,.8fr) 1fr; }
  .experience-card__image { height:100%; min-height:270px; }
  .stat-strip { grid-template-columns:1fr 1fr; }
  .report-grid, .method-list { grid-template-columns:1fr; }
}

@media (max-width:620px) {
  .project-header__inner { width:min(100% - 24px, var(--max)); }
  .project-moon { width:43px; height:43px; flex-basis:43px; }
  .project-nav { gap:2px; }
  .project-nav a { padding:7px 8px; font-size:11px; }
  .project-coordinate { display:none; }
  .page-intro { width:calc(100% - 20px); margin-top:18px; }
  .known-issue { width:calc(100% - 20px); }
  .lb-site .workspace, .lb-evidence .below, .lb-metrology main, .lb-hypothesis main { width:calc(100% - 20px); }
  .report-shell { width:calc(100% - 20px); }
  .report-hero { margin-top:20px; }
  .report-hero__copy { padding:28px 22px; }
  .report-hero h1 { font-size:40px; }
  .report-hero__image { min-height:390px; }
  .stat-strip { grid-template-columns:1fr 1fr; }
  .stat { padding:17px; }
  .stat strong { font-size:23px; }
  .report-section { padding:26px 21px; }
  .experience-card { display:flex; }
  .experience-card__image { height:240px; min-height:0; }
  .evidence-table { display:block; overflow-x:auto; }
  .site-footer { flex-direction:column; }
}
