/*!
 * Design language — portable extract of the Grimoire visual system.
 * Themes: amdapor (light), mhach (dark), nym (salmon paper).
 * Set data-theme on an ancestor. Wrap the page in .grimoire-root.
 */

/* Design language tokens. Generated by scripts/extract.mjs. Do not edit by hand. */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;1,300;1,400;1,500&family=EB+Garamond:ital,wght@0,400;0,500;1,400;1,500&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root {
  --grimoire-font-myth: 'Cormorant Garamond', 'EB Garamond', Georgia, serif;
  --grimoire-font-instrument: 'EB Garamond', Georgia, serif;
  --grimoire-font-mono: 'IBM Plex Mono', 'Courier New', Courier, monospace;
  --grimoire-radius-sharp: 0px;
  --grimoire-radius-min: 2px;
  --grimoire-radius-soft: 4px;
  --grimoire-radius-round: 12px;
  --grimoire-radius-pill: 9999px;
  --grimoire-motion-snap: 80ms;
  --grimoire-motion-base: 120ms;
  --grimoire-motion-cmplx: 220ms;
  --grimoire-motion-reveal: 400ms;
  --grimoire-motion-ceremony-base: 800ms;
  --grimoire-type-invocation-size: clamp(20px, 2.2vw, 22px);
  --grimoire-type-invocation-line-height: 1.4;
  --grimoire-type-invocation-weight: 400;
  --grimoire-type-manifestation-size: clamp(20px, 4.5vw, 28px);
  --grimoire-type-manifestation-line-height: 1.2;
  --grimoire-type-manifestation-weight: 300;
  --grimoire-type-inscription-size: 16px;
  --grimoire-type-inscription-line-height: 1.6;
  --grimoire-type-inscription-weight: 400;
  --grimoire-type-caption-size: 14px;
  --grimoire-type-caption-line-height: 1.55;
  --grimoire-type-caption-weight: 400;
  --grimoire-type-caption-style: italic;
  --grimoire-type-marginalia-size: 12px;
  --grimoire-type-marginalia-line-height: 1.5;
  --grimoire-type-marginalia-weight: 500;
  --grimoire-type-heading-size: 18px;
  --grimoire-type-heading-line-height: 1.3;
  --grimoire-type-heading-weight: 500;
  --grimoire-type-read-size: 17px;
  --grimoire-type-read-line-height: 1.85;
  --grimoire-type-read-weight: 400;
  --grimoire-type-epigraph-size: clamp(34px, 6vw, 64px);
  --grimoire-type-epigraph-line-height: 1.1;
  --grimoire-type-epigraph-weight: 300;
  --grimoire-space-touch: 44px;
  --grimoire-space-chord: clamp(8px, calc(8px + (100vw - 360px) * 0.0143), 12px);
  --grimoire-space-breath: clamp(12px, calc(12px + (100vw - 360px) * 0.0143), 16px);
  --grimoire-space-field: clamp(16px, calc(16px + (100vw - 360px) * 0.0286), 24px);
  --grimoire-space-vessel: clamp(24px, calc(24px + (100vw - 360px) * 0.0286), 32px);
  --grimoire-space-ground: clamp(48px, calc(48px + (100vw - 360px) * 0.0857), 72px);
  --grimoire-viewport-page: 640px;
  --grimoire-viewport-theatre: 1024px;
  --grimoire-viewport-hall: 1440px;
  --grimoire-measure-stage: 75rem;
  --grimoire-measure-shellPage: 44rem;
  --grimoire-measure-reading: 65ch;
  --grimoire-measure-altar: 28rem;
  --grimoire-measure-knowledge: 42rem;
  --grimoire-measure-drawer: 28rem;
  --grimoire-measure-cabinet: 18rem;
  --grimoire-measure-panel: 480px;
  --grimoire-measure-sealPanel: 420px;
  --grimoire-measure-book: 60rem;
}

:root,
[data-theme='amdapor'] {
  color-scheme: light;
  --grimoire-surface-base: #DCD8D0;
  --grimoire-surface-secondary: #ECEAE4;
  --grimoire-surface-ghost: #E3E0D9;
  --grimoire-surface-recessed: #CFCABF;
  --grimoire-ink-base: #262117;
  --grimoire-ink-secondary: #585041;
  --grimoire-ink-ghost: #877E6E;
  --grimoire-charge: #72B68E;
  --grimoire-charge-text: #266440;
  --grimoire-charge-dim: #A8C7B5;
  --grimoire-charge-on: #262117;
  --grimoire-seal: #C6AA39;
  --grimoire-seal-text: #6E5B1C;
  --grimoire-seal-dim: #D3C89C;
  --grimoire-seal-on: #262117;
  --grimoire-breach: #A39475;
  --grimoire-breach-text: #585041;
  --grimoire-breach-dim: #C4BBA9;
  --grimoire-breach-on: #DCD8D0;
  --grimoire-boundary-ghost: #D3CEC5;
  --grimoire-boundary-base: #BCB29F;
  --grimoire-boundary-strong: #A39475;
  --grimoire-accent: #72B68E;
  --grimoire-accent-soft: #A8C7B5;
  --grimoire-motion-recognition: 112ms linear;
  --grimoire-motion-response: 168ms ease-out;
  --grimoire-motion-arrival: 308ms ease-out;
  --grimoire-motion-manifestation: 560ms cubic-bezier(0.25,1,0.5,1);
  --grimoire-motion-ceremony: 1120ms ease-in-out;
  --grimoire-surface-dim: color-mix(in oklab, #DCD8D0 92%, #262117);
  --grimoire-radius-default: 0px;
  --grimoire-radius-card: 0px;
  --grimoire-radius-panel: 0px;
}

[data-theme='mhach'] {
  color-scheme: dark;
  --grimoire-surface-base: #1B2427;
  --grimoire-surface-secondary: #242F32;
  --grimoire-surface-ghost: #202A2D;
  --grimoire-surface-recessed: #12191C;
  --grimoire-ink-base: #E0DFD7;
  --grimoire-ink-secondary: #ABA99C;
  --grimoire-ink-ghost: #777669;
  --grimoire-charge: #72AC99;
  --grimoire-charge-text: #9CC9BA;
  --grimoire-charge-dim: #536E65;
  --grimoire-charge-on: #12191C;
  --grimoire-seal: #8143AD;
  --grimoire-seal-text: #C7A3E0;
  --grimoire-seal-dim: #5F4672;
  --grimoire-seal-on: #E0DFD7;
  --grimoire-breach: #A83841;
  --grimoire-breach-text: #E17079;
  --grimoire-breach-dim: #6E3A40;
  --grimoire-breach-on: #E0DFD7;
  --grimoire-boundary-ghost: #273135;
  --grimoire-boundary-base: #344246;
  --grimoire-boundary-strong: #4A5D64;
  --grimoire-accent: #629383;
  --grimoire-accent-soft: #465D55;
  --grimoire-motion-recognition: 40ms linear;
  --grimoire-motion-response: 60ms ease-out;
  --grimoire-motion-arrival: 110ms ease-out;
  --grimoire-motion-manifestation: 200ms cubic-bezier(0.25,1,0.5,1);
  --grimoire-motion-ceremony: 400ms ease-in-out;
  --grimoire-surface-dim: color-mix(in oklab, #1B2427 92%, #E0DFD7);
  --grimoire-radius-default: 0px;
  --grimoire-radius-card: 0px;
  --grimoire-radius-panel: 0px;
}

[data-theme='nym'] {
  color-scheme: light;
  --grimoire-surface-base: #F9ECE1;
  --grimoire-surface-secondary: #FDF5EC;
  --grimoire-surface-ghost: #FBEFE4;
  --grimoire-surface-recessed: #EBDBCB;
  --grimoire-ink-base: #312821;
  --grimoire-ink-secondary: #63564B;
  --grimoire-ink-ghost: #8F7E70;
  --grimoire-charge: #DD9C2C;
  --grimoire-charge-text: #8E5310;
  --grimoire-charge-dim: #DFC290;
  --grimoire-charge-on: #312821;
  --grimoire-seal: #2D7676;
  --grimoire-seal-text: #1A585B;
  --grimoire-seal-dim: #89BDBD;
  --grimoire-seal-on: #F9ECE1;
  --grimoire-breach: #587240;
  --grimoire-breach-text: #415A2B;
  --grimoire-breach-dim: #A9B58F;
  --grimoire-breach-on: #F9ECE1;
  --grimoire-boundary-ghost: #E2D6CA;
  --grimoire-boundary-base: #DBC7B3;
  --grimoire-boundary-strong: #BD9E7F;
  --grimoire-accent: #DD9C2C;
  --grimoire-accent-soft: #DFC290;
  --grimoire-motion-recognition: 80ms linear;
  --grimoire-motion-response: 120ms ease-out;
  --grimoire-motion-arrival: 220ms ease-out;
  --grimoire-motion-manifestation: 400ms cubic-bezier(0.34,1.56,0.64,1);
  --grimoire-motion-ceremony: 800ms ease-in-out;
  --grimoire-surface-dim: color-mix(in oklab, #F9ECE1 92%, #312821);
  --grimoire-radius-default: 4px;
  --grimoire-radius-card: 4px;
  --grimoire-radius-panel: 4px;
}

/* Scrollbar recipes. Ghost is the one a product surface uses.
   Veil and facet are alternate specimens of the same token set. */

.grimoire-scroll-host {
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.grimoire-scroll-host[data-scrollbar='ghost'] {
  scrollbar-width: thin;
  scrollbar-color: var(--grimoire-boundary-ghost) transparent;
}

.grimoire-scroll-host[data-scrollbar='ghost']::-webkit-scrollbar {
  width: 4px;
}

.grimoire-scroll-host[data-scrollbar='ghost']::-webkit-scrollbar-track {
  background: transparent;
}

.grimoire-scroll-host[data-scrollbar='ghost']::-webkit-scrollbar-thumb {
  background: var(--grimoire-boundary-ghost);
  border-radius: var(--grimoire-radius-default);
}

.grimoire-scroll-host[data-scrollbar='ghost']::-webkit-scrollbar-thumb:hover,
.grimoire-scroll-host[data-scrollbar='ghost']::-webkit-scrollbar-thumb:active {
  background: var(--grimoire-ink-ghost);
}

.grimoire-scroll-host[data-scrollbar='veil'] {
  scrollbar-width: thin;
  scrollbar-color: color-mix(in srgb, var(--grimoire-ink-ghost) 35%, transparent) transparent;
}

.grimoire-scroll-host[data-scrollbar='veil']::-webkit-scrollbar {
  width: 2px;
}

.grimoire-scroll-host[data-scrollbar='veil']::-webkit-scrollbar-track {
  background: transparent;
}

.grimoire-scroll-host[data-scrollbar='veil']::-webkit-scrollbar-thumb {
  background: var(--grimoire-ink-ghost);
  border-radius: var(--grimoire-radius-default);
  opacity: 0.35;
}

.grimoire-scroll-host[data-scrollbar='veil']::-webkit-scrollbar-thumb:hover,
.grimoire-scroll-host[data-scrollbar='veil']::-webkit-scrollbar-thumb:active {
  opacity: 1;
}

.grimoire-scroll-host[data-scrollbar='facet'] {
  scrollbar-width: thin;
  scrollbar-color: var(--grimoire-ink-ghost) transparent;
  box-shadow: inset -1px 0 0 var(--grimoire-boundary-ghost);
}

.grimoire-scroll-host[data-scrollbar='facet']::-webkit-scrollbar {
  width: 3px;
}

.grimoire-scroll-host[data-scrollbar='facet']::-webkit-scrollbar-track {
  background: transparent;
}

.grimoire-scroll-host[data-scrollbar='facet']::-webkit-scrollbar-thumb {
  background: var(--grimoire-ink-ghost);
  border-radius: var(--grimoire-radius-default);
  border: 1px solid var(--grimoire-surface-base);
  background-clip: padding-box;
}

.grimoire-scroll-host[data-scrollbar='facet']::-webkit-scrollbar-thumb:hover,
.grimoire-scroll-host[data-scrollbar='facet']::-webkit-scrollbar-thumb:active {
  background: var(--grimoire-ink-secondary);
  border: 1px solid var(--grimoire-surface-base);
  background-clip: padding-box;
}

/* design-system/substrate/styles/_animations.scss */
/* Appendix B keyframes */
@keyframes grimoire-inkDot {
  0%,
  80%,
  100% {
    opacity: 0.15;
    transform: scale(0.7);
  }
  40% {
    opacity: 1;
    transform: scale(1.2);
  }
}

@keyframes grimoire-sealGlyph {
  from {
    opacity: 0;
    transform: scale(0.3) rotate(-20deg);
  }
  to {
    opacity: 1;
    transform: scale(1) rotate(0deg);
  }
}

@keyframes grimoire-ruleExtend {
  from {
    transform: scaleX(0);
    transform-origin: inline-start;
  }
  to {
    transform: scaleX(1);
    transform-origin: inline-start;
  }
}

/* design-system/substrate/styles/_contexts.scss */
.grimoire-panel-chrome__title {
  font-family: var(--grimoire-font-myth);
  font-size: var(--grimoire-type-manifestation-size);
  font-weight: var(--grimoire-type-manifestation-weight);
  line-height: var(--grimoire-type-manifestation-line-height);
  color: var(--grimoire-ink-base);
  margin: 0 0 8px;
}

.grimoire-panel-chrome__body {
  font-family: var(--grimoire-font-instrument);
  font-size: var(--grimoire-type-inscription-size);
  line-height: var(--grimoire-type-inscription-line-height);
  color: var(--grimoire-ink-secondary);
  margin: 0 0 8px;
}

.grimoire-panel-chrome__meta {
  font-family: var(--grimoire-font-myth);
  font-size: var(--grimoire-type-caption-size);
  font-style: italic;
  line-height: var(--grimoire-type-caption-line-height);
  color: var(--grimoire-ink-ghost);
  margin: 0;
}

.grimoire-quotation {
  border-inline-start: 2px solid var(--grimoire-boundary-strong);
  padding-inline-start: var(--grimoire-space-vessel);
  margin: 0;
}

.grimoire-quotation__text {
  font-family: var(--grimoire-font-instrument);
  font-size: var(--grimoire-type-inscription-size);
  font-style: italic;
  line-height: var(--grimoire-type-inscription-line-height);
  color: var(--grimoire-ink-secondary);
  margin: 0;
}

/* Reading mode (§13) */
.grimoire-reading-body {
  font-family: var(--grimoire-font-instrument);
  font-size: var(--grimoire-type-read-size);
  font-weight: var(--grimoire-type-read-weight);
  line-height: var(--grimoire-type-read-line-height);
  max-width: 65ch;
  color: var(--grimoire-ink-base);
  font-feature-settings: 'liga' 1, 'onum' 1, 'kern' 1, 'calt' 1;
  font-variant-numeric: oldstyle-nums proportional-nums;
  font-variant-ligatures: common-ligatures contextual;
  font-optical-sizing: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: justify;
  hyphens: auto;
  -webkit-hyphens: auto;
  text-wrap: pretty;
}

.grimoire-reading-body p {
  margin: 0 0 1em;
}

.grimoire-reading-body p:last-child {
  margin-block-end: 0;
}

/* Markdown elements inside the §13 column (`ReadingMarkdown`) */
.grimoire-reading-body__heading {
  margin: 0 0 0.65em;
  font-family: var(--grimoire-font-myth);
  font-weight: 300;
  line-height: 1.25;
  color: var(--grimoire-ink-base);
  text-align: start;
  text-wrap: balance;
  text-rendering: optimizeLegibility;
  hyphens: none;
}

.grimoire-reading-body h1.grimoire-reading-body__heading {
  font-size: 22px; /* restrained reading title — not manifestation clamp */
}

.grimoire-reading-body h2.grimoire-reading-body__heading {
  font-size: 20px;
}

.grimoire-reading-body h3.grimoire-reading-body__heading {
  font-size: var(--grimoire-type-inscription-size);
  font-weight: 400;
}

.grimoire-reading-body h4.grimoire-reading-body__heading,
.grimoire-reading-body h5.grimoire-reading-body__heading,
.grimoire-reading-body h6.grimoire-reading-body__heading {
  font-size: var(--grimoire-type-caption-size);
  font-weight: 400;
}

.grimoire-reading-body__list {
  margin: 0 0 1em;
  padding-inline-start: 1.25em;
  text-align: start;
}

.grimoire-reading-body__list li {
  margin-block-end: 0.35em;
}

.grimoire-reading-body__list li:last-child {
  margin-block-end: 0;
}

.grimoire-reading-body__quote {
  margin: 0 0 1em;
  padding-inline-start: var(--grimoire-space-field);
  border-inline-start: 2px solid var(--grimoire-boundary-ghost);
  color: var(--grimoire-ink-secondary);
  font-style: italic;
  text-align: start;
}

.grimoire-reading-body__table-wrap {
  margin: 0 0 1em;
  overflow-x: auto;
  max-width: 100%;
}

.grimoire-reading-body__table {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--grimoire-type-caption-size);
  text-align: start;
  hyphens: none;
}

.grimoire-reading-body__table th,
.grimoire-reading-body__table td {
  padding: 0.4em 0.65em;
  border-block-end: 0.5px solid var(--grimoire-boundary-ghost);
  vertical-align: top;
}

.grimoire-reading-body__table th {
  font-family: var(--grimoire-font-myth);
  font-weight: 500;
  color: var(--grimoire-ink-secondary);
}

.grimoire-reading-body__link {
  color: var(--grimoire-ink-secondary);
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.grimoire-reading-body__image {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0 0 1em;
}

.grimoire-reading-body__figure[data-kind='parked'] {
  margin: 0 0 1em;
  padding: var(--grimoire-space-breath) var(--grimoire-space-field);
  border: 0.5px solid var(--grimoire-boundary-ghost);
  color: var(--grimoire-ink-secondary);
  text-align: start;
}

.grimoire-reading-body__figure[data-kind='parked'] p {
  margin: 0;
}

.grimoire-reading-body__figure[data-kind='parked'] figcaption {
  margin-block-start: 0.35em;
  font-size: var(--grimoire-type-caption-size);
  color: var(--grimoire-ink-ghost);
}

.grimoire-reading-body__mark {
  background: var(--grimoire-surface-secondary);
  color: inherit;
  padding: 0 0.15em;
}

.grimoire-reading-body__pre {
  margin: 0 0 1em;
  padding: var(--grimoire-space-breath) var(--grimoire-space-field);
  overflow-x: auto;
  font-family: 'IBM Plex Mono', 'Courier New', Courier, monospace;
  font-size: var(--grimoire-type-caption-size);
  line-height: 1.5;
  color: var(--grimoire-ink-base);
  background: var(--grimoire-surface-secondary);
  border: 0.5px solid var(--grimoire-boundary-ghost);
  border-radius: var(--grimoire-radius-default);
  text-align: start;
  hyphens: none;
}

.grimoire-reading-body__pre .grimoire-inline-code,
.grimoire-reading-body__pre code {
  background: transparent;
  border: none;
  padding: 0;
  font-size: inherit;
}

.grimoire-inline-code {
  font-family: 'IBM Plex Mono', 'Courier New', Courier, monospace;
  font-size: var(--grimoire-type-caption-size);
  color: var(--grimoire-ink-base);
  background: var(--grimoire-surface-secondary);
  border: 0.5px solid var(--grimoire-boundary-ghost);
  border-radius: var(--grimoire-radius-default);
  padding: 1px 6px;
}

.grimoire-ledger-row {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.grimoire-ledger-row__date {
  font-family: var(--grimoire-font-myth);
  font-size: var(--grimoire-type-marginalia-size);
  font-style: italic;
  line-height: var(--grimoire-type-marginalia-line-height);
  color: var(--grimoire-ink-ghost);
  letter-spacing: 0.04em;
}

.grimoire-ledger-row__summary {
  font-family: var(--grimoire-font-instrument);
  font-size: var(--grimoire-type-inscription-size);
  line-height: var(--grimoire-type-inscription-line-height);
  color: var(--grimoire-ink-base);
}

.grimoire-ledger-row__intention {
  font-family: var(--grimoire-font-myth);
  font-size: var(--grimoire-type-caption-size);
  line-height: var(--grimoire-type-caption-line-height);
  font-style: italic;
  color: var(--grimoire-ink-ghost);
  margin: 0;
}

.grimoire-seal-line {
  display: flex;
  align-items: center;
  gap: var(--grimoire-space-breath);
}

.grimoire-seal-line__glyph {
  font-family: var(--grimoire-font-myth);
  font-size: var(--grimoire-type-manifestation-size);
  color: var(--grimoire-charge-text);
  line-height: 1;
}

.grimoire-seal-line__copy {
  font-family: var(--grimoire-font-instrument);
  font-size: var(--grimoire-type-inscription-size);
  line-height: var(--grimoire-type-inscription-line-height);
  color: var(--grimoire-ink-base);
}

/* Manifesto landing scroll (Recognition Arc) */
[data-grimoire-context='manifesto'] {
  background: var(--grimoire-surface-base);
  color: var(--grimoire-ink-base);
}

/* design-system/substrate/styles/_foundation.scss */
html,
body,
#root {
  margin: 0;
  min-height: 100%;
}

.grimoire-root {
  font-family: var(--grimoire-font-instrument);
  background: var(--grimoire-surface-base);
  color: var(--grimoire-ink-base);
  min-height: 100%;
  max-width: 100%;
  min-width: 0;
}

@media (prefers-reduced-motion: reduce) {
  .grimoire-root,
  .grimoire-root * {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* design-system/substrate/styles/_house.scss */
@property --grimoire-house {
  syntax: '<color>';
  inherits: true;
  initial-value: transparent;
}

.grimoire-house {
  --grimoire-house: var(--grimoire-surface-base);
  background: var(--grimoire-house);
  transition: --grimoire-house calc(var(--grimoire-motion-manifestation) * 0.8) ease-out;
}

.grimoire-house[data-house='dim'] {
  --grimoire-house: var(--grimoire-surface-dim);
  transition-duration: var(--grimoire-motion-manifestation);
  transition-timing-function: ease-in-out;
}

/* components/Rule.style.scss */
.grimoire-rule {
  height: 0.5px;
  background: var(--grimoire-boundary-base);
  margin-block: var(--grimoire-space-ground);
  border: none;
}

/* components/SectionLabel.style.scss */
.grimoire-section-label {
  font-family: var(--grimoire-font-myth);
  font-size: var(--grimoire-type-marginalia-size);
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--grimoire-ink-ghost);
  margin-block-end: var(--grimoire-space-field);
  padding-block-end: 10px;
  border-block-end: 0.5px solid var(--grimoire-boundary-base);
  display: flex;
  justify-content: space-between;
}

.grimoire-section-label__n {
  margin-inline-end: 12px;
  opacity: 0.5;
}

/* components/Law.style.scss */
.grimoire-law {
  border-inline-start: 2px solid var(--grimoire-boundary-strong);
  padding-inline-start: 16px;
  margin-block-start: 16px;
}

.grimoire-law__text {
  font-family: var(--grimoire-font-instrument);
  font-size: var(--grimoire-type-inscription-size);
  font-style: italic;
  color: var(--grimoire-ink-secondary);
  line-height: var(--grimoire-type-inscription-line-height);
  margin: 0;
}

/* components/InvocationField.style.scss */
.grimoire-invocation {
  border: none;
  border-block-end: 1px solid var(--grimoire-boundary-strong);
  border-radius: 0;
  padding: 2px 0 8px;
  background: transparent;
  max-width: 480px;
  transition:
    border-color var(--grimoire-motion-response),
    box-shadow var(--grimoire-motion-response);
}

.grimoire-invocation:hover:not(:focus-within) {
  border-block-end-color: var(--grimoire-ink-ghost);
}

.grimoire-invocation:focus-within {
  border-block-end-color: var(--grimoire-charge);
  box-shadow: 0 2px 0 0 var(--grimoire-charge-dim);
}

.grimoire-invocation:has(.grimoire-invocation__field:focus-visible) {
  border-block-end-color: var(--grimoire-charge);
}

.grimoire-invocation[data-disabled='true'] {
  opacity: 0.5;
}

.grimoire-invocation__field {
  width: 100%;
  border: none;
  outline: none;
  background: transparent;
  resize: none;
  font-family: var(--grimoire-font-instrument);
  font-size: var(--grimoire-type-invocation-size);
  font-weight: var(--grimoire-type-invocation-weight);
  line-height: var(--grimoire-type-invocation-line-height);
  color: var(--grimoire-ink-base);
  caret-color: var(--grimoire-charge);
}

.grimoire-invocation__field::placeholder {
  color: var(--grimoire-ink-ghost);
  font-style: italic;
}

.grimoire-invocation__field:focus-visible {
  outline: none;
}

.grimoire-invocation__field:disabled {
  cursor: not-allowed;
}

.grimoire-invocation__label {
  display: block;
  font-family: var(--grimoire-font-instrument);
  font-size: var(--grimoire-type-marginalia-size);
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: var(--grimoire-ink-ghost);
  margin-block-end: 8px;
}

/* Invocation variants */
.grimoire-invocation[data-variant='altar'] {
  max-width: 480px;
  margin-inline: auto;
  text-align: center;
}

.grimoire-invocation[data-variant='altar'] .grimoire-invocation__field {
  text-align: center;
}

.grimoire-invocation[data-variant='bar'] .grimoire-invocation__field {
  font-size: var(--grimoire-type-inscription-size);
  font-weight: var(--grimoire-type-inscription-weight);
  line-height: var(--grimoire-type-inscription-line-height);
}

/* components/ChargeButton.style.scss */
.grimoire-charge {
  --grimoire-charge-button-fill: transparent;
  --grimoire-charge-button-label: var(--grimoire-ink-secondary);
  --grimoire-charge-button-border: var(--grimoire-boundary-strong);
  --grimoire-charge-button-outline: var(--grimoire-charge);

  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  font-family: var(--grimoire-font-myth);
  font-size: var(--grimoire-type-caption-size);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  text-decoration: none;
  border-style: solid;
  border-width: 1px;
  border-color: var(--grimoire-charge-button-border);
  border-radius: var(--grimoire-radius-default);
  background-color: var(--grimoire-charge-button-fill);
  color: var(--grimoire-charge-button-label);
  outline-style: solid;
  outline-width: 0;
  outline-color: var(--grimoire-charge-button-outline);
  padding: 12px 28px;
  min-height: var(--grimoire-space-touch);
  cursor: pointer;
  transition:
    background-color var(--grimoire-motion-response),
    color var(--grimoire-motion-response),
    border-color var(--grimoire-motion-response);
}

.grimoire-charge[data-variant='full'] {
  --grimoire-charge-button-fill: var(--grimoire-charge);
  --grimoire-charge-button-label: var(--grimoire-charge-on);
  --grimoire-charge-button-border: var(--grimoire-charge);
}

.grimoire-charge[data-variant='spent'] {
  --grimoire-charge-button-fill: transparent;
  --grimoire-charge-button-label: var(--grimoire-ink-ghost);
  --grimoire-charge-button-border: var(--grimoire-boundary-ghost);
}

.grimoire-charge[data-variant='danger'] {
  --grimoire-charge-button-fill: transparent;
  --grimoire-charge-button-label: var(--grimoire-breach);
  --grimoire-charge-button-border: var(--grimoire-breach);
}

.grimoire-charge[data-variant='glyph'] {
  --grimoire-charge-button-fill: transparent;
  --grimoire-charge-button-label: var(--grimoire-charge-text);
  --grimoire-charge-button-border: transparent;
  border-radius: 0;
  font-size: 1.25rem;
  letter-spacing: 0;
  text-transform: none;
  padding: 0 4px;
  min-width: var(--grimoire-space-touch);
}

.grimoire-charge[data-variant='dormant']:hover:not(:disabled),
.grimoire-charge[data-variant='dormant'][data-interaction='hover']:not(:disabled) {
  --grimoire-charge-button-fill: var(--grimoire-charge-dim);
  --grimoire-charge-button-label: var(--grimoire-ink-base);
  --grimoire-charge-button-border: var(--grimoire-charge-dim);
}

.grimoire-charge[data-variant='dormant']:active:not(:disabled),
.grimoire-charge[data-variant='dormant'][data-interaction='press']:not(:disabled) {
  --grimoire-charge-button-fill: var(--grimoire-charge);
  --grimoire-charge-button-label: var(--grimoire-charge-on);
  --grimoire-charge-button-border: var(--grimoire-charge);
}

.grimoire-charge[data-variant='full']:hover:not(:disabled),
.grimoire-charge[data-variant='full'][data-interaction='hover']:not(:disabled) {
  --grimoire-charge-button-border: var(--grimoire-charge-text);
}

.grimoire-charge[data-variant='full']:active:not(:disabled),
.grimoire-charge[data-variant='full'][data-interaction='press']:not(:disabled) {
  --grimoire-charge-button-border: var(--grimoire-charge-dim);
}

.grimoire-charge[data-variant='spent']:hover:not(:disabled),
.grimoire-charge[data-variant='spent'][data-interaction='hover']:not(:disabled) {
  --grimoire-charge-button-label: var(--grimoire-ink-secondary);
  --grimoire-charge-button-border: var(--grimoire-boundary-strong);
}

.grimoire-charge[data-variant='spent']:active:not(:disabled),
.grimoire-charge[data-variant='spent'][data-interaction='press']:not(:disabled) {
  --grimoire-charge-button-label: var(--grimoire-ink-base);
  --grimoire-charge-button-border: var(--grimoire-boundary-strong);
}

.grimoire-charge[data-variant='danger']:hover:not(:disabled),
.grimoire-charge[data-variant='danger'][data-interaction='hover']:not(:disabled) {
  --grimoire-charge-button-label: var(--grimoire-charge);
  --grimoire-charge-button-border: var(--grimoire-charge);
}

.grimoire-charge[data-variant='danger']:active:not(:disabled),
.grimoire-charge[data-variant='danger'][data-interaction='press']:not(:disabled) {
  --grimoire-charge-button-label: var(--grimoire-charge-text);
  --grimoire-charge-button-border: var(--grimoire-charge-text);
}

.grimoire-charge[data-variant='glyph']:hover:not(:disabled),
.grimoire-charge[data-variant='glyph'][data-interaction='hover']:not(:disabled) {
  --grimoire-charge-button-label: var(--grimoire-charge);
}

.grimoire-charge[data-variant='glyph']:active:not(:disabled),
.grimoire-charge[data-variant='glyph'][data-interaction='press']:not(:disabled) {
  --grimoire-charge-button-label: var(--grimoire-ink-base);
}

.grimoire-charge[data-variant]:disabled,
.grimoire-charge[data-variant]:disabled:hover,
.grimoire-charge[data-variant]:disabled:active,
.grimoire-charge[data-variant][data-interaction='disabled'],
.grimoire-charge[data-variant][data-interaction='disabled']:hover,
.grimoire-charge[data-variant][data-interaction='disabled']:active {
  --grimoire-charge-button-fill: transparent;
  --grimoire-charge-button-label: var(--grimoire-ink-ghost);
  --grimoire-charge-button-border: var(--grimoire-boundary-ghost);
  cursor: not-allowed;
}

.grimoire-charge:focus-visible,
.grimoire-charge[data-interaction='focus'] {
  outline-width: 2px;
  outline-offset: 2px;
}

/* components/SealPanel.style.scss */
.grimoire-seal {
  position: relative;
}

.grimoire-seal__card {
  position: relative;
  border: 0.5px solid var(--grimoire-boundary-base);
  border-radius: var(--grimoire-radius-card);
  padding: var(--grimoire-space-vessel) var(--grimoire-space-vessel);
  background: var(--grimoire-surface-base);
  max-width: 420px;
  overflow: hidden;
  transition:
    border-color var(--grimoire-motion-response),
    opacity var(--grimoire-motion-response);
  margin-block-end: 8px;
}

.grimoire-seal__card[data-state='sealed'] {
  border-color: var(--grimoire-boundary-ghost);
}

.grimoire-seal__layers {
  position: relative;
  display: grid;
  align-items: start;
}

.grimoire-seal__resting,
.grimoire-seal__committed {
  grid-area: 1 / 1;
  transition: opacity var(--grimoire-motion-response);
  width: 100%;
}

.grimoire-seal__resting[data-active='false'],
.grimoire-seal__committed[data-active='false'] {
  position: absolute;
  inset-block-start: 0;
  inset-inline: 0;
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
}

.grimoire-seal__resting[data-active='true'],
.grimoire-seal__committed[data-active='true'] {
  position: relative;
  opacity: 1;
  pointer-events: auto;
  visibility: visible;
}

.grimoire-seal__committed {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--grimoire-space-breath);
}

.grimoire-seal__committed .grimoire-seal__body {
  margin-block-end: 4px;
}

.grimoire-seal__committed-text {
  flex: 1;
  min-width: 0;
}

.grimoire-seal__stamp {
  position: absolute;
  inset-inline-end: var(--grimoire-space-vessel);
  inset-block: 0;
  display: flex;
  align-items: center;
  pointer-events: none;
  z-index: 1;
}

.grimoire-seal__stamp-glyph {
  font-family: var(--grimoire-font-myth);
  font-size: 20px;
  color: var(--grimoire-charge-text);
  line-height: 1;
}

.grimoire-seal__stamp-glyph[data-animate='true'] {
  animation: grimoire-sealGlyph 320ms cubic-bezier(0.34, 1.4, 0.64, 1) forwards;
}

.grimoire-seal__card[data-state='sealing'] .grimoire-seal__action {
  visibility: hidden;
  pointer-events: none;
}

.grimoire-seal__title {
  font-family: var(--grimoire-font-instrument);
  font-size: 16px;
  font-weight: 500;
  color: var(--grimoire-ink-base);
  margin-block-end: 6px;
}

.grimoire-seal__body {
  font-family: var(--grimoire-font-instrument);
  font-size: var(--grimoire-type-inscription-size);
  color: var(--grimoire-ink-secondary);
  margin-block-end: 16px;
  line-height: var(--grimoire-type-inscription-line-height);
}

.grimoire-seal__meta {
  font-size: var(--grimoire-type-marginalia-size);
  font-style: italic;
  color: var(--grimoire-ink-ghost);
  margin-block-end: 0;
}

.grimoire-seal__action {
  --grimoire-seal-action-fill: var(--grimoire-surface-ghost);
  --grimoire-seal-action-label: var(--grimoire-charge-on);
  --grimoire-seal-action-border: var(--grimoire-boundary-base);
  --grimoire-seal-action-outline: var(--grimoire-charge);

  font-family: var(--grimoire-font-instrument);
  font-size: var(--grimoire-type-inscription-size);
  background-color: var(--grimoire-seal-action-fill);
  color: var(--grimoire-seal-action-label);
  border-style: solid;
  border-width: 0.5px;
  border-color: var(--grimoire-seal-action-border);
  border-radius: var(--grimoire-radius-card);
  outline-style: solid;
  outline-width: 0;
  outline-offset: 2px;
  outline-color: var(--grimoire-seal-action-outline);
  padding: 8px 22px;
  min-height: var(--grimoire-space-touch);
  cursor: pointer;
  transition:
    background-color var(--grimoire-motion-response),
    color var(--grimoire-motion-response),
    border-color var(--grimoire-motion-response);
}

.grimoire-seal__action:hover:not(:disabled),
.grimoire-seal__action[data-interaction='hover']:not(:disabled):not([data-interaction='disabled']) {
  --grimoire-seal-action-fill: var(--grimoire-charge);
  --grimoire-seal-action-label: var(--grimoire-surface-base);
  --grimoire-seal-action-border: var(--grimoire-charge);
}

.grimoire-seal__action:active:not(:disabled),
.grimoire-seal__action[data-interaction='press']:not(:disabled):not([data-interaction='disabled']) {
  --grimoire-seal-action-fill: var(--grimoire-charge-dim);
  --grimoire-seal-action-label: var(--grimoire-surface-base);
  --grimoire-seal-action-border: var(--grimoire-charge-dim);
}

.grimoire-seal__action:focus-visible,
.grimoire-seal__action[data-interaction='focus'] {
  outline-width: 2px;
}

.grimoire-seal__action:disabled,
.grimoire-seal__action[data-interaction='disabled'],
.grimoire-seal__action:disabled:hover,
.grimoire-seal__action:disabled:active,
.grimoire-seal__action[data-interaction='disabled']:hover,
.grimoire-seal__action[data-interaction='disabled']:active {
  --grimoire-seal-action-fill: var(--grimoire-surface-ghost);
  --grimoire-seal-action-label: var(--grimoire-ink-ghost);
  --grimoire-seal-action-border: var(--grimoire-boundary-ghost);
  cursor: not-allowed;
}

.grimoire-seal__glyph {
  font-family: var(--grimoire-font-myth);
  font-size: 20px;
  color: var(--grimoire-charge-text);
  line-height: 1;
  flex-shrink: 0;
}

.grimoire-seal__glyph[data-animate='true'] {
  animation: grimoire-sealGlyph 320ms cubic-bezier(0.34, 1.4, 0.64, 1) forwards;
}

.grimoire-seal__rule {
  position: absolute;
  inset-block-end: 0;
  inset-inline-start: 0;
  height: 1.5px;
  width: 100%;
  background: var(--grimoire-charge);
  transform: scaleX(0);
  transform-origin: inline-start;
}

.grimoire-seal__rule[data-animate='true'] {
  animation: grimoire-ruleExtend 320ms ease-out forwards;
}

@media (prefers-reduced-motion: reduce) {
  .grimoire-seal__glyph[data-animate='true'],
  .grimoire-seal__stamp-glyph[data-animate='true'] {
    animation: none;
    opacity: 1;
    transform: none;
  }

  .grimoire-seal__rule[data-animate='true'] {
    animation: none;
    transform: scaleX(1);
  }
}

.grimoire-seal__reset {
  font-family: var(--grimoire-font-instrument);
  font-size: var(--grimoire-type-marginalia-size);
  font-style: italic;
  color: var(--grimoire-ink-ghost);
  background: transparent;
  border: none;
  cursor: pointer;
  margin-block-end: 8px;
  min-height: var(--grimoire-space-touch);
  padding-inline: 4px;
}

.grimoire-seal__reset:focus-visible {
  outline: 2px solid var(--grimoire-boundary-strong);
  outline-offset: 2px;
}

/* components/ThemeSwitcher.style.scss */
.grimoire-theme-switcher {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  border-block-end: 0.5px solid var(--grimoire-boundary-base);
  background: var(--grimoire-surface-base);
}

.grimoire-theme-switcher__btn {
  font-family: var(--grimoire-font-instrument);
  font-size: var(--grimoire-type-inscription-size);
  font-weight: 400;
  font-style: italic;
  color: var(--grimoire-ink-ghost);
  background: transparent;
  border: none;
  border-block-end: 1.5px solid transparent;
  padding: 12px 20px 10px;
  min-height: var(--grimoire-space-touch);
  cursor: pointer;
  transition: all var(--grimoire-motion-response);
  letter-spacing: 0.02em;
}

.grimoire-theme-switcher__btn[data-active='true'] {
  font-weight: 500;
  font-style: normal;
  color: var(--grimoire-ink-base);
  border-block-end-color: var(--grimoire-ink-base);
  letter-spacing: 0;
}

.grimoire-theme-switcher__btn:focus-visible {
  outline: 2px solid var(--grimoire-charge-dim);
  outline-offset: -2px;
}

.grimoire-theme-switcher__glyph {
  margin-inline-end: 6px;
  font-size: 10px;
  opacity: 0.5;
}

.grimoire-theme-switcher__btn[data-active='true'] .grimoire-theme-switcher__glyph {
  opacity: 1;
}

/* components/WorkingIndicator.style.scss */
.grimoire-working {
  display: flex;
  align-items: center;
  gap: var(--grimoire-space-breath);
  padding: 14px var(--grimoire-space-vessel);
  background: var(--grimoire-surface-ghost);
  border: 0.5px solid var(--grimoire-charge-dim);
  border-radius: var(--grimoire-radius-card);
}

.grimoire-working__dots {
  display: flex;
  gap: 4px;
  align-items: center;
}

.grimoire-working__dot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--grimoire-charge-dim);
  animation: grimoire-inkDot 1.4s ease-in-out infinite;
}

.grimoire-working__dot:nth-child(2) {
  animation-delay: 0.2s;
}

.grimoire-working__dot:nth-child(3) {
  animation-delay: 0.4s;
}

@media (prefers-reduced-motion: reduce) {
  .grimoire-working__dot {
    animation: none;
    opacity: 0.6;
    transform: none;
  }
}

.grimoire-working__label {
  font-family: var(--grimoire-font-instrument);
  font-size: var(--grimoire-type-inscription-size);
  font-style: italic;
  line-height: var(--grimoire-type-inscription-line-height);
  color: var(--grimoire-ink-secondary);
  margin: 0;
}

/* components/RitualInterrupted.style.scss */
.grimoire-interrupted {
  border: 0.5px solid var(--grimoire-breach);
  border-radius: var(--grimoire-radius-panel);
  background: var(--grimoire-surface-secondary, var(--grimoire-surface-secondary));
  padding: var(--grimoire-space-vessel);
}

.grimoire-interrupted__title {
  font-family: var(--grimoire-font-instrument);
  font-size: var(--grimoire-type-inscription-size);
  font-weight: 500;
  color: var(--grimoire-breach-text, var(--grimoire-ink-base));
  margin: 0 0 8px;
}

.grimoire-interrupted__body {
  font-family: var(--grimoire-font-instrument);
  font-size: var(--grimoire-type-inscription-size);
  font-style: italic;
  line-height: var(--grimoire-type-inscription-line-height);
  color: var(--grimoire-breach-text, var(--grimoire-ink-secondary));
  margin: 0;
}

.grimoire-interrupted__actions {
  display: flex;
  gap: var(--grimoire-space-field);
  margin-top: var(--grimoire-space-vessel);
}

/* components/ManifestationFieldGroup.style.scss */
.grimoire-manifestation-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.grimoire-manifestation-field__label {
  font-family: var(--grimoire-font-myth);
  font-size: var(--grimoire-type-marginalia-size);
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--grimoire-ink-ghost);
}

.grimoire-manifestation-field__help {
  font-family: var(--grimoire-font-myth);
  font-size: var(--grimoire-type-caption-size);
  font-style: italic;
  line-height: var(--grimoire-type-caption-line-height);
  color: var(--grimoire-ink-ghost);
  margin: 0;
}

.grimoire-manifestation-field__error {
  font-family: var(--grimoire-font-myth);
  font-size: var(--grimoire-type-caption-size);
  font-style: italic;
  color: var(--grimoire-breach-text);
  margin: 0;
}

/* components/InscriptionField.style.scss */
.grimoire-inscription {
  --grimoire-inscription-rule: var(--grimoire-boundary-strong);
  --grimoire-inscription-ink: var(--grimoire-ink-base);
  --grimoire-inscription-caret: var(--grimoire-charge);
  --grimoire-inscription-focus-rule: var(--grimoire-charge-dim);

  border: none;
  border-block-end-width: 1px;
  border-block-end-style: solid;
  border-block-end-color: var(--grimoire-inscription-rule);
  border-radius: 0;
  padding: 0;
  background-color: transparent;
  transition:
    border-color var(--grimoire-motion-response),
    box-shadow var(--grimoire-motion-response);
}

.grimoire-inscription:hover:not(:focus-within):not([data-invalid='true']):not(:has(:disabled)):not([data-interaction='disabled']),
.grimoire-inscription[data-interaction='hover']:not([data-invalid='true']):not([data-interaction='disabled']) {
  --grimoire-inscription-rule: var(--grimoire-ink-ghost);
}

.grimoire-inscription:focus-within:not([data-invalid='true']):not(:has(:disabled)),
.grimoire-inscription[data-interaction='focus']:not([data-invalid='true']):not([data-interaction='disabled']) {
  --grimoire-inscription-rule: var(--grimoire-charge);
  --grimoire-inscription-focus-rule: var(--grimoire-charge-dim);
  box-shadow: 0 2px 0 0 var(--grimoire-inscription-focus-rule);
}

.grimoire-inscription[data-invalid='true'],
.grimoire-inscription[data-invalid='true']:hover,
.grimoire-inscription[data-invalid='true']:focus-within,
.grimoire-inscription[data-interaction='invalid'],
.grimoire-inscription[data-interaction='invalid']:hover,
.grimoire-inscription[data-interaction='invalid']:focus-within {
  --grimoire-inscription-rule: var(--grimoire-breach);
  --grimoire-inscription-focus-rule: var(--grimoire-breach);
}

.grimoire-inscription[data-invalid='true']:focus-within,
.grimoire-inscription[data-interaction='invalid'][data-interaction='focus'],
.grimoire-inscription[data-invalid='true'][data-interaction='focus'] {
  box-shadow: 0 2px 0 0 var(--grimoire-inscription-focus-rule);
}

.grimoire-inscription:has(:disabled),
.grimoire-inscription[data-interaction='disabled'],
.grimoire-inscription:has(:disabled):hover,
.grimoire-inscription[data-interaction='disabled']:hover,
.grimoire-inscription:has(:disabled):focus-within,
.grimoire-inscription[data-interaction='disabled']:focus-within {
  --grimoire-inscription-ink: var(--grimoire-ink-ghost);
  --grimoire-inscription-rule: var(--grimoire-boundary-ghost);
  --grimoire-inscription-caret: var(--grimoire-ink-ghost);
  --grimoire-inscription-focus-rule: transparent;
  box-shadow: none;
}

.grimoire-inscription__control {
  width: 100%;
  border: none;
  outline: none;
  background-color: transparent;
  padding: 6px 0 8px;
  font-family: var(--grimoire-font-instrument);
  font-size: var(--grimoire-type-inscription-size);
  font-weight: var(--grimoire-type-inscription-weight);
  line-height: var(--grimoire-type-inscription-line-height);
  color: var(--grimoire-inscription-ink);
  caret-color: var(--grimoire-inscription-caret);
}

.grimoire-inscription__control::placeholder {
  --grimoire-inscription-ink: var(--grimoire-ink-ghost);
  color: var(--grimoire-inscription-ink);
  font-style: italic;
}

.grimoire-inscription__control:focus-visible {
  outline: none;
}

.grimoire-inscription__control:disabled {
  cursor: not-allowed;
}

.grimoire-inscription-area__control {
  resize: vertical;
  min-height: calc(var(--grimoire-space-touch) * 2);
}

.grimoire-inscription[data-typography='read'] .grimoire-inscription__control {
  font-size: var(--grimoire-type-read-size);
  line-height: var(--grimoire-type-read-line-height);
}

/* components/ChoiceField.style.scss */
.grimoire-choice {
  position: relative;
}

.grimoire-choice__control {
  width: 100%;
  appearance: none;
  border: none;
  border-block-end: 1px solid var(--grimoire-boundary-strong);
  border-radius: 0;
  padding: 6px 40px 8px 0;
  background: transparent;
  font-family: var(--grimoire-font-instrument);
  font-size: var(--grimoire-type-inscription-size);
  color: var(--grimoire-ink-base);
  cursor: pointer;
  transition:
    border-color var(--grimoire-motion-response),
    box-shadow var(--grimoire-motion-response);
}

.grimoire-choice__control:hover:not(:focus-visible) {
  border-block-end-color: var(--grimoire-ink-ghost);
}

.grimoire-choice__control:focus-visible {
  outline: none;
  border-block-end-color: var(--grimoire-charge);
  box-shadow: 0 2px 0 0 var(--grimoire-charge-dim);
}

.grimoire-choice__chevron {
  position: absolute;
  inset-inline-end: 4px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  font-size: 10px;
  color: var(--grimoire-ink-ghost);
}

/* components/MultiChoiceField.style.scss */
.grimoire-multi-choice {
  margin: 0;
  padding: 0;
  border: none;
  min-inline-size: 0;
}

.grimoire-multi-choice__list {
  display: flex;
  flex-direction: column;
  gap: var(--grimoire-space-breath);
}

.grimoire-multi-choice__option {
  display: flex;
  align-items: center;
  gap: var(--grimoire-space-breath);
  font-family: var(--grimoire-font-instrument);
  font-size: var(--grimoire-type-inscription-size);
  color: var(--grimoire-ink-base);
  cursor: pointer;
}

.grimoire-multi-choice__control {
  accent-color: var(--grimoire-charge);
  inline-size: 1rem;
  block-size: 1rem;
  cursor: pointer;
}

.grimoire-multi-choice__label {
  min-inline-size: 0;
}

.grimoire-multi-choice[aria-invalid='true'] .grimoire-multi-choice__option {
  color: var(--grimoire-breach, var(--grimoire-ink-base));
}

/* components/ThresholdChip.style.scss */
.grimoire-threshold {
  display: flex;
  gap: var(--grimoire-space-vessel);
}

.grimoire-threshold__chip {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--grimoire-font-myth);
  font-size: var(--grimoire-type-caption-size);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  border: none;
  border-block-end: 1px solid var(--grimoire-boundary-base);
  border-radius: 0;
  padding: 8px 4px;
  min-height: var(--grimoire-space-touch);
  background: transparent;
  color: var(--grimoire-ink-ghost);
  cursor: pointer;
  transition:
    color var(--grimoire-motion-response),
    border-color var(--grimoire-motion-response);
}

.grimoire-threshold__chip[data-selected='true'] {
  color: var(--grimoire-charge-text);
  border-block-end: 2px solid var(--grimoire-charge);
}

.grimoire-threshold__chip:focus-visible {
  outline: 1px solid var(--grimoire-charge-dim);
  outline-offset: 2px;
}

/* components/ResolvedField.style.scss */
.grimoire-resolved {
  border: none;
  border-radius: 0;
  padding: 6px 0 8px;
  background: transparent;
}

.grimoire-resolved__value {
  font-family: var(--grimoire-font-instrument);
  font-size: var(--grimoire-type-inscription-size);
  line-height: var(--grimoire-type-inscription-line-height);
  color: var(--grimoire-ink-base);
  margin: 0;
}

.grimoire-resolved__supplied {
  text-decoration-line: underline;
  text-decoration-style: dotted;
  text-decoration-color: var(--grimoire-charge-dim);
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
}

.grimoire-resolved__inference {
  margin-block-start: 2px;
}

/* components/InferenceMark.style.scss */
.grimoire-inference {
  display: inline-flex;
  align-items: baseline;
  gap: 8px;
}

.grimoire-inference__trigger {
  border: none;
  border-block-end: 1px dotted var(--grimoire-charge-dim);
  background: transparent;
  padding: 6px 0;
  font-family: var(--grimoire-font-myth);
  font-size: var(--grimoire-type-caption-size);
  font-style: italic;
  line-height: var(--grimoire-type-caption-line-height);
  color: var(--grimoire-charge-text);
  cursor: pointer;
  transition:
    color var(--grimoire-motion-response),
    border-color var(--grimoire-motion-response);
}

.grimoire-inference__trigger:hover {
  color: var(--grimoire-charge);
  border-block-end-color: var(--grimoire-charge);
}

.grimoire-inference__trigger:focus-visible {
  outline: 1px solid var(--grimoire-charge-dim);
  outline-offset: 2px;
}

.grimoire-inference__detail {
  font-family: var(--grimoire-font-myth);
  font-size: var(--grimoire-type-caption-size);
  font-style: italic;
  line-height: var(--grimoire-type-caption-line-height);
  color: var(--grimoire-ink-ghost);
}

/* components/PanelFrame.style.scss */
.grimoire-panel {
  border-radius: var(--grimoire-radius-panel);
  padding: var(--grimoire-space-vessel);
  background: var(--grimoire-surface-secondary);
  border: 0.5px solid var(--grimoire-boundary-base);
  min-width: 0;
}

.grimoire-panel[data-panel-kind='knowledge'],
.grimoire-panel[data-panel-kind='note'] {
  background: var(--grimoire-surface-ghost);
}

.grimoire-panel[data-panel-kind='compound'],
.grimoire-panel[data-panel-kind='note'] {
  border-inline-start: 3px solid var(--grimoire-charge);
}

.grimoire-panel[data-panel-kind='automation'] {
  border-inline-start: 3px solid var(--grimoire-charge);
}

.grimoire-panel__actions {
  display: flex;
  gap: 6px;
  justify-content: flex-end;
  margin-block-end: var(--grimoire-space-breath);
}

.grimoire-panel__header {
  margin-block-end: var(--grimoire-space-field);
}

/* components/PanelAffordance.style.scss */
.grimoire-affordance {
  --grimoire-affordance-label: var(--grimoire-ink-ghost);
  --grimoire-affordance-border: var(--grimoire-boundary-ghost);
  --grimoire-affordance-outline: var(--grimoire-charge);

  width: 28px;
  height: 28px;
  min-width: var(--grimoire-space-touch);
  min-height: var(--grimoire-space-touch);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--grimoire-font-instrument);
  font-size: 14px;
  color: var(--grimoire-affordance-label);
  background-color: transparent;
  border-style: solid;
  border-width: 0.5px;
  border-color: var(--grimoire-affordance-border);
  border-radius: var(--grimoire-radius-default);
  outline-style: solid;
  outline-width: 0;
  outline-offset: 2px;
  outline-color: var(--grimoire-affordance-outline);
  cursor: pointer;
  padding: 0;
  transition:
    color var(--grimoire-motion-recognition),
    border-color var(--grimoire-motion-recognition);
}

.grimoire-affordance[data-intent='pin'][data-pinned='true']:not(:disabled):not([data-interaction='disabled']) {
  --grimoire-affordance-label: var(--grimoire-charge-text);
  --grimoire-affordance-border: var(--grimoire-charge);
}

.grimoire-affordance:hover:not(:disabled),
.grimoire-affordance[data-interaction='hover']:not(:disabled):not([data-interaction='disabled']) {
  --grimoire-affordance-label: var(--grimoire-charge-text);
  --grimoire-affordance-border: var(--grimoire-charge-dim);
}

.grimoire-affordance:active:not(:disabled),
.grimoire-affordance[data-interaction='press']:not(:disabled):not([data-interaction='disabled']) {
  --grimoire-affordance-label: var(--grimoire-charge);
  --grimoire-affordance-border: var(--grimoire-charge);
}

.grimoire-affordance:focus-visible,
.grimoire-affordance[data-interaction='focus'] {
  outline-width: 2px;
}

.grimoire-affordance:disabled,
.grimoire-affordance[data-interaction='disabled'],
.grimoire-affordance:disabled:hover,
.grimoire-affordance:disabled:active,
.grimoire-affordance[data-interaction='disabled']:hover,
.grimoire-affordance[data-interaction='disabled']:active {
  --grimoire-affordance-label: var(--grimoire-ink-ghost);
  --grimoire-affordance-border: transparent;
  cursor: not-allowed;
}

/* components/GlyphMark.style.scss */
.grimoire-glyph-mark {
  display: inline-flex;
  align-items: baseline;
  gap: 0.5rem;
  font-family: var(--grimoire-font-myth);
  font-size: var(--grimoire-type-caption-size);
  letter-spacing: 0.12em;
  font-style: italic;
  color: var(--grimoire-ink-ghost);
}

.grimoire-glyph-mark__mark {
  color: var(--grimoire-charge-text);
}

/* components/WitnessQuote.style.scss */
.grimoire-witness-quote {
  margin: 0;
  padding: 0;
  border: none;
}

.grimoire-witness-quote__text {
  font-family: var(--grimoire-font-myth);
  font-weight: 300;
  font-style: italic;
  font-size: clamp(1.1rem, 2.5vw, 1.35rem);
  line-height: 1.55;
  color: var(--grimoire-ink-base);
  margin: 0 0 0.75rem;
}

.grimoire-witness-quote__role {
  font-family: var(--grimoire-font-myth);
  font-size: var(--grimoire-type-caption-size);
  color: var(--grimoire-ink-ghost);
  letter-spacing: 0.1em;
  font-style: italic;
}

/* components/TenetCard.style.scss */
.grimoire-tenet {
  background: var(--grimoire-surface-secondary);
  padding: clamp(1.5rem, 3.5vw, 2.5rem);
  transition: background-color var(--grimoire-motion-response);
}

.grimoire-tenet:hover {
  background: var(--grimoire-surface-recessed);
}

.grimoire-tenet__number {
  display: block;
  font-family: var(--grimoire-font-myth);
  font-size: var(--grimoire-type-marginalia-size);
  letter-spacing: 0.25em;
  color: var(--grimoire-charge-text);
  font-style: italic;
  margin-block-end: 1rem;
}

.grimoire-tenet__title {
  font-family: var(--grimoire-font-myth);
  font-weight: 400;
  font-size: clamp(1.1rem, 2vw, 1.4rem);
  color: var(--grimoire-ink-base);
  margin: 0 0 0.75rem;
  line-height: 1.3;
}

.grimoire-tenet__body {
  font-family: var(--grimoire-font-instrument);
  font-size: clamp(0.9rem, 1.6vw, 1rem);
  color: var(--grimoire-ink-secondary);
  line-height: 1.75;
  margin: 0;
}

.grimoire-tenet__body em {
  font-style: italic;
  color: var(--grimoire-ink-base);
}

/* components/ScrollHint.style.scss */
.grimoire-scroll-hint {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-family: var(--grimoire-font-myth);
  font-size: var(--grimoire-type-caption-size);
  letter-spacing: 0.15em;
  font-style: italic;
  color: var(--grimoire-ink-ghost);
  text-decoration: none;
  animation: grimoire-breathe 3s ease-in-out infinite;
}

.grimoire-scroll-hint__line {
  width: 2rem;
  height: 1px;
  background: var(--grimoire-ink-ghost);
}

@keyframes grimoire-breathe {
  0%,
  100% {
    opacity: 0.5;
    transform: translateY(0);
  }

  50% {
    opacity: 1;
    transform: translateY(4px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .grimoire-scroll-hint {
    animation: none;
  }
}

/* components/Reveal.style.scss */
.grimoire-reveal {
  opacity: 0;
  transform: translateY(1.75rem);
  transition:
    opacity var(--grimoire-motion-arrival) ease-out,
    transform var(--grimoire-motion-arrival) ease-out;
}

.grimoire-reveal--visible {
  opacity: 1;
  transform: translateY(0);
}

.grimoire-reveal--delay-1 {
  transition-delay: 0.1s;
}

.grimoire-reveal--delay-2 {
  transition-delay: 0.2s;
}

.grimoire-reveal--delay-3 {
  transition-delay: 0.35s;
}

.grimoire-reveal--delay-4 {
  transition-delay: 0.5s;
}

.grimoire-reveal--delay-5 {
  transition-delay: 0.65s;
}

@media (prefers-reduced-motion: reduce) {
  .grimoire-reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

/* components/InvocationLine.style.scss */
.grimoire-invocation-line {
  padding-block-start: 0.125rem;
}

.grimoire-invocation-line[data-disabled='true'] {
  opacity: 0.5;
}

.grimoire-invocation-line__label {
  display: block;
  font-family: var(--grimoire-font-instrument);
  font-size: var(--grimoire-type-marginalia-size);
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: var(--grimoire-ink-ghost);
  margin-block-end: 8px;
  transition: opacity var(--grimoire-motion-response);
}

.grimoire-invocation-line__row {
  display: flex;
  align-items: center;
  border-block-end: 1px solid var(--grimoire-boundary-strong);
  padding: 2px 0 8px;
  transition:
    border-color var(--grimoire-motion-response),
    box-shadow var(--grimoire-motion-response);
}

.grimoire-invocation-line__row:hover:not(:focus-within) {
  border-block-end-color: var(--grimoire-ink-ghost);
}

.grimoire-invocation-line__row:focus-within {
  border-block-end-color: var(--grimoire-charge);
  box-shadow: 0 2px 0 0 var(--grimoire-charge-dim);
}

.grimoire-invocation-line__row[data-invalid='true'] {
  border-block-end-color: var(--grimoire-breach);
}

.grimoire-invocation-line__row[data-invalid='true']:focus-within {
  box-shadow: 0 2px 0 0 var(--grimoire-breach-dim);
}

.grimoire-invocation-line__row[data-invalid='true'] + .grimoire-invocation-line__hint {
  color: var(--grimoire-breach-text);
}

.grimoire-invocation-line__input {
  flex: 1;
  min-width: 0;
  border: none;
  outline: none;
  background: transparent;
  font-family: var(--grimoire-font-instrument);
  font-size: var(--grimoire-type-inscription-size);
  font-weight: var(--grimoire-type-inscription-weight);
  line-height: var(--grimoire-type-inscription-line-height);
  color: var(--grimoire-ink-base);
  caret-color: var(--grimoire-charge);
}

.grimoire-invocation-line__input::placeholder {
  color: var(--grimoire-ink-ghost);
  font-style: italic;
}

.grimoire-invocation-line__invoke {
  flex: none;
  margin-inline-start: var(--grimoire-space-breath);
  gap: 0.5em;
}

.grimoire-invocation-line__invoke-glyph {
  letter-spacing: 0;
}

.grimoire-invocation-line__input:disabled {
  cursor: not-allowed;
}

.grimoire-invocation-line__hint {
  font-family: var(--grimoire-font-myth);
  font-style: italic;
  font-size: var(--grimoire-type-marginalia-size);
  color: var(--grimoire-ink-ghost);
  margin: 0.625rem 0 0;
  letter-spacing: 0.04em;
  min-height: 1.125rem;
}

/* components/LedgerEntry.style.scss */
.grimoire-ledger-entry {
  position: relative;
  padding-block-end: var(--grimoire-space-field);
}

.grimoire-ledger-entry__header {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px;
  margin-block-end: 4px;
}

.grimoire-ledger-entry__glyph {
  font-family: var(--grimoire-font-myth);
  font-size: var(--grimoire-type-manifestation-size);
  color: var(--grimoire-charge-text);
  line-height: 1;
}

.grimoire-ledger-entry__glyph[data-animate='true'] {
  animation: grimoire-sealGlyph 320ms cubic-bezier(0.34, 1.4, 0.64, 1) forwards;
}

.grimoire-ledger-entry__rule {
  height: 1.5px;
  background: var(--grimoire-charge);
  margin-block-start: var(--grimoire-space-breath);
  transform-origin: inline-start;
}

.grimoire-ledger-entry__rule[data-animate='true'] {
  animation: grimoire-ruleExtend 320ms ease-out forwards;
}

/* components/LedgerTypeMark.style.scss */
.grimoire-ledger-mark {
  font-family: var(--grimoire-font-instrument);
  font-size: var(--grimoire-type-marginalia-size);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--grimoire-charge-text);
  border: 0.5px solid var(--grimoire-boundary-base);
  border-radius: var(--grimoire-radius-default);
  padding: 2px 8px;
}

/* components/InProgressRule.style.scss */
.grimoire-in-progress {
  display: flex;
  align-items: center;
  gap: var(--grimoire-space-vessel);
  margin-block: var(--grimoire-space-ground);
}

.grimoire-in-progress__rule {
  flex: 1;
  height: 0.5px;
  background: var(--grimoire-boundary-base);
  border: none;
  margin: 0;
}

.grimoire-in-progress__label {
  font-family: var(--grimoire-font-instrument);
  font-size: var(--grimoire-type-marginalia-size);
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--grimoire-ink-ghost);
  white-space: nowrap;
}

/* components/MarginaliaField.style.scss */
.grimoire-marginalia {
  border-inline-start: 2px solid var(--grimoire-charge);
  padding-inline-start: var(--grimoire-space-vessel);
  margin-block-start: var(--grimoire-space-breath);
}

.grimoire-marginalia__control {
  width: 100%;
  border: none;
  outline: none;
  background: transparent;
  font-family: var(--grimoire-font-instrument);
  font-size: var(--grimoire-type-inscription-size);
  font-style: italic;
  color: var(--grimoire-ink-secondary);
  caret-color: var(--grimoire-charge);
  min-height: var(--grimoire-space-touch);
}

.grimoire-marginalia__control:focus-visible {
  outline: none;
}

.grimoire-marginalia:focus-within {
  border-inline-start-color: var(--grimoire-charge);
}

.grimoire-marginalia__saved {
  font-family: var(--grimoire-font-instrument);
  font-size: var(--grimoire-type-caption-size);
  font-style: italic;
  color: var(--grimoire-ink-ghost);
  margin: 0;
}

/* components/ConsequencePreview.style.scss */
.grimoire-consequence {
  margin-block: var(--grimoire-space-field) 0;
  padding-block-start: var(--grimoire-space-field);
  border-block-start: 0.5px solid var(--grimoire-boundary-base);
}

.grimoire-consequence__heading {
  font-family: var(--grimoire-font-instrument);
  font-size: var(--grimoire-type-marginalia-size);
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--grimoire-ink-ghost);
  margin: 0 0 var(--grimoire-space-breath);
}

.grimoire-consequence__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--grimoire-space-breath);
}

.grimoire-consequence__row {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.grimoire-consequence__label {
  font-family: var(--grimoire-font-instrument);
  font-size: var(--grimoire-type-caption-size);
  color: var(--grimoire-ink-ghost);
  margin: 0;
}

.grimoire-consequence__target {
  font-family: var(--grimoire-font-instrument);
  font-size: var(--grimoire-type-inscription-size);
  line-height: var(--grimoire-type-inscription-line-height);
  color: var(--grimoire-ink-base);
  margin: 0;
}

.grimoire-consequence__value {
  font-family: var(--grimoire-font-instrument);
  font-size: var(--grimoire-type-inscription-size);
  font-weight: 500;
  color: var(--grimoire-charge-text);
  margin: 0;
}

/* components/FunctionManifestation.style.scss */
.grimoire-manifestation__prompt {
  font-family: var(--grimoire-font-instrument);
  font-size: var(--grimoire-type-inscription-size);
  line-height: var(--grimoire-type-inscription-line-height);
  color: var(--grimoire-ink-secondary);
  margin: var(--grimoire-space-field) 0 var(--grimoire-space-breath);
}

.grimoire-manifestation__fields {
  display: flex;
  flex-direction: column;
  gap: var(--grimoire-space-field);
  margin-block-end: var(--grimoire-space-field);
}

.grimoire-manifestation__confirm {
  margin-block-start: var(--grimoire-space-vessel);
}

/* design-system/vessels/beats/MissSurface.style.scss */
.grimoire-miss {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  color: var(--grimoire-ink-base);
  box-sizing: border-box;
}

.grimoire-miss__inner {
  display: flex;
  flex-direction: column;
  align-items: inherit;
  width: 100%;
  max-width: 44ch;
}

.grimoire-miss[data-layout='page'] {
  display: grid;
  place-items: center;
  text-align: center;
  min-height: min(32rem, 70vh);
  padding-block: var(--grimoire-space-ground);
  padding-inline: var(--grimoire-space-vessel);
}

.grimoire-miss[data-layout='page'] .grimoire-miss__inner {
  align-items: center;
  margin-inline: auto;
}

.grimoire-miss[data-layout='inline'] {
  width: 100%;
  min-height: 0;
  text-align: start;
  border-block-start: 1px solid var(--grimoire-boundary-base);
  padding-block: var(--grimoire-space-field) var(--grimoire-space-vessel);
}

.grimoire-miss[data-layout='inline'] .grimoire-miss__inner {
  max-width: 48ch;
}

.grimoire-miss__title {
  font-family: var(--grimoire-font-myth);
  font-size: var(--grimoire-type-manifestation-size);
  font-weight: var(--grimoire-type-manifestation-weight);
  line-height: 1.15;
  letter-spacing: 0.005em;
  color: var(--grimoire-ink-base);
  margin: 0;
  text-wrap: balance;
}

.grimoire-miss[data-layout='inline'] .grimoire-miss__title {
  font-size: var(--grimoire-type-invocation-size);
  font-style: normal;
  font-weight: 400;
  line-height: 1.25;
  color: var(--grimoire-ink-base);
}

.grimoire-miss__body {
  font-family: var(--grimoire-font-instrument);
  font-size: var(--grimoire-type-read-size);
  line-height: 1.68;
  color: var(--grimoire-ink-secondary);
  margin: var(--grimoire-space-field) 0 0;
  max-width: 42ch;
  text-wrap: pretty;
}

.grimoire-miss[data-layout='page'] .grimoire-miss__body {
  margin-inline: auto;
}

.grimoire-miss[data-layout='inline'] .grimoire-miss__body {
  font-size: var(--grimoire-type-inscription-size);
  margin-block-start: var(--grimoire-space-breath);
  max-width: 46ch;
}

.grimoire-miss__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: inherit;
  gap: var(--grimoire-space-field);
  margin-block-start: var(--grimoire-space-vessel);
}

.grimoire-miss__actions form {
  display: contents;
}

.grimoire-miss[data-layout='page'] .grimoire-miss__actions {
  justify-content: center;
}

.grimoire-miss[data-layout='inline'] .grimoire-miss__actions {
  justify-content: flex-start;
  margin-block-start: var(--grimoire-space-field);
}

.grimoire-miss .grimoire-charge {
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}

.grimoire-miss .grimoire-charge.grimoire-miss__act--quiet:not(:disabled):not([data-interaction='disabled']) {
  --grimoire-charge-button-fill: transparent;
  --grimoire-charge-button-label: var(--grimoire-ink-secondary);
  --grimoire-charge-button-border: var(--grimoire-boundary-base);
  padding: 0 var(--grimoire-space-breath);
  border-width: 0 0 1px;
  border-radius: 0;
}

.grimoire-miss .grimoire-charge.grimoire-miss__act--quiet:hover:not(:disabled),
.grimoire-miss .grimoire-charge.grimoire-miss__act--quiet[data-interaction='hover']:not(:disabled) {
  --grimoire-charge-button-fill: transparent;
  --grimoire-charge-button-label: var(--grimoire-ink-base);
  --grimoire-charge-button-border: var(--grimoire-ink-ghost);
}

.grimoire-miss[data-layout='inline'] .grimoire-charge:not(:disabled):not([data-interaction='disabled']),
.grimoire-miss[data-layout='inline'] .grimoire-miss__act--quiet:not(:disabled):not([data-interaction='disabled']) {
  --grimoire-charge-button-fill: transparent;
  --grimoire-charge-button-label: var(--grimoire-charge-text);
  --grimoire-charge-button-border: var(--grimoire-charge);
  padding: 0 var(--grimoire-space-breath) var(--grimoire-space-breath) 0;
  min-height: var(--grimoire-space-touch);
  border-width: 0 0 1px;
  border-radius: 0;
}

.grimoire-miss[data-layout='inline'] .grimoire-charge:hover:not(:disabled),
.grimoire-miss[data-layout='inline'] .grimoire-charge[data-interaction='hover']:not(:disabled),
.grimoire-miss[data-layout='inline'] .grimoire-miss__act--quiet:hover:not(:disabled),
.grimoire-miss[data-layout='inline'] .grimoire-miss__act--quiet[data-interaction='hover']:not(:disabled) {
  --grimoire-charge-button-fill: transparent;
  --grimoire-charge-button-label: var(--grimoire-ink-base);
  --grimoire-charge-button-border: var(--grimoire-charge);
}