@font-face {
  font-family: "Gveret Levin";
  src: url("/assets/GveretLevin-Regular.ttf") format("truetype");
  font-display: swap;
}

:root {
  --ink: #08070a;
  --ink-soft: #100a0e;
  --wine: #60001a;
  --crimson: #c50337;
  --burgundy: #8b0d1a;
  --cream: #f5f2ed;
  --cream-muted: #c8c0ba;
  --line: rgba(245, 242, 237, 0.12);
  --line-bright: rgba(245, 242, 237, 0.22);
  --glass: rgba(20, 10, 15, 0.68);
  --glass-soft: rgba(245, 242, 237, 0.045);
  --shadow: 0 28px 70px rgba(0, 0, 0, 0.42), inset 0 1px 0 rgba(255,255,255,.08);
  --display: "Gveret Levin", Georgia, serif;
  --sans: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color-scheme: dark;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 100px; }
body {
  margin: 0;
  min-width: 320px;
  color: var(--cream);
  background:
    radial-gradient(circle at 87% 12%, rgba(197,3,55,.14), transparent 27rem),
    radial-gradient(circle at 15% 46%, rgba(96,0,26,.14), transparent 30rem),
    linear-gradient(145deg, #08070a 0%, #0e080c 52%, #07070a 100%);
  font-family: var(--sans);
  font-size: 15px;
  line-height: 1.72;
  min-height: 100vh;
  overflow-x: hidden;
}

body.high-contrast {
  --line: rgba(245, 242, 237, 0.2);
  --line-bright: rgba(245, 242, 237, 0.35);
  --glass: rgba(6, 6, 8, 0.89);
  --cream-muted: #e1dcd7;
}

button, input, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
button { color: inherit; }
svg { width: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
code { font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace; }

.skip-link { position: fixed; top: -50px; left: 24px; padding: 10px 16px; z-index: 999; background: var(--cream); color: var(--ink); border-radius: 10px; transition: top .2s; }
.skip-link:focus { top: 16px; }
.ambient { position: fixed; z-index: -2; border-radius: 50%; filter: blur(70px); pointer-events: none; opacity: .65; }
.ambient-one { width: 320px; height: 320px; background: rgba(197,3,55,.22); top: -170px; right: 18%; }
.ambient-two { width: 240px; height: 360px; background: rgba(96,0,26,.18); bottom: 5%; left: -120px; }
.noise { position: fixed; inset: 0; pointer-events: none; opacity: .025; z-index: 50; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.88' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.9'/%3E%3C/svg%3E"); }

.glass {
  background: linear-gradient(135deg, rgba(255,255,255,.07), rgba(255,255,255,.018) 42%, rgba(197,3,55,.035)), var(--glass);
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
  backdrop-filter: blur(24px) saturate(145%);
  -webkit-backdrop-filter: blur(24px) saturate(145%);
}
.glass-subtle { background: var(--glass-soft); border: 1px solid var(--line); box-shadow: inset 0 1px 0 rgba(255,255,255,.045); }
.glass-control { background: rgba(255,255,255,.045); border: 1px solid var(--line); box-shadow: inset 0 1px 0 rgba(255,255,255,.06); }

.topbar {
  position: sticky;
  top: 14px;
  z-index: 40;
  width: min(1500px, calc(100% - 28px));
  height: 66px;
  margin: 14px auto 0;
  border-radius: 22px;
  padding: 0 20px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
}
.brand { display: inline-flex; align-items: center; gap: 11px; font-family: var(--display); font-size: 21px; letter-spacing: .025em; width: max-content; }
.brand-accent { color: var(--crimson); }
.brand-mark { width: 26px; height: 26px; display: inline-flex; position: relative; }
.main-nav { display: flex; gap: 8px; padding: 5px; border: 1px solid rgba(255,255,255,.07); background: rgba(0,0,0,.16); border-radius: 14px; }
.main-nav a { font-size: 12px; font-weight: 700; letter-spacing: .04em; color: var(--cream-muted); padding: 7px 13px; border-radius: 9px; transition: .25s ease; }
.main-nav a:hover, .main-nav a.active { color: var(--cream); background: rgba(255,255,255,.075); }
.top-actions { display: flex; justify-content: flex-end; align-items: center; gap: 8px; }
.search-trigger { border-radius: 12px; height: 38px; display: flex; align-items: center; gap: 9px; padding: 0 8px 0 11px; cursor: pointer; }
.search-trigger span { font-size: 12px; color: var(--cream-muted); }
kbd { font-size: 9px; color: var(--cream-muted); background: rgba(0,0,0,.25); border: 1px solid var(--line); border-radius: 6px; padding: 3px 6px; }
.icon-button { width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center; cursor: pointer; }
.mobile-menu { display: none; }

.page-shell {
  width: min(1500px, calc(100% - 28px));
  margin: 22px auto 90px;
  display: grid;
  grid-template-columns: 230px minmax(0, 730px) minmax(300px, 360px);
  justify-content: space-between;
  gap: 30px;
  align-items: start;
}
.module-sidebar { position: sticky; top: 100px; border-radius: 24px; padding: 17px 12px 14px; max-height: calc(100vh - 115px); overflow: auto; scrollbar-width: none; }
.sidebar-label { display: flex; justify-content: space-between; align-items: center; padding: 3px 10px 12px; color: #897e7e; font-size: 9px; text-transform: uppercase; letter-spacing: .16em; border-bottom: 1px solid var(--line); }
.module-sidebar nav { display: flex; flex-direction: column; padding: 9px 0; }
.module-sidebar nav a { display: grid; grid-template-columns: 27px 1fr 4px; align-items: center; min-height: 39px; padding: 4px 9px; color: #9a9090; border-radius: 11px; transition: .2s ease; }
.module-sidebar nav a:hover { color: var(--cream); background: rgba(255,255,255,.035); transform: translateX(2px); }
.module-sidebar nav a span { font-size: 9px; font-family: Consolas, monospace; color: #5f5659; }
.module-sidebar nav a b { font-size: 11px; font-weight: 600; letter-spacing: .01em; }
.module-sidebar nav a em { height: 19px; width: 3px; border-radius: 3px; background: var(--crimson); box-shadow: 0 0 15px var(--crimson); }
.module-sidebar nav a.active { color: var(--cream); background: linear-gradient(90deg, rgba(197,3,55,.13), rgba(255,255,255,.045)); border: 1px solid rgba(197,3,55,.15); }
.module-sidebar nav a.active span { color: var(--crimson); }
.sidebar-progress { border-top: 1px solid var(--line); padding: 13px 10px 4px; }
.sidebar-progress > div:first-child { display: flex; justify-content: space-between; font-size: 9px; color: #817778; }
.sidebar-progress strong { color: var(--cream-muted); font-size: 10px; }
.progress-track { height: 2px; margin-top: 9px; background: rgba(255,255,255,.08); border-radius: 10px; overflow: hidden; }
.progress-track i, .quiz-progress i { display: block; height: 100%; background: linear-gradient(90deg, var(--wine), var(--crimson)); box-shadow: 0 0 12px var(--crimson); }

main { min-width: 0; }
.lesson-hero { padding: 36px 10px 50px; position: relative; border-bottom: 1px solid var(--line); overflow: hidden; }
.lesson-hero::after { content: ""; position: absolute; width: 180px; height: 180px; right: 4%; bottom: -105px; border-radius: 50%; border: 1px solid rgba(197,3,55,.3); box-shadow: 0 0 70px rgba(197,3,55,.12), inset 0 0 50px rgba(197,3,55,.08); }
.breadcrumb { display: flex; gap: 9px; font-size: 10px; letter-spacing: .04em; color: #6f6668; margin-bottom: 36px; }
.breadcrumb a:hover { color: var(--cream); }
.breadcrumb b { color: #a69b9b; font-weight: 600; }
.hero-number { position: absolute; right: 6px; top: 44px; font-family: var(--display); font-size: 88px; color: transparent; -webkit-text-stroke: 1px rgba(245,242,237,.055); line-height: 1; user-select: none; }
.eyebrow, .section-kicker { text-transform: uppercase; letter-spacing: .18em; font-size: 9px; font-weight: 800; color: var(--crimson); }
.eyebrow { display: flex; align-items: center; gap: 9px; }
.eyebrow span { width: 24px; height: 1px; background: var(--crimson); box-shadow: 0 0 8px var(--crimson); }
h1, h2 { font-family: var(--display); font-weight: 400; margin: 0; letter-spacing: -.025em; }
h1 { font-size: clamp(54px, 7vw, 88px); line-height: .9; max-width: 620px; }
h1 em, h2 em { color: var(--crimson); font-style: italic; }
.hero-copy { max-width: 590px; color: var(--cream-muted); font-size: 16px; line-height: 1.7; margin: 24px 0; }
.hero-meta { display: flex; align-items: center; gap: 19px; font-size: 10px; color: #a79d9d; }
.pill { display: inline-flex; align-items: center; gap: 7px; background: rgba(197,3,55,.09); border: 1px solid rgba(197,3,55,.22); border-radius: 99px; padding: 5px 10px; color: #d9c9ca; }
.dot { width: 5px; height: 5px; border-radius: 50%; background: var(--crimson); box-shadow: 0 0 9px var(--crimson); }
.meta-item { display: flex; align-items: center; gap: 6px; }
.meta-item svg { width: 14px; }
.source-link { margin-left: auto; border-bottom: 1px solid rgba(245,242,237,.2); padding-bottom: 2px; transition: .2s; }
.source-link:hover { color: var(--cream); border-color: var(--crimson); }

.lesson-article { padding: 44px 10px 0; }
.lesson-article section { padding: 46px 0; border-bottom: 1px solid var(--line); }
.lead { display: grid; grid-template-columns: 40px 1fr; gap: 16px; padding: 24px; border-radius: 18px; margin-bottom: 18px; }
.lead-glyph { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; background: rgba(197,3,55,.12); color: var(--crimson); border: 1px solid rgba(197,3,55,.25); }
.lead p { margin: 0; font-family: var(--display); font-size: 18px; line-height: 1.65; color: #ded8d3; }
.section-kicker { margin-bottom: 10px; color: #786d70; }
h2 { font-size: clamp(38px, 5vw, 54px); line-height: 1; margin-bottom: 24px; }
h3 { font-family: var(--display); font-size: 23px; margin: 0; font-weight: 400; }
.lesson-article section > p { color: #b1a8a7; margin: 15px 0; line-height: 1.85; }
.lesson-article p code, .info-card code { color: #eee5df; background: rgba(197,3,55,.1); border: 1px solid rgba(197,3,55,.13); padding: 2px 5px; border-radius: 5px; font-size: .86em; }
.flow-diagram { display: grid; grid-template-columns: 1fr 42px 1fr 42px 1fr; align-items: center; margin: 30px 0; }
.flow-card { border-radius: 17px; min-height: 126px; padding: 18px; display: flex; flex-direction: column; box-shadow: inset 0 1px rgba(255,255,255,.08), 0 14px 30px rgba(0,0,0,.18); }
.flow-card span { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; background: rgba(197,3,55,.12); color: var(--crimson); font-size: 9px; margin-bottom: auto; }
.flow-card b { font-family: var(--display); font-size: 20px; font-weight: 400; }
.flow-card small { font-size: 9px; color: #817778; }
.flow-line { height: 1px; background: rgba(197,3,55,.25); position: relative; }
.flow-line i { position: absolute; right: -1px; top: -3px; width: 7px; height: 7px; border-top: 1px solid var(--crimson); border-right: 1px solid var(--crimson); transform: rotate(45deg); }
.code-block { border: 1px solid var(--line); border-radius: 15px; margin: 25px 0; overflow: hidden; background: #080609; box-shadow: inset 0 1px rgba(255,255,255,.04), 0 22px 45px rgba(0,0,0,.22); }
.code-block::before { content: attr(data-language); float: right; margin: 14px 14px 0 0; font-size: 8px; letter-spacing: .14em; text-transform: uppercase; color: #6e6265; }
.code-top { height: 40px; border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; padding: 0 12px; }
.code-top > span { display: flex; gap: 5px; }
.code-top > span i { width: 6px; height: 6px; border-radius: 50%; background: #3f3538; }
.code-top > span i:first-child { background: var(--crimson); }
.copy-code, .builder-actions button { border: 0; background: transparent; font-size: 9px; text-transform: uppercase; letter-spacing: .08em; color: #82787a; cursor: pointer; }
.copy-code:hover, .builder-actions button:hover { color: var(--cream); }
pre { margin: 0; white-space: pre-wrap; word-break: break-word; }
.code-block pre { padding: 21px 24px 24px; overflow-x: auto; }
.code-block code { color: #bdb4b2; font-size: 11px; line-height: 1.75; }
.c-accent { color: #ed4674; }.c-light { color: #f0e7df; }.c-muted { color: #5f5558; }
.compare-grid, .invocation-grid, .decision-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 26px 0; }
.compare-card { border-radius: 16px; padding: 20px; border: 1px solid var(--line); background: rgba(255,255,255,.025); }
.compare-card > span { font-size: 9px; text-transform: uppercase; letter-spacing: .12em; font-weight: 800; }
.compare-card code { display: block; margin: 15px 0; font-size: 10px; color: #c2b8b7; line-height: 1.7; }
.compare-card p { font-size: 10px; margin: 0; color: #756b6d; }
.compare-card.bad { border-color: rgba(255,255,255,.08); }
.compare-card.bad > span { color: #777074; }
.compare-card.good { border-color: rgba(197,3,55,.28); background: linear-gradient(145deg, rgba(197,3,55,.1), rgba(255,255,255,.02)); box-shadow: inset 0 1px rgba(255,255,255,.07); }
.compare-card.good > span { color: #e54370; }
.callout { border-left: 2px solid var(--crimson); background: linear-gradient(90deg, rgba(197,3,55,.09), transparent); padding: 16px 18px; display: flex; gap: 14px; margin: 24px 0; }
.callout > span { color: var(--crimson); }.callout b { font-family: var(--display); font-weight: 400; font-size: 18px; }.callout p { font-size: 11px; color: #968b8b; margin: 2px 0 0; }
.info-card { border-radius: 17px; padding: 18px; display: flex; gap: 14px; min-height: 135px; box-shadow: inset 0 1px rgba(255,255,255,.07), 0 16px 36px rgba(0,0,0,.2); }
.card-icon { flex: 0 0 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; border: 1px solid rgba(197,3,55,.3); color: var(--crimson); font-family: var(--display); font-size: 18px; }
.info-card b { font-family: var(--display); font-weight: 400; font-size: 20px; }.info-card p { font-size: 11px; line-height: 1.55; color: #b9afad; }.info-card small { color: #71686a; font-size: 9px; }
.scope-table { border-radius: 16px; overflow: hidden; margin: 25px 0; }
.scope-row { display: grid; grid-template-columns: 90px 1.25fr 1fr; gap: 12px; align-items: center; min-height: 53px; padding: 10px 15px; border-top: 1px solid var(--line); color: #9f9594; font-size: 10px; }
.scope-row:first-child { border: 0; }.scope-row b { color: #e1d9d3; font-weight: 600; }.scope-row code { color: #e14470; font-size: 9px; }.scope-head { min-height: 38px; color: #71676a; font-size: 8px; text-transform: uppercase; letter-spacing: .12em; background: rgba(255,255,255,.025); }
.decision-card { min-height: 190px; padding: 22px; border-radius: 18px; display: flex; flex-direction: column; box-shadow: inset 0 1px rgba(255,255,255,.07); }
.decision-card > span { color: #6f6568; font-family: var(--display); font-size: 14px; }.decision-card h3 { margin: auto 0 6px; }.decision-card p { font-size: 10px; line-height: 1.6; color: #8f8585; }.decision-card code { font-size: 9px; color: #d9cfc9; }
.decision-card.featured { background: linear-gradient(145deg, #79001f, #22000c 75%); border: 1px solid rgba(238,81,121,.3); border-radius: 18px; padding: 22px; box-shadow: 0 20px 45px rgba(96,0,26,.28), inset 0 1px rgba(255,255,255,.13); }.decision-card.featured > span, .decision-card.featured p { color: #c494a1; }
.terminal-line { display: flex; align-items: center; gap: 12px; border: 1px solid var(--line); background: #070608; border-radius: 13px; padding: 12px 14px; margin-top: 20px; }.terminal-line > span { color: var(--crimson); }.terminal-line code { font-size: 11px; flex: 1; }.terminal-line button { position: static; }
.checklist-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 24px; }
.checklist-grid label { cursor: pointer; }.checklist-grid input { position: absolute; opacity: 0; }.checklist-grid label > span { min-height: 96px; border: 1px solid var(--line); background: rgba(255,255,255,.025); border-radius: 15px; padding: 14px; display: grid; grid-template-columns: 30px 1fr; grid-template-rows: auto auto; transition: .25s; }.checklist-grid i { grid-row: 1 / 3; color: #655b5e; font-size: 9px; font-style: normal; }.checklist-grid b { font-family: var(--display); font-weight: 400; font-size: 17px; }.checklist-grid small { font-size: 9px; color: #786e70; }.checklist-grid input:checked + span { border-color: rgba(197,3,55,.36); background: rgba(197,3,55,.09); box-shadow: inset 0 1px rgba(255,255,255,.07); }.checklist-grid input:checked + span i { color: var(--crimson); }.checklist-grid input:checked + span b { text-decoration: line-through; text-decoration-color: rgba(197,3,55,.8); color: #a69c9a; }
.module-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding-top: 32px; }.module-actions a { min-height: 90px; border-radius: 17px; padding: 17px; display: grid; grid-template-columns: auto 1fr; grid-template-rows: 1fr 1fr; column-gap: 14px; transition: .25s; }.module-actions a:hover { border-color: rgba(197,3,55,.35); transform: translateY(-2px); }.module-actions span { grid-row: 1 / 3; align-self: center; color: var(--crimson); font-size: 18px; }.module-actions small { color: #756c6e; font-size: 9px; text-transform: uppercase; letter-spacing: .1em; }.module-actions b { font-family: var(--display); font-weight: 400; font-size: 18px; }.module-actions.next { text-align: right; grid-template-columns: 1fr auto; }.module-actions.next span { grid-column: 2; }.module-actions.next small, .module-actions.next b { grid-column: 1; }

.lab-rail { display: flex; flex-direction: column; gap: 15px; }
.lab-card { border-radius: 22px; padding: 16px; box-shadow: inset 0 1px rgba(255,255,255,.08), 0 24px 55px rgba(0,0,0,.27); overflow: hidden; }
.lab-heading { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }.lab-icon { width: 32px; height: 32px; flex: 0 0 32px; display: grid; place-items: center; border: 1px solid rgba(197,3,55,.22); background: rgba(197,3,55,.08); color: #e84470; border-radius: 10px; font-family: Consolas, monospace; font-size: 11px; }.lab-heading > div { display: flex; flex-direction: column; line-height: 1.2; }.lab-heading small { color: #73696b; font-size: 8px; text-transform: uppercase; letter-spacing: .11em; }.lab-heading b { font-family: var(--display); font-weight: 400; font-size: 17px; margin-top: 4px; }.step-count, .quiz-score { margin-left: auto; font-size: 8px; color: #776d6f; letter-spacing: .08em; }
.mini-terminal, .free-terminal { background: #060507; border: 1px solid var(--line); border-radius: 13px; overflow: hidden; }
.terminal-bar { display: flex; justify-content: space-between; padding: 8px 10px; border-bottom: 1px solid var(--line); }.terminal-bar > span { display: flex; gap: 4px; }.terminal-bar i { width: 5px; height: 5px; display: block; background: #44383b; border-radius: 50%; }.terminal-bar i:first-child { background: var(--crimson); }.terminal-bar small { color: #534a4c; font-size: 7px; text-transform: uppercase; letter-spacing: .12em; }
.terminal-body { min-height: 102px; padding: 14px; font-family: Consolas, monospace; font-size: 10px; line-height: 1.55; }.terminal-body p { margin: 0 0 8px; }.terminal-muted { color: #6f6567; }.terminal-muted strong { color: #b9aeac; }.prompt { color: var(--crimson); }.typed { color: #ece4df; }.cursor { display: inline-block; width: 5px; height: 12px; margin-left: 2px; vertical-align: -2px; background: var(--crimson); animation: blink .9s infinite; }
@keyframes blink { 50% { opacity: 0; } }
.primary-button { width: 100%; margin-top: 10px; height: 40px; border-radius: 12px; border: 1px solid rgba(244,82,124,.28); background: linear-gradient(135deg, #b10031, #71001f); box-shadow: inset 0 1px rgba(255,255,255,.15), 0 12px 30px rgba(96,0,26,.25); display: flex; align-items: center; justify-content: space-between; padding: 0 14px; cursor: pointer; font-size: 10px; font-weight: 700; transition: .2s; }.primary-button:hover { transform: translateY(-1px); filter: brightness(1.12); }.primary-button i { font-style: normal; }
.free-terminal { min-height: 94px; max-height: 160px; overflow-y: auto; padding: 11px 12px; border-radius: 12px 12px 0 0; font: 9px/1.5 Consolas, monospace; }.free-terminal p { margin: 0 0 5px; }.free-terminal .success { color: #dfbcc6; }.free-terminal .error { color: #e45479; }.terminal-form { display: flex; align-items: center; gap: 7px; border: 1px solid var(--line); border-top: 0; background: rgba(0,0,0,.28); border-radius: 0 0 12px 12px; padding: 8px 11px; }.terminal-form label { color: var(--crimson); font-family: Consolas, monospace; }.terminal-form input { width: 100%; border: 0; outline: 0; background: transparent; color: var(--cream); font: 10px Consolas, monospace; }.terminal-form input::placeholder { color: #554c4e; }
.builder-actions { display: flex; justify-content: flex-end; gap: 5px; margin: -4px 0 11px; }.builder-actions button { background: rgba(255,255,255,.035); border: 1px solid var(--line); padding: 5px 7px; border-radius: 7px; font-size: 7px; }
#skill-form { display: grid; gap: 9px; }.builder-card form > label:not(.switch-row) { display: grid; gap: 4px; color: #827779; font-size: 8px; text-transform: uppercase; letter-spacing: .08em; }.builder-card label em { color: var(--crimson); }.builder-card input, .builder-card textarea { resize: vertical; border: 1px solid var(--line); border-radius: 9px; outline: 0; background: rgba(0,0,0,.22); color: #d6cfca; padding: 8px 9px; font-size: 9px; line-height: 1.5; text-transform: none; letter-spacing: 0; transition: .2s; }.builder-card input:focus, .builder-card textarea:focus { border-color: rgba(197,3,55,.5); box-shadow: 0 0 0 3px rgba(197,3,55,.08); }
.switch-row { display: flex; align-items: center; gap: 9px; cursor: pointer; padding: 4px 1px; }.switch-row > span { display: flex; flex-direction: column; margin-right: auto; }.switch-row b { font-size: 9px; font-weight: 600; color: #b4aaa8; }.switch-row small { font-size: 7px; color: #665d60; }.switch-row input { position: absolute; opacity: 0; }.switch-row > i { width: 30px; height: 17px; border-radius: 99px; background: #393034; position: relative; transition: .2s; }.switch-row > i::after { content: ""; position: absolute; width: 11px; height: 11px; border-radius: 50%; background: #8e8284; top: 3px; left: 3px; transition: .2s; }.switch-row input:checked + i { background: #73001f; box-shadow: inset 0 0 8px rgba(0,0,0,.3); }.switch-row input:checked + i::after { left: 16px; background: #f2507c; box-shadow: 0 0 8px var(--crimson); }
.config-preview { background: #070608; border: 1px solid var(--line); border-radius: 11px; overflow: hidden; margin-top: 10px; }.config-preview > div { display: flex; justify-content: space-between; padding: 7px 9px; border-bottom: 1px solid var(--line); }.config-preview span { font-size: 8px; color: #9d9392; }.config-preview small { font-size: 7px; color: #554c4f; }.config-preview pre { max-height: 185px; overflow: auto; padding: 10px; font: 8px/1.55 Consolas, monospace; color: #b9afad; }
.quiz-progress { height: 2px; background: rgba(255,255,255,.06); margin: 0 -16px 17px; }.quiz-progress i { width: 14.28%; transition: width .35s; }
#quiz-stage > p { font-family: var(--display); font-size: 17px; line-height: 1.4; margin: 0 0 14px; }.quiz-options { display: grid; gap: 7px; }.quiz-options button { text-align: left; padding: 10px 11px; color: #9c9291; background: rgba(255,255,255,.025); border: 1px solid var(--line); border-radius: 10px; cursor: pointer; font-size: 9px; line-height: 1.4; transition: .2s; }.quiz-options button:hover { color: var(--cream); border-color: rgba(197,3,55,.3); }.quiz-options button.correct { background: rgba(197,3,55,.12); border-color: rgba(238,73,116,.5); color: #f0dfe3; }.quiz-options button.wrong { opacity: .42; text-decoration: line-through; }.quiz-next { margin-top: 10px; }
.template-item { display: grid; grid-template-columns: 25px 1fr 27px; gap: 8px; align-items: center; padding: 10px 0; border-top: 1px solid var(--line); }.template-item > span { font-size: 8px; color: #5f5659; }.template-item > div { display: flex; flex-direction: column; }.template-item b { font-size: 9px; font-weight: 600; color: #bdb3b0; }.template-item small { font-size: 7px; color: #645b5d; }.template-copy { width: 27px; height: 27px; border: 1px solid var(--line); border-radius: 8px; background: rgba(255,255,255,.025); color: #867b7d; cursor: pointer; }.template-copy:hover { color: var(--cream); border-color: var(--crimson); }

.site-footer { width: min(1500px, calc(100% - 28px)); margin: 0 auto 24px; padding: 34px; border-radius: 24px; display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 40px; color: #7e7476; }.site-footer > div { display: flex; flex-direction: column; gap: 7px; }.site-footer .brand { color: var(--cream); }.site-footer p { max-width: 380px; font-size: 10px; line-height: 1.7; }.site-footer b { color: #c3b9b6; font-family: var(--display); font-weight: 400; font-size: 16px; }.site-footer a:not(.brand) { font-size: 9px; }.site-footer a:hover { color: var(--cream); }.site-footer .footer-meta { grid-column: 1 / -1; flex-direction: row; justify-content: space-between; padding-top: 17px; border-top: 1px solid var(--line); font-size: 8px; text-transform: uppercase; letter-spacing: .1em; }

.search-dialog { width: min(600px, calc(100% - 30px)); padding: 0; border-radius: 20px; color: var(--cream); overflow: hidden; }.search-dialog::backdrop { background: rgba(0,0,0,.68); backdrop-filter: blur(8px); }.search-box { display: grid; grid-template-columns: 25px 1fr auto; align-items: center; padding: 14px 16px; border-bottom: 1px solid var(--line); }.search-box input { border: 0; outline: 0; background: transparent; color: var(--cream); font-size: 14px; }.search-box button { border: 1px solid var(--line); background: rgba(255,255,255,.04); color: #7f7577; border-radius: 7px; font-size: 9px; padding: 4px 7px; }.search-results { max-height: 360px; overflow-y: auto; padding: 9px; }.search-result { display: flex; flex-direction: column; padding: 11px 13px; border-radius: 11px; cursor: pointer; }.search-result:hover, .search-result.active { background: rgba(197,3,55,.1); }.search-result b { font-family: var(--display); font-size: 17px; font-weight: 400; }.search-result small { color: #776d6f; font-size: 9px; }.empty-search { padding: 28px; text-align: center; color: #766c6e; font-size: 10px; }
.toast { position: fixed; z-index: 100; left: 50%; bottom: -70px; transform: translateX(-50%); background: rgba(18,9,13,.92); border: 1px solid rgba(197,3,55,.35); box-shadow: var(--shadow); backdrop-filter: blur(20px); border-radius: 99px; padding: 9px 15px 9px 10px; display: flex; align-items: center; gap: 8px; transition: bottom .35s cubic-bezier(.2,.8,.2,1); }.toast.show { bottom: 24px; }.toast span { width: 23px; height: 23px; display: grid; place-items: center; background: rgba(197,3,55,.14); color: #ee4a78; border-radius: 50%; }.toast b { font-size: 9px; font-weight: 600; }

:focus-visible { outline: 2px solid #ef4f7b; outline-offset: 3px; }
@media (max-width: 1240px) {
  .page-shell { grid-template-columns: 210px minmax(0, 1fr) 320px; gap: 18px; }
  .main-nav a { padding-inline: 9px; }
}
@media (max-width: 1050px) {
  .page-shell { grid-template-columns: 210px minmax(0, 1fr); }
  .lab-rail { grid-column: 2; display: grid; grid-template-columns: 1fr 1fr; }
  .builder-card, .quiz-card, .templates-card { grid-column: 1 / -1; }
  .main-nav { display: none; }
  .topbar { grid-template-columns: 1fr auto; }
}
@media (max-width: 760px) {
  .topbar { top: 8px; margin-top: 8px; width: calc(100% - 16px); height: 58px; border-radius: 18px; padding-inline: 14px; }
  .brand { font-size: 18px; }.brand-mark { transform: scale(.9); }
  .search-trigger kbd { display: none; }.icon-button.search-trigger { width: 38px; padding: 0; justify-content: center; }
  .mobile-menu { display: grid; }
  .page-shell { width: calc(100% - 20px); grid-template-columns: 1fr; margin-top: 10px; }
  .module-sidebar { display: none; position: fixed; top: 74px; left: 10px; right: 10px; z-index: 35; max-height: calc(100vh - 90px); }.module-sidebar.open { display: block; animation: reveal .2s ease; }
  @keyframes reveal { from { opacity: 0; transform: translateY(-8px); } }
  .lesson-hero { padding-top: 24px; }.breadcrumb { margin-bottom: 26px; }.hero-number { font-size: 64px; }.hero-copy { font-size: 14px; }.source-link { display: none; }
  .lesson-article { padding-top: 25px; }.lesson-article section { padding: 37px 0; }
  .lead { grid-template-columns: 1fr; }.lead p { font-size: 16px; }
  .flow-diagram { grid-template-columns: 1fr; gap: 8px; }.flow-line { width: 1px; height: 20px; margin-left: 30px; }.flow-line i { right: -3px; top: auto; bottom: -1px; transform: rotate(135deg); }
  .flow-card { min-height: 100px; }
  .compare-grid, .invocation-grid, .decision-grid, .checklist-grid { grid-template-columns: 1fr; }
  .scope-row { grid-template-columns: 72px 1fr; }.scope-row > *:last-child { display: none; }
  .lab-rail { grid-column: 1; grid-template-columns: 1fr; }.builder-card, .quiz-card, .templates-card { grid-column: 1; }
  .site-footer { grid-template-columns: 1fr 1fr; padding: 25px; gap: 25px; }.site-footer > div:first-child { grid-column: 1 / -1; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

:root{--surface:rgba(17,10,14,.76);--text:var(--cream);--muted:#a89fa0;--faint:#71686b;--max:1440px}
[data-theme="light"]{--ink:#f5f2ed;--cream:#1a1014;--cream-muted:#62575a;--text:#1a1014;--muted:#6d6164;--faint:#998d90;--line:rgba(56,27,36,.13);--glass:rgba(245,242,237,.76);--glass-soft:rgba(255,255,255,.52);--surface:rgba(245,242,237,.8);--shadow:0 28px 70px rgba(48,7,19,.12),inset 0 1px 0 rgba(255,255,255,.72);color-scheme:light}
[data-theme="light"] body{background:radial-gradient(circle at 87% 12%,rgba(197,3,55,.13),transparent 28rem),#f3efec}
[data-theme="light"] .code-block,[data-theme="light"] .mini-terminal,[data-theme="light"] .playground-terminal,[data-theme="light"] .hero-console,[data-theme="light"] .builder-preview{color:#f5f2ed}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.page-frame{width:min(var(--max),calc(100% - 40px));margin-inline:auto}#app{min-height:70vh}
.topbar .brand-mark,.footer-brand .brand-mark,.welcome-output .brand-mark{width:30px;height:30px;display:grid;place-items:center;position:relative;isolation:isolate;overflow:hidden;border-radius:10px;color:#fff;background:linear-gradient(145deg,#d30a43,#720020);border:1px solid rgba(255,255,255,.22);box-shadow:inset 0 1px rgba(255,255,255,.22),0 8px 24px rgba(197,3,55,.24)}
.brand-mark::after{content:"";position:absolute;z-index:0;inset:1px 2px auto;height:46%;border-radius:8px;background:linear-gradient(180deg,rgba(255,255,255,.22),rgba(255,255,255,0));pointer-events:none}.codex-mark-glyph{position:relative;z-index:1;width:17px;height:17px;stroke:#fff;stroke-width:2.1;filter:drop-shadow(0 1px 2px rgba(20,0,8,.5))}
.brand em{color:var(--crimson);font-style:normal}.icon-button{border:1px solid var(--line);background:rgba(255,255,255,.04)}.icon-button.search-trigger{display:flex;width:auto}.nav-toggle{display:none}
.mobile-nav{position:fixed;z-index:39;top:86px;right:14px;width:220px;padding:10px;border-radius:18px}.mobile-nav[hidden]{display:none}.mobile-nav a{display:block;padding:10px 12px;border-radius:10px;color:var(--muted);font-size:13px}.mobile-nav a:hover,.mobile-nav a.active{color:var(--text);background:rgba(197,3,55,.1)}
.button{min-height:44px;padding:0 18px;border-radius:13px;border:1px solid var(--line);display:inline-flex;align-items:center;justify-content:center;gap:12px;cursor:pointer;font-size:12px;font-weight:750;letter-spacing:.02em;transition:.2s}.button:hover{transform:translateY(-2px)}.button.primary{color:#fff;border-color:rgba(255,110,145,.26);background:linear-gradient(135deg,#c50337,#730020);box-shadow:inset 0 1px rgba(255,255,255,.2),0 14px 34px rgba(139,0,37,.25)}.button.secondary{color:var(--text);background:rgba(255,255,255,.04)}.button.full{width:100%}.button:disabled{opacity:.62;cursor:default;transform:none}
.text-button,.copy-button,.copy-term{background:none;border:0;color:var(--muted);cursor:pointer}.text-button:hover,.copy-button:hover,.copy-term:hover{color:var(--text)}
.tag,.type-chip,.status-chip{display:inline-flex;width:max-content;border:1px solid var(--line);border-radius:999px;padding:4px 8px;color:var(--muted);text-transform:uppercase;font-size:8px;letter-spacing:.13em;font-weight:800}
.level-chip{display:inline-flex;padding:4px 8px;border:1px solid var(--line);border-radius:99px;text-transform:uppercase;font-size:8px;font-weight:800;letter-spacing:.11em;color:var(--muted)}.level-chip.intermediate{color:#ed7595;border-color:rgba(197,3,55,.28);background:rgba(197,3,55,.07)}.level-chip.advanced{color:#f5dce3;border-color:rgba(197,3,55,.4);background:rgba(197,3,55,.18)}.text-link{color:var(--text);font-size:11px;font-weight:700}
.home-hero{min-height:700px;padding:110px 3vw 90px;display:grid;grid-template-columns:minmax(0,1fr) minmax(430px,.9fr);gap:7vw;align-items:center}.hero-copy h1{font-size:clamp(66px,8.2vw,132px);max-width:820px}.hero-copy>p:not(.eyebrow){max-width:640px;margin:28px 0;color:var(--muted);font-size:17px}.hero-actions{display:flex;gap:10px;flex-wrap:wrap}.hero-proof{margin-top:38px;display:flex;color:var(--faint);font-size:10px;text-transform:uppercase;letter-spacing:.1em}.hero-proof span{padding:0 18px;border-left:1px solid var(--line)}.hero-proof span:first-child{padding-left:0;border:0}
.hero-console{border-radius:28px;overflow:hidden;transform:perspective(900px) rotateY(-2deg);position:relative}.console-bar{min-height:46px;padding:0 15px;border-bottom:1px solid rgba(255,255,255,.08);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;color:#85787c;font-size:9px;text-transform:uppercase;letter-spacing:.12em}.console-bar>span:first-child{display:flex;gap:6px}.console-bar i{width:7px;height:7px;border-radius:50%;background:#45383d;display:block}.console-bar i:first-child{background:var(--crimson)}.console-bar>span:last-child{text-align:right}.console-bar b{font-weight:600;color:#afa4a6}.console-body{min-height:400px;padding:32px;background:linear-gradient(150deg,rgba(3,3,5,.82),rgba(17,4,10,.92));color:#ddd5d3;font:12px/1.8 Consolas,monospace}.console-body p{margin:0 0 20px}.console-body strong{color:#f14573}.console-muted{color:#665c60}.console-thinking{padding:13px 15px;margin:20px 0;border:1px solid rgba(197,3,55,.13);background:rgba(197,3,55,.06);border-radius:10px;color:#ad9fa2}.console-output{color:#958a8d}.console-response{color:#e9e1dd}.console-cursor span{display:inline-block;width:6px;height:14px;background:var(--crimson);margin-left:7px;animation:blink 1s infinite}
.benefit-strip{border-block:1px solid var(--line);display:grid;grid-template-columns:repeat(3,1fr)}.benefit-strip article{padding:48px 3vw}.benefit-strip article+article{border-left:1px solid var(--line)}.benefit-strip article>span,.module-number,.resource-index{font:10px Consolas;color:var(--crimson)}.benefit-strip h2{font-size:27px;margin:15px 0 10px}.benefit-strip p{color:var(--muted);font-size:12px;margin:0}
.section-block{padding:100px 0 20px}.section-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:34px}.section-heading h2{font-size:clamp(44px,5vw,66px);margin:0}.section-heading>a{font-size:11px;color:var(--muted)}
.module-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.module-card{min-height:280px;border-radius:22px;padding:24px;display:flex;flex-direction:column;transition:.25s}.module-card:hover{transform:translateY(-5px);border-color:rgba(197,3,55,.34)}.module-card-top,.card-meta{display:flex;justify-content:space-between;align-items:center}.module-card h2{font-size:30px;margin:35px 0 12px}.module-card p{margin:0;color:var(--muted);font-size:11px}.card-meta{margin-top:auto;padding-top:20px;border-top:1px solid var(--line);color:var(--faint);font-size:9px}.card-meta span:last-child{color:var(--text)}.module-grid .module-card:first-child{background:linear-gradient(145deg,rgba(197,3,55,.16),rgba(255,255,255,.025) 55%)}
.explore-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}.explore-card{min-height:290px;grid-column:span 2;border-radius:24px;padding:25px;display:flex;flex-direction:column;transition:.25s}.explore-card:hover{transform:translateY(-5px);border-color:rgba(197,3,55,.32)}.explore-icon{font:26px var(--display);color:var(--crimson);margin-bottom:42px}.explore-card .tag{margin-bottom:13px}.explore-card h2{font-size:31px;margin:0 0 10px}.explore-card p{font-size:11px;color:var(--muted);margin:0}.explore-card .text-link{margin-top:auto}
.cta-panel{margin-top:110px;margin-bottom:100px;border-radius:34px;padding:70px;text-align:center}.cta-panel h2{font-size:clamp(50px,7vw,85px);margin:10px}.cta-panel>p:not(.eyebrow){color:var(--muted)}.cta-panel>div{display:flex;justify-content:center;gap:10px;margin-top:25px}.cta-panel .eyebrow{justify-content:center}
.tool-page{padding:90px 0 110px}.page-intro{max-width:800px;margin-bottom:55px}.page-intro h1{font-size:clamp(62px,8vw,105px);margin:12px 0 25px}.page-intro>p:not(.eyebrow){max-width:660px;color:var(--muted);font-size:16px}
.curriculum-stats{display:grid;grid-template-columns:repeat(4,1fr);padding:25px;border-radius:20px;margin-bottom:80px}.curriculum-stats span{text-align:center;color:var(--muted);font-size:10px;text-transform:uppercase}.curriculum-stats span+span{border-left:1px solid var(--line)}.curriculum-stats b{display:block;color:var(--text);font:30px var(--display)}.level-section{margin-bottom:90px}.level-heading{display:flex;align-items:center;gap:20px;margin-bottom:25px;padding-bottom:20px;border-bottom:1px solid var(--line)}.level-heading>span{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;border:1px solid rgba(197,3,55,.3);color:var(--crimson);font:10px Consolas}.level-heading h2{font-size:36px;margin:0}.level-heading p{color:var(--faint);margin:4px 0 0;font-size:10px}
.course-layout{margin-top:30px;margin-bottom:100px;display:grid;grid-template-columns:210px minmax(0,760px) minmax(285px,340px);gap:28px;align-items:start}.course-layout .module-sidebar{display:flex;flex-direction:column}.course-layout .module-sidebar>p{padding:0 10px 10px;margin:8px 0;color:var(--faint);font-size:8px;text-transform:uppercase;border-bottom:1px solid var(--line)}.course-layout .module-sidebar>a{display:flex;align-items:center;gap:9px;min-height:38px;padding:6px 10px;border-radius:10px;color:var(--muted);font-size:10px}.course-layout .module-sidebar>a span{font:8px Consolas;color:var(--faint)}.course-layout .module-sidebar>a.active{color:var(--text);background:linear-gradient(90deg,rgba(197,3,55,.14),rgba(255,255,255,.04));border:1px solid rgba(197,3,55,.18)}.course-layout .module-sidebar>a.active span{color:var(--crimson)}.course-layout .module-sidebar .back-link{font-size:9px;color:var(--text)}
.lesson-column{min-width:0}.course-layout .lesson-hero{padding:50px 6px}.course-layout .lesson-hero>div{display:flex;gap:12px;align-items:center;color:var(--muted);font-size:9px;margin-bottom:35px}.course-layout .lesson-hero h1{font-size:clamp(55px,7vw,88px);margin:12px 0 25px}.course-layout .lesson-hero>p:last-child{max-width:680px;color:var(--muted);font-size:16px}.lesson-section .section-index{font:9px Consolas;color:var(--crimson);display:block;margin-bottom:15px}.lesson-section h2{font-size:clamp(38px,4vw,52px)}.lesson-section>p{font-size:14px!important}
.concept-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:28px 0}.concept-cards article{padding:17px;border-radius:14px;display:flex;flex-direction:column}.concept-cards b{font:18px var(--display)}.concept-cards span{color:var(--muted);font-size:9px}.code-block>div{display:flex;justify-content:space-between;padding:9px 13px;border-bottom:1px solid var(--line);color:var(--faint);font-size:8px}.lesson-callout{display:flex;gap:13px;padding:17px 20px;border-left:2px solid var(--crimson);background:linear-gradient(90deg,rgba(197,3,55,.1),transparent);margin:24px 0}.lesson-callout>span{color:var(--crimson)}.lesson-callout p{margin:0;color:var(--muted);font-size:12px}.source-note{border-bottom:0!important;background:linear-gradient(135deg,rgba(197,3,55,.1),rgba(255,255,255,.02));border:1px solid var(--line)!important;border-radius:20px;padding:28px!important;margin-top:40px}.source-note h2{font-size:30px}.source-note p{font-size:12px!important}.source-note a{font-size:10px;color:#ec5a81}
.lesson-pagination{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:30px}.lesson-pagination a{min-height:85px;border:1px solid var(--line);border-radius:16px;padding:18px;font:18px var(--display)}.lesson-pagination a:last-child{text-align:right}.lesson-pagination a span{display:block;color:var(--faint);font:8px var(--sans);text-transform:uppercase}
.course-layout .lab-rail{position:sticky;top:100px}.lab-title{display:flex;justify-content:space-between;margin-bottom:15px;color:var(--faint);font-size:8px;text-transform:uppercase}.tutorial-view{padding:18px;border:1px solid var(--line);border-radius:14px;background:rgba(0,0,0,.18);margin-bottom:10px}.tutorial-icon{color:var(--crimson)}.tutorial-view h2,.builder-teaser h2{font-size:23px;margin:13px 0 8px}.tutorial-view p,.builder-teaser p{font-size:9px;color:var(--muted)}.tutorial-view pre{padding:10px;background:rgba(0,0,0,.3);border-radius:8px;font-size:9px}.sim-label{color:#ef7a99!important}.mini-terminal>div{min-height:90px;max-height:150px;overflow:auto;padding:12px;font:9px/1.6 Consolas}.mini-terminal form{display:flex;gap:8px;border-top:1px solid var(--line);padding:9px}.mini-terminal form span{color:var(--crimson)}.mini-terminal input{width:100%;border:0;outline:0;background:none;color:#eee6e2;font:9px Consolas}.mini-terminal form button{border:0;border-radius:7px;background:rgba(197,3,55,.16);color:#f3c9d5;font-size:8px;padding:4px 8px;cursor:pointer}.terminal-response{color:#8f8387!important}.terminal-reset{display:block;margin:8px auto 0;font-size:8px}
.module-quiz fieldset{border:0;padding:12px 0;margin:0;border-top:1px solid var(--line)}.module-quiz legend{font:14px var(--display)}.module-quiz label{display:block;cursor:pointer}.module-quiz label input{position:absolute;opacity:0}.module-quiz label span{display:block;border:1px solid var(--line);border-radius:8px;padding:8px;margin:5px 0;font-size:8px;color:var(--muted)}.module-quiz label input:checked+span{color:var(--text);border-color:rgba(197,3,55,.38);background:rgba(197,3,55,.1)}.quiz-result{font-size:9px;color:#ed7a98}
.assessment{border-radius:28px;padding:30px}.assessment fieldset{border:0;margin:0;padding:45px 20px;border-bottom:1px solid var(--line)}.question-count{color:var(--crimson);font:9px Consolas}.assessment legend{font:32px var(--display);margin-bottom:20px}.answer-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.answer-grid label{cursor:pointer}.answer-grid input{position:absolute;opacity:0}.answer-grid span{min-height:82px;display:grid;place-items:center;text-align:center;padding:12px;border:1px solid var(--line);border-radius:14px;color:var(--muted);font-size:11px}.answer-grid input:checked+span{color:var(--text);background:rgba(197,3,55,.15);border-color:rgba(197,3,55,.48)}.assessment-footer{display:flex;justify-content:space-between;align-items:center;padding:28px 20px}.assessment-result{border-radius:24px;padding:35px;margin-top:18px}.assessment-result h2{font-size:42px;margin:16px 0}.assessment-result p{color:var(--muted)}
.playground-layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:18px}.playground-terminal{border-radius:25px;overflow:hidden;background:#070608;min-height:610px;display:flex;flex-direction:column}.playground-output{flex:1;padding:30px;max-height:550px;overflow:auto;color:#c9bfbd;font:12px/1.7 Consolas}.welcome-output{text-align:center;margin:90px auto}.welcome-output .brand-mark{margin:0 auto 20px}.welcome-output h2{font-size:30px}.welcome-output p{color:#6e6266}.playground-terminal form{display:flex;gap:10px;padding:14px 18px;border-top:1px solid var(--line)}.playground-terminal form>span{color:var(--crimson)}.playground-terminal input{flex:1;border:0;outline:0;background:none;color:#f5f2ed}.playground-terminal form button{border:1px solid rgba(197,3,55,.35);background:rgba(197,3,55,.12);color:#f5dbe2;border-radius:9px;padding:7px 12px}.scenario-panel{display:flex;flex-direction:column;gap:9px}.scenario-head{display:flex;justify-content:space-between}.scenario-head h2{font-size:24px}.scenario-card{text-align:left;border-radius:15px;padding:15px;display:grid;grid-template-columns:80px 1fr;color:var(--text)}.scenario-card span{grid-row:1/3;color:var(--crimson);font:10px Consolas}.scenario-card b{font:17px var(--display)}.scenario-card small{color:var(--muted);font-size:8px}.simulation-note{color:var(--faint);font-size:9px}
.builder-tabs{display:flex;gap:7px;overflow:auto;padding-bottom:10px}.builder-tabs button{white-space:nowrap;border:1px solid var(--line);border-radius:11px;background:rgba(255,255,255,.03);color:var(--muted);padding:10px 15px}.builder-tabs button[aria-selected="true"]{background:rgba(197,3,55,.15);border-color:rgba(197,3,55,.38);color:var(--text)}.builder-workspace{display:grid;grid-template-columns:minmax(320px,.75fr) minmax(0,1.25fr);gap:16px}.builder-form,.builder-preview{border-radius:22px;padding:25px}.builder-form-head,.preview-head{display:flex;justify-content:space-between}.builder-form-head h2{font-size:30px;margin:8px 0 25px}.builder-form{display:flex;flex-direction:column;gap:14px}.builder-form label,.feedback-form label{display:flex;flex-direction:column;gap:6px;color:var(--muted);font-size:9px;text-transform:uppercase}.builder-form input,.builder-form textarea,.feedback-form input,.feedback-form textarea,.feedback-form select,.catalog-toolbar input,.catalog-toolbar select{border:1px solid var(--line);background:rgba(0,0,0,.18);color:var(--text);border-radius:10px;padding:11px;outline:0;resize:vertical;text-transform:none}.builder-preview{background:#070608;min-width:0;color:#e5dcda}.preview-head{padding-bottom:15px;border-bottom:1px solid rgba(255,255,255,.08);color:#8e8285;font:9px Consolas}.builder-preview pre{padding:25px 5px;max-height:550px;overflow:auto;font:11px/1.7 Consolas}.preview-note{color:#74696c;font-size:8px;border-top:1px solid rgba(255,255,255,.08);padding-top:13px}
.reference-actions{display:flex;gap:10px;margin:-20px 0 35px}.reference-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.reference-group{border-radius:20px;padding:22px}.reference-title{display:flex;gap:12px;align-items:center;border-bottom:1px solid var(--line);padding-bottom:17px}.reference-title>span{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:rgba(197,3,55,.1);color:var(--crimson)}.reference-title h2{font-size:25px;margin:0}.reference-group article{display:grid;grid-template-columns:145px 1fr;gap:15px;padding:12px 0;border-bottom:1px solid var(--line)}.copy-term{text-align:left;color:#ed6a8d;font:10px Consolas}.reference-group p{margin:0;color:var(--muted);font-size:10px}
.catalog-toolbar{border-radius:18px;padding:12px;display:grid;grid-template-columns:1fr repeat(3,auto);gap:9px}.catalog-toolbar label{display:flex;align-items:center}.catalog-search input{width:100%}.catalog-toolbar input,.catalog-toolbar select{height:42px}.catalog-toolbar select{min-width:130px}.result-count{color:var(--faint);font-size:10px;margin:20px}.catalog-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.feature-card{min-height:195px;border-radius:18px;padding:19px;display:flex;flex-direction:column}.feature-card>div{display:flex;justify-content:space-between}.feature-card h2{font-size:23px;margin:30px 0 8px}.feature-card p{color:var(--muted);font-size:10px}.feature-card small{margin-top:auto;color:var(--faint);text-transform:uppercase}
.resource-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:13px}.resource-card{min-height:280px;border-radius:21px;padding:22px;display:flex;flex-direction:column;transition:.25s}.resource-card:hover{transform:translateY(-4px)}.resource-card .tag{margin:25px 0 12px}.resource-card h2{font-size:26px;margin:0 0 10px}.resource-card p{color:var(--muted);font-size:10px}.resource-card .text-link{margin-top:auto}.resource-note{margin-top:40px;border-radius:20px;padding:25px;display:flex;gap:20px}.resource-note>span{color:var(--crimson)}.resource-note h2{font-size:25px;margin:0}.resource-note p{color:var(--muted);font-size:11px}
.market-truth{border-radius:26px;padding:30px;display:grid;grid-template-columns:45px minmax(0,1fr) auto;gap:22px;align-items:center;margin-bottom:35px}.market-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;color:#ff7599;background:rgba(197,3,55,.13);border:1px solid rgba(197,3,55,.28)}.market-truth h2{font-size:34px;margin:8px 0}.market-truth p:not(.eyebrow){max-width:780px;color:var(--muted);font-size:11px;margin:0}.plugin-principles{display:grid;grid-template-columns:repeat(3,1fr);border-block:1px solid var(--line);margin-bottom:85px}.plugin-principles article{padding:35px 28px}.plugin-principles article+article{border-left:1px solid var(--line)}.plugin-principles article>span,.plugin-index{color:var(--crimson);font:9px Consolas}.plugin-principles h2{font-size:25px;margin:14px 0 8px}.plugin-principles p{color:var(--muted);font-size:10px;margin:0}.plugin-heading>span{color:var(--faint);font-size:9px;text-transform:uppercase;letter-spacing:.12em}.plugin-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.plugin-card{min-height:390px;border-radius:22px;padding:22px;display:flex;flex-direction:column}.plugin-card-top{display:flex;justify-content:space-between;align-items:start}.plugin-card-top>div{display:flex;gap:5px;align-items:center;flex-wrap:wrap;justify-content:flex-end}.plugin-glyph{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;color:#fff;background:linear-gradient(145deg,#c50337,#490015);box-shadow:inset 0 1px rgba(255,255,255,.2);font:13px var(--display)}.priority-chip{padding:4px 7px;border-radius:99px;background:rgba(197,3,55,.1);color:#ee7897;font-size:8px}.plugin-index{margin-top:42px}.plugin-card h2{font-size:29px;margin:10px 0}.plugin-card>p{color:var(--muted);font-size:11px;min-height:55px}.plugin-card dl{margin:auto 0 0}.plugin-card dl>div{border-top:1px solid var(--line);padding:12px 0}.plugin-card dt{color:var(--faint);font-size:8px;text-transform:uppercase;letter-spacing:.11em}.plugin-card dd{margin:4px 0 0;color:var(--muted);font-size:9px;line-height:1.55}.plugin-decision{margin-top:35px;border-radius:26px;padding:30px;display:grid;grid-template-columns:1fr 1.2fr auto;gap:28px;align-items:center}.plugin-decision h2{font-size:34px;margin:8px 0}.plugin-decision>p{color:var(--muted);font-size:11px}
.feedback-layout{display:grid;grid-template-columns:360px 1fr;gap:30px}.feedback-form{border-radius:22px;padding:25px;display:flex;flex-direction:column;gap:16px;position:sticky;top:100px}.feedback-form h2{font-size:30px}.feedback-form>p{font-size:8px;color:var(--faint)}.board-heading{display:flex;justify-content:space-between}.board-heading h2{font-size:32px}.feedback-board{display:grid;grid-template-columns:1fr 1fr;gap:12px}.feedback-item,.feedback-board>.empty-state{border-radius:18px;padding:20px;min-height:200px}.feedback-item>div{display:flex;justify-content:space-between}.feedback-item h2{font-size:24px;margin:25px 0 9px}.feedback-item p{color:var(--muted);font-size:10px}.feedback-board>.empty-state{grid-column:1/-1;text-align:center}
.changelog-list{max-width:900px}.changelog-entry{display:grid;grid-template-columns:35px 1fr;gap:15px}.release-rail{display:flex;flex-direction:column;align-items:center}.release-rail span{width:11px;height:11px;border:2px solid var(--crimson);border-radius:50%;margin-top:30px}.release-rail i{width:1px;flex:1;background:linear-gradient(var(--crimson),var(--line))}.release-body{border-radius:20px;padding:27px;margin-bottom:18px}.release-meta{display:flex;gap:12px;color:var(--faint);font-size:9px}.release-meta b{color:#ec688b}.release-body h2{font-size:32px;margin:25px 0 10px}.release-body p{color:var(--muted);font-size:11px}.not-found{padding:160px 0;text-align:center}.not-found h1{max-width:900px;margin:10px auto 25px}.not-found .eyebrow{justify-content:center}
.site-footer{border-top:1px solid var(--line);border-radius:0;width:min(var(--max),calc(100% - 40px));padding:55px 0 25px;grid-template-columns:2fr repeat(3,1fr);background:none}.site-footer strong{color:var(--text);font-size:10px;text-transform:uppercase}.footer-note{grid-column:1/-1!important;border-top:1px solid var(--line);padding-top:20px;max-width:none!important}
.search-dialog{border:1px solid var(--line);background:var(--surface);box-shadow:var(--shadow)}.search-head{display:grid;grid-template-columns:25px 1fr auto;align-items:center;padding:14px 16px;border-bottom:1px solid var(--line)}.search-head input{border:0;outline:0;background:none;color:var(--text)}.dialog-close{border:0;background:none;color:var(--muted);font-size:22px}.search-result{width:100%;border:0;color:var(--text);background:none;text-align:left}.search-hint{display:flex;gap:18px;padding:10px;border-top:1px solid var(--line);color:var(--faint);font-size:8px}.empty-state{color:var(--muted);padding:25px;text-align:center}.toast{display:block;color:var(--text);font-size:10px}
@media(max-width:1180px){.course-layout{grid-template-columns:190px minmax(0,1fr)}.course-layout .lab-rail{grid-column:2;position:static;display:grid;grid-template-columns:1fr 1fr}.module-quiz{grid-column:1/-1}.module-grid{grid-template-columns:repeat(2,1fr)}.catalog-grid,.resource-grid{grid-template-columns:repeat(3,1fr)}.plugin-decision{grid-template-columns:1fr 1fr}.plugin-decision .button{grid-column:1/-1}.main-nav a{padding-inline:7px}}
@media(max-width:900px){.main-nav{display:none}.nav-toggle{display:grid}.topbar{grid-template-columns:1fr auto}.home-hero{grid-template-columns:1fr;padding-top:75px}.hero-console{transform:none}.benefit-strip{grid-template-columns:1fr}.benefit-strip article+article{border-left:0;border-top:1px solid var(--line)}.explore-grid{grid-template-columns:1fr 1fr}.explore-card{grid-column:span 1}.course-layout{grid-template-columns:1fr}.course-layout .module-sidebar{display:none}.course-layout .lab-rail{grid-column:1}.playground-layout{grid-template-columns:1fr}.builder-workspace{grid-template-columns:1fr}.catalog-toolbar{grid-template-columns:1fr 1fr}.catalog-search{grid-column:1/-1}.catalog-grid,.resource-grid{grid-template-columns:repeat(2,1fr)}.market-truth{grid-template-columns:45px 1fr}.market-truth .button{grid-column:1/-1}.plugin-grid{grid-template-columns:1fr 1fr}.plugin-decision{grid-template-columns:1fr}.plugin-decision .button{grid-column:auto}.feedback-layout{grid-template-columns:1fr}.feedback-form{position:static}.site-footer{grid-template-columns:2fr 1fr 1fr}}
@media(max-width:620px){.page-frame{width:calc(100% - 24px)}.topbar{width:calc(100% - 16px)}.search-trigger kbd{display:none}.home-hero{padding:65px 5px}.hero-copy h1,.page-intro h1{font-size:clamp(52px,17vw,78px)}.hero-copy>p:not(.eyebrow){font-size:14px}.hero-proof{flex-wrap:wrap}.hero-console .console-body{min-height:350px;padding:22px;font-size:10px}.section-block{padding-top:75px}.section-heading h2{font-size:43px}.module-grid,.explore-grid{grid-template-columns:1fr}.cta-panel{padding:45px 20px;margin-top:75px}.cta-panel>div{flex-direction:column}.tool-page{padding-top:65px}.curriculum-stats{grid-template-columns:1fr 1fr}.course-layout{width:calc(100% - 20px)}.concept-cards{grid-template-columns:1fr}.course-layout .lab-rail{grid-template-columns:1fr}.lesson-pagination{grid-template-columns:1fr}.assessment{padding:15px}.assessment fieldset{padding:35px 5px}.assessment legend{font-size:27px}.answer-grid{grid-template-columns:1fr 1fr}.answer-grid span{min-height:65px}.assessment-footer{padding:22px 5px}.builder-form,.builder-preview{padding:18px}.reference-grid{grid-template-columns:1fr}.reference-group article{grid-template-columns:115px 1fr}.catalog-toolbar{grid-template-columns:1fr}.catalog-search{grid-column:auto}.catalog-grid,.resource-grid,.feedback-board,.plugin-grid{grid-template-columns:1fr}.market-truth{grid-template-columns:1fr;padding:22px}.plugin-principles{grid-template-columns:1fr}.plugin-principles article+article{border-left:0;border-top:1px solid var(--line)}.plugin-decision{padding:22px}.site-footer{grid-template-columns:1fr 1fr}.site-footer>div:first-child{grid-column:1/-1}.search-hint{display:none}}
@media(max-width:760px){.icon-button.search-trigger{width:38px;padding:0;justify-content:center}.search-trigger kbd{display:none}}
@media print{.topbar,.mobile-nav,.site-footer,.ambient,.noise,.reference-actions,.page-intro>p,.page-intro>.eyebrow{display:none!important}body{background:#fff!important;color:#111}.tool-page{padding:0}.page-intro h1{font-size:48px}.reference-group{break-inside:avoid;background:#fff;border:1px solid #bbb}.reference-group p,.copy-term{color:#222}}