/*! Suisou 3b97b1e — 全部入り（テーマ切替あり）
 * https://github.com/shiro-ka/Suisou
 * 生成物。編集しない。設計の根拠はリポジトリの ui/*.css と .notes/ にある。 */
:root {
  --suisou-size-12: 0.75rem;   --suisou-lh-12: 1rem;
  --suisou-size-14: 0.875rem;  --suisou-lh-14: 1.25rem;
  --suisou-size-16: 1rem;      --suisou-lh-16: 1.5rem;
  --suisou-size-20: 1.25rem;   --suisou-lh-20: 1.75rem;
  --suisou-size-24: 1.5rem;    --suisou-lh-24: 2rem;
  --suisou-size-28: 1.75rem;   --suisou-lh-28: 2rem;
  --suisou-size-32: 2rem;      --suisou-lh-32: 2.25rem;
  --suisou-space-1: 0.25rem;
  --suisou-space-2: 0.5rem;
  --suisou-space-3: 1rem;
  --suisou-space-4: 1.5rem;
  --suisou-measure: 64rem;
  --suisou-icon: 1.25rem;
  --suisou-icon-small: 1rem;
  --suisou-radius-small: 0.25rem;
  --suisou-radius: 0.5rem;
  --suisou-radius-pill: 999px;
  --suisou-font: "Zen Maru Gothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  --suisou-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --suisou-focus: 2px solid var(--suisou-focus-ring);
  --suisou-motion-fast: 120ms;
  --suisou-motion: 200ms;
  --suisou-ease: cubic-bezier(0.2, 0, 0, 1);
}
[data-suisou-root] {
  font-family: var(--suisou-font);
  font-size: var(--suisou-size-14);
  line-height: var(--suisou-lh-14);
  background: var(--suisou-bg);
  color: var(--suisou-text-main);
  accent-color: var(--suisou-accent);
  scrollbar-width: thin;
  scrollbar-color: var(--suisou-line-strong) transparent;
}
@media (prefers-reduced-motion: reduce) {
  :root {
    --suisou-motion-fast: 0.01ms;
    --suisou-motion: 0.01ms;
  }
}
:where([data-suisou-root] a) {
  color: inherit;
  text-decoration: none;
}
:where([data-suisou-root] a:focus-visible) {
  outline: var(--suisou-focus);
  outline-offset: 2px;
}
[data-suisou-text] { font-size: var(--fs); line-height: var(--lh); }
[data-suisou-text~="s12"] { --fs: var(--suisou-size-12); --lh: var(--suisou-lh-12); }
[data-suisou-text~="s14"] { --fs: var(--suisou-size-14); --lh: var(--suisou-lh-14); }
[data-suisou-text~="s16"] { --fs: var(--suisou-size-16); --lh: var(--suisou-lh-16); }
[data-suisou-text~="s20"] { --fs: var(--suisou-size-20); --lh: var(--suisou-lh-20); }
[data-suisou-text~="s24"] { --fs: var(--suisou-size-24); --lh: var(--suisou-lh-24); }
[data-suisou-text~="s28"] { --fs: var(--suisou-size-28); --lh: var(--suisou-lh-28); }
[data-suisou-text~="s32"] { --fs: var(--suisou-size-32); --lh: var(--suisou-lh-32); }
@media (min-width: 768px) {
  [data-suisou-text~="md:s12"] { --fs: var(--suisou-size-12); --lh: var(--suisou-lh-12); }
  [data-suisou-text~="md:s14"] { --fs: var(--suisou-size-14); --lh: var(--suisou-lh-14); }
  [data-suisou-text~="md:s16"] { --fs: var(--suisou-size-16); --lh: var(--suisou-lh-16); }
  [data-suisou-text~="md:s20"] { --fs: var(--suisou-size-20); --lh: var(--suisou-lh-20); }
  [data-suisou-text~="md:s24"] { --fs: var(--suisou-size-24); --lh: var(--suisou-lh-24); }
  [data-suisou-text~="md:s28"] { --fs: var(--suisou-size-28); --lh: var(--suisou-lh-28); }
  [data-suisou-text~="md:s32"] { --fs: var(--suisou-size-32); --lh: var(--suisou-lh-32); }
}
@media (min-width: 1024px) {
  [data-suisou-text~="lg:s12"] { --fs: var(--suisou-size-12); --lh: var(--suisou-lh-12); }
  [data-suisou-text~="lg:s14"] { --fs: var(--suisou-size-14); --lh: var(--suisou-lh-14); }
  [data-suisou-text~="lg:s16"] { --fs: var(--suisou-size-16); --lh: var(--suisou-lh-16); }
  [data-suisou-text~="lg:s20"] { --fs: var(--suisou-size-20); --lh: var(--suisou-lh-20); }
  [data-suisou-text~="lg:s24"] { --fs: var(--suisou-size-24); --lh: var(--suisou-lh-24); }
  [data-suisou-text~="lg:s28"] { --fs: var(--suisou-size-28); --lh: var(--suisou-lh-28); }
  [data-suisou-text~="lg:s32"] { --fs: var(--suisou-size-32); --lh: var(--suisou-lh-32); }
}
[data-suisou-text~="doc"] { line-height: calc(var(--lh) + 0.25rem); }
[data-suisou-text~="w400"] { font-weight: 400; }
[data-suisou-text~="w500"] { font-weight: 500; }
[data-suisou-text~="w700"] { font-weight: 700; }
[data-suisou-layout] {
  display: flex;
  gap: var(--suisou-space-2);
}
:where([data-suisou-layout]) > * { flex: none; }
[data-suisou-layout~="stack"]  { flex-direction: column; }
[data-suisou-layout~="row"]    { align-items: center; }
[data-suisou-layout~="center"] { display: grid; place-items: center; }
[data-suisou-layout~="frame"] {
  display: grid;
  grid-template-areas: "head"
                       "body"
                       "foot";
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto minmax(0, 1fr) auto;
}
[data-suisou-layout~="frame"]:has(> [data-suisou-layout~="aside"]) {
  grid-template-areas: "aside head"
                       "aside body"
                       "aside foot";
  grid-template-columns: auto minmax(0, 1fr);
}
[data-suisou-layout~="aside"] { grid-area: aside; }
[data-suisou-layout~="head"]  { grid-area: head; }
[data-suisou-layout~="body"]  { grid-area: body; }
[data-suisou-layout~="foot"]  { grid-area: foot; }
[data-suisou-layout~="stretch"] { align-items: stretch; }
[data-suisou-layout~="wrap"] { flex-wrap: wrap; }
[data-suisou-layout~="hold"]   { flex: none; }
[data-suisou-layout~="nowrap"] { flex-wrap: nowrap; }
[data-suisou-layout~="start"]   { justify-content: flex-start; }
[data-suisou-layout~="end"]     { justify-content: flex-end; }
[data-suisou-layout~="between"] { justify-content: space-between; }
[data-suisou-layout~="scroll"] { overflow: auto; }
[data-suisou-layout~="grow"] { flex: 1 1 auto; min-width: 0; min-height: 0; }
[data-suisou-layout~="screen"] { min-height: 100dvh; }
[data-suisou-layout~="even"] {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(0, 1fr);
}
[data-suisou-layout~="container"] {
  width: 100%;
  max-width: var(--suisou-measure);
  margin-inline: auto;
}
@media (width >= 768px) {
  [data-suisou-layout~="md:frame"] {
    display: grid;
    grid-template-areas: "head" "body" "foot";
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto minmax(0, 1fr) auto;
  }
  [data-suisou-layout~="md:frame"]:has(> [data-suisou-layout~="aside"]) {
    grid-template-areas: "aside head" "aside body" "aside foot";
    grid-template-columns: auto minmax(0, 1fr);
  }
  [data-suisou-layout~="md:stack"] { flex-direction: column; }
  [data-suisou-layout~="md:row"] { align-items: center; }
  [data-suisou-layout~="md:center"] { display: grid; place-items: center; }
  [data-suisou-layout~="md:stretch"] { align-items: stretch; }
  [data-suisou-layout~="md:wrap"] { flex-wrap: wrap; }
  [data-suisou-layout~="md:nowrap"] { flex-wrap: nowrap; }
  [data-suisou-layout~="md:scroll"] { overflow: auto; }
  [data-suisou-layout~="md:grow"] { flex: 1 1 auto; min-width: 0; min-height: 0; }
  [data-suisou-layout~="md:hold"] { flex: none; }
  [data-suisou-layout~="md:screen"] { min-height: 100dvh; }
  [data-suisou-layout~="md:even"] { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); }
  [data-suisou-layout~="md:start"] { justify-content: flex-start; }
  [data-suisou-layout~="md:end"] { justify-content: flex-end; }
  [data-suisou-layout~="md:between"] { justify-content: space-between; }
}
@media (width >= 1024px) {
  [data-suisou-layout~="lg:frame"] {
    display: grid;
    grid-template-areas: "head" "body" "foot";
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto minmax(0, 1fr) auto;
  }
  [data-suisou-layout~="lg:frame"]:has(> [data-suisou-layout~="aside"]) {
    grid-template-areas: "aside head" "aside body" "aside foot";
    grid-template-columns: auto minmax(0, 1fr);
  }
  [data-suisou-layout~="lg:stack"] { flex-direction: column; }
  [data-suisou-layout~="lg:row"] { align-items: center; }
  [data-suisou-layout~="lg:center"] { display: grid; place-items: center; }
  [data-suisou-layout~="lg:stretch"] { align-items: stretch; }
  [data-suisou-layout~="lg:wrap"] { flex-wrap: wrap; }
  [data-suisou-layout~="lg:nowrap"] { flex-wrap: nowrap; }
  [data-suisou-layout~="lg:scroll"] { overflow: auto; }
  [data-suisou-layout~="lg:grow"] { flex: 1 1 auto; min-width: 0; min-height: 0; }
  [data-suisou-layout~="lg:hold"] { flex: none; }
  [data-suisou-layout~="lg:screen"] { min-height: 100dvh; }
  [data-suisou-layout~="lg:even"] { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); }
  [data-suisou-layout~="lg:start"] { justify-content: flex-start; }
  [data-suisou-layout~="lg:end"] { justify-content: flex-end; }
  [data-suisou-layout~="lg:between"] { justify-content: space-between; }
}
[data-suisou-button] {
  box-sizing: border-box;
  font-family: inherit;
  font-size: var(--suisou-size-14);
  line-height: var(--suisou-lh-14);
  padding: var(--suisou-space-1) var(--suisou-space-2);
  border-radius: var(--suisou-radius);
  background: transparent;
  color: var(--suisou-text-sub);
  border: 1px solid transparent;
  cursor: pointer;
  transition: background-color var(--suisou-motion-fast) var(--suisou-ease),
              color            var(--suisou-motion-fast) var(--suisou-ease),
              border-color     var(--suisou-motion-fast) var(--suisou-ease);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--suisou-space-2);
}
[data-suisou-button]:hover {
  background: var(--suisou-hover-surface);
  color: var(--suisou-text-main);
}
[data-suisou-button]:active { background: var(--suisou-selected-surface); }
[data-suisou-button]:focus-visible { outline: var(--suisou-focus); outline-offset: 2px; }
[data-suisou-button] > svg {
  width: var(--suisou-icon);
  height: var(--suisou-icon);
  flex-shrink: 0;
}
[data-suisou-button~="outline"] {
  color: var(--suisou-accent);
  border-color: var(--suisou-accent);
  padding-inline: var(--suisou-space-3);
}
[data-suisou-button~="outline"]:hover { color: var(--suisou-accent); }
[data-suisou-button~="outline"]:active {
  color: var(--suisou-accent-active);
  border-color: var(--suisou-accent-active);
}
[data-suisou-button~="plain"] {
  border-color: var(--suisou-line-strong);
  padding-inline: var(--suisou-space-3);
}
[data-suisou-button~="danger"] {
  color: var(--suisou-error);
  border-color: var(--suisou-error);
  padding-inline: var(--suisou-space-3);
}
[data-suisou-button~="danger"]:hover  { color: var(--suisou-error); background: var(--suisou-error-surface); }
[data-suisou-button~="danger"]:active {
  color: var(--suisou-error-active);
  border-color: var(--suisou-error-active);
  background: var(--suisou-error-surface);
}
[data-suisou-button][aria-pressed="true"] {
  background: var(--suisou-selected-surface);
  color: var(--suisou-text-main);
}
[data-suisou-button~="neutral"][aria-pressed="true"] {
  background: var(--suisou-selected-neutral-surface);
}
[data-suisou-button~="icon"] {
  padding: 0;
  aspect-ratio: 1;
  min-width: 36px;
}
[data-suisou-button~="block"] {
  display: flex;
  width: 100%;
  justify-content: flex-start;
  padding: var(--suisou-space-2) var(--suisou-space-3);
}
[data-suisou-button~="wide"] {
  display: flex;
  width: 100%;
  padding-block: var(--suisou-space-2);
}
[data-suisou-button][disabled],
[data-suisou-button][aria-disabled="true"] {
  color: var(--suisou-text-disabled);
  border-color: transparent;
  background: transparent;
  cursor: default;
}
[data-suisou-button~="outline"][disabled],
[data-suisou-button~="plain"][disabled],
[data-suisou-button~="danger"][disabled] { border-color: var(--suisou-line-weak); }
[data-suisou-button-group] {
  display: inline-flex;
  border: 1px solid var(--suisou-line-strong);
  border-radius: var(--suisou-radius);
  overflow: hidden;
}
[data-suisou-button-group~="even"] {
  display: flex;
  width: 100%;
}
[data-suisou-button-group~="even"] > [data-suisou-button] {
  flex: 1 1 0;
  min-width: 0;
}
[data-suisou-button-group] > [data-suisou-button] {
  border-radius: 0;
  border-color: transparent;
}
[data-suisou-button-group] > [data-suisou-button] + [data-suisou-button] {
  border-left-color: var(--suisou-line-weak);
}
[data-suisou-button-group] > [data-suisou-field] {
  border: 0;
  border-radius: 0;
  background: transparent;
  flex: 1 1 auto;
  min-width: 0;
}
[data-suisou-button-group] > [data-suisou-field]:focus-visible { outline: none; }
[data-suisou-button-group] > [data-suisou-affix] {
  align-self: center;
  padding-inline-start: var(--suisou-space-2);
  color: var(--suisou-text-disabled);
  white-space: nowrap;
}
[data-suisou-button-group]:has(> [data-suisou-field]:focus-visible) {
  outline: var(--suisou-focus);
  outline-offset: 1px;
}
[data-suisou-surface] {
  box-sizing: border-box;
  border: 1px solid var(--suisou-line-weak);
  border-radius: var(--suisou-radius);
  padding: var(--suisou-space-3);
}
[data-suisou-surface~="panel"] {
  background: var(--suisou-panel);
  --suisou-line-weak: var(--suisou-line-weak-panel);
  --suisou-line-strong: var(--suisou-line-strong-panel);
}
[data-suisou-surface~="item"] {
  background: var(--suisou-item);
  --suisou-line-weak: var(--suisou-line-weak-item);
  --suisou-line-strong: var(--suisou-line-strong-item);
}
[data-suisou-surface~="none"]  { background: transparent; }
[data-suisou-surface~="overlay"] {
  background: var(--suisou-overlay);
  border-color: var(--suisou-line-strong-overlay);
  --suisou-line-weak: var(--suisou-line-weak-overlay);
  --suisou-line-strong: var(--suisou-line-strong-overlay);
}
[data-suisou-surface~="overlay"]::backdrop { background: var(--suisou-scrim); }
:where([popover], dialog)[data-suisou-surface~="overlay"] {
  opacity: 0;
  transition: opacity var(--suisou-motion) var(--suisou-ease),
              display var(--suisou-motion) allow-discrete,
              overlay var(--suisou-motion) allow-discrete;
}
:where([popover], dialog)[data-suisou-surface~="overlay"]:where(:popover-open, [open]) {
  opacity: 1;
}
@starting-style {
  :where([popover], dialog)[data-suisou-surface~="overlay"]:where(:popover-open, [open]) {
    opacity: 0;
  }
}
:where([popover], dialog)[data-suisou-surface~="overlay"]::backdrop {
  opacity: 0;
  transition: opacity var(--suisou-motion-fast) var(--suisou-ease),
              display var(--suisou-motion-fast) allow-discrete,
              overlay var(--suisou-motion-fast) allow-discrete;
}
:where([popover], dialog)[data-suisou-surface~="overlay"]:where(:popover-open, [open])::backdrop {
  opacity: 1;
}
@starting-style {
  :where([popover], dialog)[data-suisou-surface~="overlay"]:where(:popover-open, [open])::backdrop {
    opacity: 0;
  }
}
[data-suisou-surface~="drawer"] {
  --suisou-drawer: 20rem;
  position: fixed;
  inset: 0 0 0 auto;
  margin: 0;
  height: 100dvh;
  max-height: none;
  width: min(var(--suisou-drawer), 90vw);
  border: 0;
  border-inline-start: 1px solid var(--suisou-line-strong);
  border-radius: 0;
}
[data-suisou-surface~="drawer"][data-suisou-surface~="start"] {
  inset: 0 auto 0 0;
  border-inline-start: 0;
  border-inline-end: 1px solid var(--suisou-line-strong);
}
:where([popover], dialog)[data-suisou-surface~="drawer"] {
  --suisou-drawer-hidden: 100%;
  opacity: 1;
  translate: var(--suisou-drawer-hidden) 0;
  transition: translate var(--suisou-motion) var(--suisou-ease),
              display var(--suisou-motion) allow-discrete,
              overlay var(--suisou-motion) allow-discrete;
}
:where([popover], dialog)[data-suisou-surface~="drawer"][data-suisou-surface~="start"] {
  --suisou-drawer-hidden: -100%;
}
:where([popover], dialog)[data-suisou-surface~="drawer"]:where(:popover-open, [open]) {
  translate: 0 0;
}
@starting-style {
  :where([popover], dialog)[data-suisou-surface~="drawer"]:where(:popover-open, [open]) {
    translate: var(--suisou-drawer-hidden) 0;
  }
}
[data-suisou-surface~="bare"] { border-color: transparent; }
[data-suisou-surface~="tight"] { padding-block: var(--suisou-space-2); }
[data-suisou-surface~="empty"] {
  border-style: dashed;
  border-color: var(--suisou-line-strong);
}
[data-suisou-surface~="bleed"] { padding: 0; }
[data-suisou-prose] {
  font-size: var(--suisou-size-16);
  line-height: calc(var(--suisou-lh-16) + 0.25rem);
}
[data-suisou-prose] :where(h1, h2, h3, h4, h5, h6, p, ul, ol, dl, dd,
                          pre, blockquote, table, figure, hr) {
  margin: 0;
}
[data-suisou-prose] :where(h1) { font-size: var(--suisou-size-28); line-height: var(--suisou-lh-28); font-weight: 700; }
[data-suisou-prose] :where(h2) { font-size: var(--suisou-size-24); line-height: var(--suisou-lh-24); font-weight: 700; }
[data-suisou-prose] :where(h3) { font-size: var(--suisou-size-20); line-height: var(--suisou-lh-20); font-weight: 700; }
[data-suisou-prose] :where(h4) { font-size: var(--suisou-size-16); line-height: var(--suisou-lh-16); font-weight: 700; }
[data-suisou-prose] :where(h5) { font-size: var(--suisou-size-16); line-height: var(--suisou-lh-16); font-weight: 500; }
[data-suisou-prose] :where(h6) { font-size: var(--suisou-size-14); line-height: var(--suisou-lh-14); font-weight: 700; }
[data-suisou-prose] :where(h2, h3, h4, h5) { position: relative; }
[data-suisou-prose] :where(h2, h3, h4, h5)::before {
  content: "";
  position: absolute;
  top: 0.25em;
  bottom: 0.25em;
  border-radius: var(--suisou-radius-pill);
}
[data-suisou-prose] :where(h2)::before { width: 6px; left: calc(-1 * (6px + var(--suisou-space-2))); background: var(--suisou-accent); }
[data-suisou-prose] :where(h3)::before { width: 3px; left: calc(-1 * (3px + var(--suisou-space-2))); background: var(--suisou-accent); }
[data-suisou-prose] :where(h4)::before { width: 3px; left: calc(-1 * (3px + var(--suisou-space-2))); background: var(--suisou-line-weak); }
[data-suisou-prose] :where(h5)::before { width: 1px; left: calc(-1 * (1px + var(--suisou-space-2))); background: var(--suisou-line-weak); }
[data-suisou-prose] :where(small) { font-size: var(--suisou-size-14); line-height: var(--suisou-lh-14); }
[data-suisou-prose] :where(strong, b) { font-weight: 700; }
[data-suisou-prose] > :where(* + *) { margin-block-start: var(--suisou-space-3); }
[data-suisou-prose] > :where(* + :is(h1, h2, h3, h4, h5, h6)) {
  margin-block-start: var(--suisou-space-4);
}
[data-suisou-prose] > :where(:is(h1, h2, h3, h4, h5, h6) + *) {
  margin-block-start: var(--suisou-space-2);
}
[data-suisou-prose] :where(hr) {
  border: 0;
  border-top: 1px solid var(--suisou-line-weak);
}
[data-suisou-prose] > :where(hr),
[data-suisou-prose] > :where(hr + *) { margin-block-start: var(--suisou-space-4); }
[data-suisou-prose] :where(img, video) {
  display: block;
  max-width: 100%;
  height: auto;
  border-radius: var(--suisou-radius);
}
[data-suisou-prose] :where(dl) {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--suisou-space-1) var(--suisou-space-3);
}
[data-suisou-prose] :where(dt) { color: var(--suisou-text-sub); font-weight: 700; }
[data-suisou-prose~="tight"] {
  font-size: var(--suisou-size-14);
  line-height: calc(var(--suisou-lh-14) + 0.25rem);
}
[data-suisou-prose~="tight"] :where(h1) { font-size: var(--suisou-size-24); line-height: var(--suisou-lh-24); }
[data-suisou-prose~="tight"] :where(h2) { font-size: var(--suisou-size-20); line-height: var(--suisou-lh-20); }
[data-suisou-prose~="tight"] :where(h3) { font-size: var(--suisou-size-16); line-height: var(--suisou-lh-16); }
[data-suisou-prose~="tight"] :where(h4, h5) { font-size: var(--suisou-size-14); line-height: var(--suisou-lh-14); }
[data-suisou-prose~="tight"] > :where(* + *) { margin-block-start: var(--suisou-space-2); }
[data-suisou-prose~="tight"] > :where(* + :is(h1, h2, h3, h4, h5, h6)) {
  margin-block-start: var(--suisou-space-3);
}
[data-suisou-prose~="tight"] > :where(:is(h1, h2, h3, h4, h5, h6) + *) {
  margin-block-start: var(--suisou-space-1);
}
[data-suisou-quote],
[data-suisou-prose] :where(blockquote) {
  border-left: 3px solid var(--suisou-line-strong);
  padding-left: var(--suisou-space-3);
  color: var(--suisou-text-sub);
}
[data-suisou-quote] :where(p) + :where(p),
[data-suisou-prose] :where(blockquote) :where(p) + :where(p) {
  margin-block-start: var(--suisou-space-2);
}
[data-suisou-list],
[data-suisou-prose] :where(ul, ol) {
  padding-inline-start: var(--suisou-space-4);
}
[data-suisou-list] :where(li)::marker,
[data-suisou-prose] :where(ul, ol) :where(li)::marker {
  color: var(--suisou-text-sub);
}
[data-suisou-list] :where(li) + :where(li),
[data-suisou-prose] :where(ul, ol) :where(li) + :where(li) {
  margin-block-start: var(--suisou-space-1);
}
[data-suisou-list] :where(ul, ol),
[data-suisou-prose] :where(ul, ol) :where(ul, ol) {
  margin-block-start: var(--suisou-space-1);
}
[data-suisou-code],
[data-suisou-prose] :where(code) {
  font-family: var(--suisou-mono);
  font-size: 0.9em;
  background: var(--suisou-item);
  border-radius: var(--suisou-radius-small);
  padding: 0 var(--suisou-space-1);
}
[data-suisou-code~="block"],
[data-suisou-prose] :where(pre) {
  font-family: var(--suisou-mono);
  font-size: var(--suisou-size-12);
  line-height: var(--suisou-lh-14);
  margin: 0;
  padding: var(--suisou-space-2);
  background: var(--suisou-item);
  border: 1px solid var(--suisou-line-weak);
  border-radius: var(--suisou-radius);
  overflow-x: auto;
}
[data-suisou-code~="block"] :where(code),
[data-suisou-prose] :where(pre) :where(code) {
  font-size: inherit;
  background: none;
  border-radius: 0;
  padding: 0;
}
[data-suisou-link],
[data-suisou-prose] :where(a) {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.2em;
  transition: color var(--suisou-motion-fast) var(--suisou-ease);
}
[data-suisou-link]:hover,
[data-suisou-prose] :where(a):hover {
  color: var(--suisou-accent);
}
[data-suisou-link]:has(> img:only-child),
[data-suisou-prose] :where(a:has(> img:only-child)) {
  text-decoration: none;
}
[data-suisou-table],
[data-suisou-prose] :where(table) {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--suisou-size-14);
  line-height: var(--suisou-lh-14);
}
[data-suisou-table] :where(th, td),
[data-suisou-prose] :where(table) :where(th, td) {
  text-align: left;
  vertical-align: top;
  padding: var(--suisou-space-1) var(--suisou-space-2);
  border-bottom: 1px solid var(--suisou-line-weak);
}
[data-suisou-table] :where(th),
[data-suisou-prose] :where(table) :where(th) {
  color: var(--suisou-text-sub);
  font-weight: 700;
}
[data-suisou-table] :where(tr:last-child) :where(th, td),
[data-suisou-prose] :where(table) :where(tr:last-child) :where(th, td) { border-bottom: 0; }
[data-suisou-table~="tight"] {
  font-size: var(--suisou-size-12);
  line-height: var(--suisou-lh-12);
}
[data-suisou-table~="tight"] :where(th) { white-space: nowrap; }
[data-suisou-table~="scroll"] { display: block; overflow-x: auto; }
[data-suisou-field] {
  box-sizing: border-box;
  font-family: inherit;
  font-size: var(--suisou-size-14);
  line-height: var(--suisou-lh-14);
  padding: var(--suisou-space-1) var(--suisou-space-2);
  border-radius: var(--suisou-radius);
  background: var(--suisou-item);
  color: var(--suisou-text-main);
  border: 1px solid var(--suisou-line-strong);
  transition: border-color var(--suisou-motion-fast) var(--suisou-ease);
}
[data-suisou-field]::placeholder { color: var(--suisou-text-disabled); }
[data-suisou-field]:focus-visible {
  outline: var(--suisou-focus);
  outline-offset: 1px;
}
[data-suisou-field~="block"] { display: block; width: 100%; }
[data-suisou-field][aria-invalid="true"] { border-color: var(--suisou-error); }
[data-suisou-field][disabled],
[data-suisou-field][aria-disabled="true"] {
  color: var(--suisou-text-disabled);
  border-color: var(--suisou-line-weak);
  background: transparent;
  cursor: default;
}
[data-suisou-row] {
  padding: var(--suisou-space-1) var(--suisou-space-2);
  border-radius: var(--suisou-radius);
  transition: background-color var(--suisou-motion-fast) var(--suisou-ease);
}
[data-suisou-row]:hover {
  background: var(--suisou-hover-surface);
  --suisou-line-weak: var(--suisou-line-weak-hover);
  --suisou-line-strong: var(--suisou-line-strong-hover);
}
[data-suisou-row]:focus-visible { outline: var(--suisou-focus); outline-offset: -2px; }
[data-suisou-row][aria-selected="true"],
[data-suisou-row][aria-current]:not([aria-current="false"]) {
  background: var(--suisou-selected-surface);
  --suisou-line-weak: var(--suisou-line-weak-selected);
  --suisou-line-strong: var(--suisou-line-strong-selected);
}
[data-suisou-row~="neutral"][aria-selected="true"],
[data-suisou-row~="neutral"][aria-current]:not([aria-current="false"]) {
  background: var(--suisou-selected-neutral-surface);
  --suisou-line-weak: var(--suisou-line-weak-selected);
  --suisou-line-strong: var(--suisou-line-strong-selected);
}
[data-suisou-row~="ruled"] {
  border-radius: 0;
  padding-block: var(--suisou-space-2);
  border-bottom: 1px solid var(--suisou-line-weak);
}
[data-suisou-row~="ruled"]:last-child { border-bottom: 0; }
[data-suisou-row~="ruled"][aria-selected="true"],
[data-suisou-row~="ruled"][aria-current]:not([aria-current="false"]) {
  box-shadow: inset 2px 0 0 var(--suisou-accent);
}
[data-suisou-layout]:has(> [data-suisou-row~="ruled"]) { gap: 0; }
[data-suisou-icon] {
  width: var(--suisou-icon);
  height: var(--suisou-icon);
  flex: none;
}
[data-suisou-icon~="small"] {
  width: var(--suisou-icon-small);
  height: var(--suisou-icon-small);
}
[data-suisou-icon~="sub"]     { color: var(--suisou-text-sub); }
[data-suisou-icon~="accent"]  { color: var(--suisou-accent); }
[data-suisou-icon~="success"] { color: var(--suisou-success); }
[data-suisou-icon~="warning"] { color: var(--suisou-warning); }
[data-suisou-icon~="error"]   { color: var(--suisou-error); }
[data-suisou-tag] {
  display: inline-flex;
  align-items: center;
  gap: var(--suisou-space-1);
  font-size: var(--suisou-size-12);
  line-height: var(--suisou-lh-12);
  padding: 0 var(--suisou-space-2);
  border-radius: var(--suisou-radius-pill);
  border: 1px solid var(--suisou-line-weak);
  color: var(--suisou-text-sub);
  background: transparent;
  transition: color var(--suisou-motion-fast) var(--suisou-ease),
              border-color var(--suisou-motion-fast) var(--suisou-ease);
}
[data-suisou-tag~="accent"]  { border-color: var(--suisou-accent);  color: var(--suisou-accent); }
[data-suisou-tag~="error"]   { border-color: var(--suisou-error);   color: var(--suisou-error); }
[data-suisou-tag~="warning"] { border-color: var(--suisou-warning); color: var(--suisou-warning); }
[data-suisou-tag~="success"] { border-color: var(--suisou-success); color: var(--suisou-success); }
[data-suisou-tag~="bare"] { border-color: transparent; }
[data-suisou-tag] > svg {
  width: var(--suisou-icon-small);
  height: var(--suisou-icon-small);
  flex: none;
}
[data-suisou-media] {
  display: flex;
  gap: var(--suisou-space-2);
  align-items: flex-start;
}
[data-suisou-media-icon] { flex: none; }
[data-suisou-media-content] {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--suisou-space-1);
}
[data-suisou-media-tail] { flex: none; }
[data-suisou-media-content] :where(header) {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--suisou-space-2);
}
[data-suisou-media-content] :where(header) > :first-child {
  font-size: var(--suisou-size-14);
  line-height: var(--suisou-lh-14);
  font-weight: 700;
}
[data-suisou-media-content] :where(header) > :not(:first-child) {
  font-size: var(--suisou-size-12);
  line-height: var(--suisou-lh-12);
  color: var(--suisou-text-sub);
}
[data-suisou-media-content] :where(p) {
  margin: 0;
  font-size: var(--suisou-size-14);
  line-height: var(--suisou-lh-14);
}
[data-suisou-media~="stack"] { flex-direction: column; align-items: stretch; }
[data-suisou-avatar] {
  flex: none;
  box-sizing: border-box;
  width: var(--suisou-avatar, 2rem);
  height: var(--suisou-avatar, 2rem);
  border-radius: var(--suisou-radius-pill);
  background: var(--suisou-item);
  border: 1px solid var(--suisou-line-weak);
  color: var(--suisou-text-sub);
  font-size: var(--suisou-size-12);
  line-height: var(--suisou-lh-12);
  display: grid;
  place-items: center;
  overflow: hidden;
  object-fit: cover;
}
[data-suisou-avatar~="small"] { --suisou-avatar: 1.5rem; }
[data-suisou-avatar~="large"] { --suisou-avatar: 3rem; font-size: var(--suisou-size-16); }
[data-suisou-spinner] {
  --suisou-spinner: var(--suisou-icon);
  --suisou-spinner-time: 800ms;
  box-sizing: border-box;
  display: inline-block;
  flex: none;
  width: var(--suisou-spinner);
  height: var(--suisou-spinner);
  border-radius: var(--suisou-radius-pill);
  border: calc(var(--suisou-spinner) / 10) solid var(--suisou-line-weak);
  border-top-color: var(--suisou-accent);
  animation: suisou-spin var(--suisou-spinner-time) linear infinite;
}
@keyframes suisou-spin {
  to { transform: rotate(1turn); }
}
[data-suisou-spinner~="bar"] {
  width: auto;
  height: 2px;
  border: 0;
  background: var(--suisou-line-weak);
  overflow: hidden;
  animation: none;
  display: block;
}
[data-suisou-spinner~="bar"]::before {
  content: "";
  display: block;
  height: 100%;
  width: 40%;
  border-radius: inherit;
  background: var(--suisou-accent);
  animation: suisou-slide calc(var(--suisou-spinner-time) * 2) var(--suisou-ease) infinite;
}
@keyframes suisou-slide {
  from { transform: translateX(-100%); }
  to   { transform: translateX(350%); }
}
@media (prefers-reduced-motion: reduce) {
  [data-suisou-spinner] {
    animation: suisou-pulse 1.6s ease-in-out infinite;
    border-color: var(--suisou-accent);
  }
  [data-suisou-spinner~="bar"] {
    animation: none;
  }
  [data-suisou-spinner~="bar"]::before {
    width: 100%;
    animation: suisou-pulse 1.6s ease-in-out infinite;
  }
}
@keyframes suisou-pulse {
  50% { opacity: 0.35; }
}
[data-suisou-banner] {
  box-sizing: border-box;
  border: 1px solid;
  border-radius: var(--suisou-radius);
  padding: var(--suisou-space-2) var(--suisou-space-3);
  color: var(--suisou-text-main);
  font-size: var(--suisou-size-14);
  line-height: var(--suisou-lh-14);
}
[data-suisou-banner~="error"]   { border-color: var(--suisou-error);   background: var(--suisou-error-surface); }
[data-suisou-banner~="warning"] { border-color: var(--suisou-warning); background: var(--suisou-warning-surface); }
[data-suisou-banner~="success"] { border-color: var(--suisou-success); background: var(--suisou-success-surface); }
:root {
  --suisou-bg: oklch(15.00% 0.0060 286);
  --suisou-panel: oklch(22.00% 0.0060 286);
  --suisou-item: oklch(28.00% 0.0060 286);
  --suisou-overlay: oklch(34.00% 0.0060 286);
  --suisou-hover-surface: oklch(19.00% 0.0060 286);
  --suisou-selected-neutral-surface: oklch(33.00% 0.0060 286);
  --suisou-line-weak: oklch(31.35% 0.0060 286);
  --suisou-line-weak-panel: oklch(34.70% 0.0060 286);
  --suisou-line-weak-item: oklch(38.91% 0.0060 286);
  --suisou-line-weak-overlay: oklch(43.99% 0.0060 286);
  --suisou-line-weak-hover: oklch(33.04% 0.0060 286);
  --suisou-line-weak-selected: oklch(43.70% 0.0060 286);
  --suisou-line-strong: oklch(48.76% 0.0060 286);
  --suisou-line-strong-panel: oklch(51.74% 0.0060 286);
  --suisou-line-strong-item: oklch(55.78% 0.0060 286);
  --suisou-line-strong-overlay: oklch(61.04% 0.0060 286);
  --suisou-line-strong-hover: oklch(50.23% 0.0060 286);
  --suisou-line-strong-selected: oklch(60.73% 0.0060 286);
  --suisou-text-disabled: oklch(62.00% 0.0060 286);
  --suisou-text-sub: oklch(78.00% 0.0060 286);
  --suisou-text-main: oklch(94.00% 0.0060 286);
  --suisou-scrim: oklch(8.00% 0.0060 286 / 0.72);
  --suisou-error: oklch(73.00% 0.1580 22);
  --suisou-warning: oklch(82.00% 0.1592 90);
  --suisou-success: oklch(76.00% 0.1785 155);
  --suisou-error-active: oklch(70.00% 0.1816 22);
  --suisou-error-surface: oklch(33.00% 0.0531 22);
  --suisou-warning-surface: oklch(33.00% 0.0483 90);
  --suisou-success-surface: oklch(33.00% 0.0500 155);
  --suisou-accent: oklch(74.00% 0.1096 212);
  --suisou-accent-active: oklch(71.00% 0.1052 212);
  --suisou-focus-ring: oklch(74.00% 0.1096 212);
  --suisou-selected-surface: oklch(33.00% 0.0554 212);
}
[data-suisou-theme="hadal"] {
  --suisou-bg: oklch(15.00% 0.0060 286);
  --suisou-panel: oklch(22.00% 0.0060 286);
  --suisou-item: oklch(28.00% 0.0060 286);
  --suisou-overlay: oklch(34.00% 0.0060 286);
  --suisou-hover-surface: oklch(19.00% 0.0060 286);
  --suisou-selected-neutral-surface: oklch(33.00% 0.0060 286);
  --suisou-line-weak: oklch(31.35% 0.0060 286);
  --suisou-line-weak-panel: oklch(34.70% 0.0060 286);
  --suisou-line-weak-item: oklch(38.91% 0.0060 286);
  --suisou-line-weak-overlay: oklch(43.99% 0.0060 286);
  --suisou-line-weak-hover: oklch(33.04% 0.0060 286);
  --suisou-line-weak-selected: oklch(43.70% 0.0060 286);
  --suisou-line-strong: oklch(48.76% 0.0060 286);
  --suisou-line-strong-panel: oklch(51.74% 0.0060 286);
  --suisou-line-strong-item: oklch(55.78% 0.0060 286);
  --suisou-line-strong-overlay: oklch(61.04% 0.0060 286);
  --suisou-line-strong-hover: oklch(50.23% 0.0060 286);
  --suisou-line-strong-selected: oklch(60.73% 0.0060 286);
  --suisou-text-disabled: oklch(62.00% 0.0060 286);
  --suisou-text-sub: oklch(78.00% 0.0060 286);
  --suisou-text-main: oklch(94.00% 0.0060 286);
  --suisou-scrim: oklch(8.00% 0.0060 286 / 0.72);
  --suisou-error: oklch(73.00% 0.1580 22);
  --suisou-warning: oklch(82.00% 0.1592 90);
  --suisou-success: oklch(76.00% 0.1785 155);
  --suisou-error-active: oklch(70.00% 0.1816 22);
  --suisou-error-surface: oklch(33.00% 0.0531 22);
  --suisou-warning-surface: oklch(33.00% 0.0483 90);
  --suisou-success-surface: oklch(33.00% 0.0500 155);
}
[data-suisou-theme="trench"] {
  --suisou-bg: oklch(15.00% 0.0440 262);
  --suisou-panel: oklch(22.00% 0.0440 262);
  --suisou-item: oklch(28.00% 0.0440 262);
  --suisou-overlay: oklch(34.00% 0.0440 262);
  --suisou-hover-surface: oklch(19.00% 0.0440 262);
  --suisou-selected-neutral-surface: oklch(33.00% 0.0440 262);
  --suisou-line-weak: oklch(31.33% 0.0440 262);
  --suisou-line-weak-panel: oklch(34.69% 0.0440 262);
  --suisou-line-weak-item: oklch(38.89% 0.0440 262);
  --suisou-line-weak-overlay: oklch(43.98% 0.0440 262);
  --suisou-line-weak-hover: oklch(33.02% 0.0440 262);
  --suisou-line-weak-selected: oklch(43.63% 0.0440 262);
  --suisou-line-strong: oklch(48.73% 0.0440 262);
  --suisou-line-strong-panel: oklch(51.70% 0.0440 262);
  --suisou-line-strong-item: oklch(55.75% 0.0440 262);
  --suisou-line-strong-overlay: oklch(61.01% 0.0440 262);
  --suisou-line-strong-hover: oklch(50.19% 0.0440 262);
  --suisou-line-strong-selected: oklch(60.63% 0.0440 262);
  --suisou-text-disabled: oklch(62.00% 0.0440 262);
  --suisou-text-sub: oklch(78.00% 0.0440 262);
  --suisou-text-main: oklch(90.50% 0.0440 262);
  --suisou-scrim: oklch(8.00% 0.0440 262 / 0.72);
  --suisou-error: oklch(73.00% 0.1580 22);
  --suisou-warning: oklch(82.00% 0.1592 90);
  --suisou-success: oklch(76.00% 0.1785 155);
  --suisou-error-active: oklch(70.00% 0.1816 22);
  --suisou-error-surface: oklch(33.00% 0.0164 22);
  --suisou-warning-surface: oklch(33.00% 0.0102 90);
  --suisou-success-surface: oklch(33.00% 0.0211 155);
}
[data-suisou-theme="fjord"] {
  --suisou-bg: oklch(15.00% 0.0440 278);
  --suisou-panel: oklch(22.00% 0.0440 278);
  --suisou-item: oklch(28.00% 0.0440 278);
  --suisou-overlay: oklch(34.00% 0.0440 278);
  --suisou-hover-surface: oklch(19.00% 0.0440 278);
  --suisou-selected-neutral-surface: oklch(33.00% 0.0440 278);
  --suisou-line-weak: oklch(31.43% 0.0440 278);
  --suisou-line-weak-panel: oklch(34.75% 0.0440 278);
  --suisou-line-weak-item: oklch(38.92% 0.0440 278);
  --suisou-line-weak-overlay: oklch(44.00% 0.0440 278);
  --suisou-line-weak-hover: oklch(33.10% 0.0440 278);
  --suisou-line-weak-selected: oklch(43.74% 0.0440 278);
  --suisou-line-strong: oklch(48.84% 0.0440 278);
  --suisou-line-strong-panel: oklch(51.77% 0.0440 278);
  --suisou-line-strong-item: oklch(55.78% 0.0440 278);
  --suisou-line-strong-overlay: oklch(61.01% 0.0440 278);
  --suisou-line-strong-hover: oklch(50.28% 0.0440 278);
  --suisou-line-strong-selected: oklch(60.74% 0.0440 278);
  --suisou-text-disabled: oklch(62.00% 0.0440 278);
  --suisou-text-sub: oklch(78.00% 0.0440 278);
  --suisou-text-main: oklch(90.50% 0.0440 278);
  --suisou-scrim: oklch(8.00% 0.0440 278 / 0.72);
  --suisou-error: oklch(73.00% 0.1580 22);
  --suisou-warning: oklch(82.00% 0.1592 90);
  --suisou-success: oklch(76.00% 0.1785 155);
  --suisou-error-active: oklch(70.00% 0.1816 22);
  --suisou-error-surface: oklch(33.00% 0.0226 22);
  --suisou-warning-surface: oklch(33.00% 0.0102 90);
  --suisou-success-surface: oklch(33.00% 0.0156 155);
}
[data-suisou-theme="shoal"] {
  --suisou-bg: oklch(26.00% 0.0200 265);
  --suisou-panel: oklch(33.00% 0.0200 265);
  --suisou-item: oklch(39.00% 0.0200 265);
  --suisou-overlay: oklch(45.00% 0.0200 265);
  --suisou-hover-surface: oklch(30.00% 0.0200 265);
  --suisou-selected-neutral-surface: oklch(44.00% 0.0200 265);
  --suisou-line-weak: oklch(37.38% 0.0200 265);
  --suisou-line-weak-panel: oklch(43.09% 0.0200 265);
  --suisou-line-weak-item: oklch(48.69% 0.0200 265);
  --suisou-line-weak-overlay: oklch(54.68% 0.0200 265);
  --suisou-line-weak-hover: oklch(40.52% 0.0200 265);
  --suisou-line-weak-selected: oklch(54.36% 0.0200 265);
  --suisou-line-strong: oklch(54.28% 0.0200 265);
  --suisou-line-strong-panel: oklch(60.08% 0.0200 265);
  --suisou-line-strong-item: oklch(66.15% 0.0200 265);
  --suisou-line-strong-overlay: oklch(72.95% 0.0200 265);
  --suisou-line-strong-hover: oklch(57.40% 0.0200 265);
  --suisou-line-strong-selected: oklch(72.58% 0.0200 265);
  --suisou-text-disabled: oklch(74.00% 0.0200 265);
  --suisou-text-sub: oklch(90.00% 0.0200 265);
  --suisou-text-main: oklch(95.50% 0.0200 265);
  --suisou-scrim: oklch(8.00% 0.0200 265 / 0.72);
  --suisou-error: oklch(85.00% 0.0612 22);
  --suisou-warning: oklch(85.00% 0.1303 90);
  --suisou-success: oklch(83.00% 0.1539 155);
  --suisou-error-active: oklch(82.00% 0.0757 22);
  --suisou-error-surface: oklch(44.00% 0.0420 22);
  --suisou-warning-surface: oklch(44.00% 0.0341 90);
  --suisou-success-surface: oklch(44.00% 0.0439 155);
}
[data-suisou-theme="hadal"][data-suisou-accent="clown"] {
  --suisou-accent: oklch(74.00% 0.1549 55);
  --suisou-accent-active: oklch(71.00% 0.1495 55);
  --suisou-focus-ring: oklch(74.00% 0.1549 55);
  --suisou-selected-surface: oklch(33.00% 0.0501 55);
}
[data-suisou-theme="hadal"][data-suisou-accent="turtle"] {
  --suisou-accent: oklch(74.00% 0.1526 122);
  --suisou-accent-active: oklch(71.00% 0.1464 122);
  --suisou-focus-ring: oklch(74.00% 0.1526 122);
  --suisou-selected-surface: oklch(33.00% 0.0483 122);
}
[data-suisou-theme="hadal"][data-suisou-accent="teal"] {
  --suisou-accent: oklch(74.00% 0.1094 188);
  --suisou-accent-active: oklch(71.00% 0.1050 188);
  --suisou-focus-ring: oklch(74.00% 0.1094 188);
  --suisou-selected-surface: oklch(33.00% 0.0529 188);
}
[data-suisou-theme="hadal"][data-suisou-accent="jelly"] {
  --suisou-accent: oklch(74.00% 0.1096 212);
  --suisou-accent-active: oklch(71.00% 0.1052 212);
  --suisou-focus-ring: oklch(74.00% 0.1096 212);
  --suisou-selected-surface: oklch(33.00% 0.0554 212);
}
[data-suisou-theme="hadal"][data-suisou-accent="blue"] {
  --suisou-accent: oklch(74.00% 0.1159 255);
  --suisou-accent-active: oklch(71.00% 0.1308 255);
  --suisou-focus-ring: oklch(74.00% 0.1159 255);
  --suisou-selected-surface: oklch(33.00% 0.0591 255);
}
[data-suisou-theme="hadal"][data-suisou-accent="indigo"] {
  --suisou-accent: oklch(74.00% 0.1171 282);
  --suisou-accent-active: oklch(71.00% 0.1322 282);
  --suisou-focus-ring: oklch(74.00% 0.1171 282);
  --suisou-selected-surface: oklch(33.00% 0.0601 282);
}
[data-suisou-theme="hadal"][data-suisou-accent="coral"] {
  --suisou-accent: oklch(74.00% 0.1495 308);
  --suisou-accent-active: oklch(71.00% 0.1689 308);
  --suisou-focus-ring: oklch(74.00% 0.1495 308);
  --suisou-selected-surface: oklch(33.00% 0.0596 308);
}
[data-suisou-theme="hadal"][data-suisou-accent="magenta"] {
  --suisou-accent: oklch(74.00% 0.2122 332);
  --suisou-accent-active: oklch(71.00% 0.2451 332);
  --suisou-focus-ring: oklch(74.00% 0.2122 332);
  --suisou-selected-surface: oklch(33.00% 0.0581 332);
}
[data-suisou-theme="hadal"][data-suisou-accent="seal"] {
  --suisou-accent: oklch(74.00% 0.1535 355);
  --suisou-accent-active: oklch(71.00% 0.1775 355);
  --suisou-focus-ring: oklch(74.00% 0.1535 355);
  --suisou-selected-surface: oklch(33.00% 0.0559 355);
}
[data-suisou-theme="trench"][data-suisou-accent="clown"] {
  --suisou-accent: oklch(74.00% 0.1549 55);
  --suisou-accent-active: oklch(71.00% 0.1495 55);
  --suisou-focus-ring: oklch(74.00% 0.1549 55);
  --suisou-selected-surface: oklch(33.00% 0.0111 55);
}
[data-suisou-theme="trench"][data-suisou-accent="turtle"] {
  --suisou-accent: oklch(74.00% 0.1526 122);
  --suisou-accent-active: oklch(71.00% 0.1464 122);
  --suisou-focus-ring: oklch(74.00% 0.1526 122);
  --suisou-selected-surface: oklch(33.00% 0.0124 122);
}
[data-suisou-theme="trench"][data-suisou-accent="teal"] {
  --suisou-accent: oklch(74.00% 0.1094 188);
  --suisou-accent-active: oklch(71.00% 0.1050 188);
  --suisou-focus-ring: oklch(74.00% 0.1094 188);
  --suisou-selected-surface: oklch(33.00% 0.0458 188);
}
[data-suisou-theme="trench"][data-suisou-accent="jelly"] {
  --suisou-accent: oklch(74.00% 0.1096 212);
  --suisou-accent-active: oklch(71.00% 0.1052 212);
  --suisou-focus-ring: oklch(74.00% 0.1096 212);
  --suisou-selected-surface: oklch(33.00% 0.0577 212);
}
[data-suisou-theme="trench"][data-suisou-accent="blue"] {
  --suisou-accent: oklch(74.00% 0.1159 255);
  --suisou-accent-active: oklch(71.00% 0.1308 255);
  --suisou-focus-ring: oklch(74.00% 0.1159 255);
  --suisou-selected-surface: oklch(33.00% 0.0975 255);
}
[data-suisou-theme="trench"][data-suisou-accent="indigo"] {
  --suisou-accent: oklch(74.00% 0.1171 282);
  --suisou-accent-active: oklch(71.00% 0.1322 282);
  --suisou-focus-ring: oklch(74.00% 0.1171 282);
  --suisou-selected-surface: oklch(33.00% 0.0933 282);
}
[data-suisou-theme="trench"][data-suisou-accent="coral"] {
  --suisou-accent: oklch(74.00% 0.1495 308);
  --suisou-accent-active: oklch(71.00% 0.1689 308);
  --suisou-focus-ring: oklch(74.00% 0.1495 308);
  --suisou-selected-surface: oklch(33.00% 0.0744 308);
}
[data-suisou-theme="trench"][data-suisou-accent="magenta"] {
  --suisou-accent: oklch(74.00% 0.2122 332);
  --suisou-accent-active: oklch(71.00% 0.2451 332);
  --suisou-focus-ring: oklch(74.00% 0.2122 332);
  --suisou-selected-surface: oklch(33.00% 0.0499 332);
}
[data-suisou-theme="trench"][data-suisou-accent="seal"] {
  --suisou-accent: oklch(74.00% 0.1535 355);
  --suisou-accent-active: oklch(71.00% 0.1775 355);
  --suisou-focus-ring: oklch(74.00% 0.1535 355);
  --suisou-selected-surface: oklch(33.00% 0.0292 355);
}
[data-suisou-theme="fjord"][data-suisou-accent="clown"] {
  --suisou-accent: oklch(74.00% 0.1549 55);
  --suisou-accent-active: oklch(71.00% 0.1495 55);
  --suisou-focus-ring: oklch(74.00% 0.1549 55);
  --suisou-selected-surface: oklch(33.00% 0.0128 55);
}
[data-suisou-theme="fjord"][data-suisou-accent="turtle"] {
  --suisou-accent: oklch(74.00% 0.1526 122);
  --suisou-accent-active: oklch(71.00% 0.1464 122);
  --suisou-focus-ring: oklch(74.00% 0.1526 122);
  --suisou-selected-surface: oklch(33.00% 0.0108 122);
}
[data-suisou-theme="fjord"][data-suisou-accent="teal"] {
  --suisou-accent: oklch(74.00% 0.1094 188);
  --suisou-accent-active: oklch(71.00% 0.1050 188);
  --suisou-focus-ring: oklch(74.00% 0.1094 188);
  --suisou-selected-surface: oklch(33.00% 0.0314 188);
}
[data-suisou-theme="fjord"][data-suisou-accent="jelly"] {
  --suisou-accent: oklch(74.00% 0.1096 212);
  --suisou-accent-active: oklch(71.00% 0.1052 212);
  --suisou-focus-ring: oklch(74.00% 0.1096 212);
  --suisou-selected-surface: oklch(33.00% 0.0541 212);
}
[data-suisou-theme="fjord"][data-suisou-accent="blue"] {
  --suisou-accent: oklch(74.00% 0.1159 255);
  --suisou-accent-active: oklch(71.00% 0.1308 255);
  --suisou-focus-ring: oklch(74.00% 0.1159 255);
  --suisou-selected-surface: oklch(33.00% 0.0918 255);
}
[data-suisou-theme="fjord"][data-suisou-accent="indigo"] {
  --suisou-accent: oklch(74.00% 0.1171 282);
  --suisou-accent-active: oklch(71.00% 0.1322 282);
  --suisou-focus-ring: oklch(74.00% 0.1171 282);
  --suisou-selected-surface: oklch(33.00% 0.0979 282);
}
[data-suisou-theme="fjord"][data-suisou-accent="coral"] {
  --suisou-accent: oklch(74.00% 0.1495 308);
  --suisou-accent-active: oklch(71.00% 0.1689 308);
  --suisou-focus-ring: oklch(74.00% 0.1495 308);
  --suisou-selected-surface: oklch(33.00% 0.0875 308);
}
[data-suisou-theme="fjord"][data-suisou-accent="magenta"] {
  --suisou-accent: oklch(74.00% 0.2122 332);
  --suisou-accent-active: oklch(71.00% 0.2451 332);
  --suisou-focus-ring: oklch(74.00% 0.2122 332);
  --suisou-selected-surface: oklch(33.00% 0.0666 332);
}
[data-suisou-theme="fjord"][data-suisou-accent="seal"] {
  --suisou-accent: oklch(74.00% 0.1535 355);
  --suisou-accent-active: oklch(71.00% 0.1775 355);
  --suisou-focus-ring: oklch(74.00% 0.1535 355);
  --suisou-selected-surface: oklch(33.00% 0.0429 355);
}
[data-suisou-theme="shoal"][data-suisou-accent="clown"] {
  --suisou-accent: oklch(80.00% 0.0797 55);
  --suisou-accent-active: oklch(77.00% 0.0941 55);
  --suisou-focus-ring: oklch(80.00% 0.0797 55);
  --suisou-selected-surface: oklch(44.00% 0.0358 55);
}
[data-suisou-theme="shoal"][data-suisou-accent="turtle"] {
  --suisou-accent: oklch(80.00% 0.1165 122);
  --suisou-accent-active: oklch(77.00% 0.1121 122);
  --suisou-focus-ring: oklch(80.00% 0.1165 122);
  --suisou-selected-surface: oklch(44.00% 0.0368 122);
}
[data-suisou-theme="shoal"][data-suisou-accent="teal"] {
  --suisou-accent: oklch(80.00% 0.0835 188);
  --suisou-accent-active: oklch(77.00% 0.0804 188);
  --suisou-focus-ring: oklch(80.00% 0.0835 188);
  --suisou-selected-surface: oklch(44.00% 0.0549 188);
}
[data-suisou-theme="shoal"][data-suisou-accent="jelly"] {
  --suisou-accent: oklch(80.00% 0.0837 212);
  --suisou-accent-active: oklch(77.00% 0.0805 212);
  --suisou-focus-ring: oklch(80.00% 0.0837 212);
  --suisou-selected-surface: oklch(44.00% 0.0637 212);
}
[data-suisou-theme="shoal"][data-suisou-accent="blue"] {
  --suisou-accent: oklch(80.00% 0.0615 255);
  --suisou-accent-active: oklch(77.00% 0.0716 255);
  --suisou-focus-ring: oklch(80.00% 0.0615 255);
  --suisou-selected-surface: oklch(44.00% 0.0737 255);
}
[data-suisou-theme="shoal"][data-suisou-accent="indigo"] {
  --suisou-accent: oklch(80.00% 0.0621 282);
  --suisou-accent-active: oklch(77.00% 0.0723 282);
  --suisou-focus-ring: oklch(80.00% 0.0621 282);
  --suisou-selected-surface: oklch(44.00% 0.0729 282);
}
[data-suisou-theme="shoal"][data-suisou-accent="coral"] {
  --suisou-accent: oklch(80.00% 0.0791 308);
  --suisou-accent-active: oklch(77.00% 0.0922 308);
  --suisou-focus-ring: oklch(80.00% 0.0791 308);
  --suisou-selected-surface: oklch(44.00% 0.0670 308);
}
[data-suisou-theme="shoal"][data-suisou-accent="magenta"] {
  --suisou-accent: oklch(80.00% 0.1079 332);
  --suisou-accent-active: oklch(77.00% 0.1281 332);
  --suisou-focus-ring: oklch(80.00% 0.1079 332);
  --suisou-selected-surface: oklch(44.00% 0.0587 332);
}
[data-suisou-theme="shoal"][data-suisou-accent="seal"] {
  --suisou-accent: oklch(80.00% 0.0779 355);
  --suisou-accent-active: oklch(77.00% 0.0926 355);
  --suisou-focus-ring: oklch(80.00% 0.0779 355);
  --suisou-selected-surface: oklch(44.00% 0.0502 355);
}
