@property --gap{syntax:"*";inherits:false}@property --measure{syntax:"<length>";inherits:true;initial-value:0}:root{--ratio:1.25;--measure:66ch;--hue:190;--tracking:.08em;--weight-strong:600;--font-sans:"Avenir Next", Avenir, system-ui, sans-serif;--font-heading:"Avenir Next Condensed", "Arial Narrow", "Roboto Condensed", var(--font-sans);--font-mono:ui-monospace, Menlo, Consolas, monospace;--hairline:1px;--touch:2rlh;--text-s:calc(1rem / var(--ratio));--text-l:calc(1rem * var(--ratio));--text-2xl:calc(1rem * pow(var(--ratio), 3));--text-3xl:calc(1rem * pow(var(--ratio), 5));--space-2xs:calc(1rlh * pow(var(--ratio), -3));--space-xs:calc(1rlh * pow(var(--ratio), -2));--space-s:calc(1rlh / var(--ratio));--space-m:1rlh;--space-l:calc(1rlh * var(--ratio));--space-xl:calc(1rlh * pow(var(--ratio), 2));--space-2xl:calc(1rlh * pow(var(--ratio), 3));--space-3xl:calc(1rlh * pow(var(--ratio), 5));--paper:light-dark(oklch(97.5% .006 var(--hue)),oklch(18% .012 var(--hue)));--surface:light-dark(oklch(94% .012 var(--hue)),oklch(23% .015 var(--hue)));--ink:light-dark(oklch(24% .02 var(--hue)),oklch(94% .01 var(--hue)));--ink-muted:light-dark(oklch(47% .02 var(--hue)),oklch(76% .02 var(--hue)));--accent:light-dark(oklch(47% .08 var(--hue)),oklch(78% .11 var(--hue)));--on-accent:light-dark(oklch(99% .004 var(--hue)),oklch(18% .012 var(--hue)));--danger:light-dark(oklch(50% .17 25),oklch(74% .14 25));--line:color-mix(in oklch, var(--ink) 16%, transparent);font-family:var(--font-sans);color:var(--ink);background:var(--paper);line-height:1.5}@view-transition{navigation:auto}@media (prefers-reduced-motion:reduce){::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none}}*,:before,:after{box-sizing:border-box;margin:0}:where(button,input){font:inherit;color:inherit}:where(h1,h2){font-family:var(--font-heading);font-weight:var(--weight-strong);line-height:var(--ratio);text-wrap:balance}:where(h1){font-size:var(--text-2xl);text-transform:uppercase}:where(h2){font-size:var(--text-l)}:where(a){color:var(--accent)}:where(code,pre){font-family:var(--font-mono)}:where(table){border-collapse:collapse;inline-size:100%;font-size:var(--text-s)}:where(th,td){padding:var(--space-xs);border-block-end:var(--hairline) solid var(--line);text-align:start;vertical-align:top;overflow-wrap:anywhere}:where(:focus-visible){outline:calc(2 * var(--hairline)) solid var(--accent);outline-offset:calc(2 * var(--hairline))}@scope([data-component=page]) to (:scope [data-component]>*){:scope{overflow-wrap:break-word;grid-template-rows:auto 1fr auto;grid-template-columns:minmax(0,1fr);min-block-size:100dvb;display:grid}main{inline-size:min(100% - 2 * var(--space-m), var(--measure));padding-block:var(--space-2xl);margin-inline:auto}.skip{padding:var(--space-xs) var(--space-s);background:var(--accent);color:var(--on-accent);position:absolute}.skip:not(:focus){translate:-100%}}@scope([data-component=header],[data-component=footer]) to (:scope [data-component]>*){:scope{justify-content:space-between;align-items:center;gap:var(--space-xs) var(--space-m);padding-inline:max(var(--space-m), (100% - var(--measure)) / 2);border-color:var(--line);flex-wrap:wrap;display:flex}nav,form{gap:var(--space-xs);flex-wrap:wrap;display:flex}}@scope([data-component=header]){:scope{padding-block:var(--space-s);border-block-end:var(--hairline) solid}nav a:not(.action){min-block-size:var(--touch);padding-inline:var(--space-2xs);color:var(--ink-muted);align-items:center;text-decoration:none;display:inline-flex}nav a:not(.action):hover{color:var(--accent)}}@scope([data-component=footer]){:scope{padding-block:var(--space-l);border-block-start:var(--hairline) solid;color:var(--ink-muted);font-size:var(--text-s)}}@scope([data-component=brand]) to (:scope [data-component]>*){:scope{align-items:center;gap:var(--space-xs);min-block-size:var(--touch);color:var(--ink);font-family:var(--font-heading);font-size:var(--text-l);font-weight:var(--weight-strong);text-decoration:none;display:inline-flex}.mark{aspect-ratio:1;border:var(--hairline) solid var(--accent);inline-size:1lh;color:var(--accent);font-family:var(--font-mono);font-size:var(--text-s);place-items:center;display:grid}}@scope([data-component=intro]) to (:scope [data-component]>*){p:not(.eyebrow){color:var(--ink-muted)}}@scope([data-component=account],[data-component=admin]) to (:scope [data-component]>*){:scope{--gap:var(--space-xl)}}@scope([data-component=spend]) to (:scope [data-component]>*){:scope{padding:0;list-style:none}label{--gap:var(--space-2xs);font-variant-numeric:tabular-nums}meter{inline-size:100%}}@scope(.stack){:scope{gap:var(--gap,var(--space-s));flex-direction:column;display:flex}}@scope(.lede){:scope{color:var(--ink-muted);font-size:var(--text-l)}}@scope(.eyebrow){:scope{align-items:center;gap:var(--space-xs);color:var(--accent);font-size:var(--text-s);font-weight:var(--weight-strong);letter-spacing:var(--tracking);text-transform:uppercase;display:flex}:scope:before{content:"";inline-size:var(--space-xl);block-size:var(--hairline);background:currentColor}}@scope(.action){:scope{justify-content:center;align-items:center;gap:var(--space-xs);min-block-size:var(--touch);padding-inline:var(--space-m);border:var(--hairline) solid var(--line);color:var(--ink);font-weight:var(--weight-strong);cursor:pointer;background:0 0;text-decoration:none;display:inline-flex}:scope:hover{border-color:var(--accent)}:scope[data-variant=primary]{border-color:var(--accent);background:var(--accent);color:var(--on-accent)}:scope[data-variant=primary]:hover{background:color-mix(in oklch, var(--accent), var(--ink) 20%)}:scope[data-variant=danger]{color:var(--danger)}}@scope(.frame){:scope{--mark:var(--space-s);--mark-inset:calc(var(--mark) / 2);--mark-center:calc(var(--mark-inset) - var(--hairline) / 2);padding:var(--space-l);border:var(--hairline) solid var(--line);position:relative}:scope:after{content:"";inset:calc(-1 * var(--mark-inset));pointer-events:none;background-repeat:no-repeat;background-image:linear-gradient(var(--ink-muted) 0 0), linear-gradient(var(--ink-muted) 0 0), linear-gradient(var(--ink-muted) 0 0), linear-gradient(var(--ink-muted) 0 0), linear-gradient(var(--ink-muted) 0 0), linear-gradient(var(--ink-muted) 0 0), linear-gradient(var(--ink-muted) 0 0), linear-gradient(var(--ink-muted) 0 0);background-size:var(--mark) var(--hairline), var(--hairline) var(--mark), var(--mark) var(--hairline), var(--hairline) var(--mark), var(--mark) var(--hairline), var(--hairline) var(--mark), var(--mark) var(--hairline), var(--hairline) var(--mark);background-position:left 0 top var(--mark-center), left var(--mark-center) top 0, right 0 top var(--mark-center), right var(--mark-center) top 0, left 0 bottom var(--mark-center), left var(--mark-center) bottom 0, right 0 bottom var(--mark-center), right var(--mark-center) bottom 0;position:absolute}}
