:root{--clay:#a85935;--mark:#ffe14d;--char:#1c1b17;--cream:#f3ede3;--mono:"JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;--sans:"Archivo", ui-sans-serif, system-ui, sans-serif;--t-micro:.6875rem;--t-data:.75rem;--t-ui:.875rem;--t-body:.9375rem;--t-label:1.0625rem;--t-head:1.25rem;--t-name:clamp(2.75rem, 13vw, 4rem);--s1:.5rem;--s2:1rem;--s3:1.5rem;--s4:2.5rem;--s5:4rem;--column:30rem;--radius:22px;--gap:.875rem;--rule:2px solid var(--edge);--lift:4px 4px 0 var(--edge);--lift-high:7px 7px 0 var(--edge);--lift-low:1px 1px 0 var(--edge);--out:cubic-bezier(.22, 1, .36, 1);--spring:cubic-bezier(.34, 1.56, .64, 1);--ease-fast:.18s var(--out);--ease:.32s var(--out)}:root,:root[data-theme=light]{color-scheme:light;--frame:var(--clay);--paper:#f3ede3;--surface:#fffaf1;--ink:#1c1b17;--muted:#4d4a43;--faint:#7d786e;--edge:#1c1b17;--line:#1c1b1724;--grain-blend:multiply}:root[data-theme=dark]{color-scheme:dark;--frame:#1a1815;--paper:#2b2824;--surface:#38342e;--ink:#ebe7dd;--muted:#c2bdb1;--faint:#8d877b;--edge:#0d0c0a;--line:#ebe7dd29;--grain-blend:overlay}*{box-sizing:border-box}html{background-color:var(--paper);background-blend-mode:var(--grain-blend);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;-webkit-text-size-adjust:100%;background-image:url(/brand/paper-grain.png);background-repeat:repeat;background-size:120px 120px;font-size:16px;overflow-x:clip}body{font-size:var(--t-ui);margin:0;line-height:1.5}img,svg{max-width:100%;height:auto}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit}h1,h2,p,ul{margin:0}h1,h2{text-wrap:balance;font-weight:500}p{text-wrap:pretty}ul{padding:0;list-style:none}:focus-visible{outline:3px solid var(--mark);outline-offset:3px}::selection{background:var(--mark);color:var(--char)}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.sr-only:focus-visible{top:var(--s2);left:var(--s2);z-index:30;clip:auto;width:auto;height:auto;padding:var(--s1) var(--s2);border:var(--rule);background:var(--mark);color:var(--char);font-size:var(--t-ui);border-radius:999px;font-weight:500}.wrap{width:100%;max-width:calc(var(--column) + 2 * var(--s2));padding-inline:max(var(--s2), env(safe-area-inset-left)) max(var(--s2), env(safe-area-inset-right));margin-inline:auto}main{flex:1}.tag{font-family:var(--mono);font-size:var(--t-micro);letter-spacing:0;white-space:nowrap;opacity:.8;border:1.5px solid;border-radius:999px;padding:.05rem .45rem;font-weight:500;line-height:1.4;display:inline-block}.panel{flex-direction:column;min-height:100dvh;display:flex}@media (width>=40rem){html{background-color:var(--frame);background-blend-mode:multiply}.panel{width:calc(var(--column) + 2 * var(--s4));min-height:calc(100dvh - 2 * var(--s4));margin:var(--s4) auto;padding-inline:var(--s3);border:var(--rule);background:var(--paper) url(/brand/paper-grain.png) repeat;background-blend-mode:var(--grain-blend);box-shadow:8px 8px 0 var(--edge);background-size:120px 120px;border-radius:40px}}.page-actions{justify-content:space-between;gap:var(--s1);padding-top:max(var(--s2), env(safe-area-inset-top));display:flex}.icon-button{border:var(--rule);background:var(--surface);width:2.5rem;height:2.5rem;color:var(--ink);cursor:pointer;box-shadow:var(--lift-low);transition:transform var(--ease-fast), box-shadow var(--ease-fast), background-color var(--ease);border-radius:999px;place-items:center;display:grid}.icon-button:hover{box-shadow:3px 3px 0 var(--edge);transform:translate(-1px,-1px)}.icon-button:active{box-shadow:none;transform:translate(1px,1px)}.icon-button svg{width:16px;height:16px}:root[data-theme=dark] .icon-sun,:root:not([data-theme=dark]) .icon-moon,.icon-button .icon-check,.icon-button.is-copied .icon-share{display:none}.icon-button.is-copied .icon-check{animation:spin-in .4s var(--out);display:block}.icon-button.is-spun .icon{animation:spin-in .4s var(--out)}.hero{padding-block:var(--s3) var(--s4)}.avatar{border:3px solid var(--edge);object-fit:cover;width:7.5rem;height:7.5rem;box-shadow:5px 5px 0 var(--edge);transition:transform .5s var(--spring);animation:sticker .7s var(--spring) both;border-radius:999px;display:block;transform:rotate(-5deg)}.avatar:hover{transform:rotate(4deg)scale(1.04)}.name{margin-top:var(--s3);font-size:var(--t-name);letter-spacing:-.045em;font-weight:800;font-stretch:125%;line-height:.92}.dot{color:var(--clay)}.role{margin-top:var(--s2);background:var(--mark);color:var(--char);font-size:var(--t-ui);border-radius:999px;padding:.2rem .65rem;font-weight:500;display:inline-block}.bio{max-width:34ch;font-size:var(--t-label);color:var(--muted);margin-top:.75rem;line-height:1.45}.socials{margin-top:var(--s3);flex-wrap:wrap;gap:.625rem;display:flex}.social{border:var(--rule);background:var(--surface);width:2.75rem;height:2.75rem;color:var(--ink);box-shadow:3px 3px 0 var(--edge);transition:transform var(--ease-fast), box-shadow var(--ease-fast), background-color var(--ease-fast), color var(--ease-fast);border-radius:14px;place-items:center;display:grid}.social svg{stroke-width:2px}.social:hover{box-shadow:5px 5px 0 var(--edge);background:var(--mark);color:var(--char);transform:translate(-2px,-2px)rotate(-6deg)}.social:active{box-shadow:none;transform:translate(2px,2px)}.block+.block{margin-top:var(--s4)}.block-title{margin-bottom:var(--s2);font-size:var(--t-head);letter-spacing:-.03em;font-weight:700;font-stretch:125%}.grid{gap:var(--gap);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.tile{--tile-bg:var(--surface);--tile-ink:var(--ink);--tile-soft:var(--muted);border:var(--rule);border-radius:var(--radius);background:var(--tile-bg);color:var(--tile-ink);box-shadow:var(--lift);transition:transform var(--ease-fast), box-shadow var(--ease-fast), background-color var(--ease);animation:pop .55s var(--spring) both;animation-delay:calc(.12s + var(--i,0) * 55ms);flex-direction:column;display:flex;position:relative}.tile.is-wide{grid-column:span 2}.tone-ink{--tile-bg:var(--char);--tile-ink:var(--cream);--tile-soft:#f3ede3b3}:root:not([data-theme=dark]) .tone-ink{box-shadow:4px 4px 0 var(--clay)}:root:not([data-theme=dark]) .tone-ink:hover{box-shadow:7px 7px 0 var(--clay)}:root:not([data-theme=dark]) .tone-ink:has(.tile-link:active){box-shadow:1px 1px 0 var(--clay)}:root[data-theme=dark] .tone-ink{--tile-bg:var(--cream);--tile-ink:var(--char);--tile-soft:#1c1b17ad}.tone-clay{--tile-bg:var(--clay);--tile-ink:var(--cream);--tile-soft:#f3ede3cc}.tone-mark{--tile-bg:var(--mark);--tile-ink:var(--char);--tile-soft:#1c1b17b3}.tile:hover{box-shadow:var(--lift-high);transform:translate(-3px,-3px)}.tile:has(.tile-link:active){box-shadow:var(--lift-low);transform:translate(3px,3px)}.tile-link{gap:var(--s2);min-height:9.5rem;padding:var(--s2);border-radius:inherit;-webkit-tap-highlight-color:transparent;flex-direction:column;flex:1;display:flex}.tile-link:after{content:"";border-radius:inherit;position:absolute;inset:0}.tile-link:focus-visible{outline:none}.tile:has(.tile-link:focus-visible){outline:3px solid var(--mark);outline-offset:4px}.tile.is-wide .tile-link{flex-direction:row;align-items:center;min-height:5.5rem}.tile-mark{border:var(--rule);background:var(--surface);width:3rem;height:3rem;color:var(--ink);border-radius:14px;flex:none;place-items:center;display:grid;overflow:hidden}.tile-mark img{object-fit:cover;width:100%;height:100%;display:block}.tile-text{gap:.15rem;min-width:0;margin-top:auto;display:grid}.tile.is-wide .tile-text{flex:1;margin-top:0}.tile-label{font-size:var(--t-label);letter-spacing:-.02em;flex-wrap:wrap;align-items:center;gap:.4rem;font-weight:700;font-stretch:112%;line-height:1.2;display:flex}.tile:not(.is-wide) .tile-label{font-stretch:100%}.tile-note{font-size:var(--t-ui);color:var(--tile-soft);line-height:1.35}.tile-arrow{top:var(--s2);right:var(--s2);background:color-mix(in srgb, var(--tile-ink) 12%, transparent);width:2rem;height:2rem;transition:transform .35s var(--spring), background-color var(--ease-fast);border-radius:999px;place-items:center;display:grid;position:absolute}.tile.is-wide .tile-arrow{flex:none;position:static}.tile:hover .tile-arrow{background:var(--tile-ink);color:var(--tile-bg);transform:rotate(45deg)}.code{z-index:1;align-items:center;gap:var(--s1);margin:0 var(--s2) var(--s2);border:2px dashed var(--edge);background:var(--mark);color:var(--char);cursor:pointer;transition:transform var(--ease-fast), background-color var(--ease-fast);border-radius:14px;padding:.6rem .9rem;display:flex;position:relative}.code:hover{transform:scale(1.015)}.code:active{transform:scale(.98)}.code-value{font-family:var(--mono);font-size:var(--t-ui);letter-spacing:.06em;font-weight:500}.code-action{font-size:var(--t-ui);margin-left:auto;font-weight:500}.code.is-copied{background:var(--char);color:var(--mark);border-style:solid}.shelf{gap:var(--gap);grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));display:grid}.product{border:var(--rule);border-radius:var(--radius);background:var(--surface);box-shadow:var(--lift);transition:transform var(--ease-fast), box-shadow var(--ease-fast), background-color var(--ease);animation:pop .55s var(--spring) both;animation-delay:calc(.12s + var(--i,0) * 55ms);flex-direction:column;display:flex;overflow:hidden}a.product:hover{box-shadow:var(--lift-high);transform:translate(-3px,-3px)}a.product:active{box-shadow:var(--lift-low);transform:translate(3px,3px)}.product-image{aspect-ratio:1;object-fit:cover;border-bottom:var(--rule);width:100%;height:auto;display:block}.product-body{padding:var(--s2);flex-direction:column;flex:1;align-items:flex-start;gap:.4rem;display:flex}.product-name{font-size:var(--t-head);letter-spacing:-.025em;font-weight:700;font-stretch:112%;line-height:1.15}.product-desc{margin-bottom:var(--s1);font-size:var(--t-ui);color:var(--muted);line-height:1.5}.product-buy{padding:.75rem var(--s2);border:var(--rule);background:var(--mark);color:var(--char);box-shadow:3px 3px 0 var(--edge);font-size:var(--t-body);text-align:center;transition:background-color var(--ease-fast), color var(--ease-fast);border-radius:999px;align-self:stretch;margin-top:auto;font-weight:700;display:block}a.product:hover .product-buy{background:var(--char);color:var(--mark)}.product.is-sold-out{box-shadow:none}.product.is-sold-out .product-name,.product.is-sold-out .product-desc{color:var(--faint)}.product.is-sold-out .product-image{opacity:.6}.product.is-sold-out .product-buy{box-shadow:none;color:var(--faint);background:0 0}.disclosure{margin-top:var(--s2);max-width:52ch;font-size:var(--t-data);color:var(--faint);line-height:1.55}.site-footer{padding:var(--s5) var(--s2) max(var(--s4), env(safe-area-inset-bottom));text-align:center;font-size:var(--t-data);color:var(--faint);justify-items:center;gap:.25rem;display:grid}.footer-mark{font-size:var(--t-body);letter-spacing:-.03em;color:var(--ink);font-weight:700;font-stretch:125%}.footer-mark span,.footer-mark:hover{color:var(--clay)}@keyframes pop{0%{opacity:0;transform:translateY(14px)scale(.94)}}@keyframes sticker{0%{opacity:0;transform:rotate(-24deg)scale(.6)}}@keyframes spin-in{0%{opacity:0;transform:rotate(-90deg)scale(.6)}}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
