/* ============================================================ terminal.css — site-wide dark terminal theme for all pages (the homepage supplies its own boot.css on top of this). Loaded LAST in , so it cleanly overrides main/dark.css. ============================================================ */ :root{ --t-bg:#0a0c10; --t-fg:#c9d1d9; --t-dim:#6e7681; --t-green:#3fb950; --t-amber:#d29922; --t-red:#f85149; --t-blue:#58a6ff; --t-cyan:#39c5cf; --t-border:#1f2630; --t-panel:#0f141b; --t-mono:'SF Mono',ui-monospace,'Cascadia Code','JetBrains Mono','Roboto Mono',Menlo,monospace; } html,body{ background:var(--t-bg); } body{ color:var(--t-fg); font-family:var(--t-mono); font-size:15px; line-height:1.65; -webkit-font-smoothing:antialiased; } /* subtle CRT scanline to echo the boot screen (very faint) */ body::before{ content:""; position:fixed; inset:0; pointer-events:none; z-index:200; background:repeating-linear-gradient(to bottom,rgba(255,255,255,.015) 0 1px,transparent 1px 3px); mix-blend-mode:overlay; } ::selection{ background:#264f78; color:#fff; } .wrapper{ max-width:780px; } .container{ margin:0 auto; padding:32px 22px 40px; } a{ color:var(--t-blue); text-decoration:none; border-bottom:none; } a:hover{ color:var(--t-cyan); } h1,h2,h3,h4,h5,h6{ font-family:var(--t-mono); color:#e6edf3; line-height:1.3; } hr{ border:none; height:1px; background:var(--t-border); margin:2rem 0; } /* ---------- shared terminal top bar (partials/head.html) ---------- */ .term-bar{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; color:var(--t-dim); border-bottom:1px solid var(--t-border); padding-bottom:12px; margin-bottom:28px; } .term-bar .tdot{ width:9px; height:9px; border-radius:50%; flex:0 0 auto; } .term-bar .tdot.red{ background:var(--t-red); } .term-bar .tdot.amber{ background:var(--t-amber); } .term-bar .tdot.green{ background:var(--t-green); } .term-bar .who{ color:var(--t-green); } .term-bar .tpath{ color:var(--t-blue); overflow-wrap:anywhere; min-width:0; } .term-bar .term-nav{ margin-left:auto; display:flex; gap:16px; flex-wrap:wrap; } .term-bar .term-nav a{ color:var(--t-dim); } .term-bar .term-nav a:hover{ color:var(--t-cyan); } /* ---------- command prompt lines ---------- */ .cmd{ margin-bottom:18px; display:flex; flex-wrap:wrap; gap:0 8px; align-items:baseline; } .prompt{ color:var(--t-green); } .comment{ color:var(--t-dim); } .cmd .tpath{ color:var(--t-blue); } /* ---------- list page = `ls -la` ---------- */ .ls{ list-style:none; margin:0; padding:0; border:1px solid var(--t-border); border-radius:8px; } .lsrow{ display:grid; grid-template-columns:auto auto minmax(0,1fr); gap:6px 16px; align-items:baseline; padding:12px 16px; border-bottom:1px solid var(--t-border); } .lsrow:last-child{ border-bottom:none; } .lsrow:hover{ background:#11161d; } .perm{ color:var(--t-dim); white-space:nowrap; } .lsdate{ color:var(--t-amber); white-space:nowrap; } .lsname{ color:var(--t-cyan); font-weight:500; min-width:0; overflow-wrap:anywhere; } .lsname:hover{ color:#7ee0e8; } .lsdesc{ grid-column:2 / -1; color:var(--t-dim); font-size:13px; line-height:1.5; } .draft-label{ color:var(--t-red); font-size:12px; } /* ---------- single post ---------- */ .term-page .post{ margin:0; } .title{ font-size:24px; margin:6px 0 10px; } .title .hash{ color:var(--t-green); } .post-meta{ color:var(--t-dim); font-size:13px; display:flex; flex-wrap:wrap; gap:8px; margin-bottom:26px; } .post-meta .mtag{ color:var(--t-amber); } .post-meta .mtag:hover{ color:#e8c15a; } .markdown{ line-height:1.8; } .markdown h1,.markdown h2,.markdown h3,.markdown h4{ margin:1.8em 0 .6em; } .markdown h2{ font-size:19px; color:#e6edf3; padding-bottom:.3em; border-bottom:1px solid var(--t-border); } .markdown h2::before{ content:"## "; color:var(--t-dim); } .markdown h3{ font-size:17px; } .markdown h3::before{ content:"### "; color:var(--t-dim); } .markdown p{ margin:0 0 1.2em; } .markdown a{ color:var(--t-blue); text-decoration:underline; text-decoration-color:#2b4a6b; text-underline-offset:3px; } .markdown a:hover{ color:var(--t-cyan); text-decoration-color:var(--t-cyan); } .markdown ul,.markdown ol{ margin:0 0 1.2em; padding-left:1.4em; } .markdown li{ margin:.3em 0; } .markdown ul li{ list-style:none; position:relative; } .markdown ul li::before{ content:"▸"; color:var(--t-green); position:absolute; left:-1.2em; } .markdown img{ max-width:100%; height:auto; border:1px solid var(--t-border); border-radius:6px; } .markdown blockquote{ margin:1.2em 0; padding:.4em 1.1em; color:var(--t-dim); border-left:3px solid var(--t-green); background:var(--t-panel); border-radius:0 6px 6px 0; } .markdown blockquote p{ margin:.4em 0; } .markdown table{ width:100%; border-collapse:collapse; margin:1.2em 0; display:block; overflow-x:auto; } .markdown th,.markdown td{ border:1px solid var(--t-border); padding:8px 12px; text-align:left; } .markdown th{ background:var(--t-panel); color:#e6edf3; } /* inline code */ .markdown code{ font-family:var(--t-mono); font-size:.9em; background:var(--t-panel); border:1px solid var(--t-border); border-radius:5px; padding:1px 6px; color:#f0f6fc; } /* code blocks (Chroma github-dark supplies span colors + bg) */ .markdown pre{ border:1px solid var(--t-border); border-radius:8px; padding:14px 16px; overflow-x:auto; margin:1.3em 0; line-height:1.5; } .markdown pre code{ background:none; border:none; padding:0; font-size:.88em; } .highlight{ margin:1.3em 0; } .highlight pre{ margin:0; } /* line-number table cells (lineNumbersInTable) */ .highlight table{ display:block; overflow-x:auto; border:none; margin:0; } .highlight table td{ border:none; padding:0; } .highlight .lnt,.highlight .ln{ color:var(--t-dim); user-select:none; } .post-nav{ margin-top:34px; padding-top:16px; border-top:1px solid var(--t-border); } .post-nav a{ color:var(--t-green); } .post-nav a:hover{ color:var(--t-cyan); } /* ---------- about page ---------- */ .term-page .page-header{ display:flex; align-items:center; gap:22px; flex-wrap:wrap; margin-bottom:8px; } .term-page .profile-container{ margin:0; text-align:left; } .term-page .profile-picture{ width:120px; height:120px; border-radius:8px; border:1px solid var(--t-border); object-fit:cover; box-shadow:none; } .term-page .bio-greeting{ font-family:var(--t-mono); font-size:22px; color:#e6edf3; margin:0; } .term-page .page-content{ line-height:1.8; } .term-page .page-content h2{ font-size:18px; margin:1.8em 0 .6em; color:var(--t-green); } .term-page .page-content h2::before{ content:"## "; color:var(--t-dim); } .term-page .page-content a{ color:var(--t-blue); } .term-page .page-content a:hover{ color:var(--t-cyan); } .term-page .page-content strong,.term-page .page-content b{ color:#e6edf3; } /* ---------- tags / terms ---------- */ .page-title{ font-family:var(--t-mono); font-size:20px; color:#e6edf3; } .page-title::before{ content:"$ "; color:var(--t-green); } .tag-cloud{ line-height:2.4; } .tag-cloud a{ color:var(--t-cyan); margin-right:14px; } .tag-cloud a:hover{ color:#7ee0e8; } .tag-cloud a sup{ color:var(--t-dim); } /* ---------- footer ---------- */ .term-footer{ max-width:780px; margin:0 auto; padding:16px 22px 40px; color:var(--t-dim); font-size:12px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; border-top:1px solid var(--t-border); } .term-footer a{ color:var(--t-dim); } .term-footer a:hover{ color:var(--t-green); } @media (max-width:600px){ .term-bar .term-nav{ margin-left:0; flex-basis:100%; } .term-footer{ flex-direction:column; } }