/* Participation consumer of Skyzai v8.1.18. Import the pinned tokens first.
   Emergentism owns the identity, content and evidence cues. */
:root:root[data-material-consumer="participation"] {
  --g2-void: var(--md-sys-color-background);
  --g2-field: var(--md-sys-color-surface-container-low);
  --g2-surface: var(--md-sys-color-surface-container);
  --g2-surface-2: var(--md-sys-color-surface-container-high);
  --g2-bone: var(--md-sys-color-on-surface);
  --g2-bone-muted: var(--md-sys-color-on-surface-variant);
  --g2-bone-faint: var(--md-sys-color-on-surface-variant);
  --g2-actual: var(--md-sys-color-primary);
  --g2-possible: var(--md-sys-color-secondary);
  --g2-evidence: var(--md-sys-color-tertiary);
  --g2-poison: var(--md-sys-color-error);
  --g2-rule: var(--md-sys-color-outline-variant);
  --g2-rule-strong: var(--md-sys-color-outline);
  --g2-nav-bg: var(--md-sys-color-surface);
  --g2-display: var(--font-display);
  --g2-sans: var(--font-sans);
  --g2-mono: var(--font-code);
  --g2-nav-h: 64px;
  --g2-page: min(1180px, calc(100% - 64px));
}

.g2-page.g2-participation {
  --action-color: var(--md-sys-color-primary);
  --action-fill: transparent;
  font: var(--m3-type-body-large);
  letter-spacing: var(--m3-tracking-body-large);
}
.g2-participation > main { padding-block: var(--space-8); }
.g2-participation .shell,
.g2-participation .truth-strip { width: var(--g2-page); margin-inline: auto; }
.g2-participation :is(h1, h2, h3, p) { margin-block-start: 0; }
.g2-participation h1 {
  max-width: 22ch;
  margin-block-end: var(--space-5);
  font: var(--m3-type-display-large);
  letter-spacing: var(--m3-tracking-display-large);
  text-wrap: balance;
}
.g2-participation h2 {
  max-width: 30ch;
  margin-block-end: var(--space-4);
  font: var(--m3-type-display-small);
  text-wrap: balance;
}
.g2-participation :is(h1, h2) strong {
  color: inherit;
  font-weight: var(--m3-type-emphasized-weight-regular);
}
.g2-participation h3 {
  margin-block-end: var(--space-3);
  font: var(--m3-type-title-large);
}
.g2-participation .hero { padding-block: var(--space-5) var(--space-8); }
.g2-participation :is(.dek, .lead) {
  max-width: 72ch;
  margin-block-end: var(--space-5);
  color: var(--md-sys-color-on-surface-variant);
  font: var(--m3-type-body-large);
}
.g2-participation .dek { max-width: 68ch; font-size: 18px; line-height: 28px; }
.g2-participation :is(.eyebrow, .mark, .cid) {
  display: block;
  margin-block-end: var(--space-4);
  color: var(--md-sys-color-on-surface-variant);
  font: 500 12px/20px var(--font-code);
  letter-spacing: 0;
}
.g2-participation .eyebrow::before { content: none; }
.g2-participation .dark-section {
  padding-block: var(--space-8);
  border-block-start: 1px solid var(--md-sys-color-outline-variant);
  scroll-margin-block-start: calc(var(--g2-nav-h) + var(--space-5));
}
.g2-participation .actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3);
  margin-block-start: var(--space-5);
}
.g2-participation :is(.button, .copy-button) {
  position: relative;
  display: inline-flex;
  min-width: 48px;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  padding: var(--space-3) var(--space-5);
  border: 1px solid var(--md-sys-color-outline);
  border-radius: var(--shape-full);
  background: var(--action-fill);
  color: var(--action-color);
  font: var(--m3-type-label-large);
  letter-spacing: var(--m3-tracking-label-large);
  text-decoration: none;
  text-align: center;
  cursor: pointer;
  transition: background var(--dur-short3) var(--ease-standard);
}
.g2-participation .button.primary {
  --action-fill: var(--md-sys-color-primary);
  --action-color: var(--md-sys-color-on-primary);
  border-color: transparent;
}
.g2-participation .button:not(.primary),
.g2-participation .copy-button {
  /* Gold tone 40 supplies accessible outlined-label ink in light appearances. */
  --action-color: light-dark(var(--ref-primary-40), var(--md-sys-color-primary));
}
.g2-participation .truth-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-5);
  padding: var(--space-5);
  border-radius: var(--shape-xl);
  background: var(--md-sys-color-surface-container);
}
.g2-participation .truth-strip p {
  margin: 0;
  color: var(--md-sys-color-on-surface-variant);
  font: var(--m3-type-body-medium);
}
.g2-participation .truth-strip b {
  display: block;
  margin-block-end: var(--space-2);
  color: var(--md-sys-color-on-surface);
  font: var(--m3-type-title-medium);
}
.g2-participation :is(.principles, .contract-grid) {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-5);
  margin-block-start: var(--space-6);
}
.g2-participation :is(.principle, .contract) {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: var(--space-5);
  border: 0;
  border-radius: var(--shape-lg);
  background: var(--md-sys-color-surface-container);
  color: var(--md-sys-color-on-surface);
}
.g2-participation :is(.principle, .contract) p {
  margin-block-end: var(--space-4);
  color: var(--md-sys-color-on-surface-variant);
  font: var(--m3-type-body-large);
}
.g2-participation .principle .actions { margin-block-start: auto; padding-block-start: var(--space-4); }
.g2-participation .principle .actions .button { width: 100%; }
.g2-participation .principle p:last-child { margin-block-end: 0; }
.g2-participation .contract-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.g2-participation .contract ul { margin: 0; padding-inline-start: var(--space-5); color: var(--md-sys-color-on-surface-variant); }
.g2-participation #support > details {
  margin-block: var(--space-6);
  border: 1px solid var(--md-sys-color-outline-variant);
  border-radius: var(--shape-lg);
  background: var(--md-sys-color-surface-container-low);
  overflow: clip;
}
.g2-participation #support > details summary {
  min-height: 48px;
  padding: var(--space-4) var(--space-5);
  font: var(--m3-type-title-medium);
  cursor: pointer;
}
.g2-participation #support > details p { padding: 0 var(--space-5) var(--space-5); margin: 0; }
.g2-participation .warning {
  margin-block: var(--space-6);
  padding: var(--space-5);
  border: 1px solid var(--md-sys-color-error);
  border-radius: var(--shape-lg);
  background: var(--md-sys-color-error-container);
  color: var(--md-sys-color-on-error-container);
}
.g2-participation .warning p { margin-block-end: var(--space-3); }
.g2-participation .provider-guidance { font: var(--m3-type-body-medium); }
.g2-participation .code-panel {
  margin-block: var(--space-6);
  border: 1px solid var(--md-sys-color-outline-variant);
  border-radius: var(--shape-lg);
  overflow: hidden;
  background: var(--md-sys-color-surface-container);
}
.g2-participation .code-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  padding: var(--space-3) var(--space-5);
  border-block-end: 1px solid var(--md-sys-color-outline-variant);
  font: 400 12px/20px var(--font-code);
}
.g2-participation pre { margin: 0; padding: var(--space-5); overflow: auto; font: 400 14px/24px var(--font-code); }
.g2-participation .load-error { padding: var(--space-5); border: 1px solid var(--md-sys-color-error); border-radius: var(--shape-lg); }
.g2-participation .noscript { display: block; padding: var(--space-5); background: var(--md-sys-color-surface-container); text-align: center; }
.g2-participation #contribution-draft { max-width: 76ch; }
.g2-participation #contribution-draft[hidden],
.g2-participation #draft-support-mode[hidden] { display: none; }
.g2-participation #contribution-draft label { display: block; margin-block: var(--space-5) var(--space-2); font: var(--m3-type-title-medium); }
.g2-participation #contribution-draft :is(select, textarea) {
  display: block; width: 100%; min-height: 48px; max-width: 100%;
  border: 1px solid var(--md-sys-color-outline); border-radius: var(--shape-sm);
  padding: var(--space-3); background: var(--md-sys-color-surface-container-low);
  color: var(--md-sys-color-on-surface); font: var(--m3-type-body-large);
}
.g2-participation #contribution-draft textarea { resize: vertical; }
.g2-participation :is(.draft-help, .draft-template) { margin-block-start: var(--space-4); color: var(--md-sys-color-on-surface-variant); font: var(--m3-type-body-medium); }
.g2-participation .draft-template summary { min-height: 48px; padding-block: var(--space-4); cursor: pointer; }
.g2-participation .draft-template pre { white-space: pre-wrap; overflow-wrap: anywhere; }

/* Shared shell: Material roles and 48px targets, with existing destination semantics. */
.g2-participation .g2-nav { backdrop-filter: none; }
.g2-participation .g2-nav__inner { gap: var(--space-4); }
.g2-participation .g2-brand { font: var(--m3-type-title-medium); letter-spacing: 0; }
.g2-participation .g2-brand__mark { display: inline; letter-spacing: 0; font-family: var(--font-code); }
.g2-participation :is(.g2-nav__desktop a, .g2-mobile__direct, .g2-menu a, .g2-menu summary, .g2-theme-toggle) {
  padding-inline: var(--space-3);
  border-radius: var(--shape-full);
  font: var(--m3-type-label-large);
  letter-spacing: var(--m3-tracking-label-large);
}
.g2-participation .g2-nav a[aria-current="page"] {
  background: var(--md-sys-color-secondary-container);
  color: var(--md-sys-color-on-secondary-container);
  box-shadow: none;
}
.g2-participation .g2-menu__panel {
  border: 0;
  border-radius: var(--shape-xl);
  background: var(--md-sys-color-surface-container-high);
  box-shadow: var(--md-sys-elevation-level-1);
}
.g2-participation .g2-menu__panel a { border: 0; }
.g2-participation .g2-theme-toggle > span:first-child { color: inherit; font-size: inherit; }
.g2-participation .g2-menu summary::after { content: none; }
.g2-participation .g2-footer nav a { display: inline-flex; align-items: center; min-height: 48px; font: var(--m3-type-label-large); }
.g2-participation .g2-footer__key-item--actual { color: light-dark(var(--ref-primary-40), var(--md-sys-color-primary)); }

/* The shared drawer injects legacy styles late; scoped selectors keep this consumer paired. */
.g2-participation #atlas-fab {
  border: 0;
  background: var(--md-sys-color-primary-container);
  color: var(--md-sys-color-on-primary-container);
  font-family: var(--font-sans);
  opacity: 1;
}
.g2-participation #atlas-panel {
  background: var(--md-sys-color-surface-container-high);
  color: var(--md-sys-color-on-surface);
  border-color: var(--md-sys-color-outline-variant);
  font-family: var(--font-sans);
  backdrop-filter: none;
}
.g2-participation :is(#atlas-head b, #atlas-close, #atlas-tree summary, #atlas-tree a) { color: var(--md-sys-color-on-surface); }
.g2-participation #atlas-q {
  background: var(--md-sys-color-surface-container-highest);
  color: var(--md-sys-color-on-surface);
  border-color: var(--md-sys-color-outline);
  border-radius: var(--shape-sm);
  font: var(--m3-type-body-large);
}
.g2-participation :is(#atlas-count, #atlas-tree .atlas-band, #atlas-tree .atlas-band em) { color: var(--md-sys-color-on-surface-variant); font-family: var(--font-code); }
.g2-participation #atlas-tree .atlas-prov { color: var(--md-sys-color-on-surface-variant); border-color: var(--md-sys-color-outline); font-family: var(--font-code); }
.g2-participation #atlas-tree a.atlas-here { background: var(--md-sys-color-secondary-container); color: var(--md-sys-color-on-secondary-container); border-color: transparent; border-radius: var(--shape-full); }
.g2-participation :focus-visible { outline: 2px solid var(--md-sys-color-primary); outline-offset: 3px; }
.g2-participation #atlas-q:focus-visible { outline: 2px solid var(--md-sys-color-primary); outline-offset: 3px; }

@media (hover: hover) {
  .g2-participation :is(.button, .copy-button):hover {
    background: linear-gradient(color-mix(in srgb, var(--action-color) calc(var(--state-hover-opacity) * 100%), transparent), color-mix(in srgb, var(--action-color) calc(var(--state-hover-opacity) * 100%), transparent)), var(--action-fill);
  }
  .g2-participation :is(.g2-nav a, .g2-theme-toggle, .g2-menu summary):hover { background-color: color-mix(in srgb, var(--md-sys-color-on-surface) calc(var(--state-hover-opacity) * 100%), transparent); }
  .g2-participation .g2-nav a[aria-current="page"]:hover { background: linear-gradient(color-mix(in srgb, var(--md-sys-color-on-secondary-container) calc(var(--state-hover-opacity) * 100%), transparent), color-mix(in srgb, var(--md-sys-color-on-secondary-container) calc(var(--state-hover-opacity) * 100%), transparent)), var(--md-sys-color-secondary-container); }
}
.g2-participation :is(.button, .copy-button):focus-visible {
  background: linear-gradient(color-mix(in srgb, var(--action-color) calc(var(--state-focus-opacity) * 100%), transparent), color-mix(in srgb, var(--action-color) calc(var(--state-focus-opacity) * 100%), transparent)), var(--action-fill);
}
.g2-participation :is(.button, .copy-button):active {
  background: linear-gradient(color-mix(in srgb, var(--action-color) calc(var(--state-pressed-opacity) * 100%), transparent), color-mix(in srgb, var(--action-color) calc(var(--state-pressed-opacity) * 100%), transparent)), var(--action-fill);
}
@media (max-width: 1199px) {
  .g2-participation .g2-nav__desktop { display: none; }
  .g2-participation .g2-nav__mobile { display: flex; }
}
@media (max-width: 839px) {
  :root:root[data-material-consumer="participation"] { --g2-page: calc(100% - 48px); }
  .g2-participation :is(.principles, .contract-grid) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 599px) {
  :root:root[data-material-consumer="participation"] { --g2-page: calc(100% - 32px); }
  .g2-participation > main { padding-block: var(--space-6); }
  .g2-participation .hero { padding-block: var(--space-4) var(--space-7); }
  .g2-participation h1 { font: var(--m3-type-display-small); }
  .g2-participation h2 { font: var(--m3-type-headline-large); }
  .g2-participation .dark-section { padding-block: var(--space-7); }
  .g2-participation :is(.principles, .contract-grid, .truth-strip) { grid-template-columns: 1fr; }
  .g2-participation .actions { align-items: stretch; }
  .g2-participation .actions .button { width: 100%; }
  .g2-participation .g2-brand__word { display: none; }
  .g2-participation .g2-nav__inner { gap: var(--space-2); }
  .g2-participation .code-head { flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) {
  :root:root[data-material-consumer="participation"] { scroll-behavior: auto; }
  .g2-participation *, .g2-participation #atlas-panel { transition: none; animation: none; }
}
@media (forced-colors: active) {
  .g2-participation :is(.principle, .contract, .truth-strip, #atlas-panel) { border: 1px solid CanvasText; }
  .g2-participation :is(.button, .copy-button) { color: LinkText; background: Canvas; border-color: ButtonText; }
  .g2-participation .g2-nav a[aria-current="page"] { outline: 1px solid Highlight; }
}
