/* Experimental persistent navigation shell. No opacity transitions. */
.g6-shell-page { display: flex; flex-direction: column; height: 100dvh; overflow: hidden; }
.g6-shell-page .g6-sysbar { flex: none; }
.g6-shell-page .g6-sysbar__inner { gap: clamp(.5rem,2vw,1.5rem); }
.g6-shell-page .g6-sysnav button {
  appearance: none; padding: .65rem .75rem; border: 0; border-bottom: 2px solid transparent;
  background: none; color: var(--g6-text-2); font: inherit; cursor: pointer;
}
.g6-shell-page .g6-sysnav button:hover { color: var(--g6-text); }
.g6-shell-page .g6-sysnav button[aria-current="page"] {
  color: var(--g6-text); border-bottom-color: var(--g6-identity-live);
}
.g6-shell-page .g6-sysnav button:focus-visible { outline: 2px solid var(--g6-focus); outline-offset: 2px; }
.g6-shell__note { font-size: var(--g6-text-xs, .75rem); color: var(--g6-text-3); }
.g6-shell__ribbon {
  padding: .55rem var(--g6-gutter); border-bottom: 1px dashed var(--g6-rule);
  font-size: var(--g6-text-xs, .75rem); color: var(--g6-text-2); flex: none;
}
.g6-shell__main { flex: 1; min-block-size: 0; }
.g6-shell__stage { position: relative; inline-size: 100%; block-size: 100%; overflow: clip; contain: layout paint; background: var(--g6-canvas); }
.g6-shell__stage > iframe {
  position: absolute; inset: 0; inline-size: 100%; block-size: 100%;
  border: 0; margin: 0; background: var(--g6-canvas);
  clip-path: inset(0 0 0 0);
}
.g6-shell__stage > iframe[data-state="inactive"] {
  clip-path: inset(0 100% 0 0);
  pointer-events: none;
}
.g6-shell__stage > iframe[data-state="priming"] {
  z-index: 0;
  clip-path: inset(0 0 0 0);
  pointer-events: none;
}
.g6-shell__stage > iframe[data-state="active"] { z-index: 1; }
.g6-shell__stage > iframe[data-state="entering"] {
  z-index: 2; pointer-events: none;
  clip-path: circle(0% at var(--g6-scene-reveal-x, 6%) 25%);
}
/* Identity/phase colors are centralized in g6-motion.css (shared with
   the direct origin comparator), not overridden with permanent blue here. */
.g6-shell__footer {
  flex: none; display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: .3rem 1rem; padding: .6rem var(--g6-gutter);
  border-top: 1px solid var(--g6-rule);
  font-size: var(--g6-text-xs, .75rem); color: var(--g6-text-2);
}
.g6-shell__footer a { color: var(--g6-text); }
@media (max-width: 800px) {
  .g6-shell__note { display: none; }
  .g6-shell-page .g6-sysnav button { padding: .5rem .25rem; }
  .g6-shell__ribbon { font-size: .66rem; }
}
