/* Reference composition: project.png. Shared tokens, shell, navigation and homes. */
:root {
  --cs-ink:#eef2ea; --cs-muted:#9aa79a; --cs-blue:#63e68c;
  --cs-line:#232922; --cs-soft:#12160f; --cs-width:1360px;
  --reader-ink:var(--cs-ink); --reader-muted:var(--cs-muted);
  --reader-accent:var(--cs-blue); --reader-line:var(--cs-line);
  --cs-mono:"SFMono-Regular",ui-monospace,"JetBrains Mono",Consolas,monospace;
  --cs-font:Inter,-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;
  /* Canonical dark-terminal token aliases, consumed with fallbacks by reference-reader.css. */
  --cx-ink:var(--cs-ink); --cx-muted:var(--cs-muted); --cx-quiet:#6b766a;
  --cx-line:var(--cs-line); --cx-surface:var(--cs-soft); --cx-dark:#070907;
  --cx-accent:var(--cs-blue);
}
body.cs-platform { margin:0; padding-top:60px!important; background:#0b0e0c!important; color:var(--cs-ink); font:15px/1.8 var(--cs-font); }
.cs-platform * { box-sizing:border-box; }
.cs-platform [hidden] { display:none!important; }
.cs-platform :focus-visible { outline:3px solid var(--cs-blue); outline-offset:3px; }
.cs-platform a { color:var(--cs-blue); text-underline-offset:3px; }
.cs-platform button,.cs-platform input { font:inherit; }
.cs-platform button { cursor:pointer; }
body.cs-platform.cs-enhanced .site-header,body.cs-platform.cs-enhanced .reader-header,body.cs-platform.cs-enhanced .course-bar,body.cs-platform.cs-enhanced .pb-coursebar { display:none!important; }
.cs-platform .skip-link,.cs-platform .visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.cs-platform .skip-link:focus { position:fixed; top:8px; left:12px; width:auto; height:auto; margin:0; padding:8px 16px; clip-path:none; background:#12160f; color:var(--cs-ink); z-index:200; }
.cs-header { position:fixed; inset:0 0 auto; height:60px; z-index:110; background:#0b0e0cf5; -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); border-bottom:1px solid var(--cs-line); }
.cs-header-inner { max-width:var(--cs-width); padding:0 24px; margin:auto; height:100%; display:flex; align-items:center; gap:42px; }
.cs-header .cs-wordmark { font:700 22px/1 var(--cs-mono); color:var(--cs-ink); letter-spacing:-.5px; text-decoration:none; }
.cs-header nav { display:flex; gap:28px; align-items:center; font-size:13px; font-family:var(--cs-mono); }
.cs-header nav a { color:var(--cs-muted); text-decoration:none; }
.cs-header nav a:hover { color:var(--cs-blue); }
.cs-search-trigger { margin-left:auto; display:flex; gap:10px; align-items:center; width:280px; height:33px; padding:0 11px; border:1px solid var(--cs-line); border-radius:5px; background:var(--cs-soft); color:var(--cs-muted); font:12px/1 var(--cs-mono)!important; text-align:left; }
.cs-search-trigger img { width:15px; height:15px; opacity:.5; }
.cs-search-trigger kbd { margin-left:auto; border:1px solid var(--cs-line); border-radius:3px; padding:0 5px; font:11px/18px var(--cs-mono); background:#0b0e0c; color:var(--cs-muted); }
.cs-person { width:31px; height:31px; border:1px solid var(--cs-line); border-radius:50%; display:grid; place-items:center; background:var(--cs-soft); }
.cs-person img { width:17px; opacity:.65; }
.cs-search-dialog { margin:12vh auto; padding:22px; width:min(620px,calc(100% - 32px)); max-height:76vh; color:var(--cs-ink); background:#12160f; border:1px solid var(--cs-line); border-radius:8px; box-shadow:0 18px 70px rgba(0,0,0,.5); }
.cs-search-dialog::backdrop { background:rgba(5,7,5,.7); }
.cs-search-top { display:flex; justify-content:space-between; align-items:center; margin-bottom:16px; font-weight:650; }
.cs-search-top button { background:none; border:0; padding:4px; display:flex; color:var(--cs-ink); }
.cs-search-dialog input { width:100%; border:1px solid var(--cs-line); border-radius:4px; padding:11px; background:#0b0e0c; color:var(--cs-ink); }
.cs-search-status { font-size:12px; color:var(--cs-muted); }
.cs-search-results { display:grid; gap:2px; }
.cs-search-results a { padding:10px; border-radius:4px; text-decoration:none; color:var(--cs-ink); }
.cs-search-results a:hover,.cs-search-results a:focus-visible { background:var(--cs-soft); }
.cs-search-results span { display:block; font-size:11px; color:var(--cs-muted); font-family:var(--cs-mono); }
.cs-search-results strong { font-size:14px; font-weight:550; }
.cs-icon { width:24px; height:24px; flex:none; opacity:.72; }
.cs-button { display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:8px 19px; border-radius:4px; border:1px solid var(--cs-blue); background:var(--cs-blue); color:#07130c!important; font-family:var(--cs-mono); text-decoration:none; font-size:13px; font-weight:600; white-space:nowrap; }
.cs-button img { width:15px; filter:brightness(0); opacity:.75; }
.cs-button.secondary { background:transparent; color:var(--cs-blue)!important; border-color:var(--cs-line); }
.cs-button:hover { background:#4fcf76; }
.cs-button.secondary:hover { background:var(--cs-soft); }
.cs-art { position:relative; width:260px; aspect-ratio:1; overflow:hidden; flex:none; border-radius:18px; background:#fdfdfb; box-shadow:0 24px 60px rgba(0,0,0,.5); }
.cs-art img { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; padding:14px; box-sizing:border-box; }
.cs-art figcaption { position:absolute; right:0; top:24px; width:120px; font-size:12px; line-height:1.8; color:var(--cs-muted); }
.cs-art.globe { width:310px; }
.cs-header .cs-person img,.cs-mode h3 img,.reader-featured > a > img,.cs-play img { filter:invert(75%) sepia(45%) saturate(700%) hue-rotate(75deg) brightness(1.1); opacity:.9; }
/* Course identity, continuation, phase map and editorial curriculum. */
.cs-course { max-width:var(--cs-width); padding:28px 32px 80px; margin:auto; }
.cs-course h1,.cs-course h2,.cs-course h3 { color:var(--cs-ink); }
.cs-course h2 { font-size:21px; line-height:1.5; margin:0 0 22px; }
.cs-course-hero { position:relative; display:grid; grid-template-columns:minmax(0,1fr) 310px; gap:50px; align-items:center; padding:0 0 22px; }
.cs-breadcrumb { font-size:12px; color:var(--cs-muted); margin:0 0 20px; display:flex; gap:10px; align-items:center; font-family:var(--cs-mono); }
.cs-breadcrumb a { text-decoration:none; color:var(--cs-muted); }
.cs-course-hero h1 { font-size:42px; line-height:1.35; font-weight:700; letter-spacing:-1px; margin:0 0 16px; }
.cs-course-hero h1 span { margin-right:12px; color:var(--cs-blue); }
.cs-course-hero .cs-description { max-width:850px; color:var(--cs-muted); font-size:17px; line-height:1.85; margin:0 0 12px; }
.cs-course-question { margin:12px 0 0; font-size:13px; color:var(--cs-muted); border-left:2px solid var(--cs-blue); padding-left:12px; font-family:var(--cs-mono); }
.cs-course-meta { display:flex; flex-wrap:wrap; align-items:center; gap:10px 25px; padding:0 0 24px; color:var(--cs-muted); font-size:13px; }
.cs-course-meta > span,.cs-course-meta a { display:inline-flex; gap:7px; align-items:center; }
.cs-course-meta img { width:15px; height:15px; opacity:.5; }
.cs-course-meta a { text-decoration:none; }
.cs-study-overview { display:grid; grid-template-columns:minmax(0,2.2fr) minmax(260px,1fr); gap:20px; margin-bottom:36px; }
.cs-resume { display:grid; grid-template-columns:52px minmax(0,1fr) auto; gap:18px; align-items:center; padding:24px; background:var(--cs-soft); border:1px solid var(--cs-line); border-radius:6px; }
.cs-play { width:48px; height:48px; border-radius:50%; background:rgba(99,230,140,.12); display:grid; place-items:center; }
.cs-play img { width:21px; opacity:.65; }
.cs-resume-kicker { font-size:12px; color:var(--cs-muted); margin:0 0 4px; font-family:var(--cs-mono); }
.cs-resume h2 { font-size:18px; margin:0 0 6px; line-height:1.5; }
.cs-resume small { display:block; font-size:11px; color:var(--cs-muted); }
.cs-course progress,.cs-platform #home-resume progress { appearance:none; display:block; width:100%; height:5px; border:0; border-radius:5px; background:var(--cs-line); overflow:hidden; margin:10px 0 6px; }
.cs-course progress::-moz-progress-bar,.cs-platform #home-resume progress::-moz-progress-bar { background:var(--cs-blue); }
.cs-course progress::-webkit-progress-bar { background:var(--cs-line); }
.cs-course progress::-webkit-progress-value { background:var(--cs-blue); }
.cs-progress-panel { border:1px solid var(--cs-line); border-radius:6px; padding:17px 21px; }
.cs-progress-panel h2 { font-size:14px; margin:0 0 12px; font-weight:600; font-family:var(--cs-mono); }
.cs-progress-body { display:flex; gap:21px; align-items:center; }
.cs-progress-ring { --progress:0%; background:conic-gradient(var(--cs-blue) var(--progress),var(--cs-line) 0); border-radius:50%; width:78px; height:78px; flex:none; padding:6px; }
.cs-progress-ring > div { width:100%; height:100%; border-radius:50%; background:#0b0e0c; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.cs-progress-ring strong { font-size:18px; line-height:1.2; font-weight:600; font-family:var(--cs-mono); }
.cs-progress-ring small { color:var(--cs-muted); font-size:10px; }
.cs-progress-body p { font-size:12px; color:var(--cs-muted); margin:0; }
.cs-progress-body b { font-weight:600; color:var(--cs-ink); }
.cs-phase-section { margin:0 0 38px; }
.cs-phase-map { display:grid; grid-template-columns:repeat(var(--phases),minmax(0,1fr)); gap:0; list-style:none; padding:0; margin:0; }
.cs-phase-map li { position:relative; padding:0 12px; text-align:center; }
.cs-phase-map li::before { content:''; position:absolute; height:1px; background:var(--cs-line); left:0; right:0; top:17px; }
.cs-phase-map li:first-child::before { left:50%; }
.cs-phase-map li:last-child::before { right:50%; }
.cs-phase-map a { text-decoration:none; display:block; position:relative; }
.cs-phase-dot { width:35px; height:35px; border:1px solid var(--cs-line); background:#0b0e0c; border-radius:50%; display:grid; place-items:center; font:12px/1 var(--cs-mono); color:var(--cs-muted); margin:0 auto 11px; }
.cs-phase-map li.is-current .cs-phase-dot { background:var(--cs-blue); color:#07130c; border-color:var(--cs-blue); box-shadow:0 0 0 4px rgba(99,230,140,.15); }
.cs-phase-map strong { display:block; font-size:16px; color:var(--cs-ink); font-weight:600; margin-bottom:3px; }
.cs-phase-map small { color:var(--cs-muted); font-size:11px; display:block; font-family:var(--cs-mono); }
.cs-phase-map p { font-size:11px; line-height:1.6; color:var(--cs-muted); margin:6px auto 0; max-width:150px; }
.cs-modes { margin-bottom:42px; }
.cs-mode-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.cs-mode { padding:22px 23px; border:1px solid var(--cs-line); border-radius:6px; }
.cs-mode h3 { display:flex; align-items:center; gap:12px; font-size:20px; margin:0 0 14px; }
.cs-mode h3 img { width:26px; height:26px; opacity:.65; }
.cs-mode:nth-child(2) h3 img { filter:invert(56%) sepia(40%) saturate(500%); }
.cs-mode:nth-child(3) h3 img { filter:invert(45%) sepia(35%) saturate(500%); }
.cs-mode p { font-size:14px; line-height:1.85; color:var(--cs-muted); margin:0 0 15px; }
.cs-mode a { text-decoration:none; font-size:12px; display:inline-flex; gap:8px; align-items:center; }
.cs-mode a img { width:15px; opacity:.6; }
.cs-curriculum { border-top:1px solid var(--cs-line); padding-top:28px; scroll-margin-top:80px; }
.cs-curriculum-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:14px; }
.cs-curriculum-heading h2 { margin:0; }
.cs-course-search { width:280px; max-width:100%; padding:9px 13px; border:1px solid var(--cs-line); border-radius:4px; font:12px/1.4 var(--cs-mono)!important; background:var(--cs-soft); color:var(--cs-ink); }
.cs-search-count { color:var(--cs-muted); font-size:12px; margin:0; min-height:24px; }
.cs-course-group { margin:26px 0 34px; scroll-margin-top:90px; }
.cs-group-heading { display:flex; gap:12px; align-items:baseline; padding-bottom:12px; border-bottom:1px solid var(--cs-line); }
.cs-group-heading h3 { margin:0; font-size:17px; }
.cs-group-heading p { margin:0; font-size:12px; color:var(--cs-muted); }
.cs-lesson-list { padding:0; margin:0; list-style:none; }
.cs-lesson-row { display:flex; align-items:center; gap:18px; border-bottom:1px solid var(--cs-line); }
.cs-lesson-link { display:flex; gap:20px; align-items:center; min-height:62px; flex:1; min-width:0; text-decoration:none; padding:13px 8px; }
.cs-lesson-link:hover { background:var(--cs-soft); }
.cs-lesson-number { width:30px; flex:none; color:var(--cs-muted); font:12px var(--cs-mono); }
.cs-lesson-name { flex:1; color:var(--cs-ink); font-size:14px; }
.cs-lesson-status { font-size:11px; color:var(--cs-muted); flex:none; font-family:var(--cs-mono); }
.cs-lesson-row.is-complete .cs-lesson-status { color:var(--cs-blue); }
.cs-official-reading { white-space:nowrap; font-size:11px; padding:8px; }
.cs-source-footer { color:var(--cs-muted); font-size:12px; border-top:1px solid var(--cs-line); padding:20px 0; margin:24px 0 0; }
.cs-source-footer summary { cursor:pointer; }
.cs-course-footer { margin-top:32px; color:var(--cs-muted); font-size:12px; display:flex; justify-content:space-between; font-family:var(--cs-mono); }
.cs-anchor { scroll-margin-top:85px; }
@media(max-width:1000px) {
  .cs-header-inner { gap:25px; }.cs-study-overview { grid-template-columns:1.8fr 1fr; }.cs-resume { grid-template-columns:42px minmax(0,1fr); padding:20px; gap:14px; }.cs-resume > .cs-button { grid-column:2; justify-self:start; }
  .cs-phase-map p { display:none; }.cs-course-hero { grid-template-columns:1fr 210px; gap:20px; }.cs-art,.cs-art.globe { width:210px; }.cs-course-hero h1 { font-size:30px; }
}
@media(max-width:700px) {
  .cs-header-inner { gap:20px; padding:0 18px; }.cs-header .cs-wordmark { font-size:23px; }.cs-header nav { gap:18px; }.cs-header nav a:not(:first-child) { display:none; }.cs-search-trigger { width:34px; padding:8px; border:0; background:none; }.cs-search-trigger span,.cs-search-trigger kbd { display:none; }.cs-search-trigger img { width:19px; height:19px; }.cs-person { display:none; }
  .cs-course { padding:24px 20px 50px; }.cs-course-hero { grid-template-columns:1fr; padding-bottom:18px; }.cs-course-hero .cs-art { display:none; }.cs-course-hero h1 { font-size:28px; }.cs-course-meta { gap:10px 16px; }.cs-study-overview { grid-template-columns:1fr; gap:12px; margin-bottom:30px; }.cs-progress-panel { display:flex; align-items:center; gap:24px; padding:16px 20px; }.cs-progress-panel h2 { margin:0; }.cs-progress-ring { width:58px; height:58px; padding:4px; }.cs-progress-ring strong { font-size:15px; }.cs-progress-ring small { font-size:9px; }
  .cs-phase-map { grid-template-columns:1fr 1fr; gap:16px 10px; }.cs-phase-map li { padding:0; text-align:left; }.cs-phase-map li::before { display:none; }.cs-phase-map a { display:grid; grid-template-columns:34px 1fr; column-gap:10px; }.cs-phase-dot { width:29px; height:29px; grid-row:1/3; margin:4px 0; }.cs-phase-map strong { font-size:13px; }.cs-phase-map p { display:block; grid-column:2; margin:3px 0; max-width:none; font-size:11px; }
  .cs-mode-grid { grid-template-columns:1fr; gap:10px; }.cs-mode { padding:18px; }.cs-mode h3 { margin-bottom:8px; }.cs-mode p { margin-bottom:10px; }.cs-curriculum-heading { align-items:start; flex-direction:column; gap:14px; }.cs-course-search { width:100%; }.cs-curriculum-heading label { width:100%; }.cs-group-heading { align-items:start; flex-direction:column; gap:4px; }.cs-lesson-link { gap:10px; }.cs-lesson-name { font-size:13px; }.cs-lesson-status { font-size:10px; }.cs-lesson-number { width:22px; }.cs-official-reading { width:48px; white-space:normal; padding:0; font-size:10px; }.cs-course-footer { gap:20px; }
}
@media(prefers-reduced-motion:reduce) { .cs-platform * { scroll-behavior:auto!important; } }