[{"data":1,"prerenderedAt":90},["ShallowReactive",2],{"room:01-bbs":3},{"path":4,"meta":5,"html":80,"css":81,"skinCss":82,"snippets":83},"01-bbs",{"id":6,"slug":4,"title":7,"years":8,"summary":9,"context":10,"traits":14,"tech":39,"thenVsNow":44,"snippets":45,"sources":61,"rooms":74,"recreated":78},"01","BBS, terminals & pre-web systems","1978–1995","Before the web, people dialled into bulletin board systems: 80 columns of text, 16 colours, ANSI art logos and menus you drove with single keystrokes.",{"screens":11,"connection":12,"browsers":13},"80×25 text mode on CGA\u002FEGA\u002FVGA monitors; no pixels, only character cells","Dial-up modems from 300 to 14,400 baud; one caller per phone line","Terminal programs such as Telix, Procomm and Telemate, talking ANSI escape codes",[15,18,21,24,27,30,33,36],{"id":16,"label":17},"grid","A fixed 80-column character grid",{"id":19,"label":20},"ansi-art","ANSI block-character logo art",{"id":22,"label":23},"box-menu","Box-drawing menus with [hotkeys]",{"id":25,"label":26},"login","Handle-based login prompt",{"id":28,"label":29},"cursor","Blinking block cursor",{"id":31,"label":32},"status","Terminal status line",{"id":34,"label":35},"baud","Text that arrives at modem speed",{"id":37,"label":38},"sysop","A personal note from the sysop",[40,41,42,43],"Code page 437 block and box-drawing characters","ANSI escape sequences for 16 foreground colours","Single-key menus handled by the BBS software","Recreated here with \u003Cpre>, the ch unit and CSS custom properties for the CGA palette","Box-drawing menus became nav bars and the sysop note became the About page; the 16-colour palette lives on in terminal themes.",[46,51,56],{"file":47,"lang":48,"caption":49,"region":50},"demo.html","html","ANSI art is just coloured text","ansi-splash",{"file":52,"lang":53,"caption":54,"region":55},"era.css","css","The CGA palette as custom properties","palette",{"file":57,"lang":58,"caption":59,"region":60},"era.client.ts","typescript","Revealing text at modem speed","modem",[62,65,68,71],{"label":63,"url":64},"BBS: The Documentary (Jason Scott, 2005)","http:\u002F\u002Fwww.bbsdocumentary.com\u002F",{"label":66,"url":67},"Code page 437 (Wikipedia)","https:\u002F\u002Fen.wikipedia.org\u002Fwiki\u002FCode_page_437",{"label":69,"url":70},"ANSI art (Wikipedia)","https:\u002F\u002Fen.wikipedia.org\u002Fwiki\u002FANSI_art",{"label":72,"url":73},"Color Graphics Adapter palette (Wikipedia)","https:\u002F\u002Fen.wikipedia.org\u002Fwiki\u002FColor_Graphics_Adapter",[75],{"path":76,"label":77},"pre-web","pre-web room: Teletext, Minitel, Gopher",[79],"The modem reveal is simulated in the browser; nothing is actually dialled.","\u003Cdiv class=\"bbs\" data-trait=\"grid\">\n  \u003Cdiv class=\"bbs__frame\">\n    \u003Cdiv class=\"bbs__status\" data-trait=\"status\">\n      \u003Cspan>COM1\u003C\u002Fspan>\u003Cspan>2400 8N1\u003C\u002Fspan>\u003Cspan>ANSI-BBS\u003C\u002Fspan>\u003Cspan class=\"bbs__online\">ONLINE 00:00\u003C\u002Fspan>\n    \u003C\u002Fdiv>\n\n    \u003Cdiv class=\"bbs__screen\" id=\"bbs-screen\" tabindex=\"0\" data-keys=\"own\" aria-label=\"BBS terminal. Press a menu hotkey letter.\">\n      \u003Cpre class=\"bbs__splash\" data-trait=\"ansi-art\" aria-label=\"Neon Basement BBS logo\">\u003Cspan class=\"c-12\">█▄  █ ████ ▄██▄ █▄  █\u003C\u002Fspan>\n\u003Cspan class=\"c-12\">█▀▄ █ █▄▄  █  █ █▀▄ █\u003C\u002Fspan>   \u003Cspan class=\"c-11\">Node 1 of 2\u003C\u002Fspan>\n\u003Cspan class=\"c-4\">█ ▀▄█ █    █  █ █ ▀▄█\u003C\u002Fspan>   \u003Cspan class=\"c-3\">Est. 1989\u003C\u002Fspan>\n\u003Cspan class=\"c-4\">█  ▀█ ████ ▀██▀ █  ▀█\u003C\u002Fspan>\n\n\u003Cspan class=\"c-13\">███▄ ▄██▄ ▄███ ████ █▄ ▄█ ████ █▄  █ █████\u003C\u002Fspan>\n\u003Cspan class=\"c-13\">█▄▄▀ █  █ ▀▄▄  █▄▄  █ ▀ █ █▄▄  █▀▄ █   █\u003C\u002Fspan>\n\u003Cspan class=\"c-5\">█  █ ████    █ █    █   █ █    █ ▀▄█   █\u003C\u002Fspan>\n\u003Cspan class=\"c-5\">███▀ █  █ ███▀ ████ █   █ ████ █  ▀█   █\u003C\u002Fspan>\n\u003Cspan class=\"c-8\">░░░▒▒▒▓▓▓███\u003C\u002Fspan> \u003Cspan class=\"c-15\">THE NEON BASEMENT BBS\u003C\u002Fspan> \u003Cspan class=\"c-8\">███▓▓▓▒▒▒░░░\u003C\u002Fspan>\u003C\u002Fpre>\n\n      \u003Cform class=\"bbs__login\" id=\"bbs-login\" data-trait=\"login\" autocomplete=\"off\">\n        \u003Cpre>\u003Cspan class=\"c-10\">CONNECT 2400\u003C\u002Fspan>\n\u003Cspan class=\"c-7\">Checking for ANSI... \u003C\u002Fspan>\u003Cspan class=\"c-14\">detected.\u003C\u002Fspan>\n\n\u003Clabel for=\"bbs-handle\">\u003Cspan class=\"c-11\">Enter your handle (or NEW): \u003C\u002Fspan>\u003C\u002Flabel>\u003Cinput id=\"bbs-handle\" name=\"handle\" maxlength=\"16\" spellcheck=\"false\" value=\"GUEST\">\u003Cbutton type=\"submit\" class=\"bbs__enter\">[ENTER]\u003C\u002Fbutton>\u003C\u002Fpre>\n      \u003C\u002Fform>\n\n      \u003Csection class=\"bbs__panel is-current\" id=\"bbs-main\" data-screen=\"main\" aria-label=\"Main menu\">\n\u003Cpre data-trait=\"box-menu\">\u003Cspan class=\"c-9\">╔══════════════════════════════════════════════════════════════╗\u003C\u002Fspan>\n\u003Cspan class=\"c-9\">║\u003C\u002Fspan>\u003Cspan class=\"c-15\">  MAIN MENU                          \u003C\u002Fspan>\u003Cspan class=\"c-14\">Time left: 59 min\u003C\u002Fspan> \u003Cspan class=\"c-9\">       ║\u003C\u002Fspan>\n\u003Cspan class=\"c-9\">╠══════════════════════════════════════════════════════════════╣\u003C\u002Fspan>\n\u003Cspan class=\"c-9\">║\u003C\u002Fspan>  \u003Ca href=\"#bbs-msgs\" data-key=\"m\">\u003Cspan class=\"c-14\">[M]\u003C\u002Fspan> \u003Cspan class=\"c-7\">Message bases\u003C\u002Fspan>\u003C\u002Fa>        \u003Ca href=\"#bbs-files\" data-key=\"f\">\u003Cspan class=\"c-14\">[F]\u003C\u002Fspan> \u003Cspan class=\"c-7\">File areas\u003C\u002Fspan>\u003C\u002Fa>                     \u003Cspan class=\"c-9\">║\u003C\u002Fspan>\n\u003Cspan class=\"c-9\">║\u003C\u002Fspan>  \u003Ca href=\"#bbs-doors\" data-key=\"d\">\u003Cspan class=\"c-14\">[D]\u003C\u002Fspan> \u003Cspan class=\"c-7\">Door games\u003C\u002Fspan>\u003C\u002Fa>           \u003Ca href=\"#bbs-who\" data-key=\"w\">\u003Cspan class=\"c-14\">[W]\u003C\u002Fspan> \u003Cspan class=\"c-7\">Who's online\u003C\u002Fspan>\u003C\u002Fa>                   \u003Cspan class=\"c-9\">║\u003C\u002Fspan>\n\u003Cspan class=\"c-9\">║\u003C\u002Fspan>  \u003Ca href=\"#bbs-sysop\" data-key=\"s\">\u003Cspan class=\"c-14\">[S]\u003C\u002Fspan> \u003Cspan class=\"c-7\">Page the sysop\u003C\u002Fspan>\u003C\u002Fa>       \u003Ca href=\"#bbs-bye\" data-key=\"g\">\u003Cspan class=\"c-14\">[G]\u003C\u002Fspan> \u003Cspan class=\"c-7\">Goodbye (log off)\u003C\u002Fspan>\u003C\u002Fa>              \u003Cspan class=\"c-9\">║\u003C\u002Fspan>\n\u003Cspan class=\"c-9\">╚══════════════════════════════════════════════════════════════╝\u003C\u002Fspan>\n\u003Cspan class=\"c-11\">Command\u003C\u002Fspan>\u003Cspan class=\"c-8\"> » \u003C\u002Fspan>\u003Cspan class=\"bbs__cursor\" data-trait=\"cursor\">█\u003C\u002Fspan>\u003C\u002Fpre>\n      \u003C\u002Fsection>\n\n      \u003Csection class=\"bbs__panel\" id=\"bbs-msgs\" data-screen=\"msgs\" aria-label=\"Message bases\">\n\u003Cpre>\u003Cspan class=\"c-11\">─── MESSAGE BASES ───────────────────────────────────────────\u003C\u002Fspan>\n \u003Cspan class=\"c-14\">1\u003C\u002Fspan>  \u003Cspan class=\"c-15\">General Chatter\u003C\u002Fspan>        \u003Cspan class=\"c-7\">1,204 msgs\u003C\u002Fspan>   \u003Cspan class=\"c-10\">3 new\u003C\u002Fspan>\n \u003Cspan class=\"c-14\">2\u003C\u002Fspan>  \u003Cspan class=\"c-15\">ANSI Art Gallery\u003C\u002Fspan>       \u003Cspan class=\"c-7\">  388 msgs\u003C\u002Fspan>   \u003Cspan class=\"c-10\">1 new\u003C\u002Fspan>\n \u003Cspan class=\"c-14\">3\u003C\u002Fspan>  \u003Cspan class=\"c-15\">Modem Talk (14.4k!)\u003C\u002Fspan>    \u003Cspan class=\"c-7\">  612 msgs\u003C\u002Fspan>\n \u003Cspan class=\"c-14\">4\u003C\u002Fspan>  \u003Cspan class=\"c-15\">FidoNet Echo: COOKING\u003C\u002Fspan>  \u003Cspan class=\"c-7\">2,950 msgs\u003C\u002Fspan>\n\n\u003Cspan class=\"c-7\">From: \u003C\u002Fspan>\u003Cspan class=\"c-15\">PIXEL.WITCH\u003C\u002Fspan>   \u003Cspan class=\"c-7\">To: \u003C\u002Fspan>\u003Cspan class=\"c-15\">ALL\u003C\u002Fspan>\n\u003Cspan class=\"c-7\">Subj: \u003C\u002Fspan>\u003Cspan class=\"c-14\">new logo up in file area 3, comments welcome :)\u003C\u002Fspan>\n\n\u003Ca href=\"#bbs-main\" data-key=\"q\">\u003Cspan class=\"c-14\">[Q]\u003C\u002Fspan> \u003Cspan class=\"c-7\">Back to main menu\u003C\u002Fspan>\u003C\u002Fa>\u003C\u002Fpre>\n      \u003C\u002Fsection>\n\n      \u003Csection class=\"bbs__panel\" id=\"bbs-files\" data-screen=\"files\" aria-label=\"File areas\">\n\u003Cpre>\u003Cspan class=\"c-11\">─── FILE AREA 3: GRAPHICS ───────────────────────────────────\u003C\u002Fspan>\n \u003Cspan class=\"c-15\">NEONLOGO.ANS\u003C\u002Fspan>   \u003Cspan class=\"c-7\">  6,144\u003C\u002Fspan>  \u003Cspan class=\"c-3\">03-12-92\u003C\u002Fspan>  \u003Cspan class=\"c-7\">Our new login screen\u003C\u002Fspan>\n \u003Cspan class=\"c-15\">TDRAW460.ZIP\u003C\u002Fspan>   \u003Cspan class=\"c-7\"> 92,410\u003C\u002Fspan>  \u003Cspan class=\"c-3\">11-02-91\u003C\u002Fspan>  \u003Cspan class=\"c-7\">ANSI drawing program\u003C\u002Fspan>\n \u003Cspan class=\"c-15\">FONTPAK1.ZIP\u003C\u002Fspan>   \u003Cspan class=\"c-7\"> 31,770\u003C\u002Fspan>  \u003Cspan class=\"c-3\">01-19-92\u003C\u002Fspan>  \u003Cspan class=\"c-7\">Block letter fonts\u003C\u002Fspan>\n \u003Cspan class=\"c-15\">ACIDVIEW.ZIP\u003C\u002Fspan>   \u003Cspan class=\"c-7\"> 58,002\u003C\u002Fspan>  \u003Cspan class=\"c-3\">07-30-92\u003C\u002Fspan>  \u003Cspan class=\"c-7\">Art pack viewer\u003C\u002Fspan>\n\n\u003Cspan class=\"c-12\">Download ratio: 1:4. Upload something nice first!\u003C\u002Fspan>\n\u003Cspan class=\"c-7\">Est. time for TDRAW460.ZIP at 2400 baud: \u003C\u002Fspan>\u003Cspan class=\"c-14\">6 min 25 s\u003C\u002Fspan>\n\n\u003Ca href=\"#bbs-main\" data-key=\"q\">\u003Cspan class=\"c-14\">[Q]\u003C\u002Fspan> \u003Cspan class=\"c-7\">Back to main menu\u003C\u002Fspan>\u003C\u002Fa>\u003C\u002Fpre>\n      \u003C\u002Fsection>\n\n      \u003Csection class=\"bbs__panel\" id=\"bbs-doors\" data-screen=\"doors\" aria-label=\"Door games\">\n\u003Cpre>\u003Cspan class=\"c-11\">─── DOOR GAMES ──────────────────────────────────────────────\u003C\u002Fspan>\n \u003Cspan class=\"c-14\">1\u003C\u002Fspan>  \u003Cspan class=\"c-15\">Dragon Cellar\u003C\u002Fspan>        \u003Cspan class=\"c-7\">turn-based dungeon crawl, 20 turns\u002Fday\u003C\u002Fspan>\n \u003Cspan class=\"c-14\">2\u003C\u002Fspan>  \u003Cspan class=\"c-15\">Trade Lanes 2000\u003C\u002Fspan>     \u003Cspan class=\"c-7\">space trading, 4 players this week\u003C\u002Fspan>\n \u003Cspan class=\"c-14\">3\u003C\u002Fspan>  \u003Cspan class=\"c-15\">Basement Trivia\u003C\u002Fspan>      \u003Cspan class=\"c-7\">yesterday's winner: BAUDBOY\u003C\u002Fspan>\n\n\u003Cspan class=\"c-10\">Doors open in a separate program. Please don't hang up mid-game,\u003C\u002Fspan>\n\u003Cspan class=\"c-10\">it corrupts the score file. Again.\u003C\u002Fspan>\n\n\u003Ca href=\"#bbs-main\" data-key=\"q\">\u003Cspan class=\"c-14\">[Q]\u003C\u002Fspan> \u003Cspan class=\"c-7\">Back to main menu\u003C\u002Fspan>\u003C\u002Fa>\u003C\u002Fpre>\n      \u003C\u002Fsection>\n\n      \u003Csection class=\"bbs__panel\" id=\"bbs-who\" data-screen=\"who\" aria-label=\"Who's online\">\n\u003Cpre>\u003Cspan class=\"c-11\">─── WHO'S ONLINE ────────────────────────────────────────────\u003C\u002Fspan>\n \u003Cspan class=\"c-14\">Node\u003C\u002Fspan>  \u003Cspan class=\"c-14\">Handle\u003C\u002Fspan>          \u003Cspan class=\"c-14\">Doing\u003C\u002Fspan>\n  \u003Cspan class=\"c-15\">1\u003C\u002Fspan>    \u003Cspan class=\"c-15 bbs__you\">GUEST\u003C\u002Fspan>           \u003Cspan class=\"c-7\">Reading this list\u003C\u002Fspan>\n  \u003Cspan class=\"c-15\">2\u003C\u002Fspan>    \u003Cspan class=\"c-15\">BAUDBOY\u003C\u002Fspan>         \u003Cspan class=\"c-7\">In door: Basement Trivia\u003C\u002Fspan>\n\n\u003Cspan class=\"c-8\">Only 2 phone lines. If you got a busy signal, that's why.\u003C\u002Fspan>\n\n\u003Ca href=\"#bbs-main\" data-key=\"q\">\u003Cspan class=\"c-14\">[Q]\u003C\u002Fspan> \u003Cspan class=\"c-7\">Back to main menu\u003C\u002Fspan>\u003C\u002Fa>\u003C\u002Fpre>\n      \u003C\u002Fsection>\n\n      \u003Csection class=\"bbs__panel\" id=\"bbs-sysop\" data-screen=\"sysop\" aria-label=\"Sysop note\">\n\u003Cpre data-trait=\"sysop\">\u003Cspan class=\"c-11\">─── PAGING SYSOP ────────────────────────────────────────────\u003C\u002Fspan>\n\u003Cspan class=\"c-7\">Paging\u003C\u002Fspan> \u003Cspan class=\"c-15\">NIGHTOWL\u003C\u002Fspan>\u003Cspan class=\"c-7\">...\u003C\u002Fspan> \u003Cspan class=\"c-14 bbs__bell\">♪ BEEP ♪\u003C\u002Fspan>\n\n\u003Cspan class=\"c-13\">Sysop note:\u003C\u002Fspan> \u003Cspan class=\"c-7\">I'm probably asleep. The board runs on a\u003C\u002Fspan>\n\u003Cspan class=\"c-7\">286 in my parents' basement and a second phone line I pay for\u003C\u002Fspan>\n\u003Cspan class=\"c-7\">with my paper route. Be cool, no cussing in General Chatter.\u003C\u002Fspan>\n\u003Cspan class=\"c-7\">Upload ratio enforced. Leave feedback with [F] then [U].\u003C\u002Fspan>\n                                              \u003Cspan class=\"c-13\">-- NightOwl\u003C\u002Fspan>\n\n\u003Ca href=\"#bbs-main\" data-key=\"q\">\u003Cspan class=\"c-14\">[Q]\u003C\u002Fspan> \u003Cspan class=\"c-7\">Back to main menu\u003C\u002Fspan>\u003C\u002Fa>\u003C\u002Fpre>\n      \u003C\u002Fsection>\n\n      \u003Csection class=\"bbs__panel\" id=\"bbs-bye\" data-screen=\"bye\" aria-label=\"Log off\">\n\u003Cpre>\u003Cspan class=\"c-11\">Thanks for calling THE NEON BASEMENT!\u003C\u002Fspan>\n\u003Cspan class=\"c-7\">You were online for \u003C\u002Fspan>\u003Cspan class=\"c-14 bbs__minutes\">1\u003C\u002Fspan>\u003Cspan class=\"c-7\"> minute(s).\u003C\u002Fspan>\n\n\u003Cspan class=\"c-12\">NO CARRIER\u003C\u002Fspan>\n\n\u003Ca href=\"#bbs-main\" data-key=\"q\">\u003Cspan class=\"c-14\">[Q]\u003C\u002Fspan> \u003Cspan class=\"c-7\">Call again\u003C\u002Fspan>\u003C\u002Fa>\u003C\u002Fpre>\n      \u003C\u002Fsection>\n    \u003C\u002Fdiv>\n  \u003C\u002Fdiv>\n\n  \u003Cdiv class=\"bbs__controls\">\n    \u003Cfieldset class=\"bbs__baud\" data-trait=\"baud\">\n      \u003Clegend>Modem speed\u003C\u002Flegend>\n      \u003Clabel>\u003Cinput type=\"radio\" name=\"baud\" value=\"300\"> 300 baud\u003C\u002Flabel>\n      \u003Clabel>\u003Cinput type=\"radio\" name=\"baud\" value=\"2400\" checked> 2400 baud\u003C\u002Flabel>\n      \u003Clabel>\u003Cinput type=\"radio\" name=\"baud\" value=\"14400\"> 14.4k\u003C\u002Flabel>\n      \u003Cbutton type=\"button\" class=\"bbs__redial\">Redial\u003C\u002Fbutton>\n    \u003C\u002Ffieldset>\n    \u003Cp class=\"bbs__help\">Click the terminal, then press a highlighted letter: \u003Ckbd>M\u003C\u002Fkbd> \u003Ckbd>F\u003C\u002Fkbd> \u003Ckbd>D\u003C\u002Fkbd> \u003Ckbd>W\u003C\u002Fkbd> \u003Ckbd>S\u003C\u002Fkbd> \u003Ckbd>G\u003C\u002Fkbd>, and \u003Ckbd>Q\u003C\u002Fkbd> to go back.\u003C\u002Fp>\n    \u003Cp class=\"bbs__room\">\u003Ca href=\"\u002Feras\u002F01-bbs\u002Fpre-web\u002F\">Enter the pre-web room: Teletext, Minitel, Gopher →\u003C\u002Fa>\u003C\u002Fp>\n  \u003C\u002Fdiv>\n\u003C\u002Fdiv>\n","@layer era, shell, skin;\n@layer era {\n\u002F* Era 01: BBS terminal. An 80-column text grid in the 16-colour CGA palette. *\u002F\n[data-era=\"01\"] {\n  --cga-0: #000000; --cga-1: #0000aa; --cga-2: #00aa00; --cga-3: #00aaaa;\n  --cga-4: #aa0000; --cga-5: #aa00aa; --cga-6: #aa5500; --cga-7: #aaaaaa;\n  --cga-8: #555555; --cga-9: #5555ff; --cga-10: #55ff55; --cga-11: #55ffff;\n  --cga-12: #ff5555; --cga-13: #ff55ff; --cga-14: #ffff55; --cga-15: #ffffff;\n  background: #000;\n  color: var(--cga-7);\n  font-family: 'Perfect DOS VGA 437', 'Px437 IBM VGA8', ui-monospace, 'Cascadia Mono', 'DejaVu Sans Mono', Consolas, monospace;\n\n  .bbs {\n    container-type: inline-size;\n    max-width: 1100px;\n    margin: 0 auto;\n    padding: 16px;\n    box-sizing: border-box;\n  }\n\n  .bbs__frame {\n    \u002F* 80 columns at 0.6em per column = 48em. Scale the type so 80 columns always fit. *\u002F\n    font-size: clamp(7px, calc(100cqi \u002F 49), 19px);\n    line-height: 1.2;\n    background: #000;\n    border: 1px solid #333;\n    box-shadow: 0 0 60px rgb(85 255 255 \u002F 0.08), inset 0 0 80px rgb(0 0 0 \u002F 0.9);\n    position: relative;\n    overflow: hidden;\n  }\n  \u002F* Faint scanlines *\u002F\n  .bbs__frame::after {\n    content: '';\n    position: absolute;\n    inset: 0;\n    pointer-events: none;\n    background: repeating-linear-gradient(to bottom, rgb(255 255 255 \u002F 0.035) 0 1px, transparent 1px 3px);\n  }\n\n  .bbs__status {\n    display: flex;\n    gap: 2ch;\n    padding: 0 1ch;\n    background: var(--cga-1);\n    color: var(--cga-15);\n    white-space: nowrap;\n    overflow: hidden;\n  }\n  .bbs__online {\n    margin-left: auto;\n    color: var(--cga-14);\n  }\n\n  .bbs__screen {\n    padding: 1em 1ch;\n    min-height: 25lh;\n    outline: none;\n  }\n  .bbs__screen:focus-visible {\n    box-shadow: inset 0 0 0 2px var(--cga-11);\n  }\n\n  pre {\n    margin: 0;\n    font: inherit;\n    white-space: pre;\n  }\n  .bbs__splash {\n    margin-bottom: 1lh;\n  }\n\n  \u002F* CGA colour classes, as an ANSI art editor would export them. *\u002F\n  .c-0 { color: var(--cga-0); } .c-1 { color: var(--cga-1); } .c-2 { color: var(--cga-2); } .c-3 { color: var(--cga-3); }\n  .c-4 { color: var(--cga-4); } .c-5 { color: var(--cga-5); } .c-6 { color: var(--cga-6); } .c-7 { color: var(--cga-7); }\n  .c-8 { color: var(--cga-8); } .c-9 { color: var(--cga-9); } .c-10 { color: var(--cga-10); } .c-11 { color: var(--cga-11); }\n  .c-12 { color: var(--cga-12); } .c-13 { color: var(--cga-13); } .c-14 { color: var(--cga-14); } .c-15 { color: var(--cga-15); }\n\n  a {\n    color: inherit;\n    text-decoration: none;\n  }\n  a:hover,\n  a:focus-visible {\n    background: var(--cga-1);\n    outline: none;\n  }\n\n  .bbs__login {\n    margin-bottom: 1lh;\n  }\n  .bbs__login input {\n    font: inherit;\n    width: 16ch;\n    padding: 0;\n    background: var(--cga-1);\n    color: var(--cga-15);\n    border: 0;\n    text-transform: uppercase;\n    caret-color: var(--cga-15);\n  }\n  .bbs__login input:focus {\n    outline: 1px solid var(--cga-11);\n  }\n  .bbs__enter {\n    font: inherit;\n    margin-left: 1ch;\n    padding: 0;\n    background: none;\n    border: 0;\n    color: var(--cga-14);\n    cursor: pointer;\n  }\n\n  \u002F* Without JS, the :target screen shows; with JS, era.client.ts toggles .is-current. *\u002F\n  .bbs__panel {\n    display: none;\n  }\n  .bbs__panel.is-current,\n  .bbs__panel:target {\n    display: block;\n  }\n  .bbs__screen:has(.bbs__panel:target) .bbs__panel.is-current:not(:target) {\n    display: none;\n  }\n\n  .bbs__cursor {\n    color: var(--cga-7);\n    animation: e01-blink 1.06s steps(1) infinite;\n  }\n  @keyframes e01-blink {\n    50% { opacity: 0; }\n  }\n\n  \u002F* While text \"arrives\" over the modem, unrevealed characters are hidden. *\u002F\n  .is-typing .bbs__pending {\n    visibility: hidden;\n  }\n\n  .bbs__controls {\n    display: flex;\n    flex-wrap: wrap;\n    gap: 12px 24px;\n    align-items: center;\n    margin-top: 16px;\n    font-size: 15px;\n    color: var(--cga-7);\n  }\n  .bbs__baud {\n    display: flex;\n    flex-wrap: wrap;\n    gap: 6px 16px;\n    align-items: center;\n    border: 1px solid var(--cga-8);\n    padding: 6px 12px 10px;\n  }\n  .bbs__baud legend {\n    color: var(--cga-11);\n    padding: 0 4px;\n  }\n  .bbs__baud input {\n    accent-color: var(--cga-14);\n  }\n  .bbs__redial {\n    font: inherit;\n    background: var(--cga-1);\n    color: var(--cga-15);\n    border: 1px solid var(--cga-9);\n    padding: 2px 10px;\n    cursor: pointer;\n  }\n  .bbs__help {\n    margin: 0;\n  }\n  kbd {\n    font: inherit;\n    color: var(--cga-14);\n  }\n  .bbs__room a {\n    color: var(--cga-11);\n    text-decoration: underline;\n  }\n  .bbs__room {\n    margin: 0;\n    flex-basis: 100%;\n  }\n  :focus-visible {\n    outline: 2px solid var(--cga-14);\n    outline-offset: 2px;\n  }\n}\n\n}","@layer era, shell, skin;\n@layer skin {\n\u002F* Era 01 time bar skin: a terminal status line. *\u002F\nhtml[data-era-page=\"01\"] .timebar {\n  --tb-bg: #0000aa;\n  --tb-fg: #ffffff;\n  --tb-muted: #aaaaaa;\n  --tb-accent: #ffff55;\n  --tb-accent-fg: #000000;\n  --tb-notch: #5555ff;\n  --tb-btn-border: 1px solid #5555ff;\n  --tb-btn-radius: 0;\n  --tb-font: ui-monospace, 'Cascadia Mono', Consolas, monospace;\n  --tb-shadow: none;\n  border-top: 2px solid #55ffff;\n}\nhtml[data-era-page=\"01\"] .timebar__notch {\n  border-radius: 0;\n}\nhtml[data-era-page=\"01\"] .timebar__years {\n  color: #55ffff;\n}\n\n}",[84,86,88],{"caption":49,"file":47,"html":85},"\u003Cpre class=\"shiki github-dark-dimmed\" style=\"background-color:#22272e;color:#adbac7\" tabindex=\"0\">\u003Ccode>\u003Cspan class=\"line\">\u003Cspan style=\"color:#ADBAC7\">      &#x3C;\u003C\u002Fspan>\u003Cspan style=\"color:#8DDB8C\">pre\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\"> class\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">=\u003C\u002Fspan>\u003Cspan style=\"color:#96D0FF\">\"bbs__splash\"\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\"> data-trait\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">=\u003C\u002Fspan>\u003Cspan style=\"color:#96D0FF\">\"ansi-art\"\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\"> aria-label\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">=\u003C\u002Fspan>\u003Cspan style=\"color:#96D0FF\">\"Neon Basement BBS logo\"\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">>&#x3C;\u003C\u002Fspan>\u003Cspan style=\"color:#8DDB8C\">span\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\"> class\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">=\u003C\u002Fspan>\u003Cspan style=\"color:#96D0FF\">\"c-12\"\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">>█▄  █ ████ ▄██▄ █▄  █&#x3C;\u002F\u003C\u002Fspan>\u003Cspan style=\"color:#8DDB8C\">span\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#ADBAC7\">&#x3C;\u003C\u002Fspan>\u003Cspan style=\"color:#8DDB8C\">span\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\"> class\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">=\u003C\u002Fspan>\u003Cspan style=\"color:#96D0FF\">\"c-12\"\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">>█▀▄ █ █▄▄  █  █ █▀▄ █&#x3C;\u002F\u003C\u002Fspan>\u003Cspan style=\"color:#8DDB8C\">span\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">>   &#x3C;\u003C\u002Fspan>\u003Cspan style=\"color:#8DDB8C\">span\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\"> class\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">=\u003C\u002Fspan>\u003Cspan style=\"color:#96D0FF\">\"c-11\"\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">>Node 1 of 2&#x3C;\u002F\u003C\u002Fspan>\u003Cspan style=\"color:#8DDB8C\">span\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#ADBAC7\">&#x3C;\u003C\u002Fspan>\u003Cspan style=\"color:#8DDB8C\">span\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\"> class\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">=\u003C\u002Fspan>\u003Cspan style=\"color:#96D0FF\">\"c-4\"\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">>█ ▀▄█ █    █  █ █ ▀▄█&#x3C;\u002F\u003C\u002Fspan>\u003Cspan style=\"color:#8DDB8C\">span\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">>   &#x3C;\u003C\u002Fspan>\u003Cspan style=\"color:#8DDB8C\">span\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\"> class\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">=\u003C\u002Fspan>\u003Cspan style=\"color:#96D0FF\">\"c-3\"\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">>Est. 1989&#x3C;\u002F\u003C\u002Fspan>\u003Cspan style=\"color:#8DDB8C\">span\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#ADBAC7\">&#x3C;\u003C\u002Fspan>\u003Cspan style=\"color:#8DDB8C\">span\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\"> class\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">=\u003C\u002Fspan>\u003Cspan style=\"color:#96D0FF\">\"c-4\"\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">>█  ▀█ ████ ▀██▀ █  ▀█&#x3C;\u002F\u003C\u002Fspan>\u003Cspan style=\"color:#8DDB8C\">span\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#ADBAC7\">&#x3C;\u003C\u002Fspan>\u003Cspan style=\"color:#8DDB8C\">span\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\"> class\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">=\u003C\u002Fspan>\u003Cspan style=\"color:#96D0FF\">\"c-13\"\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">>███▄ ▄██▄ ▄███ ████ █▄ ▄█ ████ █▄  █ █████&#x3C;\u002F\u003C\u002Fspan>\u003Cspan style=\"color:#8DDB8C\">span\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#ADBAC7\">&#x3C;\u003C\u002Fspan>\u003Cspan style=\"color:#8DDB8C\">span\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\"> class\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">=\u003C\u002Fspan>\u003Cspan style=\"color:#96D0FF\">\"c-13\"\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">>█▄▄▀ █  █ ▀▄▄  █▄▄  █ ▀ █ █▄▄  █▀▄ █   █&#x3C;\u002F\u003C\u002Fspan>\u003Cspan style=\"color:#8DDB8C\">span\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#ADBAC7\">&#x3C;\u003C\u002Fspan>\u003Cspan style=\"color:#8DDB8C\">span\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\"> class\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">=\u003C\u002Fspan>\u003Cspan style=\"color:#96D0FF\">\"c-5\"\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">>█  █ ████    █ █    █   █ █    █ ▀▄█   █&#x3C;\u002F\u003C\u002Fspan>\u003Cspan style=\"color:#8DDB8C\">span\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#ADBAC7\">&#x3C;\u003C\u002Fspan>\u003Cspan style=\"color:#8DDB8C\">span\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\"> class\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">=\u003C\u002Fspan>\u003Cspan style=\"color:#96D0FF\">\"c-5\"\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">>███▀ █  █ ███▀ ████ █   █ ████ █  ▀█   █&#x3C;\u002F\u003C\u002Fspan>\u003Cspan style=\"color:#8DDB8C\">span\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#ADBAC7\">&#x3C;\u003C\u002Fspan>\u003Cspan style=\"color:#8DDB8C\">span\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\"> class\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">=\u003C\u002Fspan>\u003Cspan style=\"color:#96D0FF\">\"c-8\"\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">>░░░▒▒▒▓▓▓███&#x3C;\u002F\u003C\u002Fspan>\u003Cspan style=\"color:#8DDB8C\">span\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">> &#x3C;\u003C\u002Fspan>\u003Cspan style=\"color:#8DDB8C\">span\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\"> class\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">=\u003C\u002Fspan>\u003Cspan style=\"color:#96D0FF\">\"c-15\"\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">>THE NEON BASEMENT BBS&#x3C;\u002F\u003C\u002Fspan>\u003Cspan style=\"color:#8DDB8C\">span\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">> &#x3C;\u003C\u002Fspan>\u003Cspan style=\"color:#8DDB8C\">span\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\"> class\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">=\u003C\u002Fspan>\u003Cspan style=\"color:#96D0FF\">\"c-8\"\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">>███▓▓▓▒▒▒░░░&#x3C;\u002F\u003C\u002Fspan>\u003Cspan style=\"color:#8DDB8C\">span\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">>&#x3C;\u002F\u003C\u002Fspan>\u003Cspan style=\"color:#8DDB8C\">pre\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">>\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>",{"caption":54,"file":52,"html":87},"\u003Cpre class=\"shiki github-dark-dimmed\" style=\"background-color:#22272e;color:#adbac7\" tabindex=\"0\">\u003Ccode>\u003Cspan class=\"line\">\u003Cspan style=\"color:#ADBAC7\">--cga-0: \u003C\u002Fspan>\u003Cspan style=\"color:#FF938A;font-style:italic\">#000000\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">; --cga-1: \u003C\u002Fspan>\u003Cspan style=\"color:#FF938A;font-style:italic\">#0000aa\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">; --cga-2: \u003C\u002Fspan>\u003Cspan style=\"color:#FF938A;font-style:italic\">#00aa00\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">; --cga-3: \u003C\u002Fspan>\u003Cspan style=\"color:#FF938A;font-style:italic\">#00aaaa\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">;\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#ADBAC7\">--cga-4: \u003C\u002Fspan>\u003Cspan style=\"color:#FF938A;font-style:italic\">#aa0000;\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> --cga-5: \u003C\u002Fspan>\u003Cspan style=\"color:#FF938A;font-style:italic\">#aa00aa;\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> --cga-6: \u003C\u002Fspan>\u003Cspan style=\"color:#FF938A;font-style:italic\">#aa5500;\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> --cga-7: \u003C\u002Fspan>\u003Cspan style=\"color:#FF938A;font-style:italic\">#aaaaaa;\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#ADBAC7\">--cga-8: \u003C\u002Fspan>\u003Cspan style=\"color:#FF938A;font-style:italic\">#555555\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">; --cga-9: \u003C\u002Fspan>\u003Cspan style=\"color:#FF938A;font-style:italic\">#5555ff\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">; --cga-10: \u003C\u002Fspan>\u003Cspan style=\"color:#FF938A;font-style:italic\">#55ff55\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">; --cga-11: \u003C\u002Fspan>\u003Cspan style=\"color:#FF938A;font-style:italic\">#55ffff\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">;\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#ADBAC7\">--cga-12: \u003C\u002Fspan>\u003Cspan style=\"color:#FF938A;font-style:italic\">#ff5555;\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> --cga-13: \u003C\u002Fspan>\u003Cspan style=\"color:#FF938A;font-style:italic\">#ff55ff;\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> --cga-14: \u003C\u002Fspan>\u003Cspan style=\"color:#FF938A;font-style:italic\">#ffff55;\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> --cga-15: \u003C\u002Fspan>\u003Cspan style=\"color:#FF938A;font-style:italic\">#ffffff;\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>",{"caption":59,"file":57,"html":89},"\u003Cpre class=\"shiki github-dark-dimmed\" style=\"background-color:#22272e;color:#adbac7\" tabindex=\"0\">\u003Ccode>\u003Cspan class=\"line\">\u003Cspan style=\"color:#768390\">\u002F** Reveal an element's text at the speed of the chosen modem (about baud \u002F 10 characters per second). *\u002F\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#F47067\">async\u003C\u002Fspan>\u003Cspan style=\"color:#F47067\"> function\u003C\u002Fspan>\u003Cspan style=\"color:#DCBDFB\"> typeOut\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">(\u003C\u002Fspan>\u003Cspan style=\"color:#F69D50\">el\u003C\u002Fspan>\u003Cspan style=\"color:#F47067\">:\u003C\u002Fspan>\u003Cspan style=\"color:#F69D50\"> HTMLElement\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">) {\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#DCBDFB\">  restore\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">() \u003C\u002Fspan>\u003Cspan style=\"color:#768390\">\u002F\u002F finish any screen that is still arriving\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#F47067\">  const\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\"> run\u003C\u002Fspan>\u003Cspan style=\"color:#F47067\"> =\u003C\u002Fspan>\u003Cspan style=\"color:#F47067\"> ++\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">typingRun\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#F47067\">  const\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\"> walker\u003C\u002Fspan>\u003Cspan style=\"color:#F47067\"> =\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> document.\u003C\u002Fspan>\u003Cspan style=\"color:#DCBDFB\">createTreeWalker\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">(el, NodeFilter.\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\">SHOW_TEXT\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">)\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#F47067\">  const\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\"> nodes\u003C\u002Fspan>\u003Cspan style=\"color:#F47067\">:\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> { \u003C\u002Fspan>\u003Cspan style=\"color:#F69D50\">node\u003C\u002Fspan>\u003Cspan style=\"color:#F47067\">:\u003C\u002Fspan>\u003Cspan style=\"color:#F69D50\"> Text\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">; \u003C\u002Fspan>\u003Cspan style=\"color:#F69D50\">text\u003C\u002Fspan>\u003Cspan style=\"color:#F47067\">:\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\"> string\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> }[] \u003C\u002Fspan>\u003Cspan style=\"color:#F47067\">=\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> []\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#F47067\">  while\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> (walker.\u003C\u002Fspan>\u003Cspan style=\"color:#DCBDFB\">nextNode\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">()) {\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#F47067\">    const\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\"> node\u003C\u002Fspan>\u003Cspan style=\"color:#F47067\"> =\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> walker.currentNode \u003C\u002Fspan>\u003Cspan style=\"color:#F47067\">as\u003C\u002Fspan>\u003Cspan style=\"color:#F69D50\"> Text\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#F47067\">    if\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> (node.parentElement?.\u003C\u002Fspan>\u003Cspan style=\"color:#DCBDFB\">checkVisibility\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">()) nodes.\u003C\u002Fspan>\u003Cspan style=\"color:#DCBDFB\">push\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">({ node, text: node.data })\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#ADBAC7\">  }\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#F47067\">  if\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> (reduced \u003C\u002Fspan>\u003Cspan style=\"color:#F47067\">||\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> document.documentElement.classList.\u003C\u002Fspan>\u003Cspan style=\"color:#DCBDFB\">contains\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">(\u003C\u002Fspan>\u003Cspan style=\"color:#96D0FF\">'readable'\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">)) \u003C\u002Fspan>\u003Cspan style=\"color:#F47067\">return\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#ADBAC7\">  nodes.\u003C\u002Fspan>\u003Cspan style=\"color:#DCBDFB\">forEach\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">((\u003C\u002Fspan>\u003Cspan style=\"color:#F69D50\">n\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">) \u003C\u002Fspan>\u003Cspan style=\"color:#F47067\">=>\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> (n.node.data \u003C\u002Fspan>\u003Cspan style=\"color:#F47067\">=\u003C\u002Fspan>\u003Cspan style=\"color:#96D0FF\"> ''\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">))\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#DCBDFB\">  restore\u003C\u002Fspan>\u003Cspan style=\"color:#F47067\"> =\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> () \u003C\u002Fspan>\u003Cspan style=\"color:#F47067\">=>\u003C\u002Fspan>\u003Cspan style=\"color:#DCBDFB\"> finish\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">(nodes)\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#F47067\">  const\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\"> charsPerSecond\u003C\u002Fspan>\u003Cspan style=\"color:#F47067\"> =\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> baud \u003C\u002Fspan>\u003Cspan style=\"color:#F47067\">\u002F\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\"> 10\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#F47067\">  let\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> last \u003C\u002Fspan>\u003Cspan style=\"color:#F47067\">=\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> performance.\u003C\u002Fspan>\u003Cspan style=\"color:#DCBDFB\">now\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">()\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#F47067\">  let\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> budget \u003C\u002Fspan>\u003Cspan style=\"color:#F47067\">=\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\"> 0\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#F47067\">  for\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> (\u003C\u002Fspan>\u003Cspan style=\"color:#F47067\">const\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\"> n\u003C\u002Fspan>\u003Cspan style=\"color:#F47067\"> of\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> nodes) {\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#F47067\">    let\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> i \u003C\u002Fspan>\u003Cspan style=\"color:#F47067\">=\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\"> 0\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#F47067\">    while\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> (i \u003C\u002Fspan>\u003Cspan style=\"color:#F47067\">&#x3C;\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> n.text.\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\">length\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">) {\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#F47067\">      if\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> (run \u003C\u002Fspan>\u003Cspan style=\"color:#F47067\">!==\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> typingRun) \u003C\u002Fspan>\u003Cspan style=\"color:#F47067\">return\u003C\u002Fspan>\u003Cspan style=\"color:#768390\"> \u002F\u002F a newer screen took over (and restored this one)\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#F47067\">      await\u003C\u002Fspan>\u003Cspan style=\"color:#F47067\"> new\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\"> Promise\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">(requestAnimationFrame)\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#F47067\">      const\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\"> now\u003C\u002Fspan>\u003Cspan style=\"color:#F47067\"> =\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> performance.\u003C\u002Fspan>\u003Cspan style=\"color:#DCBDFB\">now\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">()\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#ADBAC7\">      budget \u003C\u002Fspan>\u003Cspan style=\"color:#F47067\">+=\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> ((now \u003C\u002Fspan>\u003Cspan style=\"color:#F47067\">-\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> last) \u003C\u002Fspan>\u003Cspan style=\"color:#F47067\">\u002F\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\"> 1000\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">) \u003C\u002Fspan>\u003Cspan style=\"color:#F47067\">*\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> charsPerSecond\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#ADBAC7\">      last \u003C\u002Fspan>\u003Cspan style=\"color:#F47067\">=\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> now\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#F47067\">      const\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\"> take\u003C\u002Fspan>\u003Cspan style=\"color:#F47067\"> =\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> Math.\u003C\u002Fspan>\u003Cspan style=\"color:#DCBDFB\">floor\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">(budget)\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#F47067\">      if\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> (take \u003C\u002Fspan>\u003Cspan style=\"color:#F47067\">>\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\"> 0\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">) {\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#ADBAC7\">        budget \u003C\u002Fspan>\u003Cspan style=\"color:#F47067\">-=\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> take\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#ADBAC7\">        i \u003C\u002Fspan>\u003Cspan style=\"color:#F47067\">=\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> Math.\u003C\u002Fspan>\u003Cspan style=\"color:#DCBDFB\">min\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">(n.text.\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\">length\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">, i \u003C\u002Fspan>\u003Cspan style=\"color:#F47067\">+\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> take)\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#ADBAC7\">        n.node.data \u003C\u002Fspan>\u003Cspan style=\"color:#F47067\">=\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> n.text.\u003C\u002Fspan>\u003Cspan style=\"color:#DCBDFB\">slice\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">(\u003C\u002Fspan>\u003Cspan style=\"color:#6CB6FF\">0\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\">, i)\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#ADBAC7\">      }\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#ADBAC7\">    }\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#ADBAC7\">  }\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#DCBDFB\">  restore\u003C\u002Fspan>\u003Cspan style=\"color:#F47067\"> =\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> () \u003C\u002Fspan>\u003Cspan style=\"color:#F47067\">=>\u003C\u002Fspan>\u003Cspan style=\"color:#ADBAC7\"> {}\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#ADBAC7\">}\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>",1791223398955]