:root{--bg:#ffe600;--ink:#000;--mono:ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;background:var(--bg);color:var(--ink)}body{margin:0;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;font-size:1.125rem;line-height:1.45}img,video{max-width:100%;height:auto}[hidden]{display:none!important}.site{flex-direction:column;min-height:100dvh;padding:clamp(1rem,4vw,3rem);display:flex}.site-header{border-bottom:6px solid var(--ink);margin-bottom:3rem;padding-bottom:2rem}.site-title{letter-spacing:-.04em;text-transform:uppercase;overflow-wrap:anywhere;margin:0 0 1.5rem;font-size:clamp(3rem,13vw,9rem);font-weight:900;line-height:.92}.site-title a{color:inherit;text-decoration:none}.site-lede{max-width:30em;margin:0;font-size:clamp(1.25rem,2.5vw,1.75rem);font-weight:700;line-height:1.2}.site-nav{font-family:var(--mono);text-transform:uppercase;gap:1.5rem;margin-top:1.5rem;font-size:.875rem;font-weight:700;display:flex}.site-nav a,.site-footer a{color:inherit;text-underline-offset:3px;text-decoration:underline;text-decoration-thickness:3px}.site-nav a:hover,.site-footer a:hover{background:var(--ink);color:var(--bg)}.color-picker{margin-top:2rem}.palette{justify-items:start;gap:1rem;display:grid}.color-picker-trigger{display:none}@media (max-width:640px){.color-picker-inline{display:none}.color-picker-trigger{border-radius:50%;display:block}}.color-dialog{border:4px solid var(--ink);width:min(100% - 2rem,24rem);max-height:calc(100dvh - 2rem);box-shadow:8px 8px 0 var(--ink);background:var(--bg);color:var(--ink);padding:0}.color-dialog::backdrop{background:#00000080}.color-dialog-body{gap:1.5rem;padding:1.25rem;display:grid}.color-dialog .custom-color{width:100%}.color-dialog-close{border:4px solid var(--ink);box-shadow:4px 4px 0 var(--ink);background:var(--ink);color:var(--bg);font-family:var(--mono);text-transform:uppercase;cursor:pointer;justify-self:end;padding:.5rem 1rem;font-size:.875rem;font-weight:700}.color-dialog-close:focus-visible{outline:4px dashed var(--ink);outline-offset:4px}.color-picker-label,.hex{font-family:var(--mono);text-transform:uppercase;font-size:.875rem;font-weight:700}.swatches{flex-wrap:wrap;gap:1rem;padding:0 6px 6px 0;display:flex}.swatch{border:4px solid var(--ink);width:2.5rem;height:2.5rem;box-shadow:4px 4px 0 var(--ink);cursor:pointer;padding:0}.swatch:hover{box-shadow:2px 2px 0 var(--ink);transform:translate(2px,2px)}.swatch[aria-pressed=true],.swatch-custom[data-selected=true],.swatch-custom[aria-expanded=true]{box-shadow:none;outline:4px solid var(--ink);outline-offset:2px;transform:translate(4px,4px)}.swatch:focus-visible{outline:4px dashed var(--ink);outline-offset:4px}.swatch-custom{background:conic-gradient(red,#ff0,#0f0,#0ff,#00f,#f0f,red)}.custom-color{border:4px solid var(--ink);width:min(100%,20rem);box-shadow:8px 8px 0 var(--ink);gap:1rem;margin:0 8px 8px 0;padding:1rem;display:grid}.sv-area{aspect-ratio:3/2;border:4px solid var(--ink);touch-action:none;cursor:crosshair;background-image:linear-gradient(#0000,#000),linear-gradient(90deg,#fff,#0000);position:relative}.sv-area:focus-visible{outline:4px dashed var(--ink);outline-offset:4px}.sv-thumb{pointer-events:none;width:1rem;height:1rem;position:absolute;transform:translate(-50%,-50%);box-shadow:0 0 0 2px #fff,0 0 0 4px #000}.hue{appearance:none;border:4px solid var(--ink);cursor:pointer;background:linear-gradient(90deg,red,#ff0,#0f0,#0ff,#00f,#f0f,red);width:100%;height:1.75rem;margin:0}.hue::-webkit-slider-thumb{appearance:none;background:#fff;border:3px solid #000;border-radius:0;width:.75rem;height:1.75rem}.hue::-moz-range-thumb{background:#fff;border:3px solid #000;border-radius:0;width:.75rem;height:1.75rem}.hue:focus-visible{outline:4px dashed var(--ink);outline-offset:4px}.posts{flex:1}.post{border:4px solid var(--ink);box-shadow:10px 10px 0 var(--ink);margin-bottom:2.5rem}.post-head{grid-template-columns:1fr auto;grid-template-areas:"date marker""title marker""lede marker";gap:.5rem 1.5rem;padding:1.25rem 1.5rem;transition:background-color .2s,color .2s;display:grid;position:relative}.post-head:hover,.post[data-open=true] .post-head{background:var(--ink);color:var(--bg)}.post-date{font-family:var(--mono);grid-area:date;font-size:.875rem;font-weight:700}.post-title{letter-spacing:-.02em;text-transform:uppercase;grid-area:title;margin:0;font-size:clamp(1.5rem,3.5vw,2.5rem);font-weight:900;line-height:1}.post-toggle{all:unset;font:inherit;color:inherit;cursor:pointer}.post-toggle:after{content:"";position:absolute;inset:0}.post-toggle:focus-visible:after{outline-offset:-8px;outline:4px dashed}.post-lede{grid-area:lede;max-width:40rem;margin:0}.post-marker{grid-area:marker;align-self:center;width:1.75rem;height:1.75rem;position:relative}.post-marker:before,.post-marker:after{content:"";background:currentColor;height:6px;margin-top:-3px;transition:transform .3s;position:absolute;inset:50% 0 auto}.post-marker:after{transform:rotate(90deg)}.post[data-open=true] .post-marker:after{transform:rotate(0)}.post-body{opacity:0;grid-template-rows:0fr;transition:grid-template-rows .35s,opacity .25s;display:grid}.post[data-open=true] .post-body{opacity:1;grid-template-rows:1fr}.post-body-clip{min-height:0;overflow:hidden}.post-body-inner{border-top:4px solid var(--ink);padding:1.5rem}@media (prefers-reduced-motion:reduce){.post-head,.post-marker:before,.post-marker:after,.post-body{transition:none}}.prose>:first-child{margin-top:0}.prose>:last-child{margin-bottom:0}.prose :is(p,ul,ol,blockquote){max-width:65ch;margin:0 0 1em}.prose :is(ul,ol){padding-left:1.5em}.prose h3{text-transform:uppercase;margin:2rem 0 .5rem;font-weight:900}.prose a{color:inherit;text-underline-offset:3px;text-decoration:underline;text-decoration-thickness:3px}.prose a:hover{background:var(--ink);color:var(--bg)}.prose blockquote{border-left:8px solid var(--ink);margin:1.5rem 0;padding-left:1rem;font-weight:700}.prose code{font-family:var(--mono);font-size:.9em}.prose pre{background:var(--ink);color:var(--bg);margin:1.5em 0;padding:1rem;line-height:1.4;overflow-x:auto}.prose pre code{font-size:inherit}.page{flex:1}.page-title{letter-spacing:-.02em;text-transform:uppercase;margin:0 0 1.5rem;font-size:clamp(1.5rem,3.5vw,2.5rem);font-weight:900;line-height:1}.site-footer{border-top:6px solid var(--ink);font-family:var(--mono);text-transform:uppercase;justify-content:space-between;margin-top:3rem;padding-top:1rem;font-size:.875rem;font-weight:700;display:flex}