:root {
  color-scheme: dark;
  --ink: #eee7d7;
  --muted: #aaa394;
  --panel: #1b1c21;
  --panel-2: #23242a;
  --line: #3c3c42;
  --gold: #d7af62;
  --gold-bright: #f1d495;
  --red: #913e47;
  --shadow: 0 18px 48px rgba(0, 0, 0, .36);
  --card-w: 2.5in;
  --card-h: 3.5in;
  --paper-content-w: 8in;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: #111216;
  color: var(--ink);
}

* { box-sizing: border-box; }
html { min-height: 100%; background: #111216; }
body {
  min-height: 100vh;
  margin: 0;
  background:
    radial-gradient(circle at 20% -10%, rgba(123, 69, 72, .22), transparent 32rem),
    radial-gradient(circle at 90% 10%, rgba(51, 86, 96, .17), transparent 35rem),
    #111216;
}
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }

.app-header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 2rem;
  padding: 1.4rem clamp(1rem, 3vw, 3rem);
  border-bottom: 1px solid var(--line);
  background: rgba(15, 16, 20, .86);
}
.app-brand { flex: 0 1 auto; }
.header-action { flex: 0 0 auto; }
.app-header h1, .section-heading h2 { margin: 0; font-family: Georgia, "Times New Roman", serif; }
.app-header h1 { font-size: clamp(1.8rem, 3vw, 2.8rem); letter-spacing: -.03em; }
.app-header h1 span { color: var(--gold); font-style: italic; font-weight: 400; }
.eyebrow { margin: 0 0 .28rem; color: var(--gold); font-size: .7rem; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; }
.build-metadata { max-width: 36rem; color: var(--muted); font-size: .78rem; text-align: right; line-height: 1.5; }
.suite-nav { display: flex; flex: 0 0 auto; gap: .35rem; border: 1px solid #3d3e45; border-radius: 10px; padding: .25rem; background: #15161a; }
.suite-nav a { border-radius: 7px; padding: .48rem .68rem; color: #aaa69c; font-size: .72rem; font-weight: 800; text-decoration: none; white-space: nowrap; }
.suite-nav a:hover { color: #f4ead6; background: #25262c; }
.suite-nav a[aria-current="page"] { color: #241a0d; background: linear-gradient(#ebce8c, #be9145); }

.workspace {
  display: grid;
  grid-template-columns: minmax(32rem, 1.25fr) minmax(25rem, .75fr);
  gap: 1rem;
  width: min(1560px, 100%);
  margin: 0 auto;
  padding: 1rem;
}
.library-panel, .preview-panel, .deck-panel, .import-report {
  border: 1px solid var(--line);
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(35, 36, 42, .98), rgba(24, 25, 30, .98));
  box-shadow: var(--shadow);
}
.library-panel { min-width: 0; padding: 1rem; }
.workbench { display: grid; align-content: start; gap: 1rem; min-width: 0; }
.preview-panel, .deck-panel, .import-report { padding: 1rem; }
.section-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.section-heading h2 { font-size: 1.45rem; }
.section-heading.compact { margin-bottom: .75rem; }

.game-scope {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: .55rem;
  margin-bottom: .85rem;
  border: 1px solid #3f4149;
  border-radius: 10px;
  padding: .55rem;
  background: #14151a;
}
.game-default, .sf-toggle { display: flex; align-items: center; gap: .55rem; min-width: 0; border-radius: 8px; padding: .48rem .58rem; }
.game-default { border: 1px solid #5e5037; background: linear-gradient(100deg, rgba(124, 83, 43, .2), rgba(43, 35, 27, .4)); }
.sf-toggle { cursor: pointer; border: 1px solid #285466; color: #d9f9ff; background: linear-gradient(100deg, rgba(23, 89, 110, .22), rgba(25, 31, 42, .52)); }
.sf-toggle:hover { border-color: #49a8c5; }
.game-default > span:last-child, .sf-toggle > span:last-child { display: grid; gap: .1rem; min-width: 0; }
.game-default strong, .sf-toggle strong { color: #f4eddd; font-size: .78rem; letter-spacing: .01em; }
.game-default small, .sf-toggle small { overflow: hidden; color: var(--muted); font-size: .62rem; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.sf-toggle input { position: absolute; width: 1px; min-height: 1px; opacity: 0; pointer-events: none; }
.toggle-track { position: relative; flex: 0 0 auto; width: 2.35rem; height: 1.3rem; border: 1px solid #53616a; border-radius: 99px; background: #252a30; transition: background .18s, border-color .18s; }
.toggle-track span { position: absolute; top: .16rem; left: .17rem; width: .84rem; height: .84rem; border-radius: 50%; background: #858d92; transition: transform .18s, background .18s; }
.sf-toggle input:checked + .toggle-track { border-color: #5fe3ff; background: #155970; box-shadow: 0 0 12px rgba(95, 227, 255, .25); }
.sf-toggle input:checked + .toggle-track span { background: #bcf7ff; transform: translateX(1rem); }
.sf-toggle input:focus-visible + .toggle-track { outline: 2px solid var(--gold-bright); outline-offset: 2px; }
.system-chip, .result-game, .deck-game { display: inline-grid; flex: 0 0 auto; place-items: center; font-family: Inter, ui-sans-serif, sans-serif; font-weight: 900; letter-spacing: .04em; }
.system-chip { width: 2rem; height: 2rem; border-radius: 50%; font-size: .72rem; }
.chip-pf { color: #271b0e; border: 1px solid #f3d28e; background: linear-gradient(145deg, #f0d59d, #a87835); }
.chip-sf { color: #dffcff; border: 1px solid #64d9ef; border-radius: 5px; background: linear-gradient(145deg, #176b88, #272c54); box-shadow: inset 0 0 8px rgba(89, 224, 248, .25); }

.button, .text-button {
  border: 0;
  border-radius: 8px;
  transition: background .15s, color .15s, border-color .15s, transform .1s;
}
.button:active { transform: translateY(1px); }
.button:disabled { cursor: not-allowed; opacity: .45; }
.button { padding: .62rem .85rem; font-size: .84rem; font-weight: 750; }
.button.primary { color: #19140c; background: linear-gradient(#efd28f, #c79b4c); }
.button.primary:hover:not(:disabled) { background: linear-gradient(#f8dfa5, #d9aa54); }
.button.secondary { color: var(--ink); border: 1px solid #6b5a39; background: #312b22; }
.button.secondary:hover:not(:disabled) { border-color: var(--gold); }
.button.ghost { color: var(--ink); border: 1px solid var(--line); background: #202126; }
.button.wide { width: 100%; margin-top: .75rem; }
.text-button { padding: .25rem; color: var(--gold-bright); background: transparent; font-size: .78rem; }
.text-button:hover { color: white; }
.text-button.danger { color: #e68c92; }

label { display: grid; gap: .35rem; color: var(--muted); font-size: .72rem; font-weight: 700; letter-spacing: .03em; }
input, select, textarea {
  width: 100%;
  min-height: 2.35rem;
  border: 1px solid #45464d;
  border-radius: 8px;
  padding: .48rem .65rem;
  color: var(--ink);
  outline: none;
  background: #15161a;
}
textarea { resize: vertical; line-height: 1.45; }
input:focus, select:focus, textarea:focus { border-color: var(--gold); box-shadow: 0 0 0 2px rgba(215, 175, 98, .12); }
.search-field { margin-bottom: .75rem; }
.search-field input { min-height: 2.8rem; font-size: 1rem; }
.filter-drawer > summary { display: none; }
.filters { display: grid; grid-template-columns: repeat(4, minmax(8rem, 1fr)); gap: .6rem; }
.source-filter { grid-column: span 3; }
.check-filter { display: flex; align-items: center; gap: .55rem; align-self: end; min-height: 2.35rem; }
.check-filter input { width: 1rem; min-height: auto; accent-color: var(--gold); }
.result-summary { display: flex; justify-content: space-between; align-items: center; margin: .95rem 0 .55rem; color: var(--muted); font-size: .82rem; }

.results { display: grid; gap: .42rem; }
.result-row {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr) auto;
  gap: .7rem;
  align-items: center;
  min-height: 64px;
  border: 1px solid transparent;
  border-radius: 9px;
  padding: .35rem .45rem;
  background: rgba(11, 12, 15, .52);
}
.result-row:hover, .result-row.selected { border-color: #62573f; background: #242329; }
.result-row.selected { box-shadow: inset 3px 0 var(--gold); }
.result-row.game-sf2e { border-left-color: #245a6c; background: linear-gradient(90deg, rgba(20, 76, 94, .16), rgba(11, 12, 15, .52) 30%); }
.result-row.game-sf2e:hover, .result-row.game-sf2e.selected { border-color: #347d91; background: linear-gradient(90deg, rgba(22, 95, 117, .25), #20232a 34%); }
.result-row.game-sf2e.selected { box-shadow: inset 3px 0 #5eddf3; }
.result-thumb { width: 54px; height: 54px; border-radius: 7px; object-fit: cover; background: #111; }
.result-main { min-width: 0; cursor: pointer; }
.result-title { overflow: hidden; margin-bottom: .15rem; color: #f7f0df; font-family: Georgia, serif; font-size: 1rem; text-overflow: ellipsis; white-space: nowrap; }
.result-game { min-width: 1.55rem; margin-right: .4rem; border-radius: 3px; padding: .1rem .22rem; font-size: .52rem; vertical-align: .13rem; }
.result-game.pf2e { color: #291d10; background: #cba861; }
.result-game.sf2e { color: #e0fbff; border: 1px solid #3d99ae; background: #185b70; }
.result-meta { overflow: hidden; color: var(--muted); font-size: .72rem; text-overflow: ellipsis; white-space: nowrap; }
.result-tags { display: flex; gap: .25rem; margin-top: .28rem; overflow: hidden; }
.tag { display: inline-block; flex: 0 0 auto; border: 1px solid #4a4850; border-radius: 99px; padding: .08rem .38rem; color: #c9c1b1; font-size: .61rem; text-transform: capitalize; }
.result-add { display: flex; width: 2rem; height: 2rem; align-items: center; justify-content: center; border: 1px solid #66583b; border-radius: 50%; padding: 0; color: var(--gold-bright); background: #2d2921; font-size: 0; line-height: 1; }
.result-add::before { position: relative; top: .055em; content: "+"; font: 400 1.15rem/1 Arial, sans-serif; }
.result-add:hover { border-color: var(--gold); background: #3b3224; }

.preview-heading-actions { display: flex; align-items: center; gap: .45rem; }
.preview-back { display: none; }
.preview-navigation { display: grid; grid-template-columns: auto minmax(5rem, 1fr) auto; align-items: center; gap: .5rem; margin: -.2rem 0 .75rem; }
.preview-navigation .button { padding: .45rem .65rem; }
.preview-navigation span { overflow: hidden; color: var(--muted); font-size: .7rem; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
.preview-stage { display: grid; min-height: 360px; place-items: center; border-radius: 10px; padding: .75rem; background: #111216; }
.empty-message { margin: auto; padding: 1.5rem; color: #7f7c76; text-align: center; line-height: 1.5; }
.equipment-customizer { margin-top: .75rem; border: 1px solid #4e5260; border-radius: 10px; padding: .75rem; background: #15171d; }
.customizer-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.customizer-heading h3 { margin: 0; color: #f0e8d7; font: 1rem Georgia, serif; }
.customizer-note { margin: .45rem 0 .65rem; color: #aaa99f; font-size: .68rem; line-height: 1.4; }
.upgrade-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem; }
.upgrade-property-field { grid-column: 1 / -1; }

.mode-reference .workspace { grid-template-columns: minmax(24rem, .9fr) minmax(30rem, 1.1fr); }
.mode-reference .workbench { position: sticky; top: 1rem; grid-template-columns: 1fr; max-height: calc(100vh - 2rem); overflow: auto; }
.mode-reference .deck-panel, .mode-reference #addPreview, .mode-reference .equipment-customizer, .mode-reference .result-add { display: none !important; }
.mode-reference .preview-stage { display: block; min-height: 0; padding: 0; background: transparent; }
.mode-reference .result-row { grid-template-columns: 54px minmax(0, 1fr); }
.reference-entry { overflow: hidden; border: 1px solid #554932; border-radius: 12px; color: #211b14; background: #f1e5cb; box-shadow: 0 16px 34px rgba(0, 0, 0, .34); }
.reference-entry.game-sf2e { color: #dffaff; border-color: #28788d; background: #10232b; }
.reference-art { display: grid; min-height: 11rem; max-height: 18rem; place-items: center; overflow: hidden; border-bottom: 3px solid #91434a; background: radial-gradient(circle, #554135, #181617 72%); }
.reference-entry.game-sf2e .reference-art { border-color: #32cee4; background: radial-gradient(circle, #153d4d, #071219 72%); }
.reference-art img { display: block; width: 100%; height: 100%; max-height: 18rem; object-fit: contain; }
.reference-heading { padding: .9rem 1rem .5rem; }
.reference-heading > div { min-width: 0; }
.reference-heading p { display: inline; margin: 0; color: #786343; font: 800 .65rem Inter, sans-serif; letter-spacing: .08em; text-transform: uppercase; }
.reference-entry.game-sf2e .reference-heading p { color: #68d9eb; }
.reference-heading h3 { margin: .35rem 0 .18rem; color: #2c2015; font: 700 clamp(1.5rem, 3vw, 2rem) Georgia, serif; line-height: 1.05; }
.reference-entry.game-sf2e .reference-heading h3 { color: #f1fdff; }
.reference-heading small { color: #715f4b; font-size: .76rem; font-weight: 700; text-transform: uppercase; }
.reference-entry.game-sf2e .reference-heading small { color: #8acbd6; }
.reference-traits { display: flex; flex-wrap: wrap; gap: .3rem; padding: 0 1rem .75rem; }
.reference-entry .reference-traits .tag { border-color: #987b54; color: #4f3c27; background: rgba(255, 255, 255, .28); font-size: .7rem; }
.reference-entry.game-sf2e .reference-traits .tag { border-color: #3f8997; color: #c5f4fa; background: rgba(38, 128, 145, .18); }
.reference-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .35rem .8rem; margin: 0 1rem .85rem; border-top: 1px solid #c3ad87; border-bottom: 1px solid #c3ad87; padding: .65rem 0; }
.reference-entry.game-sf2e .reference-facts { border-color: #376b76; }
.reference-facts > div { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .4rem; min-width: 0; }
.reference-facts dt { color: #7b3f36; font-weight: 800; }
.reference-entry.game-sf2e .reference-facts dt { color: #63d7e9; }
.reference-facts dd { min-width: 0; margin: 0; overflow-wrap: anywhere; }
.reference-description { padding: 0 1rem 1rem; font: .95rem/1.48 Georgia, serif; }
.reference-description > :first-child { margin-top: 0; }
.reference-description > :last-child { margin-bottom: 0; }
.reference-description table { width: 100%; border-collapse: collapse; }
.reference-description td, .reference-description th { border: 1px solid #bba47d; padding: .3rem; }
.reference-entry footer { display: flex; justify-content: space-between; gap: 1rem; border-top: 1px solid #c3ad87; padding: .55rem 1rem; color: #776b5b; font: .62rem Inter, sans-serif; }
.reference-entry.game-sf2e footer { color: #73aeb9; border-color: #376b76; }

.mobile-tabs { display: none; }

.custom-card-dialog { width: min(760px, calc(100vw - 2rem)); max-height: calc(100dvh - 2rem); margin: auto; overflow: hidden; border: 1px solid #62563f; border-radius: 14px; padding: 0; color: var(--ink); background: #1b1c21; box-shadow: 0 24px 80px rgba(0, 0, 0, .72); }
.custom-card-dialog::backdrop { background: rgba(5, 6, 8, .78); backdrop-filter: blur(4px); }
.custom-card-dialog form { max-height: calc(100dvh - 2rem); overflow: auto; padding: 1rem; }
.custom-card-heading { display: flex; align-items: start; justify-content: space-between; gap: 1rem; border-bottom: 1px solid #3e3f46; padding-bottom: .8rem; }
.custom-card-heading h2 { margin: 0; color: #f5ead4; font: 1.55rem Georgia, serif; }
.dialog-close { display: grid; flex: 0 0 auto; width: 2.4rem; height: 2.4rem; place-items: center; border: 1px solid #4b4c53; border-radius: 50%; padding: 0 0 .15rem; color: #d9d3c7; background: #24252a; font-size: 1.45rem; line-height: 1; }
.custom-card-note { margin: .75rem 0; color: var(--muted); font-size: .76rem; line-height: 1.45; }
.custom-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .65rem; }
.custom-name-field { grid-column: span 2; }
.custom-wide-field { grid-column: 1 / -1; }
.custom-wide-field small { color: #7f7d77; font-weight: 500; }
.custom-image-field { display: grid; grid-template-columns: minmax(0, 1fr) 180px; gap: .8rem; align-items: center; border: 1px solid #404149; border-radius: 9px; padding: .7rem; background: #15161a; }
.custom-image-field > div { display: grid; gap: .4rem; min-width: 0; }
.custom-image-field strong { color: #d9d1c2; font-size: .74rem; }
.custom-image-field small { color: var(--muted); font-size: .68rem; }
.custom-image-field img { display: block; width: 180px; height: 105px; border: 1px solid #4b4c52; border-radius: 8px; object-fit: contain; background: #0e0f12; }
.custom-image-field .text-button { justify-self: start; }
.custom-card-actions { display: flex; justify-content: flex-end; gap: .55rem; position: sticky; bottom: -1rem; margin: 1rem -1rem -1rem; border-top: 1px solid #42434a; padding: .8rem 1rem; background: rgba(27, 28, 33, .97); }

.card {
  --accent: #9d4650;
  --art-row: 31%;
  position: relative;
  display: grid;
  grid-template-rows: var(--art-row) auto minmax(0, 1fr) auto;
  overflow: hidden;
  width: min(100%, 340px);
  aspect-ratio: 5 / 7;
  border: 2px solid #342719;
  border-radius: 14px;
  color: #211b14;
  background:
    radial-gradient(circle at 20% 15%, rgba(255, 255, 255, .33), transparent 28%),
    repeating-linear-gradient(4deg, rgba(101, 70, 36, .025) 0 1px, transparent 1px 5px),
    #f1e5cb;
  box-shadow: 0 16px 34px rgba(0, 0, 0, .42);
  font-family: Georgia, "Times New Roman", serif;
}
.card.category-spell { --accent: #53438e; }
.card.category-feat { --accent: #9d4650; }
.card.category-action { --accent: #287081; }
.card.category-condition { --accent: #8a642f; }
.card.category-weapon { --accent: #813d37; }
.card.category-armor, .card.category-shield { --accent: #445f75; }
.card.category-consumable { --accent: #754b83; }
.card.category-item, .card.category-ammo { --accent: #596847; }
.card-art { position: relative; display: grid; grid-template: minmax(0, 1fr) auto / minmax(0, 1fr); min-height: 0; overflow: hidden; background: var(--accent); }
.card-art img { grid-area: 1 / 1 / -1 / -1; width: 100%; height: 100%; object-fit: cover; filter: saturate(.88) contrast(1.05); }
.card-art::after { content: ""; position: absolute; z-index: 1; inset: 0; background: linear-gradient(transparent 35%, rgba(20, 12, 8, .2) 58%, rgba(20, 12, 8, .92) 100%); pointer-events: none; }
.card-heading { position: relative; z-index: 2; grid-area: 2 / 1; display: grid; grid-template-rows: minmax(0, 1fr) auto; align-content: end; min-width: 0; min-height: 3.35rem; padding: .52rem .62rem .38rem; border-top: 3px solid var(--accent); color: #fff8e9; background: linear-gradient(90deg, rgba(27, 20, 15, .94), rgba(27, 20, 15, .78)); text-shadow: 0 1px 2px #000; }
.card-title { overflow: hidden; max-height: 2.1em; margin: 0; padding-right: 2.2rem; font-size: 1.15rem; line-height: 1.02; }
.card-level { position: absolute; top: .35rem; right: .55rem; display: grid; width: 1.8rem; height: 1.8rem; place-items: center; border-radius: 50%; color: white; background: var(--accent); font: 700 .72rem Inter, sans-serif; }
.card-subtitle { margin-top: .22rem; overflow: hidden; color: #f2d9bd; font: 700 .62rem Inter, sans-serif; letter-spacing: .08em; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.card-traits { display: flex; flex-wrap: wrap; gap: .2rem; min-width: 0; overflow: hidden; padding: .22rem .58rem .35rem; }
.card-traits .tag { max-width: 100%; overflow: hidden; border-color: color-mix(in srgb, var(--accent) 70%, #57483b); color: #4b4035; background: rgba(255, 255, 255, .3); font: 700 .52rem Inter, sans-serif; text-overflow: ellipsis; white-space: nowrap; }
.card-content { min-height: 0; overflow: hidden; padding: 0 .62rem .35rem; font-size: .68rem; line-height: 1.22; }
.card-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .14rem .45rem; margin-bottom: .35rem; padding-bottom: .3rem; border-bottom: 1px solid #c9b996; }
.card-fact { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .3rem; min-width: 0; }
.card-fact:last-child:nth-child(odd) { grid-column: 1 / -1; }
.card-facts dt { color: var(--accent); font-weight: 700; }
.card-facts dd { min-width: 0; margin: 0; overflow-wrap: anywhere; }
.card-description { overflow-wrap: anywhere; }
.card-description p { margin: 0 0 .32em; }
.card-description ul, .card-description ol { margin: .2em 0 .35em; padding-left: 1.2em; }
.card-description table { width: 100%; border-collapse: collapse; font-size: .92em; }
.card-description td, .card-description th { border: 1px solid #af9c77; padding: .1rem; }
.card-description h1, .card-description h2, .card-description h3, .card-description h4 { margin: .35em 0 .15em; font-size: 1.05em; }
.card-upgrade-rules { margin-top: .45em; padding-top: .35em; border-top: 1px solid color-mix(in srgb, var(--accent) 45%, #9a8767); }
.card-upgrade-rules > h4 { color: var(--accent); text-transform: uppercase; letter-spacing: .05em; }
.card-upgrade-rules section + section { margin-top: .4em; }
.card-upgrade-rules section > strong { display: block; color: var(--accent); }
.card-footer { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: .35rem; align-items: center; padding: .22rem .48rem; color: #6d5f4e; border-top: 1px solid #c9b996; font: .48rem Inter, sans-serif; }
.card-footer > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.card-license { text-align: right; }
.card-system-mark { display: inline-flex; align-items: center; justify-self: center; gap: .2rem; border: 1px solid #b89b68; border-radius: 99px; padding: .08rem .28rem .08rem .12rem; color: #4a321a; background: rgba(226, 201, 151, .55); font-weight: 800; letter-spacing: .035em; line-height: 1; text-transform: uppercase; }
.card-system-mark strong { display: grid; width: .85rem; height: .85rem; place-items: center; border-radius: 50%; color: #f8edcf; background: #684423; font-size: .38rem; }
.card-system-name { font-size: .4rem; }

.card.game-sf2e {
  --accent: #36bcd2;
  border-color: #357f91;
  border-radius: 7px;
  color: #dcecf0;
  background:
    linear-gradient(135deg, transparent 0 48%, rgba(87, 218, 239, .035) 48% 52%, transparent 52%) 0 0 / 18px 18px,
    linear-gradient(180deg, #152b36, #101923 58%, #11151d);
  box-shadow: 0 0 0 1px rgba(98, 223, 242, .22), 0 16px 34px rgba(0, 0, 0, .5);
  font-family: Inter, "Segoe UI", sans-serif;
}
.card.game-sf2e.category-spell { --accent: #9b70ef; }
.card.game-sf2e.category-feat { --accent: #3fc5dc; }
.card.game-sf2e.category-action { --accent: #3ee0d2; }
.card.game-sf2e.category-condition { --accent: #e37fc8; }
.card.game-sf2e.category-weapon { --accent: #6596ff; }
.card.game-sf2e.category-armor, .card.game-sf2e.category-shield { --accent: #65c5e1; }
.card.game-sf2e.category-consumable { --accent: #bd7ee2; }
.card.game-sf2e.category-item, .card.game-sf2e.category-ammo { --accent: #54c5bd; }
.card.game-sf2e::before, .card.game-sf2e::after { content: ""; position: absolute; z-index: 3; width: 1.15rem; height: 1.15rem; pointer-events: none; }
.card.game-sf2e::before { top: .18rem; right: .18rem; border-top: 2px solid var(--accent); border-right: 2px solid var(--accent); }
.card.game-sf2e::after { bottom: .18rem; left: .18rem; border-bottom: 2px solid var(--accent); border-left: 2px solid var(--accent); }
.card.game-sf2e .card-art { background: #102934; }
.card.game-sf2e .card-art img { filter: saturate(1.05) contrast(1.1); }
.card.game-sf2e .card-art::after { background: linear-gradient(transparent 30%, rgba(6, 18, 26, .2) 55%, rgba(6, 18, 26, .96)); }
.card.game-sf2e .card-heading { border-top-width: 3px; background: linear-gradient(90deg, rgba(5, 19, 27, .96), rgba(8, 31, 42, .82)); }
.card.game-sf2e .card-title { color: #f0fbfd; font-family: Inter, "Segoe UI", sans-serif; font-weight: 800; letter-spacing: -.02em; }
.card.game-sf2e .card-level { border: 1px solid color-mix(in srgb, var(--accent) 85%, white); border-radius: 3px; color: #07171c; box-shadow: 0 0 8px color-mix(in srgb, var(--accent) 35%, transparent); }
.card.game-sf2e .card-subtitle { color: color-mix(in srgb, var(--accent) 75%, #dff8fc); letter-spacing: .12em; }
.card.game-sf2e .card-traits .tag { border-color: color-mix(in srgb, var(--accent) 55%, #536b74); color: #dceff2; background: rgba(24, 65, 76, .66); }
.card.game-sf2e .card-facts { border-bottom-color: #34515a; }
.card.game-sf2e .card-facts dt { color: color-mix(in srgb, var(--accent) 82%, white); }
.card.game-sf2e .card-description td, .card.game-sf2e .card-description th { border-color: #41616a; }
.card.game-sf2e .card-footer { color: #91adb4; border-top-color: #34515a; background: rgba(5, 13, 18, .4); }
.card.game-sf2e .card-system-mark { border-color: #397f8e; border-radius: 3px; color: #d8f8fc; background: rgba(22, 83, 96, .6); letter-spacing: .07em; }
.card.game-sf2e .card-system-mark strong { border-radius: 2px; color: #07171c; background: #68dced; }
.card.art-is-icon .card-art { background: repeating-linear-gradient(135deg, rgba(255, 255, 255, .045) 0 1px, transparent 1px 9px), linear-gradient(145deg, color-mix(in srgb, var(--accent) 70%, #1a1718), #17171c); }
.card.art-is-icon .card-art::before { content: ""; position: relative; z-index: 0; grid-area: 1 / 1; align-self: center; justify-self: center; width: 5.3rem; height: 5.3rem; border: 1px solid rgba(245, 223, 180, .28); border-radius: 50%; background: radial-gradient(circle, color-mix(in srgb, var(--accent) 52%, #c9aa72) 0 52%, color-mix(in srgb, var(--accent) 28%, transparent) 70%, transparent 72%); box-shadow: 0 0 24px rgba(0, 0, 0, .32); }
.card.art-is-icon .card-art::after { z-index: 1; background: linear-gradient(transparent 35%, rgba(12, 10, 10, .12) 55%, rgba(12, 10, 10, .9)); }
.card.art-is-icon .card-art img { position: relative; z-index: 1; grid-area: 1 / 1; align-self: center; justify-self: center; width: auto; height: auto; max-width: 62%; max-height: calc(100% - .7rem); margin: .35rem; border-radius: 10px; object-fit: contain; filter: saturate(1.04) contrast(1.04) drop-shadow(0 4px 7px rgba(0, 0, 0, .45)); image-rendering: auto; }
.card.game-sf2e.art-is-icon .card-art { background: linear-gradient(135deg, transparent 0 48%, rgba(87, 218, 239, .1) 48% 52%, transparent 52%) 0 0 / 14px 14px, linear-gradient(145deg, color-mix(in srgb, var(--accent) 38%, #0b202a), #0b1119); }
.card.game-sf2e.art-is-icon .card-art::before { border-color: rgba(100, 224, 243, .38); border-radius: 5px; background: radial-gradient(circle, color-mix(in srgb, var(--accent) 38%, #a8eff5) 0 48%, color-mix(in srgb, var(--accent) 22%, transparent) 68%, transparent 70%); transform: rotate(45deg); }
.card.artwork-reduced { --art-row: 26%; }
.card.artwork-minimal { --art-row: 23%; }
.card.artwork-minimal .card-art img { opacity: .7; }
.card.artwork-minimal.art-is-icon .card-art img { max-height: calc(100% - .5rem); margin: .25rem; }

.print-controls { display: grid; grid-template-columns: repeat(2, 1fr); gap: .55rem; margin-bottom: .7rem; }
.corner-toggle { display: flex; grid-column: 1 / -1; align-items: center; gap: .55rem; min-height: 2.35rem; border: 1px solid #40434b; border-radius: 8px; padding: .45rem .6rem; background: #17191e; cursor: pointer; }
.corner-toggle input { width: 1rem; min-height: auto; accent-color: var(--gold); }
.corner-toggle span { display: grid; gap: .08rem; }
.corner-toggle strong { color: #e9dfcb; font-size: .72rem; }
.corner-toggle small { color: var(--muted); font-size: .6rem; font-weight: 500; }
.print-option-preview { display: grid; grid-template-columns: minmax(0, 1fr) 9rem; gap: .8rem; align-items: stretch; margin-bottom: .7rem; border: 1px solid #4b453a; border-radius: 10px; padding: .7rem; background: linear-gradient(135deg, #1b1a1a, #14181c); }
.print-option-summary { min-width: 0; }
.print-option-summary h3 { margin: 0 0 .3rem; color: #f0e6d2; font: 1rem Georgia, serif; }
.print-option-summary > p:not(.eyebrow) { min-height: 2.7em; margin: 0 0 .6rem; color: #aaa69d; font-size: .66rem; line-height: 1.4; }
.print-option-facts { display: grid; gap: .25rem; }
.print-option-facts > span { display: grid; grid-template-columns: 3.7rem minmax(0, 1fr); gap: .35rem; align-items: baseline; min-width: 0; border-radius: 6px; padding: .3rem .4rem; background: rgba(255, 255, 255, .035); }
.print-option-facts small { color: #85827b; font-size: .52rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.print-option-facts strong { color: #ddd3c1; font-size: .61rem; line-height: 1.3; }
.print-option-facts > span.is-muted strong { color: #827f79; text-decoration: line-through; }
.print-option-canvas { display: grid; place-items: center; min-height: 13rem; border: 1px solid #34373d; border-radius: 8px; padding: .35rem; background: repeating-linear-gradient(45deg, #101216 0 6px, #121419 6px 12px); }
.print-option-canvas > small { align-self: end; color: #777b80; font-size: .5rem; letter-spacing: .04em; text-transform: uppercase; }
.print-option-card { --mini-art: 27%; position: relative; align-self: center; display: grid; grid-template-rows: var(--mini-art) auto auto minmax(0, 1fr) .35rem; overflow: hidden; border: 1px solid #6b5536; border-radius: 5px; color: #382c20; background: #eee0c4; box-shadow: 0 6px 14px rgba(0, 0, 0, .4); transition: width .18s, height .18s, border-radius .18s; }
.print-option-card.size-poker { width: 87.5px; height: 122.5px; }
.print-option-card.size-tarot { width: 96.5px; height: 165.4px; }
.print-option-card.size-index { width: 105px; height: 175px; }
.print-option-card.mode-condensed.size-poker { height: 61.25px; }
.print-option-card.mode-condensed.size-tarot { height: 82.7px; }
.print-option-card.mode-condensed.size-index { height: 87.5px; }
.print-option-card.density-compact { --mini-art: 19%; }
.print-option-card.density-artful { --mini-art: 35%; }
.print-option-card.square { border-radius: 0; }
.mini-card-art { position: relative; overflow: hidden; background: radial-gradient(circle at 62% 35%, #f2c276 0 7%, transparent 8%), linear-gradient(145deg, transparent 48%, rgba(255, 220, 143, .2) 49% 51%, transparent 52%), linear-gradient(150deg, #3d2731, #936145 52%, #292d3b); }
.mini-card-art::after { content: ""; position: absolute; inset: 45% 0 0; background: linear-gradient(transparent, rgba(30, 17, 12, .72)); }
.mini-card-art span { position: absolute; right: .25rem; bottom: .15rem; z-index: 1; color: rgba(255, 245, 220, .75); font-size: .32rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.mini-card-heading { position: relative; display: flex; align-items: center; min-height: .9rem; border-top: 2px solid #91434a; padding: .18rem .25rem; }
.mini-card-heading strong { overflow: hidden; padding-right: .8rem; font: 700 .4rem Georgia, serif; text-overflow: ellipsis; white-space: nowrap; }
.mini-card-heading i { position: absolute; top: .12rem; right: .2rem; display: grid; width: .65rem; height: .65rem; place-items: center; border-radius: 50%; color: white; background: #91434a; font: 700 .3rem Inter, sans-serif; }
.mini-card-traits { display: flex; gap: .1rem; padding: 0 .25rem .16rem; }
.mini-card-traits span { width: 1.25rem; height: .18rem; border-radius: 99px; background: #b78a78; }
.mini-card-copy { display: grid; align-content: start; gap: .13rem; overflow: hidden; padding: .08rem .25rem; }
.mini-card-copy span { display: block; width: 100%; height: 1px; background: #8f806b; }
.mini-card-copy span:nth-child(3n) { width: 72%; }
.print-option-card.density-compact .mini-card-copy { gap: .1rem; }
.print-option-card.density-compact .mini-card-copy span { height: 1px; }
.print-option-card.density-artful .mini-card-copy span:nth-child(n+6) { display: none; }
.mini-card-footer { align-self: end; display: grid; min-height: .35rem; place-items: center; border-top: 1px solid #bbaa8a; }
.mini-card-footer span { border: 1px solid #a78859; border-radius: 99px; padding: .02rem .15rem; color: #56391e; background: #dfc999; font: 800 .25rem Inter, sans-serif; line-height: 1; }
.print-option-card.mode-condensed { --mini-art: 0%; grid-template-rows: auto auto minmax(0, 1fr) .28rem; }
.print-option-card.mode-condensed .mini-card-art { display: none; }
.print-option-card.mode-condensed .mini-card-heading { grid-row: 1; min-height: .85rem; }
.print-option-card.mode-condensed .mini-card-traits { grid-row: 2; }
.print-option-card.mode-condensed .mini-card-copy { grid-row: 3; }
.print-option-card.mode-condensed .mini-card-footer { grid-row: 4; }
.print-assist { display: grid; gap: .18rem; margin-bottom: .7rem; border: 1px solid #3f4850; border-radius: 8px; padding: .5rem .6rem; color: #929da2; background: #15191d; font-size: .64rem; line-height: 1.4; }
.print-assist strong { color: #e7d7b6; font-size: .72rem; }
.deck-list { display: grid; gap: .35rem; max-height: 24rem; overflow: auto; }
.deck-group { display: grid; gap: .35rem; }
.deck-group + .deck-group { margin-top: .25rem; }
.deck-group > h3 { position: sticky; top: 0; z-index: 1; display: flex; align-items: center; justify-content: space-between; margin: 0; border-bottom: 1px solid #4b4336; padding: .35rem .4rem .28rem; color: #e5ca91; background: #1d1d21; font: 800 .65rem Inter, sans-serif; letter-spacing: .08em; text-transform: uppercase; }
.deck-group-label { display: flex; align-items: center; gap: .4rem; }
.deck-group > h3 small { display: grid; min-width: 1.15rem; height: 1.15rem; place-items: center; border-radius: 99px; color: #21190d; background: #cfa855; font-size: .55rem; }
.deck-group-delete { border: 1px solid #704047; border-radius: 5px; padding: .2rem .38rem; color: #e9949b; background: #2c1d21; font-size: .52rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.deck-group-delete:hover { border-color: #b35e68; color: #ffd5d8; background: #402328; }
.deck-row { display: grid; grid-template-columns: 38px minmax(0, 1fr) auto auto; gap: .55rem; align-items: center; border-radius: 8px; padding: .3rem .4rem; background: #15161a; }
.deck-row img { width: 38px; height: 38px; border-radius: 5px; object-fit: cover; }
.deck-name { overflow: hidden; color: #eee6d6; font: .88rem Georgia, serif; text-overflow: ellipsis; white-space: nowrap; }
.deck-game { min-width: 1.5rem; margin-right: .35rem; border-radius: 3px; padding: .08rem .2rem; font-size: .48rem; vertical-align: .1rem; }
.deck-game.pf2e { color: #291d10; background: #cba861; }
.deck-game.sf2e { color: #e0fbff; border: 1px solid #3d99ae; background: #185b70; }
.deck-meta { color: var(--muted); font-size: .62rem; text-transform: capitalize; }
.quantity { display: flex; align-items: center; gap: .28rem; }
.quantity button, .deck-remove { height: 1.6rem; border: 1px solid #47484f; border-radius: 5px; color: var(--ink); background: #24252b; }
.quantity button { width: 1.6rem; }
.quantity span { min-width: 1.2rem; text-align: center; font-size: .75rem; }
.deck-remove { width: auto; padding: 0 .42rem; color: #e28a91; font-size: .58rem; }
.deck-remove:hover { border-color: #9a4d55; background: #352126; }
.deck-actions { display: grid; grid-template-columns: 1fr 1fr; gap: .55rem; margin-top: .75rem; }
.count-pill { display: inline-grid; min-width: 1.45rem; height: 1.45rem; place-items: center; border-radius: 99px; color: #19140c; background: var(--gold); font: 700 .68rem Inter, sans-serif; vertical-align: middle; }

.import-report { border-color: #66583d; }
.import-summary { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; margin-bottom: .7rem; }
.import-stat { border-radius: 8px; padding: .6rem; background: #15161a; text-align: center; }
.import-stat strong { display: block; color: var(--gold-bright); font-size: 1.2rem; }
.import-stat span { color: var(--muted); font-size: .65rem; }
.unmatched-list { max-height: 12rem; overflow: auto; margin: .4rem 0 0; padding-left: 1.25rem; color: #d6c8b3; font-size: .76rem; }
.status-toast { position: fixed; right: 1rem; bottom: 1rem; z-index: 20; max-width: 28rem; border: 1px solid #6b5b3a; border-radius: 9px; padding: .7rem .9rem; color: #f6e7c4; background: #2b261e; box-shadow: var(--shadow); opacity: 0; pointer-events: none; transform: translateY(.5rem); transition: opacity .2s, transform .2s; }
.status-toast.visible { opacity: 1; transform: translateY(0); }
.card-hover-popover { position: fixed; z-index: 100; width: min(500px, calc((100vh - 24px) * 5 / 7), calc(100vw - 24px)); pointer-events: none; }
.card-hover-popover[hidden] { display: none; }
.card-hover-popover .hover-card.card { width: 100%; max-width: none; border-width: 3px; box-shadow: 0 24px 70px rgba(0, 0, 0, .72), 0 0 0 1px rgba(255, 255, 255, .12); }
.card-hover-popover .hover-card .card-title { font-size: 1.45rem; }
.card-hover-popover .hover-card .card-subtitle { font-size: .76rem; }
.card-hover-popover .hover-card .card-traits .tag { font-size: .64rem; }
.card-hover-popover .hover-card .card-content { font-size: .84rem; }
.card-hover-popover .hover-card .card-footer { font-size: .58rem; }
.card-hover-popover .hover-card .card-system-name { font-size: .5rem; }
.app-footer { display: flex; justify-content: space-between; gap: 2rem; padding: 1rem clamp(1rem, 3vw, 3rem) 2rem; color: #77746e; font-size: .72rem; }
.app-footer p { margin: 0; }
.print-sheet {
  position: fixed;
  top: 0;
  left: -200in;
  display: grid;
  grid-template-columns: repeat(auto-fit, var(--card-w));
  grid-auto-rows: var(--card-h);
  justify-content: center;
  align-content: start;
  width: var(--paper-content-w);
  gap: 0;
  visibility: hidden;
  pointer-events: none;
  contain: layout style paint;
}
.print-card.card {
  width: var(--card-w);
  height: var(--card-h);
  aspect-ratio: auto;
  border: .35mm solid #2f2419;
  border-radius: 2.5mm;
  box-shadow: none;
}
.print-card.density-compact { --art-row: 24%; }
.print-card.density-artful { --art-row: 38%; }
.print-card.density-compact.artwork-reduced { --art-row: 23%; }
.print-card.density-compact.artwork-minimal { --art-row: 22%; }
.print-card.density-artful.artwork-reduced { --art-row: 30%; }
.print-card.density-artful.artwork-minimal { --art-row: 25%; }
.print-card.density-compact .card-content { font-size: 6.8pt; }
.print-card.density-artful .card-content { font-size: 6.4pt; }
.print-card .card-title { max-height: 2.15em; overflow: hidden; font-size: 10pt; }
.print-card .card-footer { font-size: 4.2pt; }
.print-card .card-system-mark { padding: .35mm .8mm; }
.print-card .card-system-mark strong { display: block; width: auto; height: auto; border-radius: 0; color: inherit; background: transparent; font-size: 4pt; }
.print-card .card-system-name { display: none; }
.print-card .card-heading { min-height: 9mm; }
.print-card.print-mode-condensed { --art-row: auto; grid-template-rows: auto auto minmax(0, 1fr) auto !important; border-radius: 1.5mm; }
.print-sheet.square-corners .print-card.card { border-radius: 0 !important; }
.print-card.print-mode-condensed .card-art { overflow: visible; background: transparent; }
.print-card.print-mode-condensed .card-art::before, .print-card.print-mode-condensed .card-art::after, .print-card.print-mode-condensed .card-art > img { display: none; }
.print-card.print-mode-condensed .card-heading { position: relative; min-height: 0; padding: 1.5mm 2mm 1mm; border-top-width: 1mm; color: inherit; background: transparent; text-shadow: none; }
.print-card.print-mode-condensed .card-title { max-height: 2.1em; padding-right: 7mm; font-size: 8pt; }
.print-card.print-mode-condensed .card-level { top: 1.15mm; right: 1.6mm; width: 5.5mm; height: 5.5mm; font-size: 5pt; }
.print-card.print-mode-condensed .card-subtitle { margin-top: .5mm; font-size: 4.4pt; }
.print-card.print-mode-condensed .card-traits { padding: .7mm 2mm 1mm; }
.print-card.print-mode-condensed .card-traits .tag { font-size: 3.9pt; }
.print-card.print-mode-condensed .card-content { padding: 0 2mm 1mm; font-size: 5.6pt; line-height: 1.12; }
.print-card.print-mode-condensed .card-facts { gap: .2mm 1mm; margin-bottom: 1mm; padding-bottom: .8mm; }
.print-card.print-mode-condensed .card-footer { padding: .7mm 2mm; font-size: 3.4pt; }
.print-card.print-mode-condensed.game-pf2e { background: #f5eddc; box-shadow: none; }
.print-card.print-mode-condensed.game-sf2e { background: #111d25; box-shadow: none; }

@media (max-width: 1040px) {
  .workspace { grid-template-columns: 1fr; }
  .workbench { grid-template-columns: 1fr 1fr; }
  .mode-reference .workspace { grid-template-columns: minmax(20rem, .9fr) minmax(25rem, 1.1fr); }
  .import-report { grid-column: 1 / -1; }
}
@media (max-width: 820px) {
  body { padding-bottom: 4.35rem; }
  .app-header { align-items: stretch; flex-direction: column; gap: .75rem; padding: 1rem; }
  .app-header h1 { font-size: 1.8rem; }
  .header-action { width: 100%; min-height: 2.8rem; }
  .build-metadata { text-align: left; }
  .suite-nav { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
  .suite-nav a { min-height: 2.75rem; align-content: center; text-align: center; }
  .workspace { padding: .5rem; }
  .library-panel, .preview-panel, .deck-panel, .import-report { border-radius: 10px; padding: .75rem; }
  .section-heading { align-items: start; }
  .section-heading .button { min-height: 2.75rem; }
  .preview-heading { align-items: stretch; flex-direction: column; }
  .preview-heading-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .preview-back { display: block; }
  .preview-navigation { position: sticky; top: 0; z-index: 4; margin: 0 0 .65rem; border: 1px solid #3d3e45; border-radius: 9px; padding: .35rem; background: rgba(24, 25, 30, .96); }
  .preview-navigation .button { min-height: 2.65rem; }
  .search-field input { min-height: 3rem; }
  .filter-drawer { margin-bottom: .5rem; border: 1px solid #3d3f46; border-radius: 9px; padding: .15rem .55rem .55rem; background: #17181d; }
  .filter-drawer > summary { display: block; min-height: 2.6rem; padding: .7rem .1rem .45rem; color: #e8d6b3; font-size: .78rem; font-weight: 800; cursor: pointer; }
  .filters { grid-template-columns: 1fr 1fr; }
  .game-scope { grid-template-columns: 1fr; }
  .source-filter { grid-column: 1 / -1; }
  .workbench { grid-template-columns: 1fr; }
  body[data-mobile-view="library"] .workbench { display: none; }
  body[data-mobile-view="preview"] .library-panel, body[data-mobile-view="deck"] .library-panel { display: none; }
  body[data-mobile-view="preview"] .deck-panel, body[data-mobile-view="deck"] .preview-panel { display: none; }
  .mode-reference .workspace { display: block; }
  .mode-reference .workbench { position: static; max-height: none; overflow: visible; }
  .mode-reference .preview-panel { display: block; }
  .mode-reference[data-mobile-view="library"] .workbench { display: none; }
  .preview-stage { min-height: 0; padding: .35rem; }
  .result-row { grid-template-columns: 48px minmax(0, 1fr) auto; min-height: 60px; padding: .35rem; }
  .result-thumb { width: 48px; height: 48px; }
  .result-title { font-size: .95rem; }
  .result-add { width: 2.75rem; height: 2.75rem; }
  .reference-art { min-height: 9rem; }
  .reference-heading { padding: .75rem .75rem .45rem; }
  .reference-heading h3 { font-size: 1.55rem; }
  .reference-traits { padding: 0 .75rem .65rem; }
  .reference-facts { grid-template-columns: 1fr; margin: 0 .75rem .75rem; }
  .reference-description { padding: 0 .75rem .8rem; font-size: 1rem; }
  .reference-entry footer { padding: .55rem .75rem; }
  .print-controls { grid-template-columns: 1fr; }
  .print-option-preview { grid-template-columns: 1fr; }
  .print-option-canvas { min-height: 13rem; }
  .upgrade-fields { grid-template-columns: 1fr; }
  .upgrade-property-field { grid-column: auto; }
  .custom-card-dialog { width: 100vw; max-width: none; max-height: 100dvh; border-width: 0; border-radius: 0; }
  .custom-card-dialog form { max-height: 100dvh; padding: .85rem; }
  .custom-card-grid { grid-template-columns: 1fr 1fr; }
  .custom-name-field, .custom-wide-field { grid-column: 1 / -1; }
  .custom-image-field { grid-template-columns: 1fr; }
  .custom-image-field img { width: 100%; height: 11rem; }
  .custom-card-actions { bottom: -.85rem; margin: .85rem -.85rem -.85rem; padding: .75rem .85rem max(.75rem, env(safe-area-inset-bottom)); }
  .custom-card-actions .button { flex: 1 1 0; min-height: 2.8rem; }
  .app-footer { flex-direction: column; gap: .5rem; }
  .mobile-tabs { position: fixed; right: 0; bottom: 0; left: 0; z-index: 90; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; min-height: 4rem; border-top: 1px solid #4b4c53; padding: .3rem max(.35rem, env(safe-area-inset-right)) max(.3rem, env(safe-area-inset-bottom)) max(.35rem, env(safe-area-inset-left)); background: rgba(18, 19, 23, .97); box-shadow: 0 -8px 24px rgba(0, 0, 0, .42); backdrop-filter: blur(12px); }
  .mobile-tabs button { position: relative; display: grid; place-items: center; gap: .05rem; min-height: 3.2rem; border: 0; border-radius: 8px; color: #9d9b95; background: transparent; }
  .mobile-tabs button > span { font-size: 1.15rem; line-height: 1; }
  .mobile-tabs button strong { font-size: .65rem; }
  .mobile-tabs button[aria-current="page"] { color: #f2d99e; background: #2b2821; }
  .mobile-tabs i { position: absolute; top: .2rem; left: calc(50% + .5rem); display: grid; min-width: 1rem; height: 1rem; place-items: center; border-radius: 99px; padding: 0 .2rem; color: #1b1409; background: var(--gold); font-size: .52rem; font-style: normal; font-weight: 900; }
  .mode-reference .mobile-tabs { grid-template-columns: 1fr 1fr; }
  .mode-reference .mobile-deck-tab { display: none; }
}

@media (hover: none) {
  .card-hover-popover { display: none !important; }
}

@media print {
  :root { color-scheme: light; background: white; }
  body { margin: 0; background: white; }
  body > :not(.print-sheet):not(#pageStyle) { display: none !important; }
  .print-sheet {
    position: static;
    top: auto;
    left: auto;
    display: grid !important;
    grid-template-columns: repeat(auto-fit, var(--card-w));
    grid-auto-rows: var(--card-h);
    justify-content: center;
    align-content: start;
    width: 100%;
    gap: 0;
    visibility: visible;
    pointer-events: auto;
    contain: none;
  }
  .print-card.card {
    width: var(--card-w);
    height: var(--card-h);
    aspect-ratio: auto;
    break-inside: avoid;
    page-break-inside: avoid;
    border: .35mm solid #2f2419;
    border-radius: 2.5mm;
    box-shadow: none;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
  .print-card.density-compact { --art-row: 24%; }
  .print-card.density-artful { --art-row: 38%; }
  .print-card.density-compact .card-content { font-size: 6.8pt; }
  .print-card.density-artful .card-content { font-size: 6.4pt; }
  .print-card .card-title { font-size: 10pt; }
  .print-card .card-footer { font-size: 4.2pt; }
  .print-card .card-system-mark { padding: .35mm .8mm; }
  .print-card .card-system-mark strong { display: block; width: auto; height: auto; border-radius: 0; color: inherit; background: transparent; font-size: 4pt; }
  .print-card .card-system-name { display: none; }
  .print-card .card-heading { min-height: 9mm; }
  .print-card .card-title { max-height: 2.15em; overflow: hidden; }
  .print-card.print-mode-condensed {
    --art-row: auto;
    grid-template-rows: auto auto minmax(0, 1fr) auto !important;
    border-radius: 1.5mm;
  }
  .print-sheet.square-corners .print-card.card { border-radius: 0 !important; }
  .print-card.print-mode-condensed .card-art { overflow: visible; background: transparent; }
  .print-card.print-mode-condensed .card-art::before, .print-card.print-mode-condensed .card-art::after, .print-card.print-mode-condensed .card-art > img { display: none; }
  .print-card.print-mode-condensed .card-heading { position: relative; min-height: 0; padding: 1.5mm 2mm 1mm; border-top-width: 1mm; color: inherit; background: transparent; text-shadow: none; }
  .print-card.print-mode-condensed .card-title { max-height: 2.1em; padding-right: 7mm; font-size: 8pt; }
  .print-card.print-mode-condensed .card-level { top: 1.15mm; right: 1.6mm; width: 5.5mm; height: 5.5mm; font-size: 5pt; }
  .print-card.print-mode-condensed .card-subtitle { margin-top: .5mm; font-size: 4.4pt; }
  .print-card.print-mode-condensed .card-traits { padding: .7mm 2mm 1mm; }
  .print-card.print-mode-condensed .card-traits .tag { font-size: 3.9pt; }
  .print-card.print-mode-condensed .card-content { padding: 0 2mm 1mm; font-size: 5.6pt; line-height: 1.12; }
  .print-card.print-mode-condensed .card-facts { gap: .2mm 1mm; margin-bottom: 1mm; padding-bottom: .8mm; }
  .print-card.print-mode-condensed .card-footer { padding: .7mm 2mm; font-size: 3.4pt; }
  .print-card.print-mode-condensed.game-pf2e {
    background: #f5eddc;
    box-shadow: none;
  }
  .print-card.print-mode-condensed.game-sf2e {
    background: #111d25;
    box-shadow: none;
  }
  .print-card.game-sf2e {
    color: #10242b;
    border-color: #287587;
    background:
      linear-gradient(135deg, transparent 0 48%, rgba(28, 119, 137, .035) 48% 52%, transparent 52%) 0 0 / 18px 18px,
      linear-gradient(180deg, #edf6f6, #e4eeee 58%, #f4f8f7);
  }
  .print-card.game-sf2e::before { border-top-color: #27889a; border-right-color: #27889a; }
  .print-card.game-sf2e::after { border-bottom-color: #27889a; border-left-color: #27889a; }
  .print-card.game-sf2e.print-mode-condensed .card-heading { background: linear-gradient(90deg, rgba(37, 137, 155, .14), transparent 75%); }
  .print-card.game-sf2e.print-mode-condensed .card-title { color: #0b2027; }
  .print-card.game-sf2e.print-mode-condensed .card-subtitle { color: #176273; }
  .print-card.game-sf2e .card-traits .tag { border-color: #4c8993; color: #173b43; background: rgba(184, 224, 228, .55); }
  .print-card.game-sf2e .card-facts { border-bottom-color: #8aaeb3; }
  .print-card.game-sf2e .card-facts dt { color: #145f6d; }
  .print-card.game-sf2e .card-description td,
  .print-card.game-sf2e .card-description th { border-color: #789da4; }
  .print-card.game-sf2e .card-footer { color: #315b64; border-top-color: #8aaeb3; background: rgba(201, 229, 232, .72); }
  .print-card.game-sf2e .card-system-mark { border-color: #3b8794; color: #123b43; background: #c7e8eb; }
  .print-card[data-overflow="true"]::after {
    content: "More text than fits";
    position: absolute;
    right: 1mm;
    bottom: 4mm;
    padding: .4mm 1mm;
    color: white;
    background: #922;
    font: 4.5pt Inter, sans-serif;
  }
}