alienhospital/fic/dp/bluebells.html
2025-12-23 05:56:17 -05:00

730 lines
No EOL
19 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="en">
<head>
<!-- Change your site title: (It is shown in the tab) -->
<title>AL13NH0SP1T4L</title>
<!-- Change your site description: (It is shown in Google results) -->
<meta content="My personal website!" name="description" />
<!-- Setting character encoding and viewport size. Do not remove. -->
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<!-- FavIcon (small image in tab), change to any image you want: -->
<link href="favicon.ico" rel="icon" type="image/x-icon" />
<!-- CSS: -->
<!-- You will have to change this to "../style.css" if this HTML file is in a subfolder, to "../../style.css" if this HTML file is in 2 subfolders, etc. -->
<link href="./style.css" rel="stylesheet" />
<script>
// Template generated with petrapixel's layout generator.
// (Please do not remove this credit.)
console.log("%c Template generated with petrapixel's layout generator.", "font-size: 14pt;");
console.log("%c https://petrapixel.neocities.org/coding/layout-generator", "font-size: 14pt;");
</script>
</head>
<body>
<!-- The next line is a skip-to-content link for keyboard users. Do not remove it! -->
<a href="#content" id="skip-to-content-link">Skip to content</a>
<div class="layout">
<!-- =============================================== -->
<!-- HEADER -->
<!-- =============================================== -->
<header>
<div class="header-image">
<img src="https://i.ibb.co/d4wzWNJw/tumblr-9521a9fc973bc72adeebdf473bee6653-94ca1a4f-540.png" alt="" />
</div>
<div class="header-content">
<div class="header-title"></div>
<!-- NAVIGATION -->
<nav>
<ul>
<li><a href="/homepage">Home</a></li>
<li><a href="/about">About Me</a></li>
<li><a href="/shrines">Shrines</a></li>
<li><a href="/resources">Resources</a></li>
<li>
<strong>More</strong>
<ul>
<li><a href="/paint">Games - Paint</a></li>
<li><a href="/kidpix">Games - Kidpix</a></li>
<li><a href="/secrets">Well of Secrets</a></li>
<li><a href="/fanworks">Archive of My Fanworks</a></li>
<li><a href="/links">Even More Links!</a></li>
</ul>
</li>
</ul>
</nav>
</div>
</header>
<main id="content"> <!-- Do NOT remove the ID here -->
<!-- =============================================== -->
<!-- MAIN CONTENT -->
<!-- =============================================== -->
<section>
<h1>
<a href="/fic/directory">Back</a>
</h1>
<h2>bluebells in the late december
</h2>
|| Larry, after the corpse boxes.
<hr>
<span>Before he built his relationship with the Spirit up like fragile intricate sandcastles, debrided the disease from their shared body, he thought he was cursed. You feel the weight of loneliness in every bruise when you grow up outside of the narrow choking confinement of “normalcy” -- at least, despite the cycle of torment within him, he had Rita, then Jane, Cliff and eventually Vic. They were - not family. The word “family” implies happiness and harmony, the word family reminds him of his children, their shaky crayon drawings of him and Sheryl holding hands underneath a bright sun — the same sun that would ruin and become him later. He knows it is similar for the rest of them. Theyd all reject the term </span>
<em>
<span>family.</span>
</em>
</p><p> </p><p>
<span>To Larry, theyre more like blood, solely in the literal sense — someone is always bleeding out and someone else is always there to cut themselves open and complete the transfusion, save the day like a </span>
<em>
<span>real </span>
</em>
<span>hero, and someone is always healing and someone is always stumbling, always cracking the wound back open. Its like fucked up symbiosis — </span>
<em>
<span>codependency</span>
</em>
<span> is a more apt word, the kind that forms when a group of fucked up people live so close to another for eternity, but it does work, usually.</span>
</p><p> </p><p>
<span>The Spirit left him. He stopped feeling alone when he realized he was never alone, his endless companion burrowing into his chest and pulling the covers over their head — </span>
<em>
<span>five more minutes! let me sleep for five more minutes. do you ever rest? do you ever get tired? do you ever get tired of me? </span>
</em>
<span>— and wearing his skin around its soul until the lines are burned beyond recognition. He stopped feeling alone and then he became alone. Thats what you get, he supposes, when you allow someone else in. When every moment with them is both satiating and famishing, when its home in your breastbone twists in a rhythm too fast for your condition. When they ask you to run away with them, and you run away from them, and they run away from you.</span>
</p><p> </p><p>
<span>They had reached out for him, before they faded into vapor. The Spirit so full of life and their future full of so much potential that it has become sick and nauseous and Larry so touched by their gesture that he touches them and he remembers how it was all for nothing, how this is the inevitable dead end road at every passage to progress, and how not even the constant presence watching from inside him like a guardian could love him.</span>
</p><p> </p><p>
<span>He feels sick. But theyve got mail, and he has a job to do here - besides, he thinks, he can always tell Rita about it. She will - maybe not help or understand, but shell provide warmth and a comforting hand, and all he really wants right now is to be comforted.</span>
</p><p> </p><p>
<span>His bandages rub against the cardboard as he opens the boxes. Packing material with—</span>
</p><p> </p><p>
<span>It feels like hair?</span>
</p><p> </p><p>
<span>Its auburn hair, so soft despite his inability to touch it. It is perfectly clean and composed. He knows this—</span>
</p><p> </p><p>
<span>He—</span>
</p><p> </p><p>
<span>H--</span>
</p><p> </p><p>
<span>And every organ inside of him stops clinging to life and falls into the vast canyon depths, and every sadness in him multiplies and multiplies until theyre breaking the walls down because there are too many sadnesses in the building, no one can breathe in here, its not safe, youve got to call an ambulance before these sadnesses suffocate and smarter sadnesses evolve from them. Like a viral infection. Like life itself got sick and Larry touched it with a tenderness that he could never have given it years ago, with shock and adoration and Lo—</span>
</p><p> </p><p>
<span>Like life itself got sick and it seeped into Larry and now hes in a constant spar with life just to keep himself going. It wants to spread the infection and Larry wants to cut the infection out, because its in our nature to keep fighting off pain, our bodies work carefully on the inside to fight off what harms us without our consciousness ever knowing while we sit still, strapped to our chairs, as the water around us slowly fills the room. </span>
</p><p> </p><p>
<span>He stayed around for Rita, mainly, and because the Spirit kept him alive. Now he has no reasons to live left in his hand, and he has to fold.</span>
</p><p> </p><p>
<span>He doesnt know what to do, so he does the logical thing that anyone would do in this situation; he wraps his friends up with care, each bandage tight around flesh that carries more death than even his own. This will keep them safe. This will keep him safe until he figures out what to do. There has to be a way to bring them back; this isnt natural, someone did this, they were supposed to live forever and ever and ever and ever and ever </span>
<em>
<span>foolish to think you could ever have something so ubiquitous and picturesque </span>
</em>
<span>and ever and ever </span>
<em>
<span>even immortality has abandoned its shell </span>
</em>
<span>and ever, and even if he cant bring them back, maybe he can find justice. But -- but he has to -- he has to bring them back</span>
</p><p> </p><p>
<span>because if the Spirit is gone and his friends are gone and Dorothy is gone and Niles is gone and his children want him gone then everything every variable in the wholewideuniverse is just</span>
</p><p> </p><p>
<span>gone.</span>
</p><p> </p><p>
<span>Larry is:</span>
</p><p> </p><p>
<span>alone. He always has been. This was a mere illusion, a distraction from reality which is suffering which is always eventually fatal which is the one thing he yearns for more than justice, to be released from this world and its microtears, to -- well. To die.</span>
</p><p> </p><p>
<span>Hes kind of mad at them for getting there first.</span>
</p><p> </p><p>
<span>He arranges their bodies at the dining room table, each of them in a position that would be natural for their personality if they werent frozen and dead. He chooses the positions in the same way you put together a flower arrangement; all the beauty -- and there is so much of it -- resting perfectly on the surface, composed and artificial, every petal preserved for its future lover as the stems collapse underneath.</span>
</p><p><br />
<br />
</p>
</section>
</main>
<!-- Closing .layout: -->
</div>
<!-- Add any additional Javascript code (<script></script>) here. -->
</body>
<style>
/* -------------------------------------------------------- */
/* VARIABLES */
/* -------------------------------------------------------- */
/* Variables are used like this: var(--text-color) */
:root {
/* Background Colors: */
--background-color: #ffffff;
--content-background-color: #ffffff;
--sidebar-background-color: #ffffff;
/* Text Colors: */
--text-color: #000000;
--sidebar-text-color: #2500dd;
--link-color: #000d63;
--link-color-hover: #5e00ec;
/* Text: */
--font: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', Osaka, , Meiryo, ' Pゴシック', 'MS PGothic', ' ゴシック' , 'MS Gothic', 'Noto Sans CJK JP', TakaoPGothic, sans-serif;
--heading-font: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', Osaka, , Meiryo, ' Pゴシック', 'MS PGothic', ' ゴシック' , 'MS Gothic', 'Noto Sans CJK JP', TakaoPGothic, sans-serif;
--font-size: 18px;
/* Other Settings: */
--margin: 25px;
--padding: 24px;
--border: 10px inset #001457;
--round-borders: 0px;
--sidebar-width: 300px;
}
/* -------------------------------------------------------- */
/* BASICS */
/* -------------------------------------------------------- */
* {
box-sizing: border-box;
}
body {
display: flex;
align-items: center;
justify-content: center;
min-height: 100vh;
font-size: var(--font-size);
margin: 0;
padding: var(--margin);
color: var(--text-color);
font-family: Times;
line-height: 1.2;
font-weight: 500;
background: var(--background-color);
background-image: url("https://i.ibb.co/214VBwsN/pkg50004.jpg");
}
::selection {
/* (Text highlighted by the user) */
background: rgba(0, 0, 0, 0.2);
}
mark {
/* Text highlighted by using the <mark> element */
text-shadow: 1px 1px 4px var(--link-color);
background-color: inherit;
color: var(--text-color);
}
/* Links: */
a {
text-decoration: underline;
}
a,
a:visited {
color: var(--link-color);
}
a:hover,
a:focus {
color: var(--link-color-hover);
text-decoration: none;
}
/* -------------------------------------------------------- */
/* LAYOUT */
/* -------------------------------------------------------- */
.layout {
width: 1200px;
display: grid;
grid-gap: var(--margin);
grid-template: "header" auto "main" auto "footer" auto / auto;
/* Confused by the grid? Check out my tutorial: https://petrapixel.neocities.org/coding/positioning-tutorial#grid */
}
main {
grid-area: main;
overflow-y: auto;
padding: var(--padding);
background: var(--content-background-color);
border: var(--border);
border-radius: var(--round-borders);
}
/* -------------------------------------------------------- */
/* HEADER */
/* -------------------------------------------------------- */
header {
grid-area: header;
font-size: 1.2em;
border: var(--border);
border-radius: var(--round-borders);
background: var(--content-background-color);
}
.header-content {
padding: var(--padding);
}
.header-title {
font-family: var(--heading-font);
font-size: 1.5em;
font-weight: bold;
}
.header-image img {
width: 100%;
height: auto;
}
/* -------------------------------------------------------- */
/* SIDEBARS */
/* -------------------------------------------------------- */
aside {
grid-area: aside;
border: var(--border);
border-radius: var(--round-borders);
overflow: hidden;
background: var(--sidebar-background-color);
padding: var(--padding);
color: var(--sidebar-text-color);
}
.left-sidebar {
grid-area: leftSidebar;
}
.right-sidebar {
grid-area: rightSidebar;
}
.sidebar-title {
font-weight: bold;
font-size: 1.2em;
font-family: var(--heading-font);
}
.sidebar-section:not(:last-child) {
margin-bottom: 3em;
}
.sidebar-section ul,
.sidebar-section ol {
padding-left: 1.5em;
}
.sidebar-section > *:not(p):not(ul):not(ol):not(blockquote) {
margin-top: 10px;
}
/* Sidebar Blockquote: */
.sidebar-section blockquote {
background: rgba(0, 0, 0, 0.1);
padding: 15px;
margin: 1em 0;
border-radius: 10px;
overflow: hidden;
}
.sidebar-section blockquote > *:first-child {
margin-top: 0;
}
.sidebar-section blockquote > *:last-child {
margin-bottom: 0;
}
/* Site Button: */
.site-button {
display: flex;
flex-direction: column;
align-items: center;
}
.site-button textarea {
font-family: monospace;
font-size: 0.7em;
}
/* -------------------------------------------------------- */
/* NAVIGATION */
/* -------------------------------------------------------- */
nav {
margin-bottom: 3em;
}
nav .sidebar-title {
margin-bottom: 0.5em;
}
nav ul {
margin: 0 -5px;
padding: 0;
list-style: none;
user-select: none;
}
nav ul li {
margin-bottom: 0;
}
nav > ul li > a,
nav > ul li > strong {
display: inline-block;
}
nav > ul li > a,
nav > ul li > details summary,
nav > ul li > strong {
padding: 5px 10px;
}
nav > ul li > a.active,
nav > ul li > details.active summary {
font-weight: bold;
}
nav ul summary {
cursor: pointer;
}
nav ul ul li > a {
padding-left: 30px;
}
/* NAVIGATION IN HEADER */
header nav {
margin-bottom: 0;
}
header nav ul {
display: flex;
flex-wrap: wrap;
margin: 0;
}
header nav ul li {
position: relative;
}
header nav ul li:first-child > a {
padding-left: 0;
}
header nav ul li:last-child > a {
padding-right: 0;
}
/* Subnavigation (Drop-Down): */
header nav ul ul {
background: var(--content-background-color);
display: none;
position: absolute;
top: 100%;
left: 10px;
padding: 0.5em;
z-index: 1;
border: var(--border);
min-width: 100%;
box-shadow: 0px 1px 5px rgba(0,0,0,0.2);
}
header nav ul li:hover ul,
header nav ul li:focus-within ul {
display: block;
}
header nav ul li strong {
color: var(--link-color);
text-decoration: underline;
font-weight: normal;
}
header nav ul ul li a {
display: block;
padding-left: 0;
padding-right: 0;
}
/* -------------------------------------------------------- */
/* CONTENT */
/* -------------------------------------------------------- */
main {
line-height: 1.5;
}
main a,
main a:visited {
color: var(--link-color);
}
main a:hover,
main a:focus {
color: var(--link-color-hover);
text-decoration-style: wavy;
}
main p,
main .image,
main .full-width-image,
main .two-columns {
margin: 0.75em 0;
}
main ol,
main ul {
margin: 0.5em 0;
padding-left: 1.5em;
}
main ol li,
main ul li {
margin-bottom: 0.2em;
line-height: 1.3;
}
main ol {
padding-left: 2em;
}
main blockquote {
background: rgba(0, 0, 0, 0.1);
padding: 15px;
margin: 1em 0;
border-radius: 10px;
}
main pre {
margin: 1em 0 1.5em;
}
main code {
text-transform: none;
}
main center {
margin: 1em 0;
padding: 0 1em;
}
main hr {
border: 0;
border-top: var(--border);
margin: 1.5em 0;
}
/* HEADINGS: */
main h1,
main h2,
main h3,
main h4,
main h5,
main h6 {
font-family: var(--heading-font);
margin-bottom: 0;
line-height: 1.5;
}
main h1:first-child,
main h2:first-child,
main h3:first-child,
main h4:first-child,
main h5:first-child,
main h6:first-child {
margin-top: 0;
}
main h1 {
font-size: 1.5em;
}
main h2 {
font-size: 1.4em;
}
main h3 {
font-size: 1.3em;
}
main h4 {
font-size: 1.2em;
}
main h5 {
font-size: 1.1em;
}
main h6 {
font-size: 1em;
}
/* COLUMNS: */
.two-columns {
display: flex;
}
.two-columns > * {
flex: 1 1 0;
margin: 0;
}
.two-columns > *:first-child {
padding-right: 0.75em;
}
.two-columns > *:last-child {
padding-left: 0.75em;
}
/* -------------------------------------------------------- */
/* CONTENT IMAGES */
/* -------------------------------------------------------- */
.image {
display: block;
width: auto;
height: auto;
max-width: 100%;
}
.full-width-image {
display: block;
width: 100%;
height: auto;
}
.images {
display: flex;
width: calc(100% + 5px + 5px);
margin-left: -5px;
margin-right: -5px;
}
.images img {
width: 100%;
height: auto;
padding: 5px;
margin: 0;
overflow: hidden;
}
/* -------------------------------------------------------- */
/* ACCESSIBILITY */
/* -------------------------------------------------------- */
/* please do not remove this. */
#skip-to-content-link {
position: fixed;
top: 0;
left: 0;
display: inline-block;
padding: 0.375rem 0.75rem;
line-height: 1;
font-size: 1.25rem;
background-color: var(--content-background-color);
color: var(--text-color);
transform: translateY(-3rem);
transition: transform 0.1s ease-in;
z-index: 99999999999;
}
#skip-to-content-link:focus,
#skip-to-content-link:focus-within {
transform: translateY(0);
}
/* -------------------------------------------------------- */
/* MOBILE RESPONSIVE */
/* -------------------------------------------------------- */
/* CSS Code for devices < 800px */
@media (max-width: 800px) {
body {
font-size: 14px;
}
.layout {
width: 100%;
grid-template: "header" auto "rightSidebar" auto "main" auto "leftSidebar" auto "footer" auto / 1fr;
/* Confused by the grid? Check out my tutorial: https://petrapixel.neocities.org/coding/positioning-tutorial#grid */
}
aside {
border-bottom: 1px solid;
padding: 9px;
font-size: 0.9em;
}
nav {
padding: 0;
}
nav > ul {
padding-top: 0.5em;
}
nav > ul li > a,
nav > ul li > details summary,
nav > ul li > strong {
padding: 0.5em;
}
main {
max-height: none;
padding: 15px;
}
.images {
flex-wrap: wrap;
}
.images img {
width: 100%;
}
#skip-to-content-link {
font-size: 1rem;
}
}
</style>
</html>