/* Discovery layer: keeps the established color and appearance system. */
html{scroll-behavior:smooth}body{overflow-x:hidden}.brand strong{font-size:18px}.brand small{font-size:9px}.topbar{gap:20px;flex-wrap:wrap}.header-nav{display:flex;flex-wrap:wrap;gap:20px;font-size:13px}.header-nav a{color:var(--muted);text-decoration:none}.header-nav a:hover{color:var(--accent-text)}.breadcrumb{display:none}.topbar-note{display:none}.topbar-actions{margin-inline-start:auto;gap:10px}.intro h1{font-size:clamp(32px,3.7vw,52px);line-height:1.13;max-width:860px}.intro h1 .brand-subtitle{display:inline-block;font-size:clamp(20px,2.2vw,30px);font-weight:400;color:var(--muted);line-height:1.4;letter-spacing:-.02em;margin-top:10px}.intro-copy{max-width:690px;font-size:15px}.hero-search{margin:25px 0 30px}.hero-search .search{width:100%;max-width:780px}.hero-search input{font-size:16px;min-height:52px}.start-section h2,.library-tools h2,.learning-paths h2,.foundations h2{font-size:23px}.starter-grid,.path-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.starter-card,.path-card{padding:22px;border:1px solid var(--border);border-radius:10px;background:var(--panel);color:var(--text)}.starter-card{text-decoration:none;display:block}.starter-card:hover{border-color:var(--accent-text)}.starter-card h3{font-size:17px;margin:8px 0}.starter-card p,.path-card p{color:var(--muted);font-size:13px;line-height:1.65}.starter-card span{color:var(--accent-text);font-size:12px}.filters{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0}.filter{font-size:12px}.level-filter{display:flex;align-items:center;gap:12px;font-size:13px;color:var(--muted);margin:0 0 20px}.level-filter select{padding:8px;background:var(--panel);color:var(--text);border:1px solid var(--border);border-radius:6px}.preview{height:120px}.card-content h3{font-size:18px}.card-meta{font-size:10px;gap:5px}.card-parent{font-size:11px;color:var(--subtle);margin-top:10px}.model-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:14px}.model-tags span{font-size:10px;border:1px solid var(--border);padding:4px 7px;border-radius:4px;color:var(--muted)}.show-more{display:block;margin:24px auto 42px;padding:12px 26px}.learning-paths,.foundations{border-top:1px solid var(--border);padding-top:30px;margin:40px 0}.learning-paths>p,.foundations>p{color:var(--muted);line-height:1.7;max-width:760px}.path-grid{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:22px}.path-card h3{margin-top:0;font-size:19px}.path-card ol{padding-inline-start:20px;line-height:2;font-size:13px}.path-card a,.foundation-links a,.explore-footer a{color:var(--accent-text)}.foundation-links{display:flex;flex-wrap:wrap;gap:22px;margin-top:22px;font-size:14px}.live-showcase{margin:36px 0}.showcase-controls #previousExample,.showcase-controls #nextExample,#exampleDots,#examplePosition{display:none}.featured-track{height:auto}.feature-launch{display:inline-block;padding:10px 14px;border-radius:6px;background:var(--accent);color:var(--accent-ink);text-decoration:none}.inquiry{margin:20px 0;padding:22px;border:1px solid var(--border);border-radius:10px;background:var(--panel)}.inquiry h2{font-size:20px;margin:0 0 15px}.inquiry label{display:block;margin-bottom:8px;font-size:13px}.inquiry textarea{box-sizing:border-box;width:100%;resize:vertical;background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:6px;padding:12px;font:inherit}.inquiry p{font-size:12px;color:var(--muted)}.explore-footer nav{margin-bottom:12px;line-height:2}.world-card .card-content>p{min-height:42px}.guide-block p{line-height:1.7}#starfield{opacity:.85}.rail .nav-collection summary{font-size:12px}.audit-note{border-inline-start:3px solid var(--accent);padding-inline-start:16px}.docs{max-width:920px;margin:0 auto;padding:35px 24px;font:16px/1.8 system-ui;background:var(--bg);color:var(--text)}.docs a{color:var(--accent-text)}.docs h1{line-height:1.2}.docs h2{margin-top:2em}.docs details{border:1px solid var(--border);padding:12px 18px;margin:12px 0;border-radius:8px}.docs summary{cursor:pointer}.docs code{overflow-wrap:anywhere}.docs .doc-nav{display:flex;gap:20px;flex-wrap:wrap;font-size:13px}.docs table{border-collapse:collapse;width:100%;font-size:14px}.docs th,.docs td{text-align:start;border-bottom:1px solid var(--border);padding:10px}
@media(max-width:1000px){.starter-grid{grid-template-columns:1fr}.topbar{align-items:center}.header-nav{gap:12px}.intro{display:block}.continue-button{padding-inline-start:0}}@media(max-width:650px){.path-grid{grid-template-columns:1fr}.header-nav{width:100%;font-size:12px}.topbar-actions{margin-inline-start:0}.intro h1{font-size:32px}.intro-copy{font-size:14px}.world-grid{grid-template-columns:1fr}.inquiry{padding:16px}.foundations .foundation-links{flex-direction:column}.level-filter{flex-wrap:wrap}.topbar{padding:12px 18px}.docs{padding:20px 16px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* Each card embeds the actual lab, without interactive controls competing with its link. */
.live-card-preview{position:relative;aspect-ratio:900/520;height:auto!important;overflow:hidden;background:#071018}
.live-card-preview iframe{position:absolute;top:0;left:0;width:900px;height:520px;border:0;max-width:none;transform-origin:top left;pointer-events:none}
.live-card-preview .preview-label{position:absolute;bottom:10px;left:10px;z-index:2;background:var(--accent);padding:4px 7px;border-radius:4px;color:var(--accent-ink);font-size:10px}
/* Anchor the mobile popover to the header, not a narrow wrapped action button. */
@media (max-width:650px){
  .topbar{position:relative;z-index:60}
  #appearancePanel{position:static}
  #appearancePanel .appearance-panel{left:18px;right:auto;width:min(300px,calc(100vw - 36px))}
  html[dir=rtl] #appearancePanel .appearance-panel{left:auto;right:18px}
}

/* Native and in-page fullscreen share a viewport-sized workspace and exit control. */
body.lab-fullscreen{overflow:hidden}
.workspace.is-fullscreen{position:fixed;inset:0;z-index:10000;width:100%;height:100vh;height:100dvh;min-height:0;margin:0;border:0;border-radius:0;display:flex;flex-direction:column;background:var(--bg);padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}
.workspace.is-fullscreen .workspace-tools{flex:0 0 auto;max-height:40%;overflow-y:auto}
.workspace.is-fullscreen .embed-stage{flex:1 1 0;min-height:0;height:0;width:100%}
.workspace.is-fullscreen .workspace-foot{display:none}

/* Live experiments lead the page; mobile readers reach a experiment immediately. */
.explore>.live-showcase:first-child{margin:0 0 28px}
.showcase-controls #previousExample,.showcase-controls #nextExample,.showcase-controls #examplePosition{display:inline-block}
#exampleDots{display:flex}
#featuredTrack{direction:ltr}
html[dir=rtl] #featuredTrack .featured{direction:rtl}
@media(max-width:650px){
  #featuredTrack .featured{grid-template-columns:1fr;min-height:0}
  #featuredTrack .featured-art{order:0;height:230px;min-height:0}
  #featuredTrack .featured-content{order:1;padding:14px 16px}
  #featuredTrack .featured-content p:not(.eyebrow){display:none}
  #featuredTrack .featured h2{font-size:22px;margin:4px 0 10px}
  .showcase-controls{gap:6px}
  .showcase-controls button{min-height:36px}
}

/* Touch input reaches the carousel, never its decorative experiment iframe. */
#featuredTrack{touch-action:pan-y pinch-zoom;-webkit-overflow-scrolling:touch}
#featuredTrack.is-dragging{scroll-snap-type:none;scroll-behavior:auto;user-select:none;-webkit-user-select:none}
#featuredTrack .featured-art{touch-action:pan-y pinch-zoom}
#featuredTrack iframe{pointer-events:none}
.experiment-number{position:absolute;top:12px;left:12px;z-index:5;pointer-events:none;background:var(--accent);color:var(--accent-ink)!important;border:1px solid var(--accent);border-radius:5px;padding:5px 9px;font:600 12px/1.5 system-ui;letter-spacing:.03em}.live-card-preview{position:relative}.personal-notebook{border:1px solid #405361;border-radius:12px;margin:20px 0;padding:18px}.personal-notebook[hidden]{display:none}.personal-notebook h2{font-size:20px}.personal-notebook a{display:block;padding:10px 0;color:var(--text,#e5eef1)}.learning-progress{color:#eac184}.path-card li[data-complete=true]::marker{color:#eac184}.path-card li[data-complete=true]::after{content:' ✓';color:#eac184}.workspace-tools select{background:#142330;color:#e5eef1;border:1px solid #526775;border-radius:5px;padding:8px}.workspace-tools label{display:flex;align-items:center;gap:6px}.world-card :focus-visible,.personal-notebook :focus-visible,.path-card :focus-visible{outline:3px solid #eac184;outline-offset:3px}@media(max-width:600px){.workspace-tools .tool-group{flex-wrap:wrap}.workspace-tools button{min-height:44px}.experiment-number{top:8px;left:8px;font-size:11px}}
.preview-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}.live-card-preview .preview-poster{z-index:1}.live-card-preview.preview-ready .preview-poster{visibility:hidden}.featured-art .preview-poster{z-index:0}.featured-art iframe{z-index:1}
.section-navigation{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:0 0 20px;padding:16px;border:1px solid var(--border,#405361);border-radius:10px}.section-navigation span{flex-basis:100%;font-weight:600}.section-navigation a{color:inherit;border:1px solid var(--border,#526775);border-radius:6px;padding:10px 14px;text-decoration:none}.section-navigation a:hover,.section-navigation a:focus-visible{outline:2px solid var(--accent,#edc184);outline-offset:2px}

/* The poster and live frame share the same backdrop from the first paint. */
:root {--preview-bg:#0b1218}
html[data-theme=light]{--preview-bg:#fff}
html[data-theme=black]{--preview-bg:#000}
.live-card-preview,.featured-art,.live-card-preview iframe,.featured-art iframe{background:var(--preview-bg)!important}
