@livx.cc/bare-v3 0.1.0-alpha.127 → 0.1.0-alpha.129

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/bare.css CHANGED
@@ -445,7 +445,7 @@
445
445
  display: grid;
446
446
  }
447
447
 
448
- .b3-input {
448
+ .b3-input:where(:not([type="checkbox"], [type="radio"])) {
449
449
  border: 1px solid var(--b3-color-border-strong);
450
450
  border-radius: var(--b3-radius);
451
451
  background: var(--b3-color-surface);
@@ -1946,11 +1946,11 @@
1946
1946
  color: var(--b3-color-warning);
1947
1947
  }
1948
1948
 
1949
- .b3-input[data-b3-size="small"] {
1949
+ .b3-input:where(:not([type="checkbox"], [type="radio"]))[data-b3-size="small"] {
1950
1950
  padding: .5rem .75rem;
1951
1951
  }
1952
1952
 
1953
- .b3-input[data-b3-size="large"] {
1953
+ .b3-input:where(:not([type="checkbox"], [type="radio"]))[data-b3-size="large"] {
1954
1954
  min-block-size: 3.25rem;
1955
1955
  padding: .875rem 1rem;
1956
1956
  }
@@ -2494,7 +2494,7 @@
2494
2494
  padding: calc(var(--b3-d-pad-block, .5rem) - .125rem) calc(var(--b3-d-pad-inline, .75rem) - .25rem);
2495
2495
  }
2496
2496
 
2497
- :where(.b3-root[data-b3-density]) .b3-input {
2497
+ :where(.b3-root[data-b3-density]) .b3-input:where(:not([type="checkbox"], [type="radio"])) {
2498
2498
  min-block-size: var(--b3-d-control, 2.75rem);
2499
2499
  padding: calc((var(--b3-d-control, 2.75rem) - 1.5em - 2px) / 2) .75rem;
2500
2500
  line-height: 1.5;
package/dist/bare.min.css CHANGED
@@ -1 +1 @@
1
- @layer bare.reset{:where(.b3-root),:where(.b3-root *){box-sizing:border-box}:where(.b3-root){font-family:var(--b3-font-body);background:var(--b3-color-canvas);color:var(--b3-color-text);color-scheme:light;margin:0;font-size:1rem;line-height:1.5}:where(.b3-root>body){margin:0}:where(b3-tabs,b3-dropdown,b3-dialog,b3-sheet,b3-command){display:contents}:where(b3-reel,b3-toast-region,b3-toc,b3-board,b3-date-picker,b3-image-viewer){display:block}:where(.b3-root) :where(button,input,select,textarea){font:inherit}:where(.b3-root) :where(button:not(:disabled)){color:inherit}:where(.b3-root) :where(h1,h2,h3,h4,h5,h6,p){margin:0}:where(.b3-root) :where(button,a,input,select,textarea,summary,[tabindex]):focus-visible{outline:none;box-shadow:inset 0 0 0 2px}@media (forced-colors:active){:where(.b3-root) :where(button,a,input,select,textarea,summary,[tabindex]):focus-visible{outline-offset:-2px;outline:1px solid highlight}}:where(.b3-root) :where(img,svg:not([width])){max-inline-size:100%}@media (prefers-reduced-motion:reduce){:where(.b3-root *),:where(.b3-root *):before,:where(.b3-root *):after{transition:none!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}[data-b3-motion=reduce] *,[data-b3-motion=reduce] :before,[data-b3-motion=reduce] :after,[data-b3-motion=reduce] ::backdrop{scroll-behavior:auto!important;transition:none!important;animation:none!important}:where(.b3-root [hidden]):not([hidden=until-found]){display:none!important}:where(.b3-root) :where(input[type=checkbox],input[type=radio],input[type=range]){accent-color:var(--b3-color-accent)}:where(.b3-root) :where(input[type=checkbox],input[type=radio]){flex-shrink:0}}@layer bare.tokens{.b3-root:where(:not(.b3-root .b3-root)),.b3-root[data-b3-theme=light]{--b3-color-canvas:#f6f5f0;--b3-color-surface:#fff;--b3-color-text:#202923;--b3-color-muted:#59655d;--b3-color-border:#d5dbd3;--b3-color-border-strong:#838d86;--b3-color-accent:#245c42;--b3-color-on-accent:#fff;--b3-color-danger:#a62c35;--b3-color-focus:#276bdd;--b3-font-body:ui-sans-serif, system-ui, sans-serif;--b3-font-display:var(--b3-font-body);--b3-radius:.75rem;--b3-space:1rem;--b3-content:68rem}.b3-root[data-b3-theme=dark]{color-scheme:dark;--b3-color-canvas:#141c19;--b3-color-surface:#202c26;--b3-color-text:#edf3ec;--b3-color-muted:#a8b9ad;--b3-color-border:#415348;--b3-color-border-strong:#74877b;--b3-color-accent:#aadbb8;--b3-color-on-accent:#132b1b;--b3-color-danger:#ffadb1;--b3-color-focus:#9ac4ff}.b3-root:where(:not(.b3-root .b3-root)),.b3-root[data-b3-theme=light]{--b3-space-1:.25rem;--b3-space-2:.5rem;--b3-space-3:.75rem;--b3-space-4:1rem;--b3-space-6:1.5rem;--b3-space-8:2rem;--b3-space-12:3rem;--b3-radius-small:.375rem;--b3-radius-large:1.25rem;--b3-shadow:0 8px 32px #14231b14;--b3-shadow-raised:0 16px 56px #14231b24;--b3-color-success:#256443;--b3-color-warning:#805100;--b3-color-info:#275f99;--b3-duration:.16s}.b3-root[data-b3-theme=dark]{--b3-shadow:0 8px 32px #0004;--b3-shadow-raised:0 16px 56px #0007;--b3-color-success:#99d9ab;--b3-color-warning:#f2c76c;--b3-color-info:#a2cfff}.b3-root[data-b3-density=compact]{--b3-d-control:2.25rem;--b3-d-control-small:1.875rem;--b3-d-pad-block:.4375rem;--b3-d-pad-inline:.875rem;--b3-d-label:.875rem;--b3-d-heading:1.0625rem;--b3-d-avatar:2.25rem;--b3-d-message-pad:.625rem .875rem;--b3-d-meta:.75rem;--b3-d-gap:1rem;--b3-d-surface-pad:1rem}@media (pointer:fine) and (width>=48rem){.b3-root[data-b3-density=auto]{--b3-d-control:2.25rem;--b3-d-control-small:1.875rem;--b3-d-pad-block:.4375rem;--b3-d-pad-inline:.875rem;--b3-d-label:.875rem;--b3-d-heading:1.0625rem;--b3-d-avatar:2.25rem;--b3-d-message-pad:.625rem .875rem;--b3-d-meta:.75rem;--b3-d-gap:1rem;--b3-d-surface-pad:1rem}}}@layer bare.layout{.b3-shell{inline-size:min(100%, var(--b3-content));margin-inline:auto;padding:clamp(1rem,4vw,3rem)}.b3-stack{gap:var(--b3-space);flex-direction:column;min-inline-size:0;display:flex}.b3-stack:where(dialog:not([open])){display:none}.b3-scroll{overscroll-behavior:contain;scrollbar-gutter:stable;flex:auto;min-block-size:0;min-inline-size:0;overflow:auto}dialog.b3-stack>.b3-scroll{min-block-size:min(6rem,30dvh)}.b3-stack:has(>.b3-scroll)>:not(.b3-scroll){flex-shrink:0}.b3-cluster{align-items:center;gap:var(--b3-space);flex-wrap:wrap;min-inline-size:0;display:flex}.b3-cluster>*,.b3-split>*{min-inline-size:0}.b3-inline{vertical-align:middle;align-items:center;gap:.5em;min-inline-size:0;max-inline-size:100%;display:inline-flex}.b3-inline>*{min-inline-size:0}.b3-inline:has(>.b3-badge){flex-wrap:wrap}.b3-inline>.b3-badge{flex-shrink:0}.b3-inline:has(>.b3-badge)>:not(.b3-badge,.b3-icon,svg){flex:1 1 min-content}.b3-grid{grid-template-columns:repeat(auto-fit, minmax(min(100%, var(--b3-grid-min,17rem)), 1fr));gap:var(--b3-space);display:grid}.b3-split{justify-content:space-between;align-items:center;gap:var(--b3-space);flex-wrap:wrap;display:flex}.b3-page{flex-direction:column;min-block-size:100svh;display:flex}.b3-page-body{flex:1;min-inline-size:0}.b3-app-layout{flex-wrap:wrap;min-block-size:100svh;display:flex;container:b3-app/inline-size}.b3-app-layout>.b3-sidebar{flex:16rem}.b3-app-layout>:not(.b3-sidebar){flex:999 32rem;min-inline-size:0}.b3-sidebar{padding:var(--b3-space-6);border-inline-end:1px solid var(--b3-color-border);background:var(--b3-color-surface);min-inline-size:0}.b3-center{padding:var(--b3-space-6);place-items:center;display:grid}.b3-cover{min-block-size:min(42rem,85svh);padding-block:var(--b3-space-12);flex-direction:column;justify-content:center;display:flex}.b3-reel{gap:var(--b3-space);scroll-snap-type:x proximity;padding-block-end:var(--b3-space-2);display:flex;overflow-x:auto}.b3-reel>*{scroll-snap-align:start;flex:0 0 min(85%,20rem)}@container b3-app (width<48rem){.b3-app-layout>.b3-sidebar{border-inline-end:0;border-block-end:1px solid var(--b3-color-border)}}.b3-reel:has(>.b3-badge){scrollbar-width:none;align-items:center;gap:.5rem;padding-block:.625rem}.b3-reel:has(>.b3-badge)::-webkit-scrollbar{display:none}.b3-reel>.b3-badge{flex:none}.b3-stack>.b3-reel{flex-shrink:0}@supports (animation-timeline:scroll(self inline)){.b3-reel:has(>.b3-badge){mask-image:linear-gradient(to right, #000 calc(100% - var(--b3-reel-fade)), #0000);animation:linear both b3-reel-fade scroll(self inline)}.b3-reel:has(>.b3-badge):dir(rtl){mask-image:linear-gradient(to left, #000 calc(100% - var(--b3-reel-fade)), #0000)}@keyframes b3-reel-fade{90%{--b3-reel-fade:2.5rem}to{--b3-reel-fade:0rem}}}}@layer bare.components{.b3-title{font-family:var(--b3-font-display);letter-spacing:-.04em;overflow-wrap:anywhere;font-size:clamp(2rem,7vw,4rem);line-height:1.05}.b3-heading{font-family:var(--b3-font-display);letter-spacing:-.02em;overflow-wrap:anywhere;font-size:1.375rem;font-weight:650;line-height:1.25}.b3-muted{color:var(--b3-color-muted)}.b3-label{letter-spacing:.06em;text-transform:uppercase;font-size:.8125rem;font-weight:650}.b3-surface{background:var(--b3-color-surface);color:var(--b3-color-text);border:1px solid var(--b3-color-border);border-radius:var(--b3-radius);padding:clamp(1rem,3vw,2rem)}.b3-button{border-radius:var(--b3-radius);background:var(--b3-color-accent);min-block-size:2.75rem;color:var(--b3-color-on-accent);cursor:pointer;border:1px solid #0000;justify-content:center;align-items:center;gap:.5rem;padding:.625rem 1rem;font-weight:650;text-decoration:none;display:inline-flex}.b3-button :where(svg){flex-shrink:0;display:block}.b3-button>:where([aria-hidden=true]):has(>svg){flex-shrink:0}.b3-button[data-b3-emphasis=quiet]{color:var(--b3-color-text);border-color:var(--b3-color-border);background:0 0}.b3-button:disabled{opacity:.5;cursor:not-allowed}.b3-field{align-content:start;gap:.375rem;min-inline-size:0;display:grid}.b3-input{border:1px solid var(--b3-color-border-strong);border-radius:var(--b3-radius);background:var(--b3-color-surface);min-block-size:2.75rem;inline-size:100%;min-inline-size:0;color:var(--b3-color-text);padding:.625rem .75rem}.b3-error{color:var(--b3-color-danger);font-size:.875rem}select.b3-input:not([multiple]):not([size]),select.b3-input[size="1"]:not([multiple]){appearance:none;background-image:linear-gradient(45deg,#0000 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,#0000 50%);background-position:right calc(1rem + 5px) center,right 1rem center;background-repeat:no-repeat;background-size:5px 5px;padding-inline-end:2.5rem}select.b3-input:not([multiple]):not([size]):dir(rtl),select.b3-input[size="1"]:not([multiple]):dir(rtl){background-position:1rem,calc(1rem + 5px)}@media (forced-colors:active){select.b3-input:not([multiple]):not([size]),select.b3-input[size="1"]:not([multiple]){appearance:auto;background-image:none}}:where(ul,ol):has(>.b3-row){margin:0;padding-inline-start:0}.b3-row{border-block-end:1px solid var(--b3-color-border);align-items:center;gap:.75rem;padding-block:1rem;display:flex}.b3-row:where(.b3-stack){align-items:stretch;gap:var(--b3-space)}:is(a,button,[role=button]).b3-row{padding-inline:var(--b3-space-4);color:inherit;text-align:start;cursor:pointer;transition:background-color var(--b3-duration);text-decoration:none}button.b3-row{appearance:none;border:0;border-block-end:1px solid var(--b3-color-border);background:0 0;inline-size:100%}@media (hover:hover){:is(a,button,[role=button]).b3-row:hover{background:color-mix(in srgb, var(--b3-color-text) 4%, transparent)}}:is(a,button,[role=button]).b3-row:focus-visible{background:color-mix(in srgb, var(--b3-color-text) 4%, transparent)}:is(a,button,[role=button]).b3-row:active{background:color-mix(in srgb, var(--b3-color-text) 8%, transparent)}.b3-clamp{-webkit-line-clamp:var(--b3-clamp,2);line-clamp:var(--b3-clamp,2);-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.b3-count{box-sizing:border-box;background:var(--b3-color-danger);block-size:1.25rem;min-inline-size:1.25rem;color:var(--b3-color-canvas);font-variant-numeric:tabular-nums;white-space:nowrap;border-radius:100vmax;flex:none;place-items:center;padding-inline:.3125rem;font-size:.6875rem;font-weight:700;line-height:1;display:inline-grid}.b3-count[data-b3-tone=accent]{background:var(--b3-color-accent);color:var(--b3-color-on-accent)}.b3-nav-link>.b3-count{margin-inline-start:auto}.b3-bottom-link{position:relative}.b3-bottom-link:has(>.b3-count){min-inline-size:max(var(--b3-touch,44px), 2.25rem)}.b3-bottom-link>.b3-count{box-shadow:0 0 0 2px var(--b3-color-surface);position:absolute;inset-block-start:.125rem;inset-inline-end:max(.125rem,50% - 2rem)}:is(a,button,[role=button]).b3-row:is([aria-current]:not([aria-current=false]),[aria-selected=true]){background:color-mix(in srgb, var(--b3-color-accent) 12%, transparent)}@media (forced-colors:active){:is(a,button,[role=button]).b3-row{border-inline-start:3px solid canvas}:is(a,button,[role=button]).b3-row:is([aria-current]:not([aria-current=false]),[aria-selected=true]){border-inline-start-color:highlight}}.b3-badge{overflow-wrap:anywhere;border:1px solid var(--b3-color-border);border-radius:100vmax;align-items:center;inline-size:fit-content;max-inline-size:100%;padding:.125rem .5rem;font-size:.75rem;font-weight:650;display:inline-flex}.b3-progress{block-size:.5rem;inline-size:100%;accent-color:var(--b3-color-accent)}.b3-button{transition:box-shadow var(--b3-duration), border-color var(--b3-duration)}@media (hover:hover){.b3-button:not(:disabled):hover{box-shadow:inset 0 0 0 100vmax #00000012}}.b3-button:not(:disabled):active{box-shadow:inset 0 0 0 100vmax #00000024}.b3-button[data-b3-emphasis=ghost]:not(:disabled):active{color:var(--b3-color-text)}.b3-button[data-b3-emphasis=outline]{color:var(--b3-color-accent);background:0 0;border-color:currentColor}.b3-button[data-b3-emphasis=danger]{background:var(--b3-color-danger);color:var(--b3-color-canvas)}.b3-button[data-b3-size=small]{padding:.5rem .75rem;font-size:.875rem}.b3-button[data-b3-size=large]{min-block-size:3.25rem;padding:.875rem 1.5rem}.b3-button[aria-busy=true]{cursor:progress}.b3-icon{vertical-align:-.2em;flex:none;block-size:1.25em;inline-size:1.25em;display:inline-block}[data-b3-confirm][data-b3-armed]{outline:2px solid var(--b3-color-danger)!important;outline-offset:2px!important}.b3-button[data-b3-armed]{background:var(--b3-color-danger);color:var(--b3-color-canvas);border-color:var(--b3-color-danger)}.b3-input:disabled{opacity:.6;cursor:not-allowed}.b3-input[readonly]{background:var(--b3-color-canvas)}.b3-input::placeholder{color:var(--b3-color-muted);opacity:.8}.b3-input-group{border:1px solid var(--b3-color-border-strong);border-radius:var(--b3-radius);background:var(--b3-color-canvas);flex-wrap:wrap;align-items:stretch;min-inline-size:0;display:flex;overflow:clip}.b3-input-group>.b3-input{border:0;border-radius:0;flex:12ch}.b3-input-group>.b3-button{overflow-wrap:anywhere;flex-wrap:wrap;min-inline-size:0;max-inline-size:100%;margin-inline-start:auto;padding-inline:.75rem}.b3-input-group:focus-within{outline:none;box-shadow:inset 0 0 0 2px}.b3-input-affix{overflow-wrap:anywhere;min-inline-size:0;max-inline-size:100%;color:var(--b3-color-muted);background:var(--b3-color-canvas);align-items:center;padding-inline:.75rem;display:flex}.b3-choice{cursor:pointer;flex-wrap:wrap;align-items:start;gap:.75rem;padding-block:.5rem;display:flex}.b3-choice>:not(input){overflow-wrap:anywhere;flex:12ch;min-inline-size:0}.b3-choice input{--b3-choice-control:1.125rem;inline-size:var(--b3-choice-control);block-size:var(--b3-choice-control);flex:none;margin:0;margin-block-start:max(0px, calc((1lh - var(--b3-choice-control)) / 2))}.b3-choice>.b3-switch{--b3-choice-control:1.625rem}.b3-switch{appearance:none;background:var(--b3-color-muted);border:2px solid var(--b3-color-muted);cursor:pointer;border-radius:2rem;position:relative;block-size:1.625rem!important;inline-size:2.75rem!important}.b3-switch:before{content:"";background:var(--b3-color-surface);border-radius:50%;block-size:1.125rem;inline-size:1.125rem;position:absolute;inset-block-start:.125rem;inset-inline-start:.125rem}.b3-switch:checked{background:var(--b3-color-accent);border-color:var(--b3-color-accent)}.b3-switch:checked:before{background:var(--b3-color-on-accent);inset-inline-start:calc(100% - 1.25rem)}.b3-switch:disabled{opacity:.5;cursor:not-allowed}@media (forced-colors:active){.b3-switch{forced-color-adjust:none;background:canvas;border-color:buttontext}.b3-switch:before{background:buttontext}.b3-switch:checked{background:highlight;border-color:highlight}.b3-switch:checked:before{background:highlighttext}.b3-switch:disabled{opacity:1;background:canvas;border-color:graytext}.b3-switch:disabled:before{background:graytext}}.b3-input[type=number]{appearance:textfield}.b3-input[type=number]::-webkit-inner-spin-button,.b3-input[type=number]::-webkit-outer-spin-button{appearance:none;margin:0}.b3-input::-webkit-datetime-edit,.b3-input::-webkit-datetime-edit-fields-wrapper{padding-block:0}.b3-input:is([type=date],[type=time],[type=datetime-local],[type=month],[type=week]){appearance:none;max-inline-size:100%;display:block}.b3-input::-webkit-date-and-time-value{text-align:start;min-block-size:1lh}.b3-card-header,.b3-card-footer{justify-content:space-between;align-items:center;gap:var(--b3-space);flex-wrap:wrap;display:flex}.b3-card-header{margin-block-end:var(--b3-space-4)}.b3-card-footer{border-block-start:1px solid var(--b3-color-border);margin-block-start:var(--b3-space-4);padding-block-start:var(--b3-space-4)}.b3-stack>:is(.b3-card-header,.b3-card-footer){margin-block:0}.b3-surface[data-b3-elevation=raised]{box-shadow:var(--b3-shadow)}.b3-divider{border:0;border-block-start:1px solid var(--b3-color-border);inline-size:100%;margin-inline:0;margin-block:var(--b3-space)}.b3-stack>.b3-divider{margin-block:0}.b3-alert,.b3-toast{overflow-wrap:anywhere;min-inline-size:0}.b3-alert>*,.b3-toast>*{min-inline-size:0}.b3-alert pre{max-inline-size:100%;overflow-x:auto}.b3-alert{--b3-status-color:var(--b3-color-info);border:1px solid var(--b3-status-color);border-radius:var(--b3-radius-small);color:var(--b3-color-text);background:color-mix(in srgb, var(--b3-status-color) 8%, var(--b3-color-surface));border-inline-start-width:4px;align-items:start;gap:.75rem;padding:1rem;display:flex}.b3-alert[data-b3-tone=success],.b3-badge[data-b3-tone=success]{--b3-status-color:var(--b3-color-success)}.b3-alert[data-b3-tone=warning],.b3-badge[data-b3-tone=warning]{--b3-status-color:var(--b3-color-warning)}.b3-alert[data-b3-tone=danger],.b3-badge[data-b3-tone=danger]{--b3-status-color:var(--b3-color-danger)}.b3-badge[data-b3-tone]{color:var(--b3-status-color,var(--b3-color-info));background:color-mix(in srgb, currentColor 7%, transparent);border-color:currentColor}.b3-toast-region{z-index:100;inline-size:min(24rem,100% - 2rem);max-block-size:calc(100dvh - 2rem - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));overscroll-behavior:contain;pointer-events:none;gap:.75rem;display:grid;position:fixed;inset-block-end:calc(1rem + env(safe-area-inset-bottom,0px));inset-inline-end:1rem;overflow-y:auto}.b3-toast{border:1px solid var(--b3-color-border);border-radius:var(--b3-radius);background:var(--b3-color-surface);color:var(--b3-color-text);box-shadow:var(--b3-shadow-raised);pointer-events:auto;flex-wrap:wrap;align-items:start;gap:1rem;padding:1rem;display:flex}.b3-toast>:not(button,.b3-button){flex:12rem}.b3-toast>:is(button,.b3-button){flex:none;max-inline-size:100%}.b3-spinner{vertical-align:-.125em;border:2px solid;border-inline-end-color:#0000;border-radius:50%;flex:none;block-size:1.125em;inline-size:1.125em;animation:.8s linear infinite b3-spin;display:inline-block}@keyframes b3-spin{to{transform:rotate(360deg)}}.b3-skeleton{background:var(--b3-color-border);border-radius:var(--b3-radius-small);min-block-size:1rem;animation:1.8s ease-in-out infinite b3-pulse}@keyframes b3-pulse{50%{opacity:.45}}:is(button,a).b3-badge{min-block-size:auto;color:var(--b3-color-text);cursor:pointer;background:0 0;gap:.25rem;text-decoration:none;position:relative}:is(button,a).b3-badge:after{content:"";position:absolute;inset:-10px 0}:is(button,a).b3-badge[data-b3-tone]{color:var(--b3-status-color,var(--b3-color-info))}:is(button,a).b3-badge:is([aria-pressed=true],[aria-current]:not([aria-current=false])){color:var(--b3-color-on-accent);background:var(--b3-color-accent);border-color:var(--b3-color-accent)}.b3-avatar{background:var(--b3-color-accent);block-size:2.5rem;inline-size:2.5rem;color:var(--b3-color-on-accent);border-radius:50%;flex:none;place-items:center;font-size:.875rem;font-weight:650;display:inline-grid;overflow:hidden}.b3-avatar>img{object-fit:cover;block-size:100%;inline-size:100%}.b3-avatar[data-b3-unread]{position:relative;overflow:visible}.b3-avatar[data-b3-unread]>img{border-radius:inherit}.b3-avatar[data-b3-unread]:after{content:"";background:var(--b3-color-accent);block-size:.75rem;inline-size:.75rem;box-shadow:0 0 0 2px var(--b3-color-surface);border-radius:50%;position:absolute;inset-block-start:-.0625rem;inset-inline-end:-.0625rem}.b3-avatar-stack{padding-inline-start:.5rem;display:flex}.b3-avatar-stack>.b3-avatar{border:2px solid var(--b3-color-surface);margin-inline-start:-.5rem}.b3-kbd{border:1px solid var(--b3-color-border);background:var(--b3-color-surface);color:var(--b3-color-muted);border-block-end-width:2px;border-radius:.25rem;padding:.15rem .35rem;font:.75rem ui-monospace,monospace}.b3-table-wrap{border:1px solid var(--b3-color-border);border-radius:var(--b3-radius);position:relative;overflow-x:auto}.b3-table{border-collapse:collapse;text-align:start;font-variant-numeric:tabular-nums;inline-size:100%}.b3-table th{color:var(--b3-color-muted);background:var(--b3-color-canvas);font-size:.75rem;font-weight:650}.b3-table :is(th,td){border-block-end:1px solid var(--b3-color-border);text-align:start;vertical-align:middle;padding:.875rem 1rem}.b3-table tbody tr:last-child td{border-block-end:0}.b3-table[data-b3-density=compact] :is(th,td){padding:.5rem .75rem}.b3-table tbody tr[aria-selected=true]{background:color-mix(in srgb, var(--b3-color-accent) 10%, var(--b3-color-surface))}.b3-definition{grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:.75rem 1.5rem;margin:0;display:grid;container:b3-definition/inline-size}.b3-definition dt{overflow-wrap:anywhere;min-inline-size:0;color:var(--b3-color-muted)}.b3-definition dd{overflow-wrap:anywhere;margin:0}@container b3-definition (width<=26rem){.b3-definition>:is(dt,dd){grid-column:1/-1}.b3-definition>dt:not(:first-child){margin-block-start:.75rem}}.b3-stat{grid-template-columns:minmax(0,1fr);gap:.5rem;display:grid}.b3-stat-value{overflow-wrap:anywhere;letter-spacing:-.045em;font-variant-numeric:tabular-nums;font-size:clamp(1.5rem,5vw,3rem);font-weight:650;line-height:1.1}.b3-nav{border-block-end:1px solid var(--b3-color-border);flex-wrap:wrap;align-items:center;gap:.5rem;padding:.75rem min(.75rem,3%);display:flex}.b3-nav[data-b3-orientation=vertical]{border-block-end:0;flex-direction:column;align-items:stretch}.b3-nav-link{overflow-wrap:anywhere;border-radius:var(--b3-radius-small);min-block-size:2.75rem;min-inline-size:0;max-inline-size:100%;color:var(--b3-color-muted);flex-wrap:wrap;align-items:center;gap:.5rem;padding:.625rem min(.875rem,4%);text-decoration:none;display:flex}.b3-nav-link[aria-current=page]{background:color-mix(in srgb, var(--b3-color-accent) 10%, var(--b3-color-surface));color:var(--b3-color-accent);font-weight:650}.b3-nav-link:hover{background:var(--b3-color-surface);color:var(--b3-color-text)}.b3-breadcrumbs{color:var(--b3-color-muted);flex-wrap:wrap;align-items:center;gap:.5rem;margin:0;padding:0;font-size:.875rem;list-style:none;display:flex}.b3-breadcrumbs li+li:before{content:"/";color:var(--b3-color-border);margin-inline-end:.5rem}.b3-tablist{border-block-end:1px solid var(--b3-color-border);gap:.25rem;display:flex;overflow-x:auto}.b3-tab{appearance:none;color:var(--b3-color-muted);font:inherit;white-space:normal;overflow-wrap:anywhere;cursor:pointer;background:0 0;border:0;border-block-end:2px solid #0000;flex-shrink:0;min-block-size:2.75rem;max-inline-size:100%;padding:.75rem min(1rem,4vi)}.b3-tab[aria-selected=true]{color:var(--b3-color-accent);border-block-end-color:currentColor;font-weight:650}.b3-tab:disabled{opacity:.5;cursor:not-allowed}.b3-tabpanel{padding-block:var(--b3-space-4)}.b3-segmented{border-radius:var(--b3-radius);background:color-mix(in srgb, var(--b3-color-text) 7%, var(--b3-color-canvas));border:0;flex-wrap:wrap;gap:.25rem;min-inline-size:0;margin:0;padding:.25rem;display:flex}.b3-segmented>label{border-radius:calc(var(--b3-radius) - .25rem);min-block-size:2.75rem;max-inline-size:100%;color:var(--b3-color-muted);text-align:center;cursor:pointer;flex:1 0 auto;justify-content:center;align-items:center;gap:.375rem;padding-inline:.875rem;font-weight:600;display:inline-flex;position:relative}.b3-segmented>label>input{opacity:0;block-size:100%;inline-size:100%;cursor:inherit;margin:0;position:absolute;inset:0}.b3-segmented>label:has(input:checked){background:var(--b3-color-surface);color:var(--b3-color-text);box-shadow:0 1px 2px #0000001f, 0 0 0 1px var(--b3-color-border)}.b3-segmented>label:has(input:focus-visible){box-shadow:inset 0 0 0 2px}@media (forced-colors:active){.b3-segmented>label{border:2px solid canvas}.b3-segmented>label:has(input:checked){border-color:canvastext}.b3-segmented>label:has(input:focus-visible){outline-offset:1px;outline:2px solid highlight}}.b3-segmented>label:has(input:disabled){opacity:.5;cursor:not-allowed}.b3-accordion{border-block-end:1px solid var(--b3-color-border)}.b3-accordion>summary{cursor:pointer;padding:1rem .25rem;font-weight:650}.b3-accordion>:not(summary){padding:0 .25rem 1rem}.b3-dropdown{display:inline-block;position:relative}.b3-dropdown>summary{list-style:none}.b3-dropdown>summary::-webkit-details-marker{display:none}.b3-dropdown-panel{z-index:20;border:1px solid var(--b3-color-border);border-radius:var(--b3-radius);background:var(--b3-color-surface);max-block-size:70svh;inline-size:max-content;min-inline-size:min(12rem,85vw);max-inline-size:min(22rem,85vw);color:var(--b3-color-text);box-shadow:var(--b3-shadow-raised);padding:.5rem;position:absolute;inset-block-start:calc(100% + .5rem);inset-inline-start:0;overflow-y:auto}.b3-dialog{overscroll-behavior:contain;border:1px solid var(--b3-color-border);border-radius:var(--b3-radius-large);background:var(--b3-color-surface);max-block-size:calc(100svh - 2rem);inline-size:min(32rem,100% - 2rem);color:var(--b3-color-text);box-shadow:var(--b3-shadow-raised);padding:min(1.5rem,5vi);overflow:auto;container:b3-dialog/inline-size}.b3-dialog::backdrop{background:#101b17a6}.b3-dialog[data-b3-placement=end]{border-radius:0;block-size:100svh;max-block-size:100svh;inline-size:min(28rem,100%);max-inline-size:100%;margin:0;margin-inline-start:auto}@media (prefers-reduced-motion:no-preference){.b3-dialog[open]{animation:.28s cubic-bezier(.16,1,.3,1) b3-dialog-enter}.b3-dialog[open][data-b3-placement=end]{animation-name:b3-drawer-enter}.b3-dialog::backdrop,.b3-sheet::backdrop{transition:opacity .16s ease-out}.b3-dialog[data-b3-closing]::backdrop,.b3-sheet[data-b3-closing]::backdrop{opacity:0}@keyframes b3-dialog-enter{0%{opacity:0;transform:translateY(8px)scale(.96)}}@keyframes b3-drawer-enter{0%{opacity:0;translate:var(--b3-drawer-offset,1rem)}}.b3-dialog[dir=rtl][data-b3-placement=end],[dir=rtl] .b3-dialog[data-b3-placement=end]{--b3-drawer-offset:-1rem}}.b3-dialog>form{gap:var(--b3-space);flex-direction:column;margin:0;display:flex}.b3-dialog>form>header:has(>button:last-child){grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:.75rem;display:grid}.b3-dialog>form>header:has(>button:last-child)>:not(:last-child){grid-column:1;min-inline-size:0}.b3-dialog>form>header>button:last-child:not(:first-child){grid-area:1/2}.b3-dialog>form>footer{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:.75rem;display:flex}.b3-dialog>form>footer>[data-b3-emphasis=quiet]:first-child:not(:last-child){margin-inline-end:auto}@container b3-dialog (width<=16rem){.b3-dialog>form>header:has(>button:last-child){flex-direction:column;align-items:flex-start;display:flex}}.b3-tree,.b3-tree ul{overflow-wrap:anywhere;border-inline-start:1px solid var(--b3-color-border);padding-inline-start:min(1rem,5%);list-style:none}.b3-tree summary{cursor:pointer;padding-block:.5rem}.b3-prose{overflow-wrap:anywhere;max-inline-size:65ch;line-height:1.75}.b3-prose :is(p,ul,ol,blockquote,pre){margin-block:1rem}.b3-prose :is(h1,h2,h3,h4,h5,h6){margin-block:1.75rem .75rem;line-height:1.25}.b3-prose :is(h5,h6){font-size:1em}.b3-prose>:first-child{margin-block-start:0}.b3-prose :is(img,video,iframe){max-inline-size:100%;display:block}.b3-prose :is(img,video){block-size:auto}.b3-prose iframe{border:0}.b3-prose blockquote{border-inline-start:3px solid var(--b3-color-accent);color:var(--b3-color-muted);margin-inline:0;padding-inline-start:1rem}.b3-prose pre{background:var(--b3-color-surface);border:1px solid var(--b3-color-border);border-radius:var(--b3-radius-small);padding:1rem;overflow-x:auto}.b3-visually-hidden{clip-path:inset(50%);white-space:nowrap;block-size:1px;inline-size:1px;position:absolute;overflow:hidden}.b3-skip-link{z-index:1000;border-radius:var(--b3-radius-small);background:var(--b3-color-accent);max-inline-size:calc(100% - 1.5rem);color:var(--b3-color-on-accent);padding:.75rem 1rem;font-weight:650;position:fixed;inset-block-start:max(.75rem, env(safe-area-inset-top,0px));inset-inline-start:.75rem}.b3-skip-link:not(:focus){clip-path:inset(50%);white-space:nowrap;block-size:1px;inline-size:1px;padding:0;overflow:hidden}.b3-hero{grid-template-columns:repeat(2,minmax(0,1fr));align-items:center;gap:clamp(2rem,6vw,6rem);padding-block:clamp(3rem,8vw,7rem);display:grid}.b3-hero[data-b3-align=center]{text-align:center;grid-template-columns:minmax(0,1fr);justify-items:center}.b3-hero-copy{gap:1.5rem;max-inline-size:40rem;display:grid}.b3-feature{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:clamp(1.5rem,5vw,5rem);padding-block:clamp(2rem,6vw,5rem);display:grid}.b3-feature[data-b3-reverse=true]>:first-child{order:2}.b3-feature-icon{border-radius:var(--b3-radius);background:var(--b3-color-accent);block-size:3rem;inline-size:3rem;color:var(--b3-color-on-accent);place-items:center;display:inline-grid}.b3-pricing{border:1px solid var(--b3-color-border);border-radius:var(--b3-radius-large);background:var(--b3-color-surface);color:var(--b3-color-text);flex-direction:column;gap:1.25rem;padding:clamp(1.25rem,3vw,2rem);display:flex}.b3-pricing[data-b3-featured=true]{border:2px solid var(--b3-color-accent);box-shadow:var(--b3-shadow)}.b3-pricing>.b3-button:last-child{margin-block-start:auto}.b3-price{font-variant-numeric:tabular-nums;flex-wrap:wrap;align-items:baseline;gap:.375rem;display:flex}.b3-price>strong{letter-spacing:-.05em;font-size:3.25rem;line-height:1.1}.b3-checklist{gap:.75rem;margin:0;padding:0;list-style:none;display:grid}.b3-checklist>li{align-items:start;gap:.625rem;display:flex}.b3-checklist>li:before{content:"✓";color:var(--b3-color-accent);font-weight:700}.b3-quote{border-inline-start:3px solid var(--b3-color-accent);margin:0;padding:1.5rem}.b3-quote blockquote{margin:0 0 1rem;font-size:1.25rem;line-height:1.5}.b3-art{isolation:isolate;border-radius:var(--b3-radius-large);background:var(--b3-color-surface);position:relative;overflow:hidden}.b3-art:before{content:"";z-index:-1;pointer-events:none;position:absolute;inset:0}.b3-art[data-b3-art=dots]:before{background-image:radial-gradient(var(--b3-color-border) 1px,transparent 1px);background-size:16px 16px}.b3-art[data-b3-art=glow]:before{background:radial-gradient(ellipse at 20% 20%,color-mix(in srgb,var(--b3-color-accent) 20%,transparent),transparent 65%)}.b3-art[data-b3-art=wash]:before{background:linear-gradient(135deg,color-mix(in srgb,var(--b3-color-accent) 14%,transparent),transparent 70%)}@media (width<=48rem){.b3-hero,.b3-feature{grid-template-columns:minmax(0,1fr)}.b3-feature[data-b3-reverse=true]>:first-child{order:initial}}.b3-reading{grid-template-columns:minmax(0,1fr) minmax(12rem,16rem);grid-template-areas:"content outline";align-items:start;gap:clamp(2rem,5vw,5rem);display:grid}.b3-reading>:not(.b3-toc){grid-area:content;min-inline-size:0}.b3-toc{max-block-size:calc(100svh - var(--b3-outline-top,1rem) - 1rem);border-inline-start:1px solid var(--b3-color-border);grid-area:outline;padding-inline-start:min(1rem,5%);font-size:.875rem;position:sticky;inset-block-start:var(--b3-outline-top,1rem);overflow-y:auto}.b3-toc ol{gap:.25rem;margin:.75rem 0 0;padding:0;list-style:none;display:grid}.b3-toc ol ol{margin:.25rem 0;padding-inline-start:min(1rem,5%)}.b3-toc-link{border-radius:var(--b3-radius-small);color:var(--b3-color-muted);overflow-wrap:anywhere;padding:.625rem min(.75rem,5%);text-decoration:none;display:block}.b3-toc-link:hover{color:var(--b3-color-text);background:var(--b3-color-surface)}.b3-toc-link[aria-current=location]{color:var(--b3-color-accent);background:color-mix(in srgb, var(--b3-color-accent) 10%, var(--b3-color-surface));font-weight:650}@media (width<=48rem){.b3-reading{grid-template-columns:minmax(0,1fr);grid-template-areas:"outline""content";gap:2rem}.b3-toc{max-block-size:none;position:static}}.b3-command{inline-size:min(38rem,100% - 2rem);padding:0}.b3-command[open]:has(>.b3-scroll){grid-template-rows:auto minmax(0,1fr);display:grid}.b3-command>.b3-scroll>.b3-command-list{max-block-size:none;overflow:visible}.b3-command-search{border-block-end:1px solid var(--b3-color-border);flex-wrap:wrap;justify-content:end;align-items:center;gap:.75rem;padding:min(1rem,4vw);display:flex}.b3-command-search>input{flex:12ch;min-inline-size:0}.b3-command-list{overscroll-behavior:contain;max-block-size:50svh;padding:.5rem;overflow-y:auto}.b3-command-group+.b3-command-group{border-block-start:1px solid var(--b3-color-border);margin-block-start:.5rem;padding-block-start:.5rem}.b3-command-group>:first-child:not([role=option]){color:var(--b3-color-muted);padding:.5rem .75rem;font-size:.75rem;display:block}.b3-command-item{border-radius:var(--b3-radius-small);cursor:pointer;justify-content:space-between;align-items:center;gap:min(1rem,2vw);min-block-size:2.75rem;padding:min(.875rem,2svh) min(.75rem,3vw);display:flex}.b3-command .b3-command-item{border-radius:max(0px, calc(var(--b3-radius-large) - .5rem - 1px))}.b3-command-item>:first-child{overflow-wrap:anywhere;min-inline-size:0}.b3-command-item[aria-selected=true]{background:var(--b3-color-accent);color:var(--b3-color-on-accent)}.b3-command-item[aria-selected=true] .b3-muted{color:inherit}.b3-command-item[aria-disabled=true]{opacity:.5;cursor:not-allowed}.b3-command-item:not([aria-disabled=true]):hover{outline:1px solid var(--b3-color-border);outline-offset:-1px}.b3-form-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,14rem),1fr));align-items:start;gap:1.25rem;display:grid}.b3-form-grid[data-b3-layout=inline]{flex-wrap:wrap;align-items:end;display:flex}.b3-form-grid[data-b3-layout=inline]>.b3-field{flex:12rem;min-inline-size:0}.b3-form-grid[data-b3-layout=inline]>.b3-button{overflow-wrap:anywhere;flex:0 auto;max-inline-size:100%}.b3-fieldset{border:0;min-inline-size:0;margin:0;padding:0}.b3-fieldset>legend{padding:0 0 .75rem;font-weight:650}.b3-help,.b3-error{overflow-wrap:anywhere}.b3-help{color:var(--b3-color-muted);font-size:.875rem}.b3-help[data-b3-tone=success]{color:var(--b3-color-success)}.b3-help[data-b3-tone=warning]{color:var(--b3-color-warning)}.b3-input[data-b3-size=small]{padding:.5rem .75rem}.b3-input[data-b3-size=large]{min-block-size:3.25rem;padding:.875rem 1rem}.b3-input[data-b3-emphasis=subtle]{background-color:var(--b3-color-canvas);border-color:#0000}.b3-input[data-b3-emphasis=outline]{background-color:#0000;border-width:2px}.b3-input[data-b3-tone=success]{border-color:var(--b3-color-success)}.b3-input[data-b3-tone=warning]{border-color:var(--b3-color-warning)}.b3-input[aria-invalid=true]{border-color:var(--b3-color-danger)}textarea.b3-input{resize:vertical}select.b3-input[multiple]{min-block-size:8rem}.b3-input[type=file]{padding:.375rem}.b3-input::file-selector-button{font:inherit;border-radius:max(0px, calc(var(--b3-radius) - .375rem - 1px));background:var(--b3-color-accent);color:var(--b3-color-on-accent);cursor:pointer;border:0;margin-inline-end:.75rem;padding:.5rem .75rem}.b3-input[data-b3-emphasis=outline]::file-selector-button{border-radius:max(0px, calc(var(--b3-radius) - .375rem - 2px))}.b3-input[type=color]{inline-size:5rem;padding:.25rem}.b3-range{min-block-size:2.75rem;inline-size:100%;accent-color:var(--b3-color-accent);margin:0}.b3-choice-card{border:1px solid var(--b3-color-border);border-radius:var(--b3-radius);background:var(--b3-color-surface);color:var(--b3-color-text);cursor:pointer;flex-wrap:wrap;align-items:start;gap:.75rem;padding:1rem;display:flex}.b3-choice-card>:not(input){overflow-wrap:anywhere;flex:12ch;min-inline-size:0}.b3-choice-card>input{flex:none;block-size:1.125rem;inline-size:1.125rem;margin-block-start:.3rem}.b3-choice-card:has(input:checked){border-color:var(--b3-color-accent);background:color-mix(in srgb, var(--b3-color-accent) 7%, var(--b3-color-surface));box-shadow:inset 0 0 0 1px var(--b3-color-accent)}.b3-choice-card:has(input:focus-visible){outline:none;box-shadow:inset 0 0 0 2px}.b3-choice-card:has(input:disabled){opacity:.5;cursor:not-allowed}.b3-choice-card:has(input[aria-invalid=true]){border-color:var(--b3-color-danger)}.b3-range[aria-invalid=true]{accent-color:var(--b3-color-danger)}.b3-stepper{flex-wrap:wrap;gap:1rem 2rem;margin:0;padding:0;list-style:none;display:flex}.b3-step{color:var(--b3-color-muted);align-items:center;gap:.625rem;font-size:.875rem;display:flex}.b3-step-marker{border:1px solid var(--b3-color-border);font-variant-numeric:tabular-nums;border-radius:50%;flex:none;place-items:center;block-size:2rem;inline-size:2rem;display:grid}.b3-step[aria-current=step]{color:var(--b3-color-text);font-weight:650}.b3-step[aria-current=step] .b3-step-marker{background:var(--b3-color-accent);color:var(--b3-color-on-accent);border-color:var(--b3-color-accent)}.b3-step[data-b3-complete=true] .b3-step-marker{border-color:var(--b3-color-success);color:var(--b3-color-success)}.b3-conversation{gap:1.5rem;min-inline-size:0;margin:0;padding:0;list-style:none;display:grid}.b3-message{grid-template-columns:minmax(0,1fr);justify-self:start;gap:.375rem;min-inline-size:0;max-inline-size:min(85%,38rem);display:grid}.b3-message[data-b3-side=self]{justify-self:end}.b3-message-body{border:1px solid var(--b3-color-border);border-radius:var(--b3-radius);background:var(--b3-color-surface);color:var(--b3-color-text);white-space:pre-wrap;overflow-wrap:anywhere;padding:.75rem 1rem}.b3-message[data-b3-side=self]>.b3-message-body{background:var(--b3-color-accent);color:var(--b3-color-on-accent);border-color:#0000}.b3-message-meta{color:var(--b3-color-muted);flex-wrap:wrap;gap:.35rem .75rem;font-size:.8125rem;display:flex}.b3-message[data-b3-side=self]>.b3-message-meta{justify-content:end}.b3-conversation{align-content:start}.b3-message-body:has(>:is(div,p,ul,ol,table,pre,blockquote,b3-markdown-stream)){white-space:normal}.b3-composer{align-items:end;gap:var(--b3-space-2);padding:var(--b3-space-3);border-block-start:1px solid var(--b3-color-border);background:var(--b3-color-canvas);flex-wrap:wrap;display:flex}.b3-composer>.b3-input,.b3-composer>.b3-button{border-radius:var(--b3-radius);min-block-size:var(--b3-d-control,2.75rem)}.b3-composer>.b3-input{resize:none;min-inline-size:0;max-inline-size:100%;padding-block:calc((var(--b3-d-control,2.75rem) - 1.5em - 2px) / 2);flex:12ch;line-height:1.5}.b3-composer>.b3-button{block-size:var(--b3-d-control,2.75rem);min-inline-size:var(--b3-d-control,2.75rem);flex-shrink:0;margin-inline-start:auto}.b3-message-body :where(p,ul,ol,pre,table,blockquote,h1,h2,h3,h4,h5,h6,div,figure):first-child{margin-block-start:0}.b3-message-body :where(p,ul,ol,pre,table,blockquote,h1,h2,h3,h4,h5,h6,div,figure):last-child{margin-block-end:0}.b3-mobile-app{--b3-touch:44px;min-block-size:100svh;max-inline-size:var(--b3-app-width,70rem);margin-inline:auto;padding-block-end:calc(5.5rem + env(safe-area-inset-bottom,0px))}.b3-mobile-app[data-b3-platform=android]{--b3-touch:48px}.b3-mobile-app :where(button,.b3-button,select,input:not([type=checkbox],[type=radio])){min-block-size:var(--b3-touch)}.b3-app-bar{padding:max(.75rem, env(safe-area-inset-top,0px)) 1.25rem .75rem;align-items:center;gap:.75rem;display:flex}.b3-app-bar>:last-child:not(:first-child){margin-inline-start:auto}.b3-bottom-nav{z-index:10;max-inline-size:var(--b3-app-width,70rem);padding:.5rem clamp(.5rem, 2vw, 1rem) max(.5rem, env(safe-area-inset-bottom,0px));background:var(--b3-color-surface);color:var(--b3-color-text);border-block-start:1px solid var(--b3-color-border);flex-wrap:wrap;justify-content:space-around;gap:.125rem;margin-inline:auto;display:flex;position:fixed;inset-block-end:0;inset-inline:0}.b3-bottom-link{appearance:none;cursor:pointer;overflow-wrap:anywhere;text-align:center;flex:1 1 max-content;min-block-size:var(--b3-touch,44px);min-inline-size:var(--b3-touch,44px);max-inline-size:100%;color:var(--b3-color-muted);background:0 0;border:0;border-radius:1rem;flex-direction:column;justify-content:center;align-items:center;gap:.15rem;padding:.25rem clamp(.125rem,1vw,.5rem);font-size:.75rem;text-decoration:none;display:flex}.b3-bottom-link:disabled{opacity:.5;cursor:not-allowed}.b3-bottom-link:has(svg){justify-content:flex-start}.b3-bottom-link[aria-current=page]{color:var(--b3-color-accent);font-weight:700}[data-b3-platform=android] .b3-bottom-link[aria-current=page]{background:var(--b3-color-canvas)}.b3-mobile-list{border:1px solid var(--b3-color-border);background:var(--b3-color-surface);border-radius:1rem;margin:0;padding:0;list-style:none;overflow:hidden}.b3-mobile-list>li+li{border-block-start:1px solid var(--b3-color-border)}.b3-mobile-row{min-block-size:var(--b3-touch,44px);color:var(--b3-color-text);align-items:center;gap:1rem;padding:.875rem 1rem;text-decoration:none;display:flex}.b3-mobile-row>:last-child:not(:first-child){margin-inline-start:auto}.b3-sheet{inline-size:min(100%, var(--b3-overlay-width,32rem));max-inline-size:none;max-block-size:min(85dvh, calc(100dvh - env(safe-area-inset-top,0px) - 1rem));overscroll-behavior:contain;border:1px solid var(--b3-color-border);padding:1.5rem min(1.5rem, 5vi) max(1.5rem, env(safe-area-inset-bottom,0px));background:var(--b3-color-surface);color:var(--b3-color-text);border-radius:1.5rem 1.5rem 0 0;margin:0 auto;inset:auto 0 0;overflow-y:auto}.b3-sheet::backdrop{background:#0007}.b3-sheet [data-b3-initial-focus]:focus{box-shadow:none;outline:none}.b3-sheet-handle{min-block-size:44px;inline-size:5rem;color:var(--b3-color-muted);touch-action:none;cursor:grab;background:0 0;border:0;border-radius:1rem;flex:none;align-self:center;place-items:center;margin-block:-1rem -.5rem;padding:0;display:grid}.b3-sheet-handle:before{content:"";background:currentColor;border-radius:1rem;block-size:.25rem;inline-size:2.25rem}.b3-sheet[data-b3-dragging]{animation:none}.b3-sheet[data-b3-dragging] .b3-sheet-handle{cursor:grabbing}[data-b3-platform=android] .b3-mobile-list{border-radius:1.5rem}@media (prefers-reduced-motion:no-preference){.b3-sheet[open]{animation:.32s cubic-bezier(.16,1,.3,1) b3-sheet-enter}@keyframes b3-sheet-enter{0%{opacity:0;transform:translateY(3rem)}to{opacity:1;transform:translateY(0)}}}.b3-root:has(dialog:modal){overflow:hidden}.b3-bottom-link[aria-current=page]{background:color-mix(in srgb, var(--b3-color-accent) 12%, transparent)}.b3-bottom-link :where(svg:not([width])){flex:none;block-size:1.375rem;inline-size:1.375rem}.b3-bottom-link>:where(span,strong):not(.b3-count){white-space:normal;overflow-wrap:anywhere;max-inline-size:100%;overflow:visible}:has(>.b3-bottom-link:nth-of-type(5))>.b3-bottom-link{padding-inline:.125rem;font-size:.6875rem}.b3-app-frame{inline-size:100%;block-size:var(--b3-frame-height,100dvh);min-block-size:0;max-inline-size:var(--b3-app-width,70rem);padding:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px);grid-template-rows:auto minmax(0,1fr) auto;margin-inline:auto;display:grid;overflow:clip}.b3-app-frame>header{grid-row:1;min-inline-size:0}.b3-app-frame>main{overscroll-behavior:contain;grid-area:2/1;min-block-size:0;min-inline-size:0;overflow:auto}.b3-app-frame>:is(nav,footer){grid-row:3;min-inline-size:0;position:relative}.b3-app-frame>.b3-toast-region{overscroll-behavior:contain;grid-area:2/1;place-self:end;min-block-size:0;max-block-size:calc(100% - 2rem);margin:1rem;position:relative;inset:auto;overflow-y:auto}.b3-app-frame>.b3-app-bar{padding-block-start:.75rem}.b3-app-frame:has(>.b3-bottom-nav,>footer .b3-bottom-nav){padding-block-end:0}.b3-app-frame .b3-bottom-nav{inline-size:100%;max-inline-size:none;padding-block-end:max(.5rem, env(safe-area-inset-bottom,0px));position:static}:where(.b3-root[data-b3-density]) .b3-button{min-block-size:var(--b3-d-control,2.75rem);padding:var(--b3-d-pad-block,.625rem) var(--b3-d-pad-inline,1rem);font-size:var(--b3-d-label,inherit)}:where(.b3-root[data-b3-density]) .b3-button[data-b3-size=small]{min-block-size:var(--b3-d-control-small,auto);padding:calc(var(--b3-d-pad-block,.5rem) - .125rem) calc(var(--b3-d-pad-inline,.75rem) - .25rem)}:where(.b3-root[data-b3-density]) .b3-input{min-block-size:var(--b3-d-control,2.75rem);padding:calc((var(--b3-d-control,2.75rem) - 1.5em - 2px) / 2) .75rem;line-height:1.5}:where(.b3-root[data-b3-density]) .b3-nav-link{min-block-size:var(--b3-d-control,2.75rem);padding:var(--b3-d-pad-block,.625rem) min(var(--b3-d-pad-inline,.875rem), 4%);font-size:var(--b3-d-label,inherit)}:where(.b3-root[data-b3-density]) .b3-heading{font-size:var(--b3-d-heading,1.375rem)}:where(.b3-root[data-b3-density]) .b3-avatar{block-size:var(--b3-d-avatar,2.5rem);inline-size:var(--b3-d-avatar,2.5rem)}:where(.b3-root[data-b3-density]) .b3-conversation{gap:var(--b3-d-gap,1.5rem)}:where(.b3-root[data-b3-density]) .b3-message-body{padding:var(--b3-d-message-pad,.75rem 1rem)}:where(.b3-root[data-b3-density]) .b3-message-meta{font-size:var(--b3-d-meta,.8125rem)}.b3-button[data-b3-emphasis=ghost]{color:var(--b3-color-muted);background:0 0;border-color:#0000}.b3-button[data-b3-emphasis=ghost]:not(:disabled):hover{color:var(--b3-color-text)}.b3-button[data-b3-emphasis=ghost][aria-pressed=true]{color:var(--b3-color-accent)}.b3-button[data-b3-icon]{min-inline-size:var(--b3-d-control,2.75rem);padding-inline:0}:where(.b3-root[data-b3-density]) .b3-button[data-b3-icon][data-b3-size=small]{min-inline-size:var(--b3-d-control-small,2.25rem)}.b3-button:disabled{opacity:1;background:color-mix(in srgb, var(--b3-color-muted) 14%, var(--b3-color-surface));color:var(--b3-color-muted);border-color:#0000}.b3-button[data-b3-emphasis=ghost]:disabled{background:0 0}.b3-truncate{white-space:nowrap;text-overflow:ellipsis;min-inline-size:0;overflow:hidden}.b3-strong{font-size:inherit;font-weight:650}.b3-caption{color:var(--b3-color-muted);font-size:.8125rem;line-height:1.4}.b3-heading[data-b3-size=small]{font-size:1.0625rem;line-height:1.3}:is(a,button).b3-caption{color:var(--b3-color-accent);cursor:pointer;text-underline-offset:.15em;background:0 0;border:0;padding:0}:is(a,button).b3-caption:is(:hover,:focus-visible){text-decoration:underline}:where(.b3-root[data-b3-density]) .b3-caption{font-size:var(--b3-d-meta,.8125rem)}.b3-badge{gap:.25rem}:where(.b3-root[data-b3-density]) .b3-surface{padding:var(--b3-d-surface-pad,clamp(1rem, 3vw, 2rem))}.b3-input-group,.b3-input-group>.b3-input-affix,.b3-input-group>.b3-input{background:var(--b3-color-surface)}.b3-root[data-b3-theme=dark] .b3-message[data-b3-side=self]>.b3-message-body{background:color-mix(in srgb, var(--b3-color-accent) 22%, var(--b3-color-surface));color:var(--b3-color-text)}.b3-empty{justify-items:center;gap:var(--b3-space-2);padding:var(--b3-space-12) var(--b3-space-4);text-align:center;color:var(--b3-color-muted);display:grid}.b3-empty>svg{color:var(--b3-color-muted)}}@property --b3-reel-fade{syntax:"<length>";inherits:false;initial-value:2.5rem}
1
+ @layer bare.reset{:where(.b3-root),:where(.b3-root *){box-sizing:border-box}:where(.b3-root){font-family:var(--b3-font-body);background:var(--b3-color-canvas);color:var(--b3-color-text);color-scheme:light;margin:0;font-size:1rem;line-height:1.5}:where(.b3-root>body){margin:0}:where(b3-tabs,b3-dropdown,b3-dialog,b3-sheet,b3-command){display:contents}:where(b3-reel,b3-toast-region,b3-toc,b3-board,b3-date-picker,b3-image-viewer){display:block}:where(.b3-root) :where(button,input,select,textarea){font:inherit}:where(.b3-root) :where(button:not(:disabled)){color:inherit}:where(.b3-root) :where(h1,h2,h3,h4,h5,h6,p){margin:0}:where(.b3-root) :where(button,a,input,select,textarea,summary,[tabindex]):focus-visible{outline:none;box-shadow:inset 0 0 0 2px}@media (forced-colors:active){:where(.b3-root) :where(button,a,input,select,textarea,summary,[tabindex]):focus-visible{outline-offset:-2px;outline:1px solid highlight}}:where(.b3-root) :where(img,svg:not([width])){max-inline-size:100%}@media (prefers-reduced-motion:reduce){:where(.b3-root *),:where(.b3-root *):before,:where(.b3-root *):after{transition:none!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}[data-b3-motion=reduce] *,[data-b3-motion=reduce] :before,[data-b3-motion=reduce] :after,[data-b3-motion=reduce] ::backdrop{scroll-behavior:auto!important;transition:none!important;animation:none!important}:where(.b3-root [hidden]):not([hidden=until-found]){display:none!important}:where(.b3-root) :where(input[type=checkbox],input[type=radio],input[type=range]){accent-color:var(--b3-color-accent)}:where(.b3-root) :where(input[type=checkbox],input[type=radio]){flex-shrink:0}}@layer bare.tokens{.b3-root:where(:not(.b3-root .b3-root)),.b3-root[data-b3-theme=light]{--b3-color-canvas:#f6f5f0;--b3-color-surface:#fff;--b3-color-text:#202923;--b3-color-muted:#59655d;--b3-color-border:#d5dbd3;--b3-color-border-strong:#838d86;--b3-color-accent:#245c42;--b3-color-on-accent:#fff;--b3-color-danger:#a62c35;--b3-color-focus:#276bdd;--b3-font-body:ui-sans-serif, system-ui, sans-serif;--b3-font-display:var(--b3-font-body);--b3-radius:.75rem;--b3-space:1rem;--b3-content:68rem}.b3-root[data-b3-theme=dark]{color-scheme:dark;--b3-color-canvas:#141c19;--b3-color-surface:#202c26;--b3-color-text:#edf3ec;--b3-color-muted:#a8b9ad;--b3-color-border:#415348;--b3-color-border-strong:#74877b;--b3-color-accent:#aadbb8;--b3-color-on-accent:#132b1b;--b3-color-danger:#ffadb1;--b3-color-focus:#9ac4ff}.b3-root:where(:not(.b3-root .b3-root)),.b3-root[data-b3-theme=light]{--b3-space-1:.25rem;--b3-space-2:.5rem;--b3-space-3:.75rem;--b3-space-4:1rem;--b3-space-6:1.5rem;--b3-space-8:2rem;--b3-space-12:3rem;--b3-radius-small:.375rem;--b3-radius-large:1.25rem;--b3-shadow:0 8px 32px #14231b14;--b3-shadow-raised:0 16px 56px #14231b24;--b3-color-success:#256443;--b3-color-warning:#805100;--b3-color-info:#275f99;--b3-duration:.16s}.b3-root[data-b3-theme=dark]{--b3-shadow:0 8px 32px #0004;--b3-shadow-raised:0 16px 56px #0007;--b3-color-success:#99d9ab;--b3-color-warning:#f2c76c;--b3-color-info:#a2cfff}.b3-root[data-b3-density=compact]{--b3-d-control:2.25rem;--b3-d-control-small:1.875rem;--b3-d-pad-block:.4375rem;--b3-d-pad-inline:.875rem;--b3-d-label:.875rem;--b3-d-heading:1.0625rem;--b3-d-avatar:2.25rem;--b3-d-message-pad:.625rem .875rem;--b3-d-meta:.75rem;--b3-d-gap:1rem;--b3-d-surface-pad:1rem}@media (pointer:fine) and (width>=48rem){.b3-root[data-b3-density=auto]{--b3-d-control:2.25rem;--b3-d-control-small:1.875rem;--b3-d-pad-block:.4375rem;--b3-d-pad-inline:.875rem;--b3-d-label:.875rem;--b3-d-heading:1.0625rem;--b3-d-avatar:2.25rem;--b3-d-message-pad:.625rem .875rem;--b3-d-meta:.75rem;--b3-d-gap:1rem;--b3-d-surface-pad:1rem}}}@layer bare.layout{.b3-shell{inline-size:min(100%, var(--b3-content));margin-inline:auto;padding:clamp(1rem,4vw,3rem)}.b3-stack{gap:var(--b3-space);flex-direction:column;min-inline-size:0;display:flex}.b3-stack:where(dialog:not([open])){display:none}.b3-scroll{overscroll-behavior:contain;scrollbar-gutter:stable;flex:auto;min-block-size:0;min-inline-size:0;overflow:auto}dialog.b3-stack>.b3-scroll{min-block-size:min(6rem,30dvh)}.b3-stack:has(>.b3-scroll)>:not(.b3-scroll){flex-shrink:0}.b3-cluster{align-items:center;gap:var(--b3-space);flex-wrap:wrap;min-inline-size:0;display:flex}.b3-cluster>*,.b3-split>*{min-inline-size:0}.b3-inline{vertical-align:middle;align-items:center;gap:.5em;min-inline-size:0;max-inline-size:100%;display:inline-flex}.b3-inline>*{min-inline-size:0}.b3-inline:has(>.b3-badge){flex-wrap:wrap}.b3-inline>.b3-badge{flex-shrink:0}.b3-inline:has(>.b3-badge)>:not(.b3-badge,.b3-icon,svg){flex:1 1 min-content}.b3-grid{grid-template-columns:repeat(auto-fit, minmax(min(100%, var(--b3-grid-min,17rem)), 1fr));gap:var(--b3-space);display:grid}.b3-split{justify-content:space-between;align-items:center;gap:var(--b3-space);flex-wrap:wrap;display:flex}.b3-page{flex-direction:column;min-block-size:100svh;display:flex}.b3-page-body{flex:1;min-inline-size:0}.b3-app-layout{flex-wrap:wrap;min-block-size:100svh;display:flex;container:b3-app/inline-size}.b3-app-layout>.b3-sidebar{flex:16rem}.b3-app-layout>:not(.b3-sidebar){flex:999 32rem;min-inline-size:0}.b3-sidebar{padding:var(--b3-space-6);border-inline-end:1px solid var(--b3-color-border);background:var(--b3-color-surface);min-inline-size:0}.b3-center{padding:var(--b3-space-6);place-items:center;display:grid}.b3-cover{min-block-size:min(42rem,85svh);padding-block:var(--b3-space-12);flex-direction:column;justify-content:center;display:flex}.b3-reel{gap:var(--b3-space);scroll-snap-type:x proximity;padding-block-end:var(--b3-space-2);display:flex;overflow-x:auto}.b3-reel>*{scroll-snap-align:start;flex:0 0 min(85%,20rem)}@container b3-app (width<48rem){.b3-app-layout>.b3-sidebar{border-inline-end:0;border-block-end:1px solid var(--b3-color-border)}}.b3-reel:has(>.b3-badge){scrollbar-width:none;align-items:center;gap:.5rem;padding-block:.625rem}.b3-reel:has(>.b3-badge)::-webkit-scrollbar{display:none}.b3-reel>.b3-badge{flex:none}.b3-stack>.b3-reel{flex-shrink:0}@supports (animation-timeline:scroll(self inline)){.b3-reel:has(>.b3-badge){mask-image:linear-gradient(to right, #000 calc(100% - var(--b3-reel-fade)), #0000);animation:linear both b3-reel-fade scroll(self inline)}.b3-reel:has(>.b3-badge):dir(rtl){mask-image:linear-gradient(to left, #000 calc(100% - var(--b3-reel-fade)), #0000)}@keyframes b3-reel-fade{90%{--b3-reel-fade:2.5rem}to{--b3-reel-fade:0rem}}}}@layer bare.components{.b3-title{font-family:var(--b3-font-display);letter-spacing:-.04em;overflow-wrap:anywhere;font-size:clamp(2rem,7vw,4rem);line-height:1.05}.b3-heading{font-family:var(--b3-font-display);letter-spacing:-.02em;overflow-wrap:anywhere;font-size:1.375rem;font-weight:650;line-height:1.25}.b3-muted{color:var(--b3-color-muted)}.b3-label{letter-spacing:.06em;text-transform:uppercase;font-size:.8125rem;font-weight:650}.b3-surface{background:var(--b3-color-surface);color:var(--b3-color-text);border:1px solid var(--b3-color-border);border-radius:var(--b3-radius);padding:clamp(1rem,3vw,2rem)}.b3-button{border-radius:var(--b3-radius);background:var(--b3-color-accent);min-block-size:2.75rem;color:var(--b3-color-on-accent);cursor:pointer;border:1px solid #0000;justify-content:center;align-items:center;gap:.5rem;padding:.625rem 1rem;font-weight:650;text-decoration:none;display:inline-flex}.b3-button :where(svg){flex-shrink:0;display:block}.b3-button>:where([aria-hidden=true]):has(>svg){flex-shrink:0}.b3-button[data-b3-emphasis=quiet]{color:var(--b3-color-text);border-color:var(--b3-color-border);background:0 0}.b3-button:disabled{opacity:.5;cursor:not-allowed}.b3-field{align-content:start;gap:.375rem;min-inline-size:0;display:grid}.b3-input:where(:not([type=checkbox],[type=radio])){border:1px solid var(--b3-color-border-strong);border-radius:var(--b3-radius);background:var(--b3-color-surface);min-block-size:2.75rem;inline-size:100%;min-inline-size:0;color:var(--b3-color-text);padding:.625rem .75rem}.b3-error{color:var(--b3-color-danger);font-size:.875rem}select.b3-input:not([multiple]):not([size]),select.b3-input[size="1"]:not([multiple]){appearance:none;background-image:linear-gradient(45deg,#0000 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,#0000 50%);background-position:right calc(1rem + 5px) center,right 1rem center;background-repeat:no-repeat;background-size:5px 5px;padding-inline-end:2.5rem}select.b3-input:not([multiple]):not([size]):dir(rtl),select.b3-input[size="1"]:not([multiple]):dir(rtl){background-position:1rem,calc(1rem + 5px)}@media (forced-colors:active){select.b3-input:not([multiple]):not([size]),select.b3-input[size="1"]:not([multiple]){appearance:auto;background-image:none}}:where(ul,ol):has(>.b3-row){margin:0;padding-inline-start:0}.b3-row{border-block-end:1px solid var(--b3-color-border);align-items:center;gap:.75rem;padding-block:1rem;display:flex}.b3-row:where(.b3-stack){align-items:stretch;gap:var(--b3-space)}:is(a,button,[role=button]).b3-row{padding-inline:var(--b3-space-4);color:inherit;text-align:start;cursor:pointer;transition:background-color var(--b3-duration);text-decoration:none}button.b3-row{appearance:none;border:0;border-block-end:1px solid var(--b3-color-border);background:0 0;inline-size:100%}@media (hover:hover){:is(a,button,[role=button]).b3-row:hover{background:color-mix(in srgb, var(--b3-color-text) 4%, transparent)}}:is(a,button,[role=button]).b3-row:focus-visible{background:color-mix(in srgb, var(--b3-color-text) 4%, transparent)}:is(a,button,[role=button]).b3-row:active{background:color-mix(in srgb, var(--b3-color-text) 8%, transparent)}.b3-clamp{-webkit-line-clamp:var(--b3-clamp,2);line-clamp:var(--b3-clamp,2);-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.b3-count{box-sizing:border-box;background:var(--b3-color-danger);block-size:1.25rem;min-inline-size:1.25rem;color:var(--b3-color-canvas);font-variant-numeric:tabular-nums;white-space:nowrap;border-radius:100vmax;flex:none;place-items:center;padding-inline:.3125rem;font-size:.6875rem;font-weight:700;line-height:1;display:inline-grid}.b3-count[data-b3-tone=accent]{background:var(--b3-color-accent);color:var(--b3-color-on-accent)}.b3-nav-link>.b3-count{margin-inline-start:auto}.b3-bottom-link{position:relative}.b3-bottom-link:has(>.b3-count){min-inline-size:max(var(--b3-touch,44px), 2.25rem)}.b3-bottom-link>.b3-count{box-shadow:0 0 0 2px var(--b3-color-surface);position:absolute;inset-block-start:.125rem;inset-inline-end:max(.125rem,50% - 2rem)}:is(a,button,[role=button]).b3-row:is([aria-current]:not([aria-current=false]),[aria-selected=true]){background:color-mix(in srgb, var(--b3-color-accent) 12%, transparent)}@media (forced-colors:active){:is(a,button,[role=button]).b3-row{border-inline-start:3px solid canvas}:is(a,button,[role=button]).b3-row:is([aria-current]:not([aria-current=false]),[aria-selected=true]){border-inline-start-color:highlight}}.b3-badge{overflow-wrap:anywhere;border:1px solid var(--b3-color-border);border-radius:100vmax;align-items:center;inline-size:fit-content;max-inline-size:100%;padding:.125rem .5rem;font-size:.75rem;font-weight:650;display:inline-flex}.b3-progress{block-size:.5rem;inline-size:100%;accent-color:var(--b3-color-accent)}.b3-button{transition:box-shadow var(--b3-duration), border-color var(--b3-duration)}@media (hover:hover){.b3-button:not(:disabled):hover{box-shadow:inset 0 0 0 100vmax #00000012}}.b3-button:not(:disabled):active{box-shadow:inset 0 0 0 100vmax #00000024}.b3-button[data-b3-emphasis=ghost]:not(:disabled):active{color:var(--b3-color-text)}.b3-button[data-b3-emphasis=outline]{color:var(--b3-color-accent);background:0 0;border-color:currentColor}.b3-button[data-b3-emphasis=danger]{background:var(--b3-color-danger);color:var(--b3-color-canvas)}.b3-button[data-b3-size=small]{padding:.5rem .75rem;font-size:.875rem}.b3-button[data-b3-size=large]{min-block-size:3.25rem;padding:.875rem 1.5rem}.b3-button[aria-busy=true]{cursor:progress}.b3-icon{vertical-align:-.2em;flex:none;block-size:1.25em;inline-size:1.25em;display:inline-block}[data-b3-confirm][data-b3-armed]{outline:2px solid var(--b3-color-danger)!important;outline-offset:2px!important}.b3-button[data-b3-armed]{background:var(--b3-color-danger);color:var(--b3-color-canvas);border-color:var(--b3-color-danger)}.b3-input:disabled{opacity:.6;cursor:not-allowed}.b3-input[readonly]{background:var(--b3-color-canvas)}.b3-input::placeholder{color:var(--b3-color-muted);opacity:.8}.b3-input-group{border:1px solid var(--b3-color-border-strong);border-radius:var(--b3-radius);background:var(--b3-color-canvas);flex-wrap:wrap;align-items:stretch;min-inline-size:0;display:flex;overflow:clip}.b3-input-group>.b3-input{border:0;border-radius:0;flex:12ch}.b3-input-group>.b3-button{overflow-wrap:anywhere;flex-wrap:wrap;min-inline-size:0;max-inline-size:100%;margin-inline-start:auto;padding-inline:.75rem}.b3-input-group:focus-within{outline:none;box-shadow:inset 0 0 0 2px}.b3-input-affix{overflow-wrap:anywhere;min-inline-size:0;max-inline-size:100%;color:var(--b3-color-muted);background:var(--b3-color-canvas);align-items:center;padding-inline:.75rem;display:flex}.b3-choice{cursor:pointer;flex-wrap:wrap;align-items:start;gap:.75rem;padding-block:.5rem;display:flex}.b3-choice>:not(input){overflow-wrap:anywhere;flex:12ch;min-inline-size:0}.b3-choice input{--b3-choice-control:1.125rem;inline-size:var(--b3-choice-control);block-size:var(--b3-choice-control);flex:none;margin:0;margin-block-start:max(0px, calc((1lh - var(--b3-choice-control)) / 2))}.b3-choice>.b3-switch{--b3-choice-control:1.625rem}.b3-switch{appearance:none;background:var(--b3-color-muted);border:2px solid var(--b3-color-muted);cursor:pointer;border-radius:2rem;position:relative;block-size:1.625rem!important;inline-size:2.75rem!important}.b3-switch:before{content:"";background:var(--b3-color-surface);border-radius:50%;block-size:1.125rem;inline-size:1.125rem;position:absolute;inset-block-start:.125rem;inset-inline-start:.125rem}.b3-switch:checked{background:var(--b3-color-accent);border-color:var(--b3-color-accent)}.b3-switch:checked:before{background:var(--b3-color-on-accent);inset-inline-start:calc(100% - 1.25rem)}.b3-switch:disabled{opacity:.5;cursor:not-allowed}@media (forced-colors:active){.b3-switch{forced-color-adjust:none;background:canvas;border-color:buttontext}.b3-switch:before{background:buttontext}.b3-switch:checked{background:highlight;border-color:highlight}.b3-switch:checked:before{background:highlighttext}.b3-switch:disabled{opacity:1;background:canvas;border-color:graytext}.b3-switch:disabled:before{background:graytext}}.b3-input[type=number]{appearance:textfield}.b3-input[type=number]::-webkit-inner-spin-button,.b3-input[type=number]::-webkit-outer-spin-button{appearance:none;margin:0}.b3-input::-webkit-datetime-edit,.b3-input::-webkit-datetime-edit-fields-wrapper{padding-block:0}.b3-input:is([type=date],[type=time],[type=datetime-local],[type=month],[type=week]){appearance:none;max-inline-size:100%;display:block}.b3-input::-webkit-date-and-time-value{text-align:start;min-block-size:1lh}.b3-card-header,.b3-card-footer{justify-content:space-between;align-items:center;gap:var(--b3-space);flex-wrap:wrap;display:flex}.b3-card-header{margin-block-end:var(--b3-space-4)}.b3-card-footer{border-block-start:1px solid var(--b3-color-border);margin-block-start:var(--b3-space-4);padding-block-start:var(--b3-space-4)}.b3-stack>:is(.b3-card-header,.b3-card-footer){margin-block:0}.b3-surface[data-b3-elevation=raised]{box-shadow:var(--b3-shadow)}.b3-divider{border:0;border-block-start:1px solid var(--b3-color-border);inline-size:100%;margin-inline:0;margin-block:var(--b3-space)}.b3-stack>.b3-divider{margin-block:0}.b3-alert,.b3-toast{overflow-wrap:anywhere;min-inline-size:0}.b3-alert>*,.b3-toast>*{min-inline-size:0}.b3-alert pre{max-inline-size:100%;overflow-x:auto}.b3-alert{--b3-status-color:var(--b3-color-info);border:1px solid var(--b3-status-color);border-radius:var(--b3-radius-small);color:var(--b3-color-text);background:color-mix(in srgb, var(--b3-status-color) 8%, var(--b3-color-surface));border-inline-start-width:4px;align-items:start;gap:.75rem;padding:1rem;display:flex}.b3-alert[data-b3-tone=success],.b3-badge[data-b3-tone=success]{--b3-status-color:var(--b3-color-success)}.b3-alert[data-b3-tone=warning],.b3-badge[data-b3-tone=warning]{--b3-status-color:var(--b3-color-warning)}.b3-alert[data-b3-tone=danger],.b3-badge[data-b3-tone=danger]{--b3-status-color:var(--b3-color-danger)}.b3-badge[data-b3-tone]{color:var(--b3-status-color,var(--b3-color-info));background:color-mix(in srgb, currentColor 7%, transparent);border-color:currentColor}.b3-toast-region{z-index:100;inline-size:min(24rem,100% - 2rem);max-block-size:calc(100dvh - 2rem - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));overscroll-behavior:contain;pointer-events:none;gap:.75rem;display:grid;position:fixed;inset-block-end:calc(1rem + env(safe-area-inset-bottom,0px));inset-inline-end:1rem;overflow-y:auto}.b3-toast{border:1px solid var(--b3-color-border);border-radius:var(--b3-radius);background:var(--b3-color-surface);color:var(--b3-color-text);box-shadow:var(--b3-shadow-raised);pointer-events:auto;flex-wrap:wrap;align-items:start;gap:1rem;padding:1rem;display:flex}.b3-toast>:not(button,.b3-button){flex:12rem}.b3-toast>:is(button,.b3-button){flex:none;max-inline-size:100%}.b3-spinner{vertical-align:-.125em;border:2px solid;border-inline-end-color:#0000;border-radius:50%;flex:none;block-size:1.125em;inline-size:1.125em;animation:.8s linear infinite b3-spin;display:inline-block}@keyframes b3-spin{to{transform:rotate(360deg)}}.b3-skeleton{background:var(--b3-color-border);border-radius:var(--b3-radius-small);min-block-size:1rem;animation:1.8s ease-in-out infinite b3-pulse}@keyframes b3-pulse{50%{opacity:.45}}:is(button,a).b3-badge{min-block-size:auto;color:var(--b3-color-text);cursor:pointer;background:0 0;gap:.25rem;text-decoration:none;position:relative}:is(button,a).b3-badge:after{content:"";position:absolute;inset:-10px 0}:is(button,a).b3-badge[data-b3-tone]{color:var(--b3-status-color,var(--b3-color-info))}:is(button,a).b3-badge:is([aria-pressed=true],[aria-current]:not([aria-current=false])){color:var(--b3-color-on-accent);background:var(--b3-color-accent);border-color:var(--b3-color-accent)}.b3-avatar{background:var(--b3-color-accent);block-size:2.5rem;inline-size:2.5rem;color:var(--b3-color-on-accent);border-radius:50%;flex:none;place-items:center;font-size:.875rem;font-weight:650;display:inline-grid;overflow:hidden}.b3-avatar>img{object-fit:cover;block-size:100%;inline-size:100%}.b3-avatar[data-b3-unread]{position:relative;overflow:visible}.b3-avatar[data-b3-unread]>img{border-radius:inherit}.b3-avatar[data-b3-unread]:after{content:"";background:var(--b3-color-accent);block-size:.75rem;inline-size:.75rem;box-shadow:0 0 0 2px var(--b3-color-surface);border-radius:50%;position:absolute;inset-block-start:-.0625rem;inset-inline-end:-.0625rem}.b3-avatar-stack{padding-inline-start:.5rem;display:flex}.b3-avatar-stack>.b3-avatar{border:2px solid var(--b3-color-surface);margin-inline-start:-.5rem}.b3-kbd{border:1px solid var(--b3-color-border);background:var(--b3-color-surface);color:var(--b3-color-muted);border-block-end-width:2px;border-radius:.25rem;padding:.15rem .35rem;font:.75rem ui-monospace,monospace}.b3-table-wrap{border:1px solid var(--b3-color-border);border-radius:var(--b3-radius);position:relative;overflow-x:auto}.b3-table{border-collapse:collapse;text-align:start;font-variant-numeric:tabular-nums;inline-size:100%}.b3-table th{color:var(--b3-color-muted);background:var(--b3-color-canvas);font-size:.75rem;font-weight:650}.b3-table :is(th,td){border-block-end:1px solid var(--b3-color-border);text-align:start;vertical-align:middle;padding:.875rem 1rem}.b3-table tbody tr:last-child td{border-block-end:0}.b3-table[data-b3-density=compact] :is(th,td){padding:.5rem .75rem}.b3-table tbody tr[aria-selected=true]{background:color-mix(in srgb, var(--b3-color-accent) 10%, var(--b3-color-surface))}.b3-definition{grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:.75rem 1.5rem;margin:0;display:grid;container:b3-definition/inline-size}.b3-definition dt{overflow-wrap:anywhere;min-inline-size:0;color:var(--b3-color-muted)}.b3-definition dd{overflow-wrap:anywhere;margin:0}@container b3-definition (width<=26rem){.b3-definition>:is(dt,dd){grid-column:1/-1}.b3-definition>dt:not(:first-child){margin-block-start:.75rem}}.b3-stat{grid-template-columns:minmax(0,1fr);gap:.5rem;display:grid}.b3-stat-value{overflow-wrap:anywhere;letter-spacing:-.045em;font-variant-numeric:tabular-nums;font-size:clamp(1.5rem,5vw,3rem);font-weight:650;line-height:1.1}.b3-nav{border-block-end:1px solid var(--b3-color-border);flex-wrap:wrap;align-items:center;gap:.5rem;padding:.75rem min(.75rem,3%);display:flex}.b3-nav[data-b3-orientation=vertical]{border-block-end:0;flex-direction:column;align-items:stretch}.b3-nav-link{overflow-wrap:anywhere;border-radius:var(--b3-radius-small);min-block-size:2.75rem;min-inline-size:0;max-inline-size:100%;color:var(--b3-color-muted);flex-wrap:wrap;align-items:center;gap:.5rem;padding:.625rem min(.875rem,4%);text-decoration:none;display:flex}.b3-nav-link[aria-current=page]{background:color-mix(in srgb, var(--b3-color-accent) 10%, var(--b3-color-surface));color:var(--b3-color-accent);font-weight:650}.b3-nav-link:hover{background:var(--b3-color-surface);color:var(--b3-color-text)}.b3-breadcrumbs{color:var(--b3-color-muted);flex-wrap:wrap;align-items:center;gap:.5rem;margin:0;padding:0;font-size:.875rem;list-style:none;display:flex}.b3-breadcrumbs li+li:before{content:"/";color:var(--b3-color-border);margin-inline-end:.5rem}.b3-tablist{border-block-end:1px solid var(--b3-color-border);gap:.25rem;display:flex;overflow-x:auto}.b3-tab{appearance:none;color:var(--b3-color-muted);font:inherit;white-space:normal;overflow-wrap:anywhere;cursor:pointer;background:0 0;border:0;border-block-end:2px solid #0000;flex-shrink:0;min-block-size:2.75rem;max-inline-size:100%;padding:.75rem min(1rem,4vi)}.b3-tab[aria-selected=true]{color:var(--b3-color-accent);border-block-end-color:currentColor;font-weight:650}.b3-tab:disabled{opacity:.5;cursor:not-allowed}.b3-tabpanel{padding-block:var(--b3-space-4)}.b3-segmented{border-radius:var(--b3-radius);background:color-mix(in srgb, var(--b3-color-text) 7%, var(--b3-color-canvas));border:0;flex-wrap:wrap;gap:.25rem;min-inline-size:0;margin:0;padding:.25rem;display:flex}.b3-segmented>label{border-radius:calc(var(--b3-radius) - .25rem);min-block-size:2.75rem;max-inline-size:100%;color:var(--b3-color-muted);text-align:center;cursor:pointer;flex:1 0 auto;justify-content:center;align-items:center;gap:.375rem;padding-inline:.875rem;font-weight:600;display:inline-flex;position:relative}.b3-segmented>label>input{opacity:0;block-size:100%;inline-size:100%;cursor:inherit;margin:0;position:absolute;inset:0}.b3-segmented>label:has(input:checked){background:var(--b3-color-surface);color:var(--b3-color-text);box-shadow:0 1px 2px #0000001f, 0 0 0 1px var(--b3-color-border)}.b3-segmented>label:has(input:focus-visible){box-shadow:inset 0 0 0 2px}@media (forced-colors:active){.b3-segmented>label{border:2px solid canvas}.b3-segmented>label:has(input:checked){border-color:canvastext}.b3-segmented>label:has(input:focus-visible){outline-offset:1px;outline:2px solid highlight}}.b3-segmented>label:has(input:disabled){opacity:.5;cursor:not-allowed}.b3-accordion{border-block-end:1px solid var(--b3-color-border)}.b3-accordion>summary{cursor:pointer;padding:1rem .25rem;font-weight:650}.b3-accordion>:not(summary){padding:0 .25rem 1rem}.b3-dropdown{display:inline-block;position:relative}.b3-dropdown>summary{list-style:none}.b3-dropdown>summary::-webkit-details-marker{display:none}.b3-dropdown-panel{z-index:20;border:1px solid var(--b3-color-border);border-radius:var(--b3-radius);background:var(--b3-color-surface);max-block-size:70svh;inline-size:max-content;min-inline-size:min(12rem,85vw);max-inline-size:min(22rem,85vw);color:var(--b3-color-text);box-shadow:var(--b3-shadow-raised);padding:.5rem;position:absolute;inset-block-start:calc(100% + .5rem);inset-inline-start:0;overflow-y:auto}.b3-dialog{overscroll-behavior:contain;border:1px solid var(--b3-color-border);border-radius:var(--b3-radius-large);background:var(--b3-color-surface);max-block-size:calc(100svh - 2rem);inline-size:min(32rem,100% - 2rem);color:var(--b3-color-text);box-shadow:var(--b3-shadow-raised);padding:min(1.5rem,5vi);overflow:auto;container:b3-dialog/inline-size}.b3-dialog::backdrop{background:#101b17a6}.b3-dialog[data-b3-placement=end]{border-radius:0;block-size:100svh;max-block-size:100svh;inline-size:min(28rem,100%);max-inline-size:100%;margin:0;margin-inline-start:auto}@media (prefers-reduced-motion:no-preference){.b3-dialog[open]{animation:.28s cubic-bezier(.16,1,.3,1) b3-dialog-enter}.b3-dialog[open][data-b3-placement=end]{animation-name:b3-drawer-enter}.b3-dialog::backdrop,.b3-sheet::backdrop{transition:opacity .16s ease-out}.b3-dialog[data-b3-closing]::backdrop,.b3-sheet[data-b3-closing]::backdrop{opacity:0}@keyframes b3-dialog-enter{0%{opacity:0;transform:translateY(8px)scale(.96)}}@keyframes b3-drawer-enter{0%{opacity:0;translate:var(--b3-drawer-offset,1rem)}}.b3-dialog[dir=rtl][data-b3-placement=end],[dir=rtl] .b3-dialog[data-b3-placement=end]{--b3-drawer-offset:-1rem}}.b3-dialog>form{gap:var(--b3-space);flex-direction:column;margin:0;display:flex}.b3-dialog>form>header:has(>button:last-child){grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:.75rem;display:grid}.b3-dialog>form>header:has(>button:last-child)>:not(:last-child){grid-column:1;min-inline-size:0}.b3-dialog>form>header>button:last-child:not(:first-child){grid-area:1/2}.b3-dialog>form>footer{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:.75rem;display:flex}.b3-dialog>form>footer>[data-b3-emphasis=quiet]:first-child:not(:last-child){margin-inline-end:auto}@container b3-dialog (width<=16rem){.b3-dialog>form>header:has(>button:last-child){flex-direction:column;align-items:flex-start;display:flex}}.b3-tree,.b3-tree ul{overflow-wrap:anywhere;border-inline-start:1px solid var(--b3-color-border);padding-inline-start:min(1rem,5%);list-style:none}.b3-tree summary{cursor:pointer;padding-block:.5rem}.b3-prose{overflow-wrap:anywhere;max-inline-size:65ch;line-height:1.75}.b3-prose :is(p,ul,ol,blockquote,pre){margin-block:1rem}.b3-prose :is(h1,h2,h3,h4,h5,h6){margin-block:1.75rem .75rem;line-height:1.25}.b3-prose :is(h5,h6){font-size:1em}.b3-prose>:first-child{margin-block-start:0}.b3-prose :is(img,video,iframe){max-inline-size:100%;display:block}.b3-prose :is(img,video){block-size:auto}.b3-prose iframe{border:0}.b3-prose blockquote{border-inline-start:3px solid var(--b3-color-accent);color:var(--b3-color-muted);margin-inline:0;padding-inline-start:1rem}.b3-prose pre{background:var(--b3-color-surface);border:1px solid var(--b3-color-border);border-radius:var(--b3-radius-small);padding:1rem;overflow-x:auto}.b3-visually-hidden{clip-path:inset(50%);white-space:nowrap;block-size:1px;inline-size:1px;position:absolute;overflow:hidden}.b3-skip-link{z-index:1000;border-radius:var(--b3-radius-small);background:var(--b3-color-accent);max-inline-size:calc(100% - 1.5rem);color:var(--b3-color-on-accent);padding:.75rem 1rem;font-weight:650;position:fixed;inset-block-start:max(.75rem, env(safe-area-inset-top,0px));inset-inline-start:.75rem}.b3-skip-link:not(:focus){clip-path:inset(50%);white-space:nowrap;block-size:1px;inline-size:1px;padding:0;overflow:hidden}.b3-hero{grid-template-columns:repeat(2,minmax(0,1fr));align-items:center;gap:clamp(2rem,6vw,6rem);padding-block:clamp(3rem,8vw,7rem);display:grid}.b3-hero[data-b3-align=center]{text-align:center;grid-template-columns:minmax(0,1fr);justify-items:center}.b3-hero-copy{gap:1.5rem;max-inline-size:40rem;display:grid}.b3-feature{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:clamp(1.5rem,5vw,5rem);padding-block:clamp(2rem,6vw,5rem);display:grid}.b3-feature[data-b3-reverse=true]>:first-child{order:2}.b3-feature-icon{border-radius:var(--b3-radius);background:var(--b3-color-accent);block-size:3rem;inline-size:3rem;color:var(--b3-color-on-accent);place-items:center;display:inline-grid}.b3-pricing{border:1px solid var(--b3-color-border);border-radius:var(--b3-radius-large);background:var(--b3-color-surface);color:var(--b3-color-text);flex-direction:column;gap:1.25rem;padding:clamp(1.25rem,3vw,2rem);display:flex}.b3-pricing[data-b3-featured=true]{border:2px solid var(--b3-color-accent);box-shadow:var(--b3-shadow)}.b3-pricing>.b3-button:last-child{margin-block-start:auto}.b3-price{font-variant-numeric:tabular-nums;flex-wrap:wrap;align-items:baseline;gap:.375rem;display:flex}.b3-price>strong{letter-spacing:-.05em;font-size:3.25rem;line-height:1.1}.b3-checklist{gap:.75rem;margin:0;padding:0;list-style:none;display:grid}.b3-checklist>li{align-items:start;gap:.625rem;display:flex}.b3-checklist>li:before{content:"✓";color:var(--b3-color-accent);font-weight:700}.b3-quote{border-inline-start:3px solid var(--b3-color-accent);margin:0;padding:1.5rem}.b3-quote blockquote{margin:0 0 1rem;font-size:1.25rem;line-height:1.5}.b3-art{isolation:isolate;border-radius:var(--b3-radius-large);background:var(--b3-color-surface);position:relative;overflow:hidden}.b3-art:before{content:"";z-index:-1;pointer-events:none;position:absolute;inset:0}.b3-art[data-b3-art=dots]:before{background-image:radial-gradient(var(--b3-color-border) 1px,transparent 1px);background-size:16px 16px}.b3-art[data-b3-art=glow]:before{background:radial-gradient(ellipse at 20% 20%,color-mix(in srgb,var(--b3-color-accent) 20%,transparent),transparent 65%)}.b3-art[data-b3-art=wash]:before{background:linear-gradient(135deg,color-mix(in srgb,var(--b3-color-accent) 14%,transparent),transparent 70%)}@media (width<=48rem){.b3-hero,.b3-feature{grid-template-columns:minmax(0,1fr)}.b3-feature[data-b3-reverse=true]>:first-child{order:initial}}.b3-reading{grid-template-columns:minmax(0,1fr) minmax(12rem,16rem);grid-template-areas:"content outline";align-items:start;gap:clamp(2rem,5vw,5rem);display:grid}.b3-reading>:not(.b3-toc){grid-area:content;min-inline-size:0}.b3-toc{max-block-size:calc(100svh - var(--b3-outline-top,1rem) - 1rem);border-inline-start:1px solid var(--b3-color-border);grid-area:outline;padding-inline-start:min(1rem,5%);font-size:.875rem;position:sticky;inset-block-start:var(--b3-outline-top,1rem);overflow-y:auto}.b3-toc ol{gap:.25rem;margin:.75rem 0 0;padding:0;list-style:none;display:grid}.b3-toc ol ol{margin:.25rem 0;padding-inline-start:min(1rem,5%)}.b3-toc-link{border-radius:var(--b3-radius-small);color:var(--b3-color-muted);overflow-wrap:anywhere;padding:.625rem min(.75rem,5%);text-decoration:none;display:block}.b3-toc-link:hover{color:var(--b3-color-text);background:var(--b3-color-surface)}.b3-toc-link[aria-current=location]{color:var(--b3-color-accent);background:color-mix(in srgb, var(--b3-color-accent) 10%, var(--b3-color-surface));font-weight:650}@media (width<=48rem){.b3-reading{grid-template-columns:minmax(0,1fr);grid-template-areas:"outline""content";gap:2rem}.b3-toc{max-block-size:none;position:static}}.b3-command{inline-size:min(38rem,100% - 2rem);padding:0}.b3-command[open]:has(>.b3-scroll){grid-template-rows:auto minmax(0,1fr);display:grid}.b3-command>.b3-scroll>.b3-command-list{max-block-size:none;overflow:visible}.b3-command-search{border-block-end:1px solid var(--b3-color-border);flex-wrap:wrap;justify-content:end;align-items:center;gap:.75rem;padding:min(1rem,4vw);display:flex}.b3-command-search>input{flex:12ch;min-inline-size:0}.b3-command-list{overscroll-behavior:contain;max-block-size:50svh;padding:.5rem;overflow-y:auto}.b3-command-group+.b3-command-group{border-block-start:1px solid var(--b3-color-border);margin-block-start:.5rem;padding-block-start:.5rem}.b3-command-group>:first-child:not([role=option]){color:var(--b3-color-muted);padding:.5rem .75rem;font-size:.75rem;display:block}.b3-command-item{border-radius:var(--b3-radius-small);cursor:pointer;justify-content:space-between;align-items:center;gap:min(1rem,2vw);min-block-size:2.75rem;padding:min(.875rem,2svh) min(.75rem,3vw);display:flex}.b3-command .b3-command-item{border-radius:max(0px, calc(var(--b3-radius-large) - .5rem - 1px))}.b3-command-item>:first-child{overflow-wrap:anywhere;min-inline-size:0}.b3-command-item[aria-selected=true]{background:var(--b3-color-accent);color:var(--b3-color-on-accent)}.b3-command-item[aria-selected=true] .b3-muted{color:inherit}.b3-command-item[aria-disabled=true]{opacity:.5;cursor:not-allowed}.b3-command-item:not([aria-disabled=true]):hover{outline:1px solid var(--b3-color-border);outline-offset:-1px}.b3-form-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,14rem),1fr));align-items:start;gap:1.25rem;display:grid}.b3-form-grid[data-b3-layout=inline]{flex-wrap:wrap;align-items:end;display:flex}.b3-form-grid[data-b3-layout=inline]>.b3-field{flex:12rem;min-inline-size:0}.b3-form-grid[data-b3-layout=inline]>.b3-button{overflow-wrap:anywhere;flex:0 auto;max-inline-size:100%}.b3-fieldset{border:0;min-inline-size:0;margin:0;padding:0}.b3-fieldset>legend{padding:0 0 .75rem;font-weight:650}.b3-help,.b3-error{overflow-wrap:anywhere}.b3-help{color:var(--b3-color-muted);font-size:.875rem}.b3-help[data-b3-tone=success]{color:var(--b3-color-success)}.b3-help[data-b3-tone=warning]{color:var(--b3-color-warning)}.b3-input:where(:not([type=checkbox],[type=radio]))[data-b3-size=small]{padding:.5rem .75rem}.b3-input:where(:not([type=checkbox],[type=radio]))[data-b3-size=large]{min-block-size:3.25rem;padding:.875rem 1rem}.b3-input[data-b3-emphasis=subtle]{background-color:var(--b3-color-canvas);border-color:#0000}.b3-input[data-b3-emphasis=outline]{background-color:#0000;border-width:2px}.b3-input[data-b3-tone=success]{border-color:var(--b3-color-success)}.b3-input[data-b3-tone=warning]{border-color:var(--b3-color-warning)}.b3-input[aria-invalid=true]{border-color:var(--b3-color-danger)}textarea.b3-input{resize:vertical}select.b3-input[multiple]{min-block-size:8rem}.b3-input[type=file]{padding:.375rem}.b3-input::file-selector-button{font:inherit;border-radius:max(0px, calc(var(--b3-radius) - .375rem - 1px));background:var(--b3-color-accent);color:var(--b3-color-on-accent);cursor:pointer;border:0;margin-inline-end:.75rem;padding:.5rem .75rem}.b3-input[data-b3-emphasis=outline]::file-selector-button{border-radius:max(0px, calc(var(--b3-radius) - .375rem - 2px))}.b3-input[type=color]{inline-size:5rem;padding:.25rem}.b3-range{min-block-size:2.75rem;inline-size:100%;accent-color:var(--b3-color-accent);margin:0}.b3-choice-card{border:1px solid var(--b3-color-border);border-radius:var(--b3-radius);background:var(--b3-color-surface);color:var(--b3-color-text);cursor:pointer;flex-wrap:wrap;align-items:start;gap:.75rem;padding:1rem;display:flex}.b3-choice-card>:not(input){overflow-wrap:anywhere;flex:12ch;min-inline-size:0}.b3-choice-card>input{flex:none;block-size:1.125rem;inline-size:1.125rem;margin-block-start:.3rem}.b3-choice-card:has(input:checked){border-color:var(--b3-color-accent);background:color-mix(in srgb, var(--b3-color-accent) 7%, var(--b3-color-surface));box-shadow:inset 0 0 0 1px var(--b3-color-accent)}.b3-choice-card:has(input:focus-visible){outline:none;box-shadow:inset 0 0 0 2px}.b3-choice-card:has(input:disabled){opacity:.5;cursor:not-allowed}.b3-choice-card:has(input[aria-invalid=true]){border-color:var(--b3-color-danger)}.b3-range[aria-invalid=true]{accent-color:var(--b3-color-danger)}.b3-stepper{flex-wrap:wrap;gap:1rem 2rem;margin:0;padding:0;list-style:none;display:flex}.b3-step{color:var(--b3-color-muted);align-items:center;gap:.625rem;font-size:.875rem;display:flex}.b3-step-marker{border:1px solid var(--b3-color-border);font-variant-numeric:tabular-nums;border-radius:50%;flex:none;place-items:center;block-size:2rem;inline-size:2rem;display:grid}.b3-step[aria-current=step]{color:var(--b3-color-text);font-weight:650}.b3-step[aria-current=step] .b3-step-marker{background:var(--b3-color-accent);color:var(--b3-color-on-accent);border-color:var(--b3-color-accent)}.b3-step[data-b3-complete=true] .b3-step-marker{border-color:var(--b3-color-success);color:var(--b3-color-success)}.b3-conversation{gap:1.5rem;min-inline-size:0;margin:0;padding:0;list-style:none;display:grid}.b3-message{grid-template-columns:minmax(0,1fr);justify-self:start;gap:.375rem;min-inline-size:0;max-inline-size:min(85%,38rem);display:grid}.b3-message[data-b3-side=self]{justify-self:end}.b3-message-body{border:1px solid var(--b3-color-border);border-radius:var(--b3-radius);background:var(--b3-color-surface);color:var(--b3-color-text);white-space:pre-wrap;overflow-wrap:anywhere;padding:.75rem 1rem}.b3-message[data-b3-side=self]>.b3-message-body{background:var(--b3-color-accent);color:var(--b3-color-on-accent);border-color:#0000}.b3-message-meta{color:var(--b3-color-muted);flex-wrap:wrap;gap:.35rem .75rem;font-size:.8125rem;display:flex}.b3-message[data-b3-side=self]>.b3-message-meta{justify-content:end}.b3-conversation{align-content:start}.b3-message-body:has(>:is(div,p,ul,ol,table,pre,blockquote,b3-markdown-stream)){white-space:normal}.b3-composer{align-items:end;gap:var(--b3-space-2);padding:var(--b3-space-3);border-block-start:1px solid var(--b3-color-border);background:var(--b3-color-canvas);flex-wrap:wrap;display:flex}.b3-composer>.b3-input,.b3-composer>.b3-button{border-radius:var(--b3-radius);min-block-size:var(--b3-d-control,2.75rem)}.b3-composer>.b3-input{resize:none;min-inline-size:0;max-inline-size:100%;padding-block:calc((var(--b3-d-control,2.75rem) - 1.5em - 2px) / 2);flex:12ch;line-height:1.5}.b3-composer>.b3-button{block-size:var(--b3-d-control,2.75rem);min-inline-size:var(--b3-d-control,2.75rem);flex-shrink:0;margin-inline-start:auto}.b3-message-body :where(p,ul,ol,pre,table,blockquote,h1,h2,h3,h4,h5,h6,div,figure):first-child{margin-block-start:0}.b3-message-body :where(p,ul,ol,pre,table,blockquote,h1,h2,h3,h4,h5,h6,div,figure):last-child{margin-block-end:0}.b3-mobile-app{--b3-touch:44px;min-block-size:100svh;max-inline-size:var(--b3-app-width,70rem);margin-inline:auto;padding-block-end:calc(5.5rem + env(safe-area-inset-bottom,0px))}.b3-mobile-app[data-b3-platform=android]{--b3-touch:48px}.b3-mobile-app :where(button,.b3-button,select,input:not([type=checkbox],[type=radio])){min-block-size:var(--b3-touch)}.b3-app-bar{padding:max(.75rem, env(safe-area-inset-top,0px)) 1.25rem .75rem;align-items:center;gap:.75rem;display:flex}.b3-app-bar>:last-child:not(:first-child){margin-inline-start:auto}.b3-bottom-nav{z-index:10;max-inline-size:var(--b3-app-width,70rem);padding:.5rem clamp(.5rem, 2vw, 1rem) max(.5rem, env(safe-area-inset-bottom,0px));background:var(--b3-color-surface);color:var(--b3-color-text);border-block-start:1px solid var(--b3-color-border);flex-wrap:wrap;justify-content:space-around;gap:.125rem;margin-inline:auto;display:flex;position:fixed;inset-block-end:0;inset-inline:0}.b3-bottom-link{appearance:none;cursor:pointer;overflow-wrap:anywhere;text-align:center;flex:1 1 max-content;min-block-size:var(--b3-touch,44px);min-inline-size:var(--b3-touch,44px);max-inline-size:100%;color:var(--b3-color-muted);background:0 0;border:0;border-radius:1rem;flex-direction:column;justify-content:center;align-items:center;gap:.15rem;padding:.25rem clamp(.125rem,1vw,.5rem);font-size:.75rem;text-decoration:none;display:flex}.b3-bottom-link:disabled{opacity:.5;cursor:not-allowed}.b3-bottom-link:has(svg){justify-content:flex-start}.b3-bottom-link[aria-current=page]{color:var(--b3-color-accent);font-weight:700}[data-b3-platform=android] .b3-bottom-link[aria-current=page]{background:var(--b3-color-canvas)}.b3-mobile-list{border:1px solid var(--b3-color-border);background:var(--b3-color-surface);border-radius:1rem;margin:0;padding:0;list-style:none;overflow:hidden}.b3-mobile-list>li+li{border-block-start:1px solid var(--b3-color-border)}.b3-mobile-row{min-block-size:var(--b3-touch,44px);color:var(--b3-color-text);align-items:center;gap:1rem;padding:.875rem 1rem;text-decoration:none;display:flex}.b3-mobile-row>:last-child:not(:first-child){margin-inline-start:auto}.b3-sheet{inline-size:min(100%, var(--b3-overlay-width,32rem));max-inline-size:none;max-block-size:min(85dvh, calc(100dvh - env(safe-area-inset-top,0px) - 1rem));overscroll-behavior:contain;border:1px solid var(--b3-color-border);padding:1.5rem min(1.5rem, 5vi) max(1.5rem, env(safe-area-inset-bottom,0px));background:var(--b3-color-surface);color:var(--b3-color-text);border-radius:1.5rem 1.5rem 0 0;margin:0 auto;inset:auto 0 0;overflow-y:auto}.b3-sheet::backdrop{background:#0007}.b3-sheet [data-b3-initial-focus]:focus{box-shadow:none;outline:none}.b3-sheet-handle{min-block-size:44px;inline-size:5rem;color:var(--b3-color-muted);touch-action:none;cursor:grab;background:0 0;border:0;border-radius:1rem;flex:none;align-self:center;place-items:center;margin-block:-1rem -.5rem;padding:0;display:grid}.b3-sheet-handle:before{content:"";background:currentColor;border-radius:1rem;block-size:.25rem;inline-size:2.25rem}.b3-sheet[data-b3-dragging]{animation:none}.b3-sheet[data-b3-dragging] .b3-sheet-handle{cursor:grabbing}[data-b3-platform=android] .b3-mobile-list{border-radius:1.5rem}@media (prefers-reduced-motion:no-preference){.b3-sheet[open]{animation:.32s cubic-bezier(.16,1,.3,1) b3-sheet-enter}@keyframes b3-sheet-enter{0%{opacity:0;transform:translateY(3rem)}to{opacity:1;transform:translateY(0)}}}.b3-root:has(dialog:modal){overflow:hidden}.b3-bottom-link[aria-current=page]{background:color-mix(in srgb, var(--b3-color-accent) 12%, transparent)}.b3-bottom-link :where(svg:not([width])){flex:none;block-size:1.375rem;inline-size:1.375rem}.b3-bottom-link>:where(span,strong):not(.b3-count){white-space:normal;overflow-wrap:anywhere;max-inline-size:100%;overflow:visible}:has(>.b3-bottom-link:nth-of-type(5))>.b3-bottom-link{padding-inline:.125rem;font-size:.6875rem}.b3-app-frame{inline-size:100%;block-size:var(--b3-frame-height,100dvh);min-block-size:0;max-inline-size:var(--b3-app-width,70rem);padding:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px);grid-template-rows:auto minmax(0,1fr) auto;margin-inline:auto;display:grid;overflow:clip}.b3-app-frame>header{grid-row:1;min-inline-size:0}.b3-app-frame>main{overscroll-behavior:contain;grid-area:2/1;min-block-size:0;min-inline-size:0;overflow:auto}.b3-app-frame>:is(nav,footer){grid-row:3;min-inline-size:0;position:relative}.b3-app-frame>.b3-toast-region{overscroll-behavior:contain;grid-area:2/1;place-self:end;min-block-size:0;max-block-size:calc(100% - 2rem);margin:1rem;position:relative;inset:auto;overflow-y:auto}.b3-app-frame>.b3-app-bar{padding-block-start:.75rem}.b3-app-frame:has(>.b3-bottom-nav,>footer .b3-bottom-nav){padding-block-end:0}.b3-app-frame .b3-bottom-nav{inline-size:100%;max-inline-size:none;padding-block-end:max(.5rem, env(safe-area-inset-bottom,0px));position:static}:where(.b3-root[data-b3-density]) .b3-button{min-block-size:var(--b3-d-control,2.75rem);padding:var(--b3-d-pad-block,.625rem) var(--b3-d-pad-inline,1rem);font-size:var(--b3-d-label,inherit)}:where(.b3-root[data-b3-density]) .b3-button[data-b3-size=small]{min-block-size:var(--b3-d-control-small,auto);padding:calc(var(--b3-d-pad-block,.5rem) - .125rem) calc(var(--b3-d-pad-inline,.75rem) - .25rem)}:where(.b3-root[data-b3-density]) .b3-input:where(:not([type=checkbox],[type=radio])){min-block-size:var(--b3-d-control,2.75rem);padding:calc((var(--b3-d-control,2.75rem) - 1.5em - 2px) / 2) .75rem;line-height:1.5}:where(.b3-root[data-b3-density]) .b3-nav-link{min-block-size:var(--b3-d-control,2.75rem);padding:var(--b3-d-pad-block,.625rem) min(var(--b3-d-pad-inline,.875rem), 4%);font-size:var(--b3-d-label,inherit)}:where(.b3-root[data-b3-density]) .b3-heading{font-size:var(--b3-d-heading,1.375rem)}:where(.b3-root[data-b3-density]) .b3-avatar{block-size:var(--b3-d-avatar,2.5rem);inline-size:var(--b3-d-avatar,2.5rem)}:where(.b3-root[data-b3-density]) .b3-conversation{gap:var(--b3-d-gap,1.5rem)}:where(.b3-root[data-b3-density]) .b3-message-body{padding:var(--b3-d-message-pad,.75rem 1rem)}:where(.b3-root[data-b3-density]) .b3-message-meta{font-size:var(--b3-d-meta,.8125rem)}.b3-button[data-b3-emphasis=ghost]{color:var(--b3-color-muted);background:0 0;border-color:#0000}.b3-button[data-b3-emphasis=ghost]:not(:disabled):hover{color:var(--b3-color-text)}.b3-button[data-b3-emphasis=ghost][aria-pressed=true]{color:var(--b3-color-accent)}.b3-button[data-b3-icon]{min-inline-size:var(--b3-d-control,2.75rem);padding-inline:0}:where(.b3-root[data-b3-density]) .b3-button[data-b3-icon][data-b3-size=small]{min-inline-size:var(--b3-d-control-small,2.25rem)}.b3-button:disabled{opacity:1;background:color-mix(in srgb, var(--b3-color-muted) 14%, var(--b3-color-surface));color:var(--b3-color-muted);border-color:#0000}.b3-button[data-b3-emphasis=ghost]:disabled{background:0 0}.b3-truncate{white-space:nowrap;text-overflow:ellipsis;min-inline-size:0;overflow:hidden}.b3-strong{font-size:inherit;font-weight:650}.b3-caption{color:var(--b3-color-muted);font-size:.8125rem;line-height:1.4}.b3-heading[data-b3-size=small]{font-size:1.0625rem;line-height:1.3}:is(a,button).b3-caption{color:var(--b3-color-accent);cursor:pointer;text-underline-offset:.15em;background:0 0;border:0;padding:0}:is(a,button).b3-caption:is(:hover,:focus-visible){text-decoration:underline}:where(.b3-root[data-b3-density]) .b3-caption{font-size:var(--b3-d-meta,.8125rem)}.b3-badge{gap:.25rem}:where(.b3-root[data-b3-density]) .b3-surface{padding:var(--b3-d-surface-pad,clamp(1rem, 3vw, 2rem))}.b3-input-group,.b3-input-group>.b3-input-affix,.b3-input-group>.b3-input{background:var(--b3-color-surface)}.b3-root[data-b3-theme=dark] .b3-message[data-b3-side=self]>.b3-message-body{background:color-mix(in srgb, var(--b3-color-accent) 22%, var(--b3-color-surface));color:var(--b3-color-text)}.b3-empty{justify-items:center;gap:var(--b3-space-2);padding:var(--b3-space-12) var(--b3-space-4);text-align:center;color:var(--b3-color-muted);display:grid}.b3-empty>svg{color:var(--b3-color-muted)}}@property --b3-reel-fade{syntax:"<length>";inherits:false;initial-value:2.5rem}
@@ -1,6 +1,6 @@
1
1
  {
2
- "version": "0.1.0-alpha.127",
3
- "cssSha256": "bcd1ca98ef45cdb643cdf8c89b5e9c3950b1b7e8a594c7f3d236d7c5d1c3a434",
2
+ "version": "0.1.0-alpha.129",
3
+ "cssSha256": "d20f9a32de6b1d0561ef7ea0fc7638739d8ea01582edf00ceb8bb4885eb07973",
4
4
  "classes": [
5
5
  "b3-accordion",
6
6
  "b3-alert",
@@ -118,7 +118,7 @@
118
118
  "classes": [
119
119
  "b3-root"
120
120
  ],
121
- "guidance": "Place b3-root on html to synchronize the document canvas and native controls. Set data-b3-theme=\"dark\" explicitly for dark mode. A nested root inherits its parent theme and tokens; set data-b3-theme on it only to force a different theme. Override complete CSS values in --b3-* properties. Consumer CSS is unlayered and wins over library defaults. Scope custom palette overrides to each theme: unlayered :root token overrides beat layered library dark defaults. Use .b3-root:not([data-b3-theme=\"dark\"]) for light-only colors and .b3-root[data-b3-theme=\"dark\"] for dark overrides. Set foreground/background pairs together. Keep theme-invariant font, radius and spacing overrides outside light/dark selectors so switching theme preserves the app identity. Custom surfaces should use semantic color tokens, not a fixed light translucent fill behind theme-dependent text. Borders: --b3-color-border is the soft edge for cards, dividers, rows and bubbles; --b3-color-border-strong is the text-input edge (b3-input, textarea, select, b3-input-group, the composer field), kept at least 3:1 against both surface and canvas. Override both per theme; focus and error states keep their own colors. Check ordinary text at least 4.5:1 against its actual backing in every theme/state, including muted badges and selected filters. For translucent fills, composite over the real surface; a passing accent-on-white pair does not qualify an accent-tinted badge. Leave margin above the threshold. Density: data-b3-density=\"compact\" on the root tightens controls, nav, headings, avatars and messages for pointer-first apps; \"auto\" applies it only under a fine pointer on a wide viewport and keeps touch sizing on phones. For nested rounded surfaces with an even inset, derive the inner radius from the outer radius minus padding and border, clamped at zero. File-selector buttons and command-palette items follow this relationship. Match focus indicators to the element shape; keep surface colors theme-aware. Enabled native buttons inherit surrounding text color by default, including custom card actions; explicit component/app colors still win. Disabled native controls retain browser disabled styling.",
121
+ "guidance": "Place b3-root on html to synchronize the document canvas and native controls. Set data-b3-theme=\"dark\" explicitly for dark mode. A nested root inherits its parent theme and tokens; set data-b3-theme on it only to force a different theme. Override complete CSS values in --b3-* properties. Consumer CSS is unlayered and wins over library defaults. Scope custom palette overrides to each theme: unlayered :root token overrides beat layered library dark defaults. Use .b3-root:not([data-b3-theme=\"dark\"]) for light-only colors and .b3-root[data-b3-theme=\"dark\"] for dark overrides. Set foreground/background pairs together. Keep theme-invariant font, radius and spacing overrides outside light/dark selectors so switching theme preserves the app identity. Custom surfaces should use semantic color tokens, not a fixed light translucent fill behind theme-dependent text. Borders: --b3-color-border is the soft edge for cards, dividers, rows and bubbles; --b3-color-border-strong is the text-input edge (b3-input, textarea, select, b3-input-group, the composer field), kept at least 3:1 against both surface and canvas. Override both per theme; focus and error states keep their own colors. Check ordinary text at least 4.5:1 against its actual backing in every theme/state, including muted badges and selected filters. For translucent fills, composite over the real surface; a passing accent-on-white pair does not qualify an accent-tinted badge. Leave margin above the threshold. Density: data-b3-density=\"compact\" on the root tightens controls, nav, headings, avatars and messages for pointer-first apps; \"auto\" applies it only under a fine pointer on a wide viewport and keeps touch sizing on phones. For nested rounded surfaces with an even inset, derive the inner radius from the outer radius minus padding and border, clamped at zero. File-selector buttons and command-palette items follow this relationship. Match focus indicators to the element shape; keep surface colors theme-aware. Enabled native buttons inherit surrounding text color by default, including custom card actions; explicit component/app colors still win. Disabled native controls retain browser disabled styling. Theme verification: explicitly set data-b3-theme to light and dark and inspect actual canvas/text colors, not only color-scheme. System preference alone does not set this attribute; the host or app chooses it. Test custom palettes in both states. A dark native control on a fixed light canvas is not a completed dark theme.",
122
122
  "example": "<html class=\"b3-root\" data-b3-theme=\"dark\">\n<style>\n/* Identity applies in both themes; scope custom palette values separately. */\n.b3-root {\n --b3-font-body: system-ui, sans-serif;\n --b3-font-display: Georgia, serif;\n --b3-radius: 0.5rem;\n}\n.app-panel {\n color: var(--b3-color-text);\n background: var(--b3-color-surface);\n}\n</style>"
123
123
  },
124
124
  {
@@ -178,7 +178,7 @@
178
178
  "b3-input",
179
179
  "b3-error"
180
180
  ],
181
- "guidance": "Associate label for/id. Use aria-invalid and aria-describedby for errors; explain a fix. Never depend on color alone. App owns validation. Keep editable text while typing; on commit either explain invalid values or normalize the displayed value before any unchanged-state early return. A clamped state must not leave a different number visible. Native input/select/textarea behavior is retained. Single selects reserve an inline-end indicator lane that mirrors in RTL; multiple/listbox selects keep native presentation. Forced-colors mode restores the native indicator.",
181
+ "guidance": "Use b3-input for text-like inputs, selects and textareas, never checkbox or radio inputs. For checkbox/radio labels use b3-choice with a native input and a text span; the label supplies the layout and click target. Associate label for/id. Use aria-invalid and aria-describedby for errors; explain a fix. Never depend on color alone. App owns validation. Keep editable text while typing; on commit either explain invalid values or normalize the displayed value before any unchanged-state early return. A clamped state must not leave a different number visible. Native input/select/textarea behavior is retained. Single selects reserve an inline-end indicator lane that mirrors in RTL; multiple/listbox selects keep native presentation. Forced-colors mode restores the native indicator.",
182
182
  "example": "<div class=\"b3-field\"><label for=\"name\">Name</label><input id=\"name\" class=\"b3-input\" aria-invalid=\"true\" aria-describedby=\"error\"><p id=\"error\" class=\"b3-error\">Enter a name.</p></div>"
183
183
  },
184
184
  {
@@ -187,7 +187,7 @@
187
187
  "classes": [
188
188
  "b3-row"
189
189
  ],
190
- "guidance": "Use li inside ul/ol. Direct b3-row children remove native list indentation; ordinary prose lists keep it. The row supplies spacing/dividers; app code owns state, ordering and persistence.\n\nComposition: for a short label plus actions, use b3-row b3-split. For supporting notes, use the stacked example below: b3-row b3-stack stretches children and honors --b3-space; a nested b3-split holds primary metadata/value/actions, and the note gets the full width below. Avoid squeezing long notes beside fixed controls. Inset content only when adding an enclosing border/surface. Keep secondary actions readable and visually subordinate.\n\nLists: show useful rows before large summaries, with a short count and truthful empty state. Never invent user history. If reviewing is primary, use one disclosed add flow (native details/summary with b3-accordion); read form-composition.md. Task queues should show compact rows and reveal editing fields only for the edited item. Use existing disclosure/dialog semantics, not new density utilities. Check populated phone/desktop layouts, long notes and internal overflow.\n\nEditing: keep focused controls and caret/selection stable. Save drafts synchronously before replacing rows. Keep an edited row present while focus remains inside it, even if it stops matching a filter; read editable-filtered-rows.md for Tab/blur and exit timing. Give controls immutable identity independent of changing labels/actions: Edit → Done → Edit must reopen correctly. Checkbox completion: update the existing input/row and counts in place; never rebuild the list on change. If filtering hides the focused row, focus the next visible checkbox or stable add/filter control. See the concrete checkbox pattern in editable-filtered-rows.md. After deletion focus a surviving action or add control. Verify activeElement and persisted values, not just page width. Playground #row resets local state on reload. A row that opens something is itself the target: a.b3-row, button.b3-row or [role=\"button\"].b3-row gets inline padding, hover and active fills. Native button rows reset browser chrome and fill their container. For a list of conversation threads, use one such row per thread: sender + time, the opening text in b3-clamp, and a caption line with the reply count as an interactive caption. In a master/detail list mark the open row aria-current=\"true\" and it gets the selected fill (a system-color edge in forced-colors mode). Do not put aria-selected on ordinary links or buttons; that state belongs to selection-widget roles such as option or tab, with their required keyboard behavior.",
190
+ "guidance": "Use li inside ul/ol. Direct b3-row children remove native list indentation; ordinary prose lists keep it. The row supplies spacing/dividers; app code owns state, ordering and persistence.\n\nComposition: for a short label plus actions, use b3-row b3-split. For supporting notes, use the stacked example below: b3-row b3-stack stretches children and honors --b3-space; a nested b3-split holds primary metadata/value/actions, and the note gets the full width below. Avoid squeezing long notes beside fixed controls. Inset content only when adding an enclosing border/surface. Keep secondary actions readable and visually subordinate.\n\nLists: show useful rows before large summaries, with a short count and truthful empty state. Never invent user history. If reviewing is primary, use one disclosed add flow (native details/summary with b3-accordion); read form-composition.md. Task queues should show compact rows and reveal editing fields only for the edited item. Use existing disclosure/dialog semantics, not new density utilities. Check populated phone/desktop layouts, long notes and internal overflow.\n\nEditing: keep focused controls and caret/selection stable. Save drafts synchronously before replacing rows. Keep an edited row present while focus remains inside it, even if it stops matching a filter; read editable-filtered-rows.md for Tab/blur and exit timing. Give controls immutable identity independent of changing labels/actions: Edit → Done → Edit must reopen correctly. Checkbox completion: update the existing input/row and counts in place; never rebuild the list on change. If filtering hides the focused row, focus the next visible checkbox or stable add/filter control. See the concrete checkbox pattern in editable-filtered-rows.md. After deletion focus a surviving action or add control. Verify activeElement and persisted values, not just page width. The editable controls in playground #row reset on reload; the separate ledger example persists only its isolated example store. A row that opens something is itself the target: a.b3-row, button.b3-row or [role=\"button\"].b3-row gets inline padding, hover and active fills. Native button rows reset browser chrome and fill their container. For a list of conversation threads, use one such row per thread: sender + time, the opening text in b3-clamp, and a caption line with the reply count as an interactive caption. In a master/detail list mark the open row aria-current=\"true\" and it gets the selected fill (a system-color edge in forced-colors mode). Do not put aria-selected on ordinary links or buttons; that state belongs to selection-widget roles such as option or tab, with their required keyboard behavior. For local saved lists, copy the candidate-save-publish example in editable-filtered-rows.md. Never mutate committed arrays before storage succeeds: retrying a failed add can otherwise duplicate the draft. Keep status-action buttons stable when their label changes.",
191
191
  "example": "<ul>\n <li class=\"b3-row b3-stack\" style=\"--b3-space:.5rem\">\n <div class=\"b3-split\">\n <strong>Groceries</strong>\n <div class=\"b3-cluster\">\n <strong>$12.50</strong>\n <button class=\"b3-button\" data-b3-emphasis=\"quiet\" aria-label=\"Details for groceries\">Details</button>\n </div>\n </div>\n <p class=\"b3-muted\">Weekly shop and supplies for the shared kitchen.</p>\n </li>\n</ul>"
192
192
  },
193
193
  {
@@ -4,6 +4,32 @@ Use b3-row for a list or native rows inside b3-table. Layout does not own editin
4
4
 
5
5
  Build the candidate state before saving; publish it to committed in-memory state only after persistence succeeds, or explicitly roll back on failure. Otherwise duplicate guards can reject a retry for an item that was never saved or rendered. Keep initial rendering independent of a successful storage write. Preserve the user's input and show a recoverable error; test a failed save followed by a successful retry.
6
6
 
7
+ ## Save before publishing state
8
+
9
+ For a synchronous local example store, use the same commit boundary for add, edit, status and delete. `entries` is the committed array; never push/splice it or mutate one of its objects before saving. This is app code, not a Bare helper. Real account data needs the app's authoritative store instead.
10
+
11
+ ```js
12
+ function commit(candidate) {
13
+ try {
14
+ localStorage.setItem(key, JSON.stringify(candidate));
15
+ } catch (error) {
16
+ console.error('Save failed', error);
17
+ status.textContent = 'Not saved. Your draft is still here. Try again.';
18
+ return false;
19
+ }
20
+ entries = candidate;
21
+ return true;
22
+ }
23
+ // After validating the draft:
24
+ if (!commit([...entries, newEntry])) return;
25
+ renderCommittedState();
26
+ form.reset(); // Never clear a draft on failure.
27
+ ```
28
+
29
+ For updates build `entries.map(x => x.id === id ? { ...x, status: nextStatus } : x)`; for deletion use `entries.filter(x => x.id !== id)`. A failed write must leave memory, rendered rows, totals and storage at the same prior state. On retry, one draft adds exactly one record. For asynchronous stores, await success before publishing and guard concurrent submissions; this synchronous example is not a network transaction helper.
30
+
31
+ The Lists → “Save once, keep your place” specimen has a one-shot failure switch, retained draft, actual isolated browser storage, and a stable review action. Starting with two examples, fail an add then retry: three records, not four, including after reload. Do the same with Review: failure keeps the old status; success keeps focus on the same button. Reset affects only this specimen's storage key.
32
+
7
33
  Native change/blur can report activeElement as BODY before the next field receives focus. Capture row ownership on focusin, then reapply filtering only after native focus navigation has settled. Here `list` is the owning ul/ol/tbody, and `matchesFilter(row)` is your app's predicate. Bind before user interaction. These are app functions, not a Bare runtime API.
8
34
 
9
35
  ```js
@@ -33,6 +59,8 @@ The timeout defers only filtering. Never defer validation, state updates or pers
33
59
 
34
60
  ## Checkbox completion: update the existing row
35
61
 
62
+ For checkbox rows, use `<label class="b3-choice"><input type="checkbox"><span>Item name</span></label>`. Keep `b3-input` off checkbox/radio controls: it is for text-like fields. Put supporting row actions outside this label.
63
+
36
64
  Do not rebuild the list with `innerHTML` or `replaceChildren` on checkbox change: that removes the focused input, so the next Space/Tab starts from the page instead of the task. Keep the same checkbox node (stable keys in a framework). Commit the checked state, update counts and row styling in place, then apply the filter. When completion hides the focused row, move focus to the next visible checkbox, then the previous one, then a stable add/filter control. Do not steal focus for background updates.
37
65
 
38
66
  Use the single post-update focus policy below for checkbox completion too: capture ownership before committing, update the existing checkbox/counts/filter, then restore only if the owned focus became unusable. Commit before hiding; on failure roll back the checkbox and announce the error. Do not use `row.hidden` as the sole recovery condition: a visible row can lose focus when its action is replaced or disabled.
@@ -1,6 +1,6 @@
1
1
  # Input and error
2
2
 
3
- Associate label for/id. Use aria-invalid and aria-describedby for errors; explain a fix. Never depend on color alone. App owns validation. Keep editable text while typing; on commit either explain invalid values or normalize the displayed value before any unchanged-state early return. A clamped state must not leave a different number visible. Native input/select/textarea behavior is retained. Single selects reserve an inline-end indicator lane that mirrors in RTL; multiple/listbox selects keep native presentation. Forced-colors mode restores the native indicator.
3
+ Use b3-input for text-like inputs, selects and textareas, never checkbox or radio inputs. For checkbox/radio labels use b3-choice with a native input and a text span; the label supplies the layout and click target. Associate label for/id. Use aria-invalid and aria-describedby for errors; explain a fix. Never depend on color alone. App owns validation. Keep editable text while typing; on commit either explain invalid values or normalize the displayed value before any unchanged-state early return. A clamped state must not leave a different number visible. Native input/select/textarea behavior is retained. Single selects reserve an inline-end indicator lane that mirrors in RTL; multiple/listbox selects keep native presentation. Forced-colors mode restores the native indicator.
4
4
 
5
5
  Classes: b3-field, b3-input, b3-error
6
6
 
@@ -1,6 +1,6 @@
1
1
  # Root and theme
2
2
 
3
- Place b3-root on html to synchronize the document canvas and native controls. Set data-b3-theme="dark" explicitly for dark mode. A nested root inherits its parent theme and tokens; set data-b3-theme on it only to force a different theme. Override complete CSS values in --b3-* properties. Consumer CSS is unlayered and wins over library defaults. Scope custom palette overrides to each theme: unlayered :root token overrides beat layered library dark defaults. Use .b3-root:not([data-b3-theme="dark"]) for light-only colors and .b3-root[data-b3-theme="dark"] for dark overrides. Set foreground/background pairs together. Keep theme-invariant font, radius and spacing overrides outside light/dark selectors so switching theme preserves the app identity. Custom surfaces should use semantic color tokens, not a fixed light translucent fill behind theme-dependent text. Borders: --b3-color-border is the soft edge for cards, dividers, rows and bubbles; --b3-color-border-strong is the text-input edge (b3-input, textarea, select, b3-input-group, the composer field), kept at least 3:1 against both surface and canvas. Override both per theme; focus and error states keep their own colors. Check ordinary text at least 4.5:1 against its actual backing in every theme/state, including muted badges and selected filters. For translucent fills, composite over the real surface; a passing accent-on-white pair does not qualify an accent-tinted badge. Leave margin above the threshold. Density: data-b3-density="compact" on the root tightens controls, nav, headings, avatars and messages for pointer-first apps; "auto" applies it only under a fine pointer on a wide viewport and keeps touch sizing on phones. For nested rounded surfaces with an even inset, derive the inner radius from the outer radius minus padding and border, clamped at zero. File-selector buttons and command-palette items follow this relationship. Match focus indicators to the element shape; keep surface colors theme-aware. Enabled native buttons inherit surrounding text color by default, including custom card actions; explicit component/app colors still win. Disabled native controls retain browser disabled styling.
3
+ Place b3-root on html to synchronize the document canvas and native controls. Set data-b3-theme="dark" explicitly for dark mode. A nested root inherits its parent theme and tokens; set data-b3-theme on it only to force a different theme. Override complete CSS values in --b3-* properties. Consumer CSS is unlayered and wins over library defaults. Scope custom palette overrides to each theme: unlayered :root token overrides beat layered library dark defaults. Use .b3-root:not([data-b3-theme="dark"]) for light-only colors and .b3-root[data-b3-theme="dark"] for dark overrides. Set foreground/background pairs together. Keep theme-invariant font, radius and spacing overrides outside light/dark selectors so switching theme preserves the app identity. Custom surfaces should use semantic color tokens, not a fixed light translucent fill behind theme-dependent text. Borders: --b3-color-border is the soft edge for cards, dividers, rows and bubbles; --b3-color-border-strong is the text-input edge (b3-input, textarea, select, b3-input-group, the composer field), kept at least 3:1 against both surface and canvas. Override both per theme; focus and error states keep their own colors. Check ordinary text at least 4.5:1 against its actual backing in every theme/state, including muted badges and selected filters. For translucent fills, composite over the real surface; a passing accent-on-white pair does not qualify an accent-tinted badge. Leave margin above the threshold. Density: data-b3-density="compact" on the root tightens controls, nav, headings, avatars and messages for pointer-first apps; "auto" applies it only under a fine pointer on a wide viewport and keeps touch sizing on phones. For nested rounded surfaces with an even inset, derive the inner radius from the outer radius minus padding and border, clamped at zero. File-selector buttons and command-palette items follow this relationship. Match focus indicators to the element shape; keep surface colors theme-aware. Enabled native buttons inherit surrounding text color by default, including custom card actions; explicit component/app colors still win. Disabled native controls retain browser disabled styling. Theme verification: explicitly set data-b3-theme to light and dark and inspect actual canvas/text colors, not only color-scheme. System preference alone does not set this attribute; the host or app chooses it. Test custom palettes in both states. A dark native control on a fixed light canvas is not a completed dark theme.
4
4
 
5
5
  Classes: b3-root
6
6
 
@@ -6,7 +6,7 @@ Composition: for a short label plus actions, use b3-row b3-split. For supporting
6
6
 
7
7
  Lists: show useful rows before large summaries, with a short count and truthful empty state. Never invent user history. If reviewing is primary, use one disclosed add flow (native details/summary with b3-accordion); read form-composition.md. Task queues should show compact rows and reveal editing fields only for the edited item. Use existing disclosure/dialog semantics, not new density utilities. Check populated phone/desktop layouts, long notes and internal overflow.
8
8
 
9
- Editing: keep focused controls and caret/selection stable. Save drafts synchronously before replacing rows. Keep an edited row present while focus remains inside it, even if it stops matching a filter; read editable-filtered-rows.md for Tab/blur and exit timing. Give controls immutable identity independent of changing labels/actions: Edit → Done → Edit must reopen correctly. Checkbox completion: update the existing input/row and counts in place; never rebuild the list on change. If filtering hides the focused row, focus the next visible checkbox or stable add/filter control. See the concrete checkbox pattern in editable-filtered-rows.md. After deletion focus a surviving action or add control. Verify activeElement and persisted values, not just page width. Playground #row resets local state on reload. A row that opens something is itself the target: a.b3-row, button.b3-row or [role="button"].b3-row gets inline padding, hover and active fills. Native button rows reset browser chrome and fill their container. For a list of conversation threads, use one such row per thread: sender + time, the opening text in b3-clamp, and a caption line with the reply count as an interactive caption. In a master/detail list mark the open row aria-current="true" and it gets the selected fill (a system-color edge in forced-colors mode). Do not put aria-selected on ordinary links or buttons; that state belongs to selection-widget roles such as option or tab, with their required keyboard behavior.
9
+ Editing: keep focused controls and caret/selection stable. Save drafts synchronously before replacing rows. Keep an edited row present while focus remains inside it, even if it stops matching a filter; read editable-filtered-rows.md for Tab/blur and exit timing. Give controls immutable identity independent of changing labels/actions: Edit → Done → Edit must reopen correctly. Checkbox completion: update the existing input/row and counts in place; never rebuild the list on change. If filtering hides the focused row, focus the next visible checkbox or stable add/filter control. See the concrete checkbox pattern in editable-filtered-rows.md. After deletion focus a surviving action or add control. Verify activeElement and persisted values, not just page width. The editable controls in playground #row reset on reload; the separate ledger example persists only its isolated example store. A row that opens something is itself the target: a.b3-row, button.b3-row or [role="button"].b3-row gets inline padding, hover and active fills. Native button rows reset browser chrome and fill their container. For a list of conversation threads, use one such row per thread: sender + time, the opening text in b3-clamp, and a caption line with the reply count as an interactive caption. In a master/detail list mark the open row aria-current="true" and it gets the selected fill (a system-color edge in forced-colors mode). Do not put aria-selected on ordinary links or buttons; that state belongs to selection-widget roles such as option or tab, with their required keyboard behavior. For local saved lists, copy the candidate-save-publish example in editable-filtered-rows.md. Never mutate committed arrays before storage succeeds: retrying a failed add can otherwise duplicate the draft. Keep status-action buttons stable when their label changes.
10
10
 
11
11
  Classes: b3-row
12
12
 
@@ -8,7 +8,7 @@ Compose around the task: put useful primary content in the first phone screen. F
8
8
 
9
9
  Use only documented b3- class names; read type.md for title/heading roles. Read foundation.md for tokens and theme rules; layout.md for flexible composition; field.md for forms and errors; button.md for actions; status.md for progress. Use CSS custom properties with complete values, e.g. `--b3-color-accent: #315b43`. Scope palette overrides to light or dark explicitly; an unconditional unlayered :root color override also overrides the library dark default. Keep foreground/background pairs readable. Override typography, density, shape, and composition to create an identity, rather than recoloring a fixed template.
10
10
 
11
- Task behavior belongs to the app. Persist user changes, handle reload, use native controls, associate labels, and announce meaningful changes. Update affected content without replacing the control being used; whole-app redraws lose focus and drafts. If replacement is necessary, restore focus deliberately after rendering. Never claim a control works because it looks correct. No remote scripts or implicit platform API is available.
11
+ Apps own behavior. For saved lists, read editable-filtered-rows.md: persist an immutable candidate before publishing state or clearing drafts; a failed-save retry adds exactly one record. Keep active controls stable through status/filter changes; if replaced, restore usable focus after rendering. Use native labeled controls, announce changes and verify reload. No remote scripts or implicit platform API exists.
12
12
 
13
13
  Prototype guidance is experimental. Comparison evidence has not established superiority over bare-v2 or external alternatives.
14
14
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@livx.cc/bare-v3",
3
- "version": "0.1.0-alpha.127",
3
+ "version": "0.1.0-alpha.129",
4
4
  "type": "module",
5
5
  "thirdPartyNotices": "./dist/third-party.json",
6
6
  "files": [