/* Homepage platform layer explorer (section 02). Scoped to .platform-section; shared rebuild.css is unchanged. */
.platform-section{border-top:1px solid var(--line);overflow-x:clip}
.platform-head{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(40px,6vw,96px);align-items:end}
.platform-head h2{font-size:clamp(48px,4.9vw,74px);line-height:1.03;margin-top:24px}
.platform-intro p{font-size:16px;line-height:1.7;color:var(--muted);max-width:460px}
.platform-intro .text-link{margin-top:22px}

.layer-explorer{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"stage tabs" "stage panels";grid-template-rows:auto 1fr;column-gap:clamp(40px,6vw,96px);row-gap:30px;margin-top:64px;align-items:start}

/* Tabs */
.layer-tabs{grid-area:tabs;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line)}
.layer-tab{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:18px 14px 2px 0;border:0;background:transparent;text-align:left;color:var(--muted);transition:color .2s}
.layer-tab::before{content:'';position:absolute;left:0;right:14px;top:-1px;height:2px;background:var(--purple);transform:scaleX(0);transform-origin:left;transition:transform .45s cubic-bezier(.22,.7,.23,1)}
.layer-tab:hover,.layer-tab[aria-selected=true]{color:var(--ink)}
.layer-tab[aria-selected=true]::before{transform:scaleX(1)}
.layer-tab:focus-visible{outline:2px solid var(--purple);outline-offset:4px}
.tab-index{font-family:var(--mono);font-size:10px;letter-spacing:.08em;transition:color .2s}
.layer-tab[aria-selected=true] .tab-index{color:var(--purple)}
.tab-name{font-size:16px;font-weight:500;line-height:1.25;letter-spacing:-.01em}
.tab-role{font-family:var(--mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}

/* 3D stack. Orthographic: no perspective, so lift maps to a fixed screen offset. */
.layer-stage{grid-area:stage;align-self:center;min-width:0;container-type:inline-size}
.layer-scene{--w:min(440px,72cqi);--h:calc(var(--w) * .72);--g:calc(var(--w) * .36);--f:calc(var(--w) * .3);position:relative;height:calc(var(--w) * 1.74)}
.layer-scene::before{content:'';position:absolute;inset:-2% -6%;background-image:radial-gradient(circle,#cfcfcf 1px,transparent 1.4px);background-size:18px 18px;-webkit-mask-image:radial-gradient(ellipse 58% 52% at 50% 56%,#000 25%,transparent 100%);mask-image:radial-gradient(ellipse 58% 52% at 50% 56%,#000 25%,transparent 100%);pointer-events:none}
.layer-stack{position:absolute;left:50%;top:calc(var(--w) * 1.13);width:0;height:0;transform-style:preserve-3d;transform:rotateX(55deg) rotateZ(-30deg)}
.layer-floor,.slab{position:absolute;left:calc(var(--w) / -2);top:calc(var(--h) / -2);width:var(--w);height:var(--h);border-radius:10px}
.layer-floor{border:1px dashed #b5b5b5;background:radial-gradient(ellipse at center,#6b10d612,transparent 70%);transform:translateZ(calc(var(--f) * -1))}
.feed-post{position:absolute;width:1px;height:var(--f);transform-origin:0 0;transform:translateZ(calc(var(--f) * -1)) rotateX(90deg);background:repeating-linear-gradient(to bottom,#a3a3a3 0 3px,transparent 3px 7px)}
.feed-dot{position:absolute;width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:50%;background:var(--purple);opacity:0;animation:feed-rise 2.6s cubic-bezier(.45,0,.55,1) infinite;animation-delay:var(--delay,0s)}
.corner-tl{left:calc(var(--w) / -2);top:calc(var(--h) / -2)}.corner-tr{left:calc(var(--w) / 2);top:calc(var(--h) / -2)}
.corner-bl{left:calc(var(--w) / -2);top:calc(var(--h) / 2)}.corner-br{left:calc(var(--w) / 2);top:calc(var(--h) / 2)}
@keyframes feed-rise{0%{transform:translateZ(calc(var(--f) * -1));opacity:0}18%{opacity:1}82%{opacity:1}100%{transform:translateZ(-2px);opacity:0}}

.slab{--z:0px;--lift:0px;--push:0px;--hover:0px;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;padding:calc(var(--w) * .07) calc(var(--w) * .08);cursor:pointer;transform:translateZ(calc(var(--z) + var(--lift) + var(--push) + var(--hover)));transition:transform .7s cubic-bezier(.22,.7,.23,1),outline-color .3s,box-shadow .4s;outline:1.5px solid transparent;outline-offset:8px}
.slab-os{background-color:#f2f2f2;background-image:linear-gradient(#e2e2e2 1px,transparent 1px),linear-gradient(90deg,#e2e2e2 1px,transparent 1px);background-size:calc(var(--w) / 10) calc(var(--w) / 10);background-position:-1px -1px;border:1px solid #c9c9c9;color:var(--ink);box-shadow:-6px 10px 0 #b9b9b9,-16px 28px 40px -14px #11111133}
.slab-intelligence{--z:var(--g);background:linear-gradient(135deg,#8236f0 0%,var(--purple) 42%,#4f0aa6 100%);border:1px solid #5a0cbb;color:#ffffff;box-shadow:-6px 10px 0 var(--purple-dark),-16px 28px 40px -14px #45147766}
.slab-ai{--z:calc(var(--g) * 2);background:#ffffff;border:1px solid #cfcfcf;color:var(--ink);box-shadow:-6px 10px 0 #d9d9d9,-16px 28px 40px -14px #11111124}
.slab:hover{--hover:5px}
.layer-explorer[data-layer=ai] .slab-ai,.layer-explorer[data-layer=intelligence] .slab-intelligence,.layer-explorer[data-layer=os] .slab-os{--lift:calc(var(--w) * .05);outline-color:var(--purple)}
.layer-explorer[data-layer=intelligence] .slab-ai,.layer-explorer[data-layer=os] .slab-ai,.layer-explorer[data-layer=os] .slab-intelligence{--push:calc(var(--w) * .22)}
.layer-explorer[data-intro=collapsed] .slab{--lift:0px;--push:0px}
.layer-explorer[data-intro=collapsed] .slab-intelligence{--z:calc(var(--w) * .05)}
.layer-explorer[data-intro=collapsed] .slab-ai{--z:calc(var(--w) * .1)}
.slab-mark{position:absolute;top:calc(var(--w) * .065);right:calc(var(--w) * .07);width:calc(var(--w) * .085);height:calc(var(--w) * .085);display:grid;place-items:center;font-size:calc(var(--w) * .08);line-height:1}
.slab-mark svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.3}
.slab-tag{font-family:var(--mono);font-size:calc(var(--w) * .03);letter-spacing:.12em;text-transform:uppercase;opacity:.75}
.slab strong{font-size:calc(var(--w) * .083);font-weight:500;letter-spacing:-.035em;line-height:1.1;margin-top:calc(var(--w) * .022);white-space:nowrap}
.slab-meta{font-size:calc(var(--w) * .033);letter-spacing:.01em;margin-top:calc(var(--w) * .025);opacity:.8;white-space:nowrap}
.layer-explorer:not([data-layer=ai]) .slab-ai>*,.layer-explorer:not([data-layer=os]) .slab-os>*{opacity:.62}
.layer-explorer:not([data-layer=ai]) .slab-ai>.slab-tag,.layer-explorer:not([data-layer=os]) .slab-os>.slab-tag{opacity:.5}

.source-row{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:7px;margin-top:4px}
.source-row .micro{margin-right:5px}
.source-row span:not(.micro){font-family:var(--mono);font-size:10px;letter-spacing:.05em;text-transform:uppercase;line-height:1;background:var(--paper);border:1px solid var(--line);border-radius:3px;padding:7px 9px;transition:border-color .3s,color .3s}
.layer-explorer[data-layer=os] .source-row span:not(.micro){border-color:#c4a2f2;color:var(--purple)}
.scene-hint{font-family:var(--mono);font-size:9px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);text-align:center;margin-top:16px}

/* Panels: stacked in one grid cell so switching layers never shifts the page. */
.layer-panels{grid-area:panels;display:grid;min-width:0}
.layer-panel{grid-area:1/1;min-width:0;transition:opacity .45s ease,transform .45s cubic-bezier(.22,.7,.23,1),visibility 0s}
.layer-panel[hidden]{display:block;visibility:hidden;opacity:0;transform:translateY(10px);pointer-events:none;transition:opacity .2s ease,transform .2s ease,visibility 0s linear .2s}
.panel-kicker{display:flex;gap:12px;font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.panel-kicker span{color:var(--purple)}
.layer-panel h3{font-family:var(--serif);font-size:clamp(32px,3vw,42px);font-weight:400;line-height:1.08;letter-spacing:-.025em;margin-top:14px;max-width:520px;text-wrap:balance}
.panel-lede{font-size:15px;line-height:1.7;color:var(--muted);margin-top:14px;max-width:500px}
.feature-list{list-style:none;padding:0;margin:26px 0 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:28px}
.feature-list li{display:grid;grid-template-columns:30px minmax(0,1fr);gap:13px;padding:17px 0;border-top:1px solid var(--line)}
.layer-panel:not([hidden]) .feature-list li{animation:feature-in .5s cubic-bezier(.22,.7,.23,1) both}
.layer-panel:not([hidden]) .feature-list li:nth-child(2){animation-delay:.06s}
.layer-panel:not([hidden]) .feature-list li:nth-child(3){animation-delay:.12s}
.layer-panel:not([hidden]) .feature-list li:nth-child(4){animation-delay:.18s}
.layer-panel:not([hidden]) .panel-preview{animation:feature-in .5s .22s cubic-bezier(.22,.7,.23,1) both}
@keyframes feature-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.feature-icon{width:30px;height:30px;display:grid;place-items:center;border:1px solid var(--line);border-radius:6px;color:var(--purple)}
.feature-icon svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.feature-list h4{font-size:14px;font-weight:550;letter-spacing:-.005em;line-height:1.35}
.feature-list p{font-size:13px;line-height:1.55;color:var(--muted);margin-top:5px}

.panel-preview{margin-top:6px;background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:15px 18px 14px}
.preview-label{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.status-list{list-style:none;margin:10px 0 0;padding:0}
.status-list li{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:9px 0;border-top:1px solid #e4e4e4;font-size:13px;line-height:1.3}
.status-list li:first-child{border-top:0}
.status-pill{flex:none;font-family:var(--mono);font-size:9px;letter-spacing:.05em;text-transform:uppercase;line-height:1;padding:5px 7px;border-radius:3px;background:var(--paper);border:1px solid var(--line);color:var(--ink)}
.status-pill.is-ready{color:var(--purple);border-color:#c4a2f2}
.status-pill.is-flag{background:var(--yellow);border-color:var(--yellow)}
.chat-q{width:fit-content;max-width:88%;margin:12px 0 0 auto;background:var(--ink);color:#ffffff;font-size:13px;line-height:1.5;padding:9px 13px;border-radius:12px 12px 3px 12px}
.chat-a{max-width:94%;margin-top:9px;background:var(--paper);border:1px solid var(--line);border-radius:12px 12px 12px 3px;padding:11px 13px}
.chat-a p{font-size:13px;line-height:1.55}
.chat-a .chat-sources{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.chat-sources span{font-family:var(--mono);font-size:9px;letter-spacing:.04em;line-height:1;color:var(--muted);border:1px solid var(--line);border-radius:3px;padding:4px 6px}
.layer-panel>.text-link{margin-top:22px}

.platform-flow{display:flex;justify-content:space-between;align-items:center;gap:20px 32px;margin-top:72px;padding-top:22px;border-top:1px solid var(--line);font-size:11px;color:var(--muted)}
.platform-flow ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px}
.platform-flow li{display:flex;align-items:center;gap:12px;color:var(--ink)}
.platform-flow li+li::before{content:'\2192';color:var(--muted)}
.platform-flow li:last-child{color:var(--purple)}

@media(max-width:1080px){
  .layer-explorer{grid-template-columns:minmax(0,1fr);grid-template-areas:"stage" "tabs" "panels";grid-template-rows:none;row-gap:28px;margin-top:44px}
  .layer-stage{width:100%;max-width:640px;justify-self:center}
  .layer-panel h3{max-width:640px}
  .panel-lede{max-width:620px}
}
@media(max-width:760px){
  .platform-head{grid-template-columns:minmax(0,1fr);gap:22px}
  .platform-head h2{font-size:54px}
  .platform-intro p{font-size:15px}
  .feature-list{grid-template-columns:minmax(0,1fr)}
  .tab-name{font-size:14px}
  .platform-flow{flex-direction:column;align-items:flex-start;margin-top:52px}
}
@media(max-width:420px){
  .platform-head h2{font-size:46px}
  .tab-role{display:none}
  .tab-name{font-size:13px}
  .layer-panel h3{font-size:30px}
  .source-row span:not(.micro){font-size:9px;padding:6px 7px}
}
@media(prefers-reduced-motion:reduce){.feed-dot{display:none}}
/* Index previews have no label line since 2026-10-23; drop the list gap when it comes first. */
.panel-preview>.status-list:first-child{margin-top:0}