Tweak styles to make things work nicely with "page-looking things"

Signed-off-by: Danila Fedorin <danila.fedorin@gmail.com>

content/writing/pynchon/index.md

@@ -0,0 +1,144 @@
+---
+title: "Everything's Touch"
+date: 2026-05-14T18:01:27-07:00
+draft: true
+custom_css:
+- style.scss
+---
+
+{{< halfpage >}}
+
+## Everything's Touch
+
+"Do you guys have any deuterium water?", he said to a baffled lab manager.
+"You know, heavy water?"
+
+"No... We don't have that...". She didn't recognize him as a student.
+
+"Do you know where I can get some?", continued his barrage of questions,
+"What's a good chemical company? How do I go about ordering heavy water from them?"
+
+What could this guy possibly have to do with heavy water? Why is he so determined?
+When he finally turned and left empty-handed, she breathed a sigh of relief.
+
+Until, that is, another man arrived and made the same request: he wanted heavy water.
+Again, the lab manager refused him. For the rest of the day, she had
+a knot in her stomach. Having failed once, in order to remain under the radar,
+had some shadowy cabal switched representatives, and tried again to attain
+their goal?
+
+Uneasy still the lab manager had dinner, opening YouTube™ on her phone to pass
+the time. On the front page, a video was waiting for her: "the ice cube
+is too heavy!". When frozen, you see, heavy water sinks instead of floating.
+
+There was no plot. Two men, having both seen this video, had independently
+decided to replicate the trick. On the same day, believing it was their
+free will, they visited the same lab and spoke to the same lab manager.
+They felt the touch.
+
+---
+
+> Roland too became conscious of the wind, as his mortality had never allowed him.
+> Discovered it so. ...so joyful, that the arrow must veer into it.
+>
+> -- Thomas Pynchon, *Gravity's Rainbow*
+
+Today, we live amidst an invisible ocean, but not in a physical sense;
+its tides don't pull us out to sea or push us towards the shore; no
+warm undercurrents alternate with cool water as we bob in the waves.
+Standing on a hiking trail and looking out at the path ahead, the world
+might look exactly as it had forty years ago. However, the ocean is
+there, mediated by
+
+{{< /halfpage >}}
+{{< halfpage >}}
+
+electromagnetism instead of fluid. Looking up at the sky,
+nowadays we are reminded of this by the numerous hurtling dots delivering
+the internet to practically every corner of the planet.
+
+Reminded are we of its existence, too, when we hear it speak; when people talk
+about Geese and Velvet Underground; when friends repeat nearly verbatim the
+top post on /r/bald; when men show up to a teaching lab and ask for deuterium.
+Sometimes, these ideas are deliberately planted. Sometimes, they are analogous
+to your classic trends™. Sometimes, they just appear. An enormous behemoth
+stirs deep beneath the waves, and we sway with the current.
+
+---
+
+> If it is in working order, what is it meant to do? The engineers
+> who built it . . . never knew there were any further steps to be taken.
+> Their design was "finalized", and they could forget it.
+>
+> -- Thomas Pynchon, *Gravity's Rainbow*
+
+In _The Age of Surveillance Capitalism_, Shoshana Zuboff
+powerfully reframes the actions of tech giants like Google
+from the perspective of _behavioral surplus_. Google
+and Meta's gluttony for traffic patterns, written sentiment, satellite data,
+identified faces seen by smart glasses, all of it is the endless hunger of an
+influence-machine. Zuboff decries the "priests of the shadow texts",
+Skinnerian manipulators bent on seizing human agency for utopian or,
+more likely, capitalistic ends.
+
+I don't think that's the whole picture.
+
+The surveillance-manipulation machine, running at incredible scale and
+nudging us every moment we search or share or scroll, is ultimately
+unconcerned with truth. Truth is secondary to human behavior. While it
+reaches and connects a double-digit percentage of the world's population,
+the machine lacks any constraint or fundamental purpose beyond engagement.
+It's driven by unfathomably large probabilistic models entangled through
+several orders of interactions with other models.
+
+This enormous amalgamation, joined nowadays by (probably) well-intentioned
+and only-moderately-grounded-in-reality AI™ agents™, is armed with state-of-the-art
+tools and unprecedented influence. With "engagement" its only loose target,
+it ceaselessly perturbs our daily thoughts like Maxwell's demon. Whole
+cliques of people revisit old shows, "discover" a new band, and try Science™.
+
+{{< /halfpage >}}
+{{< halfpage >}}
+
+---
+
+Among _Gravity's Rainbow_'s
+numerous subjects and themes is an intricate and densely
+connected network of markets, influences, and hidden agendas that overlays
+the political conflicts of World War 2. Individuals pursued their own economic
+gains; dealers replaced cocaine with powdered milk; Phoebus intentionally limited
+the lifetimes of lightbulbs; a man dressed like a Rocket smuggled hash past
+an international gathering on behalf of one Sour Bummer. All of this, though, the whole system, took
+on the life of its own: it was the Rocket-state. It acted in ways that were
+inscrutable, mysterious, and yet behind which, in moments of panic or paranoia,
+one could suspect intent. 
+
+The Rocket-state, as Pynchon described it, may or may not have existed.
+It certainly does not exist today. However, beyond Zuboff's cycle of
+dispossession, beyond the powerful surveillance state exposed by Snowden,
+today lies the Attention-state. It is the entity stirring occasionally under
+the surface of the internet's ocean.
+
+I think this is the missing piece. Yes, Google and Meta are selling your
+Gmail inbox's contents to the highest bidder. Yes, the US government is
+in on this. Yeah, Meta's Ray-Bans™ are going to be cataloguing every face
+you encounter on the street, and yeah, the age verification laws are probably
+going to be used to further associate your identity with the rest of
+your data point-cloud. But these are just glimpses of the larger system.
+Those "priests of the shadow texts" are like GR's Freemasons: they perform
+the rituals, but the magic is elsewhere.
+
+This is the closest we've ever been to a truly "unified consciousness".
+We've built ourselves a noosphere, but it's not what we thought it would
+be. It's not _just_ the "world at our fingertips".
+It's not entirely a reflection of human minds. There is an impurity,
+an additional active force that decides which whispers are carried across
+the ocean and which shouts succumb to the inverse-square law.
+
+There it sits, this impurity, mixed in with most human knowledge, with the
+immediate awareness of nearly every event as it occurs in most of the developed
+world. It coats our facts like film, and when an acquaintance hands you
+his packaged opinion, it remains in his handprints, and your heart sinks
+like deuterium ice.
+
+{{< /halfpage >}}

content/writing/pynchon/style.scss

@@ -0,0 +1,93 @@
+@import "variables.scss";
+@import "margin.scss";
+
+body {
+  text-align: left;
+  background-color: white;
+  color: black;
+
+  /* reset to light mode */
+  @each $varName, $varDefault in $css-vars {
+      --#{$varName}: #{$varDefault};
+  }
+}
+
+h1, h2, h3, h4, h5, h6 {
+  font-family: "Times New Roman"
+}
+
+h2 {
+  font-size: 18pt;
+  margin-bottom: 0.2in;
+}
+
+.warning {
+  max-width: $container-width;
+}
+
+.halfpage {
+  width: 5.5in;
+  height: 8.5in;
+  padding: 0.25in;
+  box-sizing: border-box;
+  border: $standard-border;
+  flex-shrink: 0;
+  margin: 0.25in;
+
+  h2 {
+    display: block;
+  }
+
+  @media screen and (max-width: 5.5in) {
+    width: auto;
+    height: auto;
+    margin: 0;
+    border-left: none;
+    border-right: none;
+  }
+}
+
+p {
+  margin-top: 0;
+  margin-bottom: 0.1in;
+}
+
+html .container {
+  max-width: 12in;
+  position: static;
+
+  &:not(main) {
+    @include below-two-margins {
+      padding: 0 $container-min-padding 0 $container-min-padding;
+    }
+  }
+}
+
+main.container {
+  font-family: "Times New Roman";
+  font-size: 12pt;
+  line-height: 14pt;
+
+  display: flex;
+  box-sizing: border-box;
+  flex-wrap: wrap;
+  justify-content: left;
+
+  & > h2 {
+    display: none; /* copied title is on the page */
+  }
+
+  @media screen and (max-width: 5.5in) {
+    display: block;
+  }
+
+  @media screen and (max-width: 12in) {
+    justify-content: center;
+  }
+}
+
+hr {
+  padding-top: 0.1in;
+  padding-bottom: 0.1in;
+  line-height: 0.1in;
+}

layouts/_shortcodes/halfpage.html

@@ -0,0 +1,3 @@
+<div class="halfpage">
+    {{ .Inner | markdownify }}
+</div>