:root{--page-bg:#f4f2ef;--text:#1a1a1a;--date:var(--neutral-020);--accent:#f7452a;--mail-bg:#fbfaf9;--lock-bg:#fdd4ce;--pulse-bg:#ced8fd;--neutral-020:#404040;--neutral-070:#c0b8a5;--neutral-090:#eeece7;--lane:#d5d0c3;--ease-out:cubic-bezier(.23, 1, .32, 1);--underline-trace-ms:.7s;--page-pad:32px;--page-bar-control:30px;--page-bar-inset:12px;--page-bar-h:calc(var(--page-pad) + env(safe-area-inset-top,0px) + var(--page-bar-control) + var(--page-bar-inset))}@font-face{font-family:Satoshi Variable;src:url(/fonts/Satoshi-Variable.woff2)format("woff2");font-weight:100 900;font-style:normal;font-display:swap}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--page-bg);color:var(--text);-webkit-font-smoothing:antialiased;font-family:Satoshi Variable,sans-serif;font-size:18px;line-height:1.4}.board{grid-template:".copy mail""a copy."1fr"lock load pulse"/207px minmax(0,1fr) 207px;gap:32px;min-height:100dvh;padding:32px;display:grid;position:relative}.copy{grid-area:copy;place-self:center;max-width:430px;display:grid}.copy-layer[data-copy=idle]{flex-direction:column;gap:24px;display:flex}.copy-layer{transition:opacity .2s var(--ease-out), transform .2s var(--ease-out);opacity:0;pointer-events:none;grid-area:1/1;align-self:center;transform:translateY(8px)}.copy-layer[data-active=true]{opacity:1;pointer-events:auto;z-index:1;transform:translateY(0)}.date{color:var(--date)}.title{font-size:18px;font-weight:450}.copy a{color:var(--accent)}.squiggle-link{color:inherit;outline-offset:2px;text-decoration:none;display:inline-block;position:relative}.squiggle-link:focus-visible{outline:2px solid var(--accent)}.squiggle-link-label{z-index:1;position:relative}.underline-mark{pointer-events:none;inset-inline:0;width:100%;height:.45em;position:absolute;bottom:-.15em;overflow:visible}.underline-mark [data-underline-stroke]{stroke-dasharray:1 2;stroke-dashoffset:1px;transition:stroke-dashoffset var(--underline-trace-ms) var(--ease-out)}.squiggle-link:focus-visible .underline-mark [data-underline-stroke],.squiggle-link[aria-pressed=true] .underline-mark [data-underline-stroke]{stroke-dashoffset:0}.clip[data-area=a]{background:var(--accent);grid-area:a;place-self:end start}.clip[data-area=mail]{background:var(--mail-bg);grid-area:mail;justify-self:end}.clip[data-area=lock]{background:var(--lock-bg);grid-area:lock;justify-self:start}.clip[data-area=load]{grid-area:load;justify-self:center}.clip[data-area=pulse]{background:var(--pulse-bg);grid-area:pulse;justify-self:end}.clip{aspect-ratio:207/154;width:207px;transition:filter .15s;overflow:hidden}a.clip{color:inherit;text-decoration:none}.board[data-hover] .clip{filter:grayscale()}.board[data-hover=a] .clip[data-area=a],.board[data-hover=mail] .clip[data-area=mail],.board[data-hover=lock] .clip[data-area=lock],.board[data-hover=load] .clip[data-area=load],.board[data-hover=pulse] .clip[data-area=pulse]{filter:none}.clip video{object-fit:cover;width:100%;height:100%;display:block}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.copy,.clip{animation:fadeIn .2s var(--ease-out) both}.clip[data-area=a]{animation-delay:0s}.clip[data-area=mail]{animation-delay:50ms}.clip[data-area=lock]{animation-delay:.1s}.clip[data-area=load]{animation-delay:.15s}.clip[data-area=pulse]{animation-delay:.2s}.board-timer{z-index:2;align-items:center;height:154px;display:flex;position:absolute;top:32px;left:50%;transform:translate(-50%)}.board-timer-stage{display:grid}.board-timer-layer{transition:opacity .2s var(--ease-out), transform .2s var(--ease-out);opacity:0;pointer-events:none;grid-area:1/1;transform:translateY(8px)}.board-timer-layer[data-active=true]{opacity:1;pointer-events:auto;transform:translateY(0)}@media (max-width:720px){.board{grid-template-columns:120px minmax(0,1fr) 120px;gap:16px;padding:16px}.clip{width:120px}.board-timer{height:89.2754px;top:16px}}@media (max-width:479px){.board{grid-template:auto/1fr;align-content:start;gap:32px;padding:32px}.copy{grid-area:1;align-self:start;width:100%;max-width:none}.clip{width:100%}.clip[data-area=mail]{grid-area:2}.clip[data-area=lock]{grid-area:3}.clip[data-area=a]{grid-area:4;align-self:auto}.clip[data-area=load]{grid-area:5}.clip[data-area=pulse]{grid-area:6}.board-timer{height:auto;top:32px}}@media (prefers-reduced-motion:reduce){.copy,.clip{animation:fade .2s var(--ease-out) both;transform:translateY(0)}.copy-layer,.board-timer-layer{transform:none}@keyframes fade{0%{opacity:0}to{opacity:1}}}.page-bar{z-index:3;background:var(--page-bg);margin-inline:-32px;margin-top:calc(var(--page-pad) - var(--page-bar-inset));padding-inline:32px;padding-top:calc(var(--page-bar-inset) + env(safe-area-inset-top,0px));padding-bottom:var(--page-bar-inset);position:sticky;top:0}.craft{padding:0 32px 32px;display:flow-root}.craft-back{width:fit-content;color:inherit;border-radius:4px;align-items:center;gap:4px;padding:4px 12px 4px 1px;text-decoration:none;transition:background-color .15s;display:flex}button.craft-back{font:inherit;cursor:pointer;background:0 0;border:0}.craft-back:not(:has(.craft-back-icon)){padding-left:12px}.craft-back-icon{flex-shrink:0;width:20px;height:20px;display:block;overflow:clip}.craft-back img{width:20px;height:20px;display:block}.craft-bento,.fragments-error,.fragments-columns{--cols:1;--gap:32px;--card-h:calc((100cqi - (var(--cols) - 1) * var(--gap)) / var(--cols) * 154 / 207);margin-top:max(32px, calc(100dvh - var(--page-bar-h) - var(--card-h) - var(--gap) - (var(--card-h) / 4)));container-type:inline-size}.craft-bento{gap:var(--gap);grid-template-columns:minmax(0,1fr);display:grid}.craft-intro{color:var(--neutral-020);text-align:center;align-self:center;font-size:18px}.craft-card{aspect-ratio:207/154;color:inherit;text-decoration:none;position:relative;overflow:hidden}.craft-card-meta{pointer-events:none;z-index:1;justify-content:space-between;display:flex;position:absolute;inset:12px}.craft-card-title{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.craft-card-date{flex-shrink:0}.craft-card video{object-fit:cover;width:100%;height:100%;display:block}.craft-card[data-area=a]{background:var(--accent)}.craft-card[data-area=mail]{background:var(--mail-bg)}.craft-card[data-area=lock]{background:var(--lock-bg)}.craft-card[data-area=pulse]{background:var(--pulse-bg)}@media (min-width:720px){.craft-bento,.fragments-error,.fragments-columns{--cols:3}.craft-bento{grid-template-columns:repeat(3,minmax(0,1fr))}.craft-intro{grid-area:1/2}.craft-card-title{text-overflow:clip;white-space:normal;overflow:visible}}@media (hover:hover) and (pointer:fine){.craft-back:hover{background:var(--neutral-090)}.squiggle-link:hover .underline-mark [data-underline-stroke]{stroke-dashoffset:0}.fragments-lane:hover:before{background:var(--neutral-070)}}.fragments{min-height:100dvh;padding:0 32px 32px;display:flow-root}.fragments-essay-column,.fragments-note-column{flex-direction:column;align-items:center;display:flex}.fragments-reading{flex-direction:column;gap:103px;width:100%;max-width:620px;display:flex}.fragments-intro,.fragments-essay,.fragments-note,.fragments-error{width:100%;max-width:620px}.fragments-intro{color:var(--date);flex-direction:column;gap:1.4em;display:flex}.fragments-byline{margin-bottom:24px}.fragments-section+.fragments-section{margin-top:48px}.fragments-section h2{margin-bottom:0}.fragments-section p{color:var(--date);margin-bottom:1.4em}.fragments-phrase{color:var(--accent);font:inherit;cursor:pointer;background:0 0;border:0;padding:0}.fragments-error{color:var(--date)}.fragments-note h2{margin-bottom:0}.fragments-note-body{color:var(--date);white-space:pre-wrap}.fragments-note-column{transition:opacity .28s var(--ease-out), transform .28s var(--ease-out)}.fragments-lane{--fragments-lane-pad:16px;width:100%;padding-block:var(--fragments-lane-pad);touch-action:none;cursor:row-resize;-webkit-user-select:none;user-select:none;transition:opacity .28s var(--ease-out);align-items:center;display:flex;position:relative}.fragments-lane:focus{outline:none}.fragments-lane:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.fragments[data-note=closing] .fragments-note-column{transition:opacity .22s var(--ease-out), transform .22s var(--ease-out)}.fragments[data-note=entering] .fragments-note-column,.fragments[data-note=closing] .fragments-note-column{opacity:0;pointer-events:none;transform:translateY(12px)}.fragments[data-note=entering] .fragments-lane,.fragments[data-note=closing] .fragments-lane{opacity:0;pointer-events:none}.fragments[data-note=open] .fragments-lane{transition-delay:80ms}.fragments[data-note=open] .fragments-note-column{transition-delay:.14s}.fragments[data-note=closing] .fragments-lane{transition-duration:.22s}.fragments-lane:before{content:"";background:var(--lane);width:100%;height:1px;transition:background-color .15s}.fragments-lane[data-dragging]:before{background:var(--neutral-070)}.fragments[data-dragging]{-webkit-user-select:none;user-select:none}.fragments[data-dragging] .fragments-note-column{transition:opacity .12s linear}.fragments[data-will-close] .fragments-note-column{opacity:.45}.fragments[data-split=true]{grid-template-rows:auto minmax(0,1fr);height:100dvh;display:grid;overflow:hidden}.fragments[data-split=true] .page-bar{z-index:1}.fragments[data-split=true] .fragments-columns{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0, 1fr) auto var(--fragments-note-size,minmax(0, 1fr));z-index:2;gap:32px;min-height:0;margin-top:0;display:grid;position:relative;overflow:visible}.fragments[data-split=true] .fragments-lane{margin-inline:calc(-1 * var(--page-pad));width:auto}.fragments[data-split=true] .fragments-columns[data-split-snap]{transition:grid-template-rows .2s var(--ease-out)}.fragments[data-split=true] .fragments-essay-column,.fragments[data-split=true] .fragments-note-column{min-height:0;overflow:auto}html,.fragments[data-split=true] .fragments-essay-column,.fragments[data-split=true] .fragments-note-column{scrollbar-width:thin}@media (hover:hover) and (pointer:fine){html,.fragments[data-split=true] .fragments-essay-column,.fragments[data-split=true] .fragments-note-column{scrollbar-color:transparent transparent}html:hover,.fragments[data-split=true] .fragments-essay-column:hover,.fragments[data-split=true] .fragments-note-column:hover{scrollbar-color:color-mix(in srgb, var(--text) 35%, transparent) transparent}}@media (min-width:1000px){.fragments[data-split=true] .fragments-columns{grid-template-columns:minmax(0, 1fr) auto var(--fragments-note-size,minmax(0, 1fr));grid-template-rows:none}.fragments[data-split=true] .fragments-columns[data-split-snap]{transition:grid-template-columns .2s var(--ease-out)}.fragments[data-split=true] .fragments-lane{margin-inline:0}.fragments-lane{width:auto;height:auto;min-height:0;padding-block:0;padding-inline:var(--fragments-lane-pad);cursor:col-resize;z-index:4;flex-direction:column;align-self:stretch}.fragments-lane:before{top:-100dvh;bottom:calc(-1 * var(--page-pad));pointer-events:none;flex:1;width:1px;height:auto;position:absolute;left:50%;transform:translate(-50%)}.fragments[data-note=entering] .fragments-note-column,.fragments[data-note=closing] .fragments-note-column{transform:translate(16px)}}@media (pointer:coarse){.fragments-lane{--fragments-lane-pad:22px}}@media (prefers-reduced-motion:reduce){.fragments[data-note=entering] .fragments-note-column,.fragments[data-note=closing] .fragments-note-column{transition:opacity .18s var(--ease-out);transform:none}.fragments[data-split=true] .fragments-columns[data-split-snap]{transition:none}.fragments[data-note=entering] .fragments-lane,.fragments[data-note=closing] .fragments-lane{transition:opacity .18s var(--ease-out)}.fragments[data-note=open] .fragments-lane,.fragments[data-note=open] .fragments-note-column{transition-delay:0s}.underline-mark [data-underline-stroke]{transition:none}.squiggle-link:hover .underline-mark [data-underline-stroke],.squiggle-link:focus-visible .underline-mark [data-underline-stroke]{stroke-dashoffset:0}}