/* Shared colour system for the public site, guest, organiser and editorial workspaces. */
:root {
  color-scheme: light;
  --page: #f8f7f2;
  --surface: #ffffff;
  --surface-alt: #f0f1e9;
  --surface-hover: #e7ebe1;
  --text-primary: #1f332b;
  --text-secondary: #58645b;
  --rule: #d8ddd1;
  --control-border: #8a978a;
  --action: #264b38;
  --action-hover: #345f48;
  --on-action: #ffffff;
  --accent-ink: #76613e;
  --focus: #76613e;
  --success-surface: #edf2e8;
  --success-ink: #31552f;
  --warning-surface: #f4ead4;
  --warning-ink: #79571e;
  --danger-surface: #f7e6df;
  --danger-ink: #8d3528;
  --danger-action: #8d3528;
  --on-danger: #fffaf1;
  --shadow-color: #263b3324;
  --overlay: #15271cc2;
  --art-surface: #e2e4d7;
  --art-ink: #64765c;
  --ease-press: cubic-bezier(.23, 1, .32, 1);
  --layer-sticky: 8;
  --layer-header: 30;
  --layer-menu: 100;
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --page: #151f1b;
  --surface: #1d2b24;
  --surface-alt: #25362d;
  --surface-hover: #30473a;
  --text-primary: #e8e8dc;
  --text-secondary: #b1b8ae;
  --rule: #3a4c40;
  --control-border: #738475;
  --action: #d8c39c;
  --action-hover: #e9d7b5;
  --on-action: #1b251f;
  --accent-ink: #d8c39c;
  --focus: #e4ca91;
  --success-surface: #263d2c;
  --success-ink: #b8d3ae;
  --warning-surface: #3c3324;
  --warning-ink: #e4c58c;
  --danger-surface: #432b26;
  --danger-ink: #f2b7a5;
  --danger-action: #bd6652;
  --on-danger: #151f1b;
  --shadow-color: #07110c66;
  --overlay: #07110ccc;
  --art-surface: #2c3a30;
  --art-ink: #a5b99a;
}
/* Without JavaScript, language and the complete light theme remain usable. */
html { -webkit-text-size-adjust: 100%; }
::selection { background: var(--action); color: var(--on-action); }
input, textarea, select { caret-color: var(--text-primary); color: var(--text-primary); }
input::placeholder, textarea::placeholder { color: var(--text-secondary); opacity: 1; }
button, a, summary { touch-action: manipulation; }
button { -webkit-user-select: none; user-select: none; }
.display-preferences { position: relative; font: 14px/1.4 var(--sans); margin: 0; }
.display-preferences > summary { display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 10px; cursor: pointer; list-style: none; border-radius: 6px; }
.display-preferences > summary::-webkit-details-marker { display: none; }
.display-preferences > summary::after { content: ''; width: 6px; height: 6px; border-right: 1px solid; border-bottom: 1px solid; transform: translateY(-2px) rotate(45deg); margin-left: 2px; }
.preference-current { border-left: 1px solid var(--rule); padding-left: 8px; color: var(--text-secondary); }
.preferences-panel { position: absolute; z-index: var(--layer-menu); top: calc(100% + 8px); right: 0; width: 272px; max-width: calc(100vw - 32px); padding: 14px; background: var(--surface); border-radius: 12px; box-shadow: 0 12px 36px var(--shadow-color); max-height: calc(100dvh - 90px); overflow-y: auto; overscroll-behavior: contain; color: var(--text-primary); }
.preference-languages { display: grid; grid-template-columns: 1fr; gap: 2px; }
.preference-languages a { display: flex; align-items: center; justify-content: space-between; padding: 10px 12px; min-height: 44px; border-radius: 6px; font-size: 15px; }
.preference-languages a[aria-current] { background: var(--surface-alt); font-weight: 700; }
.preference-languages a[aria-current]::after { content: ''; width: 5px; height: 10px; margin-right: 4px; border-right: 1.5px solid; border-bottom: 1.5px solid; transform: rotate(45deg); }
.preference-theme { border-top: 1px solid var(--rule); margin-top: 12px; padding-top: 16px; }
.preference-label { display: block; color: var(--text-secondary); margin-bottom: 10px; padding-left: 2px; }
.preference-options { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.preference-options button { display: flex; align-items: center; justify-content: center; gap: 7px; min-height: 46px; padding: 8px; border: 1px solid var(--control-border); border-radius: 6px; background: var(--surface); color: var(--text-primary); font: inherit; }
.preference-options button[aria-pressed="true"] { background: var(--action); border-color: var(--action); color: var(--on-action); font-weight: 700; }
.theme-swatch { width: 13px; height: 13px; border: 1px solid currentColor; border-radius: 50%; flex-shrink: 0; }
.theme-swatch-light { background: #f8f7f2; }
.theme-swatch-dark { background: #151f1b; }
.display-preferences[open] > summary { background: var(--surface-alt); }
:where(.display-preferences) :is(a,button,summary):focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
@media (hover: hover) and (pointer: fine) {
  .display-preferences > summary:hover, .preference-languages a:hover { background: var(--surface-alt); }
  .preference-options button:not([aria-pressed="true"]):hover { background: var(--surface-hover); }
}
@media (max-width: 600px) {
  .display-preferences > summary { padding-inline: 7px; gap: 5px; font-size: 13px; }
  .preference-current { padding-left: 5px; }
  .workspace-header .preference-current { display: none; }
}
