:root{--base-padding: 1rem;--header-h: 3.5rem;--shell-max: 1400px;--surface-bg: radial-gradient( 130% 90% at 100% 0%, color-mix(in oklab, var(--garde-accent) 7%, transparent), transparent 55% ), linear-gradient(180deg, color-mix(in oklab, #ffffff 6%, var(--garde-surface)), var(--garde-surface) 65%);--surface-highlight: inset 0 1px 0 rgb(255 255 255 / .05);--garde-bg: #0b1120;--garde-surface: #111827;--garde-surface-2: #1f2937;--garde-border: #283449;--garde-text: #e5e9f0;--garde-muted: #94a3b8;--garde-accent: #00c8b3;--garde-accent-hover: #00a896}@font-face{font-family:Atkinson;src:url(/fonts/atkinson-regular.woff) format("woff");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Atkinson;src:url(/fonts/atkinson-bold.woff) format("woff");font-weight:700;font-style:normal;font-display:swap}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:Atkinson,system-ui,sans-serif;background:var(--garde-bg);color:var(--garde-text);min-block-size:100dvb;timeline-scope:--gate-title,--gate-linkbtn}a,a:visited{color:inherit}.app-bg:before,.app-bg:after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none}.app-bg:before{background:radial-gradient(120% 55% at 50% -8%,color-mix(in oklch,var(--garde-accent) 12%,transparent),transparent 60%)}.app-bg:after{opacity:.09;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.6' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}.garde-wordmark{font-family:Fredoka,system-ui,sans-serif;font-weight:600;letter-spacing:-.01em;line-height:1}.garde-wordmark .dot{color:var(--garde-accent)}.shell{display:flex;justify-content:center}.shell>*{inline-size:100%;max-inline-size:var(--shell-max)}.site-header,.site-subheader{position:sticky;background:color-mix(in oklab,var(--garde-bg) 78%,transparent);backdrop-filter:blur(12px)}.site-header{top:0;z-index:30;block-size:var(--header-h)}.site-subheader{top:var(--header-h);z-index:20}.subheader-title{overflow:hidden;min-inline-size:0}.subheader-title>span{display:block;transform:translateY(-140%)}@keyframes title-handoff{0%{transform:translateY(-140%)}to{transform:translateY(0)}}#gate-title{view-timeline:--gate-title block;view-timeline-inset:calc(var(--header-h) + .3rem) auto}@supports (animation-timeline: view()){.subheader-title>span{animation-name:title-handoff;animation-fill-mode:both;animation-timing-function:linear;animation-duration:auto;animation-timeline:--gate-title;animation-range:exit}}.link-menu__btn{display:inline-flex;align-items:center;gap:.4rem;padding:.4rem .7rem;border-radius:.5rem;border:1px solid var(--garde-border);background:var(--garde-surface-2);color:var(--garde-text);font:inherit;font-size:.9rem;font-weight:600;cursor:pointer}.link-menu__btn--icon{gap:0;padding:0;inline-size:1.9rem;block-size:1.9rem;justify-content:center}.link-menu__btn:hover{border-color:color-mix(in oklab,var(--garde-accent) 45%,var(--garde-border))}.link-menu__chevron{transition:transform .2s ease}.link-anchor-hero{anchor-name:--gate-hero;view-timeline:--gate-linkbtn block;view-timeline-inset:calc(var(--header-h) + .1rem) auto}.link-anchor-sub{anchor-name:--gate-sub}.gate-links-toggle{position:fixed;inline-size:1px;block-size:1px;opacity:0;pointer-events:none;clip-path:inset(50%)}.link-backdrop{display:none;position:fixed;inset:0;z-index:59}.gate-links-toggle:checked~.link-backdrop{display:block}.link-pop{position-anchor:--gate-hero;inset:auto;top:anchor(bottom);left:anchor(left);display:flex;flex-direction:column;gap:.1rem;visibility:hidden;opacity:0;pointer-events:none;position:fixed;z-index:60;min-inline-size:12rem;padding:.35rem;border:1px solid var(--garde-border);border-radius:.6rem;background:color-mix(in oklab,var(--garde-surface) 96%,transparent);backdrop-filter:blur(8px);box-shadow:0 12px 30px -12px #0009;transition:opacity .15s ease,visibility .15s ease}.gate-links-toggle:checked~.link-pop{visibility:visible;opacity:1;pointer-events:auto}.link-row{display:flex;align-items:center;gap:.25rem}.link-row__link{flex:1;display:block;padding:.4rem .55rem;border-radius:.4rem;font-size:.85rem;color:var(--garde-text);text-decoration:none;white-space:nowrap}.link-row__link:hover{background:var(--garde-surface-2);text-decoration:underline}.link-row__copy{flex:none;display:inline-flex;align-items:center;justify-content:center;inline-size:1.9rem;block-size:1.9rem;border:0;border-radius:.4rem;background:none;color:var(--garde-muted);cursor:pointer}.link-row__copy:hover{background:var(--garde-surface-2);color:var(--garde-text)}.link-row__copy .icon-check,.link-menu__btn--icon .icon-check,.link-row__copy[data-copied] .icon-copy,.link-menu__btn--icon[data-copied] .icon-copy{display:none}.link-row__copy[data-copied] .icon-check,.link-menu__btn--icon[data-copied] .icon-check{display:inline-flex;color:var(--garde-accent)}.subheader-linkbtn{opacity:0;pointer-events:none}@keyframes subheader-reveal{0%{opacity:0;pointer-events:none}to{opacity:1;pointer-events:auto}}@keyframes gate-sub-anchor{to{position-anchor:--gate-sub}}@supports (animation-timeline: view()){.link-pop{animation-name:gate-sub-anchor;animation-fill-mode:both;animation-timing-function:linear;animation-duration:auto;animation-timeline:--gate-linkbtn;animation-range:exit}.subheader-linkbtn{animation-name:subheader-reveal;animation-fill-mode:both;animation-timing-function:linear;animation-duration:auto;animation-timeline:--gate-linkbtn;animation-range:exit}}:where([id]){scroll-margin-top:calc(var(--header-h) + 4rem)}.fluid-grid{display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:1.5rem}.fluid-grid>*{flex:1 1 24rem;max-inline-size:650px;min-inline-size:0}.fluid-grid>.col-full{flex-basis:100%;max-inline-size:none}.masonry{-moz-column-width:40rem;column-width:40rem;-moz-column-gap:1.5rem;column-gap:1.5rem}.masonry>*{-moz-column-break-inside:avoid;break-inside:avoid;margin-block-end:1.5rem}.masonry>:last-child{margin-block-end:0}.masonry>.col-full{-moz-column-span:all;column-span:all}.settings-save{position:fixed;left:50%;bottom:1.25rem;z-index:20;display:flex;opacity:0;pointer-events:none;transform:translate(-50%,calc(100% + 2.5rem));transition:transform .32s cubic-bezier(.22,1,.36,1),opacity .25s ease}.settings-save.is-dirty{opacity:1;pointer-events:auto;transform:translate(-50%)}.settings-save__bar{position:relative;display:flex;align-items:center;gap:.75rem;padding:.5rem .6rem}.save-btn{display:inline-flex;align-items:center;gap:.5rem}.save-btn__spinner{display:none;inline-size:1em;block-size:1em;border:2px solid currentColor;border-inline-end-color:transparent;border-radius:50%;animation:save-spin .6s linear infinite}.save-btn[data-loading]{pointer-events:none;opacity:.85}.save-btn[data-loading] .save-btn__spinner{display:inline-block}@keyframes save-spin{to{transform:rotate(360deg)}}.settings-save__bar:before{content:"";position:absolute;inset:-2.5rem -4rem;z-index:-1;background:color-mix(in oklab,var(--garde-surface) 45%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);mask-image:radial-gradient(ellipse closest-side,#000 35%,transparent 85%);-webkit-mask-image:radial-gradient(ellipse closest-side,#000 35%,transparent 85%);pointer-events:none}@media(prefers-reduced-motion:reduce){.settings-save{transform:translate(-50%);transition:opacity .2s ease}}.card{display:flex;flex-direction:column;gap:1rem;padding:clamp(1rem,.6rem + 1.5vw,1.5rem);border:1px solid var(--garde-border);border-radius:.75rem;background-color:var(--garde-surface);background-image:var(--surface-bg);box-shadow:var(--surface-highlight)}.card-title{font-size:1.25rem;font-weight:700;letter-spacing:-.015em;line-height:1.2;padding-block-end:.6rem;border-block-end:1px solid var(--garde-border)}.gate-banner{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-block-size:clamp(140px,16vw,200px)}.gate-banner--image{min-block-size:clamp(220px,30vw,360px)}.gate-banner:before{content:"";position:absolute;inset:0;z-index:0;background-image:linear-gradient(180deg,transparent 0%,color-mix(in oklab,var(--garde-bg) 80%,transparent) 65%,var(--garde-bg) 100%),var(--gate-banner);background-size:cover;background-position:center;pointer-events:none}.hero-shell{position:relative;z-index:1;padding-inline:1.5rem;padding-block-end:1.25rem}.hero{display:flex;align-items:center;gap:1.25rem;flex-wrap:wrap;text-shadow:0 1px 10px rgb(0 0 0 / .35)}.hero__icon{flex:none;inline-size:4.5rem;block-size:4.5rem;border-radius:1rem;border:1px solid var(--garde-border);background:var(--garde-surface-2);font-size:1.75rem;color:var(--garde-text)}.tier-badge{display:inline-flex;align-items:center;gap:.3rem;padding:.15rem .6rem;border-radius:999px;font-size:.8rem;font-weight:700;letter-spacing:.02em;color:var(--garde-text);background:var(--garde-surface-2);border:1px solid var(--garde-border)}.tier-badge--forever{color:var(--garde-bg);border-color:transparent;background:linear-gradient(135deg,#f5d36b,var(--garde-accent))}.divider{border:none;inline-size:100%;block-size:1px;background:linear-gradient(to right,transparent,var(--garde-border) 12%,var(--garde-border) 88%,transparent)}.cq{container-type:inline-size}.card-2up{display:grid;gap:1rem;grid-template-columns:1fr}@container (min-width: 26rem){.card-2up{grid-template-columns:1fr 1fr}}.gate{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.1rem;min-block-size:100dvb;padding:calc(var(--base-padding) * 2) var(--base-padding);background-repeat:no-repeat}:where(a,button)[color]{--btn-bg: var(--garde-accent);--btn-fg: contrast-color(var(--btn-bg));--btn-edge: var(--garde-accent);--btn-outline-fg: var(--btn-edge);--btn-link: var(--garde-accent);--btn-link-hover: var(--garde-accent-hover);--btn-soft: color-mix(in srgb, var(--garde-accent) 14%, transparent);--btn-border: transparent;--btn-weight: 600;--btn-px: 1rem;--btn-py: .5rem;--btn-radius: .25rem;--btn-font: .95rem;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:var(--btn-py) var(--btn-px);border:1px solid var(--btn-border);border-radius:var(--btn-radius);background:var(--btn-bg);color:var(--btn-fg);font:inherit;font-size:var(--btn-font);font-weight:var(--btn-weight);line-height:1;text-decoration:none;white-space:nowrap;cursor:pointer;transition:background-color .15s ease,color .15s ease,border-color .15s ease}:where(a,button)[color]:visited{color:var(--btn-fg)}:where(a,button)[color]:focus-visible{outline:2px solid var(--btn-edge);outline-offset:2px}[color=primary]{--btn-bg: var(--garde-accent);--btn-edge: var(--garde-accent);--btn-soft: color-mix(in srgb, var(--garde-accent) 14%, transparent)}[color=neutral]{--btn-bg: var(--garde-surface-2);--btn-edge: var(--garde-border);--btn-outline-fg: var(--garde-text);--btn-link: var(--garde-muted);--btn-link-hover: var(--garde-text);--btn-soft: var(--garde-surface-2)}[color=danger]{--btn-bg: #ef4444;--btn-edge: #ef4444;--btn-link: #f87171;--btn-link-hover: #fca5a5;--btn-soft: color-mix(in srgb, #ef4444 14%, transparent)}[color=tier]{--btn-bg: var(--tier, var(--garde-accent));--btn-edge: var(--tier, var(--garde-accent));--btn-soft: color-mix(in srgb, var(--tier, var(--garde-accent)) 14%, transparent);--btn-weight: 700}[color=gate]{--btn-bg: var(--gate-accent, var(--garde-accent));--btn-edge: var(--gate-accent, var(--garde-accent));--btn-soft: color-mix(in srgb, var(--gate-accent, var(--garde-accent)) 14%, transparent);--btn-weight: 700}[color=primary]:hover:not(:disabled):not([aria-disabled=true]){--btn-bg: var(--garde-accent-hover)}[color=neutral]:hover:not(:disabled):not([aria-disabled=true]){--btn-bg: var(--garde-border)}[color=danger]:hover:not(:disabled):not([aria-disabled=true]){--btn-bg: #dc2626}[color=tier]:hover:not(:disabled):not([aria-disabled=true]){--btn-bg: color-mix(in srgb, var(--tier, var(--garde-accent)) 85%, #000)}[color=gate]:hover:not(:disabled):not([aria-disabled=true]){--btn-bg: color-mix(in srgb, var(--gate-accent, var(--garde-accent)) 92%, #000)}[variant=outline]{--btn-bg: transparent;--btn-fg: var(--btn-outline-fg);--btn-border: var(--btn-edge)}[variant=ghost]{--btn-bg: transparent;--btn-fg: var(--btn-outline-fg);--btn-border: transparent}[variant=outline]:hover:not(:disabled):not([aria-disabled=true]),[variant=ghost]:hover:not(:disabled):not([aria-disabled=true]){--btn-bg: var(--btn-soft)}[variant=link]{--btn-fg: var(--btn-link);--btn-weight: 400;--btn-font: 1em;display:inline;padding:0;border:none;background:none;border-radius:0;white-space:normal}[variant=link]:hover:not(:disabled):not([aria-disabled=true]){--btn-fg: var(--btn-link-hover)}[small]{--btn-px: .75rem;--btn-py: .375rem;--btn-font: .8rem;--btn-radius: .375rem}[large]{--btn-px: 1.5rem;--btn-py: .75rem;--btn-font: 1rem}[block]{width:100%}:where(a,button)[color]:disabled,:where(a,button)[color][aria-disabled=true]{background:var(--garde-surface-2);border-color:var(--garde-border);color:var(--garde-muted);cursor:not-allowed;opacity:.7}
