https://bravenew.net

HASH 86a3cdc1270669cbd22ee92971a354b3
This item was proven by @furstenberg on 2023-04-06T13:00:58+00:00. (View all of @furstenberg’s proofs.)
Evidence

This is a copy of the web page retrieved on 2023-04-06T13:00:58+00:00. Show the proof snippet.
<!DOCTYPE html>
<html lang="en"><head>
	<title>Home · Brave New Net</title>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta name="description" content="It's a brave new net."> <link rel="alternate" type="application/rss+xml" title="RSS feed" href="/rss.xml">
<link rel="alternate" type="application/atom+xml" title="Atom feed" href="/atom.xml">
<link rel="alternate" type="application/json" title="JSON feed" href="/feed.json">

	<style>
		:root {
			--space-xs: clamp(0.75rem, 0.69rem + 0.29vw, 0.9375rem);
			--space-s: clamp(1rem, 0.92rem + 0.39vw, 1.25rem);
			--space-m: clamp(1.5rem, 1.38rem + 0.58vw, 1.875rem);
			--space-l: clamp(2rem, 1.84rem + 0.78vw, 2.5rem);
			--space-xl: clamp(3rem, 2.77rem + 1.17vw, 3.75rem);
			--space-2xl: clamp(4rem, 3.69rem + 1.55vw, 5rem);
			--space-3xl: clamp(6rem, 5.53rem + 2.33vw, 7.5rem);
			--space-xs-s: clamp(0.75rem, 0.59rem + 0.78vw, 1.25rem);
			--space-s-m: clamp(1rem, 0.73rem + 1.36vw, 1.875rem);
			--space-m-l: clamp(1.5rem, 1.19rem + 1.55vw, 2.5rem);
			--space-l-xl: clamp(2rem, 1.46rem + 2.72vw, 3.75rem);
			--space-l-2xl: clamp(2rem, 1.07rem + 4.66vw, 5rem);
			--space-xl-2xl: clamp(3rem, 2.38rem + 3.11vw, 5rem);
			--space-2xl-3xl: clamp(4rem, 2.91rem + 5.44vw, 7.5rem);
			--size-step-0: clamp(1rem, 0.92rem + 0.39vw, 1.25rem);
			--size-step-1: clamp(1.1875rem, 1.01rem + 0.87vw, 1.75rem);
			--size-step-2: clamp(1.4375rem, 1.11rem + 1.65vw, 2.5rem);
			--size-step-3: clamp(1.75rem, 1.19rem + 2.82vw, 3.5625rem);
			--size-step-4: clamp(2.0625rem, 1.15rem + 4.56vw, 5rem);
			--size-step-5: clamp(2.5rem, 1.08rem + 7.09vw, 7.0625rem);
			--size-step-6: clamp(3rem, 0.84rem + 10.78vw, 9.9375rem);
			--gutter: var(--space-s-m);
			--border-radius: var(--size-step-1);
			--transition-base: 250ms ease;
			--transition-movement: 200ms linear;
			--transition-fade: 200ms ease;
			--transition-bounce: 500ms cubic-bezier(0.5, 0.05, 0.2, 1.5);
			--gray8: #343a40;
			--gray9: #212529;
			--lime5: #94d82d;
			--violet5: #845ef7;
			--yellow5: #fec50d;
			--colour-background1: var(--gray9);
			--colour-background2: var(--gray8);
			--colour-highlight: var(--yellow5);
			--colour-text: #f8f9fa;
		}

		body {
			background-color: var(--colour-background1);
			color: var(--colour-text);
			display: flex;
			flex-direction: column;
			font-family: system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
			font-size: var(--size-step-1);
			line-height: 1.5;
			margin: 0;
			min-height: 100vh;
			text-rendering: optimizeSpeed;
		}

		img,
		picture {
			display: block;
			max-width: 100%;
		}

		h1 {
			color: var(--gray9);
			font-size: var(--size-step-5);
		}

		h2 {
			color: var(--lime5);
			font-size: var(--size-step-3);
		}

		h3 {
			font-size: var(--size-step-2);
		}

		h1,
		h2,
		h3 {
			max-width: 40ch;
			margin-bottom: 0;
			margin-top: 0;
		}

		a {
			color: var(--gray9);
			font-size: var(--size-step-1);
			font-weight: 700;
			padding: 0.5rem;
		}

		a:hover {
			background: var(--gray9);
			color: var(--yellow5);
			font-size: var(--size-step-1);
			font-weight: 700;
			padding: 0.5rem;
		}

		blockquote {
			border-inline-start: var(--space-xs) solid var(--colour-highlight);
			font-family: var(--font-serif);
			font-size: var(--size-step-1);
			font-style: italic;
			margin-inline-start: var(--space-xs);
			padding: var(--space-m-l);
		}

		:focus-visible {
			border-radius: 3px;
			outline: 3px solid;
			outline-offset: .3ch;
		}

		.blog-footer {
			background-color: var(--colour-highlight);
			color: var(--gray9);
			display: flex;
			justify-content: end;
			margin-top: var(--gutter);
		}

		.blog-footer nav {
			display: flex;
			flex-grow: 1;
			justify-content: flex-end;
		}

		.blog-footer ul {
			display: flex;
			flex-direction: column;
			list-style-type: none;
			margin-bottom: 0;
			margin-right: var(--space-s);
		}

		.blog-footer li {
			list-style-type: none;
			margin-block-end: var(--space-xs);
		}

		.blog-header {
			background-color: var(--violet5);
			clip-path: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 1rem));
			padding: var(--gutter);
		}

		.credit {
			margin-inline-start: var(--gutter);
			max-width: 25ch;
		}

		.credit__link {
			padding-left: 0;
			padding-right: 0;
		}

		.blog-header__credit {
			display: flex;
			font-size: 12px;
			justify-content: end;
			margin-top: 0;
		}

		.blog-header__link {
			color: var(--colour-text);
			font-size: inherit;
			padding: 0 0.1rem;
		}

		.blog-header__link:hover {
			color: var(--colour-highlight);
			font-size: inherit;
			padding: 0 0.1rem;
		}

		.link-post {
			background-color: var(--colour-background2);
			border-radius: var(--border-radius);
			margin-left: var(--space-m);
			margin-right: var(--space-m);
		}

		.link-post a {
			color: var(--yellow5);
			font-size: var(--size-step-1);
			font-weight: 700;
			padding: 0.5rem;
		}

		.link-post a:hover {
			background: var(--gray9);
			color: var(--yellow5);
			font-size: var(--size-step-1);
			font-weight: 700;
			padding: 0.5rem;
		}

		.link-post p {
			display: flex;
		}

		.link-post__content {
			padding: var(--gutter);
		}

		.link-post__curve {
			fill: var(--colour-background1);
			display: block;
			height: 3.5em;
			padding: -(var(--gutter));
			width: 100%;
		}

		.post-info {
			font-size: var(--size-step-0);
			padding-right: var(--space-s);
			text-align: end;
		}

		.stack {
			display: flex;
			flex-direction: column;
			flex-grow: 1;
			justify-content: flex-start;
			margin-left: auto;
			margin-right: auto;
			margin-top: var(--gutter);
			max-width: 85rem;
		}

		.stack>* {
			margin-bottom: 0;
			margin-top: 0;
		}

		.stack>*+* {
			margin-top: var(--gutter);
		}

	</style>
</head>

<body>

	<header class="blog-header">
		<h1>Brave New Net</h1>
		<p class="blog-header__credit">by <a href="https://furstenberg.co" class="blog-header__link">Michael
				Fürstenberg</a></p>
	</header>

	<main class="stack">
		<article class="link-post">
			<svg class="link-post__curve" preserveAspectRatio="none" viewBox="0 0 1440 96" fill="none" xmlns="http://www.w3.org/2000/svg">
				<path d="m0 96 80-5.3C160 85 320 75 480 64s320-21 480-21.3c160 .3 320 10.3 400 16l80 5.3V0H0v96Z">
				</path>
			</svg>

			<div class="link-post__content">
				<p>It's a Brave new net out there.</p>
<p>proven.lol/b6bafb</p>

				<aside class="post-info">
					April 6, 2023 8:59 AM
				</aside>
			</div>
		</article>
	</main>

	<footer class="blog-footer">
		<p class="credit">Made with <a href="https://weblog.lol" class="credit__link">weblog.lol</a>.</p>
		<nav>
<ul>
<li><a href="/home">Home</a></li>
<li><a href="/posts">Posts</a></li>
<li><a href="/about">About</a></li></ul>
</nav>
	</footer>




</body></html>