@font-face{font-family:'Bricolage Grotesque';src:url('/fonts/bricolage.woff2') format('woff2');font-weight:700 800;font-display:swap}
@font-face{font-family:'Hanken Grotesk';src:url('/fonts/hanken.woff2') format('woff2');font-weight:400 700;font-display:swap}
@font-face{font-family:'DM Mono';src:url('/fonts/dm-mono-400.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'DM Mono';src:url('/fonts/dm-mono-500.woff2') format('woff2');font-weight:500;font-display:swap}
:root{
 --surface:#151a17;--surface-raised:#1e2521;--surface-sunken:#101412;--hairline:#2c3630;
 --ink:#edebe4;--ink-muted:#a3aba4;--ink-faint:#6f776f;--gorse:#f2b933;--on-gorse:#171b18;--gorse-text:#f2b933;
 --moss:#5c7c69;--moss-tint:#22302a;--moss-text:#9fc4ac;--signal-warn:#e8a13a;--signal-danger:#f08a7e;--focus:#f2b933;--mark:var(--gorse);
 --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-6:24px;--space-8:32px;--space-12:48px;--space-20:80px;
 --radius-sm:6px;--radius-md:12px;--radius-lg:18px;--radius-pill:999px;
 --font-display:'Bricolage Grotesque','Arial Black','Helvetica Neue',Arial,sans-serif;
 --font-sans:'Hanken Grotesk','Segoe UI',Helvetica,Arial,sans-serif;
 --font-mono:'DM Mono',ui-monospace,'SF Mono',Menlo,Consolas,monospace;
 font:100%/1.55 var(--font-sans);color:var(--ink);background:var(--surface);color-scheme:dark;
}
:root[data-theme=light]{
 --surface:#f1f2ec;--surface-raised:#fff;--surface-sunken:#e6e8e1;--hairline:#d3d7cf;
 --ink:#171b18;--ink-muted:#525a54;--ink-faint:#7d857e;--gorse-text:#7a5a05;
 --moss:#4e6b5a;--moss-tint:#dfe8e2;--moss-text:#2f5140;--signal-warn:#8a5a00;--signal-danger:#a63a2e;--focus:#7a5a05;--mark:var(--ink);color-scheme:light;
}
@media(prefers-color-scheme:light){:root:not([data-theme]){
 --surface:#f1f2ec;--surface-raised:#fff;--surface-sunken:#e6e8e1;--hairline:#d3d7cf;
 --ink:#171b18;--ink-muted:#525a54;--ink-faint:#7d857e;--gorse-text:#7a5a05;
 --moss:#4e6b5a;--moss-tint:#dfe8e2;--moss-text:#2f5140;--signal-warn:#8a5a00;--signal-danger:#a63a2e;--focus:#7a5a05;--mark:var(--ink);color-scheme:light;
}}
*{box-sizing:border-box}body{margin:0}main{max-width:540px;margin:auto;padding:var(--space-6) max(var(--space-4),env(safe-area-inset-right)) calc(var(--space-6) + max(env(safe-area-inset-bottom),var(--tg-content-safe-area-inset-bottom,0px))) max(var(--space-4),env(safe-area-inset-left));padding-top:max(var(--space-6),var(--tg-content-safe-area-inset-top,0px))}
header{display:flex;justify-content:space-between;gap:var(--space-3);align-items:center;padding-bottom:var(--space-4);margin-bottom:var(--space-6);border-bottom:1px solid var(--hairline)}
.brand{display:flex;align-items:center;gap:var(--space-2);font:800 1.5rem/1.15 var(--font-display);font-optical-sizing:auto;letter-spacing:-.03em;overflow-wrap:anywhere}
.brand:before{content:'';flex-shrink:0;width:36px;height:36px;background:var(--mark);-webkit-mask:url('/kyela.png') center/contain no-repeat;mask:url('/kyela.png') center/contain no-repeat}
h1{font:800 clamp(1.75rem,7.5vw,2.75rem)/1.08 var(--font-display);font-optical-sizing:auto;letter-spacing:-.03em;white-space:pre-line;margin:0 0 var(--space-4);overflow-wrap:anywhere}
h2{font:700 1.75rem/1.1 var(--font-display);font-optical-sizing:auto;letter-spacing:-.03em}
p{color:var(--ink-muted);margin:var(--space-3) 0 var(--space-6)}.lead{max-width:40ch;font-size:1.125rem;line-height:1.45;margin-top:0;margin-bottom:var(--space-4)}
.eyebrow{font:650 .75rem/1.4 var(--font-sans);letter-spacing:.09em;text-transform:uppercase;color:var(--ink-muted);display:block;margin:0 0 var(--space-3)}
button,input,select{font:inherit;min-height:48px;border-radius:var(--radius-md)}
button{border:1px solid transparent;background:var(--gorse);color:var(--on-gorse);padding:12px 16px;font-weight:650;cursor:pointer;width:100%;margin:var(--space-1) 0;overflow-wrap:anywhere}
/* Controls need a visible boundary; hairlines remain on layout dividers. */
button.secondary{background:transparent;border-color:var(--ink-muted);color:var(--ink)}button:disabled{opacity:.5;cursor:default}button:active:not(:disabled){transform:translateY(1px)}
@media(hover:hover){button:hover:not(:disabled){filter:brightness(.95)}button.secondary:hover:not(:disabled){background:var(--surface-raised)}}
button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible,a:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
label{display:block;margin:var(--space-6) 0 var(--space-2);font-weight:650}input,select{width:100%;max-width:100%;padding:12px;background:var(--surface-raised);color:var(--ink);border:1px solid var(--ink-muted)}input::placeholder{color:var(--ink-muted);opacity:1}
input[type=checkbox]{width:24px;height:24px;min-height:24px;flex-shrink:0;accent-color:var(--gorse)}
.group{display:flex;align-items:center;gap:var(--space-3);min-height:64px;padding:var(--space-4) 2px;border-bottom:1px solid var(--hairline);margin:0;font-weight:500}.group span{min-width:0;overflow-wrap:anywhere}.group small{display:block;color:var(--ink-muted);font-weight:400}.row{display:flex;gap:var(--space-2)}.row button{flex:1;min-width:0}
.status{background:var(--surface-raised);padding:var(--space-6);border:1px solid var(--hairline);border-radius:var(--radius-lg);margin:var(--space-6) 0}.status strong{display:block;font:700 1.75rem/1.2 var(--font-display);font-optical-sizing:auto;font-variant-numeric:tabular-nums;letter-spacing:-.03em}.status p{margin:var(--space-2) 0 0;font-size:.875rem}
.connection-state{display:inline-block;font-size:.875rem;font-weight:650;margin:0 0 var(--space-3);color:var(--ink-muted)}.connection-state.connected{background:var(--moss-tint);color:var(--moss-text);border-radius:var(--radius-pill);padding:4px 12px}.connection-state.delayed{color:var(--signal-warn)}
.privacy{margin:0 0 var(--space-4)}.privacy strong{font-size:1rem;line-height:1.5;display:block;font-weight:650}.privacy p{margin:var(--space-2) 0 0;font-size:.875rem}
.steps{display:flex;list-style:none;padding:0;margin:0 0 var(--space-6);gap:var(--space-2)}.steps li{font-size:.75rem;flex:1;padding-top:var(--space-2);border-top:3px solid var(--hairline);color:var(--ink-muted)}.steps li[aria-current=step]{border-color:var(--gorse);color:var(--gorse-text);font-weight:650}.steps li.complete{border-color:var(--moss);color:var(--moss-text)}
.note{font-size:.875rem;line-height:1.5}.count{font:.75rem/1.5 var(--font-mono);font-variant-numeric:tabular-nums;color:var(--ink-muted)}#role{font-size:.875rem;color:var(--ink-muted)}.empty{padding:var(--space-6) 0}
#notice:not(:empty){background:var(--surface-raised);border:1px solid var(--hairline);padding:var(--space-4);border-radius:var(--radius-lg);margin-bottom:var(--space-4);font-size:.875rem;overflow-wrap:anywhere}
.sticky{position:sticky;bottom:0;z-index:1;padding:var(--space-2) 0 max(var(--space-3),env(safe-area-inset-bottom),var(--tg-content-safe-area-inset-bottom,0px));background:var(--surface)}
button.danger{color:var(--signal-danger);background:transparent;border-color:var(--signal-danger)}
details{margin:var(--space-6) 0;border-top:1px solid var(--hairline)}summary{cursor:pointer;padding:var(--space-4) 0;min-height:48px;font-size:.875rem;font-weight:650}details p{font-size:.875rem}small{font-size:.875rem}a{color:var(--gorse-text);text-underline-offset:3px}code{font-family:var(--font-mono);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
h1:focus{outline:none}[tabindex='-1']:focus{outline:none}button,input,select,summary,.group{scroll-margin-block:24px 180px}
#progress{display:flex;align-items:center;gap:var(--space-3);position:sticky;top:max(8px,var(--tg-content-safe-area-inset-top,0px));z-index:2;background:var(--surface-raised);border:1px solid var(--hairline);border-radius:var(--radius-lg);padding:var(--space-4);margin-bottom:var(--space-4);font-size:.875rem;overflow-wrap:anywhere}
#progress[hidden]{display:none}#progress-hint{display:block;margin-top:var(--space-1);color:var(--ink-muted)}#progress-hint:empty{display:none}
.spinner{display:inline-block;flex-shrink:0;width:18px;height:18px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;vertical-align:-3px}button .spinner{margin-right:var(--space-2)}
@keyframes inbox-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:no-preference){.spinner{animation:inbox-spin .8s linear infinite}}
@media(forced-colors:active){button,input,select,.group{border:1px solid ButtonText}.connection-state.connected{border:1px solid CanvasText}}