@north-light/crouter 0.3.198 → 0.3.199

package/dist/pages/bundle.js

@@ -1,1778 +0,0 @@
-"use strict";(()=>{function L(n){return n!==void 0}function W(n){switch(n.kind){case"whole":return"whole";case"option":return`option:${n.optionId}`;case"row":return`row:${n.rowId}`;case"column":return`column:${n.columnId}`;case"card":return`card:${n.cardId}`;case"range":return`range:${n.start}:${n.end}`}}function y(n,t){let e=W(t);return n.find(r=>W(r.anchor)===e)}function z(n,t,e){let r=W(t),o=n.filter(s=>W(s.anchor)!==r),a=e.trim();if(a==="")return o;let i=n.find(s=>W(s.anchor)===r);return[...o,{id:i?.id??se(),anchor:t,text:a}]}var et=0;function ie(n){if(typeof n!="object"||n===null)return!1;let t=n;switch(t.kind){case"whole":return!0;case"option":return typeof t.optionId=="string";case"row":return typeof t.rowId=="string";case"column":return typeof t.columnId=="string";case"card":return typeof t.cardId=="string";case"range":return typeof t.start=="number"&&typeof t.end=="number"&&typeof t.quote=="string";default:return!1}}function O(n){if(!Array.isArray(n))return[];let t=[];for(let e of n){if(typeof e!="object"||e===null)continue;let{id:r,anchor:o,text:a}=e;if(typeof r!="string"||r===""||typeof a!="string"||a.trim()===""||!ie(o)||y(t,o)!==void 0)continue;t.push({id:r,anchor:{...o},text:a});let i=/^c(\d+)$/.exec(r);i!==null&&(et=Math.max(et,Number(i[1])))}return t}function se(){return et+=1,`c${et}`}var ce=84,le=48,de=30;function he(n){let t=n.lastIndexOf(" ");return(t>0&&t>=n.length-12?n.slice(0,t):n).trimEnd()}function me(n){let t=n.indexOf(" ");return(t!==-1&&t<12?n.slice(t+1):n).trimStart()}function Ht(n){let t=n.replace(/\s+/gu," ").trim();return t.length<=ce?t:`${he(t.slice(0,le))} \u2026 ${me(t.slice(-de))}`}function st(n){switch(n.kind){case"whole":return"this";case"range":return`\u201C${n.quote}\u201D`;default:return W(n)}}var zt=`url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E")`,Ot=`url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E")`;function x(n,t=""){return n.map(e=>`${e}${t}`).join(`,
-  `)}function ct(n){let t=n[0];return typeof t=="object"?[t.scope,n.slice(1)]:[null,n]}function I(n,t,e){return(r,o)=>{let a=`var(--crtr-${t}-${r}, ${o})`;return n===null?a:`var(--crtr-${e===""?`${n}-${r}`:`${n}-${e}-${r}`}, ${a})`}}function lt(n){let t=I(n,"control-focus","focus"),e=t("ring-width","0.1875rem"),r=t("ring-color","color-mix(in srgb, var(--crtr-color-focus, CanvasText) 25%, transparent)");return`
-    outline: ${t("outline","none")};
-    border-color: ${t("border-color","color-mix(in srgb, var(--crtr-color-focus, CanvasText) 60%, transparent)")};
-    box-shadow: ${t("ring",`0 0 0 ${e}
-      ${r}`)};`}function u(...n){let[t,e]=ct(n);return`
-  ${x(e,":focus-visible")} {${lt(t)}
-  }
-`}function S(...n){let[t,e]=ct(n),r=I(t,"control-writing",""),a=I(t,"control","")("transition","120ms ease");return`
-  ${x(e)} {
-    /* Block, not the UA's inline-block: a full-width field on its own line would otherwise sit
-       in a line box and carry a descender's worth of dead space under it. */
-    display: block;
-    box-sizing: border-box;
-    width: 100%;
-    padding: ${r("padding","var(--crtr-space-2) var(--crtr-space-3)")};
-    color: ${r("text-color","var(--crtr-color-text, CanvasText)")};
-    font: ${r("font","inherit")};
-    line-height: ${r("line-height","var(--crtr-line-height, 1.5)")};
-    background: ${r("fill","color-mix(in srgb, var(--crtr-color-text, CanvasText) 2%, var(--crtr-color-background, Canvas))")};
-    border: ${r("border-width","1px")} ${r("border-style","solid")} ${r("border-color","var(--crtr-color-border, CanvasText)")};
-    border-radius: ${r("radius","var(--crtr-radius-small)")};
-    box-shadow: ${r("shadow","var(--crtr-shadow)")};
-    transition: border-color ${a}, box-shadow ${a};
-  }
-
-  ${x(e,"::placeholder")} {
-    color: ${r("placeholder-color","var(--crtr-color-text-muted, GrayText)")};
-  }
-
-  ${x(e,":focus-visible")} {${lt(t)}
-  }
-
-  /* A page that can no longer take an answer keeps its text selectable and copyable, and drops
-     the affordances that say it could still be rewritten. */
-  ${x(e,":read-only")} {
-    background: ${r("readonly-fill","var(--crtr-color-surface, Canvas)")};
-    box-shadow: ${r("readonly-shadow","none")};
-    resize: none;
-  }
-`}function F(...n){let[t,e]=ct(n),r=I(t,"control-box",""),o=I(t,"control-mark","mark"),a=I(t,"control-radio","radio"),i=I(t,"control-checkbox","checkbox"),s=I(t,"control",""),c=s("transition","120ms ease");return`
-  ${x(e)} {
-    /* The box tracks the host's font token like every other size in the bundle. The kit's
-       control is 16px against 14px text; these ratios are that pair, kept proportional. */
-    --control-box: ${r("size","1.125em")};
-    appearance: none;
-    -webkit-appearance: none;
-    box-sizing: border-box;
-    display: inline-grid;
-    place-content: center;
-    flex: none;
-    width: var(--control-box);
-    height: var(--control-box);
-    margin: 0;
-    padding: 0;
-    vertical-align: middle;
-    /* Transparent rather than the background token, so an empty control on a selected row
-       carries that row's tint the way the kit's does. */
-    background: ${r("fill","transparent")};
-    border: ${r("border-width","1px")} ${r("border-style","solid")} ${r("border-color","var(--crtr-color-border, CanvasText)")};
-    border-radius: ${r("radius","calc(var(--control-box) * 0.25)")};
-    box-shadow: ${r("shadow","var(--crtr-shadow)")};
-    cursor: pointer;
-    transition: background-color ${c}, border-color ${c}, box-shadow ${c};
-  }
-
-  ${x(e,'[type="radio"]')} {
-    border-radius: ${a("radius","50%")};
-  }
-
-  /* The mark. It is always present and always centred; selecting scales it in, which is the
-     state change the kit animates too. */
-  ${x(e,"::before")} {
-    content: "";
-    background: ${o("fill","currentColor")};
-    transform: scale(0);
-    transition: transform ${c};
-  }
-
-  ${x(e,":checked::before")},
-  ${x(e,":indeterminate::before")} {
-    transform: scale(1);
-  }
-
-  /* A radio keeps its own surface and marks itself with a dot in the accent; a checkbox fills
-     with the accent and carries the tick in the accent's contrast colour. */
-  ${x(e,'[type="radio"]::before')} {
-    width: ${a("mark-size","calc(var(--control-box) * 0.5)")};
-    height: ${a("mark-size","calc(var(--control-box) * 0.5)")};
-    border-radius: ${a("mark-radius","50%")};
-    color: ${a("mark-color","var(--crtr-color-accent, CanvasText)")};
-  }
-
-  ${x(e,'[type="radio"]:checked')} {
-    border-color: ${a("checked-border-color","var(--crtr-color-accent, CanvasText)")};
-  }
-
-  ${x(e,'[type="checkbox"]::before')} {
-    width: ${i("mark-size","calc(var(--control-box) * 0.875)")};
-    height: ${i("mark-size","calc(var(--control-box) * 0.875)")};
-    color: ${i("mark-color","var(--crtr-color-accent-contrast, Canvas)")};
-    -webkit-mask: ${i("mark-image",zt)} ${i("mark-layout","center / contain no-repeat")};
-    mask: ${i("mark-image",zt)} ${i("mark-layout","center / contain no-repeat")};
-  }
-
-  ${x(e,'[type="checkbox"]:indeterminate::before')} {
-    -webkit-mask-image: ${i("indeterminate-mark-image",Ot)};
-    mask-image: ${i("indeterminate-mark-image",Ot)};
-  }
-
-  ${x(e,'[type="checkbox"]:checked')},
-  ${x(e,'[type="checkbox"]:indeterminate')} {
-    background: ${i("checked-fill","var(--crtr-color-accent, CanvasText)")};
-    border-color: ${i("checked-border-color","var(--crtr-color-accent, CanvasText)")};
-  }
-
-  /* The bundle's one focus treatment. The box scales with the font token, but the ring does
-     not: the kit's is a flat three pixels on a checkbox and on the field beside it alike. */
-  ${x(e,"[type]:focus-visible")} {${lt(t)}
-  }
-
-  /* A page that can no longer take an answer keeps its selection legible \u2014 the mark stays the
-     accent, only dimmed \u2014 and drops every affordance that says it could still be changed. */
-  ${x(e,":disabled")} {
-    opacity: ${s("disabled-opacity","0.5")};
-    box-shadow: ${s("disabled-shadow","none")};
-    cursor: default;
-  }
-`}function dt(){return typeof window>"u"?void 0:window.crtr}function pe(n){if(n instanceof Error&&n.message!=="")return n.message;let t=String(n);return t===""?"unknown error":t}function ue(n){return{status:"unavailable",reason:`host bridge does not provide ${n}()`}}function M(n,t){let e=dt();if(typeof e?.respond!="function")return ue("respond");try{return e.respond(n,t),{status:"ok"}}catch(r){return{status:"failed",reason:pe(r)}}}function N(n){let t=dt();if(typeof t?.savedResponse=="function")try{let e=t.savedResponse(n);return typeof e=="object"&&e!==null&&!Array.isArray(e)?e:void 0}catch{return}}function q(n){return Array.isArray(n)?n.filter(t=>typeof t=="string"):[]}async function It(n,t,e){let r=dt();if(typeof r?.mountWorkspaceComponent!="function")return"unavailable";try{return await r.mountWorkspaceComponent(n,t,e)}catch{return"unavailable"}}function f(n){return n.closest("[inert], crtr-pages[disabled]")!==null}function j(n,t){for(let e of n.querySelectorAll("input"))e.disabled=t;for(let e of n.querySelectorAll("textarea"))e.readOnly=t}function w(n,t){customElements.define(n,t)}var ht=new Map;function B(n,t,e){ht.set(t,{element:n,read:e})}function Nt(){for(let[n,t]of[...ht]){if(!t.element.isConnected){ht.delete(n);continue}let e;try{e=t.read()}catch{continue}M(n,e)}}function T(n){let t=n.querySelector('script[type="application/json"]');if(t===null)return{status:"invalid",reason:"slot has no application/json config"};let e=t.textContent??"";if(e.trim()==="")return{status:"invalid",reason:"slot config is empty"};let r;try{r=JSON.parse(e)}catch(o){return{status:"invalid",reason:`slot config is not valid JSON: ${o instanceof Error&&o.message!==""?o.message:"invalid JSON"}`}}return typeof r!="object"||r===null||Array.isArray(r)?{status:"invalid",reason:"slot config must be a JSON object"}:{status:"ok",config:r}}function D(n){let t=n.getAttribute("slot-id")?.trim();return t===void 0||t===""?void 0:t}var ve='<svg viewBox="0 0 16 16" aria-hidden="true" focusable="false"><path d="M2.5 3.5h11v7h-6l-3 2.5v-2.5h-2z"/><path d="M8 5.5v3M6.5 7h3"/></svg>',fe='<svg viewBox="0 0 16 16" aria-hidden="true" focusable="false"><path d="M2.5 3.5h11v7h-6l-3 2.5v-2.5h-2z"/><path d="M5 6.25h6M5 8.25h4"/></svg>',jt=`
-  :host {
-    display: block;
-  }
-
-  [part="container"] {
-    display: grid;
-    gap: var(--crtr-options-container-gap, var(--crtr-space-3));
-  }
-
-  /* The question reads as the agent's own prose above its control, matching the table's
-     caption rather than shouting over the options it introduces. */
-  [part="label"] {
-    margin: var(--crtr-options-label-margin, 0);
-    color: var(--crtr-options-label-text-color, var(--crtr-color-text-muted));
-  }
-
-  [part="list"] {
-    display: grid;
-    gap: var(--crtr-options-list-gap, var(--crtr-space-2));
-  }
-
-  [part="option"] {
-    position: relative;
-    display: flex;
-    align-items: flex-start;
-    gap: var(--crtr-options-option-gap, var(--crtr-space-3));
-    padding: var(--crtr-options-option-padding, var(--crtr-space-2) var(--crtr-space-3));
-    background: var(--crtr-options-option-fill, var(--crtr-color-surface));
-    border: var(--crtr-options-option-border-width, 1px)
-      var(--crtr-options-option-border-style, solid)
-      var(--crtr-options-option-border-color, var(--crtr-color-border));
-    border-radius: var(--crtr-options-option-radius, var(--crtr-radius-medium));
-    transition: background-color var(--crtr-options-option-transition, 120ms ease),
-      border-color var(--crtr-options-option-transition, 120ms ease);
-  }
-
-  [part="option"]:hover,
-  [part="option"][data-active="true"] {
-    background: var(--crtr-options-option-hover-fill, var(--crtr-color-surface-hover));
-  }
-
-  [part="option"][data-selected="true"] {
-    border-color: var(
-      --crtr-options-option-selected-border-color,
-      color-mix(in srgb, var(--crtr-color-accent) 45%, transparent)
-    );
-    background: var(
-      --crtr-options-option-selected-fill,
-      color-mix(in srgb, var(--crtr-color-accent) 10%, transparent)
-    );
-  }
-
-  [part="option"][data-selected="true"]:hover,
-  [part="option"][data-selected="true"][data-active="true"] {
-    background: var(
-      --crtr-options-option-selected-hover-fill,
-      color-mix(in srgb, var(--crtr-color-accent) 14%, transparent)
-    );
-  }
-
-  /* A page that can no longer take an answer keeps its selection legible and drops every
-     affordance that says it could still be changed. */
-  [part="option"]:has([part="option-control"]:disabled) [part="option-label"] {
-    cursor: default;
-  }
-
-  [part="option-label"] {
-    display: flex;
-    flex: 1;
-    align-items: flex-start;
-    gap: var(--crtr-options-option-label-gap, var(--crtr-space-3));
-    cursor: pointer;
-  }
-
-  ${F({scope:"options-option-control"},'[part="option-control"]')}
-
-  /* Centred on the first line of the label rather than on its box, so a two-line option keeps
-     the control beside the title. Half the difference between a 1.5 line box and the control. */
-  [part="option-control"] {
-    margin-top: var(--crtr-options-option-control-offset, 0.1875em);
-  }
-
-  [part="option-text"] {
-    display: grid;
-    gap: var(--crtr-options-option-text-gap, var(--crtr-space-1));
-  }
-
-  [part="option-title"] {
-    font-weight: var(--crtr-options-option-title-font-weight, 500);
-  }
-
-  [part="option-description"] {
-    color: var(--crtr-options-option-description-text-color, var(--crtr-color-text-muted));
-    font-size: var(--crtr-options-option-description-font-size, 0.875em);
-  }
-
-  /* The trigger stays in the row's anatomy while quiet, then its state rule below reveals it.
-     A host can choose how quiet and how bright those states are independently; the transition
-     remains one knob because all three properties are one reveal. */
-  [part="comment"] {
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    flex: none;
-    width: var(--crtr-options-comment-size, 1.5em);
-    height: var(--crtr-options-comment-size, 1.5em);
-    padding: var(--crtr-options-comment-padding, 0);
-    color: var(--crtr-options-comment-text-color, var(--crtr-color-text-muted));
-    background: var(--crtr-options-comment-fill, transparent);
-    border: var(--crtr-options-comment-border-width, 1px)
-      var(--crtr-options-comment-border-style, solid)
-      var(--crtr-options-comment-border-color, transparent);
-    border-radius: var(--crtr-options-comment-radius, var(--crtr-radius-small));
-    opacity: var(--crtr-options-comment-opacity, 0);
-    cursor: pointer;
-    transition: opacity var(--crtr-options-comment-transition, var(--crtr-control-transition, 120ms ease)),
-      color var(--crtr-options-comment-transition, var(--crtr-control-transition, 120ms ease)),
-      background-color var(--crtr-options-comment-transition, var(--crtr-control-transition, 120ms ease));
-  }
-
-  [part="option"]:hover [part="comment"],
-  [part="option"][data-active="true"] [part="comment"],
-  [part="option"]:focus-within [part="comment"],
-  [part="comment"][data-state="commented"],
-  [part="comment"][aria-expanded="true"] {
-    opacity: var(--crtr-options-comment-visible-opacity, 1);
-  }
-
-  [part="comment"]:hover {
-    background: var(--crtr-options-comment-hover-fill, var(--crtr-color-surface-hover));
-    border-color: var(--crtr-options-comment-hover-border-color, var(--crtr-color-border));
-  }
-
-${u({scope:"options-comment"},'[part="comment"]')}
-  [part="comment"][data-state="commented"] {
-    color: var(--crtr-options-comment-commented-text-color, var(--crtr-color-accent));
-  }
-
-  [part="comment"] svg {
-    width: var(--crtr-options-comment-icon-size, 0.875em);
-    height: var(--crtr-options-comment-icon-size, 0.875em);
-    fill: var(--crtr-options-comment-icon-fill, none);
-    stroke: var(--crtr-options-comment-icon-stroke-color, currentColor);
-    stroke-width: var(--crtr-options-comment-icon-stroke-width, 1.25);
-    stroke-linecap: var(--crtr-options-comment-icon-stroke-cap, round);
-    stroke-linejoin: var(--crtr-options-comment-icon-stroke-join, round);
-  }
-
-  [part="comment-popover"] {
-    position: absolute;
-    top: calc(100% + var(--crtr-options-comment-popover-offset, var(--crtr-space-1)));
-    right: 0;
-    z-index: 2;
-    display: grid;
-    gap: var(--crtr-options-comment-popover-gap, var(--crtr-space-2));
-    width: var(--crtr-options-comment-popover-width, min(20em, 100%));
-    padding: var(--crtr-options-comment-popover-padding, var(--crtr-space-3));
-    background: var(--crtr-options-comment-popover-fill, var(--crtr-color-background));
-    border: var(--crtr-options-comment-popover-border-width, 1px)
-      var(--crtr-options-comment-popover-border-style, solid)
-      var(--crtr-options-comment-popover-border-color, var(--crtr-color-border));
-    border-radius: var(--crtr-options-comment-popover-radius, var(--crtr-radius-medium));
-    box-shadow: var(--crtr-options-comment-popover-shadow, var(--crtr-shadow));
-  }
-
-  [part="comment-popover"][hidden] {
-    display: none;
-  }
-
-  /* The popover's own prose, in the page's voice \u2014 not a caps-mono field label shouting an
-     option id at someone who just clicked that option. */
-  [part="comment-subject"] {
-    margin: var(--crtr-options-comment-subject-margin, 0);
-    color: var(--crtr-options-comment-subject-text-color, var(--crtr-color-text-muted));
-    font-size: var(--crtr-options-comment-subject-font-size, 0.875em);
-  }
-
-  /* Two calls rather than one selector list: a comment box and the freetext box are two things
-     a person can point at, so each takes its own scope. They still share the family layer
-     underneath, so they cannot drift apart unless a host parts them on purpose. */
-${S({scope:"options-comment-input"},'[part="comment-input"]')}
-${S({scope:"options-freetext-input"},'[part="freetext-input"]')}
-  [part="comment-input"] {
-    min-height: var(--crtr-options-comment-input-min-height, 4.5em);
-    resize: vertical;
-  }
-
-  [part="freetext-input"] {
-    min-height: var(--crtr-options-freetext-input-min-height, 4em);
-    resize: vertical;
-  }
-
-  [part="comment-actions"] {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    gap: var(--crtr-options-comment-actions-gap, var(--crtr-space-2));
-  }
-
-  [part="comment-hint"] {
-    color: var(--crtr-options-comment-hint-text-color, var(--crtr-color-text-muted));
-    font-size: var(--crtr-options-comment-hint-font-size, 0.875em);
-  }
-
-  /* The two buttons are one shape drawn twice rather than one rule serving two parts, because
-     a scope that named both would make "the cancel button's fill" unsayable. */
-  [part="comment-cancel"] {
-    padding: var(--crtr-options-comment-cancel-padding, var(--crtr-space-1) var(--crtr-space-2));
-    font: var(--crtr-options-comment-cancel-font, inherit);
-    font-size: var(--crtr-options-comment-cancel-font-size, 0.875em);
-    color: var(--crtr-options-comment-cancel-text-color, var(--crtr-color-text-muted));
-    background: var(--crtr-options-comment-cancel-fill, transparent);
-    border: var(--crtr-options-comment-cancel-border-width, 1px)
-      var(--crtr-options-comment-cancel-border-style, solid)
-      var(--crtr-options-comment-cancel-border-color, transparent);
-    border-radius: var(--crtr-options-comment-cancel-radius, var(--crtr-radius-small));
-    cursor: pointer;
-    transition: color var(--crtr-options-comment-cancel-transition, var(--crtr-control-transition, 120ms ease)),
-      background-color var(--crtr-options-comment-cancel-transition, var(--crtr-control-transition, 120ms ease)),
-      border-color var(--crtr-options-comment-cancel-transition, var(--crtr-control-transition, 120ms ease));
-  }
-
-  [part="comment-cancel"]:hover {
-    color: var(--crtr-options-comment-cancel-hover-text-color, var(--crtr-color-text));
-    background: var(--crtr-options-comment-cancel-hover-fill, var(--crtr-color-surface-hover));
-  }
-
-  [part="comment-save"] {
-    padding: var(--crtr-options-comment-save-padding, var(--crtr-space-1) var(--crtr-space-2));
-    font: var(--crtr-options-comment-save-font, inherit);
-    font-size: var(--crtr-options-comment-save-font-size, 0.875em);
-    color: var(--crtr-options-comment-save-text-color, var(--crtr-color-accent-contrast));
-    background: var(--crtr-options-comment-save-fill, var(--crtr-color-accent));
-    border: var(--crtr-options-comment-save-border-width, 1px)
-      var(--crtr-options-comment-save-border-style, solid)
-      var(--crtr-options-comment-save-border-color, var(--crtr-color-accent));
-    border-radius: var(--crtr-options-comment-save-radius, var(--crtr-radius-small));
-    cursor: pointer;
-    transition: color var(--crtr-options-comment-save-transition, var(--crtr-control-transition, 120ms ease)),
-      background-color var(--crtr-options-comment-save-transition, var(--crtr-control-transition, 120ms ease)),
-      border-color var(--crtr-options-comment-save-transition, var(--crtr-control-transition, 120ms ease));
-  }
-
-  /* Mixing the accent toward the text colour darkens on a light token set and lightens on a
-     dark one \u2014 a brightness filter moves the wrong way on one of them. */
-  [part="comment-save"]:hover {
-    background: var(
-      --crtr-options-comment-save-hover-fill,
-      color-mix(in srgb, var(--crtr-color-accent) 88%, var(--crtr-color-text))
-    );
-    border-color: var(
-      --crtr-options-comment-save-hover-border-color,
-      color-mix(in srgb, var(--crtr-color-accent) 88%, var(--crtr-color-text))
-    );
-  }
-
-${u({scope:"options-comment-cancel"},'[part="comment-cancel"]')}
-${u({scope:"options-comment-save"},'[part="comment-save"]')}
-  [part="freetext"] {
-    display: grid;
-    gap: var(--crtr-options-freetext-gap, var(--crtr-space-1));
-  }
-
-  [part="freetext-label"] {
-    color: var(--crtr-options-freetext-label-text-color, var(--crtr-color-text-muted));
-    font-size: var(--crtr-options-freetext-label-font-size, 0.875em);
-  }
-
-  [part="unavailable"] {
-    padding: var(--crtr-options-unavailable-padding, var(--crtr-space-3));
-    color: var(--crtr-options-unavailable-text-color, var(--crtr-color-text-muted));
-    background: var(--crtr-options-unavailable-fill, var(--crtr-color-surface));
-    border: var(--crtr-options-unavailable-border-width, 1px)
-      var(--crtr-options-unavailable-border-style, solid)
-      var(--crtr-options-unavailable-border-color, var(--crtr-color-border));
-    border-radius: var(--crtr-options-unavailable-radius, var(--crtr-radius-medium));
-  }
-
-  [part="reason"] {
-    color: var(--crtr-options-reason-text-color, var(--crtr-color-text));
-    font-family: var(--crtr-options-reason-font-family, var(--crtr-font-mono));
-  }
-`,Bt="prompt-label",Dt=0;function ge(n){return n instanceof HTMLTextAreaElement||n instanceof HTMLElement&&n.isContentEditable?!0:n instanceof HTMLInputElement?n.type!=="checkbox"&&n.type!=="radio":!1}var pt=class extends HTMLElement{static observedAttributes=["inert"];#o;#i;#a;#n=new Map;#e=[];#r=[];#t=[];#h;#c;#s;#l=!1;constructor(){super(),this.#o=this.attachShadow({mode:"open"})}connectedCallback(){if(this.#l)return;this.#l=!0,this.#a=D(this);let t=T(this);if(t.status!=="ok"){this.#m(t.reason);return}let e=t.config;if(!Array.isArray(e.options)||e.options.length===0){this.#m("options config lists no options");return}this.#i=e,this.#e=e.options.map(r=>r.id),this.#u(e),this.#a!==void 0&&B(this,this.#a,()=>this.#x()),this.#E(e),this.#v()}disconnectedCallback(){document.removeEventListener("pointerdown",this.#f,!0)}attributeChangedCallback(){this.isConnected&&this.#d()}#d(){let t=f(this);j(this.#o,t),t&&this.#s!==void 0&&this.#w(!1)}#u(t){if(this.#a===void 0)return;let e=N(this.#a);if(e===void 0)return;let r=q(e.selectedOptionIds);this.#r=this.#e.filter(o=>r.includes(o)),t.mode==="single"&&(this.#r=this.#r.slice(0,1)),this.#t=O(e.comments).filter(o=>o.anchor.kind!=="option"||this.#e.includes(o.anchor.optionId)),t.allowFreetext===!0&&typeof e.freetext=="string"&&e.freetext!==""&&(this.#h=e.freetext)}#m(t){let e=document.createElement("style");e.textContent=jt;let r=document.createElement("div");r.part.add("unavailable"),r.setAttribute("role","status");let o=document.createElement("span");o.part.add("reason"),o.textContent=t,r.append("Options unavailable: ",o),this.#o.replaceChildren(e,r)}#E(t){let e=document.createElement("style");e.textContent=jt;let r=document.createElement("div");r.part.add("container");let o=t.label!==void 0&&t.label!=="";if(o){let s=document.createElement("p");s.part.add("label"),s.id=Bt,s.textContent=t.label??"",r.append(s)}let a=document.createElement("div");a.part.add("list"),t.mode==="single"?a.setAttribute("role","radiogroup"):o&&a.setAttribute("role","group"),o&&a.setAttribute("aria-labelledby",Bt),Dt+=1;let i=`crtr-options-${Dt}`;for(let s of t.options)a.append(this.#L(t,s,i));r.append(a),t.allowFreetext===!0&&r.append(this.#p(t)),r.addEventListener("keydown",s=>this.#T(s)),this.#o.replaceChildren(e,r)}#L(t,e,r){let o=document.createElement("div");o.part.add("option"),o.dataset.optionId=e.id;let a=document.createElement("label");a.part.add("option-label");let i=document.createElement("input");i.part.add("option-control"),i.type=t.mode==="single"?"radio":"checkbox",i.name=r,i.value=e.id,i.addEventListener("change",()=>this.#S(e.id,i.checked)),i.addEventListener("focus",()=>this.#b(e.id));let s=document.createElement("span");s.part.add("option-text");let c=document.createElement("span");if(c.part.add("option-title"),c.textContent=e.label,s.append(c),e.description!==void 0&&e.description!==""){let h=document.createElement("span");h.part.add("option-description"),h.textContent=e.description,s.append(h)}a.append(i,s);let l=L(this.#a)?this.#g(e):void 0;return o.append(a),l!==void 0&&o.append(l.trigger,l.popover),o.addEventListener("mouseenter",()=>this.#b(e.id)),o.addEventListener("mouseleave",()=>this.#y(e.id)),this.#n.set(e.id,{id:e.id,label:e.label,root:o,control:i,...l===void 0?{}:{comment:l}}),o}#g(t){let e=document.createElement("button");e.part.add("comment"),e.type="button",e.setAttribute("aria-haspopup","dialog"),e.addEventListener("click",()=>{this.#s===t.id?this.#w():this.#A(t.id)});let r=document.createElement("div");r.part.add("comment-popover"),r.setAttribute("role","dialog"),r.hidden=!0;let o=document.createElement("p");o.part.add("comment-subject"),o.textContent=`Comment on ${t.label}`,r.setAttribute("aria-label",o.textContent);let a=document.createElement("textarea");a.part.add("comment-input"),a.placeholder="What should the agent know about this?",a.addEventListener("keydown",g=>{if(g.key==="Enter"&&(g.metaKey||g.ctrlKey)){g.preventDefault(),this.#C(t.id);return}g.key==="Escape"&&(g.preventDefault(),this.#w())});let i=document.createElement("div");i.part.add("comment-actions");let s=document.createElement("span");s.part.add("comment-hint");let c=document.createElement("span"),l=document.createElement("button");l.part.add("comment-cancel"),l.type="button",l.textContent="Cancel",l.addEventListener("click",()=>this.#w());let h=document.createElement("button");return h.part.add("comment-save"),h.type="button",h.textContent="Save",h.addEventListener("click",()=>this.#C(t.id)),c.append(l,h),i.append(s,c),r.append(o,a,i),{trigger:e,popover:r,input:a,hint:s}}#p(t){let e=document.createElement("label");e.part.add("freetext");let r=document.createElement("span");r.part.add("freetext-label"),r.textContent=t.freetextLabel??"Something else";let o=document.createElement("textarea");return o.part.add("freetext-input"),o.placeholder=t.freetextPlaceholder??"Answer in your own words\u2026",this.#h!==void 0&&(o.value=this.#h),o.addEventListener("input",()=>{this.#h=o.value===""?void 0:o.value,this.#k()}),e.append(r,o),e}#T(t){if(t.metaKey||t.ctrlKey||t.altKey||ge(t.target))return;let e=t.key.toLowerCase(),r=this.#c??this.#r.at(-1)??this.#e[0];if(r!==void 0){if(e==="j"||e==="k"){t.preventDefault();let o=Math.max(0,this.#e.indexOf(r)),a=e==="j"?1:-1,i=this.#e[(o+a+this.#e.length)%this.#e.length];this.#b(i),this.#n.get(i)?.control.focus();return}if(e==="x"){t.preventDefault();let o=this.#r.includes(r);this.#S(r,this.#i?.mode==="single"?!0:!o);return}e==="c"&&(t.preventDefault(),this.#A(r))}}#b(t){this.#c!==t&&(this.#c=t,this.#v())}#y(t){this.#c===t&&(this.#c=void 0,this.#v())}#S(t,e){if(!(this.#i===void 0||f(this))){if(this.#i.mode==="single")this.#r=[t];else{let r=e?[...this.#r,t]:this.#r.filter(o=>o!==t);this.#r=this.#e.filter(o=>r.includes(o))}this.#b(t),this.#v(),this.#k()}}#f=t=>{if(this.#s===void 0)return;let e=this.#n.get(this.#s)?.comment;if(e===void 0)return;let r=t.composedPath();r.includes(e.popover)||r.includes(e.trigger)||this.#w(!1)};#A(t){let e=this.#n.get(t)?.comment;e===void 0||f(this)||(this.#s===void 0&&document.addEventListener("pointerdown",this.#f,!0),this.#s=t,this.#c=t,e.input.value=y(this.#t,mt(t))?.text??"",this.#v(),e.input.focus())}#w(t=!0){if(this.#s===void 0)return;let e=this.#n.get(this.#s)?.comment;this.#s=void 0,document.removeEventListener("pointerdown",this.#f,!0),this.#v(),t&&e?.trigger.focus()}#C(t){let e=this.#n.get(t)?.comment;e===void 0||f(this)||(this.#t=z(this.#t,mt(t),e.input.value),this.#w(),this.#k())}#v(){for(let t of this.#n.values()){let e=this.#r.includes(t.id);t.control.checked=e,t.root.dataset.selected=String(e),t.root.dataset.active=String(this.#c===t.id);let r=t.comment;if(r===void 0)continue;let o=y(this.#t,mt(t.id));r.trigger.dataset.state=o===void 0?"empty":"commented",r.trigger.innerHTML=o===void 0?ve:fe,r.trigger.setAttribute("aria-label",o===void 0?`Comment on ${t.label}`:`Edit comment on ${t.label}`);let a=this.#s===t.id;r.trigger.setAttribute("aria-expanded",String(a)),r.popover.hidden=!a,r.hint.textContent=o===void 0?"\u2318\u21B5 to save":"empty to delete"}this.#d()}#x(){let t={selectedOptionIds:[...this.#r],comments:this.#t.map(e=>({...e}))};return this.#i?.allowFreetext===!0&&this.#h!==void 0&&(t.freetext=this.#h),t}#k(){this.#a!==void 0&&M(this.#a,this.#x())}};function mt(n){return{kind:"option",optionId:n}}w("crtr-options",pt);var ut={kind:"whole"},U="the whole passage",J="the selected text",rt=6,Ft="comment-popover",Pt="prompt-label",be=`
-  :host {
-    display: block;
-  }
-
-  [part="container"] {
-    position: relative;
-    display: grid;
-    gap: var(--crtr-text-container-gap, var(--crtr-space-2));
-  }
-
-  /* The prompt reads as the agent's own prose above the passage, matching the table's
-     caption rather than shouting over the text it introduces. */
-  [part="label"] {
-    margin: var(--crtr-text-label-margin, 0);
-    color: var(--crtr-text-label-text-color, var(--crtr-color-text-muted));
-  }
-
-  [part="toolbar"] {
-    display: flex;
-    flex-wrap: wrap;
-    align-items: center;
-    justify-content: flex-end;
-    gap: var(--crtr-text-toolbar-gap, var(--crtr-space-2));
-  }
-
-  [part="edited"] {
-    padding: var(--crtr-text-edited-padding, 0 var(--crtr-space-2));
-    color: var(--crtr-text-edited-text-color, var(--crtr-color-accent));
-    background: var(--crtr-text-edited-fill, color-mix(in srgb, var(--crtr-color-accent) 14%, transparent));
-    border-radius: var(--crtr-text-edited-radius, var(--crtr-radius-small));
-    font-family: var(--crtr-text-edited-font-family, var(--crtr-font-mono));
-    font-size: var(--crtr-text-edited-font-size, 0.75em);
-    letter-spacing: var(--crtr-text-edited-letter-spacing, 0.06em);
-    line-height: var(--crtr-text-edited-line-height, 1.7);
-    text-transform: var(--crtr-text-edited-text-transform, uppercase);
-  }
-
-  button {
-    display: inline-flex;
-    align-items: center;
-    gap: var(--crtr-text-button-gap, var(--crtr-space-1));
-    max-width: var(--crtr-text-button-max-width, 100%);
-    padding: var(--crtr-text-button-padding, var(--crtr-space-1) var(--crtr-space-2));
-    color: var(--crtr-text-button-text-color, var(--crtr-color-text-muted));
-    font: var(--crtr-text-button-font, inherit);
-    background: var(--crtr-text-button-fill, transparent);
-    border: var(--crtr-text-button-border-width, 1px)
-      var(--crtr-text-button-border-style, solid)
-      var(--crtr-text-button-border-color, transparent);
-    border-radius: var(--crtr-text-button-radius, var(--crtr-radius-small));
-    cursor: pointer;
-    /* One motion knob for all three properties, over the family's, because a button that
-       settles at a different speed than the field beside it is the drift controls.ts exists
-       to remove. */
-    transition: color var(--crtr-text-button-transition, var(--crtr-control-transition, 120ms ease)),
-      background-color var(--crtr-text-button-transition, var(--crtr-control-transition, 120ms ease)),
-      border-color var(--crtr-text-button-transition, var(--crtr-control-transition, 120ms ease));
-  }
-
-  button:hover {
-    color: var(--crtr-text-button-hover-text-color, var(--crtr-color-text));
-    background: var(--crtr-text-button-hover-fill, var(--crtr-color-surface-hover));
-  }
-
-${u({scope:"text-whole-comment"},'[part~="whole-comment"]')}
-${u({scope:"text-edit-toggle"},'[part="edit-toggle"]')}
-${u({scope:"text-selection-comment"},'[part~="selection-comment"]')}
-${u({scope:"text-comment-chip"},'[part~="comment-chip"]')}
-${u({scope:"text-popover-save"},'[part="popover-save"]')}
-${u({scope:"text-popover-cancel"},'[part="popover-cancel"]')}
-  button[data-state="on"] {
-    color: var(--crtr-text-button-on-text-color, var(--crtr-color-accent));
-  }
-
-  /* Editing a prefilled draft is a primary path, not an icon to discover. Keep the control
-     beside the text but give it the bordered, labelled shape that reads as an action. */
-  [part="edit-toggle"] {
-    color: var(--crtr-text-edit-toggle-text-color, var(--crtr-color-text));
-    background: var(--crtr-text-edit-toggle-fill, var(--crtr-color-background));
-    border-color: var(--crtr-text-edit-toggle-border-color, var(--crtr-color-border));
-  }
-
-  /* Reached for and engaged are one treatment here, so they are one knob: active. */
-  [part="edit-toggle"]:hover,
-  [part="edit-toggle"][data-state="on"] {
-    color: var(--crtr-text-edit-toggle-active-text-color, var(--crtr-color-accent));
-    border-color: var(--crtr-text-edit-toggle-active-border-color,
-      color-mix(in srgb, var(--crtr-color-accent) 45%, var(--crtr-color-border)));
-  }
-
-  /* Width and height are one visual knob \u2014 the icon is square. */
-  svg {
-    width: var(--crtr-text-icon-size, 0.875em);
-    height: var(--crtr-text-icon-size, 0.875em);
-    flex: none;
-  }
-
-  /* Both writing boxes in one call, because in the kit they are one control at two heights:
-     input.tsx and textarea.tsx carry the same border, radius, padding, fill, elevation and
-     focus ring, and differ only in how tall they start. Writing them separately is what let
-     them drift into two visibly different fields \u2014 different padding, different radius,
-     different fill, and an inset outline on one against the kit's outset ring on the other.
-
-     Each selector still gets its own scope: the field and editor are distinct anatomy even
-     though this recipe keeps their default paint identical. */
-${S({scope:"text-input"},'[part="input"]')}
-${S({scope:"text-editor"},'[part="editor"]')}
-  /* The one thing the textarea does not share: it starts tall and may be dragged taller. */
-  [part="editor"] {
-    min-height: var(--crtr-text-editor-min-height, 10em);
-    resize: vertical;
-  }
-
-  /* The kit ring is outset paint, so a writing box needs a three-pixel gutter inside its grid
-     track. Without it the box fills the track exactly and the ring is shaved off by a tight
-     host frame. Prose is the other face of this surface and keeps its own inset ring, so it
-     stays full-bleed. */
-  [part="surface"]:has([part="input"]),
-  [part="surface"]:has([part="editor"]) {
-    padding: var(--crtr-text-surface-padding, 0.1875rem);
-  }
-
-  [part="body"] {
-    position: relative;
-    padding: var(--crtr-text-body-padding, var(--crtr-space-3) var(--crtr-space-4));
-    background: var(--crtr-text-body-fill, var(--crtr-color-surface));
-    border: var(--crtr-text-body-border-width, 1px)
-      var(--crtr-text-body-border-style, solid)
-      var(--crtr-text-body-border-color, var(--crtr-color-border));
-    border-radius: var(--crtr-text-body-radius, var(--crtr-radius-medium));
-  }
-
-  /* The ring sits inside the border rather than outside it. The body is full-bleed \u2014 it runs
-     the whole width of the frame the host gives the page \u2014 so an outset ring has nowhere to be
-     drawn and gets clipped at the frame's edges, showing three sides of a rectangle. */
-  [part="body"]:focus-visible {
-    outline: var(--crtr-text-body-focus-ring-width, 2px)
-      var(--crtr-text-body-focus-ring-style, solid)
-      var(--crtr-text-body-focus-ring-color, var(--crtr-color-focus));
-    outline-offset: var(--crtr-text-body-focus-ring-offset, -2px);
-  }
-
-  [part="prose"] {
-    display: grid;
-    gap: var(--crtr-text-prose-gap, var(--crtr-space-3));
-  }
-
-  [part="prose"] p {
-    margin: var(--crtr-text-prose-paragraph-margin, 0);
-    /* The agent's own line breaks are the passage; preserving them is behavior. */
-    white-space: pre-wrap;
-  }
-
-  [part="placeholder"] {
-    color: var(--crtr-text-placeholder-text-color, var(--crtr-color-text-muted));
-  }
-
-  [part~="commented"] {
-    position: relative;
-    border-radius: var(--crtr-text-commented-radius, var(--crtr-radius-small));
-    background: var(--crtr-text-commented-fill, color-mix(in srgb, var(--crtr-color-accent) 18%, transparent));
-    text-decoration: var(--crtr-text-commented-text-decoration, underline dotted);
-    text-decoration-color: var(--crtr-text-commented-text-decoration-color, var(--crtr-color-accent));
-    text-underline-offset: var(--crtr-text-commented-text-underline-offset, 0.25em);
-    cursor: help;
-    outline: var(--crtr-text-commented-outline, none);
-  }
-
-  [part~="commented"]:focus-visible {
-    outline: var(--crtr-text-commented-focus-ring-width, 2px)
-      var(--crtr-text-commented-focus-ring-style, solid)
-      var(--crtr-text-commented-focus-ring-color, var(--crtr-color-focus));
-    outline-offset: var(--crtr-text-commented-focus-ring-offset, 2px);
-  }
-
-  /* The staged delays here and on the hover rule below are the bubble's show/hide
-     choreography \u2014 behavior rather than a styling value, so they stay literal. */
-  [part="comment-bubble"] {
-    position: absolute;
-    bottom: calc(100% + var(--crtr-text-comment-bubble-offset, var(--crtr-space-1)));
-    left: 0;
-    z-index: 2;
-    display: grid;
-    gap: var(--crtr-text-comment-bubble-gap, var(--crtr-space-1));
-    width: var(--crtr-text-comment-bubble-width, max-content);
-    max-width: var(--crtr-text-comment-bubble-max-width, 18em);
-    padding: var(--crtr-text-comment-bubble-padding, var(--crtr-space-2) var(--crtr-space-3));
-    color: var(--crtr-text-comment-bubble-text-color, var(--crtr-color-text));
-    background: var(--crtr-text-comment-bubble-fill, var(--crtr-color-background));
-    border: var(--crtr-text-comment-bubble-border-width, 1px)
-      var(--crtr-text-comment-bubble-border-style, solid)
-      var(--crtr-text-comment-bubble-border-color, var(--crtr-color-border));
-    border-radius: var(--crtr-text-comment-bubble-radius, var(--crtr-radius-medium));
-    box-shadow: var(--crtr-text-comment-bubble-shadow, var(--crtr-shadow));
-    text-decoration: none;
-    white-space: normal;
-    user-select: none;
-    opacity: 0;
-    visibility: hidden;
-    transition: opacity 120ms ease 120ms, visibility 0s linear 240ms;
-  }
-
-  [part~="commented"]:hover > [part="comment-bubble"],
-  [part~="commented"]:focus > [part="comment-bubble"] {
-    opacity: 1;
-    visibility: visible;
-    transition: opacity 120ms ease 220ms, visibility 0s linear 220ms;
-  }
-
-  /* The comment layer's micro-labels are the page's own prose, one step down and muted \u2014 not
-     caps-mono. Mono set in capitals reads as machine output, and what these say ("Comment on
-     this passage", "2 comments") is the interface talking to a person. */
-  [part="bubble-label"],
-  [part="comment-count"],
-  [part="popover-subject"],
-  [part="popover-hint"] {
-    color: var(--crtr-text-comment-label-text-color, var(--crtr-color-text-muted));
-    font-size: var(--crtr-text-comment-label-font-size, 0.875em);
-  }
-
-  [part="bubble-label"] {
-    color: var(--crtr-text-bubble-label-text-color, var(--crtr-color-accent));
-  }
-
-  [part~="selection-comment"] {
-    position: absolute;
-    z-index: 3;
-    color: var(--crtr-text-selection-comment-text-color, var(--crtr-color-accent));
-    background: var(--crtr-text-selection-comment-fill, var(--crtr-color-background));
-    border-color: var(--crtr-text-selection-comment-border-color,
-      color-mix(in srgb, var(--crtr-color-accent) 40%, transparent));
-    box-shadow: var(--crtr-text-selection-comment-shadow, var(--crtr-shadow));
-  }
-
-  [part="comment-rail"] {
-    display: grid;
-    gap: var(--crtr-text-comment-rail-gap, var(--crtr-space-1));
-  }
-
-  [part="comment-chips"] {
-    display: flex;
-    flex-wrap: wrap;
-    gap: var(--crtr-text-comment-chips-gap, var(--crtr-space-2));
-  }
-
-  [part~="comment-chip"] {
-    color: var(--crtr-text-comment-chip-text-color, var(--crtr-color-text));
-    border-color: var(--crtr-text-comment-chip-border-color, var(--crtr-color-border));
-    text-align: var(--crtr-text-comment-chip-text-align, left);
-  }
-
-  [part~="comment-chip"] > span {
-    overflow: hidden;
-    white-space: nowrap;
-    text-overflow: ellipsis;
-  }
-
-  [part="popover"] {
-    position: absolute;
-    z-index: 5;
-    box-sizing: border-box;
-    display: grid;
-    gap: var(--crtr-text-popover-gap, var(--crtr-space-2));
-    width: var(--crtr-text-popover-width, 20em);
-    max-width: var(--crtr-text-popover-max-width, 100%);
-    padding: var(--crtr-text-popover-padding, var(--crtr-space-3));
-    background: var(--crtr-text-popover-fill, var(--crtr-color-background));
-    border: var(--crtr-text-popover-border-width, 1px)
-      var(--crtr-text-popover-border-style, solid)
-      var(--crtr-text-popover-border-color, var(--crtr-color-border));
-    border-radius: var(--crtr-text-popover-radius, var(--crtr-radius-medium));
-    box-shadow: var(--crtr-text-popover-shadow, var(--crtr-shadow));
-  }
-
-  [part="popover"][hidden],
-  [part="toolbar"][hidden],
-  [part~="whole-comment"][hidden],
-  [part="edited"][hidden],
-  [part="comment-rail"][hidden],
-  [part~="selection-comment"][hidden],
-  [part="popover-quote"][hidden],
-  [part="edit-toggle"][hidden] {
-    display: none;
-  }
-
-  [part="popover-subject"] {
-    margin: var(--crtr-text-popover-subject-margin, 0);
-  }
-
-  /* Smaller than the comment being written, because it is the context and not the subject.
-     The text arrives already elided to about two lines by quotePreview, so it wraps normally
-     rather than keeping the source's line breaks. */
-  [part="popover-quote"] {
-    margin: var(--crtr-text-popover-quote-margin, 0);
-    padding: var(--crtr-text-popover-quote-padding, var(--crtr-space-1) var(--crtr-space-2));
-    color: var(--crtr-text-popover-quote-text-color, var(--crtr-color-text-muted));
-    font-size: var(--crtr-text-popover-quote-font-size, 0.8125em);
-    background: var(--crtr-text-popover-quote-fill, color-mix(in srgb, var(--crtr-color-accent) 8%, transparent));
-    border-left: var(--crtr-text-popover-quote-border-width, 2px)
-      var(--crtr-text-popover-quote-border-style, solid)
-      var(--crtr-text-popover-quote-border-color, color-mix(in srgb, var(--crtr-color-accent) 40%, transparent));
-    overflow-wrap: anywhere;
-  }
-
-  /* The composer is its own scope: it is the one writing box a person can meet beside the
-     passage's own, so the two are separately restylable. */
-${S({scope:"text-popover-input"},'[part="popover-input"]')}
-  [part="popover-input"] {
-    min-height: var(--crtr-text-popover-input-min-height, 5em);
-    resize: vertical;
-  }
-
-  [part="popover-actions"] {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    gap: var(--crtr-text-popover-actions-gap, var(--crtr-space-2));
-  }
-
-  [part="popover-buttons"] {
-    display: flex;
-    gap: var(--crtr-text-popover-buttons-gap, var(--crtr-space-2));
-  }
-
-  [part="popover-save"] {
-    color: var(--crtr-text-popover-save-text-color, var(--crtr-color-accent-contrast));
-    background: var(--crtr-text-popover-save-fill, var(--crtr-color-accent));
-  }
-
-  /* Mixing the accent toward the text colour darkens on a light token set and lightens on a
-     dark one \u2014 an opacity or brightness step moves the wrong way on one of them. */
-  [part="popover-save"]:hover {
-    color: var(--crtr-text-popover-save-hover-text-color, var(--crtr-color-accent-contrast));
-    background: var(--crtr-text-popover-save-hover-fill,
-      color-mix(in srgb, var(--crtr-color-accent) 88%, var(--crtr-color-text)));
-  }
-
-  /* Cancel is the quiet half of every editor in this bundle: no border until you reach for it. */
-  [part="popover-cancel"] {
-    border-color: var(--crtr-text-popover-cancel-border-color, transparent);
-  }
-
-  /* Flat: this sits in the flow of the page. A shadow in this bundle means floating \u2014 the
-     comment bubble, the selection button, the popover, and nothing else. */
-  [part="unavailable"] {
-    padding: var(--crtr-text-unavailable-padding, var(--crtr-space-3));
-    color: var(--crtr-text-unavailable-text-color, var(--crtr-color-text-muted));
-    background: var(--crtr-text-unavailable-fill, var(--crtr-color-surface));
-    border: var(--crtr-text-unavailable-border-width, 1px)
-      var(--crtr-text-unavailable-border-style, solid)
-      var(--crtr-text-unavailable-border-color, var(--crtr-color-border));
-    border-radius: var(--crtr-text-unavailable-radius, var(--crtr-radius-medium));
-  }
-
-  [part="reason"] {
-    color: var(--crtr-text-reason-text-color, var(--crtr-color-text));
-    font-family: var(--crtr-text-reason-font-family, var(--crtr-font-mono));
-  }
-`,_t="http://www.w3.org/2000/svg",Ut="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z",Kt=[Ut,"M12 7v6","M9 10h6"],qt=[Ut,"M13 8H7","M17 12H7"],xe=["M12 20h9","M16.376 3.622a1 1 0 0 1 3.002 3.002L7.368 18.635a2 2 0 0 1-.855.506l-2.872.838a.5.5 0 0 1-.62-.62l.838-2.872a2 2 0 0 1 .506-.854z","m15 5 3 3"],ye=["M20 6 9 17l-5-5"];function ot(n){let t=document.createElementNS(_t,"svg");t.setAttribute("viewBox","0 0 24 24"),t.setAttribute("fill","none"),t.setAttribute("stroke","currentColor"),t.setAttribute("stroke-width","2"),t.setAttribute("stroke-linecap","round"),t.setAttribute("stroke-linejoin","round"),t.setAttribute("aria-hidden","true");for(let e of n){let r=document.createElementNS(_t,"path");r.setAttribute("d",e),t.append(r)}return t}function we(n){let t=[],e=/\n{2,}/g,r=0,o;for(;(o=e.exec(n))!==null;)t.push({start:r,text:n.slice(r,o.index)}),r=o.index+o[0].length;return t.push({start:r,text:n.slice(r)}),t.filter(a=>a.text.trim().length>0)}function ke(n,t){let e=t.filter(a=>a.anchor.kind==="range").filter(a=>a.anchor.end>n.start&&a.anchor.start<n.start+n.text.length).sort((a,i)=>a.anchor.start-i.anchor.start),r=[],o=0;for(let a of e){let i=Math.max(o,a.anchor.start-n.start),s=Math.min(n.text.length,a.anchor.end-n.start);s<=i||(i>o&&r.push({text:n.text.slice(o,i)}),r.push({text:n.text.slice(i,s),comment:a}),o=s)}return o<n.text.length&&r.push({text:n.text.slice(o)}),r}function Ee(n){return(n.nodeType===Node.ELEMENT_NODE?n:n.parentElement)?.closest("[data-paragraph]")??null}function Ce(n,t,e){let r=document.createRange();r.selectNodeContents(n),r.setEnd(t,e);let o=r.cloneContents();for(let a of o.querySelectorAll('[part="comment-bubble"]'))a.remove();return o.textContent?.length??0}function Gt(n){let t=n.cloneNode(!0);for(let e of t.querySelectorAll('[part="comment-bubble"]'))e.remove();return t.textContent?.length??0}function Wt(n,t,e,r){let o=Array.from(n.querySelectorAll("[data-paragraph]")),a=Ee(t);if(a){if(r==="end"&&e===0){let c=o.indexOf(a),l=o[c-1];if(l)return{paragraph:l,offset:Gt(l)}}return{paragraph:a,offset:Ce(a,t,e)}}let i=document.createRange();i.setStart(t,e),i.collapse(!0);let s=r==="start"?o:[...o].reverse();for(let c of s){let l=document.createRange();l.selectNodeContents(c);let h=i.compareBoundaryPoints(r==="start"?Range.START_TO_START:Range.START_TO_END,l);if(r==="start"&&h<=0||r==="end"&&h>=0)return{paragraph:c,offset:r==="start"?0:Gt(c)}}return null}function Te(n,t){let e=n,r=[typeof e.getSelection=="function"?e.getSelection():null,document.getSelection()];for(let o of r){if(!o||o.isCollapsed||o.rangeCount===0)continue;let a=o.getRangeAt(0);if(t.contains(a.startContainer)&&t.contains(a.endContainer))return a}return null}function nt(n){n.setAttribute("aria-haspopup","dialog"),n.setAttribute("aria-controls",Ft),n.setAttribute("aria-expanded","false")}var vt=class extends HTMLElement{static observedAttributes=["inert"];#o;#i=document.createElement("div");#a=document.createElement("p");#n=document.createElement("div");#e=document.createElement("span");#r=document.createElement("button");#t=document.createElement("button");#h=document.createElement("span");#c=document.createElement("div");#s=document.createElement("textarea");#l=document.createElement("input");#d=document.createElement("div");#u=document.createElement("div");#m=document.createElement("button");#E=document.createElement("div");#L=document.createElement("span");#g=document.createElement("div");#p=document.createElement("div");#T=document.createElement("p");#b=document.createElement("blockquote");#y=document.createElement("textarea");#S=document.createElement("span");#f=document.createElement("button");#A=document.createElement("button");#w={initialText:""};#C;#v=!1;#x="";#k=[];#M=!1;#G=!1;#O=null;#$=null;#j=new ResizeObserver(()=>{let t=this.#$;t!==null&&this.#Z(t.trigger,t.align)});constructor(){super(),this.#o=this.attachShadow({mode:"open"});let t=document.createElement("style");t.textContent=be,this.#i.part.add("container"),this.#a.part.add("label"),this.#a.id=Pt,this.#a.hidden=!0,this.#n.part.add("toolbar"),this.#e.part.add("edited"),this.#e.textContent="edited",this.#e.hidden=!0,this.#r.type="button",this.#r.part.add("comment-trigger"),this.#r.part.add("whole-comment"),nt(this.#r),this.#r.addEventListener("click",()=>{this.#P(ut,U,this.#r,"end")}),this.#t.type="button",this.#t.part.add("edit-toggle"),this.#t.hidden=!0,this.#t.append(this.#h),this.#t.addEventListener("click",()=>{this.#M=!this.#M,this.#R(),this.#q(),this.#H(),this.#M?this.#s.focus():this.#d.focus()}),this.#n.append(this.#e,this.#r,this.#t),this.#c.part.add("surface"),this.#s.part.add("editor"),this.#s.addEventListener("input",()=>{this.#x=this.#s.value,this.#H(),this.#K()}),this.#l.type="text",this.#l.part.add("input"),this.#l.addEventListener("input",()=>{this.#x=this.#l.value,this.#H(),this.#K()}),this.#l.addEventListener("keydown",o=>{o.key==="Enter"&&!o.metaKey&&!o.ctrlKey&&!o.altKey&&o.preventDefault()}),this.#d.part.add("body"),this.#d.tabIndex=0,this.#u.part.add("prose"),this.#m.type="button",this.#m.part.add("comment-trigger"),this.#m.part.add("selection-comment"),this.#m.hidden=!0,nt(this.#m),this.#m.append(ot(Kt),document.createTextNode("Comment")),this.#m.addEventListener("mousedown",o=>o.preventDefault()),this.#m.addEventListener("click",()=>{let o=this.#O;o!==null&&this.#P(o.anchor,J,this.#m,"start",o.anchor.quote)}),this.#d.append(this.#u,this.#m),this.#d.addEventListener("mouseup",()=>this.#J()),this.#E.part.add("comment-rail"),this.#E.hidden=!0,this.#L.part.add("comment-count"),this.#g.part.add("comment-chips"),this.#E.append(this.#L,this.#g),this.#p.part.add("popover"),this.#p.hidden=!0,this.#p.id=Ft,this.#p.setAttribute("role","dialog"),this.#T.part.add("popover-subject"),this.#b.part.add("popover-quote"),this.#b.hidden=!0,this.#y.part.add("popover-input"),this.#y.placeholder="What should the agent know about this?",this.#y.addEventListener("keydown",o=>{o.key==="Enter"&&(o.metaKey||o.ctrlKey)&&(o.preventDefault(),this.#tt())}),this.#S.part.add("popover-hint"),this.#A.type="button",this.#A.part.add("popover-cancel"),this.#A.textContent="Cancel",this.#A.addEventListener("click",()=>this.#_()),this.#f.type="button",this.#f.part.add("popover-save"),this.#f.textContent="Save",this.#f.addEventListener("click",()=>this.#tt());let e=document.createElement("div");e.part.add("popover-actions");let r=document.createElement("div");r.part.add("popover-buttons"),r.append(this.#A,this.#f),e.append(this.#S,r),this.#p.append(this.#T,this.#b,this.#y,e),this.#i.append(this.#a,this.#n,this.#c,this.#E,this.#p),this.#o.append(t,this.#i),this.addEventListener("keydown",this.#rt)}connectedCallback(){if(this.#G)return;let t=T(this);if(t.status!=="ok"){this.#U(t.reason);return}if(typeof t.config.initialText!="string"){this.#U("text config has no initialText string");return}this.#G=!0,this.#w=t.config,this.#v=t.config.singleLine===!0,this.#c.toggleAttribute("data-single-line",this.#v),this.#C=D(this),this.#x=t.config.initialText,this.#I(),this.#W(),this.#C!==void 0&&B(this,this.#C,()=>this.#F()),this.#M=this.#N&&this.#x.length===0,this.#H(),this.#q(),this.#Y()}attributeChangedCallback(){this.isConnected&&this.#V()}disconnectedCallback(){document.removeEventListener("pointerdown",this.#Q,!0),this.#j.disconnect()}#W(){if(this.#C===void 0)return;let t=N(this.#C);t!==void 0&&((this.#N||this.#v)&&typeof t.text=="string"&&(this.#x=t.text),this.#k=O(t.comments))}#F(){return{text:this.#x,edited:this.#x!==this.#w.initialText,comments:this.#k}}#K(){this.#C!==void 0&&M(this.#C,this.#F())}#U(t){let e=document.createElement("div");e.part.add("unavailable"),e.setAttribute("role","status");let r=document.createElement("span");r.part.add("reason"),r.textContent=t,e.append("Text unavailable: ",r),this.#i.replaceChildren(e)}#I(){let t=this.#w.label,e=t!==void 0&&t!=="";this.#a.hidden=!e,this.#a.textContent=e?t:"";for(let r of[this.#s,this.#l,this.#d])e?r.setAttribute("aria-labelledby",Pt):r.removeAttribute("aria-labelledby")}#H(){this.#e.hidden=this.#x===this.#w.initialText||this.#v&&this.#w.initialText==="";let t=y(this.#k,ut);this.#r.replaceChildren(ot(t?qt:Kt)),this.#r.dataset.state=t?"on":"off",this.#r.setAttribute("aria-label",`${t?"Edit comment on":"Comment on"} ${U}`),this.#r.hidden=this.#v||!this.#z,this.#t.hidden=!this.#N,this.#n.hidden=this.#v&&this.#e.hidden,this.#t.dataset.state=this.#M?"on":"off",this.#h.textContent=this.#M?"Done editing":"Edit text",this.#t.replaceChildren(ot(this.#M?ye:xe),this.#h),this.#V()}#V(){let t=f(this);j(this.#o,t),this.#s.readOnly=t,this.#l.disabled=!1,this.#l.readOnly=t,this.#t.disabled=t,t&&this.#$!==null&&this.#_(!1)}get#N(){return!this.#v&&this.#w.editable!==!1}get#z(){return L(this.#C)}#q(){if(this.#v){this.#l.value!==this.#x&&(this.#l.value=this.#x),this.#l.placeholder=this.#w.placeholder??"",this.#c.firstChild!==this.#l&&this.#c.replaceChildren(this.#l);return}if(this.#M){this.#s.value!==this.#x&&(this.#s.value=this.#x),this.#s.placeholder=this.#w.placeholder??"Write your answer\u2026",this.#c.firstChild!==this.#s&&this.#c.replaceChildren(this.#s);return}this.#c.firstChild!==this.#d&&this.#c.replaceChildren(this.#d),this.#B()}#B(){let t=we(this.#x);if(t.length===0){let r=document.createElement("p");r.part.add("placeholder"),r.textContent=this.#w.placeholder??"Nothing yet.",this.#u.replaceChildren(r);return}let e=t.map(r=>{let o=document.createElement("p");o.dataset.paragraph="",o.dataset.start=String(r.start);for(let a of ke(r,this.#k))o.append(a.comment?this.#X(a.text,a.comment):a.text);return o});this.#u.replaceChildren(...e)}#X(t,e){let r=document.createElement("span");r.part.add("commented"),r.tabIndex=0,r.dataset.commentId=e.id,nt(r);let o=document.createElement("span");o.part.add("comment-bubble"),o.setAttribute("role","note");let a=document.createElement("span");a.part.add("bubble-label"),a.textContent="Comment";let i=document.createElement("span");return i.textContent=e.text,o.append(a,i),r.append(t,o),r}#Y(){let t=this.#k.length;if(this.#E.hidden=t===0,t===0){this.#g.replaceChildren();return}this.#L.textContent=`${t} comment${t===1?"":"s"}`;let e=this.#k.map(r=>{let o=document.createElement("button");o.type="button",o.part.add("comment-trigger"),o.part.add("comment-chip"),o.dataset.commentId=r.id,nt(o);let a=document.createElement("span");a.textContent=r.text,o.append(ot(qt),a);let i=r.anchor.kind==="range"?r.anchor:void 0;return o.setAttribute("aria-label",`Edit comment on ${i?J:U}`),o.addEventListener("click",()=>{this.#P(r.anchor,i?J:U,o,"start",i?.quote)}),o});this.#g.replaceChildren(...e)}#D(){let t=Te(this.#o,this.#d);if(t===null)return null;let e=Wt(this.#d,t.startContainer,t.startOffset,"start"),r=Wt(this.#d,t.endContainer,t.endOffset,"end");if(e===null||r===null||e.paragraph!==r.paragraph)return null;let o=Number(e.paragraph.dataset.start??"0"),a=o+e.offset,i=o+r.offset;if(i<=a)return null;let s=t.getBoundingClientRect(),c=this.#d.getBoundingClientRect();return{anchor:{kind:"range",start:a,end:i,quote:this.#x.slice(a,i)},left:s.left-c.left,top:s.bottom-c.top+4}}#J(){if(this.#M||this.#$!==null||!this.#z)return;let t=this.#D();if(t===null){this.#R();return}this.#O=t,this.#m.hidden=!1,this.#m.style.left=`${t.left}px`,this.#m.style.top=`${t.top}px`}#R(){this.#O=null,this.#m.hidden=!0}#P(t,e,r,o,a){if(!this.#z||f(this))return;let i=this.#$;if(i!==null){if(i.trigger===r){this.#_();return}i.trigger.setAttribute("aria-expanded","false")}let s=y(this.#k,t);this.#$={anchor:t,trigger:r,align:o},r.setAttribute("aria-expanded","true"),this.#T.textContent=`Comment on ${e}`,this.#p.setAttribute("aria-label",`Comment on ${e}`);let c=Ht(a??"");this.#b.hidden=c==="",this.#b.textContent=c,this.#y.value=s?.text??"",this.#S.textContent=s?"empty to delete":"\u2318\u21B5 to save",this.#p.hidden=!1,this.#Z(r,o),this.#j.observe(this.#p),this.#y.focus(),document.addEventListener("pointerdown",this.#Q,!0)}#Z(t,e){this.#i.style.paddingBottom="";let r=this.#i.getBoundingClientRect(),o=t.getBoundingClientRect(),a=this.#p.offsetWidth,i=this.#p.offsetHeight,s=e==="end"?o.right-r.left-a:o.left-r.left,c=Math.min(Math.max(s,0),Math.max(0,r.width-a)),l=o.bottom+rt+i<=window.innerHeight,h=o.top-rt-i>=0,g=!l&&h?o.top-r.top-rt-i:o.bottom-r.top+rt;this.#p.style.left=`${c}px`,this.#p.style.top=`${g}px`;let p=this.#p.getBoundingClientRect().bottom-document.body.getBoundingClientRect().bottom;p>0&&(this.#i.style.paddingBottom=`${p}px`)}#_(t=!0){let e=this.#$;this.#$=null,this.#p.hidden=!0,this.#j.disconnect(),this.#i.style.paddingBottom="",e?.trigger.setAttribute("aria-expanded","false"),document.removeEventListener("pointerdown",this.#Q,!0);let r=e!==null&&e.trigger!==this.#m?e.trigger:this.#d;this.#R(),t&&this.#o.contains(r)&&r.focus()}#tt(){let t=this.#$;if(t===null||f(this))return;let e=this.#u.contains(t.trigger)||this.#g.contains(t.trigger);this.#k=z(this.#k,t.anchor,this.#y.value),this.#_(!e),this.#H(),!this.#M&&!this.#v&&this.#B(),this.#Y(),e&&this.#et(t.anchor),this.#K()}#et(t){let e=y(this.#k,t)?.id,r=e===void 0?null:`[data-comment-id="${CSS.escape(e)}"]`,a=(r===null?null:this.#u.querySelector(r)??this.#g.querySelector(r))??this.#d;this.#o.contains(a)&&a.focus()}#Q=t=>{if(this.#$===null)return;let e=t.composedPath();e.includes(this.#p)||e.includes(this.#$.trigger)||this.#_()};#rt=t=>{if(t.defaultPrevented)return;if(t.key==="Escape"&&this.#$!==null){t.preventDefault(),this.#_();return}if(this.#$!==null||this.#M)return;let e=t.composedPath()[0];if(!(e instanceof HTMLElement&&(e.tagName==="TEXTAREA"||e.tagName==="INPUT"))&&!(t.metaKey||t.ctrlKey||t.altKey)){if(t.key==="j"||t.key==="k"){t.preventDefault(),this.#nt(t.key==="j"?1:-1);return}t.key==="c"&&(t.preventDefault(),this.#at())}};#ot(){return Array.from(this.#u.querySelectorAll('[part~="commented"]'))}#nt(t){let e=this.#ot();if(e.length===0)return;let r=this.#o.activeElement,o=r instanceof HTMLElement?e.indexOf(r):-1,a=o===-1?t>0?0:e.length-1:o+t;e[Math.min(Math.max(a,0),e.length-1)]?.focus()}#at(){if(this.#v||!this.#z)return;let t=this.#O??this.#D();if(t!==null){this.#O=t,this.#m.hidden=!1,this.#m.style.left=`${t.left}px`,this.#m.style.top=`${t.top}px`,this.#P(t.anchor,J,this.#m,"start",t.anchor.quote);return}let e=this.#o.activeElement;if(e instanceof HTMLElement&&e.dataset.commentId!==void 0){let r=this.#k.find(o=>o.id===e.dataset.commentId);if(r!==void 0){let o=r.anchor.kind==="range"?r.anchor:void 0,a=o===void 0?U:J;this.#P(r.anchor,a,e,"start",o?.quote);return}}this.#P(ut,U,this.#r,"end")}};w("crtr-text",vt);var at=4,ft="var(--crtr-table-column-toggle-transition, var(--crtr-control-transition, 120ms ease))",Se="var(--crtr-table-row-transition, 120ms ease)",gt="var(--crtr-table-comment-trigger-transition, var(--crtr-control-transition, 120ms ease))",bt="var(--crtr-table-comment-button-transition, var(--crtr-control-transition, 120ms ease))",Ae="M3.25 3.5h9.5A1.75 1.75 0 0 1 14.5 5.25v5A1.75 1.75 0 0 1 12.75 12H7.4l-3.15 2.36A.5.5 0 0 1 3.5 14v-2H3.25A1.75 1.75 0 0 1 1.5 10.25v-5A1.75 1.75 0 0 1 3.25 3.5Z",Me=`
-  :host {
-    display: block;
-  }
-
-  /* The positioning context for the comment editor, and the ONLY one. The editor cannot live
-     inside the container: that box clips to its own rounded corners, so a popover anchored to
-     a row was cut off at the table's edge instead of floating over it. The frame has no paint
-     and no clipping, so the editor overlays whatever the table sits on. */
-  [part="frame"] {
-    position: relative;
-  }
-
-  /* Flat: the table sits in the flow of the page. A shadow in this bundle means floating \u2014
-     the comment editor, and nothing else here. */
-  [part="container"] {
-    background: var(--crtr-table-container-fill, var(--crtr-color-background));
-    border: var(--crtr-table-container-border-width, 1px)
-      var(--crtr-table-container-border-style, solid)
-      var(--crtr-table-container-border-color, var(--crtr-color-border));
-    border-radius: var(--crtr-table-container-radius, var(--crtr-radius-medium));
-    overflow: hidden;
-  }
-
-  /* Inside the border, not outside it: the container is full-bleed, so an outset ring is
-     clipped at the edges of the frame the host gives the page and draws only three sides.
-     That is why this is NOT the shared control focus family \u2014 it is a focusable region rather
-     than a control, and it says so with its own inset outline. */
-  [part="container"]:focus-visible {
-    outline: var(--crtr-table-container-focus-outline, 2px solid var(--crtr-color-focus));
-    outline-offset: var(--crtr-table-container-focus-outline-offset, -2px);
-  }
-
-  /* Typography here is the element's host typography, not a second set of knobs: font stays
-     literal inherit so --crtr-table-font-family, --crtr-table-font-size and
-     --crtr-table-line-height reach the table, and the colour reads the host's own
-     --crtr-table-color, whose fallback is the colour this rule used to hard-code. */
-  [part="table"] {
-    width: 100%;
-    border-collapse: collapse;
-    font: inherit;
-    color: var(--crtr-table-color, var(--crtr-color-text));
-  }
-
-  [part="caption"] {
-    caption-side: top;
-    padding: var(--crtr-table-caption-padding, var(--crtr-space-3) var(--crtr-space-3) var(--crtr-space-2));
-    text-align: left;
-    color: var(--crtr-table-caption-text-color, var(--crtr-color-text-muted));
-  }
-
-  th {
-    padding: var(--crtr-table-header-padding, var(--crtr-space-2) var(--crtr-space-3));
-    text-align: left;
-    font-weight: var(--crtr-table-header-font-weight, 600);
-    color: var(--crtr-table-header-text-color, var(--crtr-color-text-muted));
-    /* A tinted header reads as the table's own chrome; the column-selected tint still wins,
-       on specificity (0-1-0 against this 0-0-1). */
-    background: var(--crtr-table-header-fill, var(--crtr-color-surface));
-    border-bottom: var(--crtr-table-header-border-width, 1px)
-      var(--crtr-table-header-border-style, solid)
-      var(--crtr-table-header-border-color, var(--crtr-color-border));
-    white-space: nowrap;
-  }
-
-  th[data-align="right"] {
-    text-align: right;
-  }
-
-  [part="header-cell-inner"] {
-    display: inline-flex;
-    align-items: center;
-    gap: var(--crtr-table-header-gap, var(--crtr-space-1));
-  }
-
-  th[data-align="right"] [part="header-cell-inner"] {
-    flex-direction: row-reverse;
-  }
-
-  [part="column-toggle"] {
-    font: var(--crtr-table-column-toggle-font, inherit);
-    font-weight: var(--crtr-table-column-toggle-font-weight, 600);
-    color: var(--crtr-table-column-toggle-text-color, inherit);
-    background: var(--crtr-table-column-toggle-fill, transparent);
-    border: var(--crtr-table-column-toggle-border-width, 1px)
-      var(--crtr-table-column-toggle-border-style, solid)
-      var(--crtr-table-column-toggle-border-color, transparent);
-    border-radius: var(--crtr-table-column-toggle-radius, var(--crtr-radius-small));
-    padding: var(--crtr-table-column-toggle-padding, var(--crtr-space-1) var(--crtr-space-2));
-    /* The toggle is pulled back out of its own padding so the header label sits where an
-       unselectable one does; a host that repads the toggle repays this too. */
-    margin: var(--crtr-table-column-toggle-margin, calc(var(--crtr-space-1) * -1) calc(var(--crtr-space-2) * -1));
-    cursor: pointer;
-    transition: color ${ft}, background-color ${ft}, border-color ${ft};
-  }
-
-  [part="column-toggle"]:hover {
-    background: var(--crtr-table-column-toggle-hover-fill, var(--crtr-color-surface-hover));
-  }
-
-  [part="column-toggle"][aria-pressed="true"] {
-    color: var(--crtr-table-column-toggle-selected-text-color, var(--crtr-color-text));
-    background: var(--crtr-table-column-toggle-selected-fill,
-      color-mix(in srgb, var(--crtr-color-accent) 10%, transparent));
-    border-color: var(--crtr-table-column-toggle-selected-border-color,
-      color-mix(in srgb, var(--crtr-color-accent) 45%, transparent));
-  }
-
-  [part="column-toggle"][aria-pressed="true"]:hover {
-    background: var(--crtr-table-column-toggle-selected-hover-fill,
-      color-mix(in srgb, var(--crtr-color-accent) 14%, transparent));
-  }
-
-${u({scope:"table-column-toggle"},'[part="column-toggle"]')}
-${u({scope:"table-comment-trigger"},'[part="comment-trigger"]')}
-
-  [part="row"] {
-    border-bottom: var(--crtr-table-row-border-width, 1px)
-      var(--crtr-table-row-border-style, solid)
-      var(--crtr-table-row-border-color, color-mix(in srgb, var(--crtr-color-border) 60%, transparent));
-    transition: background-color ${Se};
-  }
-
-  [part="row"]:last-child {
-    border-bottom: var(--crtr-table-row-last-border, none);
-  }
-
-  [part="row"]:hover,
-  [part="row"][data-active="true"] {
-    background: var(--crtr-table-row-hover-fill, var(--crtr-color-surface-hover));
-  }
-
-  [part="row"][data-state="selected"] {
-    background: var(--crtr-table-row-selected-fill, color-mix(in srgb, var(--crtr-color-accent) 10%, transparent));
-  }
-
-  [part="row"][data-state="selected"]:hover,
-  [part="row"][data-state="selected"][data-active="true"] {
-    background: var(--crtr-table-row-selected-hover-fill,
-      color-mix(in srgb, var(--crtr-color-accent) 14%, transparent));
-  }
-
-  /* Inset for the same reason the container's is: a row runs the full width of the table. */
-  [part="row"]:focus-visible {
-    outline: var(--crtr-table-row-focus-outline, 2px solid var(--crtr-color-focus));
-    outline-offset: var(--crtr-table-row-focus-outline-offset, -2px);
-  }
-
-  td {
-    padding: var(--crtr-table-cell-padding, var(--crtr-space-2) var(--crtr-space-3));
-    vertical-align: middle;
-  }
-
-  td[data-align="right"] {
-    text-align: right;
-    font-variant-numeric: var(--crtr-table-cell-numeric-font-variant, tabular-nums);
-  }
-
-  td[data-mono="true"] {
-    font-family: var(--crtr-table-cell-mono-font-family, var(--crtr-font-mono));
-    font-size: var(--crtr-table-cell-mono-font-size, 0.8125em);
-  }
-
-  [data-column-selected="true"] {
-    background: var(--crtr-table-column-selected-fill, color-mix(in srgb, var(--crtr-color-accent) 6%, transparent));
-  }
-
-  [part="select-cell"],
-  [part="select-head"] {
-    width: 1px;
-    padding-right: var(--crtr-table-select-cell-padding-right, 0);
-  }
-
-  [part="comment-cell"],
-  [part="comment-head"] {
-    width: 1px;
-    text-align: right;
-    padding-left: var(--crtr-table-comment-cell-padding-left, 0);
-  }
-
-  /* One scope over both selectors: the header's select-all IS the row control, drawn once in
-     the head, and they are meant to be indistinguishable. */
-  ${F({scope:"table-selection"},'[part="row-control"]','[part="select-all"]')}
-
-  /* A page that can no longer take an answer keeps its selection legible and drops every
-     affordance that says it could still be changed. */
-  [part="column-toggle"]:disabled {
-    cursor: default;
-  }
-
-  [part="column-toggle"]:disabled:hover {
-    color: var(--crtr-table-column-toggle-disabled-text-color, var(--crtr-color-text-muted));
-    background: var(--crtr-table-column-toggle-disabled-fill, none);
-  }
-
-  /* One size knob for a square button, and one for the glyph in it \u2014 width and height are one
-     visual decision each. The opacity is the reveal-on-hover mechanic, which is behaviour. */
-  [part="comment-trigger"] {
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    width: var(--crtr-table-comment-trigger-size, 1.5em);
-    height: var(--crtr-table-comment-trigger-size, 1.5em);
-    padding: var(--crtr-table-comment-trigger-padding, 0);
-    color: var(--crtr-table-comment-trigger-text-color, var(--crtr-color-text-muted));
-    background: var(--crtr-table-comment-trigger-fill, transparent);
-    border: var(--crtr-table-comment-trigger-border-width, 0)
-      var(--crtr-table-comment-trigger-border-style, none)
-      var(--crtr-table-comment-trigger-border-color, currentColor);
-    border-radius: var(--crtr-table-comment-trigger-radius, var(--crtr-radius-small));
-    cursor: pointer;
-    opacity: 0;
-    transition: opacity ${gt}, color ${gt}, background-color ${gt};
-  }
-
-  [part="comment-trigger"] svg {
-    width: var(--crtr-table-comment-trigger-icon-size, 0.875em);
-    height: var(--crtr-table-comment-trigger-icon-size, 0.875em);
-  }
-
-  /* The path geometry stays the icon's anatomy; its paint is component styling. Attribute
-     selectors preserve the filled-comment state that syncState writes while allowing both
-     appearances to inherit document-root overrides through this shadow root. */
-  [part="comment-trigger"] path {
-    stroke: var(--crtr-table-comment-trigger-icon-stroke, currentColor);
-    stroke-width: var(--crtr-table-comment-trigger-icon-stroke-width, 1.25);
-    stroke-linejoin: var(--crtr-table-comment-trigger-icon-stroke-linejoin, round);
-  }
-
-  [part="comment-trigger"] path[fill="none"] {
-    fill: var(--crtr-table-comment-trigger-icon-fill, none);
-  }
-
-  [part="comment-trigger"] path[fill="currentColor"] {
-    fill: var(--crtr-table-comment-trigger-commented-icon-fill, currentColor);
-  }
-
-  [part="comment-trigger"][data-has-comment="true"] {
-    color: var(--crtr-table-comment-trigger-commented-text-color, var(--crtr-color-accent));
-    opacity: 1;
-  }
-
-  [part="comment-trigger"]:hover {
-    background: var(--crtr-table-comment-trigger-hover-fill, var(--crtr-color-surface-hover));
-  }
-
-  tr:hover [part="comment-trigger"],
-  tr:focus-within [part="comment-trigger"],
-  tr[data-active="true"] [part="comment-trigger"],
-  [part="comment-trigger"]:focus-visible,
-  [part="comment-trigger"][data-open="true"] {
-    opacity: 1;
-  }
-
-  /* A floating panel over the page, not a box in the table's layout: the background token
-     rather than the surface tint, so it reads as lifted off whatever it covers. */
-  [part="comment-editor"] {
-    position: absolute;
-    z-index: 5;
-    box-sizing: border-box;
-    width: var(--crtr-table-comment-editor-width, min(20em, 100%));
-    display: grid;
-    gap: var(--crtr-table-comment-editor-gap, var(--crtr-space-2));
-    padding: var(--crtr-table-comment-editor-padding, var(--crtr-space-3));
-    background: var(--crtr-table-comment-editor-fill, var(--crtr-color-background));
-    border: var(--crtr-table-comment-editor-border-width, 1px)
-      var(--crtr-table-comment-editor-border-style, solid)
-      var(--crtr-table-comment-editor-border-color, var(--crtr-color-border));
-    border-radius: var(--crtr-table-comment-editor-radius, var(--crtr-radius-medium));
-    box-shadow: var(--crtr-table-comment-editor-shadow, var(--crtr-shadow));
-  }
-
-  [part="comment-editor"][hidden] {
-    display: none;
-  }
-
-  /* The editor's own prose, in the page's voice. It was set in caps mono, which shouted a
-     row id at someone who had just clicked that row. */
-  [part="comment-target"] {
-    margin: var(--crtr-table-comment-target-margin, 0);
-    font-size: var(--crtr-table-comment-target-font-size, 0.875em);
-    color: var(--crtr-table-comment-target-text-color, var(--crtr-color-text-muted));
-  }
-
-${S({scope:"table-comment-input"},'[part="comment-input"]')}
-  [part="comment-input"] {
-    min-height: var(--crtr-table-comment-input-min-height, 4.5em);
-    resize: vertical;
-  }
-
-  [part="comment-actions"] {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    gap: var(--crtr-table-comment-actions-gap, var(--crtr-space-2));
-  }
-
-  [part="comment-hint"] {
-    font-size: var(--crtr-table-comment-hint-font-size, 0.875em);
-    color: var(--crtr-table-comment-hint-text-color, var(--crtr-color-text-muted));
-  }
-
-  /* The chrome both editor buttons share reads one scope \u2014 a person sees one pair of buttons \u2014
-     and each button's own paint carries its own. */
-  [part="comment-cancel"],
-  [part="comment-save"] {
-    font: var(--crtr-table-comment-button-font, inherit);
-    font-size: var(--crtr-table-comment-button-font-size, 0.875em);
-    padding: var(--crtr-table-comment-button-padding, var(--crtr-space-1) var(--crtr-space-2));
-    border-radius: var(--crtr-table-comment-button-radius, var(--crtr-radius-small));
-    border: var(--crtr-table-comment-button-border-width, 1px)
-      var(--crtr-table-comment-button-border-style, solid)
-      var(--crtr-table-comment-button-border-color, var(--crtr-color-border));
-    cursor: pointer;
-    transition: color ${bt}, background-color ${bt},
-      border-color ${bt};
-  }
-
-  [part="comment-cancel"] {
-    color: var(--crtr-table-comment-cancel-text-color, var(--crtr-color-text-muted));
-    background: var(--crtr-table-comment-cancel-fill, transparent);
-    border-color: var(--crtr-table-comment-cancel-border-color,
-      var(--crtr-table-comment-button-border-color, transparent));
-  }
-
-  [part="comment-cancel"]:hover {
-    color: var(--crtr-table-comment-cancel-hover-text-color, var(--crtr-color-text));
-    background: var(--crtr-table-comment-cancel-hover-fill, var(--crtr-color-surface-hover));
-  }
-
-  [part="comment-save"] {
-    color: var(--crtr-table-comment-save-text-color, var(--crtr-color-accent-contrast));
-    background: var(--crtr-table-comment-save-fill, var(--crtr-color-accent));
-    border-color: var(--crtr-table-comment-save-border-color,
-      var(--crtr-table-comment-button-border-color, var(--crtr-color-accent)));
-  }
-
-  /* Mixing toward the text colour darkens on a light token set and lightens on a dark one \u2014
-     a brightness filter moves the wrong way on one of them. */
-  [part="comment-save"]:hover {
-    background: var(--crtr-table-comment-save-hover-fill,
-      color-mix(in srgb, var(--crtr-color-accent) 88%, var(--crtr-color-text)));
-    border-color: var(--crtr-table-comment-save-hover-border-color,
-      color-mix(in srgb, var(--crtr-color-accent) 88%, var(--crtr-color-text)));
-  }
-
-${u({scope:"table-comment-cancel"},'[part="comment-cancel"]')}
-${u({scope:"table-comment-save"},'[part="comment-save"]')}
-
-  /* One scope over both: a loading line and an unavailable notice are the same box, saying
-     the table has nothing to show yet or ever. */
-  [part="status"],
-  [part="unavailable"] {
-    padding: var(--crtr-table-notice-padding, var(--crtr-space-3));
-    color: var(--crtr-table-notice-text-color, var(--crtr-color-text-muted));
-    background: var(--crtr-table-notice-fill, var(--crtr-color-surface));
-    border: var(--crtr-table-notice-border-width, 1px)
-      var(--crtr-table-notice-border-style, solid)
-      var(--crtr-table-notice-border-color, var(--crtr-color-border));
-    border-radius: var(--crtr-table-notice-radius, var(--crtr-radius-medium));
-  }
-
-  [part="reason"] {
-    color: var(--crtr-table-reason-text-color, var(--crtr-color-text));
-    font-family: var(--crtr-table-reason-font-family, var(--crtr-font-mono));
-  }
-
-  [part="empty"] {
-    padding: var(--crtr-table-empty-padding, var(--crtr-space-3));
-    color: var(--crtr-table-empty-text-color, var(--crtr-color-text-muted));
-    text-align: center;
-  }
-`;function Le(n){return n==null?"":typeof n=="string"?n:String(n)}function $e(){let n=document.createElementNS("http://www.w3.org/2000/svg","svg");n.setAttribute("viewBox","0 0 16 16"),n.setAttribute("aria-hidden","true"),n.setAttribute("focusable","false");let t=document.createElementNS("http://www.w3.org/2000/svg","path");return t.setAttribute("d",Ae),t.setAttribute("fill","none"),t.setAttribute("stroke","currentColor"),t.setAttribute("stroke-width","1.25"),t.setAttribute("stroke-linejoin","round"),n.append(t),n}function Re(n){return n instanceof HTMLElement?n.closest('input[type="text"], textarea, [contenteditable="true"]')!==null:!1}var xt=class extends HTMLElement{static observedAttributes=["inert"];#o;#i;#a;#n=[];#e=[];#r=[];#t=[];#h=null;#c=null;#s;#l;#d;#u;#m;#E;#L;#g;#p=new Map;#T=new Map;#b;constructor(){super(),this.#o=this.attachShadow({mode:"open"})}connectedCallback(){let t=T(this);if(t.status!=="ok"){this.#W(t.reason);return}let e=t.config;if(!Array.isArray(e.columns)||e.columns.length===0){this.#W("table config has no columns");return}this.#a=e,this.#i=D(this),this.#i!==void 0&&(this.#f!=="none"||this.#A!=="none")&&B(this,this.#i,()=>this.#w()),this.#n=e.rows??[],this.#S(),this.#F()}attributeChangedCallback(){this.isConnected&&this.#y()}#y(){let t=f(this);j(this.#o,t);for(let e of this.#T.values())e.toggle!==void 0&&(e.toggle.disabled=t);t&&this.#c!==null&&this.#z()}#S(){if(this.#i===void 0)return;let t=N(this.#i);if(t===void 0)return;let e=this.#v(q(t.selectedRowIds)),r=this.#x(q(t.selectedColumnIds));this.#e=this.#f==="none"?[]:this.#f==="single"?e.slice(0,1):e,this.#r=this.#A==="none"?[]:this.#A==="single"?r.slice(0,1):r;let o=new Set(this.#n.map(i=>i.id)),a=new Set((this.#a?.columns??[]).map(i=>i.id));this.#t=O(t.comments).filter(i=>i.anchor.kind==="row"?o.has(i.anchor.rowId):i.anchor.kind==="column"?a.has(i.anchor.columnId):!0)}get#f(){return this.#a?.rowSelect??"none"}get#A(){return this.#a?.columnSelect??"none"}#w(){return{selectedRowIds:[...this.#e],selectedColumnIds:[...this.#r],comments:[...this.#t]}}#C(){this.#R(),this.#i!==void 0&&M(this.#i,this.#w())}#v(t){return this.#n.map(e=>e.id).filter(e=>t.includes(e))}#x(t){return(this.#a?.columns??[]).map(e=>e.id).filter(e=>t.includes(e))}#k(t,e){let r=this.#f;r==="none"||f(this)||(r==="single"?this.#e=e?[t]:[]:this.#e=this.#v(e?[...this.#e,t]:this.#e.filter(o=>o!==t)),this.#C())}#M(t){if(this.#f==="single"){this.#k(t,!0);return}this.#k(t,!this.#e.includes(t))}#G(t,e){let r=this.#A;r==="none"||f(this)||(r==="single"?this.#r=e?[t]:[]:this.#r=this.#x(e?[...this.#r,t]:this.#r.filter(o=>o!==t)),this.#C())}#O(t){this.#G(t,!this.#r.includes(t))}#$(t){this.#f!=="multi"||f(this)||(this.#e=t?this.#n.map(e=>e.id):[],this.#C())}#j(){this.#o.replaceChildren(),this.#p.clear(),this.#T.clear(),this.#l=void 0,this.#d=void 0,this.#u=void 0,this.#s=void 0,this.#c=null,this.#g=void 0,this.#b=void 0;let t=document.createElement("style");t.textContent=Me,this.#o.append(t)}#W(t){this.#j();let e=document.createElement("div");e.part.add("unavailable"),e.setAttribute("role","status");let r=document.createElement("span");r.part.add("reason"),r.textContent=t,e.append("Table unavailable: ",r),this.#o.append(e)}#F(){let t=this.#a;if(t===void 0)return;this.#j();let e=document.createElement("div");e.part.add("container"),e.tabIndex=0,e.addEventListener("keydown",a=>this.#Y(a)),e.addEventListener("focus",()=>{this.#h===null&&this.#n.length>0&&(this.#h=this.#n[0].id,this.#R())}),this.#l=e;let r=document.createElement("table");if(r.part.add("table"),t.label!==void 0&&t.label!==""){let a=document.createElement("caption");a.part.add("caption"),a.textContent=t.label,r.append(a)}if(r.append(this.#K(t),this.#U(t)),e.append(r),this.#n.length===0){let a=document.createElement("div");a.part.add("empty"),a.textContent="No rows.",e.append(a)}let o=document.createElement("div");o.part.add("frame"),o.append(e),this.#I&&o.append(this.#V()),this.#d=o,this.#o.append(o),this.#R()}#K(t){let e=document.createElement("thead"),r=document.createElement("tr");if(r.part.add("header-row"),this.#f!=="none"){let o=document.createElement("th");if(o.part.add("select-head"),o.setAttribute("scope","col"),this.#f==="multi"){let a=document.createElement("input");a.type="checkbox",a.part.add("select-all"),a.setAttribute("aria-label","Select every row"),a.addEventListener("change",()=>this.#$(a.checked)),this.#g=a,o.append(a)}r.append(o)}for(let o of t.columns){let a=document.createElement("th");a.part.add("column-header"),a.setAttribute("scope","col"),a.dataset.columnHeader=o.id,o.align==="right"&&(a.dataset.align="right");let i=document.createElement("span");i.part.add("header-cell-inner");let s;if(this.#A==="none"){let l=document.createElement("span");l.textContent=o.label,i.append(l)}else s=document.createElement("button"),s.type="button",s.part.add("column-toggle"),s.dataset.columnToggle=o.id,s.setAttribute("aria-pressed","false"),s.setAttribute("aria-label",`Select the ${o.label} column`),s.textContent=o.label,s.addEventListener("click",()=>this.#O(o.id)),i.append(s);let c=this.#I?this.#H({kind:"column",columnId:o.id},`the ${o.label} column`):void 0;c!==void 0&&i.append(c),a.append(i),r.append(a),this.#T.set(o.id,{toggle:s,...c===void 0?{}:{comment:c},cells:[],head:a})}if(this.#I){let o=document.createElement("th");o.part.add("comment-head"),o.setAttribute("scope","col"),this.#b=this.#H({kind:"whole"},"this table"),o.append(this.#b),r.append(o)}return e.append(r),e}#U(t){let e=document.createElement("tbody");for(let r of this.#n){let o=document.createElement("tr");o.part.add("row"),o.dataset.rowId=r.id,o.tabIndex=-1,o.addEventListener("mouseenter",()=>this.#B(r.id)),o.addEventListener("focusin",()=>this.#B(r.id));let a;if(this.#f!=="none"){let s=document.createElement("td");s.part.add("select-cell");let c=document.createElement("input");c.type=this.#f==="single"?"radio":"checkbox",c.part.add("row-control"),this.#f==="single"&&(c.name=`${this.#i??"crtr-table"}-row`),c.value=r.id,c.setAttribute("aria-label",`Select row ${r.id}`),c.addEventListener("change",()=>this.#k(r.id,c.checked)),a=c,s.append(c),o.append(s)}for(let s of t.columns){let c=document.createElement("td");c.part.add("cell"),c.dataset.columnId=s.id,s.align==="right"&&(c.dataset.align="right"),s.mono===!0&&(c.dataset.mono="true"),c.textContent=Le(r.cells[s.id]),o.append(c),this.#T.get(s.id)?.cells.push(c)}let i;if(this.#I){let s=document.createElement("td");s.part.add("comment-cell"),i=this.#H({kind:"row",rowId:r.id},`row ${r.id}`),s.append(i),o.append(s)}e.append(o),this.#p.set(r.id,{tr:o,...a===void 0?{}:{control:a},...i===void 0?{}:{comment:i}})}return e}get#I(){return L(this.#i)}#H(t,e){let r=document.createElement("button");return r.type="button",r.part.add("comment-trigger"),r.setAttribute("aria-label",`Comment on ${e}`),r.dataset.commentTarget=e,r.append($e()),r.addEventListener("click",()=>this.#N(t,r)),r}#V(){let t=document.createElement("div");t.part.add("comment-editor"),t.hidden=!0,t.setAttribute("role","dialog"),t.setAttribute("aria-label","Comment");let e=document.createElement("p");e.part.add("comment-target"),t.append(e);let r=document.createElement("textarea");r.part.add("comment-input"),r.placeholder="What should the agent know about this?",r.addEventListener("keydown",l=>{l.key==="Enter"&&(l.metaKey||l.ctrlKey)?(l.preventDefault(),this.#q()):l.key==="Escape"&&(l.preventDefault(),this.#z())}),t.append(r);let o=document.createElement("div");o.part.add("comment-actions");let a=document.createElement("span");a.part.add("comment-hint"),o.append(a);let i=document.createElement("span"),s=document.createElement("button");s.type="button",s.part.add("comment-cancel"),s.textContent="Cancel",s.addEventListener("click",()=>this.#z());let c=document.createElement("button");return c.type="button",c.part.add("comment-save"),c.textContent="Save",c.addEventListener("click",()=>this.#q()),i.append(s," ",c),o.append(i),t.append(o),this.#u=t,this.#m=e,this.#E=r,this.#L=a,t}#N(t,e){let r=this.#u,o=this.#d;if(r===void 0||o===void 0||!this.#I||f(this))return;this.#c=t,this.#s=e;let a=y(this.#t,t);this.#E!==void 0&&(this.#E.value=a?.text??""),this.#m!==void 0&&(this.#m.textContent=`Comment on ${e.dataset.commentTarget??st(t)}`),this.#L!==void 0&&(this.#L.textContent=a===void 0?"\u2318\u21B5 to save":"empty to delete");let i=o.getBoundingClientRect(),s=e.getBoundingClientRect();r.hidden=!1,r.style.right=`${Math.max(0,i.right-s.right)}px`,r.style.top="0px";let c=r.getBoundingClientRect().height,l=s.bottom+at+c<=window.innerHeight,h=s.top-at-c>=0;r.style.top=!l&&h?`${s.top-at-c-i.top}px`:`${s.bottom+at-i.top}px`,this.#R(),this.#E?.focus()}#z(){let t=this.#s;this.#c=null,this.#s=void 0,this.#u!==void 0&&(this.#u.hidden=!0),this.#R(),t?.focus()}#q(){let t=this.#c;t===null||f(this)||(this.#t=z(this.#t,t,this.#E?.value??""),this.#z(),this.#C())}#B(t){this.#h!==t&&(this.#h=t,this.#R())}#X(t){let e=this.#p.get(t);(e?.control??e?.tr)?.focus()}#Y(t){if(t.metaKey||t.ctrlKey||t.altKey)return;let e=t.composedPath()[0]??t.target;if(Re(e))return;let r=t.key.toLowerCase();if(r!=="j"&&r!=="k"&&r!=="x"&&r!=="c")return;let o=e instanceof HTMLElement?e.closest("[data-column-header]")?.dataset.columnHeader:void 0;if(o!==void 0&&(r==="x"||r==="c")){if(t.preventDefault(),r==="x")this.#O(o);else{let c=this.#T.get(o)?.comment;c!==void 0&&this.#N({kind:"column",columnId:o},c)}return}let a=this.#n.map(c=>c.id);if(a.length===0)return;let i=this.#h??this.#e[this.#e.length-1]??a[0];if(r==="j"||r==="k"){t.preventDefault();let c=Math.max(0,a.indexOf(i)),l=a[(c+(r==="j"?1:-1)+a.length)%a.length];this.#B(l),this.#X(l);return}if(t.preventDefault(),r==="x"){this.#M(i);return}let s=this.#p.get(i)?.comment;s!==void 0&&this.#N({kind:"row",rowId:i},s)}#D(t,e){let r=y(this.#t,e),o=t.dataset.commentTarget??st(e);t.dataset.hasComment=r===void 0?"false":"true",t.setAttribute("aria-label",r===void 0?`Comment on ${o}`:`Edit comment on ${o}`),t.title=r?.text??"",t.querySelector("path")?.setAttribute("fill",r===void 0?"none":"currentColor"),t.dataset.open=this.#J(e)?"true":"false"}#J(t){let e=this.#c;return e===null||e.kind!==t.kind?!1:e.kind==="row"&&t.kind==="row"?e.rowId===t.rowId:e.kind==="column"&&t.kind==="column"?e.columnId===t.columnId:e.kind==="whole"}#R(){for(let[t,e]of this.#p){let r=this.#e.includes(t);r?e.tr.dataset.state="selected":delete e.tr.dataset.state,e.tr.dataset.active=this.#h===t?"true":"false",e.tr.setAttribute("aria-selected",r?"true":"false"),e.control!==void 0&&(e.control.checked=r),e.comment!==void 0&&this.#D(e.comment,{kind:"row",rowId:t})}for(let[t,e]of this.#T){let r=this.#r.includes(t);e.toggle?.setAttribute("aria-pressed",r?"true":"false"),e.head.dataset.columnSelected=r?"true":"false";for(let o of e.cells)o.dataset.columnSelected=r?"true":"false";e.comment!==void 0&&this.#D(e.comment,{kind:"column",columnId:t})}if(this.#b!==void 0&&this.#D(this.#b,{kind:"whole"}),this.#g!==void 0){let t=this.#n.length>0&&this.#e.length===this.#n.length;this.#g.checked=t,this.#g.indeterminate=this.#e.length>0&&!t}this.#y()}};w("crtr-table",xt);var He=`
-  :host {
-    display: block;
-    /* Column count answers the element's own width, not the viewport: a slot can sit in
-       a narrow rail on a wide screen. */
-    container-type: inline-size;
-  }
-
-  [part~="container"] {
-    display: flex;
-    flex-direction: column;
-    gap: var(--crtr-cards-container-gap, var(--crtr-space-1));
-  }
-
-  /* The question reads as the agent's own prose above its control, matching the table's
-     caption rather than shouting over the cards it introduces. The container's gap is a
-     hairline, so the breathing room under the prompt is the prompt's own. */
-  [part~="label"] {
-    margin: 0 0 var(--crtr-cards-label-gap, var(--crtr-space-2));
-    color: var(--crtr-cards-label-text-color, var(--crtr-color-text-muted));
-  }
-
-  /* The column count is anatomy rather than paint \u2014 a container query cannot read a custom
-     property, so the breakpoint below stays a literal. */
-  [part~="grid"] {
-    display: grid;
-    grid-template-columns: minmax(0, 1fr);
-    gap: var(--crtr-cards-grid-gap, var(--crtr-space-3));
-  }
-
-  @container (min-width: 30rem) {
-    [part~="grid"] {
-      grid-template-columns: repeat(2, minmax(0, 1fr));
-    }
-
-    [part~="grid"][data-columns="3"] {
-      grid-template-columns: repeat(3, minmax(0, 1fr));
-    }
-  }
-
-  [part~="card"] {
-    display: flex;
-    flex-direction: column;
-    gap: var(--crtr-cards-card-gap, var(--crtr-space-2));
-    padding: var(--crtr-cards-card-padding, var(--crtr-space-3));
-    color: var(--crtr-cards-card-text-color, var(--crtr-color-text));
-    background: var(--crtr-cards-card-fill, var(--crtr-color-surface));
-    border: var(--crtr-cards-card-border-width, 1px)
-      var(--crtr-cards-card-border-style, solid)
-      var(--crtr-cards-card-border-color, color-mix(in srgb, var(--crtr-color-border) 60%, transparent));
-    border-radius: var(--crtr-cards-card-radius, var(--crtr-radius-medium));
-    /* The whole card is the target, not just its heading \u2014 see the click handler. */
-    cursor: pointer;
-    transition: background-color var(--crtr-cards-card-transition, 120ms ease),
-      border-color var(--crtr-cards-card-transition, 120ms ease);
-  }
-
-  [part~="card"]:has([part~="control"]:disabled) {
-    cursor: default;
-  }
-
-  [part~="card"]:hover,
-  [part~="card"][part~="active"] {
-    background: var(--crtr-cards-card-hover-fill, var(--crtr-color-surface-hover));
-    border-color: var(--crtr-cards-card-hover-border-color, var(--crtr-color-border));
-  }
-
-  [part~="card"][part~="selected"] {
-    background: var(--crtr-cards-card-selected-fill, color-mix(in srgb, var(--crtr-color-accent) 10%, transparent));
-    border-color: var(--crtr-cards-card-selected-border-color, color-mix(in srgb, var(--crtr-color-accent) 45%, transparent));
-  }
-
-  [part~="card"][part~="selected"]:hover,
-  [part~="card"][part~="selected"][part~="active"] {
-    background: var(--crtr-cards-card-selected-hover-fill, color-mix(in srgb, var(--crtr-color-accent) 14%, transparent));
-  }
-
-  [part~="card-header"] {
-    display: flex;
-    align-items: flex-start;
-    gap: var(--crtr-cards-card-header-gap, var(--crtr-space-2));
-  }
-
-  /* The label carries the click target, so the whole heading toggles the native control
-     the way the kit's Label does \u2014 and the comment button stays its own control. */
-  [part~="card-label"] {
-    display: flex;
-    flex: 1;
-    align-items: flex-start;
-    gap: var(--crtr-cards-card-label-gap, var(--crtr-space-2));
-    min-width: 0;
-    font: var(--crtr-cards-card-label-font, inherit);
-    cursor: pointer;
-  }
-
-  ${F({scope:"cards-control"},'[part~="control"]')}
-
-  /* Centred on the card's title line, which sets its own tighter line-height. The box size
-     is read back through --control-box, the local the recipe above resolves it into, so a
-     host that resizes the control keeps it centred without touching this offset. */
-  [part~="control"] {
-    margin-top: var(--crtr-cards-control-offset, calc((1.35em - var(--control-box)) / 2));
-  }
-
-  [part~="card-heading"] {
-    display: grid;
-    flex: 1;
-    gap: var(--crtr-cards-card-heading-gap, calc(var(--crtr-space-1) / 2));
-    min-width: 0;
-  }
-
-  [part~="card-title"] {
-    font-weight: var(--crtr-cards-card-title-font-weight, 500);
-    line-height: var(--crtr-cards-card-title-line-height, 1.35);
-  }
-
-  [part~="card-subtitle"] {
-    color: var(--crtr-cards-card-subtitle-text-color, var(--crtr-color-text-muted));
-    font-size: var(--crtr-cards-card-subtitle-font-size, 0.875em);
-  }
-
-  [part~="card-body"] {
-    margin: var(--crtr-cards-card-body-margin, 0);
-    color: var(--crtr-cards-card-body-text-color, var(--crtr-color-text-muted));
-    font-size: var(--crtr-cards-card-body-font-size, 0.875em);
-    line-height: var(--crtr-cards-card-body-line-height, 1.6);
-  }
-
-  [part~="tag"] {
-    align-self: flex-start;
-    padding: var(--crtr-cards-tag-padding, 0 var(--crtr-space-1));
-    color: var(--crtr-cards-tag-text-color, var(--crtr-color-text-muted));
-    font-size: var(--crtr-cards-tag-font-size, 0.75em);
-    line-height: var(--crtr-cards-tag-line-height, 1.7);
-    border: var(--crtr-cards-tag-border-width, 1px)
-      var(--crtr-cards-tag-border-style, solid)
-      var(--crtr-cards-tag-border-color, var(--crtr-color-border));
-    border-radius: var(--crtr-cards-tag-radius, var(--crtr-radius-small));
-  }
-
-  [part~="card"][part~="selected"] [part~="tag"] {
-    color: var(--crtr-cards-tag-selected-text-color, var(--crtr-color-accent));
-    background: var(--crtr-cards-tag-selected-fill, color-mix(in srgb, var(--crtr-color-accent) 10%, transparent));
-    border-color: var(--crtr-cards-tag-selected-border-color, color-mix(in srgb, var(--crtr-color-accent) 45%, transparent));
-  }
-
-  /* The affordance is quiet until you reach for it, and stays visible once a note lives
-     there \u2014 that presence is the whole "there is a comment here" signal. */
-  [part~="comment-button"] {
-    flex: none;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    /* One knob: the affordance is a square, so its width and height are the same value. */
-    width: var(--crtr-cards-comment-button-size, 1.5em);
-    height: var(--crtr-cards-comment-button-size, 1.5em);
-    padding: var(--crtr-cards-comment-button-padding, 0);
-    color: var(--crtr-cards-comment-button-text-color, var(--crtr-color-text-muted));
-    background: var(--crtr-cards-comment-button-fill, none);
-    border: var(--crtr-cards-comment-button-border-width, 1px)
-      var(--crtr-cards-comment-button-border-style, solid)
-      var(--crtr-cards-comment-button-border-color, transparent);
-    border-radius: var(--crtr-cards-comment-button-radius, var(--crtr-radius-small));
-    cursor: pointer;
-    opacity: var(--crtr-cards-comment-button-resting-opacity, 0);
-    transition: opacity var(--crtr-cards-comment-button-transition, var(--crtr-control-transition, 120ms ease)),
-      color var(--crtr-cards-comment-button-transition, var(--crtr-control-transition, 120ms ease)),
-      background-color var(--crtr-cards-comment-button-transition, var(--crtr-control-transition, 120ms ease));
-  }
-
-  [part~="comment-button"] svg {
-    width: var(--crtr-cards-comment-button-icon-size, 0.875em);
-    height: var(--crtr-cards-comment-button-icon-size, 0.875em);
-    fill: var(--crtr-cards-comment-button-icon-fill, none);
-    stroke: var(--crtr-cards-comment-button-icon-stroke-color, currentColor);
-    stroke-width: var(--crtr-cards-comment-button-icon-stroke-width, 2);
-    stroke-linecap: var(--crtr-cards-comment-button-icon-line-cap, round);
-    stroke-linejoin: var(--crtr-cards-comment-button-icon-line-join, round);
-    /* The glyph is never the event target: a repaint that swaps it mid-press would
-       otherwise leave mousedown and mouseup on different nodes and eat the click. */
-    pointer-events: none;
-  }
-
-  [part~="comment-button"]:hover {
-    color: var(--crtr-cards-comment-button-hover-text-color, var(--crtr-color-text));
-    background: var(--crtr-cards-comment-button-hover-fill, var(--crtr-color-surface-hover));
-  }
-
-  [part~="comment-button"][part~="has-comment"] {
-    color: var(--crtr-cards-comment-button-noted-text-color, var(--crtr-color-accent));
-  }
-
-${u({scope:"cards-comment-button"},'[part~="comment-button"]')}
-  [part~="card"]:hover [part~="comment-button"],
-  [part~="card"]:focus-within [part~="comment-button"],
-  [part~="comment-button"]:focus-visible,
-  [part~="comment-button"][part~="has-comment"] {
-    opacity: var(--crtr-cards-comment-button-revealed-opacity, 1);
-  }
-
-  [part~="comment-editor"] {
-    display: grid;
-    gap: var(--crtr-cards-comment-editor-gap, var(--crtr-space-2));
-    width: 100%;
-    padding: var(--crtr-cards-comment-editor-padding, var(--crtr-space-2));
-    text-align: var(--crtr-cards-comment-editor-text-align, left);
-    background: var(--crtr-cards-comment-editor-fill, var(--crtr-color-background));
-    border: var(--crtr-cards-comment-editor-border-width, 1px)
-      var(--crtr-cards-comment-editor-border-style, solid)
-      var(--crtr-cards-comment-editor-border-color, var(--crtr-color-border));
-    border-radius: var(--crtr-cards-comment-editor-radius, var(--crtr-radius-small));
-    cursor: auto;
-  }
-
-  /* The editor's own prose, in the page's voice \u2014 not a caps-mono field label shouting a
-     card id at someone who just clicked that card. */
-  [part~="comment-subject"] {
-    color: var(--crtr-cards-comment-subject-text-color, var(--crtr-color-text-muted));
-    font-size: var(--crtr-cards-comment-subject-font-size, 0.875em);
-  }
-
-  [part~="comment-hint"] {
-    color: var(--crtr-cards-comment-hint-text-color, var(--crtr-color-text-muted));
-    font-size: var(--crtr-cards-comment-hint-font-size, 0.875em);
-  }
-
-${S({scope:"cards-comment-input"},'[part~="comment-input"]')}
-  [part~="comment-input"] {
-    min-height: var(--crtr-cards-comment-input-min-height, 4.5em);
-    resize: vertical;
-  }
-
-  [part~="comment-actions"] {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    gap: var(--crtr-cards-comment-actions-gap, var(--crtr-space-2));
-  }
-
-  [part~="comment-buttons"] {
-    display: flex;
-    gap: var(--crtr-cards-comment-buttons-gap, var(--crtr-space-1));
-  }
-
-  [part~="comment-cancel"] {
-    padding: var(--crtr-cards-comment-cancel-padding, var(--crtr-space-1) var(--crtr-space-2));
-    color: var(--crtr-cards-comment-cancel-text-color, var(--crtr-color-text-muted));
-    font: var(--crtr-cards-comment-cancel-font, inherit);
-    font-size: var(--crtr-cards-comment-cancel-font-size, 0.875em);
-    background: var(--crtr-cards-comment-cancel-fill, none);
-    border: var(--crtr-cards-comment-cancel-border-width, 1px)
-      var(--crtr-cards-comment-cancel-border-style, solid)
-      var(--crtr-cards-comment-cancel-border-color, transparent);
-    border-radius: var(--crtr-cards-comment-cancel-radius, var(--crtr-radius-small));
-    cursor: pointer;
-    transition: color var(--crtr-cards-comment-cancel-transition, var(--crtr-control-transition, 120ms ease)),
-      background-color var(--crtr-cards-comment-cancel-transition, var(--crtr-control-transition, 120ms ease)),
-      border-color var(--crtr-cards-comment-cancel-transition, var(--crtr-control-transition, 120ms ease));
-  }
-
-  [part~="comment-cancel"]:hover {
-    color: var(--crtr-cards-comment-cancel-hover-text-color, var(--crtr-color-text));
-    background: var(--crtr-cards-comment-cancel-hover-fill, var(--crtr-color-surface-hover));
-  }
-
-  [part~="comment-save"] {
-    padding: var(--crtr-cards-comment-save-padding, var(--crtr-space-1) var(--crtr-space-2));
-    color: var(--crtr-cards-comment-save-text-color, var(--crtr-color-accent-contrast));
-    font: var(--crtr-cards-comment-save-font, inherit);
-    font-size: var(--crtr-cards-comment-save-font-size, 0.875em);
-    background: var(--crtr-cards-comment-save-fill, var(--crtr-color-accent));
-    border: var(--crtr-cards-comment-save-border-width, 1px)
-      var(--crtr-cards-comment-save-border-style, solid)
-      var(--crtr-cards-comment-save-border-color, var(--crtr-color-accent));
-    border-radius: var(--crtr-cards-comment-save-radius, var(--crtr-radius-small));
-    cursor: pointer;
-    transition: color var(--crtr-cards-comment-save-transition, var(--crtr-control-transition, 120ms ease)),
-      background-color var(--crtr-cards-comment-save-transition, var(--crtr-control-transition, 120ms ease)),
-      border-color var(--crtr-cards-comment-save-transition, var(--crtr-control-transition, 120ms ease));
-  }
-
-  /* Mixing toward the text colour darkens on a light token set and lightens on a dark one \u2014
-     a brightness filter moves the wrong way on one of them. */
-  [part~="comment-save"]:hover {
-    background: var(--crtr-cards-comment-save-hover-fill, color-mix(in srgb, var(--crtr-color-accent) 88%, var(--crtr-color-text)));
-    border-color: var(--crtr-cards-comment-save-hover-border-color, color-mix(in srgb, var(--crtr-color-accent) 88%, var(--crtr-color-text)));
-  }
-
-${u({scope:"cards-comment-cancel"},'[part~="comment-cancel"]')}
-${u({scope:"cards-comment-save"},'[part~="comment-save"]')}
-  /* These sit in the flow of the page rather than above it, so they carry no elevation \u2014
-     a shadow in this bundle means floating (a popover, an editor). Each state keeps its own
-     scope even though their kit defaults match: one scope never names two different parts. */
-  [part~="unavailable"] {
-    padding: var(--crtr-cards-unavailable-padding, var(--crtr-space-3));
-    color: var(--crtr-cards-unavailable-text-color, var(--crtr-color-text-muted));
-    background: var(--crtr-cards-unavailable-fill, var(--crtr-color-surface));
-    border: var(--crtr-cards-unavailable-border-width, 1px)
-      var(--crtr-cards-unavailable-border-style, solid)
-      var(--crtr-cards-unavailable-border-color, var(--crtr-color-border));
-    border-radius: var(--crtr-cards-unavailable-radius, var(--crtr-radius-medium));
-  }
-
-  [part~="empty"] {
-    padding: var(--crtr-cards-empty-padding, var(--crtr-space-3));
-    color: var(--crtr-cards-empty-text-color, var(--crtr-color-text-muted));
-    background: var(--crtr-cards-empty-fill, var(--crtr-color-surface));
-    border: var(--crtr-cards-empty-border-width, 1px)
-      var(--crtr-cards-empty-border-style, solid)
-      var(--crtr-cards-empty-border-color, var(--crtr-color-border));
-    border-radius: var(--crtr-cards-empty-radius, var(--crtr-radius-medium));
-  }
-
-  [part~="loading"] {
-    padding: var(--crtr-cards-loading-padding, var(--crtr-space-3));
-    color: var(--crtr-cards-loading-text-color, var(--crtr-color-text-muted));
-    background: var(--crtr-cards-loading-fill, var(--crtr-color-surface));
-    border: var(--crtr-cards-loading-border-width, 1px)
-      var(--crtr-cards-loading-border-style, solid)
-      var(--crtr-cards-loading-border-color, var(--crtr-color-border));
-    border-radius: var(--crtr-cards-loading-radius, var(--crtr-radius-medium));
-  }
-
-  [part~="kind"] {
-    color: var(--crtr-cards-kind-text-color, var(--crtr-color-text));
-    font-family: var(--crtr-cards-kind-font-family, var(--crtr-font-mono));
-  }
-
-  [part~="reason"] {
-    display: block;
-    margin-top: var(--crtr-cards-reason-gap, var(--crtr-space-1));
-    font-size: var(--crtr-cards-reason-font-size, 0.875em);
-  }
-`,ze=new Set(["id","title","subtitle","body","tag"]);function Oe(n){if(n===null||typeof n!="object"||Array.isArray(n))return null;let t=n;if(typeof t.id!="string"||t.id===""||typeof t.title!="string"||t.title==="")return null;for(let e of["subtitle","body","tag"])if(t[e]!==void 0&&typeof t[e]!="string")return null;for(let e of Object.keys(t))if(!ze.has(e))return null;return{id:t.id,title:t.title,subtitle:t.subtitle,body:t.body,tag:t.tag}}function Ie(n){if(!Array.isArray(n))return null;let t=[],e=new Set;for(let r of n){let o=Oe(r);if(o===null||e.has(o.id))return null;e.add(o.id),t.push(o)}return t}var Ne=new Set(["label","cards","mode","columns"]),Yt="prompt-label";function je(n){for(let a of Object.keys(n))if(!Ne.has(a))return{status:"invalid",reason:`unknown config property "${a}"`};let t=n.label;if(t!==void 0&&typeof t!="string")return{status:"invalid",reason:"label must be a string"};let e=n.mode;if(e!=="single"&&e!=="multi")return{status:"invalid",reason:'mode must be "single" or "multi"'};let r=n.columns;if(r!==void 0&&r!==2&&r!==3)return{status:"invalid",reason:"columns must be 2 or 3"};let o;if(n.cards!==void 0){let a=Ie(n.cards);if(a===null)return{status:"invalid",reason:"cards must be a list of uniquely identified cards"};o=a}return{status:"ok",config:{label:t,cards:o,mode:e,columns:r}}}function Be(n){return n instanceof HTMLTextAreaElement||n instanceof HTMLElement&&n.isContentEditable?!0:n instanceof HTMLInputElement?n.type!=="checkbox"&&n.type!=="radio":!1}var yt="http://www.w3.org/2000/svg";function De(n){let t=document.createElementNS(yt,"svg");t.setAttribute("viewBox","0 0 24 24"),t.setAttribute("aria-hidden","true");let e=document.createElementNS(yt,"path");e.setAttribute("d","M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"),t.append(e);let r=n?[["7","9","17","9"],["7","13","13","13"]]:[["12","7","12","13"],["9","10","15","10"]];for(let[o,a,i,s]of r){let c=document.createElementNS(yt,"line");c.setAttribute("x1",o??"0"),c.setAttribute("y1",a??"0"),c.setAttribute("x2",i??"0"),c.setAttribute("y2",s??"0"),t.append(c)}return t}function Pe(n){if(n===void 0||n==="")return null;let t=document.createElement("p");return t.part.add("label"),t.id=Yt,t.textContent=n,t}var Vt=0,wt=class extends HTMLElement{static observedAttributes=["inert"];#o=document.createElement("div");#i;#a=null;#n=null;#e=[];#r;#t=[];#h=[];#c=null;#s=new Map;#l=null;#d=null;constructor(){super(),Vt+=1,this.#i=`crtr-cards-${Vt}`;let t=this.attachShadow({mode:"open"}),e=document.createElement("style");e.textContent=He,this.#o.part.add("container"),this.#o.addEventListener("keydown",r=>this.#A(r)),t.append(e,this.#o)}connectedCallback(){let t=T(this);if(t.status!=="ok"){this.#E(t.reason);return}let e=je(t.config);if(e.status!=="ok"){this.#E(e.reason);return}this.#a=e.config,this.#r=D(this),this.#r!==void 0&&B(this,this.#r,()=>this.#k()),this.#n=Pe(e.config.label),this.#e=e.config.cards??[],this.#m(),this.#p()}attributeChangedCallback(){this.isConnected&&this.#u()}#u(){let t=f(this);j(this.#o,t),t&&this.#l!==null&&this.#v(!1)}#m(){if(this.#r===void 0)return;let t=N(this.#r);if(t===void 0)return;let e=this.#e.map(r=>r.id).filter(r=>q(t.selectedCardIds).includes(r));this.#t=this.#a?.mode==="single"?e.slice(0,1):e,this.#h=O(t.comments)}#E(t){this.#s.clear(),this.#l=null,this.#d=null;let e=document.createElement("div");e.part.add("unavailable"),e.setAttribute("role","status");let r=document.createElement("span");r.part.add("kind"),r.textContent="cards";let o=document.createElement("span");o.part.add("reason"),o.textContent=t,e.append("Component unavailable: ",r,o),this.#g(e)}#L(t,e){let r=document.createElement("div");r.part.add(t),r.setAttribute("role","status"),r.textContent=e,this.#g(r)}#g(t){this.#n===null?this.#o.replaceChildren(t):this.#o.replaceChildren(this.#n,t)}#p(){let t=this.#a;if(t===null)return;this.#s.clear(),this.#l=null,this.#d=null;let e=new Set(this.#e.map(o=>o.id));if(this.#t=this.#t.filter(o=>e.has(o)),this.#h=this.#h.filter(o=>o.anchor.kind!=="card"||e.has(o.anchor.cardId)),this.#e.length===0){this.#L("empty","No cards to choose from.");return}let r=document.createElement("div");r.part.add("grid"),t.columns===3&&(r.dataset.columns="3"),this.#n!==null&&(r.setAttribute("role",t.mode==="single"?"radiogroup":"group"),r.setAttribute("aria-labelledby",Yt)),r.append(...this.#e.map(o=>this.#T(o,t.mode,this.#i))),this.#g(r),this.#b()}#T(t,e,r){let o=document.createElement("div");o.part.add("card"),o.dataset.cardId=t.id;let a=document.createElement("div");a.part.add("card-header");let i=document.createElement("label");i.part.add("card-label");let s=document.createElement("input");s.part.add("control"),s.type=e==="single"?"radio":"checkbox",s.name=r,s.value=t.id,s.addEventListener("change",()=>this.#f(t.id,s.checked)),s.addEventListener("focus",()=>this.#S(t.id,!1));let c=document.createElement("span");c.part.add("card-heading");let l=document.createElement("span");if(l.part.add("card-title"),l.textContent=t.title,c.append(l),t.subtitle!==void 0&&t.subtitle!==""){let p=document.createElement("span");p.part.add("card-subtitle"),p.textContent=t.subtitle,c.append(p)}let h;if(L(this.#r)&&(h=document.createElement("button"),h.type="button",h.part.add("comment-button"),h.addEventListener("click",p=>{p.stopPropagation(),this.#S(t.id,!1),this.#w({kind:"card",cardId:t.id},t.title,o,null)})),i.append(s,c),a.append(i),h!==void 0&&a.append(h),o.append(a),t.body!==void 0&&t.body!==""){let p=document.createElement("p");p.part.add("card-body"),p.textContent=t.body,o.append(p)}let g=null;return t.tag!==void 0&&t.tag!==""&&(g=document.createElement("span"),g.part.add("tag"),g.textContent=t.tag,o.append(g)),o.addEventListener("mouseenter",()=>this.#S(t.id,!1)),o.addEventListener("mouseleave",()=>{this.#c===t.id&&this.#S(null,!1)}),o.addEventListener("focusin",()=>this.#S(t.id,!1)),o.addEventListener("click",p=>{s.disabled||p.composedPath().includes(i)||document.getSelection()?.isCollapsed!==!1&&(this.#S(t.id,!1),this.#f(t.id,!this.#t.includes(t.id)))}),this.#s.set(t.id,{root:o,control:s,...h===void 0?{}:{commentButton:h},tag:g}),o}#b(){let t=this.#a?.mode??"multi",e=t==="single"?this.#t[0]??this.#e[0]?.id:void 0;for(let r of this.#e){let o=this.#s.get(r.id);if(o===void 0)continue;let a=this.#t.includes(r.id);o.root.part.toggle("selected",a),o.root.part.toggle("active",this.#c===r.id),o.control.checked=a,o.control.tabIndex=t==="single"&&r.id!==e?-1:0;let i=y(this.#h,{kind:"card",cardId:r.id});o.commentButton!==void 0&&this.#y(o.commentButton,i,r.title)}this.#u()}#y(t,e,r){let o=e!==void 0,a=t.part.contains("has-comment")!==o;t.part.toggle("has-comment",o),t.setAttribute("aria-label",o?`Edit comment on ${r}`:`Comment on ${r}`),o?t.title=e.text:t.removeAttribute("title"),(a||t.childElementCount===0)&&t.replaceChildren(De(o))}#S(t,e){this.#c===t&&!e||(this.#c=t,this.#b(),e&&t!==null&&this.#s.get(t)?.control.focus())}#f(t,e){if(!(this.#a===null||f(this))){if(this.#a.mode==="single")this.#t=[t];else{let r=e?[...this.#t,t]:this.#t.filter(o=>o!==t);this.#t=this.#e.map(o=>o.id).filter(o=>r.includes(o))}this.#b(),this.#M()}}#A(t){if(t.metaKey||t.ctrlKey||t.altKey||Be(t.target))return;let e=this.#e.map(a=>a.id);if(e.length===0)return;let r=t.key.toLowerCase(),o=this.#c??this.#t[this.#t.length-1]??e[0]??"";if(r==="j"||r==="k"){t.preventDefault();let a=Math.max(0,e.indexOf(o)),s=e[(a+(r==="j"?1:-1)+e.length)%e.length];s!==void 0&&this.#S(s,!0);return}if(r==="x"){t.preventDefault(),this.#f(o,this.#a?.mode==="single"?!0:!this.#t.includes(o));return}if(r==="c"){t.preventDefault();let a=this.#e.find(s=>s.id===o),i=this.#s.get(o);if(a===void 0||i?.commentButton===void 0)return;this.#S(o,!1),this.#w({kind:"card",cardId:a.id},a.title,i.root,null)}}#w(t,e,r,o){if(r===null||!L(this.#r)||f(this))return;let a=this.#l?.anchor,i=a!==void 0&&a.kind===t.kind&&(t.kind!=="card"||a.kind==="card"&&a.cardId===t.cardId);this.#v(!1),!i&&this.#C({anchor:t,target:e,mount:r,after:o})}#C(t){let e=document.createElement("div");e.part.add("comment-editor"),e.addEventListener("click",h=>h.stopPropagation());let r=document.createElement("p");r.part.add("comment-subject"),r.textContent=`Comment on ${t.target}`;let o=document.createElement("textarea");o.part.add("comment-input"),o.placeholder="What should the agent know about this?",o.value=y(this.#h,t.anchor)?.text??"";let a=document.createElement("div");a.part.add("comment-actions");let i=document.createElement("span");i.part.add("comment-hint"),i.textContent=y(this.#h,t.anchor)!==void 0?"empty to delete":"\u2318\u21B5 to save";let s=document.createElement("div");s.part.add("comment-buttons");let c=document.createElement("button");c.type="button",c.part.add("comment-cancel"),c.textContent="Cancel",c.addEventListener("click",()=>this.#v(!0));let l=document.createElement("button");l.type="button",l.part.add("comment-save"),l.textContent="Save",l.addEventListener("click",()=>this.#x(o.value)),s.append(c,l),a.append(i,s),o.addEventListener("keydown",h=>{if(h.key==="Enter"&&(h.metaKey||h.ctrlKey)){h.preventDefault(),this.#x(o.value);return}h.key==="Escape"&&(h.preventDefault(),this.#v(!0))}),e.append(r,o,a),t.after!==null?t.after.after(e):t.mount.append(e),this.#l=t,this.#d=e,o.focus()}#v(t){let e=this.#l;this.#d?.remove(),this.#d=null,this.#l=null,!(!t||e===null)&&e.anchor.kind==="card"&&this.#s.get(e.anchor.cardId)?.control.focus()}#x(t){let e=this.#l;e===null||f(this)||(this.#h=z(this.#h,e.anchor,t),this.#v(!0),this.#b(),this.#M())}#k(){return{selectedCardIds:[...this.#t],comments:this.#h.map(t=>({...t}))}}#M(){this.#r!==void 0&&M(this.#r,this.#k())}};w("crtr-cards",wt);var V=["var(--crtr-chart-1)","var(--crtr-chart-2)","var(--crtr-chart-3)","var(--crtr-chart-4)","var(--crtr-chart-5)"],_e="http://www.w3.org/2000/svg",kt=260,Xt=12,Ke=12,qe=28,Ge=5,Jt=88,We=5.8,Qt=14,Fe=/^\d{4}-\d{2}-\d{2}(?:[T ]|$)/,Ue=/^\d{4}-\d{2}-\d{2}$/,Ve=`
-  :host {
-    display: block;
-  }
-
-  [part="container"] {
-    display: flex;
-    flex-direction: column;
-    gap: var(--crtr-chart-container-gap, var(--crtr-space-2));
-    width: 100%;
-  }
-
-  [part="title"] {
-    color: var(--crtr-chart-title-text-color, var(--crtr-color-text));
-    font-weight: var(--crtr-chart-title-font-weight, 500);
-  }
-
-  [part="legend"] {
-    display: flex;
-    flex-wrap: wrap;
-    align-items: center;
-    gap: var(--crtr-chart-legend-gap, var(--crtr-space-1) var(--crtr-space-4));
-    color: var(--crtr-chart-legend-text-color, var(--crtr-color-text-muted));
-    font-size: var(--crtr-chart-legend-font-size, 0.875em);
-  }
-
-  [part="legend-item"] {
-    display: flex;
-    align-items: center;
-    gap: var(--crtr-chart-legend-item-gap, var(--crtr-space-1));
-    min-width: 0;
-  }
-
-  /* Sized against the legend's own text, not a spacing token doing a sizing job. One knob:
-     the swatch is a square, so its width and height are the same value. */
-  [part="legend-swatch"] {
-    flex: none;
-    width: var(--crtr-chart-legend-swatch-size, 0.75em);
-    height: var(--crtr-chart-legend-swatch-size, 0.75em);
-    border-radius: var(--crtr-chart-legend-swatch-radius, calc(var(--crtr-radius-small) * 0.5));
-  }
-
-  [part="legend-label"] {
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-  }
-
-  [part="plot"] {
-    width: 100%;
-  }
-
-  [part="chart"] {
-    display: block;
-    height: var(--crtr-chart-plot-height, 260px);
-    overflow: visible;
-  }
-
-  /* Waiting for data and having none hold the same space, but each stays in its own scope:
-     one scope never names two different parts. */
-  [part="empty"] {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    padding: var(--crtr-chart-empty-padding, 0 var(--crtr-space-4));
-    color: var(--crtr-chart-empty-text-color, var(--crtr-color-text-muted));
-    font-size: var(--crtr-chart-empty-font-size, 0.875em);
-    border: var(--crtr-chart-empty-border-width, 1px)
-      var(--crtr-chart-empty-border-style, dashed)
-      var(--crtr-chart-empty-border-color, var(--crtr-color-border));
-    border-radius: var(--crtr-chart-empty-radius, var(--crtr-radius-medium));
-  }
-
-  [part="status"] {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    padding: var(--crtr-chart-status-padding, 0 var(--crtr-space-4));
-    color: var(--crtr-chart-status-text-color, var(--crtr-color-text-muted));
-    font-size: var(--crtr-chart-status-font-size, 0.875em);
-    border: var(--crtr-chart-status-border-width, 1px)
-      var(--crtr-chart-status-border-style, dashed)
-      var(--crtr-chart-status-border-color, var(--crtr-color-border));
-    border-radius: var(--crtr-chart-status-radius, var(--crtr-radius-medium));
-  }
-
-  /* Flat: this sits in the flow of the page. A shadow in this bundle means floating. */
-  [part="unavailable"] {
-    padding: var(--crtr-chart-unavailable-padding, var(--crtr-space-3));
-    color: var(--crtr-chart-unavailable-text-color, var(--crtr-color-text-muted));
-    background: var(--crtr-chart-unavailable-fill, var(--crtr-color-surface));
-    border: var(--crtr-chart-unavailable-border-width, 1px)
-      var(--crtr-chart-unavailable-border-style, solid)
-      var(--crtr-chart-unavailable-border-color, var(--crtr-color-border));
-    border-radius: var(--crtr-chart-unavailable-radius, var(--crtr-radius-medium));
-  }
-
-  [part="reason"] {
-    color: var(--crtr-chart-reason-text-color, var(--crtr-color-text));
-    font-family: var(--crtr-chart-reason-font-family, var(--crtr-font-mono));
-  }
-
-  .grid {
-    stroke: var(--crtr-chart-grid-stroke-color, var(--crtr-color-border));
-    stroke-width: var(--crtr-chart-grid-stroke-width, 1);
-    opacity: var(--crtr-chart-grid-opacity, 0.45);
-  }
-
-  /* The gridline the marks are read against carries more weight than the rest. */
-  .grid.baseline {
-    opacity: var(--crtr-chart-grid-baseline-opacity, 0.9);
-  }
-
-  .tick {
-    fill: var(--crtr-chart-tick-text-color, var(--crtr-color-text-muted));
-    font-size: var(--crtr-chart-tick-font-size, 0.75em);
-  }
-
-  /* Mark paint. Series colour arrives per node from the theme's chart ramp; everything
-     these marks are drawn WITH is a knob, which is why none of it is an SVG attribute. */
-  [part="line"] {
-    stroke-width: var(--crtr-chart-line-stroke-width, 2);
-    stroke-linecap: var(--crtr-chart-line-line-cap, round);
-    stroke-linejoin: var(--crtr-chart-line-line-join, round);
-  }
-
-  [part="area"] {
-    fill-opacity: var(--crtr-chart-area-fill-opacity, 0.18);
-  }
-
-  [part="point"] {
-    r: var(--crtr-chart-point-radius, 2.5);
-  }
-
-  /* A bar never rounds away more than a third of its own width, and --bar-max-radius is
-     that width \u2014 the one number here the stylesheet cannot know, so the plot writes it onto
-     the SVG and the knob is clamped against it. */
-  [part="bar"] {
-    rx: min(var(--crtr-chart-bar-radius, 2px), var(--bar-max-radius));
-  }
-`;function Ye(n){let t=n.kind;if(t!=="line"&&t!=="bar"&&t!=="area")return{status:"invalid",reason:"chart kind must be line, bar or area"};let e=n.x;if(typeof e!="string"||e==="")return{status:"invalid",reason:"chart config has no x field"};if(!Array.isArray(n.y)||n.y.length===0)return{status:"invalid",reason:"chart config has no y series"};let r=[];for(let[o,a]of n.y.entries()){if(a===null||typeof a!="object"||Array.isArray(a))return{status:"invalid",reason:`chart series #${o} is not { field, label? }`};let i=a;if(typeof i.field!="string"||i.field==="")return{status:"invalid",reason:`chart series #${o} has no field`};if(i.label!==void 0&&typeof i.label!="string")return{status:"invalid",reason:`chart series "${i.field}" label is not a string`};r.push({field:i.field,label:i.label})}return n.title!==void 0&&typeof n.title!="string"?{status:"invalid",reason:"chart title is not a string"}:{status:"ok",config:{kind:t,x:e,y:r,title:n.title,data:n.data}}}function Xe(n){return Array.isArray(n)&&n.every(t=>t!==null&&typeof t=="object"&&!Array.isArray(t))}function Zt(n,t){return t.split(".").reduce((e,r)=>{if(!(e==null||typeof e!="object"))return e[r]},n)}function Et(n){return n.includes(" ")?n:(n.includes(".")?n.split(".").pop()??n:n).replace(/[_-]+/g," ").replace(/([a-z])([A-Z])/g,"$1 $2").split(/\s+/).filter(Boolean).map(e=>e.charAt(0).toUpperCase()+e.slice(1)).join(" ")}function Je(n){if(typeof n=="number")return Number.isFinite(n)?n:null;if(typeof n=="boolean")return n?1:0;if(typeof n=="bigint")return Number(n);if(typeof n=="string"){let t=n.replace(/[\s,_]/g,"").replace(/^[$£€¥]/,"").replace(/%$/,"");if(t===""||t==="-")return null;let e=Number(t);return Number.isFinite(e)?e:null}return null}function Qe(n){if(n==null)return"";if(n instanceof Date)return Number.isNaN(n.getTime())?"":n.toLocaleDateString(void 0,{month:"short",day:"numeric"});if(typeof n=="string"){let t=n.trim();if(Fe.test(t)){let e=new Date(t);if(!Number.isNaN(e.getTime()))return e.toLocaleDateString(void 0,Ue.test(t)?{month:"short",day:"numeric",timeZone:"UTC"}:{month:"short",day:"numeric"})}return n}return typeof n=="object"?"":String(n)}function Ze(n){return n.length>Qt?`${n.slice(0,Qt-1)}\u2026`:n}function tr(n,t,e){let r=t>=1?0:Math.min(4,Math.ceil(-Math.log10(t)));return new Intl.NumberFormat(void 0,{maximumFractionDigits:r,notation:e?"compact":"standard"}).format(n)}function te(n){return new Intl.NumberFormat(void 0,{maximumFractionDigits:4}).format(n)}function er(n,t,e){let r=n,o=t;if((!Number.isFinite(r)||!Number.isFinite(o))&&(r=0,o=1),r===o){let p=Math.abs(r)>0?Math.abs(r)*.1:1;r-=p,o+=p}let a=(o-r)/Math.max(1,e),i=10**Math.floor(Math.log10(a)),s=a/i,c=(s<=1?1:s<=2?2:s<=5?5:10)*i,l=Math.floor(r/c)*c,h=Math.ceil(o/c)*c,g=[];for(let p=l;p<=h+c/2;p+=c)g.push(Number(p.toFixed(10)));return{ticks:g,domainMin:l,domainMax:h,step:c}}function rr(n){let t=[],e=[];for(let r of n){let o=e[e.length-1];if(o===void 0||r.index===o.index+1){e.push(r);continue}t.push(e),e=[r]}return e.length>0&&t.push(e),t}function A(n,t){let e=document.createElementNS(_e,n);return t!==void 0&&e.setAttribute("part",t),e}function P(n,t){for(let[e,r]of Object.entries(t))n.setAttribute(e,String(r))}function ee(n){let t=A("title");return t.textContent=n,t}var Ct=class extends HTMLElement{#o=document.createElement("div");#i=document.createElement("div");#a=document.createElement("div");#n=document.createElement("div");#e=null;#r=null;#t=null;#h=0;#c=0;constructor(){super();let t=this.attachShadow({mode:"open"}),e=document.createElement("style");e.textContent=Ve,this.#o.part.add("container"),this.#i.part.add("title"),this.#a.part.add("legend"),this.#n.part.add("plot"),t.append(e,this.#o)}connectedCallback(){++this.#c,this.#e=null,this.#r=null;let t=T(this);if(t.status!=="ok"){this.#l(t.reason);return}let e=Ye(t.config);if(e.status!=="ok"){this.#l(e.reason);return}this.#e=e.config,this.#d(),this.#s();let{data:r}=e.config;if(r!==void 0&&!Xe(r)){this.#l("chart data is not a list of rows");return}this.#r=r??[],this.#u()}disconnectedCallback(){this.#c+=1,this.#t?.disconnect(),this.#t=null}#s(){this.#t?.disconnect(),this.#h=this.#n.getBoundingClientRect().width;let t=new ResizeObserver(e=>{let r=e[0]?.contentRect.width??0;Math.abs(this.#h-r)<.5||(this.#h=r,this.#u())});t.observe(this.#n),this.#t=t}#l(t){this.#t?.disconnect(),this.#t=null;let e=document.createElement("div");e.part.add("unavailable"),e.setAttribute("role","status");let r=document.createElement("span");r.part.add("reason"),r.textContent=t,e.append("Chart unavailable: ",r),this.#o.replaceChildren(e)}#d(){let t=this.#e;if(t===null)return;let e=[],r=t.title?.trim();r!==void 0&&r.length>0&&(this.#i.textContent=r,e.push(this.#i)),t.y.length>1&&(this.#a.replaceChildren(...t.y.map((o,a)=>{let i=document.createElement("div");i.part.add("legend-item");let s=document.createElement("span");s.part.add("legend-swatch"),s.setAttribute("aria-hidden","true"),s.style.background=V[a%V.length]??V[0];let c=document.createElement("span");return c.part.add("legend-label"),c.textContent=o.label??Et(o.field),i.append(s,c),i})),e.push(this.#a)),e.push(this.#n),this.#o.replaceChildren(...e)}#u(){let t=this.#e,e=this.#r;if(t===null||e===null)return;let r=e.map(d=>Qe(Zt(d,t.x))),o=t.y.map((d,m)=>{let v=[];return e.forEach((b,k)=>{let E=Je(Zt(b,d.field));E!==null&&v.push({index:k,value:E})}),{label:d.label??Et(d.field),color:V[m%V.length]??V[0],points:v}}),a=0,i=0,s=0;for(let d of o)for(let m of d.points)a===0?(i=m.value,s=m.value):(m.value<i&&(i=m.value),m.value>s&&(s=m.value)),a+=1;if(t.kind!=="line"&&(i=Math.min(i,0),s=Math.max(s,0)),a===0||e.length===0){let d=document.createElement("div");d.part.add("empty"),d.style.height="var(--crtr-chart-plot-height, 260px)",d.textContent="No data to chart",this.#n.replaceChildren(d);return}let c=this.#h;if(c<=0){let d=document.createElement("div");d.style.height="var(--crtr-chart-plot-height, 260px)",this.#n.replaceChildren(d);return}let{ticks:l,domainMin:h,domainMax:g,step:p}=er(i,s,Ge),ne=Math.max(...l.map(d=>Math.abs(d)))>=1e4,Mt=l.map(d=>tr(d,p,ne)),Y=Math.min(88,Math.max(36,Math.max(...Mt.map(d=>d.length))*6.4+12)),Q=Math.max(0,c-Y-Ke),Lt=Math.max(0,kt-Xt-qe),$t=Xt+Lt,it=r.length>0?Q/r.length:Q,G=d=>Y+it*(d+.5),ae=g-h||1,_=d=>$t-(d-h)/ae*Lt,Rt=Math.min(Math.max(0,h),g),Z=_(Rt),$=A("svg","chart");P($,{role:"img",width:c,height:kt,viewBox:`0 0 ${c} ${kt}`}),$.setAttribute("aria-label",`${t.kind} chart of ${o.map(d=>d.label).join(", ")} by ${Et(t.x)}`),l.forEach((d,m)=>{let v=A("line");v.setAttribute("class",d===Rt?"grid baseline":"grid"),P(v,{x1:Y,x2:Y+Q,y1:_(d),y2:_(d)});let b=A("text");b.setAttribute("class","tick"),P(b,{x:Y-8,y:_(d),"text-anchor":"end","dominant-baseline":"central"}),b.textContent=Mt[m]??"",$.append(v,b)});let K=[];if(r.length>0){let d=Math.max(2,Math.min(r.length,Math.floor(Q/Jt)||1)),m=Math.max(1,Math.ceil((r.length-1)/(d-1)));for(let b=0;b<r.length;b+=m)K.push(b);let v=K[K.length-1]??0;v!==r.length-1&&((r.length-1-v)*it>=Jt?K.push(r.length-1):K[K.length-1]=r.length-1)}for(let d of K){let m=Ze(r[d]??""),v=G(d),b=m.length*We/2,k=v-b<0?"start":v+b>c?"end":"middle",E=A("text");E.setAttribute("class","tick"),P(E,{x:k==="start"?0:k==="end"?c:v,y:$t+16,"text-anchor":k,"dominant-baseline":"hanging"}),E.textContent=m,$.append(E)}if(t.kind==="bar"){let d=it*.72,m=d/o.length,v=Math.max(1,m-(m>4?1:0));$.style.setProperty("--bar-max-radius",`${v/3}px`),o.forEach((b,k)=>{let E=A("g");for(let R of b.points){let X=_(R.value),H=A("rect","bar");P(H,{x:G(R.index)-d/2+k*m,y:Math.min(X,Z),width:v,height:Math.max(1,Math.abs(Z-X))}),H.style.fill=b.color,H.append(ee(`${b.label} \xB7 ${r[R.index]??R.index}: ${te(R.value)}`)),E.append(H)}$.append(E)})}else{let d=r.length<=40;for(let m of o){let v=A("g"),b=rr(m.points);for(let k of b){let E=k.map(C=>`${G(C.index)},${_(C.value)}`).join(" L "),R=k[0],X=k[k.length-1];if(t.kind==="area"&&R!==void 0&&X!==void 0){let C=A("path","area");P(C,{d:`M ${G(R.index)},${Z} L ${E} L ${G(X.index)},${Z} Z`}),C.style.fill=m.color,v.append(C)}let H=A("path","line");if(P(H,{d:`M ${E}`,fill:"none"}),H.style.stroke=m.color,v.append(H),!(!d&&k.length>1))for(let C of k){let tt=A("circle","point");P(tt,{cx:G(C.index),cy:_(C.value)}),tt.style.fill=m.color,tt.append(ee(`${m.label} \xB7 ${r[C.index]??C.index}: ${te(C.value)}`)),v.append(tt)}}$.append(v)}}this.#n.replaceChildren($)}};w("crtr-chart",Ct);function re(){return window.crtr}var oe="Submit is unavailable \u2014 this page is not connected to a host.",or=`
-  :host {
-    display: block;
-  }
-
-  :host([hidden]) {
-    display: none;
-  }
-
-  [part="page"] {
-    display: grid;
-    gap: var(--crtr-page-step-gap, var(--crtr-space-3));
-  }
-
-  /* A step takes focus programmatically when the pager flips to it, so it wears no ring by
-     default \u2014 a host that wants one sets the outline rather than patching around it. The
-     pager focuses the element itself, not the inner div, so the rule has to sit on the host:
-     on [part="page"] it would never match and every step change would paint a UA ring. */
-  :host(:focus) {
-    outline: var(--crtr-page-step-focus-outline, none);
-  }
-`,nr=`
-  :host {
-    display: block;
-  }
-
-  [part="container"] {
-    display: grid;
-    gap: var(--crtr-page-container-gap, var(--crtr-space-4));
-  }
-
-  [part="chrome"] {
-    display: flex;
-    flex-wrap: wrap;
-    align-items: center;
-    justify-content: space-between;
-    gap: var(--crtr-page-chrome-gap, var(--crtr-space-3));
-    padding-top: var(--crtr-page-chrome-padding-top, var(--crtr-space-3));
-    border-top: var(--crtr-page-chrome-border-width, 1px)
-      var(--crtr-page-chrome-border-style, solid)
-      var(--crtr-page-chrome-border-color, var(--crtr-color-border));
-  }
-
-  [part="container"][data-steps="1"] [part="chrome"] {
-    justify-content: flex-end;
-  }
-
-  [part="progress"] {
-    display: flex;
-    align-items: center;
-    gap: var(--crtr-page-progress-gap, var(--crtr-space-2));
-    color: var(--crtr-page-progress-text-color, var(--crtr-color-text-muted));
-  }
-
-  [part="progress-track"] {
-    display: flex;
-    align-items: center;
-    gap: var(--crtr-page-progress-track-gap, var(--crtr-space-1));
-  }
-
-  [part="progress-step"] {
-    width: var(--crtr-page-progress-step-width, var(--crtr-space-2));
-    height: var(--crtr-page-progress-step-height, var(--crtr-space-1));
-    border-radius: var(--crtr-page-progress-step-radius, var(--crtr-radius-small));
-    background: var(--crtr-page-progress-step-fill, var(--crtr-color-border));
-  }
-
-  [part="progress-step"][data-state="complete"] {
-    background: var(--crtr-page-progress-step-complete-fill, var(--crtr-color-text-muted));
-  }
-
-  [part="progress-step"][data-state="current"] {
-    width: var(--crtr-page-progress-step-current-width, var(--crtr-space-4));
-    background: var(--crtr-page-progress-step-current-fill, var(--crtr-color-accent));
-  }
-
-  [part="actions"] {
-    display: flex;
-    align-items: center;
-    gap: var(--crtr-page-actions-gap, var(--crtr-space-2));
-  }
-
-  button {
-    font: var(--crtr-page-button-font, inherit);
-    color: var(--crtr-page-button-text-color, var(--crtr-color-text));
-    background: var(--crtr-page-button-fill, var(--crtr-color-surface));
-    border: var(--crtr-page-button-border-width, 1px)
-      var(--crtr-page-button-border-style, solid)
-      var(--crtr-page-button-border-color, var(--crtr-color-border));
-    border-radius: var(--crtr-page-button-radius, var(--crtr-radius-small));
-    padding: var(--crtr-page-button-padding, var(--crtr-space-2) var(--crtr-space-3));
-    cursor: pointer;
-    transition: color var(--crtr-page-button-transition, var(--crtr-control-transition, 120ms ease)),
-      background-color var(--crtr-page-button-transition, var(--crtr-control-transition, 120ms ease)),
-      border-color var(--crtr-page-button-transition, var(--crtr-control-transition, 120ms ease));
-  }
-
-  button:hover:not(:disabled) {
-    background: var(--crtr-page-button-hover-fill, var(--crtr-color-surface-hover));
-  }
-
-${u({scope:"page-button"},"button")}
-  button:disabled {
-    cursor: not-allowed;
-    opacity: var(--crtr-page-button-disabled-opacity, var(--crtr-control-disabled-opacity, 0.5));
-  }
-
-  [part="submit"] {
-    color: var(--crtr-page-submit-text-color, var(--crtr-color-accent-contrast));
-    background: var(--crtr-page-submit-fill, var(--crtr-color-accent));
-    border-color: var(--crtr-page-submit-border-color, var(--crtr-color-accent));
-  }
-
-  /* Mixing the accent toward the text colour darkens on a light token set and lightens on a
-     dark one \u2014 a brightness filter moves the wrong way on one of them. */
-  [part="submit"]:hover:not(:disabled) {
-    background: var(--crtr-page-submit-hover-fill, color-mix(in srgb, var(--crtr-color-accent) 88%, var(--crtr-color-text)));
-    border-color: var(--crtr-page-submit-hover-border-color, color-mix(in srgb, var(--crtr-color-accent) 88%, var(--crtr-color-text)));
-  }
-
-  [part="notice"] {
-    color: var(--crtr-page-notice-text-color, var(--crtr-color-text-muted));
-    font-size: var(--crtr-page-notice-font-size, 0.875em);
-  }
-
-  [part="notice"][data-state="error"] {
-    color: var(--crtr-page-notice-error-text-color, var(--crtr-color-danger));
-  }
-
-  [hidden] {
-    display: none !important;
-  }
-`,Tt=class extends HTMLElement{constructor(){super();let t=this.attachShadow({mode:"open"}),e=document.createElement("style");e.textContent=or;let r=document.createElement("div");r.part.add("page"),r.append(document.createElement("slot")),t.append(e,r)}},St=class extends HTMLElement{static observedAttributes=["disabled","submit-label"];#o=[];#i=0;#a="idle";#n=null;#e=document.createElement("div");#r=document.createElement("div");#t=document.createElement("div");#h=document.createElement("span");#c=document.createElement("span");#s=document.createElement("div");#l=document.createElement("span");#d=document.createElement("button");#u=document.createElement("button");#m=document.createElement("button");#E=new MutationObserver(()=>{this.#L(),this.#y()});constructor(){super();let t=this.attachShadow({mode:"open"}),e=document.createElement("style");e.textContent=nr;let r=document.createElement("div");r.part.add("steps"),r.append(document.createElement("slot")),this.#e.part.add("container"),this.#r.part.add("chrome"),this.#t.part.add("progress"),this.#t.setAttribute("role","status"),this.#t.setAttribute("aria-live","polite"),this.#h.part.add("progress-label"),this.#c.part.add("progress-track"),this.#c.setAttribute("aria-hidden","true"),this.#t.append(this.#h,this.#c),this.#d.part.add("prev"),this.#d.type="button",this.#d.textContent="Back",this.#d.addEventListener("click",()=>this.#p(-1)),this.#u.part.add("next"),this.#u.type="button",this.#u.textContent="Next",this.#u.addEventListener("click",()=>this.#p(1)),this.#m.part.add("submit"),this.#m.type="button",this.#m.addEventListener("click",()=>{this.#T()}),this.#l.part.add("notice"),this.#s.part.add("actions"),this.#s.append(this.#l,this.#d,this.#u,this.#m),this.#r.append(this.#t,this.#s),this.#e.append(r,this.#r),t.append(e,this.#e)}connectedCallback(){this.#L(),this.#E.observe(this,{childList:!0}),this.ownerDocument.addEventListener("keydown",this.#b),this.#y()}disconnectedCallback(){this.#E.disconnect(),this.ownerDocument.removeEventListener("keydown",this.#b)}attributeChangedCallback(){this.isConnected&&this.#y()}#L(){this.#o=[...this.children].filter(t=>t instanceof HTMLElement&&t.tagName==="CRTR-PAGE");for(let t of this.#o)t.hasAttribute("tabindex")||t.setAttribute("tabindex","-1");this.#i=Math.min(this.#i,Math.max(0,this.#o.length-1))}get#g(){return this.#i>=this.#o.length-1}#p(t,e=!0){let r=this.#i+t;r<0||r>=this.#o.length||r===this.#i||(this.#i=r,this.#n=null,this.#y(),e&&this.#o[this.#i]?.focus())}async#T(){if(this.#a!=="idle"||this.hasAttribute("disabled")||!this.#g)return;let t=re();if(typeof t?.submit!="function"){this.#n=oe,this.#y();return}this.#a="submitting",this.#n=null,this.#y();try{Nt(),await t.submit(),this.#a="submitted"}catch(e){this.#a="idle",this.#n=e instanceof Error?e.message:"Submit failed."}this.#y()}#b=t=>{if(t.defaultPrevented)return;let e=t.composedPath();if(e.some(o=>o instanceof HTMLElement&&o.tagName==="CRTR-PAGES"&&o!==this))return;if((t.metaKey||t.ctrlKey)&&t.key==="Enter"){if(!this.#g)return;t.preventDefault(),this.#T();return}if(t.metaKey||t.ctrlKey||t.altKey||ar(e))return;let r=t.key.toLowerCase();r!=="n"&&r!=="p"||(t.preventDefault(),this.#p(r==="n"?1:-1))};#y(){let t=this.#o.length,e=t>1,r=Math.min(this.#i,Math.max(0,t-1));for(let[i,s]of this.#o.entries())s.toggleAttribute("hidden",i!==r);if(this.#e.dataset.steps=String(Math.max(1,t)),this.#e.dataset.step=String(r+1),this.#t.hidden=!e,e){let i=this.#o[r]?.getAttribute("label")?.trim();this.#h.textContent=i?`Step ${r+1} of ${t} \xB7 ${i}`:`Step ${r+1} of ${t}`,this.#c.replaceChildren(...this.#o.map((s,c)=>{let l=document.createElement("span");return l.part.add("progress-step"),l.dataset.state=c===r?"current":c<r?"complete":"upcoming",l}))}this.#d.hidden=!e,this.#d.disabled=r===0,this.#u.hidden=!e||this.#g,this.#u.disabled=!1,this.#m.hidden=!this.#g;let o=typeof re()?.submit=="function";this.#m.disabled=!o||this.#a!=="idle"||this.hasAttribute("disabled"),this.#m.textContent=this.#a==="submitting"?"Submitting\u2026":this.#a==="submitted"?"Submitted":this.getAttribute("submit-label")?.trim()||"Submit";let a=this.#n??(this.#a==="submitted"?"Your response was submitted.":!o&&this.#g?oe:null);this.#l.hidden=a===null,this.#l.textContent=a??"",this.#l.dataset.state=this.#n===null?"info":"error"}};function ar(n){return n.some(t=>t instanceof HTMLElement&&(t instanceof HTMLInputElement||t instanceof HTMLTextAreaElement||t.isContentEditable))}w("crtr-page",Tt);w("crtr-pages",St);var ir=`
-  :host {
-    display: block;
-  }
-
-  /* Flat: this sits in the flow of the page. A shadow in this bundle means floating. */
-  [part="unavailable"] {
-    padding: var(--crtr-slot-unavailable-padding, var(--crtr-space-3));
-    color: var(--crtr-slot-unavailable-text-color, var(--crtr-color-text-muted));
-    background: var(--crtr-slot-unavailable-fill, var(--crtr-color-surface));
-    border: var(--crtr-slot-unavailable-border-width, 1px)
-      var(--crtr-slot-unavailable-border-style, solid)
-      var(--crtr-slot-unavailable-border-color, var(--crtr-color-border));
-    border-radius: var(--crtr-slot-unavailable-radius, var(--crtr-radius-medium));
-  }
-
-  [part="unavailable"][hidden] {
-    display: none;
-  }
-
-  [part="kind"] {
-    color: var(--crtr-slot-kind-text-color, var(--crtr-color-text));
-    font-family: var(--crtr-slot-kind-font-family, var(--crtr-font-mono));
-  }
-
-  [part="reason"] {
-    display: block;
-    margin-top: var(--crtr-slot-reason-gap, var(--crtr-space-1));
-    font-size: var(--crtr-slot-reason-font-size, 0.875em);
-  }
-`,At=class extends HTMLElement{#o=document.createElement("div");#i=document.createElement("span");#a=document.createElement("span");#n=document.createElement("div");#e=!1;constructor(){super();let t=this.attachShadow({mode:"open"}),e=document.createElement("style");e.textContent=ir,this.#o.part.add("unavailable"),this.#o.setAttribute("role","status"),this.#i.part.add("kind"),this.#a.part.add("reason"),this.#o.append("Component unavailable: ",this.#i,this.#a),this.#o.hidden=!0,this.#n.part.add("mount"),t.append(e,document.createElement("slot"),this.#o)}connectedCallback(){if(this.#e)return;this.#e=!0;let t=this.getAttribute("kind")?.trim()??"";if(this.#i.textContent=t===""?"unknown":t,t===""){this.#t("This slot names no component kind.");return}let e=T(this);if(e.status!=="ok"){this.#t(e.reason);return}this.append(this.#n),this.#r(t,e.config)}async#r(t,e){await It(this.#n,t,e)!=="mounted"&&(this.#n.remove(),this.#t("This page is open somewhere that cannot render it."))}#t(t){this.#a.textContent=t,this.#o.hidden=!1}};w("crtr-slot",At);})();