:root{--bg:#fdfdfc;--fg:#1a1a1a;--muted:#5b5b5b;--line:#d9d9d9;--line-strong:#8a8a8a;--accent:#0c5964;--accent-fg:#fff;--card:#f7f6f4;--error:#a4262c;--mono:ui-monospace, SFMono-Regular, Menlo, monospace;--ease-out:cubic-bezier(.16, 1, .3, 1);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--bg:#141414;--fg:#ececec;--muted:#a3a3a3;--line:#3a3a3a;--line-strong:#6e6e6e;--accent:#4cb6c2;--accent-fg:#10201c;--card:#1e1e1e;--error:#ff8389}}*{box-sizing:border-box}html,body{overflow-x:clip}body{background:var(--bg);color:var(--fg);margin:0;font:16px/1.55 system-ui,-apple-system,Segoe UI,sans-serif}img{max-width:100%;height:auto}main{max-width:52rem;margin:0 auto;padding:1.25rem 1rem 4rem}a{color:var(--accent)}h1{margin:.5rem 0;font-size:1.6rem}h1.display{letter-spacing:-.02em;overflow-wrap:anywhere;margin:1rem 0 .75rem;font-size:clamp(2.1rem,6vw,3rem);line-height:1.08}p.lede{max-width:42rem;margin:0 0 1.25rem;font-size:1.12rem;line-height:1.5}h2{margin:1.4rem 0 .5rem;font-size:1.15rem}h2.pull{margin-top:2.6rem}code,pre{font-family:var(--mono);font-size:.9em}pre{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:.9rem;overflow-x:auto}.site-header{border-bottom:2px solid var(--fg);flex-wrap:wrap;align-items:baseline;gap:1rem;padding-bottom:.6rem;display:flex}.site-header strong{letter-spacing:.01em;color:var(--fg);padding-left:1.67em;font-size:1.05rem;position:relative}.site-header strong:before{content:"";background:currentColor;width:1.17em;height:1.43em;position:absolute;top:50%;left:0;transform:translateY(-50%);-webkit-mask:url(/mark-small.svg) 50%/contain no-repeat;mask:url(/mark-small.svg) 50%/contain no-repeat}.site-header a{text-decoration:none}@media (width<=34rem){.site-header{gap:.4rem .7rem}.site-header>:is(a:not(:has(strong)),span){font-size:.92rem}}.site-header [aria-current=page]{font-weight:600}.banner{background:color-mix(in srgb, var(--accent) 7%, var(--card));border:1px solid color-mix(in srgb, var(--accent) 45%, var(--line));border-radius:8px;margin:1rem 0;padding:.6rem .9rem}.muted{color:var(--muted)}.error{color:var(--error);border:1px solid var(--error);overflow-wrap:anywhere;border-radius:8px;padding:.75rem 1rem}.notes{border:1px solid var(--line);overflow-wrap:anywhere;border-radius:8px;margin:1rem 0;padding:.75rem 1rem}.notes>:first-child{margin-top:0}.notes>:last-child{margin-bottom:0}.cards{grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));gap:.9rem;padding:0;list-style:none;display:grid}.card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:.9rem 1rem}.cards--few{grid-template-columns:repeat(auto-fit,minmax(15rem,24rem))}.card h3{overflow-wrap:anywhere;min-width:0;margin:0 0 .3rem;font-size:1.02rem}.card h2{margin:0 0 .5rem}.card-head{align-items:center;gap:.75rem;min-width:0;margin-bottom:.5rem;display:flex}.card-head h3,.card-head p{margin:0}.card-icon{border-radius:22%;flex:none;width:56px;height:56px}.btn{background:var(--accent);color:var(--accent-fg);font:inherit;cursor:pointer;border:none;border-radius:8px;padding:.5rem .9rem;font-size:.95rem;text-decoration:none;display:inline-block}.btn--ghost{color:var(--accent);border:1px solid var(--accent);background:0 0}.btn:hover{background:color-mix(in srgb, var(--accent) 85%, var(--fg) 15%)}.btn:active{background:color-mix(in srgb, var(--accent) 72%, var(--fg) 28%)}.btn--ghost:hover{background:color-mix(in srgb, var(--accent) 12%, transparent)}.btn--ghost:active{background:color-mix(in srgb, var(--accent) 20%, transparent)}.btn:disabled,.btn[aria-disabled=true]{opacity:.5;cursor:not-allowed}.btn:disabled:hover,.btn[aria-disabled=true]:hover{background:var(--accent)}.btn--ghost:disabled:hover,.btn--ghost[aria-disabled=true]:hover{background:0 0}.btn[aria-busy=true]{cursor:progress}:is(a,button,input,select,textarea,summary):focus-visible{outline:2px solid var(--accent);outline-offset:2px}label.btn:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:2px}.row{flex-wrap:wrap;align-items:center;gap:.5rem;margin:.6rem 0;display:flex}.row h2{margin:0}.chip{border:1px solid var(--line-strong);background:var(--card);color:var(--fg);font:inherit;cursor:pointer;border-radius:999px;padding:.2rem .75rem;font-size:.85rem}.chip--on{background:var(--accent);color:var(--accent-fg);border-color:var(--accent)}.chip:hover{border-color:var(--fg)}.chip--on:hover{background:color-mix(in srgb, var(--accent) 85%, var(--fg) 15%);border-color:color-mix(in srgb, var(--accent) 85%, var(--fg) 15%)}.field{border:1px solid var(--line-strong);background:var(--bg);width:100%;color:var(--fg);font:inherit;border-radius:8px;padding:.55rem .7rem}textarea.field{min-height:12rem;font-family:var(--mono)}.field--xs{max-width:4rem}.field--sm{max-width:6rem}.field--md{max-width:8rem}.gen-field{margin:.6rem 0;display:block}.gen-field>.muted{margin-bottom:.2rem;font-size:.85rem;display:block}.gen-step{flex-wrap:wrap}.gen-step .field{flex:8rem;width:auto}.gen-step :is(.field--xs,.field--sm,.field--md){flex:0 auto}.steps{padding-left:0;list-style:none}.steps li{border-bottom:1px solid var(--line);gap:.75rem;padding:.45rem 0;display:flex}.steps .t{font-variant-numeric:tabular-nums;min-width:3.2rem;color:var(--muted)}.steps .to{font-variant-numeric:tabular-nums;margin-left:auto;padding-left:.75rem}.clock{font-variant-numeric:tabular-nums;text-align:center;margin:.5rem 0;font-size:3rem}.qr-panel{border:1px solid var(--line);background:var(--bg);color:var(--fg);border-radius:12px;max-width:20rem;padding:1rem}.qr-panel svg{width:100%;height:auto}.attribution{color:var(--muted);font-size:.85rem}.scoped-share{border-left:1px solid var(--line);margin:.4rem 0 1.2rem;padding-left:.9rem}.scoped-share>.muted{margin:0 0 .4rem;font-size:.85rem}.scoped-share .btn{padding:.35rem .7rem;font-size:.85rem}.whole-share{border-top:1px solid var(--line);margin:1.6rem 0 1.2rem;padding-top:1.2rem}.whole-share>.muted{margin:0 0 .5rem}.bean-card>p{margin:.35rem 0}.bean-recipes{margin:.2rem 0 0;padding:0;font-size:.92rem;list-style:none}.bean-recipes li{padding:.15rem 0}.qr-figure{max-width:16rem;margin:1rem 0}.demo-pair{grid-template-columns:minmax(0,1fr);align-items:start;gap:1.25rem;margin:.75rem 0 0;display:grid}.demo-pair>*{min-width:0}.demo-pair .qr-figure{max-width:none;margin:0}.demo-pair .qr-figure img{width:100%}@media (width>=46rem){.demo-pair{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}}.facts{border-top:1px solid var(--line);grid-template-columns:repeat(auto-fit,minmax(8rem,1fr));gap:0 1.5rem;margin:1rem 0 1.25rem;padding:0;display:grid}.facts>div{border-bottom:1px solid var(--line);padding:.7rem 0}.facts dt{font-variant-numeric:tabular-nums;font-size:1.6rem;line-height:1.1}.facts dd{color:var(--muted);margin:.2rem 0 0;font-size:.9rem;line-height:1.4}.dropzone{border-style:dashed;border-color:var(--line-strong);text-align:center}.gen-layout{grid-template-areas:"json""preview""form";gap:1rem;display:grid}.gen-json{grid-area:json}.gen-preview{grid-area:preview}.gen-form{grid-area:form}@media (width>=62rem){.gen-layout{grid-template-columns:minmax(0,1fr) minmax(0,19rem);grid-template-areas:"json preview""form preview";align-items:start}.gen-preview{max-height:calc(100vh - 2rem);position:sticky;top:1rem;overflow-y:auto}.gen-preview .cj-step-delta{display:none}.gen-preview .cj-steps:has(.cj-step-delta){grid-template-columns:max-content minmax(0,1fr) max-content;column-gap:.75rem}}.visually-hidden{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;margin:-1px;position:absolute;overflow:hidden}:is(.pitfalls,.impl){border-collapse:collapse;width:100%;margin:.75rem 0;display:block;overflow-x:auto}:is(.pitfalls,.impl) :is(th,td){border:1px solid var(--line);text-align:left;vertical-align:top;padding:.45rem .6rem}:is(.pitfalls,.impl) thead th{background:var(--card);font-weight:600}.pitfalls code{white-space:pre}.cj-view{--cj-accent:var(--accent);--cj-fg:var(--fg);--cj-muted:var(--muted);--cj-bg:var(--card);--cj-border:var(--line);--cj-font:inherit}.cj-recipe-block{gap:.5rem;display:grid}.cj-brewing .cj-step{opacity:.5;transition:opacity .2s var(--ease-out)}.cj-brewing .cj-step--active,.cj-brewing .cj-step--active~.cj-step{opacity:1}@media (prefers-reduced-motion:reduce){.cj-brewing .cj-step{transition:none}}:is(.cj-view .cj-steps:has(.cj-step-delta),.cj-brewing .cj-steps:has(.cj-step-delta)){grid-template-columns:max-content minmax(0,1fr) max-content max-content;column-gap:1rem;display:grid}:is(.cj-view .cj-steps:has(.cj-step-delta) .cj-step,.cj-brewing .cj-steps:has(.cj-step-delta) .cj-step){grid-column:1/-1;grid-template-columns:subgrid;align-items:baseline;display:grid}.cj-view .cj-step-delta,.cj-view .cj-step-target,.cj-brewing .cj-step-delta,.cj-brewing .cj-step-target{font-variant-numeric:tabular-nums;justify-self:end}
