okengine 0.10.2 → 0.11.0

package/src/console/ui/dist/assets/panel-vault-BkZdJPX8.js

@@ -0,0 +1 @@
+import{a as e,r as t}from"./rolldown-runtime-B0Z9INg1.js";import{C as n,Q as r,Z as i,a,b as o,c as s,d as c,et as l,g as u,nt as d,o as f,tt as p,u as m,w as h,y as g}from"./panel-access-ri1X9Otj.js";import{n as _}from"./panel-channels-BDYWX29p.js";var v=g({q:o().optional(),name:o().optional(),action:u([`set`,`rotate`]).optional()});function y(e){let t=v.safeParse(e);return t.success?t.data:{}}function b(e){let t={};return e.q&&(t.q=e.q),e.name&&(t.name=e.name),e.action&&(t.action=e.action),t}function x(e,t){return{...e,name:t,action:void 0}}var S={vault:`okengine's own store — encrypted at rest, sealed until unsealed with the master key`,env:`Environment layers only — process.env, .env.local, docker/.env.docker`,managed:`Managed KMS / provider secret store`,memory:`In-memory bag — test only, nothing survives restart`};function C(e){if(!e)return null;let t=`Backend ${e.driverId}`,n=S[e.driverId]??`Custom vault backend`;if(!e.builtin)return{title:t,description:n,badges:[],facts:[],hint:null};let r=e.status;if(!r)return{title:t,description:n,badges:[{id:`unreachable`,label:`status unavailable`,tone:`warn`}],facts:[],hint:e.unavailable??"Run `oke vault status` to inspect the backend directly"};if(!r.initialized)return{title:t,description:n,badges:[{id:`uninitialized`,label:`not initialized`,tone:`warn`}],facts:[],hint:"Run `oke vault init` to create the vault and print its master key once"};let i=[{id:`initialized`,label:`initialized`,tone:`ok`},r.sealed?{id:`sealed`,label:`sealed`,tone:`warn`}:{id:`unsealed`,label:`unsealed`,tone:`ok`}];r.rewrapTargetKekVersion!==null&&i.push({id:`rewrap`,label:`rewrap → kek v${r.rewrapTargetKekVersion}`,tone:`warn`});let a=[{label:`KEK generation`,value:`v${r.kekVersion}`},{label:`Secrets stored`,value:String(r.secretCount)},{label:`Seal count`,value:String(r.sealCount)}];return r.lastUnsealedAt!==null&&a.push({label:`Last unsealed`,value:new Date(r.lastUnsealedAt).toISOString()}),r.lastSealedAt!==null&&a.push({label:`Last sealed`,value:new Date(r.lastSealedAt).toISOString()}),{title:t,description:n,badges:i,facts:a,hint:r.sealed?"This process holds no master key — export OKE_VAULT_MASTER_KEY or run `oke vault unseal`":null}}function w(e,t=``){let n=t.trim().toLowerCase(),r=n?e.filter(e=>e.name.toLowerCase().includes(n)||(e.description?.toLowerCase().includes(n)??!1)):e,i=[`secret`,`config`],a={secret:`Secrets`,config:`Config`};return i.map(e=>({kind:e,label:a[e],secrets:r.filter(t=>t.kind===e)})).filter(e=>e.secrets.length>0)}function T(e={production:!0}){return e.production?{kind:`typed`,phrase:`SET`,requireReason:!0}:{kind:`undo`,windowMs:15e3}}function E(e={production:!0}){return{kind:`typed`,phrase:`ROTATE`,requireReason:!0}}function D(e){if(e.count===0)return{summary:`No in-flight durable runs hold this secret`,detail:null,warn:!1};let t=e.longestOutstandingMs==null?null:O(e.longestOutstandingMs);return{summary:`${e.count} in-flight durable run(s) will wake holding a new key`,detail:t?`Longest outstanding wake in ${t}`:e.longestWakeAt==null?null:`Longest wake at ${new Date(e.longestWakeAt).toISOString()}`,warn:!0}}function O(e){if(e<1e3)return`${e}ms`;let t=Math.floor(e/1e3);if(t<60)return`${t}s`;let n=Math.floor(t/60);if(n<60)return`${n}m`;let r=Math.floor(n/60);return r<48?`${r}h`:`${Math.floor(r/24)}d`}function k(e){return{name:e.name,kind:e.kind,sensitive:e.sensitive,description:e.description??null,rotate:e.rotate??null,fingerprints:{...e.fingerprints},fingerprint:e.fingerprint,cleartext:e.sensitive?null:e.cleartext,winner:e.winner,resolution:e.resolution.map(e=>({...e})),readers:[...e.readers],blastRadius:{count:e.blastRadius.count,longestWakeAt:e.blastRadius.longestWakeAt,longestOutstandingMs:e.blastRadius.longestOutstandingMs,runIds:[...e.blastRadius.runIds]},lastReadAt:e.lastReadAt,sharedFingerprintEnvs:[...e.sharedFingerprintEnvs]}}function A(e){return JSON.stringify(e.map(e=>k(e)),null,2)}var j=e(d(),1),M=p();function N(){let e=h({from:`/vault`}),t=n({from:`/vault`}),o=l(),[u,d]=(0,j.useState)(``),[p,g]=(0,j.useState)(``),[v,y]=(0,j.useState)(``),[S,O]=(0,j.useState)(null),k=e=>{t({search:b(e),replace:!0})},N=r({queryKey:[`console.vault.list`],queryFn:async()=>{let e=await c.vaultList();if(e.error)throw Error(e.error.code);return e.data},refetchInterval:1e4}),P=N.data?.secrets??[],F=N.data?.env??`local`,I=N.data?.backend??null,L=(0,j.useMemo)(()=>C(I),[I]),R=(0,j.useMemo)(()=>w(P,e.q??``),[P,e.q]),z=P.find(t=>t.name===e.name),B=z?D(z.blastRadius):null,V=T({production:!0}),H=E({production:!0}),U=e.action;(0,j.useEffect)(()=>{d(``),g(``),y(``),O(null)},[z?.name,U]);let W=i({mutationFn:async()=>{if(!z)throw Error(`no secret`);if(V.kind===`typed`){let e=a({typed:u,reason:p,phrase:V.phrase});if(e)throw Error(e.typed??e.reason??`confirm`)}let e=await c.vaultSet({name:z.name,value:v,confirmation:V.kind===`typed`?u:void 0,reason:p||void 0});if(e.error)throw Error(e.error.code);return e.data},onSuccess:async()=>{y(``),d(``),g(``),k({...e,action:void 0}),await o.invalidateQueries({queryKey:[`console.vault.list`]})}}),G=i({mutationFn:async()=>{if(!z)throw Error(`no secret`);let e=a({typed:u,reason:p,phrase:H.kind===`typed`?H.phrase:`ROTATE`});if(e)throw Error(e.typed??e.reason??`confirm`);let t=await c.vaultRotate({name:z.name,value:v,confirmation:u,reason:p});if(t.error)throw Error(t.error.code);return t.data},onSuccess:async()=>{y(``),d(``),g(``),k({...e,action:void 0}),await o.invalidateQueries({queryKey:[`console.vault.list`]})}});return(0,M.jsxs)(`div`,{className:`flex h-full min-h-0 flex-col`,children:[(0,M.jsxs)(`header`,{className:`flex shrink-0 flex-wrap items-end gap-3 border-b border-[var(--oke-line)] px-4 py-3`,children:[(0,M.jsxs)(`div`,{children:[(0,M.jsx)(`h1`,{className:`text-lg font-medium text-[var(--oke-fg)]`,children:`Vault`}),(0,M.jsx)(`p`,{className:`text-sm text-[var(--oke-muted)]`,children:`Fingerprints only — secrets are write-only`})]}),(0,M.jsxs)(`p`,{className:`text-sm text-[var(--oke-muted)]`,role:`status`,children:[`Environment `,F]}),(0,M.jsxs)(`label`,{className:`ml-auto flex min-w-[12rem] flex-col gap-1 text-sm`,children:[(0,M.jsx)(`span`,{className:`text-[var(--oke-muted)]`,children:`Filter vault`}),(0,M.jsx)(s,{"aria-label":`Filter vault`,value:e.q??``,onChange:t=>k({...e,q:t.currentTarget.value||void 0})})]}),(0,M.jsx)(f,{type:`button`,variant:`ghost`,onClick:()=>{let e=A(P);navigator.clipboard?.writeText(e),O(`Exported fingerprints only (no secret values)`)},children:`Export`})]}),S?(0,M.jsx)(`p`,{className:`px-4 py-2 text-sm text-[var(--oke-muted)]`,role:`status`,children:S}):null,L?(0,M.jsxs)(`section`,{"aria-label":`Vault backend`,className:`shrink-0 border-b border-[var(--oke-line)] px-4 py-3`,children:[(0,M.jsxs)(`div`,{className:`flex flex-wrap items-center gap-2`,children:[(0,M.jsx)(`h2`,{className:`text-sm font-medium text-[var(--oke-fg)]`,children:L.title}),L.badges.map(e=>(0,M.jsx)(`span`,{role:e.tone===`warn`?`alert`:`status`,className:m(`border border-[var(--oke-line)] px-2 py-0.5 text-xs`,e.tone===`warn`?`text-[var(--oke-danger)]`:e.tone===`ok`?`text-[var(--oke-fg)]`:`text-[var(--oke-muted)]`),children:e.label},e.id))]}),(0,M.jsx)(`p`,{className:`mt-1 text-sm text-[var(--oke-muted)]`,children:L.description}),L.facts.length>0?(0,M.jsx)(`dl`,{className:`mt-2 flex flex-wrap gap-x-6 gap-y-1 text-sm`,children:L.facts.map(e=>(0,M.jsxs)(`div`,{className:`flex gap-2`,children:[(0,M.jsx)(`dt`,{className:`text-[var(--oke-muted)]`,children:e.label}),(0,M.jsx)(`dd`,{className:`font-mono`,children:e.value})]},e.label))}):null,L.hint?(0,M.jsx)(`p`,{className:`mt-1 text-sm text-[var(--oke-muted)]`,role:`status`,children:L.hint}):null,I?.builtin?(0,M.jsxs)(`p`,{className:`mt-1 text-sm text-[var(--oke-muted)]`,children:[`Every read, write, seal and rotate is recorded in a hash-chained audit log. Read it with `,(0,M.jsx)(`code`,{className:`font-mono`,children:`oke vault audit`}),`; verify the chain with`,` `,(0,M.jsx)(`code`,{className:`font-mono`,children:`oke vault audit verify`}),`.`]}):null]}):null,(0,M.jsxs)(`div`,{className:`flex min-h-0 flex-1`,children:[(0,M.jsxs)(`section`,{"aria-label":`Vault list`,className:`w-80 shrink-0 overflow-y-auto border-r border-[var(--oke-line)]`,children:[(0,M.jsx)(`h2`,{className:`sr-only`,children:`Contracts`}),N.isLoading?(0,M.jsx)(`p`,{className:`p-4 text-sm text-[var(--oke-muted)]`,children:`Loading…`}):null,R.map(t=>(0,M.jsxs)(`section`,{"aria-label":t.label,className:`py-2`,children:[(0,M.jsx)(`h3`,{className:`px-4 py-1 text-xs uppercase tracking-wide text-[var(--oke-muted)]`,children:t.label}),(0,M.jsx)(`ul`,{children:t.secrets.map(t=>(0,M.jsx)(`li`,{children:(0,M.jsxs)(`button`,{type:`button`,"aria-pressed":t.name===z?.name,className:m(`flex min-h-10 w-full flex-col items-start px-4 py-2 text-left text-sm`,t.name===z?.name?`bg-[var(--oke-line)] text-[var(--oke-fg)]`:`text-[var(--oke-muted)] hover:text-[var(--oke-fg)]`),onClick:()=>k(x(e,t.name)),children:[(0,M.jsx)(`span`,{children:_(t.name,t.description)}),t.description?(0,M.jsx)(`span`,{className:`font-mono text-xs text-[var(--oke-muted)]`,children:t.name}):null,(0,M.jsx)(`span`,{className:`truncate text-xs`,children:t.sensitive?t.fingerprint??`unset`:t.cleartext??`unset`}),t.blastRadius.count>0?(0,M.jsxs)(`span`,{role:`status`,className:`text-xs text-[var(--oke-danger)]`,children:[`blast `,t.blastRadius.count]}):null,t.sharedFingerprintEnvs.length>0?(0,M.jsx)(`span`,{role:`status`,className:`text-xs`,children:`shared fingerprint`}):null]})},t.name))})]},t.kind))]}),(0,M.jsx)(`section`,{"aria-label":`Vault detail`,"aria-live":`polite`,className:`min-w-0 flex-1 overflow-y-auto p-4`,children:z?(0,M.jsxs)(`div`,{className:`flex max-w-2xl flex-col gap-6`,children:[(0,M.jsxs)(`div`,{children:[(0,M.jsx)(`h2`,{className:`text-lg text-[var(--oke-fg)]`,children:_(z.name,z.description)}),z.description?(0,M.jsx)(`p`,{className:`font-mono text-sm text-[var(--oke-muted)]`,children:z.name}):null,z.rotate?(0,M.jsxs)(`p`,{className:`text-sm text-[var(--oke-muted)]`,children:[`Rotate hint: `,z.rotate]}):null]}),(0,M.jsxs)(`section`,{"aria-label":`Fingerprints by environment`,children:[(0,M.jsx)(`h3`,{className:`mb-2 text-sm font-medium`,children:`Fingerprints`}),z.sensitive?(0,M.jsxs)(`ul`,{className:`space-y-1 font-mono text-sm`,children:[Object.entries(z.fingerprints).map(([e,t])=>(0,M.jsxs)(`li`,{children:[(0,M.jsxs)(`span`,{className:`text-[var(--oke-muted)]`,children:[e,`:`]}),` `,t,z.sharedFingerprintEnvs.includes(e)?(0,M.jsxs)(`span`,{role:`status`,className:`ml-2 text-[var(--oke-warn,var(--oke-muted))]`,children:[`(matches `,F,` — warning, may be deliberate)`]}):null]},e)),Object.keys(z.fingerprints).length===0?(0,M.jsx)(`li`,{className:`text-[var(--oke-muted)]`,children:`Unset`}):null]}):(0,M.jsx)(`p`,{className:`font-mono text-sm`,role:`status`,children:z.cleartext??`unset`})]}),(0,M.jsxs)(`section`,{"aria-label":`Resolution chain`,children:[(0,M.jsx)(`h3`,{className:`mb-2 text-sm font-medium`,children:`Resolution chain`}),(0,M.jsx)(`ol`,{className:`list-decimal space-y-1 pl-5 text-sm`,children:z.resolution.map(e=>(0,M.jsxs)(`li`,{className:e.won?`text-[var(--oke-fg)]`:`text-[var(--oke-muted)]`,children:[(0,M.jsx)(`span`,{className:`font-mono`,children:e.source}),e.won?` — won`:e.present?` — present (lost)`:` — absent`]},e.source))}),(0,M.jsxs)(`p`,{className:`mt-2 text-sm`,role:`status`,children:[`Winner: `,(0,M.jsx)(`span`,{className:`font-mono`,children:z.winner??`none`})]})]}),(0,M.jsxs)(`section`,{"aria-label":`Readers`,children:[(0,M.jsx)(`h3`,{className:`mb-2 text-sm font-medium`,children:`Readers`}),(0,M.jsxs)(`p`,{className:`text-sm text-[var(--oke-muted)]`,children:[`Flows that declare `,(0,M.jsxs)(`code`,{className:`font-mono`,children:[`fx.vault.get(`,z.name,`)`]})]}),(0,M.jsx)(`ul`,{className:`mt-1 list-disc pl-5 font-mono text-sm`,children:z.readers.length===0?(0,M.jsx)(`li`,{className:`text-[var(--oke-muted)]`,children:`none`}):z.readers.map(e=>(0,M.jsx)(`li`,{children:e},e))})]}),(0,M.jsxs)(`section`,{"aria-label":`Rotation blast radius`,children:[(0,M.jsx)(`h3`,{className:`mb-2 text-sm font-medium`,children:`Rotation blast radius`}),B?(0,M.jsxs)(M.Fragment,{children:[(0,M.jsx)(`p`,{className:`text-sm`,role:B.warn?`alert`:`status`,children:B.summary}),B.detail?(0,M.jsx)(`p`,{className:`text-sm text-[var(--oke-muted)]`,children:B.detail}):null,z.blastRadius.runIds.length>0?(0,M.jsx)(`p`,{className:`mt-1 font-mono text-xs text-[var(--oke-muted)]`,children:z.blastRadius.runIds.join(`, `)}):null]}):null]}),(0,M.jsxs)(`section`,{"aria-label":`Last read`,children:[(0,M.jsx)(`h3`,{className:`mb-2 text-sm font-medium`,children:`Last read`}),(0,M.jsx)(`p`,{className:`text-sm`,role:`status`,children:z.lastReadAt==null?`Never read — possible dead secret`:new Date(z.lastReadAt).toISOString()})]}),(0,M.jsxs)(`section`,{"aria-label":`Set or rotate`,className:`space-y-3`,children:[(0,M.jsx)(`h3`,{className:`text-sm font-medium`,children:`Set / rotate`}),(0,M.jsx)(`p`,{className:`text-sm text-[var(--oke-muted)]`,children:`Write-only. Values are never revealed after submit. No preview.`}),(0,M.jsxs)(`div`,{className:`flex gap-2`,children:[(0,M.jsx)(f,{type:`button`,variant:U===`set`?`primary`:`ghost`,"aria-pressed":U===`set`,onClick:()=>k({...e,action:`set`}),children:`Set`}),(0,M.jsx)(f,{type:`button`,variant:U===`rotate`?`danger`:`ghost`,"aria-pressed":U===`rotate`,onClick:()=>k({...e,action:`rotate`}),children:`Rotate`})]}),U?(0,M.jsxs)(`div`,{className:`space-y-3 border border-[var(--oke-line)] p-3`,children:[(0,M.jsxs)(`label`,{className:`flex flex-col gap-1 text-sm`,children:[(0,M.jsx)(`span`,{children:`New value`}),(0,M.jsx)(s,{"aria-label":`New vault value`,type:`password`,autoComplete:`off`,value:v,onChange:e=>y(e.currentTarget.value)})]}),(U===`rotate`||V.kind===`typed`)&&(0,M.jsxs)(M.Fragment,{children:[(0,M.jsxs)(`label`,{className:`flex flex-col gap-1 text-sm`,children:[(0,M.jsxs)(`span`,{children:[`Type`,` `,U===`rotate`?H.kind===`typed`?H.phrase:`ROTATE`:V.kind===`typed`?V.phrase:`SET`,` `,`to confirm`]}),(0,M.jsx)(s,{"aria-label":`Confirmation phrase`,value:u,onChange:e=>d(e.currentTarget.value)})]}),(0,M.jsxs)(`label`,{className:`flex flex-col gap-1 text-sm`,children:[(0,M.jsx)(`span`,{children:`Reason`}),(0,M.jsx)(s,{"aria-label":`Reason for vault write`,value:p,onChange:e=>g(e.currentTarget.value)})]})]}),(0,M.jsx)(f,{type:`button`,variant:U===`rotate`?`danger`:`primary`,disabled:!v||(U===`set`?W.isPending:G.isPending),onClick:()=>{U===`set`?W.mutate():G.mutate()},children:U===`set`?`Commit set`:`Commit rotate`}),(W.isError||G.isError)&&(0,M.jsx)(`p`,{role:`alert`,className:`text-sm text-[var(--oke-danger)]`,children:(W.error??G.error)?.message??`Failed`})]}):null]})]}):(0,M.jsx)(`p`,{className:`text-sm text-[var(--oke-muted)]`,children:`Select a contract to inspect fingerprints, resolution, and readers.`})})]})]})}var P=t({default:()=>N});export{y as n,P as t};

package/src/console/ui/dist/assets/style-C3L349iZ.css

@@ -0,0 +1,3 @@
+/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
+@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-space-y-reverse:0;--tw-divide-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction:initial;--tw-outline-style:solid;--tw-duration:initial}}}@layer theme{:root,:host{--font-sans:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-red-600:oklch(57.7% .245 27.325);--color-red-700:oklch(50.5% .213 27.518);--color-amber-800:oklch(47.3% .137 46.201);--color-black:#000;--color-white:#fff;--spacing:.25rem;--container-xs:20rem;--container-sm:24rem;--container-md:28rem;--container-lg:32rem;--container-2xl:42rem;--container-5xl:64rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-base:1rem;--text-base--line-height:calc(1.5 / 1);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75 / 1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2 / 1.5);--text-3xl:1.875rem;--text-3xl--line-height:calc(2.25 / 1.875);--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--tracking-tight:-.025em;--tracking-wide:.025em;--tracking-wider:.05em;--leading-snug:1.375;--leading-relaxed:1.625;--radius-sm:.25rem;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring:where(:not(iframe)){outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.visible{visibility:visible}.sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.sticky{position:sticky}.inset-0{inset:0}.inset-y-0{inset-block:0}.top-0{top:0}.right-\[min\(28\%\,20rem\)\]{right:min(28%,20rem)}.left-\[min\(28\%\,20rem\)\]{left:min(28%,20rem)}.z-10{z-index:10}.z-20{z-index:20}.z-50{z-index:50}.col-span-2{grid-column:span 2/span 2}.mx-auto{margin-inline:auto}.mt-1{margin-top:var(--spacing)}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-3{margin-top:calc(var(--spacing) * 3)}.mt-4{margin-top:calc(var(--spacing) * 4)}.mt-6{margin-top:calc(var(--spacing) * 6)}.mt-8{margin-top:calc(var(--spacing) * 8)}.mt-auto{margin-top:auto}.mr-2{margin-right:calc(var(--spacing) * 2)}.mr-3{margin-right:calc(var(--spacing) * 3)}.mr-auto{margin-right:auto}.mb-1{margin-bottom:var(--spacing)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.mb-3{margin-bottom:calc(var(--spacing) * 3)}.mb-4{margin-bottom:calc(var(--spacing) * 4)}.mb-8{margin-bottom:calc(var(--spacing) * 8)}.ml-1{margin-left:var(--spacing)}.ml-2{margin-left:calc(var(--spacing) * 2)}.ml-auto{margin-left:auto}.block{display:block}.contents{display:contents}.flex{display:flex}.grid{display:grid}.inline-block{display:inline-block}.inline-flex{display:inline-flex}.size-1\.5{width:calc(var(--spacing) * 1.5);height:calc(var(--spacing) * 1.5)}.h-1\.5{height:calc(var(--spacing) * 1.5)}.h-2{height:calc(var(--spacing) * 2)}.h-4{height:calc(var(--spacing) * 4)}.h-6{height:calc(var(--spacing) * 6)}.h-7{height:calc(var(--spacing) * 7)}.h-12{height:calc(var(--spacing) * 12)}.h-16{height:calc(var(--spacing) * 16)}.h-40{height:calc(var(--spacing) * 40)}.h-64{height:calc(var(--spacing) * 64)}.h-\[calc\(100vh-3rem\)\]{height:calc(100vh - 3rem)}.h-auto{height:auto}.h-full{height:100%}.max-h-48{max-height:calc(var(--spacing) * 48)}.min-h-0{min-height:0}.min-h-2{min-height:calc(var(--spacing) * 2)}.min-h-8{min-height:calc(var(--spacing) * 8)}.min-h-10{min-height:calc(var(--spacing) * 10)}.min-h-20{min-height:calc(var(--spacing) * 20)}.min-h-24{min-height:calc(var(--spacing) * 24)}.w-2{width:calc(var(--spacing) * 2)}.w-5{width:calc(var(--spacing) * 5)}.w-6{width:calc(var(--spacing) * 6)}.w-16{width:calc(var(--spacing) * 16)}.w-24{width:calc(var(--spacing) * 24)}.w-56{width:calc(var(--spacing) * 56)}.w-64{width:calc(var(--spacing) * 64)}.w-72{width:calc(var(--spacing) * 72)}.w-80{width:calc(var(--spacing) * 80)}.w-auto{width:auto}.w-full{width:100%}.max-w-2xl{max-width:var(--container-2xl)}.max-w-5xl{max-width:var(--container-5xl)}.max-w-lg{max-width:var(--container-lg)}.max-w-md{max-width:var(--container-md)}.max-w-prose{max-width:65ch}.max-w-sm{max-width:var(--container-sm)}.max-w-xs{max-width:var(--container-xs)}.min-w-0{min-width:0}.min-w-2{min-width:calc(var(--spacing) * 2)}.min-w-8{min-width:calc(var(--spacing) * 8)}.min-w-\[4px\]{min-width:4px}.min-w-\[8rem\]{min-width:8rem}.min-w-\[12rem\]{min-width:12rem}.min-w-\[16rem\]{min-width:16rem}.flex-1{flex:1}.shrink-0{flex-shrink:0}.basis-full{flex-basis:100%}.border-collapse{border-collapse:collapse}.cursor-pointer{cursor:pointer}.list-inside{list-style-position:inside}.list-decimal{list-style-type:decimal}.list-disc{list-style-type:disc}.list-none{list-style-type:none}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-\[minmax\(0\,8rem\)_1fr\]{grid-template-columns:minmax(0,8rem) 1fr}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.place-items-center{place-items:center}.items-baseline{align-items:baseline}.items-center{align-items:center}.items-end{align-items:flex-end}.items-start{align-items:flex-start}.items-stretch{align-items:stretch}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-0{gap:0}.gap-0\.5{gap:calc(var(--spacing) * .5)}.gap-1{gap:var(--spacing)}.gap-1\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-6{gap:calc(var(--spacing) * 6)}.gap-8{gap:calc(var(--spacing) * 8)}.gap-px{gap:1px}:where(.space-y-0\.5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * .5) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * .5) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(var(--spacing) * var(--tw-space-y-reverse));margin-block-end:calc(var(--spacing) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-6>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)))}.gap-x-4{column-gap:calc(var(--spacing) * 4)}.gap-x-6{column-gap:calc(var(--spacing) * 6)}.gap-y-1{row-gap:var(--spacing)}.gap-y-2{row-gap:calc(var(--spacing) * 2)}:where(.divide-y>:not(:last-child)){--tw-divide-y-reverse:0;border-bottom-style:var(--tw-border-style);border-top-style:var(--tw-border-style);border-top-width:calc(1px * var(--tw-divide-y-reverse));border-bottom-width:calc(1px * calc(1 - var(--tw-divide-y-reverse)))}:where(.divide-\[var\(--oke-line\)\]>:not(:last-child)){border-color:var(--oke-line)}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.rounded{border-radius:.25rem}.rounded-full{border-radius:2147483647px}.rounded-sm{border-radius:var(--radius-sm)}.border{border-style:var(--tw-border-style);border-width:1px}.border-x{border-inline-style:var(--tw-border-style);border-inline-width:1px}.border-y{border-block-style:var(--tw-border-style);border-block-width:1px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-l{border-left-style:var(--tw-border-style);border-left-width:1px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-\[var\(--oke-accent\)\]{border-color:var(--oke-accent)}.border-\[var\(--oke-external\)\]{border-color:var(--oke-external)}.border-\[var\(--oke-line\)\],.border-\[var\(--oke-line\)\]\/50{border-color:var(--oke-line)}@supports (color:color-mix(in lab, red, red)){.border-\[var\(--oke-line\)\]\/50{border-color:color-mix(in oklab, var(--oke-line) 50%, transparent)}}.border-\[var\(--oke-muted\)\]{border-color:var(--oke-muted)}.bg-\[color-mix\(in_oklab\,var\(--oke-accent\)_55\%\,transparent\)\]{background-color:var(--oke-accent)}@supports (color:color-mix(in lab, red, red)){.bg-\[color-mix\(in_oklab\,var\(--oke-accent\)_55\%\,transparent\)\]{background-color:color-mix(in oklab,var(--oke-accent) 55%,transparent)}}.bg-\[color-mix\(in_oklab\,var\(--oke-fg\)_3\%\,transparent\)\]{background-color:var(--oke-fg)}@supports (color:color-mix(in lab, red, red)){.bg-\[color-mix\(in_oklab\,var\(--oke-fg\)_3\%\,transparent\)\]{background-color:color-mix(in oklab,var(--oke-fg) 3%,transparent)}}.bg-\[color-mix\(in_oklab\,var\(--oke-fg\)_6\%\,transparent\)\]{background-color:var(--oke-fg)}@supports (color:color-mix(in lab, red, red)){.bg-\[color-mix\(in_oklab\,var\(--oke-fg\)_6\%\,transparent\)\]{background-color:color-mix(in oklab,var(--oke-fg) 6%,transparent)}}.bg-\[color-mix\(in_oklab\,var\(--oke-fg\)_35\%\,transparent\)\]{background-color:var(--oke-fg)}@supports (color:color-mix(in lab, red, red)){.bg-\[color-mix\(in_oklab\,var\(--oke-fg\)_35\%\,transparent\)\]{background-color:color-mix(in oklab,var(--oke-fg) 35%,transparent)}}.bg-\[var\(--oke-accent\)\],.bg-\[var\(--oke-accent\)\]\/15{background-color:var(--oke-accent)}@supports (color:color-mix(in lab, red, red)){.bg-\[var\(--oke-accent\)\]\/15{background-color:color-mix(in oklab, var(--oke-accent) 15%, transparent)}}.bg-\[var\(--oke-bg\)\]{background-color:var(--oke-bg)}.bg-\[var\(--oke-danger\)\],.bg-\[var\(--oke-danger\)\]\/10{background-color:var(--oke-danger)}@supports (color:color-mix(in lab, red, red)){.bg-\[var\(--oke-danger\)\]\/10{background-color:color-mix(in oklab, var(--oke-danger) 10%, transparent)}}.bg-\[var\(--oke-external\)\]{background-color:var(--oke-external)}.bg-\[var\(--oke-fg\)\]{background-color:var(--oke-fg)}.bg-\[var\(--oke-line\)\],.bg-\[var\(--oke-line\)\]\/40{background-color:var(--oke-line)}@supports (color:color-mix(in lab, red, red)){.bg-\[var\(--oke-line\)\]\/40{background-color:color-mix(in oklab, var(--oke-line) 40%, transparent)}}.bg-black\/20{background-color:#0003}@supports (color:color-mix(in lab, red, red)){.bg-black\/20{background-color:color-mix(in oklab, var(--color-black) 20%, transparent)}}.bg-black\/50{background-color:#00000080}@supports (color:color-mix(in lab, red, red)){.bg-black\/50{background-color:color-mix(in oklab, var(--color-black) 50%, transparent)}}.bg-transparent{background-color:#0000}.fill-\[var\(--oke-fg\)\]{fill:var(--oke-fg)}.fill-\[var\(--oke-muted\)\]{fill:var(--oke-muted)}.p-0{padding:0}.p-2{padding:calc(var(--spacing) * 2)}.p-3{padding:calc(var(--spacing) * 3)}.p-4{padding:calc(var(--spacing) * 4)}.p-6{padding:calc(var(--spacing) * 6)}.px-1{padding-inline:var(--spacing)}.px-1\.5{padding-inline:calc(var(--spacing) * 1.5)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-5{padding-inline:calc(var(--spacing) * 5)}.px-6{padding-inline:calc(var(--spacing) * 6)}.py-0\.5{padding-block:calc(var(--spacing) * .5)}.py-1{padding-block:var(--spacing)}.py-1\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-4{padding-block:calc(var(--spacing) * 4)}.py-5{padding-block:calc(var(--spacing) * 5)}.py-6{padding-block:calc(var(--spacing) * 6)}.py-8{padding-block:calc(var(--spacing) * 8)}.py-16{padding-block:calc(var(--spacing) * 16)}.pt-3{padding-top:calc(var(--spacing) * 3)}.pt-4{padding-top:calc(var(--spacing) * 4)}.pr-2{padding-right:calc(var(--spacing) * 2)}.pr-3{padding-right:calc(var(--spacing) * 3)}.pr-4{padding-right:calc(var(--spacing) * 4)}.pb-1{padding-bottom:var(--spacing)}.pb-2{padding-bottom:calc(var(--spacing) * 2)}.pb-4{padding-bottom:calc(var(--spacing) * 4)}.pl-4{padding-left:calc(var(--spacing) * 4)}.pl-5{padding-left:calc(var(--spacing) * 5)}.text-center{text-align:center}.text-left{text-align:left}.align-top{vertical-align:top}.font-mono{font-family:var(--font-mono)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\[10px\]{font-size:10px}.text-\[11px\]{font-size:11px}.text-\[13px\]{font-size:13px}.leading-10{--tw-leading:calc(var(--spacing) * 10);line-height:calc(var(--spacing) * 10)}.leading-relaxed{--tw-leading:var(--leading-relaxed);line-height:var(--leading-relaxed)}.leading-snug{--tw-leading:var(--leading-snug);line-height:var(--leading-snug)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-normal{--tw-font-weight:var(--font-weight-normal);font-weight:var(--font-weight-normal)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-\[0\.2em\]{--tw-tracking:.2em;letter-spacing:.2em}.tracking-\[0\.14em\]{--tw-tracking:.14em;letter-spacing:.14em}.tracking-\[0\.15em\]{--tw-tracking:.15em;letter-spacing:.15em}.tracking-tight{--tw-tracking:var(--tracking-tight);letter-spacing:var(--tracking-tight)}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.tracking-wider{--tw-tracking:var(--tracking-wider);letter-spacing:var(--tracking-wider)}.break-all{word-break:break-all}.whitespace-pre-wrap{white-space:pre-wrap}.text-\[var\(--oke-accent\)\]{color:var(--oke-accent)}.text-\[var\(--oke-danger\)\]{color:var(--oke-danger)}.text-\[var\(--oke-external\)\]{color:var(--oke-external)}.text-\[var\(--oke-fg\)\]{color:var(--oke-fg)}.text-\[var\(--oke-muted\)\]{color:var(--oke-muted)}.text-\[var\(--oke-warn\,var\(--oke-muted\)\)\]{color:var(--oke-warn,var(--oke-muted))}.text-amber-800{color:var(--color-amber-800)}.text-black{color:var(--color-black)}.text-red-600{color:var(--color-red-600)}.text-red-700{color:var(--color-red-700)}.text-white{color:var(--color-white)}.normal-case{text-transform:none}.uppercase{text-transform:uppercase}.tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}.line-through{text-decoration-line:line-through}.underline{text-decoration-line:underline}.decoration-\[var\(--oke-line\)\]{-webkit-text-decoration-color:var(--oke-line);-webkit-text-decoration-color:var(--oke-line);text-decoration-color:var(--oke-line)}.underline-offset-2{text-underline-offset:2px}.opacity-40{opacity:.4}.opacity-70{opacity:.7}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.outline-2{outline-style:var(--tw-outline-style);outline-width:2px}.outline-\[var\(--oke-danger\)\]{outline-color:var(--oke-danger)}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-150{--tw-duration:.15s;transition-duration:.15s}.placeholder\:text-\[var\(--oke-muted\)\]::placeholder{color:var(--oke-muted)}@media (hover:hover){.hover\:bg-\[color-mix\(in_oklab\,var\(--oke-fg\)_3\%\,transparent\)\]:hover{background-color:var(--oke-fg)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-\[color-mix\(in_oklab\,var\(--oke-fg\)_3\%\,transparent\)\]:hover{background-color:color-mix(in oklab,var(--oke-fg) 3%,transparent)}}.hover\:bg-\[var\(--oke-line\)\]\/20:hover{background-color:var(--oke-line)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-\[var\(--oke-line\)\]\/20:hover{background-color:color-mix(in oklab, var(--oke-line) 20%, transparent)}}.hover\:bg-\[var\(--oke-line\)\]\/40:hover{background-color:var(--oke-line)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-\[var\(--oke-line\)\]\/40:hover{background-color:color-mix(in oklab, var(--oke-line) 40%, transparent)}}.hover\:text-\[var\(--oke-fg\)\]:hover{color:var(--oke-fg)}.hover\:underline:hover{text-decoration-line:underline}}.focus\:not-sr-only:focus{clip-path:none;white-space:normal;width:auto;height:auto;margin:0;padding:0;position:static;overflow:visible}.focus\:absolute:focus{position:absolute}.focus\:top-2:focus{top:calc(var(--spacing) * 2)}.focus\:left-2:focus{left:calc(var(--spacing) * 2)}.focus\:z-50:focus{z-index:50}.focus\:bg-\[var\(--oke-bg\)\]:focus{background-color:var(--oke-bg)}.focus\:px-3:focus{padding-inline:calc(var(--spacing) * 3)}.focus\:py-2:focus{padding-block:calc(var(--spacing) * 2)}.disabled\:opacity-40:disabled{opacity:.4}@media (width>=40rem){.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}}@media (width>=48rem){.md\:max-w-xs{max-width:var(--container-xs)}.md\:grid-cols-\[minmax\(0\,1fr\)_minmax\(0\,1\.4fr\)\]{grid-template-columns:minmax(0,1fr) minmax(0,1.4fr)}.md\:grid-cols-\[minmax\(0\,1fr\)_minmax\(0\,1\.5fr\)\]{grid-template-columns:minmax(0,1fr) minmax(0,1.5fr)}}@media (width>=64rem){.lg\:w-80{width:calc(var(--spacing) * 80)}.lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.lg\:grid-cols-\[1fr_1fr_1\.2fr\]{grid-template-columns:1fr 1fr 1.2fr}.lg\:grid-cols-\[14rem_1fr_18rem\]{grid-template-columns:14rem 1fr 18rem}.lg\:grid-cols-\[minmax\(0\,1\.2fr\)_minmax\(0\,1fr\)\]{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}.lg\:flex-row{flex-direction:row}.lg\:border-t-0{border-top-style:var(--tw-border-style);border-top-width:0}.lg\:border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.lg\:border-b-0{border-bottom-style:var(--tw-border-style);border-bottom-width:0}.lg\:border-l{border-left-style:var(--tw-border-style);border-left-width:1px}}}:root{--oke-bg:#0e1116;--oke-fg:#e8eaed;--oke-muted:#9aa3b2;--oke-line:var(--oke-fg)}@supports (color:color-mix(in lab, red, red)){:root{--oke-line:color-mix(in oklab, var(--oke-fg) 12%, transparent)}}:root{--oke-accent:#3d9a6a;--oke-external:#d97706;--oke-danger:#c44b4b;--oke-font:"IBM Plex Sans", "Segoe UI", sans-serif;--oke-mono:"IBM Plex Mono", ui-monospace, monospace;--oke-dim:.38}@font-face{font-family:IBM Plex Sans;font-style:normal;font-weight:400 600;font-display:swap;src:local(IBM Plex Sans)}html,body,#root{height:100%}body{font-family:var(--oke-font);background:radial-gradient(1200px 600px at 10% -10%, #1a2433 0%, transparent 55%), radial-gradient(900px 500px at 100% 0%, #13201a 0%, transparent 50%), var(--oke-bg);color:var(--oke-fg);font-variant-numeric:tabular-nums;margin:0}*{box-sizing:border-box}a{color:inherit;text-decoration:none}:focus-visible{outline:2px solid var(--oke-accent);outline-offset:2px}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-divide-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-ordinal{syntax:"*";inherits:false}@property --tw-slashed-zero{syntax:"*";inherits:false}@property --tw-numeric-figure{syntax:"*";inherits:false}@property --tw-numeric-spacing{syntax:"*";inherits:false}@property --tw-numeric-fraction{syntax:"*";inherits:false}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-duration{syntax:"*";inherits:false}
+/*$vite$:1*/

package/src/console/ui/dist/index.html

@@ -5,9 +5,9 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <link rel="icon" href="/favicon.svg" type="image/svg+xml" />
     <title>oke Console</title>
-    <script type="module" crossorigin src="/assets/index-D-9KFce5.js"></script>
+    <script type="module" crossorigin src="/assets/index--Y0Uaz-m.js"></script>
     <link rel="modulepreload" crossorigin href="/assets/rolldown-runtime-B0Z9INg1.js">
-    <link rel="stylesheet" crossorigin href="/assets/style-C8MxEWPd.css">
+    <link rel="stylesheet" crossorigin href="/assets/style-C3L349iZ.css">
   </head>
   <body>
     <div id="root"></div>

package/src/console/ui/shell/client.ts

@@ -484,6 +484,22 @@ interface ConsoleClient {
         sharedFingerprintEnvs: string[];
       }>;
       env: string;
+      backend: {
+        driverId: "env" | "vault" | "managed" | "memory";
+        builtin: boolean;
+        status: {
+          initialized: boolean;
+          sealed: boolean;
+          masterKeyPresent: boolean;
+          kekVersion: number;
+          secretCount: number;
+          sealCount: number;
+          lastSealedAt: number | null;
+          lastUnsealedAt: number | null;
+          rewrapTargetKekVersion: number | null;
+        } | null;
+        unavailable: string | null;
+      } | null;
     }>;
     vaultSet: (input: {
       name: string;

package/src/console/ui/shell/panels/vault/VaultPanel.tsx

@@ -11,6 +11,7 @@ import { useEffect, useMemo, useState } from "react";
 import {
   exportSafeList,
   formatBlastRadius,
+  formatVaultBackend,
   groupByKind,
   openVault,
   rotateConfirmation,
@@ -55,6 +56,8 @@ export function VaultPanel() {
 
   const secrets = listQuery.data?.secrets ?? [];
   const env = listQuery.data?.env ?? "local";
+  const backend = listQuery.data?.backend ?? null;
+  const backendCard = useMemo(() => formatVaultBackend(backend), [backend]);
   const groups = useMemo(() => groupByKind(secrets, search.q ?? ""), [secrets, search.q]);
   const open = secrets.find((s) => s.name === search.name);
   const blast = open ? formatBlastRadius(open.blastRadius) : null;
@@ -164,6 +167,56 @@ export function VaultPanel() {
         </p>
       ) : null}
 
+      {backendCard ? (
+        <section
+          aria-label="Vault backend"
+          className="shrink-0 border-b border-[var(--oke-line)] px-4 py-3"
+        >
+          <div className="flex flex-wrap items-center gap-2">
+            <h2 className="text-sm font-medium text-[var(--oke-fg)]">{backendCard.title}</h2>
+            {backendCard.badges.map((badge) => (
+              <span
+                key={badge.id}
+                role={badge.tone === "warn" ? "alert" : "status"}
+                className={clsx(
+                  "border border-[var(--oke-line)] px-2 py-0.5 text-xs",
+                  badge.tone === "warn"
+                    ? "text-[var(--oke-danger)]"
+                    : badge.tone === "ok"
+                      ? "text-[var(--oke-fg)]"
+                      : "text-[var(--oke-muted)]",
+                )}
+              >
+                {badge.label}
+              </span>
+            ))}
+          </div>
+          <p className="mt-1 text-sm text-[var(--oke-muted)]">{backendCard.description}</p>
+          {backendCard.facts.length > 0 ? (
+            <dl className="mt-2 flex flex-wrap gap-x-6 gap-y-1 text-sm">
+              {backendCard.facts.map((fact) => (
+                <div key={fact.label} className="flex gap-2">
+                  <dt className="text-[var(--oke-muted)]">{fact.label}</dt>
+                  <dd className="font-mono">{fact.value}</dd>
+                </div>
+              ))}
+            </dl>
+          ) : null}
+          {backendCard.hint ? (
+            <p className="mt-1 text-sm text-[var(--oke-muted)]" role="status">
+              {backendCard.hint}
+            </p>
+          ) : null}
+          {backend?.builtin ? (
+            <p className="mt-1 text-sm text-[var(--oke-muted)]">
+              Every read, write, seal and rotate is recorded in a hash-chained audit log. Read it
+              with <code className="font-mono">oke vault audit</code>; verify the chain with{" "}
+              <code className="font-mono">oke vault audit verify</code>.
+            </p>
+          ) : null}
+        </section>
+      ) : null}
+
       <div className="flex min-h-0 flex-1">
         <section
           aria-label="Vault list"
@@ -289,7 +342,7 @@ export function VaultPanel() {
               <section aria-label="Readers">
                 <h3 className="mb-2 text-sm font-medium">Readers</h3>
                 <p className="text-sm text-[var(--oke-muted)]">
-                  Flows that declare <code className="font-mono">fx.vault({open.name})</code>
+                  Flows that declare <code className="font-mono">fx.vault.get({open.name})</code>
                 </p>
                 <ul className="mt-1 list-disc pl-5 font-mono text-sm">
                   {open.readers.length === 0 ? (

package/src/console/ui/vault/VaultA11yView.tsx

@@ -2,6 +2,7 @@
  * Static Vault markup for the axe gate — same landmarks as the live panel.
  */
 
+import { formatVaultBackend } from "./backend.ts";
 import { formatBlastRadius } from "./blast-radius.ts";
 import { VAULT_LIST_FIXTURE } from "./fixture.ts";
 import { groupByKind } from "./group.ts";
@@ -23,6 +24,8 @@ export function VaultA11yView(props: VaultA11yViewProps) {
   const open = VAULT_LIST_FIXTURE.secrets.find((s) => s.name === openName);
   const blast = open ? formatBlastRadius(open.blastRadius) : null;
   const env = VAULT_LIST_FIXTURE.env;
+  const backend = VAULT_LIST_FIXTURE.backend;
+  const backendCard = formatVaultBackend(backend);
 
   return (
     <div className="vault-a11y">
@@ -37,6 +40,35 @@ export function VaultA11yView(props: VaultA11yViewProps) {
         </label>
       </header>
       <main id="vault-main">
+        {backendCard ? (
+          <section aria-label="Vault backend">
+            <h2>{backendCard.title}</h2>
+            <p>{backendCard.description}</p>
+            <p>
+              {backendCard.badges.map((badge) => (
+                <span key={badge.id} role={badge.tone === "warn" ? "alert" : "status"}>
+                  {badge.label}{" "}
+                </span>
+              ))}
+            </p>
+            <dl>
+              {backendCard.facts.map((fact) => (
+                <div key={fact.label}>
+                  <dt>{fact.label}</dt>
+                  <dd>{fact.value}</dd>
+                </div>
+              ))}
+            </dl>
+            {backendCard.hint ? <p role="status">{backendCard.hint}</p> : null}
+            {backend?.builtin ? (
+              <p>
+                Audit trail is hash-chained in the backend — read it with `oke vault audit`, verify
+                it with `oke vault audit verify`.
+              </p>
+            ) : null}
+          </section>
+        ) : null}
+
         <section aria-label="Vault list">
           <h2>Contracts</h2>
           {groups.map((group) => (
@@ -111,7 +143,7 @@ export function VaultA11yView(props: VaultA11yViewProps) {
             <section aria-label="Readers">
               <h3>Readers</h3>
               <p>
-                Flows that declare fx.vault({open.name}): {open.readers.join(", ") || "none"}
+                Flows that declare fx.vault.get({open.name}): {open.readers.join(", ") || "none"}
               </p>
             </section>
 

package/src/console/ui/vault/backend.test.ts

@@ -0,0 +1,75 @@
+/**
+ * Vault backend status card — badges, facts, operator hint.
+ */
+
+import { describe, expect, test } from "bun:test";
+import { formatVaultBackend } from "./backend.ts";
+import { VAULT_BACKEND_FIXTURE } from "./fixture.ts";
+import type { VaultBackend } from "./types.ts";
+
+describe("formatVaultBackend", () => {
+  test("null backend renders no card", () => {
+    expect(formatVaultBackend(null)).toBeNull();
+  });
+
+  test("non-builtin driver shows the id with no seal badges", () => {
+    const card = formatVaultBackend({
+      driverId: "managed",
+      builtin: false,
+      status: null,
+      unavailable: null,
+    });
+    expect(card?.title).toBe("Backend managed");
+    expect(card?.badges).toEqual([]);
+    expect(card?.facts).toEqual([]);
+    expect(card?.hint).toBeNull();
+  });
+
+  test("sealed builtin backend warns and points at the master key", () => {
+    const card = formatVaultBackend(VAULT_BACKEND_FIXTURE);
+    expect(card?.badges.map((b) => b.id)).toEqual(["initialized", "sealed"]);
+    expect(card?.badges.find((b) => b.id === "sealed")?.tone).toBe("warn");
+    expect(card?.facts).toContainEqual({ label: "KEK generation", value: "v2" });
+    expect(card?.facts).toContainEqual({ label: "Secrets stored", value: "7" });
+    expect(card?.hint).toContain("OKE_VAULT_MASTER_KEY");
+  });
+
+  test("unsealed builtin backend has no hint", () => {
+    const backend: VaultBackend = {
+      ...VAULT_BACKEND_FIXTURE,
+      status: { ...VAULT_BACKEND_FIXTURE.status!, sealed: false },
+    };
+    const card = formatVaultBackend(backend);
+    expect(card?.badges.map((b) => b.id)).toEqual(["initialized", "unsealed"]);
+    expect(card?.hint).toBeNull();
+  });
+
+  test("uninitialized backend points at `oke vault init`", () => {
+    const backend: VaultBackend = {
+      ...VAULT_BACKEND_FIXTURE,
+      status: { ...VAULT_BACKEND_FIXTURE.status!, initialized: false },
+    };
+    const card = formatVaultBackend(backend);
+    expect(card?.badges.map((b) => b.id)).toEqual(["uninitialized"]);
+    expect(card?.hint).toContain("oke vault init");
+  });
+
+  test("an in-flight master rotation surfaces the rewrap target", () => {
+    const backend: VaultBackend = {
+      ...VAULT_BACKEND_FIXTURE,
+      status: { ...VAULT_BACKEND_FIXTURE.status!, rewrapTargetKekVersion: 3 },
+    };
+    expect(formatVaultBackend(backend)?.badges.map((b) => b.label)).toContain("rewrap → kek v3");
+  });
+
+  test("unreachable builtin backend surfaces the reason", () => {
+    const card = formatVaultBackend({
+      driverId: "vault",
+      builtin: true,
+      status: null,
+      unavailable: "connection refused",
+    });
+    expect(card?.badges.map((b) => b.id)).toEqual(["unreachable"]);
+    expect(card?.hint).toBe("connection refused");
+  });
+});

package/src/console/ui/vault/backend.ts

@@ -0,0 +1,117 @@
+/**
+ * Format the Vault backend status card (console §9.8).
+ *
+ * Only the built-in `vault` driver has a seal lifecycle; every other driver
+ * shows its id alone so the operator still knows which layer terminates the
+ * resolution chain.
+ */
+
+import type { VaultBackend } from "./types.ts";
+
+/** One badge in the status card. */
+export interface VaultBackendBadge {
+  /** Stable id for keys and tests. */
+  readonly id: string;
+  /** Short badge text. */
+  readonly label: string;
+  /** `warn` renders as an alert; `ok` and `neutral` are status text. */
+  readonly tone: "ok" | "warn" | "neutral";
+}
+
+/** Rendered status card. */
+export interface VaultBackendCard {
+  /** Driver id headline (`Backend vault`). */
+  readonly title: string;
+  /** One-line explanation of what that backend is. */
+  readonly description: string;
+  /** Seal / initialization badges — empty for non-builtin drivers. */
+  readonly badges: readonly VaultBackendBadge[];
+  /** `label: value` facts (KEK generation, secret count, …). */
+  readonly facts: readonly { readonly label: string; readonly value: string }[];
+  /** Operator next step, when one applies. */
+  readonly hint: string | null;
+}
+
+/** What each driver id means, in one line. */
+const DRIVER_DESCRIPTION: Readonly<Record<string, string>> = {
+  vault: "okengine's own store — encrypted at rest, sealed until unsealed with the master key",
+  env: "Environment layers only — process.env, .env.local, docker/.env.docker",
+  managed: "Managed KMS / provider secret store",
+  memory: "In-memory bag — test only, nothing survives restart",
+};
+
+/**
+ * Build the status card for a backend.
+ *
+ * @param backend - Server-reported backend, or `null` when unresolved
+ */
+export function formatVaultBackend(backend: VaultBackend | null): VaultBackendCard | null {
+  if (!backend) return null;
+
+  const title = `Backend ${backend.driverId}`;
+  const description = DRIVER_DESCRIPTION[backend.driverId] ?? "Custom vault backend";
+
+  if (!backend.builtin) {
+    return { title, description, badges: [], facts: [], hint: null };
+  }
+
+  const status = backend.status;
+  if (!status) {
+    return {
+      title,
+      description,
+      badges: [{ id: "unreachable", label: "status unavailable", tone: "warn" }],
+      facts: [],
+      hint: backend.unavailable ?? "Run `oke vault status` to inspect the backend directly",
+    };
+  }
+
+  if (!status.initialized) {
+    return {
+      title,
+      description,
+      badges: [{ id: "uninitialized", label: "not initialized", tone: "warn" }],
+      facts: [],
+      hint: "Run `oke vault init` to create the vault and print its master key once",
+    };
+  }
+
+  const badges: VaultBackendBadge[] = [
+    { id: "initialized", label: "initialized", tone: "ok" },
+    status.sealed
+      ? { id: "sealed", label: "sealed", tone: "warn" }
+      : { id: "unsealed", label: "unsealed", tone: "ok" },
+  ];
+  if (status.rewrapTargetKekVersion !== null) {
+    badges.push({
+      id: "rewrap",
+      label: `rewrap → kek v${status.rewrapTargetKekVersion}`,
+      tone: "warn",
+    });
+  }
+
+  const facts: { label: string; value: string }[] = [
+    { label: "KEK generation", value: `v${status.kekVersion}` },
+    { label: "Secrets stored", value: String(status.secretCount) },
+    { label: "Seal count", value: String(status.sealCount) },
+  ];
+  if (status.lastUnsealedAt !== null) {
+    facts.push({
+      label: "Last unsealed",
+      value: new Date(status.lastUnsealedAt).toISOString(),
+    });
+  }
+  if (status.lastSealedAt !== null) {
+    facts.push({ label: "Last sealed", value: new Date(status.lastSealedAt).toISOString() });
+  }
+
+  return {
+    title,
+    description,
+    badges,
+    facts,
+    hint: status.sealed
+      ? "This process holds no master key — export OKE_VAULT_MASTER_KEY or run `oke vault unseal`"
+      : null,
+  };
+}

package/src/console/ui/vault/fixture.ts

@@ -2,7 +2,7 @@
  * Vault panel fixture — fingerprints only; never real secret values.
  */
 
-import type { VaultListResponse, VaultRecord } from "./types.ts";
+import type { VaultBackend, VaultListResponse, VaultRecord } from "./types.ts";
 
 /** Fixture secret used only for leak-detection tests (never in panel rows). */
 export const FIXTURE_SECRET_VALUE = "sk_live_DO_NOT_LEAK_fixture";
@@ -68,8 +68,27 @@ export const VAULT_FIXTURE: readonly VaultRecord[] = [
   },
 ];
 
+/** Built-in backend, initialized and sealed in this process. */
+export const VAULT_BACKEND_FIXTURE: VaultBackend = {
+  driverId: "vault",
+  builtin: true,
+  status: {
+    initialized: true,
+    sealed: true,
+    masterKeyPresent: true,
+    kekVersion: 2,
+    secretCount: 7,
+    sealCount: 1,
+    lastSealedAt: 1_700_000_100_000,
+    lastUnsealedAt: 1_700_000_000_000,
+    rewrapTargetKekVersion: null,
+  },
+  unavailable: null,
+};
+
 /** List response matching `console.vault.list`. */
 export const VAULT_LIST_FIXTURE: VaultListResponse = {
   secrets: VAULT_FIXTURE,
-  env: "local",
+  env: "dev",
+  backend: VAULT_BACKEND_FIXTURE,
 };

package/src/console/ui/vault/index.ts

@@ -3,7 +3,10 @@
  */
 
 export type {
+  VaultBackend,
   VaultBlastRadius,
+  VaultBuiltinStatus,
+  VaultDriverId,
   VaultKindGroup,
   VaultListResponse,
   VaultRecord,
@@ -11,7 +14,14 @@ export type {
   VaultResolutionStep,
 } from "./types.ts";
 
-export { VAULT_FIXTURE, VAULT_LIST_FIXTURE, FIXTURE_SECRET_VALUE } from "./fixture.ts";
+export { formatVaultBackend, type VaultBackendBadge, type VaultBackendCard } from "./backend.ts";
+
+export {
+  VAULT_BACKEND_FIXTURE,
+  VAULT_FIXTURE,
+  VAULT_LIST_FIXTURE,
+  FIXTURE_SECRET_VALUE,
+} from "./fixture.ts";
 
 export {
   parseVaultSearch,

package/src/console/ui/vault/types.ts

@@ -43,10 +43,36 @@ export interface VaultRecord {
   readonly sharedFingerprintEnvs: readonly string[];
 }
 
+/** Vault backend driver id — matches `drivers.vault`. */
+export type VaultDriverId = "env" | "vault" | "managed" | "memory";
+
+/** Built-in Vault backend state (epoch-ms timestamps). */
+export interface VaultBuiltinStatus {
+  readonly initialized: boolean;
+  readonly sealed: boolean;
+  readonly masterKeyPresent: boolean;
+  readonly kekVersion: number;
+  readonly secretCount: number;
+  readonly sealCount: number;
+  readonly lastSealedAt: number | null;
+  readonly lastUnsealedAt: number | null;
+  readonly rewrapTargetKekVersion: number | null;
+}
+
+/** Backend serving the terminal layer of the resolution chain. */
+export interface VaultBackend {
+  readonly driverId: VaultDriverId;
+  readonly builtin: boolean;
+  readonly status: VaultBuiltinStatus | null;
+  readonly unavailable: string | null;
+}
+
 /** `console.vault.list` response. */
 export interface VaultListResponse {
   readonly secrets: readonly VaultRecord[];
   readonly env: string;
+  /** `null` when the server could not resolve a backend. */
+  readonly backend: VaultBackend | null;
 }
 
 /** Grouped list section (secrets vs config). */