.flow-page{color-scheme:light;--ai-bg: oklch(.985 .002 55);--ai-raised: oklch(1 0 0);--ai-ink: oklch(.185 .005 50);--ai-muted: oklch(.44 .008 50);--ai-line: oklch(.64 .008 50);--ai-primary: oklch(.585 .19 24);--ai-primary-ink: oklch(1 0 0);--ai-danger: oklch(.48 .18 24);--flow-night: oklch(.145 .003 50);--flow-night-ink: oklch(.95 .003 50);--flow-night-muted: oklch(.66 .006 50);--flow-night-line: oklch(.5 .005 50);--flow-ok: oklch(.72 .14 155);--flow-ok-ink: oklch(.5 .13 155);--flow-grain-rail: oklch(.78 .004 50 / 42%);--flow-grain-panel: oklch(.185 .005 50 / 7%);--flow-rail-width: clamp(17rem, 26%, 22rem);--flow-foot-strip: calc(max(2.5rem, env(safe-area-inset-bottom)) + 2.75rem) ;--flow-quiet: oklch(.185 .005 50 / 11%);--flow-measure: 30rem;--flow-control: 2.75rem;--flow-heading: 1.25rem;background:var(--ai-bg);color:var(--ai-ink)}:root[data-theme=dark] .flow-page{color-scheme:dark;--ai-bg: oklch(.19 .004 50);--ai-raised: oklch(.245 .005 50);--ai-ink: oklch(.95 .003 50);--ai-muted: oklch(.72 .008 50);--ai-line: oklch(.54 .006 50);--ai-primary: oklch(.68 .17 24);--ai-primary-ink: oklch(.17 .03 24);--ai-danger: oklch(.7 .16 24);--flow-ok-ink: oklch(.78 .14 155);--flow-night: oklch(.13 .003 50);--flow-grain-panel: oklch(.95 .003 50 / 6%);--flow-quiet: oklch(.95 .003 50 / 15%)}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .flow-page{color-scheme:dark;--ai-bg: oklch(.19 .004 50);--ai-raised: oklch(.245 .005 50);--ai-ink: oklch(.95 .003 50);--ai-muted: oklch(.72 .008 50);--ai-line: oklch(.54 .006 50);--ai-primary: oklch(.68 .17 24);--ai-primary-ink: oklch(.17 .03 24);--ai-danger: oklch(.7 .16 24);--flow-ok-ink: oklch(.78 .14 155);--flow-night: oklch(.13 .003 50);--flow-grain-panel: oklch(.95 .003 50 / 6%);--flow-quiet: oklch(.95 .003 50 / 15%)}}.flow-panel :focus-visible{outline:2px solid var(--ai-ink);outline-offset:3px}.flow-rail :focus-visible,.flow-strip :focus-visible{outline:2px solid var(--flow-night-ink);outline-offset:3px}.flow-layout{position:relative;isolation:isolate;display:grid;grid-template-columns:var(--flow-rail-width) 1fr;min-height:100dvh}.flow-grain{position:absolute;inset-inline:0;bottom:0;height:clamp(9rem,26vh,18rem);pointer-events:none;background:linear-gradient(90deg,var(--flow-grain-rail) 0 var(--flow-rail-width),var(--flow-grain-panel) var(--flow-rail-width) 100%);mask-image:repeating-linear-gradient(90deg,transparent 0 5px,black 5px 7px,transparent 7px 10px),repeating-linear-gradient(0deg,transparent 0 5px,black 5px 7px,transparent 7px 10px),linear-gradient(180deg,transparent,black 65%,black 86%,transparent);mask-composite:intersect}.flow-grain{bottom:var(--flow-foot-strip)}.flow-rail{padding-bottom:var(--flow-foot-strip)}.flow-rail{grid-column:1;grid-row:1;position:relative;display:flex;flex-direction:column;overflow:hidden;padding:max(2.5rem,env(safe-area-inset-top)) var(--pw-space-xl) max(2.5rem,env(safe-area-inset-bottom));background:var(--flow-night);color:var(--flow-night-ink)}:root[data-theme=dark] .flow-rail{border-inline-end:1px solid var(--ai-line)}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .flow-rail{border-inline-end:1px solid var(--ai-line)}}.flow-rail>*{position:relative;z-index:1}.flow-lockup{display:flex;align-items:baseline;gap:1.5rem}.flow-lockup svg{flex:none;width:152px;max-width:100%;height:auto;aspect-ratio:644.05 / 102.21}.flow-lockup-strip{gap:1.25rem}.flow-lockup-strip svg{width:120px}.flow-env-tag{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--flow-night-muted)}.flow-rail-heading{margin-top:var(--pw-space-xxl);font-size:var(--flow-heading);font-weight:600;line-height:1.3;letter-spacing:-.025em;overflow-wrap:anywhere}.flow-rail-lead{margin-top:var(--pw-space-md);color:var(--flow-night-muted);font-size:var(--text-sm);line-height:1.5;max-width:34ch}.flow-tagline{margin-top:var(--pw-space-lg);font-size:var(--text-sm);line-height:1.5;color:var(--flow-night-muted);max-width:30ch}.flow-rail-context{margin-top:var(--pw-space-xl);font-family:var(--font-mono);font-size:var(--text-xs);line-height:1.6;color:var(--flow-night-muted)}.flow-rail-context b{color:var(--flow-night-ink);font-weight:500}.flow-steps{list-style:none;margin:var(--pw-space-xl) 0 0;padding:0;display:flex;flex-direction:column;gap:var(--pw-space-md)}.flow-step{display:grid;grid-template-columns:1.25rem 1fr;gap:var(--pw-space-sm);align-items:start;color:var(--flow-night-muted);font-size:var(--text-sm)}.flow-step[data-state=current],.flow-step[data-state=done]{color:var(--flow-night-ink)}.flow-step small{display:block;margin-top:.125rem;font-size:var(--text-xs);line-height:1.45;color:var(--flow-night-muted)}.flow-step-marker{display:inline-flex;align-items:center;justify-content:center;width:1.25rem;height:1.25rem;border-radius:999px;border:1px solid var(--flow-night-line);font-family:var(--font-mono);font-size:.625rem}.flow-step[data-state=current] .flow-step-marker{background:var(--ai-primary);border-color:var(--ai-primary);color:var(--ai-primary-ink)}.flow-step[data-state=done] .flow-step-marker{border-color:var(--flow-ok);color:var(--flow-ok)}.flow-foot{grid-column:1;grid-row:1;align-self:end;z-index:1;display:flex;flex-wrap:wrap;align-items:center;column-gap:var(--pw-space-lg);padding:0 var(--pw-space-xl) max(2.5rem,env(safe-area-inset-bottom));font-size:var(--text-xs);line-height:1.6;--foot-ink: var(--flow-night-ink);--foot-muted: var(--flow-night-muted);--foot-quiet: oklch(1 0 0 / 10%);color:var(--foot-muted)}.flow-foot a,.flow-foot>button{color:var(--foot-ink);text-decoration:underline;text-underline-offset:2px;display:inline-block;min-height:2.75rem;line-height:2.75rem;white-space:nowrap}.flow-theme{display:flex;align-items:center;gap:2px;margin-inline-start:calc((2.75rem - 15px)/-2)}.flow-foot a+.flow-theme,.flow-foot>button+.flow-theme{margin-inline-start:var(--pw-space-md)}.flow-theme button{display:inline-flex;align-items:center;justify-content:center;width:2.75rem;height:2.75rem;border-radius:var(--radius-sm);color:var(--foot-muted);transition:color .15s ease-out,background-color .15s ease-out}.flow-theme button:hover{color:var(--foot-ink)}.flow-theme button[aria-checked=true]{color:var(--foot-ink);background:var(--foot-quiet)}.flow-strip{display:none;flex-direction:column;gap:var(--pw-space-sm);padding:max(1rem,env(safe-area-inset-top)) var(--pw-space-xl) var(--pw-space-md);background:var(--flow-night);color:var(--flow-night-ink)}.flow-strip-marks{display:flex;gap:var(--pw-space-xs)}.flow-strip-marks i{display:block;width:1.25rem;height:3px;border-radius:2px;background:var(--flow-night-line)}.flow-strip-marks i[data-state=current]{background:var(--ai-primary)}.flow-strip-marks i[data-state=done]{background:var(--flow-ok)}.flow-strip-label{font-size:var(--text-xs);color:var(--flow-night-muted)}.flow-panel{grid-column:2;grid-row:1;position:relative;z-index:1;display:flex;align-items:flex-start;justify-content:center;min-width:0;padding:max(clamp(3rem,14vh,8rem),env(safe-area-inset-top)) var(--pw-space-xxl) max(3rem,env(safe-area-inset-bottom))}.flow-content{width:100%;max-width:var(--flow-measure)}.flow-heading{font-size:var(--flow-heading);font-weight:600;line-height:1.3;letter-spacing:-.025em}.flow-lead{margin-top:var(--pw-space-sm);margin-bottom:var(--pw-space-xl);color:var(--ai-muted);font-size:var(--text-sm);line-height:1.5}.flow-heading:not(:has(+.flow-lead)){margin-bottom:var(--pw-space-xl)}.flow-form{display:grid;gap:var(--pw-space-lg)}.flow-form .field{min-height:var(--flow-control);font-size:var(--text-base);caret-color:var(--ai-primary)}.flow-form .field:hover{border-color:var(--ai-muted)}.flow-form .field[aria-invalid=true],.flow-form .field[aria-invalid=true]:focus-visible{border-color:var(--ai-danger)}.flow-panel .flow-form .field:focus-visible{outline-offset:0}.flow-panel .flow-form .field[aria-invalid=true]:focus-visible{outline-color:var(--ai-danger);outline-offset:2px}.flow-field-row{position:relative;display:flex;align-items:center}.flow-field-revealed{padding-right:4rem}.flow-reveal{position:absolute;right:.25rem;display:inline-flex;align-items:center;justify-content:center;min-width:2.75rem;min-height:2.75rem;padding-inline:var(--pw-space-sm);border-radius:var(--radius-sm);font-size:var(--text-sm);font-weight:500;color:var(--ai-muted);transition:color .15s ease-out,background-color .15s ease-out}@media(hover:hover){.flow-reveal:hover{color:var(--ai-ink);background:var(--flow-quiet)}}.flow-reveal:focus-visible{outline-offset:1px}.flow-field-data,.flow-line-address,.flow-rail-context{font-family:var(--font-mono)}.flow-form .field.flow-field-data{font-size:var(--text-sm)}.flow-field-port{max-width:8rem}.flow-group{min-width:0;border:0;padding:0}.flow-group>legend{padding:0;font-size:var(--text-sm);font-weight:600;letter-spacing:-.005em}.flow-group-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,12rem);gap:var(--pw-space-md);margin-top:var(--pw-space-sm)}.flow-group-body>:nth-child(3){grid-column:1 / -1}.flow-group+.flow-group{margin-top:var(--pw-space-sm)}.flow-servers{border:1px solid var(--ai-line);border-radius:.5rem;padding:var(--pw-space-md) var(--pw-space-lg)}.flow-servers-head{display:flex;align-items:center;justify-content:space-between;gap:var(--pw-space-md);font-size:var(--text-sm)}.flow-servers-head span{color:var(--ai-muted)}.flow-lines{display:grid;gap:var(--pw-space-xs);margin-top:var(--pw-space-xs);font-size:var(--text-sm)}.flow-lines li{display:grid;grid-template-columns:3rem minmax(0,1fr) auto;column-gap:var(--pw-space-sm);align-items:baseline;line-height:1.6rem}.flow-line-proto{font-family:var(--font-mono);font-size:var(--text-xs);letter-spacing:.02em;color:var(--ai-muted)}.flow-line-address{overflow-wrap:anywhere}.flow-line-address span{color:var(--ai-muted)}.flow-line-state{display:inline-flex;align-items:center;gap:.375rem;align-self:center;font-size:var(--text-xs);font-weight:500;white-space:nowrap;color:var(--ai-muted)}.flow-lines li[data-state=ok] .flow-line-state{color:var(--flow-ok-ink)}.flow-lines li:is([data-state=refused],[data-state=unreached],[data-state=insecure],[data-state=untrusted]) .flow-line-state{color:var(--ai-danger)}.flow-signing{display:flex;align-items:center;justify-content:center;gap:.5rem;font-size:var(--text-xs);color:var(--ai-muted)}.flow-signing:empty{display:none}.flow-text-action{display:inline-flex;align-items:center;min-height:2.75rem;font-size:var(--text-sm);font-weight:500;color:var(--ai-ink);text-decoration:underline;text-decoration-color:var(--ai-line);text-underline-offset:3px;transition:text-decoration-color .15s ease-out}.flow-text-action:hover{text-decoration-color:currentColor}.flow-servers-head .flow-text-action{flex:none}.flow-hint{color:var(--ai-muted);font-size:var(--text-xs);line-height:1.5}.flow-choices{display:grid;gap:var(--pw-space-md)}.flow-choice{display:flex;align-items:flex-start;gap:var(--pw-space-md);width:100%;min-height:var(--flow-control);padding:var(--pw-space-md) var(--pw-space-lg);border:1px solid var(--ai-line);border-radius:.5rem;background:var(--ai-raised);text-align:start;color:var(--ai-ink);cursor:pointer;transition:border-color .15s ease-out,background-color .15s ease-out}.flow-choice>span{flex:1;min-width:0}.flow-choice-go{flex:none;align-self:center;color:var(--ai-muted);transition:transform .15s ease-out,color .15s ease-out}@media(hover:hover){.flow-choice:hover:not(:disabled){border-color:var(--ai-muted);background:var(--flow-quiet)}.flow-choice:hover:not(:disabled) .flow-choice-go{color:var(--ai-ink);transform:translate(2px)}}.flow-choice:disabled{cursor:not-allowed;border-color:oklch(from var(--ai-line) l c h / 45%);background:transparent}.flow-choice:disabled strong{color:var(--ai-muted);font-weight:400}.flow-choice:disabled .flow-choice-go{visibility:hidden}.flow-kbd-hint{margin-top:var(--pw-space-lg)}@media(pointer:coarse){.flow-kbd-hint{display:none}}.flow-choice-parent{margin-bottom:var(--pw-space-md)}.flow-choice strong{display:block;font-weight:600}.flow-choice small{display:block;margin-top:.25rem;color:var(--ai-muted);font-size:var(--text-sm);line-height:1.5}.flow-actions{display:flex;align-items:center;gap:var(--pw-space-sm);margin-top:var(--pw-space-xl)}.flow-primary{margin-inline-start:auto;height:var(--flow-control);padding-inline:var(--pw-space-xl);font-size:var(--text-sm);font-weight:600;background:var(--ai-primary);color:var(--ai-primary-ink)}.flow-secondary{height:var(--flow-control);padding-inline:var(--pw-space-lg);font-size:var(--text-sm)}@media(hover:hover){.flow-secondary:hover:not([aria-disabled=true]){background:var(--flow-quiet);color:var(--ai-ink)}}.flow-secondary[aria-disabled=true]{cursor:default}.flow-primary:hover:not(:disabled,[aria-disabled=true]){background:oklch(from var(--ai-primary) calc(l - .04) c h)}.flow-primary[aria-disabled=true]{opacity:.65;cursor:default}.flow-primary-wide{width:100%}.flow-error{color:var(--ai-danger);font-size:var(--text-sm);line-height:1.5}.flow-error a{font-weight:600;text-decoration:underline;text-underline-offset:3px}.flow-form .flow-error{min-height:1.5em}.flow-form .flow-actions{margin-top:calc(var(--pw-space-sm) - var(--pw-space-lg))}.flow-error:focus-visible{outline:2px solid var(--ai-ink);outline-offset:4px}.flow-focus-region:focus-visible{outline:2px solid var(--ai-ink);outline-offset:4px}.flow-note{margin-top:var(--pw-space-xl);color:var(--ai-muted);font-size:var(--text-xs);line-height:1.75}.flow-verdict{border-radius:.5rem;border:1px solid var(--ai-line);padding:var(--pw-space-lg)}.flow-verdict[data-tone=bad]{border-color:oklch(from var(--ai-danger) l c h / 40%);background:oklch(from var(--ai-danger) l c h / 8%)}.flow-verdict[data-tone=warn]{border-color:#dfa11a73;background:#dfa11a1a}.flow-verdict[data-tone=good]{border-color:oklch(from var(--flow-ok) l c h / 45%);background:oklch(from var(--flow-ok) l c h / 10%)}.flow-verdict[data-tone=muted]{border-color:var(--ai-line);background:var(--ai-raised)}@media(max-width:1023px){.flow-layout{display:flex;flex-direction:column}.flow-panel{flex:1}.flow-rail{display:none}.flow-strip{display:flex}.flow-panel{align-items:flex-start;padding:var(--pw-space-xxl) max(var(--pw-space-xl),env(safe-area-inset-right)) max(var(--pw-space-xxl),env(safe-area-inset-bottom)) max(var(--pw-space-xl),env(safe-area-inset-left))}.flow-panel{padding-bottom:var(--pw-space-lg)}.flow-foot{align-self:stretch;padding:var(--pw-space-md) max(var(--pw-space-xl),env(safe-area-inset-right)) max(var(--pw-space-xl),env(safe-area-inset-bottom)) max(var(--pw-space-xl),env(safe-area-inset-left));--foot-ink: var(--ai-ink);--foot-muted: var(--ai-muted);--foot-quiet: var(--flow-quiet)}.flow-grain{background:var(--flow-grain-panel)}.flow-actions{flex-direction:column;align-items:stretch}.flow-primary{margin-inline-start:0}.flow-group-body{grid-template-columns:minmax(0,1fr)}.flow-lines li{grid-template-columns:3rem minmax(0,1fr)}.flow-line-state{grid-column:2}}
