:root {
  color-scheme: light dark;
  font-family: Inter, "IBM Plex Sans", -apple-system, BlinkMacSystemFont, "Segoe UI",
    "PingFang SC", "PingFang TC", "Hiragino Sans GB", "Yu Gothic UI", Meiryo,
    "Microsoft YaHei", "Microsoft JhengHei", "Noto Sans CJK SC", "Noto Sans CJK TC",
    "Noto Sans CJK JP", "Noto Sans CJK KR", "DejaVu Sans", system-ui, "Apple Color Emoji",
    "Segoe UI Emoji", "Noto Color Emoji", sans-serif;
  line-height: 1.55;
  font-synthesis: none;
  --kr-paper: #f6f8fa;
  --kr-surface: #ffffff;
  --kr-surface-muted: #edf2f6;
  --kr-ink: #17202a;
  --kr-muted: #667085;
  --kr-border: #d7dee8;
  --kr-blue: #1f5d8c;
  --kr-navy: #102033;
  --kr-cyan: #2ea7c9;
  --kr-green: #4e8a5a;
  --kr-red: #b6423c;
  --kr-heading: #102033;
  --kr-primary-bg: #102033;
  --kr-primary-fg: #ffffff;
  --kr-on-dark: #ffffff;
  --kr-focus: #1f5d8c;
  --kr-divider: var(--kr-border);
  --kr-shadow-content: 0 1px 2px rgb(16 32 51 / 0.04);
  --kr-shadow-glass: 0 12px 32px rgb(16 32 51 / 0.12);
  --kr-shadow-overlay: 0 24px 64px rgb(16 32 51 / 0.2);
  --kr-shadow: var(--kr-shadow-content);
  --kr-glass-regular-bg: color-mix(in srgb, var(--kr-surface) 86%, transparent);
  --kr-glass-clear-bg: color-mix(in srgb, var(--kr-surface) 72%, transparent);
  --kr-glass-solid-bg: var(--kr-surface);
  --kr-glass-border: color-mix(in srgb, var(--kr-border) 76%, transparent);
  --kr-glass-filter: blur(18px) saturate(1.08);
  --kr-radius-sm: 4px;
  --kr-radius: 8px;
  --kr-sidebar-width: 14.5rem;
  --kr-content-width: 78rem;
  --kr-mono: "IBM Plex Mono", "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
}

* { box-sizing: border-box; }

[hidden] { display: none !important; }

html { min-width: 20rem; background: var(--kr-paper); }

body {
  min-height: 100vh;
  margin: 0;
  color: var(--kr-ink);
  background-color: var(--kr-paper);
  background-image:
    linear-gradient(rgb(31 93 140 / 0.018) 1px, transparent 1px),
    linear-gradient(90deg, rgb(31 93 140 / 0.018) 1px, transparent 1px);
  background-size: 96px 96px;
}

body[data-kr-audience="public"] { --kr-boundary-label: "Öffentlich"; }
body[data-kr-audience="participant"] { --kr-boundary-label: "Teilnehmerbereich"; }
body[data-kr-audience="administration"] { --kr-boundary-label: "Administration"; }

button, input, select, textarea { font: inherit; }

button,
[role="button"],
a,
label[for] { touch-action: manipulation; }

button,
input:not([type="checkbox"]):not([type="radio"]),
select,
textarea { min-height: 44px; }

a { color: var(--kr-blue); text-underline-offset: 0.18em; }
a:hover { text-decoration-thickness: 0.12em; }

h1, h2, h3, h4, p, li, dt, dd, summary, legend {
  overflow-wrap: anywhere;
}

h1, h2, h3, h4 {
  color: var(--kr-heading);
  line-height: 1.15;
  text-wrap: balance;
}

:focus-visible {
  outline: 3px solid var(--kr-focus);
  outline-offset: 3px;
}

.skip-link {
  position: fixed;
  inset: 0 auto auto 1rem;
  z-index: 100;
  padding: 0.75rem 1rem;
  border-radius: 0 0 var(--kr-radius-sm) var(--kr-radius-sm);
  color: var(--kr-on-dark);
  background: color-mix(in srgb, var(--kr-navy) 96%, transparent);
  backdrop-filter: var(--kr-glass-filter);
  font-weight: 750;
  transform: translateY(-120%);
}

.skip-link:focus { transform: translateY(0); }

.kr-shell {
  display: grid;
  grid-template-columns: var(--kr-sidebar-width) minmax(0, 1fr);
  min-height: 100vh;
}

.kr-sidebar {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  min-height: 100vh;
  max-height: 100vh;
  flex-direction: column;
  padding: 1.35rem 1rem;
  overflow-y: auto;
  border-inline-end: 1px solid rgb(255 255 255 / 0.12);
  color: var(--kr-on-dark);
  background: var(--kr-navy);
}

.kr-brand {
  display: grid;
  grid-template-columns: 2.75rem minmax(0, 1fr);
  gap: 0.7rem;
  align-items: center;
  min-height: 3.4rem;
  padding: 0.3rem 0.45rem;
  color: var(--kr-on-dark);
  text-decoration: none;
}

.kr-topbar a {
  display: inline-flex;
  min-width: 44px;
  min-height: 44px;
  align-items: center;
}

.kr-brand-mark {
  display: grid;
  width: 2.6rem;
  height: 2.75rem;
  place-items: center;
  overflow: hidden;
  border-radius: var(--kr-radius-sm);
  background: var(--kr-surface);
}

.kr-brand-mark svg {
  width: 2.8rem;
  height: 2.8rem;
}

.kr-product-name { display: block; font-size: 0.98rem; letter-spacing: 0.01em; }
.kr-product-context { display: block; color: rgb(255 255 255 / 0.68); font-size: 0.72rem; }

.kr-primary-nav {
  display: grid;
  gap: 0.28rem;
  margin-top: 2.2rem;
}

.kr-primary-nav a {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.6rem;
  align-items: center;
  min-width: 44px;
  min-height: 2.8rem;
  padding: 0.55rem 0.7rem;
  border-radius: var(--kr-radius-sm);
  color: rgb(255 255 255 / 0.7);
  font-size: 0.9rem;
  font-weight: 650;
  text-decoration: none;
}

.kr-primary-nav a::before {
  display: none;
  color: var(--kr-blue);
  font-family: var(--kr-mono);
  font-size: 0.68rem;
  content: attr(data-index);
}

.kr-primary-nav a:hover { color: var(--kr-on-dark); background: rgb(255 255 255 / 0.08); }

.kr-primary-nav a[aria-current="page"] {
  color: var(--kr-on-dark);
  background: rgb(255 255 255 / 0.12);
}

.kr-live-link { align-content: center; }

.kr-live-indicator {
  display: inline-flex;
  gap: 0.4rem;
  align-items: center;
  color: rgb(255 255 255 / 0.72);
  font-family: var(--kr-mono);
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.kr-live-indicator::before {
  width: 0.55rem;
  height: 0.55rem;
  flex: 0 0 auto;
  border: 1px solid rgb(255 255 255 / 0.75);
  border-radius: var(--kr-radius-sm);
  background: var(--kr-green);
  content: "";
}

.kr-primary-nav a[aria-current="page"]::after {
  position: absolute;
  inset: 0 auto 0 -1rem;
  width: 3px;
  background: var(--kr-blue);
  content: "";
}

.kr-sidebar-note {
  margin: auto 0.45rem 0;
  padding-top: 1.5rem;
  color: rgb(255 255 255 / 0.58);
  font-family: var(--kr-mono);
  font-size: 0.66rem;
  letter-spacing: 0.035em;
  text-transform: uppercase;
}

.kr-boundary-badge {
  display: inline-flex;
  min-height: 2rem;
  align-items: center;
  padding: 0.3rem 0.65rem;
  border: 1px solid var(--kr-border);
  border-radius: var(--kr-radius-sm);
  color: var(--kr-muted);
  font-family: var(--kr-mono);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.kr-workspace { min-width: 0; }

.kr-topbar {
  display: flex;
  min-height: 4rem;
  align-items: center;
  justify-content: space-between;
  padding: 0.75rem clamp(1.25rem, 3vw, 3rem);
  border-bottom: 1px solid var(--kr-glass-border);
  background: var(--kr-glass-regular-bg);
  backdrop-filter: var(--kr-glass-filter);
}

.kr-topbar-title { margin: 0; color: var(--kr-muted); font-size: 0.82rem; }
.kr-topbar a { color: var(--kr-ink); font-size: 0.82rem; font-weight: 700; }

.kr-page {
  width: min(100%, var(--kr-content-width));
  margin-inline: auto;
  padding: clamp(2rem, 5vw, 4.75rem) clamp(1.25rem, 4vw, 4rem) 5rem;
}

.kr-page-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1.5rem 3rem;
  align-items: end;
  margin-bottom: clamp(2rem, 5vw, 4rem);
}

.kr-page-meta {
  margin: 0 0 0.7rem;
  color: var(--kr-blue);
  font-family: var(--kr-mono);
  font-size: 0.69rem;
  font-weight: 750;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.kr-page h1 {
  max-width: 18ch;
  margin: 0;
  font-size: 2.85rem;
}

.kr-lead {
  max-width: 46rem;
  margin: 1rem 0 0;
  color: var(--kr-muted);
  font-size: 1.08rem;
}

.kr-section-head {
  display: flex;
  gap: 1rem;
  align-items: end;
  justify-content: space-between;
  margin-bottom: 1rem;
  padding-bottom: 0.85rem;
  border-bottom: 1px solid var(--kr-border);
}

.kr-section-head h2 { margin: 0; font-size: 1.55rem; }

.kr-status {
  min-height: 1.6em;
  margin: 0 0 1rem;
  color: var(--kr-muted);
  font-size: 0.88rem;
}

.kr-card {
  border: 1px solid var(--kr-border);
  border-radius: var(--kr-radius);
  background: var(--kr-surface);
}

.kr-button,
button.kr-button {
  display: inline-flex;
  min-width: 44px;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  padding: 0.65rem 1rem;
  border: 1px solid var(--kr-primary-bg);
  border-radius: var(--kr-radius-sm);
  color: var(--kr-primary-fg);
  background: var(--kr-primary-bg);
  font: inherit;
  font-weight: 750;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}

.kr-button-secondary,
button.kr-button-secondary {
  color: var(--kr-blue);
  border-color: var(--kr-border);
  background: transparent;
}

.kr-button:hover { text-decoration: underline; text-underline-offset: 0.18em; }
.kr-button,
button { transition: transform 100ms ease-out; }
.kr-button:active,
button:active { transform: translateY(1px); }
.kr-button:disabled { cursor: wait; opacity: 0.62; }

.kr-progress,
progress {
  width: 100%;
  min-height: 0.65rem;
  accent-color: var(--kr-blue);
}

.kr-mono { font-family: var(--kr-mono); }

@media (max-width: 64rem) {
  .kr-shell { grid-template-columns: 1fr; }
  .kr-sidebar {
    position: relative;
    display: grid;
    min-height: auto;
    max-height: none;
    grid-template-columns: minmax(11rem, auto) minmax(0, 1fr);
    gap: 1rem;
    align-items: center;
    padding: 0.75rem 1.25rem;
    overflow: visible;
    border-inline-end: 0;
    border-bottom: 1px solid rgb(255 255 255 / 0.12);
  }
  .kr-brand { max-width: 14rem; }
  .kr-primary-nav {
    display: flex;
    justify-content: flex-start;
    margin: 0;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: inline mandatory;
    scrollbar-width: thin;
  }
  .kr-primary-nav a {
    flex: 0 0 auto;
    padding-inline: 0.75rem;
    scroll-snap-align: start;
    text-align: center;
    white-space: nowrap;
  }
  .kr-live-link { grid-template-columns: auto auto; }
  .kr-live-indicator { font-size: 0; }
  .kr-primary-nav a::before, .kr-sidebar-note { display: none; }
  .kr-primary-nav a[aria-current="page"]::after {
    inset: auto 0 -0.75rem;
    width: auto;
    height: 3px;
  }
}

@media (max-width: 40rem) {
  .kr-sidebar { grid-template-columns: 1fr; gap: 0.5rem; padding: 0.65rem 1rem 0.75rem; background: var(--kr-navy); backdrop-filter: none; }
  .kr-brand { grid-template-columns: 2.2rem 1fr; min-height: 44px; padding: 0; }
  .kr-brand-mark { width: 2rem; height: 2.2rem; }
  .kr-brand-mark svg { width: 2.2rem; height: 2.2rem; }
  .kr-primary-nav {
    position: static;
    display: flex;
    gap: 0.25rem;
    padding: 0.35rem 0 0;
    border-top: 1px solid rgb(255 255 255 / 0.12);
    background: transparent;
  }
  .kr-primary-nav a { min-height: 3rem; padding: 0.45rem 0.7rem; font-size: 0.78rem; }
  .kr-primary-nav a[aria-current="page"]::after { inset: auto 0 -0.75rem; width: auto; height: 3px; }
  .kr-topbar { min-height: 3.25rem; padding: 0.6rem 1rem; background: var(--kr-glass-solid-bg); backdrop-filter: none; }
  .kr-topbar-title { max-width: 18ch; }
  .kr-page { padding: 2rem 1rem 3.5rem; }
  .kr-page-header { display: block; margin-bottom: 2.4rem; }
  .kr-page h1 { font-size: 2rem; }
  .kr-page-header > .kr-button { width: 100%; margin-top: 1.25rem; }
  .kr-section-head { display: grid; grid-template-columns: 1fr; align-items: start; }
}

@media (prefers-color-scheme: dark) {
  :root {
    --kr-paper: #111820;
    --kr-surface: #18222d;
    --kr-surface-muted: #202c38;
    --kr-ink: #f3f6f8;
    --kr-muted: #a6b0bd;
    --kr-border: #32404f;
    --kr-blue: #5aa4d9;
    --kr-navy: #0b1622;
    --kr-cyan: #66c8df;
    --kr-green: #77b582;
    --kr-red: #dd746d;
    --kr-heading: #f3f6f8;
    --kr-primary-bg: #f3f6f8;
    --kr-primary-fg: #111820;
    --kr-focus: #66c8df;
    --kr-shadow-content: 0 1px 2px rgb(0 0 0 / 0.16);
    --kr-shadow-glass: 0 12px 32px rgb(0 0 0 / 0.28);
    --kr-shadow-overlay: 0 24px 64px rgb(0 0 0 / 0.42);
    --kr-shadow: var(--kr-shadow-content);
  }
  .kr-brand-mark { filter: none; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}

@media (prefers-reduced-transparency: reduce) {
  :root {
    --kr-glass-regular-bg: var(--kr-surface);
    --kr-glass-clear-bg: var(--kr-surface);
    --kr-glass-filter: none;
  }
  .kr-sidebar { background: var(--kr-navy); backdrop-filter: none; }
  .kr-topbar { background: var(--kr-paper); backdrop-filter: none; }
}

@supports not (backdrop-filter: blur(1px)) {
  .kr-sidebar { background: var(--kr-navy); }
  .kr-topbar { background: var(--kr-paper); }
}

@media (forced-colors: active) {
  .kr-sidebar, .kr-topbar, .kr-card, .kr-button { border: 1px solid CanvasText; }
  .kr-primary-nav a[aria-current="page"] { outline: 2px solid Highlight; }
  .kr-brand-mark { filter: none; }
  .kr-sidebar, .kr-topbar { background: Canvas; backdrop-filter: none; }
  :focus-visible { outline-color: Highlight; }
}

.kr-function-hint {
  grid-column: 1 / -1;
  box-sizing: border-box;
  margin: 0 0 1rem;
  padding: 1rem;
  border: 1px solid currentColor;
  border-radius: 0.5rem;
  line-height: 1.5;
}

.anonymous-live .kr-shell { grid-template-columns: minmax(0, 1fr); }
.anonymous-live .kr-sidebar,
.anonymous-live .kr-topbar,
.anonymous-live .journey-details { display: none; }
.anonymous-live .kr-workspace,
.anonymous-live .kr-page { min-width: 0; }
.anonymous-live .kr-page { width: min(100%, 110rem); margin-inline: auto; padding-inline: clamp(1rem, 3vw, 2.5rem); }
.anonymous-live #join-panel { width: min(100%, 42rem); margin: clamp(1rem, 8vh, 5rem) auto; }
html[data-join-mode="qr"] .anonymous-live .page-heading { display: none; }
.participant-secondary { margin-top: 1rem; border-top: 1px solid var(--kr-border); border-bottom: 1px solid var(--kr-border); background: var(--kr-surface); }
.participant-secondary > summary { display: flex; min-height: 44px; align-items: center; padding: 0.8rem 0; color: var(--kr-blue); font-weight: 750; cursor: pointer; }
.participant-secondary-content { display: grid; gap: 1rem; padding: 0 0 1rem; }
.secondary-section { padding: 1rem; border: 1px solid var(--kr-border); border-radius: var(--kr-radius-sm); }
.secondary-section h2 { margin-top: 0; }
.session-end { grid-column: 1 / -1; }
.page-heading { margin-bottom: 1.5rem; }
.page-heading h1 { margin-bottom: 0.75rem; }
.eyebrow { color: var(--kr-blue); font-family: var(--kr-mono); font-size: 0.75rem; font-weight: 750; letter-spacing: 0.08em; text-transform: uppercase; }
.lead, .hint { color: var(--kr-muted); }
.journey-details { margin: 0 0 1rem; border-top: 1px solid var(--kr-border); border-bottom: 1px solid var(--kr-border); }
.journey-details > summary { display: flex; min-height: 44px; align-items: center; color: var(--kr-blue); font-weight: 750; cursor: pointer; }
.journey-details[open] > summary { border-bottom: 1px solid var(--kr-border); }
.journey-status { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; border: 0; background: var(--kr-surface); }
.journey-status div { min-width: 0; padding: 0.85rem; border-inline-end: 1px solid var(--kr-border); }
.journey-status div:last-child { border-inline-end: 0; }
.journey-status dt { color: var(--kr-muted); font-family: var(--kr-mono); font-size: 0.68rem; text-transform: uppercase; }
.journey-status dd { margin: 0.25rem 0 0; color: var(--kr-heading); font-weight: 750; overflow-wrap: anywhere; }
.global-status { min-height: 1.6rem; margin: 0 0 1rem; color: var(--kr-muted); }
.global-status[data-kind="error"] { color: var(--kr-red); }
.global-status[data-kind="success"] { color: var(--kr-success-text, #356840); }
.panel { margin-bottom: 1rem; padding: 1.25rem; border: 1px solid var(--kr-border); border-radius: var(--kr-radius); background: var(--kr-surface); box-shadow: var(--kr-shadow); }
.panel h2 { margin-top: 0; }
.section-heading { display: flex; flex-wrap: wrap; gap: 0.75rem; align-items: center; justify-content: space-between; }
.section-heading h2 { margin-bottom: 0; }
.badge { margin: 0; padding: 0.3rem 0.65rem; border-radius: var(--kr-radius-sm); color: var(--kr-blue); background: var(--kr-surface-muted); font-weight: 750; }
.workspace { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.workspace[data-current-activity="content"] .delivery-grid,
.workspace[data-current-activity="waiting"] .delivery-grid,
.workspace[data-current-activity-surface="presentation"]:not([data-current-activity="content"]):not([data-current-activity="waiting"]):not([data-current-activity="paused"]):not([data-current-activity="ended"]) .presentation-history-control { display: none; }
.workspace[data-current-activity-surface="presentation"]:not([data-current-activity="content"]):not([data-current-activity="waiting"]) .presentation-toolbar { grid-template-columns: 1fr; }
.workspace[data-current-activity-surface="presentation"]:not([data-current-activity="content"]):not([data-current-activity="waiting"]):not([data-current-activity="paused"]):not([data-current-activity="ended"]) .delivery-grid { grid-template-columns: 1fr; }
.workspace[data-current-activity-surface="presentation"]:not([data-current-activity="content"]):not([data-current-activity="waiting"]):not([data-current-activity="paused"]):not([data-current-activity="ended"]) .participant-script { border-bottom: 1px solid var(--kr-border); }
.workspace[data-current-activity-surface="presentation"]:not([data-current-activity="content"]):not([data-current-activity="waiting"]):not([data-current-activity="paused"]):not([data-current-activity="ended"]) .participant-interaction { border-left: 0; }
.workspace .panel { margin: 0; }
.presentation-shell { position: relative; grid-column: 1 / -1; overflow: hidden; border: 1px solid var(--kr-border); border-radius: var(--kr-radius); background: var(--kr-surface); box-shadow: var(--kr-shadow); }
.presentation-toolbar { display: grid; grid-template-columns: minmax(0, 1fr) minmax(15rem, 22rem); gap: 1.5rem; align-items: end; padding: 1.25rem; border-bottom: 1px solid var(--kr-border); }
.presentation-toolbar h2 { margin: 0.25rem 0 0; }
.presentation-toolbar p { margin-bottom: 0; }
.presentation-history-control { display: grid; gap: 0.5rem; }
.presentation-view-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
.participant-pause-notice { position: absolute; z-index: 4; top: clamp(6rem, 15%, 9rem); left: 50%; width: max-content; max-width: calc(100% - 2rem); margin: 0; padding: .75rem 1rem; transform: translateX(-50%); border: 1px solid var(--kr-glass-border); border-inline-start: 3px solid var(--kr-blue); border-radius: var(--kr-radius-sm); color: var(--kr-heading); background: var(--kr-glass-regular-bg); box-shadow: var(--kr-shadow-glass); backdrop-filter: var(--kr-glass-filter); font-weight: 750; text-align: center; }
.participant-pause-notice[hidden] { display: none !important; }
.participant-artifact-stage { display: grid; place-items: center; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; background: var(--kr-paper); }
.participant-artifact { width: 100%; height: 100%; border: 0; background: var(--kr-paper); }
.participant-artifact-stage > .hint { padding: 1.5rem; text-align: center; }
.presentation-shell:fullscreen { display: grid; grid-template-rows: auto minmax(0, 1fr); width: 100vw; height: 100vh; border: 0; border-radius: 0; background: var(--kr-paper); }
.presentation-shell:fullscreen .presentation-toolbar { position: relative; z-index: 3; grid-template-columns: minmax(0, 1fr) auto; gap: 1rem; align-items: center; margin: .5rem; padding: .55rem .75rem; border: 1px solid var(--kr-glass-border); border-radius: var(--kr-radius-sm); background: var(--kr-glass-regular-bg); box-shadow: var(--kr-shadow-content); backdrop-filter: var(--kr-glass-filter); }
.presentation-shell:fullscreen .presentation-toolbar .eyebrow,
.presentation-shell:fullscreen #presentation-state,
.presentation-shell:fullscreen .presentation-history-control > label { display: none; }
.presentation-shell:fullscreen .presentation-toolbar h2 { margin: 0; font-size: clamp(1rem, 2vw, 1.35rem); }
.presentation-shell:fullscreen .presentation-history-control { display: grid; grid-template-columns: minmax(12rem, 20rem) auto; gap: .5rem; align-items: center; }
.presentation-shell:fullscreen .presentation-view-actions { flex-wrap: nowrap; }
.presentation-shell:fullscreen .participant-artifact-stage { width: 100%; height: 100%; min-height: 0; aspect-ratio: auto; }
.presentation-shell:fullscreen .delivery-grid,
.presentation-shell:fullscreen .shared-results { display: none !important; }
.delivery-grid { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); border-top: 1px solid var(--kr-border); }
.participant-script, .participant-interaction { min-width: 0; padding: 1.25rem; }
.participant-script { background: var(--kr-surface-muted); }
.participant-interaction { border-left: 1px solid var(--kr-border); }
.participant-script h3, .participant-interaction h3 { margin: 0.3rem 0 0.65rem; }
.participant-script p:last-child, .participant-interaction p:last-child { margin-bottom: 0; }
.participant-interaction textarea { margin-top: 0.35rem; }
.participant-interaction #interaction-draft { min-height: clamp(18rem, 42vh, 34rem); line-height: 1.55; }
.editor-toolbar { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.6rem; padding: 0.5rem; border: 1px solid var(--kr-border); border-bottom: 0; border-radius: var(--kr-radius-sm) var(--kr-radius-sm) 0 0; background: var(--kr-surface-muted); }
.editor-toolbar[hidden] { display: none; }
.editor-toolbar .kr-button { min-width: 44px; padding-inline: 0.75rem; }
.editor-toolbar + textarea { margin-top: 0; border-radius: 0 0 var(--kr-radius-sm) var(--kr-radius-sm); }
.editor-preview { min-height: 8rem; margin-top: 0.75rem; padding: 1rem; border: 1px solid var(--kr-border); border-radius: var(--kr-radius-sm); background: var(--kr-surface-muted); }
.editor-preview[hidden] { display: none; }
.editor-preview > :first-child { margin-top: 0; }
.editor-preview > :last-child { margin-bottom: 0; }
.shared-results { padding: clamp(1.25rem, 4vw, 3rem); border-top: 8px solid var(--kr-green); background: var(--kr-surface); }
.shared-results[hidden] { display: none; }
.shared-results header h3 { margin: 0.25rem 0 1rem; font-size: clamp(1.5rem, 3vw, 2.5rem); }
.shared-results-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(22rem, 100%), 1fr)); gap: 1rem; }
.shared-result { padding: 1rem; border: 1px solid var(--kr-border); border-radius: var(--kr-radius-sm); background: var(--kr-surface-muted); }
.shared-result h4 { margin-top: 0; }
.interaction-options { margin: 1rem 0 0; }
.interaction-options > div { display: grid; gap: 0.55rem; margin-top: 0.55rem; }
.interaction-option { display: grid; grid-template-columns: 1.25rem minmax(0, 1fr); gap: 0.7rem; align-items: center; min-height: 44px; padding: 0.7rem 0.8rem; border: 1px solid var(--kr-border); border-radius: var(--kr-radius-sm); background: var(--kr-surface); cursor: pointer; }
.interaction-option:has(input:checked) { border-color: var(--kr-blue); background: var(--kr-surface-muted); }
.interaction-option, #choices label { min-width: 0; overflow-wrap: anywhere; }
.interaction-scale-control { display: grid; gap: 0.65rem; margin-top: 1rem; }
.interaction-scale-control output { color: var(--kr-blue); font-weight: 800; }
.interaction-scale-control input { width: 100%; min-height: 44px; }
.interaction-scale-labels { display: flex; gap: 1rem; justify-content: space-between; color: var(--kr-muted); font-size: 0.9rem; }
.interaction-dynamic-control { display: grid; gap: 0.75rem; margin-top: 1rem; }
.interaction-dynamic-control[hidden] { display: none; }
.interaction-upload-control { display: grid; gap: 0.65rem; margin-top: 1rem; padding: 1rem; border: 1px solid var(--kr-border); border-radius: var(--kr-radius-sm); background: var(--kr-surface-muted); }
.interaction-upload-control[hidden] { display: none; }
.interaction-upload-control p { margin: 0; }
.interaction-mobile-upload { display: grid; gap: 0.65rem; padding-bottom: 1rem; border-bottom: 1px solid var(--kr-border); }
.interaction-mobile-upload[hidden], .interaction-mobile-upload-grant[hidden] { display: none; }
.interaction-mobile-upload h4 { margin: 0; }
.interaction-mobile-upload-grant { display: grid; grid-template-columns: minmax(10rem, 14rem) minmax(0, 1fr); gap: 1rem; align-items: center; }
.interaction-mobile-upload-grant img { display: block; width: 100%; height: auto; border: 1px solid var(--kr-border); background: #fff; }
.interaction-mobile-upload-grant > div { display: grid; gap: 0.75rem; }
.interaction-ranking { display: grid; gap: 0.55rem; margin: 0; padding: 0; list-style: none; }
.interaction-ranking li { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 0.5rem; align-items: center; min-height: 44px; padding: 0.55rem 0.65rem; border: 1px solid var(--kr-border); border-radius: var(--kr-radius-sm); }
.interaction-ranking button { min-width: 44px; min-height: 44px; }
.interaction-structured-fields { display: grid; gap: 0.8rem; }
.interaction-structured-fields > div { display: grid; gap: 0.35rem; }
.interaction-group { margin: 1rem 0; padding: 1rem; border: 1px solid var(--kr-border); border-radius: var(--kr-radius-sm); background: var(--kr-surface-muted); }
.interaction-group-heading { margin: 0 0 0.65rem; color: var(--kr-heading); font-weight: 750; }
.interaction-group ul { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 0 0 0.65rem; padding: 0; list-style: none; }
.interaction-group li { padding: 0.35rem 0.55rem; border: 1px solid var(--kr-border); border-radius: var(--kr-radius-sm); color: var(--kr-heading); background: var(--kr-surface); font-weight: 700; }
.interaction-status { min-height: 1.5rem; margin: 0.65rem 0; color: var(--kr-muted); font-weight: 700; }
.interaction-status[data-kind="dirty"] { color: var(--kr-blue); }
.interaction-status[data-kind="submitted"] { color: var(--kr-success-text, #356840); }
.interaction-sharing { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--kr-border); }
.interaction-sharing h4 { margin: 0 0 0.5rem; }
.interaction-sharing > p { margin: 0 0 0.75rem; }
form, fieldset { display: grid; gap: 0.75rem; }
fieldset { margin: 0; padding: 0; border: 0; }
.feedback-questions { display: grid; gap: 1rem; }
.feedback-questions fieldset { padding-bottom: 1rem; border-bottom: 1px solid var(--kr-border); }
label, legend { color: var(--kr-heading); font-weight: 700; }
input:not([type="radio"]):not([type="checkbox"]), select, textarea { width: 100%; min-height: 44px; padding: 0.65rem 0.75rem; border: 1px solid var(--kr-border); border-radius: var(--kr-radius-sm); color: var(--kr-ink); background: var(--kr-surface); font-size: 1rem; }
input[type="radio"], input[type="checkbox"] { width: 1.25rem; min-width: 1.25rem; height: 1.25rem; min-height: 1.25rem; margin: 0; }
textarea { min-height: 8rem; resize: vertical; }
.scale { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.scale label { display: flex; min-width: 44px; min-height: 44px; gap: 0.3rem; align-items: center; }
.scale input { width: 1.25rem; min-height: 1.25rem; }
.actions { display: flex; flex-wrap: wrap; gap: 0.75rem; }
.guest-profile { display: grid; grid-template-columns: minmax(10rem, 0.7fr) minmax(14rem, 1.3fr); gap: 1rem; }
.material-access-offer { margin: 0 0 1rem; padding: 0.25rem 0; border-top: 1px solid var(--kr-border); border-bottom: 1px solid var(--kr-border); color: var(--kr-muted); }
.material-access-offer summary { display: flex; min-height: 44px; align-items: center; color: var(--kr-blue); font-size: 0.9rem; font-weight: 700; cursor: pointer; }
.material-access-offer[open] summary { margin-bottom: 0.75rem; }
.material-access-offer[open] { padding: 0.75rem 0; }
.material-access-offer form, .material-access-offer > p { max-width: 52rem; }
.material-access-name { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.privacy-note { max-width: 72ch; color: var(--kr-muted); font-size: 0.875rem; }
.privacy-note a { display: inline-flex; min-height: 44px; align-items: center; }
#choices { display: grid; gap: 0.5rem; }
#choices label { display: grid; grid-template-columns: 1.25rem minmax(0, 1fr); gap: 0.65rem; align-items: start; min-height: 44px; padding: 0.65rem 0.75rem; border: 1px solid var(--kr-border); border-radius: var(--kr-radius-sm); cursor: pointer; }
#choices input { margin-top: 0.1rem; }
.quiz-result { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--kr-border); }
.quiz-result h3 { margin-top: 0; }
.quiz-result p { margin-bottom: 0.5rem; }
.own-ranking { color: var(--kr-heading); font-weight: 750; }
@media (max-width: 56rem) { .journey-status { grid-template-columns: repeat(2, minmax(0, 1fr)); } .journey-status div:nth-child(2) { border-inline-end: 0; } .journey-status div:nth-child(-n+2) { border-bottom: 1px solid var(--kr-border); } .workspace, .presentation-toolbar, .delivery-grid { grid-template-columns: 1fr; } .participant-interaction { border-top: 1px solid var(--kr-border); border-left: 0; } }
@media (max-width: 40rem) { .journey-status, .guest-profile, .material-access-name, .interaction-mobile-upload-grant { grid-template-columns: 1fr; } .journey-status div { border-inline-end: 0; border-bottom: 1px solid var(--kr-border); } .actions > *, .panel .kr-button, .presentation-history-control .kr-button { width: 100%; } .editor-toolbar .kr-button { width: auto; flex: 1 1 8rem; } .participant-interaction #interaction-draft { min-height: 22rem; } }
@media (max-width: 40rem) { .presentation-shell:fullscreen .presentation-toolbar { grid-template-columns: 1fr; gap: .5rem; } .presentation-shell:fullscreen .presentation-toolbar > div:first-child { display: none; } .presentation-shell:fullscreen .presentation-history-control { grid-template-columns: minmax(0, 1fr) auto; } .presentation-shell:fullscreen .presentation-history-control .kr-button { width: auto; } }
@media (prefers-reduced-transparency: reduce) { .participant-pause-notice, .presentation-shell:fullscreen .presentation-toolbar { background: var(--kr-glass-solid-bg); backdrop-filter: none; } }
@supports not (backdrop-filter: blur(1px)) { .participant-pause-notice, .presentation-shell:fullscreen .presentation-toolbar { background: var(--kr-glass-solid-bg); } }
@media (forced-colors: active) { .journey-status, .panel, .presentation-shell, .interaction-upload-control, input, select, textarea, .participant-pause-notice { border: 1px solid CanvasText; } .participant-artifact-stage { color: CanvasText; background: Canvas; } }

/* Compact live participation, with content and the current action first. */
.anonymous-live .kr-page{max-width:1280px;padding:30px 38px 64px}.page-heading{margin-bottom:26px}.page-heading h1{font-size:30px;line-height:1.25;font-weight:600;margin:7px 0 10px}.page-heading .lead{font-size:13px;max-width:65ch;line-height:1.7}.eyebrow{font-family:var(--kr-font,Inter,Arial,sans-serif);font-size:10px;font-weight:500;color:var(--kr-muted)}.global-status{font-size:12px}.panel,.presentation-shell,.secondary-section{border-radius:8px;box-shadow:none;background:var(--kr-surface)}.panel{padding:22px}.panel h2{font-size:20px;font-weight:600}.panel>p{font-size:12px;line-height:1.7}.anonymous-live #join-panel{max-width:560px;margin:36px auto 48px}.guest-profile{gap:16px}.panel label,.panel legend{font-size:12px;font-weight:600}.panel input,.panel select{font-size:14px}.hint{font-size:11px;line-height:1.65}.panel .kr-button,.presentation-history-control .kr-button{font-size:12px;font-weight:500}.presentation-toolbar{padding:18px 20px;gap:24px}.presentation-toolbar h2{font-size:20px;line-height:1.4;font-weight:600}.presentation-toolbar label{font-size:11px;font-weight:500}.presentation-state,.participant-secondary>summary{font-size:12px}.presentation-history-control select{font-size:12px;min-height:44px}.presentation-shell{border-color:var(--kr-border)}.participant-artifact-stage{background:var(--kr-surface-muted);border-bottom:1px solid var(--kr-border)}.participant-interaction,.participant-script{padding:22px}.participant-interaction h3,.participant-script h3{font-size:18px;font-weight:600;line-height:1.45}.participant-interaction>p,.participant-script>p{font-size:13px;line-height:1.7}.participant-script{background:var(--kr-surface)}.participant-interaction .actions{gap:10px}.participant-interaction .actions button{font-size:12px;font-weight:500}.participant-interaction #interaction-draft{font-size:14px;line-height:1.65;min-height:260px}.participant-interaction label,.participant-interaction legend{font-size:12px}.interaction-group{background:var(--kr-surface-muted);border:0;border-left:2px solid var(--kr-blue);border-radius:0;padding:14px 16px}.interaction-group p{font-size:12px}.shared-results{padding:22px;border-top:1px solid var(--kr-border)}.shared-results header h3{font-size:20px;font-weight:600}.shared-results-list{gap:16px}.shared-results-list>article{border-radius:6px;box-shadow:none}.shared-results-list p{font-size:13px;line-height:1.7}.participant-secondary{margin-top:28px}.participant-secondary>summary{font-weight:500}.secondary-section{padding:20px;border:0;border-top:1px solid var(--kr-border);border-radius:0}.secondary-section h2{font-size:17px;font-weight:600}.secondary-section>p,.material-access-offer>p{font-size:12px;line-height:1.7}.material-access-offer>summary{min-height:44px;display:flex;align-items:center;font-size:12px;color:var(--kr-blue);cursor:pointer}.feedback-questions legend{font-size:13px;font-weight:500}.scale label{min-width:44px;min-height:44px}.quiz-result{border-radius:6px;box-shadow:none}.participant-pause-notice{font-size:12px;font-weight:500}.badge{font-size:11px;font-weight:500}
@media(max-width:768px){.anonymous-live .kr-page{padding:24px 18px 90px}.page-heading h1{font-size:27px}.anonymous-live #join-panel{margin:24px auto 36px}.panel{padding:18px}.panel h2{font-size:18px}.presentation-toolbar{padding:16px 18px;gap:16px;grid-template-columns:1fr}.presentation-toolbar h2{font-size:18px}.presentation-view-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.presentation-view-actions>.kr-button{width:100%}.participant-interaction,.participant-script{padding:18px}.participant-interaction h3,.participant-script h3{font-size:17px}.participant-interaction #interaction-draft{min-height:240px}.shared-results{padding:18px}.shared-results header h3{font-size:18px}.delivery-grid{grid-template-columns:1fr}.participant-script{border-bottom:1px solid var(--kr-border)}.participant-interaction{border-left:0}.participant-interaction .actions{display:grid;grid-template-columns:1fr}.participant-interaction .actions button{min-height:44px}.secondary-section{padding:18px 0}.participant-secondary-content{padding-bottom:0}.participant-interaction .interaction-mobile-upload-grant{grid-template-columns:1fr}.participant-pause-notice{top:8px}.guest-profile{gap:14px}}
@media(max-width:360px){.anonymous-live .kr-page{padding-inline:16px}.panel{padding:16px}.guest-profile,.material-access-name{grid-template-columns:1fr}.presentation-toolbar,.participant-interaction,.participant-script{padding:16px}.scale{gap:4px}.scale label{min-width:44px}.presentation-view-actions>.kr-button{font-size:11px}.feedback-questions fieldset{padding:12px}}

.interaction-group .hint{color:#596579}

/* Unified role workspace */
:root{color-scheme:light;--kr-paper:#f6f8fa;--kr-surface:#fff;--kr-surface-muted:#edf2f6;--kr-ink:#17202a;--kr-muted:#667085;--kr-border:#d7dee8;--kr-heading:#102033;--kr-blue:#1f5d8c;--kr-green:#4e8a5a;--kr-red:#b6423c;--kr-success-text:#356840;--kr-navy:#102033;--kr-primary-bg:#102033;--kr-primary-fg:#fff;--kr-sidebar-width:232px;--kr-radius:8px}
body[data-kr-audience]{background:var(--kr-surface);color:var(--kr-ink)}
.kr-shell{display:grid;grid-template-columns:var(--kr-sidebar-width) minmax(0,1fr);min-height:100dvh;width:100%;max-width:none;margin:0;gap:0}
.kr-shell .kr-sidebar{position:sticky;top:0;display:flex;flex-direction:column;gap:0;height:100dvh;min-height:100dvh;max-height:100dvh;padding:20px 16px;background:var(--kr-paper);color:var(--kr-ink);border:0;border-right:1px solid var(--kr-border);overflow-y:auto;overflow-x:hidden;box-shadow:none;backdrop-filter:none}
.kr-sidebar .kr-brand{display:flex;align-items:center;gap:12px;min-height:80px;margin:0 0 24px;padding:0;color:var(--kr-navy);background:none;text-decoration:none;white-space:normal}
.kr-sidebar .kr-brand-mark{display:grid;place-items:center;width:62px;height:62px;min-width:62px;padding:14px;overflow:visible;background:transparent;border:0;border-radius:0}
.kr-sidebar .kr-brand-mark svg{width:34px;height:34px;max-width:none;fill:initial}
.kr-product-name{display:block;font-size:20px;font-weight:700;letter-spacing:0;line-height:1.25;color:var(--kr-navy)}
.kr-product-context{display:block;margin-top:4px;font-size:12px;line-height:1.55;color:var(--kr-muted)}
.kr-primary-nav{display:flex;flex-direction:column;gap:4px;min-width:0;border:0;padding:0;margin:0;list-style:none;background:none}
.kr-primary-nav a,.kr-primary-nav button{position:relative;display:flex;align-items:center;justify-content:flex-start;gap:14px;min-width:44px;min-height:48px;width:100%;margin:0;padding:10px 12px;border:0;border-radius:6px;background:transparent;color:var(--kr-muted);font-size:14px;font-weight:500;line-height:1.5;text-decoration:none;text-align:left;white-space:normal}
.kr-primary-nav a::before,.kr-primary-nav button::before{content:none}
.kr-primary-nav a:hover,.kr-primary-nav button:hover{background:var(--kr-surface);color:var(--kr-blue)}
.kr-primary-nav a[aria-current=page]{background:var(--kr-surface);color:var(--kr-blue);box-shadow:inset 3px 0 var(--kr-blue);font-weight:650}
.kr-primary-nav a[aria-current=page]::after{content:none}
.kr-sidebar .kr-live-indicator{color:var(--kr-muted)}
.kr-nav-icon{width:22px;height:22px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.kr-sidebar-note{margin-top:auto;padding-top:24px;font-size:11px;color:var(--kr-muted)}
#kr-sidebar-toggle{display:flex;align-items:center;justify-content:center;align-self:flex-end;flex:none;width:44px;height:44px;min-width:44px;min-height:44px;padding:0;margin:0 0 12px;border:0;background:transparent;color:var(--kr-muted);box-shadow:none}
#kr-sidebar-toggle svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
body.nav-collapsed{--kr-sidebar-width:84px}
body.nav-collapsed .kr-sidebar{padding-inline:10px}
body.nav-collapsed .kr-sidebar .kr-brand{justify-content:center;gap:0}
body.nav-collapsed .kr-sidebar .kr-brand>span:last-child{display:none}
body.nav-collapsed #kr-sidebar-toggle{align-self:center}
body.nav-collapsed #kr-sidebar-toggle svg{transform:rotate(180deg)}
body.nav-collapsed .kr-sidebar .kr-nav-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
body.nav-collapsed .kr-primary-nav a,body.nav-collapsed .kr-primary-nav button{justify-content:center;padding:10px}
body.nav-collapsed .kr-sidebar .kr-primary-nav a:hover .kr-nav-label,body.nav-collapsed .kr-sidebar .kr-primary-nav a:focus-visible .kr-nav-label{position:fixed;left:78px;width:auto;height:auto;overflow:visible;clip-path:none;background:var(--kr-navy);color:#fff;padding:10px 14px;border-radius:4px;z-index:80}
body.nav-collapsed .kr-sidebar-note{font-size:0}
.kr-workspace{min-width:0;background:var(--kr-surface)}
.kr-workspace>.kr-topbar{position:sticky;top:0;z-index:25;display:flex;align-items:center;justify-content:space-between;flex-direction:row;flex-wrap:nowrap;gap:16px;min-height:72px;margin:0;padding:12px 28px;background:var(--kr-surface);color:var(--kr-ink);border:0;border-bottom:1px solid var(--kr-border);box-shadow:none;backdrop-filter:none}
.kr-topbar-title{margin:0;min-width:0;font-size:13px;font-weight:500;color:var(--kr-muted);line-height:1.5}
.kr-top-actions{display:flex;align-items:center;justify-content:flex-end;flex-wrap:nowrap;gap:8px;flex:none;min-width:0}
.kr-top-action{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;width:44px;height:44px;margin:0;padding:10px;background:var(--kr-surface);color:var(--kr-navy);border:1px solid var(--kr-border);border-radius:6px;cursor:pointer}
.kr-top-action svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.kr-account-action{border-radius:50%;width:44px;height:44px;background:var(--kr-paper);font-size:12px;font-weight:650}
.kr-mobile-navigation-open{display:none}
.kr-page,main.kr-page{width:100%;max-width:1120px;min-width:0;margin:0 auto;padding:32px 36px 56px;background:var(--kr-surface);border:0;border-radius:0;box-shadow:none}
.kr-page h1{font-size:32px;line-height:1.2;letter-spacing:0;margin:0 0 14px}
.kr-page h2{font-size:22px;line-height:1.3;letter-spacing:0}
.kr-page h3{font-size:17px;line-height:1.4;letter-spacing:0}
.kr-page-header,.page-heading{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:16px;margin:0 0 28px;padding:0;background:none;border:0;border-radius:0}
.kr-page-meta,.kr-page .eyebrow{font-size:11px;line-height:1.5;letter-spacing:.06em;text-transform:uppercase;color:var(--kr-muted)}
.kr-lead,.kr-page .lead{max-width:68ch;margin:8px 0 0;font-size:15px;line-height:1.65;color:var(--kr-muted)}
.kr-page .panel,.kr-page .card{border:1px solid var(--kr-border);border-radius:8px;background:var(--kr-surface);box-shadow:none;padding:22px;margin-block:20px}
.kr-page .panel>h2:first-child,.kr-page .card>h2:first-child{margin-top:0}
.kr-page button,.kr-page .kr-button{border-radius:6px;min-height:44px;font-size:14px;line-height:1.4;letter-spacing:0}
.kr-page input,.kr-page select,.kr-page textarea{max-width:100%;border:1px solid var(--kr-border);border-radius:6px;background:var(--kr-surface);color:var(--kr-ink);font-size:14px}
.kr-page textarea{line-height:1.6}
.kr-page table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.kr-page th,.kr-page td{padding:14px 12px;text-align:left;vertical-align:top;border-bottom:1px solid var(--kr-border)}
.kr-page details>summary{min-height:44px;padding-block:12px;cursor:pointer;color:var(--kr-blue)}
.kr-page [role=tablist]{display:flex;flex-wrap:wrap;gap:12px;border-bottom:1px solid var(--kr-border)}
.kr-page [role=tab]{border:0;border-bottom:3px solid transparent;border-radius:0;background:transparent;color:var(--kr-muted);padding:12px 8px}
.kr-page [role=tab][aria-selected=true]{color:var(--kr-blue);border-bottom-color:var(--kr-blue)}
.kr-common-dialog{width:min(620px,calc(100% - 24px));max-height:calc(100dvh - 24px);padding:0;overflow:auto;border:1px solid var(--kr-border);border-radius:8px;color:var(--kr-ink);background:var(--kr-surface);box-shadow:0 24px 64px rgb(16 32 51 / .18)}
.kr-common-dialog::backdrop{background:rgb(16 32 51 / .35)}
.kr-common-dialog header{position:sticky;top:0;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 22px;border-bottom:1px solid var(--kr-border);background:var(--kr-surface)}
.kr-common-dialog h2{font-size:20px;margin:0;color:var(--kr-navy)}
.kr-common-dialog button,.kr-common-dialog a{min-height:44px;min-width:44px;border-radius:6px;font-size:14px}
.kr-common-dialog header button{padding:8px 12px;border:1px solid var(--kr-border);background:var(--kr-surface);color:var(--kr-ink)}
.kr-common-dialog-content{padding:22px}
.kr-common-dialog-content p{line-height:1.65;overflow-wrap:anywhere}
.kr-account-links{display:grid;gap:8px;margin:20px 0}
.kr-account-links a{display:flex;align-items:center;padding:10px 12px;border:1px solid var(--kr-border);text-decoration:none}
.kr-common-status{font-size:13px;color:var(--kr-muted)}
.kr-common-dialog .kr-primary{padding:12px 16px;background:var(--kr-navy);color:white;border:1px solid var(--kr-navy)}
.kr-help-log{display:grid;gap:18px;max-height:40dvh;overflow:auto;padding-block:12px;overscroll-behavior:contain}
.kr-help-message{padding-left:12px;border-left:2px solid var(--kr-cyan);font-size:14px}
.kr-help-message-own{border-color:var(--kr-border)}
.kr-help-message small{color:var(--kr-muted);font-size:11px}
.kr-help-message p{margin:4px 0 8px}
.kr-help-suggestions{display:flex;flex-wrap:wrap;gap:8px;padding-block:12px}
.kr-help-suggestions button{padding:10px 12px;background:var(--kr-surface);border:1px solid var(--kr-border);color:var(--kr-blue)}
.kr-help-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;margin-top:16px}
.kr-help-form label{grid-column:1/-1;font-size:13px}
.kr-help-form textarea{width:100%;min-width:0;min-height:70px;padding:10px;border:1px solid var(--kr-border);border-radius:6px;resize:vertical}
#kr-common-navigation .kr-primary-nav{padding:16px}
.kr-motion-reduced *, .kr-motion-reduced *::before,.kr-motion-reduced *::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}
@media(max-width:768px){.kr-shell,body.nav-collapsed .kr-shell{display:block}.kr-shell>.kr-sidebar{display:none}.kr-workspace>.kr-topbar{min-height:64px;gap:8px;padding:10px 16px}.kr-mobile-navigation-open{display:inline-flex}.kr-topbar-title{font-size:12px;flex:1}.kr-top-actions{gap:6px}.kr-page,main.kr-page{padding:24px 16px 40px}.kr-page h1{font-size:27px}.kr-page h2{font-size:20px}.kr-page .panel,.kr-page .card{padding:16px;margin-block:16px}.kr-common-dialog-content{padding:16px}.kr-common-dialog header{padding:14px 16px}.kr-help-form{grid-template-columns:minmax(0,1fr)}.kr-help-form button{justify-self:end}.kr-brand .kr-product-name{font-size:18px}.kr-topbar>.kr-boundary-badge{display:none}}
@media(prefers-reduced-motion:reduce){.kr-shell *,.kr-common-dialog *{scroll-behavior:auto;transition:none;animation:none}}
@media(prefers-reduced-transparency:reduce){.kr-topbar,.kr-sidebar,.kr-common-dialog{backdrop-filter:none;background:var(--kr-surface)}}
@media(forced-colors:active){.kr-primary-nav [aria-current=page]{outline:1px solid Highlight}.kr-top-action,.kr-common-dialog{border:1px solid CanvasText}}

.kr-topbar-title{flex:1;min-width:0}.kr-topbar-back{font-size:12px;flex:none}.kr-help-message details a{display:flex;align-items:center;min-height:44px}.kr-common-dialog summary{min-height:44px;padding-block:12px;cursor:pointer;color:var(--kr-blue)}
@media(max-width:768px){.kr-topbar>.kr-topbar-back{display:none}}

#kr-sidebar-toggle .kr-nav-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}

.kr-common-dialog-content>label{display:flex;align-items:center;gap:10px;min-height:44px}

.kr-workspace .global-status[data-kind="success"],.kr-workspace .status[data-kind="success"]{color:var(--kr-success-text)}