:root {
  color-scheme: light;
  --bg: #ffffff;
  --panel: #ffffff;
  --panel-raised: #f3f5f7;
  --line: #d3d9df;
  --muted: #5d6872;
  --text: #18212a;
  --blue: #145da0;
  --mint: #315d7c;
  --amber: #8a5700;
  font-family: "DM Sans", sans-serif;
}

* { box-sizing: border-box; }
body {
  margin: 0;
  min-height: 100vh;
  background: var(--bg);
  color: var(--text);
}
button, input, textarea { font: inherit; }
button { cursor: pointer; }
.shell { max-width: 1180px; width: min(100% - 40px, 1180px); margin: 0 auto; }
.masthead { display:flex; align-items:center; justify-content:space-between; height:88px; border-bottom:1px solid #ffffff12; }
.brand { display:flex; gap:13px; align-items:center; color:inherit; text-decoration:none; }
.brand-mark { display:grid; place-items:center; width:44px; height:44px; border:1px solid var(--blue); color:var(--blue); font:700 18px "DM Mono", monospace; }
.brand strong, .brand small { display:block; }
.brand strong { font:700 15px "Space Grotesk",sans-serif; letter-spacing:.13em; }
.brand small, .clock, .eyebrow, footer { font-family:"DM Mono",monospace; }
.brand small { color:var(--muted); font-size:10px; margin-top:5px; letter-spacing:.08em; }
.clock { color:#71839e; font-size:11px; letter-spacing:.09em; }
.top-nav { position:sticky; top:0; z-index:20; display:flex; gap:6px; overflow-x:auto; padding:8px 0; background:#fff; border-bottom:1px solid var(--line); }
.top-nav a { flex:0 0 auto; padding:10px 14px; color:var(--muted); border:1px solid transparent; font-size:13px; font-weight:700; text-decoration:none; }
.top-nav a:hover,.top-nav a[aria-current="location"] { color:var(--blue); background:#f3f7fb; border-color:#c8d8e8; }
.top-nav a:focus-visible { outline:2px solid var(--blue); outline-offset:2px; }
main { padding:34px 0 64px; }
.panel { background:linear-gradient(145deg,#132139,#101a2b); border:1px solid var(--line); border-radius:9px; box-shadow:0 16px 45px #00000020; }
.hero { position:relative; overflow:hidden; display:flex; align-items:center; justify-content:space-between; gap:32px; min-height:350px; padding:46px clamp(24px,5vw,62px); background:radial-gradient(ellipse at 82% 50%,#e6f1fb 0,transparent 38%),linear-gradient(115deg,#fff,#f8fafc); }
.hero-copy { position:relative; z-index:1; max-width:620px; }
.eyebrow { margin:0 0 10px; color:var(--mint); font-size:10px; letter-spacing:.16em; }
h1,h2,h3,p { margin-top:0; }
.hero h1 { margin:0 0 16px; color:#152a40; font:700 clamp(34px,5vw,54px)/1.2 "Space Grotesk",sans-serif; letter-spacing:-.05em; }
.hero-copy>p:not(.eyebrow) { margin:0; color:#526170; font-size:15px; line-height:1.9; }
.hero-actions { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-top:24px; }
.hero-link { display:inline-flex; gap:14px; align-items:center; margin:0; padding:12px 16px; color:#fff; background:var(--blue); border:1px solid var(--blue); font-size:12px; font-weight:700; text-decoration:none; }
.terminal-connect-trigger { cursor:pointer; font:700 12px "DM Sans",sans-serif; }
.hero-link span { font-size:16px; transition:transform .2s ease; }
.hero-link:hover span { transform:translateX(4px); }
.hero-secondary-link { padding:12px 14px; color:#35414c; font-size:12px; font-weight:700; text-decoration:none; }
.hero-secondary-link:hover,.directory-heading>a:hover,.product-flow>a:hover { color:var(--blue); text-decoration:underline; text-underline-offset:4px; }
.hero-tags { display:flex; flex-wrap:wrap; gap:8px; margin-top:22px; }
.hero-tags span { padding:6px 9px; color:#465768; background:#ffffffc9; border:1px solid #dce5ec; font-size:10px; }
.hero-display { position:relative; display:grid; grid-template-rows:auto 1fr auto; flex:0 0 min(38%,400px); min-width:300px; height:260px; padding:20px 22px; overflow:hidden; color:#dcecff; background:linear-gradient(145deg,#172b3d,#0c1722); border:1px solid #34495c; box-shadow:0 20px 44px #19314d20; font:11px "DM Mono",monospace; }
.hero-display-top,.hero-display-bottom { display:flex; justify-content:space-between; align-items:center; gap:8px; }
.hero-display-top { color:#afc4d9; font-size:9px; letter-spacing:.1em; }
.online-dot { color:#83d5a5; }
.online-dot::first-letter { animation:status-blink 1.8s steps(2,end) infinite; }
.hero-display-bottom { color:#c8d7e5; }
.hero-display-status { color:#83d5a5; letter-spacing:.12em; }
.connection-diagram { display:flex; align-items:center; justify-content:center; gap:10px; }
.connection-node { position:relative; z-index:1; display:grid; place-items:center; width:100px; height:80px; color:#f1f6fc; background:#203a50; border:1px solid #42627c; text-align:center; font-size:13px; line-height:1.5; }
.connection-node:first-child { animation:node-glow 3.4s ease-in-out infinite; }
.connection-node:last-child { animation:node-glow 3.4s ease-in-out 1.7s infinite; }
.connection-node small { color:#afc4d9; font-size:8px; }
.connection-link { position:relative; display:flex; align-items:center; gap:2px; color:#a9d8bd; font-size:8px; }
.connection-link i { display:block; width:24px; height:2px; background:#83d5a5; animation:link-pulse 1.8s ease-in-out infinite; }
.connection-link i:last-child { animation-delay:.9s; }
@keyframes link-pulse { 50% { opacity:.25; transform:scaleX(.45); } }
@keyframes node-glow { 50% { border-color:#83d5a5; box-shadow:0 0 18px #83d5a530; } }
@keyframes status-blink { 50% { opacity:.35; } }
.ascii { z-index:1; margin:0 42px 0 0; color:#83bcff; font:12px/1.6 "DM Mono",monospace; opacity:.83; }
.product-overview { margin:34px 0 38px; }
.product-heading { max-width:700px; margin:0 auto 20px; text-align:center; }
.product-heading h2 { margin:0 0 9px; color:#1b2b3a; font-size:clamp(21px,3vw,27px); line-height:1.45; }
.product-heading>p:last-child { margin:0; color:var(--muted); font-size:13px; line-height:1.8; }
.product-features { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.product-card { min-height:174px; padding:21px 20px; background:#fff; border:1px solid #dce3e9; box-shadow:0 6px 18px #18344d08; }
.product-number { display:grid; place-items:center; width:30px; height:30px; margin-bottom:14px; color:var(--blue); background:#edf5fc; font:700 11px "DM Mono",monospace; }
.product-card h3 { margin:0 0 8px; color:#1b2b3a; font-size:15px; }
.product-card p { margin:0; color:#5d6872; font-size:12px; line-height:1.8; }
.product-flow { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:14px; padding:17px 20px; background:#f4f8fb; border:1px solid #dce7ef; }
.product-flow>span { display:grid; gap:5px; }
.product-flow>span b { color:#263847; font-size:12px; }
.product-flow>span small { color:var(--muted); font-size:10px; }
.product-flow>i { color:#8b9aaa; font-style:normal; }
.product-flow>a,.directory-heading>a { display:inline-flex; align-items:center; gap:8px; color:var(--blue); font-size:11px; font-weight:700; text-decoration:none; white-space:nowrap; }
.directory-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin:0 0 12px; }
.directory-heading .eyebrow { margin-bottom:7px; }
.directory-heading h2 { margin:0 0 6px; color:#1b2b3a; font-size:24px; }
.directory-heading p:last-child { margin:0; color:var(--muted); font-size:12px; line-height:1.7; }
.directory-heading>a { margin-bottom:4px; }
.auth-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin:28px 0 38px; }
.auth-panel { padding:26px; }
h2 { font:600 20px "Space Grotesk",sans-serif; letter-spacing:-.02em; }
.auth-panel h2 { margin-bottom:22px; }
label { display:grid; gap:7px; color:#bdc9da; font-size:12px; }
input,textarea { width:100%; min-width:0; border:1px solid #31435f; border-radius:5px; padding:11px 12px; color:var(--text); background:#0b1525; outline:none; }
input:focus,textarea:focus { border-color:var(--blue); box-shadow:0 0 0 3px #70a7ff20; }
form { display:grid; gap:14px; }
button { border:0; border-radius:5px; padding:11px 15px; color:#081322; background:var(--blue); font-weight:700; transition:filter .15s,transform .15s; }
button:hover { filter:brightness(1.1); transform:translateY(-1px); }
form>button { margin-top:3px; }
form>button span { float:right; }
.secondary-button { background:#203653; color:#d5e5fb; border:1px solid #38577d; }
.welcome-row { display:flex; justify-content:space-between; align-items:center; margin:28px 0 16px; }
.welcome-row h2 { margin-bottom:0; }
.welcome-actions { display:flex; gap:8px; }
.quiet-button { background:transparent; color:#b5c2d5; border:1px solid #34445c; }
.board-layout { display:grid; grid-template-columns:260px minmax(0,1fr); gap:16px; align-items:start; }
.messages-panel { margin-bottom:16px; }
.messages-layout { display:grid; grid-template-columns:minmax(220px,.8fr) minmax(0,1.2fr); gap:16px; }
.message-list,.message-compose { display:grid; gap:10px; align-content:start; }
.message-item { display:grid; grid-template-columns:1fr auto; gap:5px 12px; text-align:left; }
.message-item small { grid-column:1/-1; }
.message-item.unread strong,.message-item.unread span { font-weight:700; color:var(--blue); }
.message-detail { min-height:110px; padding:16px; border:1px solid var(--line); }
.message-detail pre { white-space:pre-wrap; overflow-wrap:anywhere; padding-top:14px; border-top:1px solid var(--line); color:#d1dced; }
.board-panel,.content-panel,.sysop-panel { padding:22px; }
.section-heading { display:flex; justify-content:space-between; align-items:center; margin-bottom:16px; }
.section-heading h2 { margin:0; }
#board-list { display:grid; gap:7px; }
.board-link { display:block; width:100%; text-align:left; padding:12px; border:1px solid transparent; background:transparent; color:var(--text); }
.board-link:hover,.board-link.active { background:var(--panel-raised); border-color:#314a6b; transform:none; }
.board-link strong,.board-link small { display:block; }
.board-link strong { font-size:13px; }
.board-link small { margin-top:5px; color:var(--muted); font:10px "DM Mono",monospace; }
.empty-state { min-height:310px; display:grid; align-content:center; justify-items:center; text-align:center; color:var(--muted); }
.empty-state h2 { margin:14px 0 6px; color:var(--text); }
.empty-state p { margin:0; font-size:13px; }
.empty-icon { color:var(--blue); font-size:30px; }
.board-title-row { display:flex; align-items:center; justify-content:space-between; gap:14px; padding-bottom:16px; border-bottom:1px solid var(--line); }
.board-title-row h2 { margin:0; }
.board-title-row p { margin:5px 0 0; color:var(--muted); font-size:12px; }
.post-table { width:100%; border-collapse:collapse; margin-top:10px; }
.post-table th,.post-table td { text-align:left; padding:13px 10px; border-bottom:1px solid #ffffff0d; font-size:12px; }
.post-table th { color:var(--muted); font:10px "DM Mono",monospace; }
.post-open { padding:0; border:0; background:none; color:var(--text); text-align:left; font-weight:600; }
.post-open:hover { color:var(--blue); transform:none; }
.post-meta { color:var(--muted); white-space:nowrap; }
.back-link { padding:0; margin-bottom:18px; background:none; color:var(--blue); }
.post-detail h2 { font-size:25px; margin-bottom:12px; }
.post-detail pre { white-space:pre-wrap; overflow-wrap:anywhere; color:#d1dced; font:14px/1.8 "DM Sans",sans-serif; padding:22px 0; border-top:1px solid var(--line); }
.sysop-panel { margin-top:16px; }
.sysop-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.site-builder { margin-top:22px; padding-top:20px; border-top:1px solid var(--line); }
.site-builder-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.builder-card { min-width:0; padding:17px; border:1px solid var(--line); background:#fff; }
.builder-card h3 { margin:0 0 14px; font-size:15px; }
.builder-card label { color:#35414c; font-size:11px; }
.builder-card input,.builder-card textarea,.builder-card select { color:var(--text); background:#fff; border:1px solid #aeb8c2; border-radius:0; }
.builder-card .checkbox-label { display:flex; align-items:center; gap:8px; }
.builder-card .checkbox-label input { width:auto; min-width:auto; margin:0; }
.form-actions,.builder-item-actions { display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
.builder-item-actions button { padding:6px 8px; font-size:11px; }
.builder-list-item { display:flex; justify-content:space-between; align-items:center; gap:10px; padding:9px 0; border-bottom:1px solid #e4e8ec; font-size:11px; }
.builder-list-item>span { min-width:0; overflow-wrap:anywhere; }
.builder-item-list { margin-top:14px; }
.builder-list-item .quiet-button { padding:6px 8px; }
.builder-list-item .danger-button { padding:6px 8px; }
.builder-list-item button:disabled { opacity:.45; cursor:not-allowed; }
.site-page-view { margin-top:18px; padding:24px; }
.site-page-view h1 { margin-bottom:8px; font-size:clamp(23px,3vw,32px); }
.site-page-content { color:#35414c; white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.8; }
.download-link { display:inline-block; margin-top:7px; color:var(--blue); font-size:12px; font-weight:700; overflow-wrap:anywhere; }
.download-dialog { max-width:600px; }
.post-form input[type="file"] { padding:8px; }
.compact-form { align-content:start; padding:17px; border:1px solid #293d59; border-radius:6px; background:#0d1727; }
.compact-form h3 { margin:0 0 4px; font-size:14px; }
.compact-form label { font-size:11px; }
.inline-fields { display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.sysop-board-row { display:flex; justify-content:space-between; align-items:center; gap:8px; border-bottom:1px solid #ffffff10; padding:9px 0; font-size:11px; }
.sysop-board-row small { color:var(--muted); }
.danger-button { background:#532a35; color:#ffd7de; padding:7px 9px; font-size:10px; }
.notice { position:fixed; right:22px; bottom:22px; max-width:min(420px,calc(100vw - 44px)); padding:13px 17px; color:#e7eefb; background:#192b43; border:1px solid #38577d; border-radius:6px; box-shadow:0 12px 30px #0008; font-size:13px; }
.notice.error { border-color:#a34b5b; }
.hidden { display:none !important; }
footer { display:flex; justify-content:space-between; padding:20px 0 30px; color:#73839a; font-size:9px; letter-spacing:.1em; }
dialog { width:min(600px,calc(100% - 32px)); padding:0; color:var(--text); background:#111d31; border:1px solid #3a5272; border-radius:8px; box-shadow:0 30px 100px #000b; }
dialog::backdrop { background:#050b14c9; backdrop-filter:blur(4px); }
.post-form { padding:24px; }
.dialog-heading,.dialog-actions { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.dialog-heading h2 { margin-bottom:5px; }
.dialog-heading .quiet-button { font-size:22px; padding:4px 11px; }
textarea { resize:vertical; line-height:1.6; }
.dialog-actions { justify-content:flex-end; margin-top:5px; }

body { color:var(--text); }
.panel,.compact-form,dialog { background:#fff; border-color:var(--line); border-radius:0; box-shadow:none; }
.ascii { display:none; }
.hero { background:radial-gradient(ellipse at 82% 50%,#e6f1fb 0,transparent 38%),linear-gradient(115deg,#fff,#f8fafc); border-color:#dbe5ed; box-shadow:0 12px 35px #1734510c; }
.hero h1,h2,.empty-state h2,.post-detail h2 { color:var(--text); }
label { color:#35414c; }
.brand-mark { border-color:var(--line); color:var(--blue); }
.eyebrow,.clock,.brand small,footer { color:var(--muted); }
.setup-manual { padding:22px; }
.setup-screenshot { width:min(100%,716px); margin:0 auto 24px; text-align:center; }
.setup-screenshot img { display:block; width:100%; height:auto; border:1px solid var(--line); box-shadow:0 12px 26px #17345112; animation:image-float 7s ease-in-out infinite; }
@keyframes image-float { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-5px); } }
.setup-screenshot figcaption { margin-top:7px; color:var(--muted); font-size:11px; }
.setup-manual-heading { margin:0 auto 22px; max-width:760px; text-align:center; }
.setup-manual-heading h1 { margin:0 0 9px; font-size:clamp(24px,4vw,34px); }
.setup-manual-heading>p:last-child { margin-bottom:0; color:var(--muted); font-size:13px; line-height:1.7; }
.manual-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.manual-card { min-width:0; padding:18px; border:1px solid var(--line); }
.manual-card h2 { margin:0 0 10px; font-size:16px; }
.manual-card p,.manual-card li { color:#35414c; font-size:13px; line-height:1.7; }
.manual-card ol,.manual-card ul { display:grid; gap:7px; padding-left:20px; }
.manual-card a { color:var(--blue); overflow-wrap:anywhere; }
.manual-card pre { overflow-x:auto; padding:12px; background:#f3f5f7; border:1px solid var(--line); font:12px/1.7 "DM Mono",monospace; }
.manual-card .manual-note { margin-bottom:0; color:var(--muted); font-size:11px; }
.guide-link { display:inline-block; margin-top:4px; font-weight:700; text-decoration:none; }
.terminal-guide { margin-top:16px; padding:20px; color:#e4edf7; background:#101a25; border:1px solid #26384a; }
.terminal-heading { max-width:900px; margin-bottom:22px; }
.terminal-heading h2 { margin:0 0 8px; color:#f1f6fc; font-size:clamp(23px,3vw,30px); }
.terminal-heading>p:last-child { margin:0; color:#b5c2cf; font-size:14px; line-height:1.8; }
.terminal-guide .eyebrow { color:#74c69d; }
.terminal-visual { position:relative; isolation:isolate; display:grid; grid-template-rows:auto 1fr auto; min-height:380px; margin:0 0 20px; overflow:hidden; color:#e7f2fc; background:radial-gradient(ellipse at 76% 50%,#17405a88,transparent 42%),linear-gradient(120deg,#0b1722,#10283a 55%,#0b1722); border:1px solid #34546b; box-shadow:0 18px 44px #050b1270; }
.terminal-visual::before { position:absolute; z-index:-1; inset:0; background-image:linear-gradient(#a7d6f00a 1px,transparent 1px),linear-gradient(90deg,#a7d6f00a 1px,transparent 1px); background-size:34px 34px; content:""; mask-image:linear-gradient(90deg,transparent,#000 25%,#000 85%,transparent); }
.terminal-visual::after { position:absolute; z-index:2; inset:0; pointer-events:none; background:linear-gradient(transparent 50%,#ffffff05 51%); background-size:100% 5px; content:""; opacity:.2; }
.terminal-visual-bar { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; min-height:43px; padding:0 18px; color:#aabed0; background:#07111ad9; border-bottom:1px solid #345064; font:9px "DM Mono",monospace; letter-spacing:.11em; }
.terminal-window-dots { display:flex; gap:6px; }
.terminal-window-dots i { width:8px; height:8px; background:#537082; border-radius:50%; }
.terminal-window-dots i:first-child { background:#e48777; }
.terminal-window-dots i:nth-child(2) { background:#e5bc66; }
.terminal-window-dots i:nth-child(3) { background:#75c98d; }
.terminal-window-state { justify-self:end; color:#88dfa9; letter-spacing:.06em; }
.terminal-window-state i { display:inline-block; width:7px; height:7px; margin-right:5px; background:#88dfa9; border-radius:50%; box-shadow:0 0 10px #88dfa9a0; animation:status-blink 1.8s steps(2,end) infinite; }
.terminal-visual-main { display:grid; grid-template-columns:minmax(210px,.72fr) minmax(0,1.8fr); align-items:center; gap:22px; padding:38px clamp(20px,4vw,48px); }
.terminal-visual-copy { max-width:290px; }
.terminal-visual-kicker { margin:0 0 11px; color:#83d5a5; font:10px "DM Mono",monospace; letter-spacing:.14em; }
.terminal-visual-copy h3 { margin:0 0 11px; color:#f3f8fc; font-size:clamp(21px,3vw,30px); line-height:1.4; }
.terminal-visual-copy>p:last-child { margin:0; color:#aabed0; font-size:12px; line-height:1.8; }
.terminal-route { display:grid; grid-template-columns:minmax(100px,1fr) minmax(105px,.9fr) minmax(115px,1fr) minmax(105px,.9fr) minmax(100px,1fr); align-items:center; min-width:0; }
.terminal-route-node { position:relative; z-index:1; display:grid; justify-items:center; align-content:center; gap:8px; min-width:0; min-height:132px; padding:14px 8px; color:#e9f4fc; background:#152e40eF; border:1px solid #42647c; text-align:center; animation:route-node-glow 4.5s ease-in-out infinite; }
.terminal-route-node.route-server { animation-delay:1.5s; }
.terminal-route-node.route-bbs { animation-delay:3s; }
.route-node-icon { display:grid; place-items:center; width:44px; height:44px; color:#b6e4ca; background:#1b4051; border:1px solid #3b6b70; font:20px "DM Mono",monospace; }
.route-bbs .route-node-icon { color:#fff; background:#145da0; border-color:#68a8d7; font-size:13px; }
.terminal-route-node strong { font-size:12px; }
.terminal-route-node small { color:#a9bdcd; font-size:9px; }
.terminal-route-link { position:relative; display:grid; justify-items:center; gap:6px; min-width:0; color:#95dfb2; text-align:center; font:9px "DM Mono",monospace; }
.terminal-route-link i { position:relative; display:block; width:100%; height:2px; overflow:hidden; background:#42677a; }
.terminal-route-link i::after { position:absolute; top:-2px; left:-18px; width:13px; height:6px; background:#a7f1be; border-radius:50%; box-shadow:0 0 12px 4px #72d99aa0; content:""; animation:route-packet 2.2s linear infinite; }
.terminal-route-link b { color:#c2d6e5; font-weight:400; }
.route-internal { color:#9dc8ea; }
.route-internal i::after { animation-delay:1.1s; background:#a8d5fa; box-shadow:0 0 12px 4px #72b4eaa0; }
.terminal-visual-command { display:flex; align-items:center; gap:12px; min-width:0; min-height:48px; padding:10px 18px; color:#b8f3ce; background:#050d13d9; border-top:1px solid #345064; font:12px/1.6 "DM Mono",monospace; }
.terminal-prompt { flex:0 0 auto; color:#79c99b; }
.terminal-visual-command code { min-width:0; overflow-wrap:anywhere; color:#e2f5e8; }
.terminal-cursor { width:7px; height:15px; flex:0 0 auto; background:#88dfa9; animation:cursor-blink 1s steps(2,end) infinite; }
@keyframes route-node-glow { 50% { border-color:#75c99d; box-shadow:0 0 24px #4ba87524; } }
@keyframes route-packet { to { left:calc(100% + 18px); } }
@keyframes cursor-blink { 50% { opacity:0; } }
.connection-specs { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); margin-bottom:18px; border:1px solid #304253; }
.connection-specs>div { display:grid; gap:5px; padding:13px; border-right:1px solid #304253; }
.connection-specs>div:last-child { border-right:0; }
.connection-specs span,.connection-specs small { color:#aab8c5; font-size:11px; }
.connection-specs strong { color:#f1f6fc; font:600 13px "DM Mono",monospace; overflow-wrap:anywhere; }
.terminal-steps { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.terminal-steps article { min-width:0; padding:20px; border:1px solid #304253; }
.terminal-steps h3 { margin:0 0 9px; color:#f1f6fc; font-size:15px; }
.terminal-steps h3 span { display:inline-grid; place-items:center; width:23px; height:23px; margin-right:5px; color:#101a25; background:#74c69d; border-radius:50%; font:700 12px "DM Mono",monospace; }
.terminal-steps p { color:#c0ccd8; font-size:13px; line-height:1.8; }
.terminal-screen { max-width:100%; overflow-x:auto; padding:15px; color:#b8f3ce; background:#07100c; border:1px solid #294639; font:13px/1.8 "DM Mono",monospace; }
.terminal-screen code { white-space:pre; }
.terminal-steps .manual-note { margin-bottom:0; color:#aab8c5; font-size:11px; }
.service-setup { margin-top:14px; padding:14px 16px; border:1px dashed #466052; }
.service-setup strong { color:#e4edf7; font-size:12px; }
.service-setup .terminal-screen { margin:9px 0; }
.service-setup .manual-note { margin:0; color:#aab8c5; font-size:11px; }
.nginx-note { margin-top:14px; padding:14px 16px; color:#c0ccd8; background:#172431; border-left:3px solid #74c69d; }
.nginx-note strong { color:#f1f6fc; font-size:13px; }
.nginx-note p { margin:6px 0 0; font-size:12px; line-height:1.7; }
input,textarea { color:var(--text); background:#fff; border-color:#aeb8c2; border-radius:0; }
input:focus,textarea:focus { border-color:var(--blue); box-shadow:0 0 0 2px #145da01c; }
button { color:#fff; background:var(--blue); border-radius:0; }
.secondary-button { color:var(--text); background:#f3f5f7; border-color:var(--line); }
.quiet-button { color:var(--text); background:#fff; border-color:var(--line); }
.board-link { color:var(--text); }
.board-link:hover,.board-link.active { background:var(--panel-raised); border-color:var(--line); }
.board-link small,.board-title-row p,.post-meta,.empty-state,.post-detail pre,.message-detail pre { color:var(--muted); }
.post-table th,.post-table td { border-color:#e4e8ec; }
.post-open { color:var(--text); }
.post-open:hover { color:var(--blue); }
.back-link { color:var(--blue); }
.post-detail pre { border-color:var(--line); }
.sysop-board-row { border-color:#e4e8ec; }
.sysop-board-row small { color:var(--muted); }
.danger-button { color:#8b1f2c; background:#fff; border:1px solid #d5a5aa; }
.notice { color:var(--text); background:#fff; border-color:var(--line); border-radius:0; box-shadow:0 3px 12px #00000012; }
.notice.error { border-color:#b54c58; }
dialog { color:var(--text); }
dialog::backdrop { background:#15202b4d; backdrop-filter:none; }
.terminal-connect-dialog { width:min(620px,calc(100% - 32px)); }
.terminal-connect-content { display:grid; gap:16px; padding:24px; }
.terminal-connect-content .dialog-heading { align-items:flex-start; }
.terminal-connect-content .dialog-heading h2 { margin:0; color:var(--text); font-size:21px; }
.terminal-connect-banner { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:15px; padding:18px; color:#effff5; background:linear-gradient(115deg,#102b38,#15523e); border:1px solid #33775a; text-decoration:none; }
.terminal-connect-banner:hover { border-color:#79d7a4; box-shadow:0 8px 24px #17613a30; }
.terminal-connect-banner-icon { display:grid; place-items:center; width:48px; height:48px; color:#a5efbd; background:#0b1c25; border:1px solid #559573; font:700 16px "DM Mono",monospace; }
.terminal-connect-banner strong,.terminal-connect-banner small { display:block; }
.terminal-connect-banner strong { font-size:15px; }
.terminal-connect-banner small { margin-top:4px; color:#bad8c8; font-size:11px; }
.terminal-connect-banner-arrow { color:#a5efbd; font-size:23px; }
.terminal-port-warning { padding:13px 15px; color:#5b410d; background:#fff6dc; border:1px solid #e8ca76; border-left:4px solid #c38b16; }
.terminal-port-warning strong { display:block; margin-bottom:5px; font-size:12px; }
.terminal-port-warning p { margin:0; font-size:12px; line-height:1.75; }
.terminal-connect-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.terminal-connect-options article { padding:13px 15px; background:#f3f7fa; border:1px solid #d5e0e8; }
.terminal-connect-options strong { display:block; margin-bottom:5px; color:#263847; font-size:12px; }
.terminal-connect-options p { margin:0; color:#526170; font-size:11px; line-height:1.75; }
.terminal-connect-options code { color:#145da0; font:11px "DM Mono",monospace; }
.terminal-connect-note { margin:0; color:#526170; font-size:12px; line-height:1.75; }
.terminal-connect-content .terminal-account-label { color:#35414c; }
.terminal-command-copy { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:stretch; gap:8px; }
.terminal-command-copy code { display:flex; align-items:center; min-width:0; overflow-wrap:anywhere; padding:12px; color:#b8f3ce; background:#0b1720; border:1px solid #294639; font:12px/1.6 "DM Mono",monospace; }
.terminal-command-copy button { white-space:nowrap; }
.keyboard-hint { margin:12px 0 0; color:var(--muted); font:11px "DM Mono",monospace; }
input[type="number"] { font-variant-numeric:tabular-nums; }
#auth-view,#bbs-view,#terminal-guide,#guide-view,#site-page-view { scroll-margin-top:72px; }
html { scroll-behavior:smooth; }

@media(max-width:760px) {
  .shell { width:min(100% - 24px,1180px); }
  .masthead { height:72px; }
  .clock,.ascii { display:none; }
  .top-nav { margin:0 -12px; padding:7px 12px; }
  .top-nav a { padding:9px 11px; font-size:12px; }
  main { padding-top:20px; }
  .hero { min-height:300px; padding:30px; }
  .hero-display { flex-basis:250px; height:220px; }
  .auth-grid,.board-layout,.messages-layout,.manual-grid,.terminal-steps,.site-builder-grid { grid-template-columns:1fr; }
  .board-panel { padding:16px; }
  .setup-manual { padding:16px; }
  .terminal-guide { padding:16px; }
  .terminal-connect-content { padding:18px; }
  .terminal-connect-options { grid-template-columns:1fr; }
  .terminal-visual { min-height:0; }
  .terminal-visual-main { grid-template-columns:1fr; gap:20px; padding:24px; }
  .terminal-visual-copy { max-width:600px; }
  .terminal-route { grid-template-columns:minmax(65px,1fr) minmax(54px,.7fr) minmax(80px,1.1fr) minmax(54px,.7fr) minmax(65px,1fr); }
  .terminal-route-node { min-height:96px; padding:9px 4px; }
  .terminal-route-node strong { font-size:10px; }
  .terminal-route-node small { font-size:8px; }
  .terminal-route-link { font-size:8px; }
  .terminal-route-link b { font-size:8px; }
  .connection-specs { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .connection-specs>div:nth-child(2) { border-right:0; }
  .connection-specs>div:nth-child(-n+2) { border-bottom:1px solid #304253; }
  #board-list { grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); }
  .sysop-grid { grid-template-columns:1fr; }
  .post-table th:nth-child(3),.post-table td:nth-child(3) { display:none; }
}

@media(max-width:760px) {
  .hero { min-height:0; align-items:flex-start; flex-direction:column; gap:22px; }
  .hero-display { align-self:stretch; width:100%; max-width:460px; min-width:0; flex-basis:auto; }
}

@media(max-width:520px) {
  .hero { padding:25px 20px; }
  .hero h1 { font-size:clamp(32px,10vw,43px); }
  .hero-copy>p:not(.eyebrow) { font-size:13px; }
  .hero-copy>p br { display:none; }
  .terminal-command-copy { grid-template-columns:1fr; }
  .terminal-connect-banner { gap:11px; padding:14px; }
  .hero-display { height:170px; }
  .terminal-visual-bar { grid-template-columns:1fr auto; padding:0 12px; font-size:8px; }
  .terminal-visual-bar>span:nth-child(2) { justify-self:end; }
  .terminal-window-state { display:none; }
  .terminal-visual-main { gap:16px; padding:22px 15px; }
  .terminal-visual-copy h3 { font-size:23px; }
  .terminal-route { grid-template-columns:1fr; gap:0; }
  .terminal-route-node { min-height:84px; }
  .terminal-route-link { grid-template-columns:1fr auto 1fr; justify-items:center; gap:8px; min-height:48px; }
  .terminal-route-link i { width:2px; height:28px; overflow:visible; }
  .terminal-route-link i::after { top:-5px; left:-2px; width:6px; height:6px; animation-name:route-packet-vertical; }
  .terminal-route-link b { min-width:75px; text-align:left; }
  .route-internal b { text-align:left; }
  .terminal-visual-command { align-items:flex-start; gap:8px; flex-wrap:wrap; padding:11px 12px; font-size:10px; }
  .terminal-visual-command code { flex:1 1 190px; }
  .terminal-cursor { margin-top:2px; }
  .product-overview { margin:28px 0 32px; }
  .product-heading { text-align:left; }
  .product-features { grid-template-columns:1fr; gap:9px; }
  .product-card { min-height:0; padding:16px; }
  .product-number { float:left; margin:0 12px 20px 0; }
  .product-card h3 { padding-top:3px; }
  .product-flow { display:grid; grid-template-columns:1fr auto; gap:10px 12px; }
  .product-flow>i { display:none; }
  .product-flow>a { grid-column:1/-1; justify-self:start; padding-top:10px; white-space:normal; border-top:1px solid #dce7ef; }
  .directory-heading { align-items:flex-start; flex-direction:column; gap:9px; }
  .directory-heading h2 { font-size:21px; }
  .auth-grid { margin:22px 0 32px; }
}

@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after { scroll-behavior:auto !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
}

@keyframes route-packet-vertical { to { top:calc(100% + 5px); } }