:root {
  color-scheme: light dark;
  --fk-accent: #176a59;
  --fk-surface: #f7f8f3;
  --fk-panel: #fff;
  --fk-text: #202b28;
  --fk-muted: #54665f;
  --fk-border: #cad4cc;
  --fk-radius: 10px;
  --fk-font: system-ui, sans-serif;
  --fk-space: 12px;
  --fk-target: 44px;
}
* { box-sizing: border-box; }
body { margin: 0; color: var(--fk-text); background: var(--fk-surface); font-family: var(--fk-font); padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left); }
[hidden] { display: none !important; }
button, input, textarea, select { font: inherit; color: inherit; max-width: 100%; }
button, input, select, summary { min-height: var(--fk-target); }
button, .fk-header a, .fk-dialog a { padding: 10px 14px; }
button { cursor: pointer; border: 1px solid var(--fk-border); border-radius: var(--fk-radius); background: var(--fk-panel); }
button:hover { border-color: var(--fk-accent); }
button:disabled { opacity: .65; cursor: default; }
a { color: var(--fk-accent); text-underline-offset: 3px; overflow-wrap: anywhere; }
:focus-visible { outline: 3px solid var(--fk-accent); outline-offset: 3px; }
.fk-header { display: flex; align-items: center; justify-content: space-between; gap: var(--fk-space); padding: 14px 24px; border-bottom: 1px solid var(--fk-border); }
.fk-brand { font-weight: 750; text-decoration: none; white-space: nowrap; }
.fk-nav, .fk-toolbar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.fk-nav a { display: inline-flex; min-height: var(--fk-target); align-items: center; }
.fk-toolbar { padding: var(--fk-space) 24px; }
.fk-status { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px; padding: 12px 24px; color: var(--fk-muted); font-size: .85rem; }
.fk-workspace { display: grid; grid-template-columns: 1fr 1fr; min-width: 0; }
.fk-workspace > * { min-width: 0; }
.fk-tabs { display: flex; gap: 8px; padding: 8px 16px; grid-column: 1 / -1; }
.fk-tabs button { flex: 1; }
.fk-tabs [aria-selected="true"] { color: var(--fk-accent); border-color: var(--fk-accent); font-weight: bold; }
.fk-dialog, .draft-recovery { width: min(640px, calc(100% - 32px)); max-height: calc(100dvh - 32px); overflow: auto; padding: 24px; border: 1px solid var(--fk-border); border-radius: var(--fk-radius); color: var(--fk-text); background: var(--fk-panel); }
dialog::backdrop { background: #102a2370; }
.fk-dialog h2 { margin-top: 0; }
.fk-dialog-body { display: flex; flex-wrap: wrap; gap: 12px; min-width: 0; }
.fk-dialog-body > p, .fk-dialog-body > textarea, .fk-dialog-body > .fk-qr, .fk-dialog-body > .fk-scanned, .fk-dialog-body > video { width: 100%; }
.fk-dialog-body label { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.fk-dialog-body pre, .draft-recovery pre { white-space: pre-wrap; overflow-wrap: anywhere; max-height: 35vh; overflow: auto; }
.fk-close { margin-top: 24px; }
#fk-more-drawer .fk-dialog-body { flex-direction: column; align-items: stretch; }
.fk-qr { text-align: center; }
.fk-qr svg { display: block; max-width: 100%; height: auto; margin: auto; width: 360px; }
.fk-dialog video { max-height: 40vh; object-fit: contain; }
.draft-recovery > * { max-width: 100%; }
.draft-recovery button { margin: 8px 8px 0 0; }
@media (max-width: 767px) {
  .fk-nav, .fk-mobile-extra { display: none; }
  .fk-header { padding: 8px 12px; }
  .fk-toolbar { padding: 8px 12px; }
  .fk-workspace { display: flex; flex-direction: column; }
  .fk-status { padding: 8px 12px; }
}
@media (max-width: 599px) {
  .fk-dialog, .draft-recovery { width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; border: 0; border-radius: 0; padding: max(20px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(20px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left)); }
}
@media (prefers-color-scheme: dark) {
  :root { --fk-accent: #8bd8bf; --fk-surface: #15211e; --fk-panel: #1d2d27; --fk-text: #e1eee7; --fk-muted: #a9bfb3; --fk-border: #3c5549; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; } }