:root,:host{
  color-scheme:light;
  --ff-bg:#fafaf8;--ff-surface:#fff;--ff-text:#262623;--ff-muted:#65655d;--ff-subtle:#707067;
  --ff-border:#dcdcd3;--ff-divider:#e8e8e1;--ff-hover:#f2f1ec;--ff-preview:#e8e8e2;
  --ff-accent:#f2a33a;--ff-accent-hover:#e4962d;--ff-accent-edge:#a76314;--ff-accent-text:#8b5010;
  --ff-accent-soft:#fff0d9;--ff-selection:#f2a33a1f;--ff-focus:#a76314;--ff-on-accent:#281b0b;
  --ff-switch:#b9b9af;--ff-knob:#fff;--ff-header:#fafaf8ed;--ff-footer:#fafaf8f7;
  --ff-key-base:#b9b9af;--ff-badge:#4a4742;--ff-on-badge:#fff;
  --ff-danger:#9a3d38;--ff-danger-border:#ddb6af;--ff-danger-bg:#f9eae7;--ff-backdrop:#10100d70;
  --ff-shadow:0 12px 40px #18181130;--ff-crop:#f2af4a;
  --ff-overlay:#1d1d1bcc;--ff-overlay-hover:#30302ee8;--ff-overlay-border:#ffffff30;
  --ff-overlay-text:#f5f5f1;--ff-overlay-accent:#f2af4a;--ff-toast:#292925f5;--ff-toast-error:#8d3530f5;
  --ff-radius-xs:4px;--ff-radius-sm:6px;--ff-radius-control:10px;--ff-radius-card:10px;--ff-radius-dialog:14px;
  --ff-text-sm:12px;--ff-text-md:13px;--ff-text-button:13px;--ff-text-lg:15px;--ff-text-xl:18px;
  --ff-control-h:36px;--ff-control-h-sm:28px;
  --ff-card-capture:#fff0d9;--ff-card-import:#fff;--ff-card-import-edge:#c4c3b8;--ff-player:#33312d;--ff-player-edge:#33312d;--ff-player-line:#3d3a35;--ff-player-line-2:#37342f;--ff-player-text:#fafaf8;
  --ff-photo:#fff;--ff-photo-back:#f2f1ec;--ff-photo-edge:#c4c3b8;
  --ff-shade:#0009;--ff-on-toast:#ffffff1f;--ff-on-toast-hover:#ffffff33;--ff-panel-toast:#292925f5;--ff-panel-toast-error:#8d3530f5;--ff-panel-toast-shadow:0 4px 18px #00000030;
}
:root[data-theme="dark"],:host([data-theme="dark"]){
  color-scheme:dark;
  --ff-bg:#171716;--ff-surface:#232321;--ff-text:#f5f5f1;--ff-muted:#b9b9b0;--ff-subtle:#b2b2a7;
  --ff-border:#414139;--ff-divider:#363630;--ff-hover:#2d2d29;--ff-preview:#121211;
  --ff-accent:#f2af4a;--ff-accent-hover:#f6bc65;--ff-accent-edge:#f2af4a;--ff-accent-text:#f2af4a;
  --ff-accent-soft:#382b1a;--ff-selection:#f2af4a24;--ff-focus:#f2af4a;
  --ff-switch:#66665c;--ff-header:#171716ed;--ff-footer:#171716f7;
  --ff-key-base:#121211;--ff-badge:#d9d5cd;--ff-on-badge:#1b1b1a;
  --ff-danger:#f2ada5;--ff-danger-border:#82504a;--ff-danger-bg:#412421;--ff-backdrop:#0008;
  --ff-shadow:0 12px 40px #0006;--ff-shade:#000b;
  --ff-card-capture:#232321;--ff-card-import:transparent;--ff-card-import-edge:#414139;--ff-player:#3a3a35;--ff-player-edge:#4a4a42;--ff-player-line:#33332e;--ff-player-line-2:#2d2d29;--ff-player-text:#d9d5cd;
  --ff-photo:#232321;--ff-photo-back:#1d1d1b;--ff-photo-edge:#4a4a42;
  --ff-panel-toast:#3a3a35f5;--ff-panel-toast-error:#9a3a34f5;--ff-panel-toast-shadow:0 0 0 1px #ffffff14,0 4px 18px #0006;
}
@media(prefers-color-scheme:dark){
  :root:not([data-theme="light"]),:host(:not([data-theme="light"])){
    color-scheme:dark;
    --ff-bg:#171716;--ff-surface:#232321;--ff-text:#f5f5f1;--ff-muted:#b9b9b0;--ff-subtle:#b2b2a7;
    --ff-border:#414139;--ff-divider:#363630;--ff-hover:#2d2d29;--ff-preview:#121211;
    --ff-accent:#f2af4a;--ff-accent-hover:#f6bc65;--ff-accent-edge:#f2af4a;--ff-accent-text:#f2af4a;
    --ff-accent-soft:#382b1a;--ff-selection:#f2af4a24;--ff-focus:#f2af4a;
    --ff-switch:#66665c;--ff-header:#171716ed;--ff-footer:#171716f7;
    --ff-key-base:#121211;--ff-badge:#d9d5cd;--ff-on-badge:#1b1b1a;
    --ff-danger:#f2ada5;--ff-danger-border:#82504a;--ff-danger-bg:#412421;--ff-backdrop:#0008;
    --ff-shadow:0 12px 40px #0006;--ff-shade:#000b;
  --ff-card-capture:#232321;--ff-card-import:transparent;--ff-card-import-edge:#414139;--ff-player:#3a3a35;--ff-player-edge:#4a4a42;--ff-player-line:#33332e;--ff-player-line-2:#2d2d29;--ff-player-text:#d9d5cd;
  --ff-photo:#232321;--ff-photo-back:#1d1d1b;--ff-photo-edge:#4a4a42;
  --ff-panel-toast:#3a3a35f5;--ff-panel-toast-error:#9a3a34f5;--ff-panel-toast-shadow:0 0 0 1px #ffffff14,0 4px 18px #0006;
  }
}
kbd{
  display:inline-block;padding:2px 7px;border:1px solid var(--ff-switch);border-radius:var(--ff-radius-sm);
  background:var(--ff-hover);color:var(--ff-text);box-shadow:0 3px 0 var(--ff-key-base);
  font:inherit;font-weight:600;line-height:1.25;white-space:nowrap;vertical-align:baseline;
}
