/* QuickSheet — The Adventurer's Folio.
   Hand-drawn atmosphere, engineered restraint. No remote fonts or assets. */
:root {
  --ink: #202c29;
  --ink-deep: #141d1b;
  --ink-soft: #31423b;
  --parchment: #f3eee4;
  --paper: #fffdf8;
  --paper-ink: #342e28;
  --paper-muted: #80786b;
  --paper-line: #ddd5c5;
  --gold: #cca471;
  --gold-light: #ead6b5;
  --ember: #b66e4a;
  --focus: #e7b97c;
  --serif: Georgia, 'Times New Roman', serif;
  --sans: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; }
body {
  min-width: 320px;
  margin: 0;
  color: #eee8de;
  background: #111a18;
  font: 15px/1.55 var(--sans);
  -webkit-font-smoothing: antialiased;
}
button, select, input { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .5; }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
a { color: inherit; }
.ambient-glow { position: fixed; inset: 0; pointer-events: none; z-index: -1;
  background: radial-gradient(ellipse 60% 45% at 68% -18%, #38514255, transparent 75%), radial-gradient(ellipse 32% 40% at -7% 74%, #78573a22, transparent 90%); }
.app-frame { max-width: 1660px; padding: 0 clamp(18px, 3.2vw, 52px); margin: auto; }
.small-caps, .eyebrow-line, .edition-tag, .privacy-tag, .folio-kicker { font-size: 10px; font-weight: 800; letter-spacing: .17em; line-height: 1.6; }
.eyebrow-line { color: var(--gold); }
.eyebrow-line::before { content: ''; display: inline-block; width: 21px; height: 1px; background: currentColor; vertical-align: middle; margin-right: 11px; }

/* Site navigation */
.topbar { min-height: 95px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-bottom: 1px solid #ffffff1a; }
.brand { display: inline-flex; gap: 14px; align-items: center; text-decoration: none; flex-shrink: 0; }
.brand-mark { width: 40px; height: 40px; display: grid; place-items: center; position: relative; border: 1px solid #aa9471; transform: rotate(45deg); }
.brand-mark::before, .brand-mark::after { content: ''; position: absolute; width: 7px; height: 7px; border: 1px solid #d5b58b; }
.brand-mark::before { top: 5px; left: 5px; border-width: 1px 0 0 1px; }
.brand-mark::after { bottom: 5px; right: 5px; border-width: 0 1px 1px 0; }
.brand-mark span { display: block; width: 15px; height: 15px; border: 2px solid #e3c597; }
.brand-wordmark { font-size: 26px; line-height: 1; letter-spacing: -.06em; font-weight: 800; color: #f9f5ed; }
.brand-wordmark > span { color: var(--gold); }
.brand-wordmark small { display: block; margin-top: 7px; color: #a4aaa3; font-size: 8px; font-weight: 700; letter-spacing: .23em; }
.topbar-aside { display: flex; align-items: center; gap: 21px; color: #a9b3a9; }
.edition-tag { display: inline-flex; align-items: center; gap: 9px; color: #e2d5b9; }
.edition-dot { background: #bd9a6c; height: 6px; width: 6px; border-radius: 50%; box-shadow: 0 0 12px #d4a36565; }
.topbar-divider { height: 23px; width: 1px; background: #ffffff25; }
.privacy-tag { color: #8f9a91; }

/* App composition */
.workspace { display: grid; grid-template-columns: minmax(285px, 337px) minmax(0, 1fr); gap: clamp(22px, 2.4vw, 38px); align-items: start; padding: 34px 0 0; }
.workbench { position: sticky; top: 22px; border: 1px solid #6672695c; background: linear-gradient(150deg, #2a3730 0%, #202c27 50%, #1a2521 100%); box-shadow: 0 14px 70px #00000028; padding: 31px 29px 24px; overflow: hidden; }
.workbench::before { content: ''; position: absolute; width: 190px; height: 190px; right: -117px; top: -108px; border: 1px solid #f1d3a624; transform: rotate(45deg); pointer-events: none; }
.workbench-intro h1 { margin: 19px 0 12px; font: 45px/.98 var(--serif); letter-spacing: -.035em; font-weight: normal; }
.workbench-intro h1 em { display: block; color: #dfb98c; font-weight: normal; }
.workbench-intro > p { color: #b8c0b7; font-size: 13px; line-height: 1.85; margin: 0 0 28px; }
.field-section-heading { display: flex; justify-content: space-between; gap: 12px; padding-bottom: 10px; margin-bottom: 14px; border-bottom: 1px solid #ffffff24; font: 800 9px/1.4 var(--sans); letter-spacing: .18em; color: #cfb590; }
.field-section-heading span:last-child { color: #808d82; }
.secondary-heading { margin-top: 20px; }
.fields { display: grid; gap: 13px; }
.controls label:not(.checkbox) { display: flex; flex-direction: column; gap: 6px; font-size: 11px; font-weight: 650; letter-spacing: .025em; color: #e0e4db; }
.controls select { width: 100%; min-height: 42px; padding: 0 31px 0 12px; border: 1px solid #67756c80; border-radius: 4px; appearance: none; background: #17231e url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='10' viewBox='0 0 13 10'%3E%3Cpath d='m2 3 4.5 4L11 3' fill='none' stroke='%23cfb78d' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat right 12px center; color: #fbf6ec; font-size: 13px; font-weight: 500; }
.controls select:disabled { color: #a3aba0; opacity: .64; }
.controls select:hover:not(:disabled) { border-color: #a2a38a; }
.controls select option { color: #fff; background: #1b2823; }
.mixed-row { display: grid; gap: 10px; }
.field-hint { font-size: 10px; font-weight: 500; color: #97a49b; letter-spacing: 0; }
label.checkbox { display: flex; flex-direction: row; align-items: center; gap: 11px; cursor: pointer; }
.checkbox > input { flex-shrink: 0; width: 18px; height: 18px; accent-color: var(--gold); margin: 0; }
.checkbox-copy { display: grid; line-height: 1.35; }
.checkbox-copy strong { font-size: 12px; color: #ede7de; }
.checkbox-copy small { font-size: 10px; color: #97a49b; margin-top: 2px; }
.primary-button { display: flex; align-items: center; width: 100%; min-height: 55px; margin-top: 25px; padding: 0 15px; gap: 11px; border-radius: 3px; border: 1px solid #e0ad71; background: #e0ad71; color: #241f1a; box-shadow: 0 7px 22px #110e0922; text-align: left; font-size: 13px; font-weight: 800; letter-spacing: .01em; transition: background .18s, transform .18s, box-shadow .18s; }
.primary-button:hover:not(:disabled) { background: #f2c28b; box-shadow: 0 8px 27px #e0ad7125; transform: translateY(-1px); }
.primary-icon { font-size: 19px; line-height: 1; }
.primary-arrow { margin-left: auto; font-size: 20px; font-weight: 400; }
.error { background: #522b29; color: #ffe5da; border: 1px solid #bb7872; border-radius: 4px; padding: 11px; font-size: 12px; margin: 12px 0; }
.workbench-bottom { border-top: 1px solid #ffffff20; margin-top: 28px; padding-top: 22px; }
.mini-sigil { color: var(--gold); font-size: 22px; float: left; margin-right: 12px; margin-top: -4px; }
.workbench-bottom p { margin: 0 0 20px; font-size: 11px; color: #9eaaa1; line-height: 1.8; }
.workbench-bottom p strong { color: #dbd6c9; }
.bench-note { font-size: 8px; color: #8b998e; font-weight: 700; letter-spacing: .105em; }

/* Work area */
.stage { min-width: 0; }
.stage-heading { display: flex; justify-content: space-between; gap: 20px; align-items: end; margin: 3px 0 25px; }
.stage-heading h2 { font: normal 42px/1.08 var(--serif); letter-spacing: -.03em; margin: 10px 0 6px; color: #f8f5ee; }
.stage-heading h2 em { color: #d6b48b; font-weight: normal; }
.stage-heading p { color: #9ca9a1; font-size: 12px; margin: 0; }
.stage-menu { display: flex; align-items: center; padding-bottom: 3px; }
.quiet-button, .download-button { min-height: 37px; border: 1px solid #6170679c; border-radius: 3px; background: #ffffff08; color: #ebebdf; padding: 8px 12px; white-space: nowrap; font-size: 11px; font-weight: 700; transition: background .15s, border-color .15s; }
.quiet-button:hover:not(:disabled) { background: #ffffff16; border-color: #ba9b70; }
.quiet-button span, .download-button span { font-size: 14px; margin-right: 4px; }
.download-button { color: #33291e; background: #dfbd8c; border-color: #dfbd8c; }
.download-button:hover { background: #f4cea1; }
.empty-state { min-height: 637px; padding: 90px 30px 31px; color: #e5dfd0; text-align: center; display: flex; flex-direction: column; align-items: center; justify-content: center; border: 1px solid #9a8e7666; position: relative;
  background: radial-gradient(ellipse 47% 45% at 50% 38%, #41534950, transparent 95%), linear-gradient(135deg, #26362e 0%, #17221e 100%); overflow: hidden; }
.empty-state::before, .empty-state::after { content: ''; position: absolute; inset: 14px; border: 1px solid #9f93743c; pointer-events: none; }
.empty-state::after { inset: 21px; border-color: #b6a88815; }
.empty-geometry { width: 185px; height: 185px; position: relative; display: grid; place-items: center; margin: 0 0 28px; }
.empty-orbit { position: absolute; border: 1px solid #ae977452; width: 153px; height: 153px; transform: rotate(45deg); }
.empty-orbit-two { width: 115px; height: 115px; border-color: #b3a57b61; transform: rotate(0deg); }
.empty-symbol { font-size: 61px; font-family: var(--serif); color: #d6b58a; text-shadow: 0 0 24px #e4c18a3e; }
.empty-state > .small-caps { color: #d6b792; }
.empty-state h3 { font: normal 38px/1.2 var(--serif); letter-spacing: -.02em; margin: 14px 0 12px; }
.empty-state p { max-width: 390px; margin: 0 auto; color: #abbab0; font-size: 13px; line-height: 1.9; }
.empty-bottom { position: absolute; bottom: 35px; left: 0; right: 0; display: flex; justify-content: center; align-items: center; gap: 16px; font-size: 9px; letter-spacing: .15em; color: #889c90; }
.empty-dash { width: 22px; height: 1px; background: #9b8769; }

/* Output actions & source mode */
.output-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; padding: 12px 15px; gap: 12px; border: 1px solid #ffffff24; margin-bottom: 12px; background: #23312b; }
.view-tabs, .actions { display: flex; gap: 7px; align-items: center; }
.view-tab { background: transparent; border: 0; border-radius: 3px; padding: 9px 12px; color: #aeb8b0; font-size: 13px; font-weight: 750; letter-spacing: .015em; white-space: nowrap; }
.view-tab.is-active { background: #d6b182; color: #251f18; }
.source-view { background: #f6f1e8; color: #2c2a23; padding: 0; border: 1px solid #c4b7a0; }
.source-view-header { background: #eae2d3; color: #796b58; padding: 13px 20px; display: flex; justify-content: space-between; gap: 15px; font-size: 11px; font-weight: 800; letter-spacing: .15em; }
.source-view pre { padding: 24px; overflow-x: auto; font: 14px/1.8 ui-monospace, SFMono-Regular, Consolas, monospace; margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }

/* Paper folio */
.sheet { min-width: 0; }
.folio-page { color: var(--paper-ink); background: var(--parchment); border: 1px solid #e1d5be; box-shadow: 0 25px 65px #080c093f, inset 0 0 0 8px #faf7f0; padding: 10px; position: relative; }
.folio-page::before { content: ''; pointer-events: none; position: absolute; inset: 0; opacity: .33; background-image: radial-gradient(#796f5c1a .6px, transparent .6px); background-size: 8px 8px; }
.folio-page > * { position: relative; }
.folio-identity { background: #25332d; color: #f7f0e6; position: relative; padding: 26px 28px 0; overflow: hidden; border: 1px solid #19251f; }
.folio-identity::before { content: ''; position: absolute; right: -85px; top: -148px; width: 360px; height: 360px; border: 1px solid #d6bc8e2b; transform: rotate(45deg); }
.folio-identity::after { content: ''; position: absolute; inset: 9px; border: 1px solid #ceb48f24; pointer-events: none; }
.folio-identity-ornament { position: absolute; color: #dbba8768; right: 130px; top: 52px; font: 90px/1 var(--serif); opacity: .5; }
.folio-hero-top { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; align-items: center; padding-bottom: 13px; border-bottom: 1px solid #dbc49a49; }
.folio-eyebrow, .folio-serial { font-size: 11px; text-transform: uppercase; font-weight: 750; letter-spacing: .18em; }
.folio-eyebrow { color: #d7be99; }
.folio-serial { color: #97a398; }
.folio-serial i { font-style: normal; color: #ddb781; padding: 0 5px; font-size: 10px; }
.folio-hero-main { display: flex; justify-content: space-between; gap: 15px; align-items: center; padding: 19px 0 22px; }
.folio-hero-main h2 { font: 400 clamp(38px, 4vw, 62px)/1.05 var(--serif); letter-spacing: -.04em; margin: 0; color: #fff8e8; }
.folio-concept { font: italic 17px/1.65 var(--serif); max-width: 620px; color: #c7c9b9; margin: 13px 0 0; }
.level-seal { flex-shrink: 0; width: 83px; min-height: 102px; display: flex; flex-direction: column; align-items: center; justify-content: center; border: 1px solid #bb9c6e; clip-path: polygon(0 11px, 11px 0, calc(100% - 11px) 0, 100% 11px, 100% calc(100% - 11px), calc(100% - 11px) 100%, 11px 100%, 0 calc(100% - 11px)); background: #c4a26e12; }
.level-seal span { color: #d6be9a; font-size: 11px; font-weight: 800; letter-spacing: .15em; }
.level-seal strong { font: normal 45px/1.13 var(--serif); color: #f3daa8; }
.level-seal small { font-size: 11px; letter-spacing: .08em; color: #bdc3b7; }
.folio-identity-meta { display: grid; grid-template-columns: 1.2fr 1fr .7fr; gap: 0; margin: 0 -28px; border-top: 1px solid #e7d4ae3b; background: #1b2924aa; }
.folio-id-detail { padding: 13px 20px 15px; border-right: 1px solid #f3e0b427; min-width: 0; }
.folio-id-detail:last-child { border-right: 0; }
.folio-id-detail span { color: #bba782; text-transform: uppercase; letter-spacing: .13em; font-size: 11px; font-weight: 750; display: block; }
.folio-id-detail strong { font-size: 15px; font-weight: 650; color: #f3eddf; overflow-wrap: anywhere; }
.folio-panel { background: #fffcf6f2; border: 1px solid #d9d0bd; padding: 22px 23px 24px; min-width: 0; box-shadow: 0 3px 5px #312b2410; }
.folio-section-heading { display: flex; justify-content: space-between; gap: 12px; align-items: end; padding-bottom: 14px; border-bottom: 1px solid #d7cdba; margin-bottom: 18px; }
.folio-kicker { display: block; color: #a37350; font-size: 11px; letter-spacing: .14em; }
.folio-section-heading h3 { font: normal 28px/1.1 var(--serif); margin: 5px 0 0; letter-spacing: -.02em; color: #30352e; }
.folio-heading-aside { flex-shrink: 0; align-self: end; color: #a49a89; text-transform: uppercase; font-size: 11px; letter-spacing: .1em; font-weight: 750; }
.traits-panel { margin: 12px 0 15px; }
.trait-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 9px; }
.trait { min-width: 0; min-height: 116px; display: flex; align-items: center; flex-direction: column; justify-content: center; position: relative; padding: 12px 4px; border: 1px solid #d6cab5; background: linear-gradient(#f6f0e6, #fffdfa); overflow: hidden; }
.trait::before { content: ''; position: absolute; width: 29px; height: 29px; border: 1px solid #dac6a7; top: -18px; left: -18px; transform: rotate(45deg); }
.trait-label { color: #7c7264; font-size: 12px; font-weight: 800; letter-spacing: .055em; text-transform: uppercase; overflow-wrap: anywhere; text-align: center; }
.trait-value { width: 66px; height: 66px; display: grid; place-items: center; margin-top: 9px; color: #333c34; font: normal 33px/1 var(--serif); background: #f9f4e9; border: 1px solid #bba47e; clip-path: polygon(0 13px, 13px 0, calc(100% - 13px) 0, 100% 13px, 100% calc(100% - 13px), calc(100% - 13px) 100%, 13px 100%, 0 calc(100% - 13px)); }
.folio-columns { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 14px; }
.folio-column { min-width: 0; display: flex; flex-direction: column; gap: 14px; }
.folio-columns + .folio-panel, .folio-panel + .folio-panel:not(.folio-column > .folio-panel) { margin-top: 14px; }
.quick-stat-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.quick-stat { min-height: 95px; background: #f0ebdf; border: 1px solid #d5c8ae; padding: 10px 4px 8px; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.quick-stat span { text-transform: uppercase; font-size: 11px; letter-spacing: .075em; font-weight: 800; color: #746e60; text-align: center; }
.quick-stat strong { display: block; color: #2d3d35; font: normal 38px/1.22 var(--serif); margin-top: 3px; }
.resource-stack { margin-top: 21px; display: grid; gap: 17px; }
.folio-counter-top { display: flex; align-items: end; justify-content: space-between; gap: 8px; }
.folio-counter-top span { font-size: 14px; font-weight: 800; color: #4d5149; }
.folio-counter-top strong { font: normal 22px/1 var(--serif); color: #313b34; }
.folio-track { display: flex; flex-wrap: wrap; gap: 5px; padding-top: 10px; }
.folio-track-mark { display: block; width: 17px; height: 17px; border: 1.5px solid #b3a792; background: #faf7ef; }
.folio-track--hope .folio-track-mark { height: 15px; width: 15px; margin: 1px 2px; transform: rotate(45deg); }
.folio-track--hope .folio-track-mark.is-filled { background: #b98249; border-color: #b98249; }
.folio-track--hp .folio-track-mark.is-filled { background: #a95047; border-color: #a95047; }
.folio-track--stress .folio-track-mark.is-filled { background: #64687b; border-color: #64687b; }
.folio-track--armor .folio-track-mark.is-filled { background: #65766e; border-color: #65766e; }
.folio-counter small { color: #978b7c; font-size: 12px; display: block; margin-top: 6px; }
.thresholds { display: flex; align-items: center; justify-content: space-around; gap: 6px; background: #263831; margin-top: 23px; padding: 14px 7px; }
.thresholds > div { text-align: center; min-width: 0; }
.thresholds span:not(.thresholds-rule) { display: block; text-transform: uppercase; color: #cdb995; font-size: 11px; font-weight: 800; letter-spacing: .08em; }
.thresholds strong { display: block; color: #fff5dc; font: normal 34px/1.25 var(--serif); margin-top: 3px; }
.thresholds-rule { font: 24px var(--serif); color: #e2d3ae45; }
.spellcast { margin-top: 12px; display: flex; justify-content: space-between; gap: 12px; padding: 10px 13px; background: #f2ecdf; border-left: 2px solid #ba986b; font-size: 14px; }
.spellcast span { color: #817363; text-transform: capitalize; }
.spellcast strong { color: #39493e; }
.experiences-list { display: grid; }
.experience-entry { display: flex; gap: 12px; align-items: center; justify-content: space-between; padding: 10px 0; border-bottom: 1px solid #eae3d6; }
.experience-entry:last-child { border-bottom: 0; padding-bottom: 0; }
.experience-entry strong { display: block; color: #393b33; font-size: 15px; font-weight: 800; }
.experience-entry small { color: #938879; font-size: 12px; line-height: 1.4; display: block; margin-top: 2px; }
.experience-mod { font: normal 25px/1 var(--serif); background: #e7eee5; color: #405945; border: 1px solid #c3d5c0; min-width: 48px; text-align: center; padding: 8px; }
.equipment-section + .equipment-section { margin-top: 20px; padding-top: 18px; border-top: 1px solid #e8dfd0; }
.equipment-section h4 { color: #9b7755; font-size: 12px; font-weight: 850; text-transform: uppercase; letter-spacing: .15em; margin: 0 0 12px; }
.gear-note { border-left: 2px solid #bb9b74; padding: 8px 10px 8px 14px; background: #f6f1e8; color: #81786a; margin-bottom: 17px; font-size: 14px; }
.gear-note p { margin: 0; }
.weapons-list { display: grid; gap: 10px; }
.weapon-card { border: 1px solid #d2c7b7; padding: 13px; background: linear-gradient(135deg, #fffdf8, #f5efe4); }
.weapon-card-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.weapon-card-top > span:first-child { font-size: 11px; color: #a77451; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.weapon-damage { font-size: 14px; background: #283d33; color: #efe4c9; padding: 4px 9px; letter-spacing: -.015em; font-weight: 750; }
.weapon-card h5 { font: normal 25px/1.2 var(--serif); margin: 7px 0 12px; color: #313a32; }
.weapon-details { display: grid; grid-template-columns: 1fr .9fr .9fr; border-top: 1px solid #ded4c5; padding-top: 10px; gap: 7px; }
.weapon-details span { font-size: 13px; font-weight: 700; min-width: 0; overflow-wrap: anywhere; }
.weapon-details small { display: block; font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; color: #968573; font-weight: 750; margin-bottom: 2px; }
.weapon-notes { font-size: 14px; color: #655e52; padding: 3px 3px 0; }
.weapon-notes ul { padding-left: 16px; }
.prose { overflow-wrap: anywhere; font-size: 15px; line-height: 1.7; color: #524e43; }
.prose p { margin: 0 0 10px; }
.prose p:last-child { margin-bottom: 0; }
.prose strong { color: #353b32; }
.prose em { color: #6b665a; }
.prose ul { margin: 8px 0 9px; padding-left: 19px; }
.prose li { padding-left: 2px; margin-bottom: 6px; }
.prose li::marker { color: #b18e61; }
.prose h3 { margin: 13px 0 8px; font: normal 20px/1.25 var(--serif); color: #38483b; }
.prose h4, .prose h5 { margin: 12px 0 7px; }
.prose .table-wrap { overflow-x: auto; max-width: 100%; border: 1px solid #dfd5c7; }
.prose table { border-collapse: collapse; border-spacing: 0; width: 100%; font-size: 13px; }
.prose th, .prose td { border-bottom: 1px solid #e8dfd0; padding: 8px 10px; text-align: left; }
.prose th { background: #f3ebe0; color: #715f4c; font-size: 11.5px; letter-spacing: .025em; }
.prose a { color: #975f37; text-underline-offset: 2px; }
.feature-group { padding: 0 0 19px; margin-bottom: 19px; border-bottom: 1px solid #e8dfd0; }
.feature-group:last-child { padding-bottom: 0; margin-bottom: 0; border-bottom: 0; }
.feature-group-head { display: flex; align-items: center; gap: 9px; color: #a67552; text-transform: uppercase; font-size: 11px; font-weight: 850; letter-spacing: .16em; }
.feature-group-rule { width: 17px; height: 1px; background: #b1855e; }
.feature-group h4 { margin: 3px 0 10px; font: normal 23px/1.25 var(--serif); color: #2e3b32; }
.feature-group .prose p { margin-bottom: 11px; }
.feature-group .prose p > strong:first-child { color: #3a5744; }
.domain-grid { display: grid; gap: 11px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.domain-card { background: #faf6ed; border: 1px solid #dacdb8; border-top: 3px solid var(--domain-accent, #b69d73); padding: 14px 13px 16px; min-width: 0; position: relative; }
.domain-card::after { content: '✧'; position: absolute; top: 4px; right: 17px; color: var(--domain-accent, #c2a37f); opacity: .27; font-size: 37px; line-height: 1; pointer-events: none; }
.domain--grace { --domain-accent: #a7768d; }
.domain--midnight { --domain-accent: #555b78; }
.domain--arcana { --domain-accent: #657eaf; }
.domain--blade { --domain-accent: #ab6e56; }
.domain--bone { --domain-accent: #9c896d; }
.domain--codex { --domain-accent: #647d6e; }
.domain--sage { --domain-accent: #829065; }
.domain--splendor { --domain-accent: #be9b50; }
.domain--valor { --domain-accent: #a15d4f; }
.domain-topline { display: flex; align-items: center; justify-content: space-between; gap: 8px; position: relative; z-index: 1; padding-right: 34px; } /* clears the decorative ✧ */
.domain-name, .domain-level { color: #8d6c4e; font-weight: 850; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; }
.domain-level { color: #867b6a; }
.domain-card h4 { font: normal 22px/1.2 var(--serif); min-height: 48px; margin: 14px 0 9px; color: #28372d; position: relative; z-index: 1; }
.domain-stats { display: flex; gap: 5px; flex-wrap: wrap; margin: 0 0 14px; }
.domain-stats span { padding: 3px 6px; color: #736857; background: #eee6d6; font-size: 10.5px; letter-spacing: .07em; font-weight: 800; text-transform: uppercase; }
.domain-description { border-top: 1px solid #ded2bd; padding-top: 12px; font-size: 14px; }
.domain-description p { margin-bottom: 10px; }
.vault-fold summary { cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 12px; background: #f1eadc; border: 1px solid #d9cbbb; color: #645747; padding: 13px; font-size: 14px; font-weight: 750; list-style: none; }
.vault-fold summary::-webkit-details-marker { display: none; }
.vault-chevron { border: solid #987852; border-width: 0 2px 2px 0; padding: 4px; transform: rotate(45deg); transition: transform .2s; }
.vault-fold[open] .vault-chevron { transform: rotate(225deg); }
.vault-fold .domain-grid { padding-top: 14px; }
.wide-features-panel { margin-top: 14px; }
.story-panel, .history-panel { margin-top: 14px; }
.story-columns { display: grid; grid-template-columns: 1fr .87fr; gap: 20px; }
.story-prose { font: 16px/1.8 var(--sans); }
.story-prose p { margin-bottom: 11px; }
.connections { background: #f4edde; border-left: 2px solid #bd9461; padding: 13px 15px; }
.connections .folio-kicker { margin-bottom: 7px; }
.history-list { display: grid; gap: 0; padding-left: 8px; }
.history-entry { position: relative; border-left: 1px solid #cdbb9d; padding: 0 0 18px 23px; }
.history-entry:last-child { border-left-color: transparent; padding-bottom: 0; }
.history-dot { position: absolute; top: 2px; left: -6px; border: 2px solid #9b7751; background: #fffcf5; width: 11px; height: 11px; border-radius: 50%; }
.history-entry h4 { margin: -1px 0 5px; color: #9e6d4c; font-size: 14px; letter-spacing: .02em; }
.history-entry .prose p { font-size: 14px; }
.folio-attribution { margin: 14px 3px 0; border: 1px solid #d5ccb9; background: #eae4d8; font-size: 13px; }
.folio-attribution summary { cursor: pointer; color: #7b766c; font-size: 12px; text-transform: uppercase; letter-spacing: .11em; font-weight: 750; padding: 12px 16px; }
.folio-attribution .prose { padding: 3px 16px 16px; font-size: 13px; }
.folio-endmark { text-align: center; color: #a68c67; padding: 16px 0 6px; font: 15px var(--serif); }
.folio-endmark span { font: 800 10px var(--sans); letter-spacing: .18em; padding: 0 11px; }
.folio-fallback { background: var(--paper); border: 1px solid #d0c6b5; padding: 33px; color: #3d3b30; }
.folio-fallback-header { padding-bottom: 18px; border-bottom: 1px solid #c8bfb0; margin-bottom: 20px; }
.folio-fallback-header h2 { font: 34px var(--serif); margin: 4px 0; }
.folio-fallback .prose { font-size: 15px; }

/* Footer and hidden controls */
.site-footer { color: #9aa59c; margin: 57px 0 0; padding: 23px 0 37px; border-top: 1px solid #ffffff1e; max-width: 100%; font-size: 10px; line-height: 1.75; }
.footer-top { display: flex; justify-content: space-between; gap: 14px; align-items: center; margin-bottom: 15px; }
.footer-top > span:last-child { font-size: 9px; letter-spacing: .13em; font-weight: 750; color: #adb8aa; }
.footer-wordmark { font-size: 16px; font-weight: 800; letter-spacing: -.06em; color: #ecede3; }
.footer-wordmark span { color: var(--gold); }
.site-footer p { max-width: 1100px; margin: 6px 0; }
.site-footer a { color: #d5b58b; text-underline-offset: 2px; }
.site-footer .version { color: #66786a; letter-spacing: .03em; margin-top: 13px; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

@media (max-width: 1380px) {
  .folio-columns { grid-template-columns: 1fr; }
  .domain-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 1080px) {
  .workspace { grid-template-columns: minmax(0, 1fr); }
  .workbench { position: relative; } /* keeps the decorative ::before clipped by overflow: hidden */
  .workbench-intro h1 { font-size: 40px; }
  .workbench-intro h1 em { display: inline; }
  .fields { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .workbench-bottom { display: none; }
  .folio-columns { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); }
  .workbench-intro > p { max-width: 580px; }
}
@media (max-width: 840px) {
  .folio-columns { grid-template-columns: 1fr; }
  .topbar-aside { gap: 8px; }
  .topbar-divider, .privacy-tag { display: none; }
  .folio-panel { padding: 19px; }
}
@media (max-width: 600px) {
  .app-frame { padding: 0 12px; }
  .topbar { min-height: 76px; }
  .brand-mark { width: 31px; height: 31px; }
  .brand-wordmark { font-size: 22px; }
  .brand-wordmark small { font-size: 7px; }
  .edition-tag { font-size: 8px; letter-spacing: .08em; }
  .workspace { padding-top: 15px; gap: 29px; }
  .workbench { padding: 24px 19px; }
  .workbench-intro h1 { font-size: 37px; }
  .fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fields label:first-child { grid-column: span 2; }
  .stage-heading { align-items: start; }
  .stage-heading h2 { font-size: 34px; }
  .stage-heading p { max-width: 240px; }
  .stage-menu { padding-top: 18px; }
  .stage-menu .quiet-button { font-size: 10px; padding: 8px; }
  .output-toolbar { padding: 9px; gap: 9px; }
  .view-tabs, .actions { width: 100%; }
  .view-tab, .actions button { flex: 1 1 0; min-width: 0; padding-inline: 8px; }
  .folio-page { padding: 5px; box-shadow: 0 15px 32px #05090740; }
  .folio-identity { padding: 23px 15px 0; }
  .folio-hero-top { gap: 5px; }
  .folio-serial { display: none; }
  .folio-hero-main h2 { font-size: 38px; }
  .folio-concept { font-size: 15px; }
  .level-seal { width: 65px; min-height: 80px; }
  .level-seal strong { font-size: 34px; }
  .folio-identity-meta { margin: 0 -15px; grid-template-columns: 1fr 1fr; }
  .folio-id-detail { padding: 10px 11px; }
  .folio-id-detail:nth-child(3) { grid-column: 1 / -1; border-top: 1px solid #f3e0b427; }
  .folio-id-detail strong { font-size: 14px; }
  .trait-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .trait { min-height: 95px; }
  .trait-value { width: 58px; height: 58px; font-size: 29px; margin-top: 7px; }
  .folio-panel { padding: 15px 13px 17px; }
  .folio-section-heading h3 { font-size: 25px; }
  .folio-heading-aside { display: none; }
  .story-columns, .domain-grid { grid-template-columns: 1fr; }
  .domain-card h4 { min-height: unset; }
  .empty-state { min-height: 490px; padding: 67px 25px 45px; }
  .empty-state h3 { font-size: 32px; }
  .empty-geometry { transform: scale(.8); margin: -10px 0 0; }
  .footer-top { align-items: start; }
  .footer-top > span:last-child { text-align: right; max-width: 185px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition: none !important; animation: none !important; } }
/* ===== Folio v2: readable type, collector-style feature cards, visual controls ===== */
:root { color-scheme: dark; }
html[data-theme="light"] { color-scheme: light; }
html[data-theme="dark"] { color-scheme: dark; }
body { font-size: 16px; line-height: 1.65; }
.small-caps, .eyebrow-line, .edition-tag, .privacy-tag, .folio-kicker { font-size: 12px; letter-spacing: .10em; }
.brand-wordmark small { font-size: 10px; }
.workbench-intro > p, .stage-heading p, .empty-state p { font-size: 15px; line-height: 1.75; }
.field-section-heading { font-size: 12px; }
.controls label:not(.checkbox) { font-size: 14px; }
.controls select { font-size: 15px; min-height: 46px; }
.field-hint, .checkbox-copy small, .workbench-bottom p { font-size: 13px; }
.checkbox-copy strong { font-size: 15px; }
.bench-note { font-size: 11px; }
.primary-button { font-size: 15px; min-height: 56px; }
.error { font-size: 14px; }
.quiet-button, .download-button { font-size: 14px; min-height: 42px; }
.view-tab { font-size: 14px; }
.source-view pre { font-size: 15px; line-height: 1.8; }
.source-view-header { font-size: 12px; }
.folio-eyebrow, .folio-serial, .folio-id-detail span, .folio-kicker { font-size: 12px; }
.folio-heading-aside { font-size: 12px; }
.folio-id-detail strong { font-size: 16px; }
.trait-label { font-size: 14px; }
.quick-stat span { font-size: 12px; }
.folio-counter-top span { font-size: 17px; }
.folio-counter small { font-size: 13px; }
.thresholds span:not(.thresholds-rule) { font-size: 12px; }
.spellcast { font-size: 15px; }
.experience-entry strong { font-size: 16px; }
.experience-entry small { font-size: 13px; }
.equipment-section h4 { font-size: 13px; }
.gear-note, .weapon-notes { font-size: 15px; }
.weapon-card-top > span:first-child, .weapon-details small { font-size: 12px; }
.weapon-details span { font-size: 14px; }
.weapon-damage { font-size: 15px; }
.prose, .story-prose { font-size: 16px; line-height: 1.75; }
.prose table { font-size: 14px; }
.prose th { font-size: 13px; }
.domain-name, .domain-level, .domain-stats span { font-size: 12px; }
.domain-description { font-size: 16px; }
.domain-card h4 { font-size: 24px; min-height: unset; }
.history-entry h4, .history-entry .prose p { font-size: 15px; }
.folio-attribution, .folio-attribution .prose, .folio-attribution summary { font-size: 13px; }
.folio-endmark span { font-size: 12px; }
.site-footer, .footer-top > span:last-child { font-size: 12px; }
.privacy-tag { white-space: nowrap; }
@media (min-width: 1081px) {
  .workbench { max-height: calc(100dvh - 36px); overflow-y: auto; scrollbar-width: thin; scrollbar-color: #a78d65 transparent; }
}
/* A visually grouped collection of individual heritage, class and subclass cards. */
.feature-group { margin: 0 0 21px; padding: 0 0 23px; border-bottom: 1px solid #d9cdb8; }
.feature-group:last-child { margin-bottom: 0; padding-bottom: 0; border-bottom: 0; }
.feature-group-head { font-size: 12px; letter-spacing: .13em; }
.feature-group h4 { font-size: 23px; margin: 5px 0 15px; }
.feature-card-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
.feature-card { position: relative; isolation: isolate; min-width: 0; border: 1px solid #d9c5a7; border-top: 3px solid var(--feature-accent, #a9875f); padding: 16px 17px 17px; background: linear-gradient(148deg, #fffefa, #f7f0e5); box-shadow: 0 3px 12px #523b200c; transition: border-color .16s, transform .16s, box-shadow .16s; }
.feature-card::before { content: ''; pointer-events: none; position: absolute; inset: 5px; border: 1px solid #bfa98a24; }
.feature-card:hover { border-color: #ad8559; transform: translateY(-1px); box-shadow: 0 5px 17px #523b2022; }
.feature-card--ancestry { --feature-accent: #608f78; }
.feature-card--community { --feature-accent: #608195; }
.feature-card--class { --feature-accent: #b1844c; }
.feature-card--subclass { --feature-accent: #946887; }
.feature-card--transformation { --feature-accent: #a9695b; }
.feature-card-top { display:flex; justify-content:space-between; gap: 8px; margin-bottom:10px; font-size: 12px; font-weight: 800; letter-spacing:.14em; text-transform:uppercase; color:#926d4e; }
.feature-card-top span:last-child { font-size:19px; line-height:1; color:var(--feature-accent, #b89b77); }
.feature-card h5 { font: normal 24px/1.17 var(--serif); margin: 0 0 12px; color: #283b33; overflow-wrap:anywhere; }
.feature-card .prose { position:relative; font-size:16px; line-height:1.75; }
.feature-card .prose p { margin:0 0 11px; }
.feature-card .prose :last-child { margin-bottom: 0; }
.feature-card .prose ul { margin:9px 0 0; padding-left:22px; }
.feature-reference { background:#f9f5ed; border:1px solid #d9cbb5; padding:16px 18px; }
.feature-reference table { min-width:450px; }
.wide-features-panel .feature-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.domain-card { padding: 17px; box-shadow: 0 3px 14px #4d3b2014; }
.domain-card .prose { font-size: 16px; }
.domain--dread { --domain-accent: #8b5c90; }
/* Actual toggle buttons instead of passive ink marks, with touch-sized hit targets. */
.folio-track { gap: 7px; }
.folio-track-mark { appearance:none; cursor:pointer; width: 34px; height: 34px; flex: 0 0 34px; border: 2px solid #baaf9c; background: #fffdf6; border-radius: 8px; display:grid; place-items:center; position:relative; transition:transform .14s, background .14s, border-color .14s, box-shadow .14s; }
.folio-track-mark:hover { border-color:#aa8759; transform:translateY(-2px); }
.folio-track-mark:active { transform:scale(.94); }
.folio-track-mark.is-filled { color:#fff; }
.folio-track-mark.is-filled::after { content:'✓'; font:bold 18px/1 var(--sans); color:#fffdf7; }
.folio-track--hope .folio-track-mark { width:34px; height:34px; margin:0; transform:none; border-radius:8px; }
.folio-track--hope .folio-track-mark::before { content:'✦'; color:#b88c52; font-size:18px; line-height:1; }
.folio-track--hope .folio-track-mark.is-filled::before { color:#fff2da; }
.folio-track--hope .folio-track-mark.is-filled::after { content:none; }
.folio-track--hope .folio-track-mark:hover { transform:translateY(-2px); }
.folio-track--hp .folio-track-mark.is-filled { background:#a95047; border-color:#a95047; }
.folio-track--stress .folio-track-mark.is-filled { background:#64687b; border-color:#64687b; }
.folio-track--armor .folio-track-mark.is-filled { background:#65766e; border-color:#65766e; }
.folio-track--hope .folio-track-mark.is-filled { background:#b98249; border-color:#b98249; }
.special-resources { margin-top:23px; padding-top:16px; border-top:1px solid #d8cbb6; }
.special-resources > h4 { margin:0 0 13px; font:normal 21px/1.3 var(--serif); color:#3b4b41; }
.special-resources > h4 span { display:block; margin-top:3px; color:#8a806e; font:700 12px/1.4 var(--sans); text-transform:uppercase; letter-spacing:.08em; }
.special-resource-grid { display:grid; gap:10px; }
.special-resource-card { border:1px solid #d9c9b1; padding:13px 14px 14px; background:#f5eee3; }
.special-resource-head { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.special-resource-head > div { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.special-resource-label { font-size:15px; font-weight:800; color:#435247; }
.special-resource-head small { font-size:12px; padding:2px 7px; border:1px solid #d0c1a8; color:#937552; }
.special-resource-head strong { font:normal 21px/1.15 var(--serif); color:#3c4e40; white-space:nowrap; }
.special-resource-card .folio-track { padding-top:11px; }
.special-resource-detail { display:block; color:#887c6d; font-size:12px; margin-top:8px; }
.special-resource-card .folio-track-mark { width:33px; height:33px; flex-basis:33px; }
.special-resource-card .folio-track-mark.is-filled { background:#677b71; border-color:#677b71; }
.die-control { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:9px; }
.die-control > button { width:39px; height:39px; border:1px solid #c3a980; background:#fffaf0; font-size:25px; line-height:1; color:#516451; border-radius:6px; }
.die-control > button:hover:not(:disabled) { background:#e9dac0; }
.die-control strong { font:normal 30px/1 var(--serif); }
/* The editable footnote lives at the bottom of the actual folio. */
.notes-panel { margin-top:14px; background:linear-gradient(150deg, #fffdf8, #f6eee0); }
.notes-label { display:block; margin-bottom:11px; font-weight:750; font-size:15px; color:#425245; }
[data-session-notes] { display:block; width:100%; min-height:195px; padding:16px 17px; resize:vertical; border:1px solid #c6b49b; border-radius:4px; outline-offset:3px; background: #fffdfa; color:#302d27; font: 16px/1.8 var(--sans); }
[data-session-notes]::placeholder { color:#9f917f; }
.notes-hint { margin:11px 0 0; color:#877b6d; font-size:13px; line-height:1.65; }
.theme-toggle { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:42px; border:1px solid #af9878; background:#f0d9b4; color:#2b2c25; border-radius:5px; padding:8px 12px; font-size:14px; font-weight:800; white-space:nowrap; cursor:pointer; }
.theme-toggle:hover { background:#f8e5c9; }
.theme-toggle [data-theme-symbol] { font-size:20px; line-height:1; }
.topbar-controls { display:flex; align-items:center; gap:10px; }
.support-link { text-decoration:none; }
/* The light theme includes the generator shell, not only the paper sheet. */
html[data-theme="light"] body { color:#283a31; background:#e9e5db; }
html[data-theme="light"] .ambient-glow { background:radial-gradient(ellipse 72% 60% at 55% -5%, #f7f2e7, transparent 85%); }
html[data-theme="light"] .topbar, html[data-theme="light"] .site-footer { border-color:#cdbfa9; }
html[data-theme="light"] .brand-wordmark, html[data-theme="light"] .stage-heading h2 { color:#273a32; }
html[data-theme="light"] .brand-wordmark small, html[data-theme="light"] .topbar-aside, html[data-theme="light"] .privacy-tag, html[data-theme="light"] .stage-heading p { color:#5f7265; }
html[data-theme="light"] .edition-tag { color:#79603e; }
html[data-theme="light"] .topbar-divider { background:#b5aa97; }
html[data-theme="light"] .workbench { background:linear-gradient(154deg, #fffdf7, #eae6da); border-color:#cabdaa; box-shadow:0 14px 32px #4a3c2b15; }
html[data-theme="light"] .workbench::before { border-color:#bea2774b; }
html[data-theme="light"] .workbench-intro h1 { color:#263b33; }
html[data-theme="light"] .workbench-intro h1 em { color:#9a6637; }
html[data-theme="light"] .workbench-intro > p, html[data-theme="light"] .workbench-bottom p { color:#5a6558; }
html[data-theme="light"] .field-section-heading, html[data-theme="light"] .workbench-bottom { border-color:#d4c9b6; }
html[data-theme="light"] .field-section-heading { color:#906c44; }
html[data-theme="light"] .field-section-heading span:last-child, html[data-theme="light"] .bench-note { color:#768276; }
html[data-theme="light"] .controls label:not(.checkbox), html[data-theme="light"] .checkbox-copy strong { color:#2b3e33; }
html[data-theme="light"] .controls select { background-color:#fffbf5; border-color:#bfb4a2; color:#25382c; }
html[data-theme="light"] .controls select option { background:#fffdf8; color:#25382c; }
html[data-theme="light"] .controls select:disabled { color:#667469; }
html[data-theme="light"] .field-hint, html[data-theme="light"] .checkbox-copy small { color:#5d7466; }
html[data-theme="light"] .workbench-bottom p strong { color:#2e453a; }
html[data-theme="light"] .stage-heading h2 em { color:#93673d; }
html[data-theme="light"] .output-toolbar { background:#f5eee1; border-color:#cfbea7; }
html[data-theme="light"] .view-tab { color:#596b5d; }
html[data-theme="light"] .view-tab.is-active { background:#2c4b3c; color:#fff2de; }
html[data-theme="light"] .quiet-button { color:#344b3d; background:#faf6ef; border-color:#bdb09e; }
html[data-theme="light"] .quiet-button:hover { background:#ece1d0; }
html[data-theme="light"] .download-button { background:#b78750; color:#fff9f2; border-color:#b78750; }
html[data-theme="light"] .download-button:hover { background:#976632; }
html[data-theme="light"] .empty-state { background:radial-gradient(ellipse 55% 50% at 50% 30%, #e4d9bf, transparent 96%),#f8f4ea; color:#2e3f34; border-color:#cbb99b; }
html[data-theme="light"] .empty-state::before, html[data-theme="light"] .empty-state::after { border-color:#bba57d66; }
html[data-theme="light"] .empty-state p, html[data-theme="light"] .empty-bottom { color:#69776a; }
html[data-theme="light"] .site-footer, html[data-theme="light"] .footer-top > span:last-child, html[data-theme="light"] .site-footer .version { color:#596c5c; }
html[data-theme="light"] .footer-wordmark { color:#2a4537; }
html[data-theme="light"] .site-footer a { color:#85552e; }
/* A true dark character sheet, including the cards and reference text. */
html[data-theme="dark"] { --parchment:#1a2523; --paper:#222c29; --paper-ink:#f0e6d8; --paper-muted:#b4afa3; --paper-line:#566056; }
html[data-theme="dark"] .folio-page { border-color:#536353; box-shadow:0 25px 65px #0006, inset 0 0 0 8px #22302b; }
html[data-theme="dark"] .folio-page::before { opacity:.1; }
html[data-theme="dark"] .folio-panel, html[data-theme="dark"] .folio-fallback { background:#27332e; border-color:#596253; }
html[data-theme="dark"] .folio-section-heading, html[data-theme="dark"] .feature-group, html[data-theme="dark"] .special-resources { border-color:#566358; }
html[data-theme="dark"] .folio-section-heading h3, html[data-theme="dark"] .feature-group h4, html[data-theme="dark"] .special-resources > h4 { color:#fff1db; }
html[data-theme="dark"] .folio-heading-aside, html[data-theme="dark"] .special-resources > h4 span { color:#b8afa0; }
html[data-theme="dark"] .folio-kicker, html[data-theme="dark"] .feature-group-head, html[data-theme="dark"] .feature-card-top { color:#d9b587; }
html[data-theme="dark"] .trait { background:linear-gradient(#33433a, #2d3932); border-color:#607161; }
html[data-theme="dark"] .trait::before { border-color:#8d8c72; }
html[data-theme="dark"] .trait-label, html[data-theme="dark"] .quick-stat span { color:#d1c6b4; }
html[data-theme="dark"] .trait-value { background:#1e2c26; border-color:#bc9d70; color:#ffeacc; }
html[data-theme="dark"] .quick-stat, html[data-theme="dark"] .special-resource-card { background:#344238; border-color:#607161; }
html[data-theme="dark"] .quick-stat strong, html[data-theme="dark"] .folio-counter-top span, html[data-theme="dark"] .folio-counter-top strong { color:#fff0d9; }
html[data-theme="dark"] .folio-counter small, html[data-theme="dark"] .special-resource-detail { color:#c2b9a9; }
html[data-theme="dark"] .folio-track-mark { background:#202b27; border-color:#7b8b7b; }
html[data-theme="dark"] .folio-track-mark:hover { border-color:#e4b779; }
html[data-theme="dark"] .spellcast, html[data-theme="dark"] .connections { background:#35423a; border-color:#aa8b63; }
html[data-theme="dark"] .spellcast span, html[data-theme="dark"] .special-resource-head small { color:#dbc3a5; }
html[data-theme="dark"] .spellcast strong, html[data-theme="dark"] .special-resource-label, html[data-theme="dark"] .special-resource-head strong { color:#fff4e3; }
html[data-theme="dark"] .special-resource-head small { border-color:#778171; }
html[data-theme="dark"] .die-control > button { background:#25362d; border-color:#80917e; color:#f3d3a5; }
html[data-theme="dark"] .die-control > button:hover:not(:disabled) { background:#405044; }
html[data-theme="dark"] .experience-entry { border-color:#536357; }
html[data-theme="dark"] .experience-entry strong, html[data-theme="dark"] .prose, html[data-theme="dark"] .story-prose, html[data-theme="dark"] .folio-fallback { color:#eae4d9; }
html[data-theme="dark"] .experience-entry small { color:#bcb4a6; }
html[data-theme="dark"] .prose strong { color:#fff3e0; }
html[data-theme="dark"] .prose em, html[data-theme="dark"] .prose code { color:#ddd2c0; }
html[data-theme="dark"] .feature-group .prose p > strong:first-child { color:#b4dcc0; }
html[data-theme="dark"] .experience-mod { color:#eaf6e7; background:#415a48; border-color:#6c886f; }
html[data-theme="dark"] .equipment-section { border-color:#536357; }
html[data-theme="dark"] .gear-note, html[data-theme="dark"] .weapon-card, html[data-theme="dark"] .feature-card, html[data-theme="dark"] .domain-card, html[data-theme="dark"] .feature-reference { background:linear-gradient(145deg,#334036,#2b3730); border-color:#697767; color:#f1e7d8; }
html[data-theme="dark"] .gear-note { color:#e3d8c9; border-left-color:#bc9c74; }
html[data-theme="dark"] .weapon-card h5, html[data-theme="dark"] .feature-card h5, html[data-theme="dark"] .domain-card h4 { color:#ffedd4; }
html[data-theme="dark"] .weapon-card-top > span:first-child, html[data-theme="dark"] .equipment-section h4, html[data-theme="dark"] .weapon-details small, html[data-theme="dark"] .domain-name, html[data-theme="dark"] .domain-level { color:#e3bf91; }
html[data-theme="dark"] .weapon-damage { background:#15271e; }
html[data-theme="dark"] .feature-card { border-top-color:var(--feature-accent); }
html[data-theme="dark"] .feature-card::before { border-color:#c1a47d1c; }
html[data-theme="dark"] .feature-card .prose, html[data-theme="dark"] .domain-description { color:#e8dfd3; }
html[data-theme="dark"] .domain-card { border-top-color:var(--domain-accent); }
html[data-theme="dark"] .domain-stats span { color:#e0cfb2; background:#415046; }
html[data-theme="dark"] .domain-description, html[data-theme="dark"] .prose td, html[data-theme="dark"] .folio-fallback-header { border-color:#607060; }
html[data-theme="dark"] .prose th { background:#405145; color:#f6dfbd; }
html[data-theme="dark"] .prose a { color:#f5c58e; }
html[data-theme="dark"] .vault-fold summary, html[data-theme="dark"] .folio-attribution { background:#354136; border-color:#65705b; color:#f0dec6; }
html[data-theme="dark"] .vault-fold summary, html[data-theme="dark"] .folio-attribution summary { color:#f0dec6; }
html[data-theme="dark"] .history-entry { border-color:#8d806b; }
html[data-theme="dark"] .history-entry h4 { color:#e7bd8b; }
html[data-theme="dark"] .history-dot { background:#28392d; }
html[data-theme="dark"] .notes-panel { background:linear-gradient(130deg,#2b3830,#26312b); }
html[data-theme="dark"] .notes-label, html[data-theme="dark"] .notes-hint { color:#e4d5bf; }
html[data-theme="dark"] [data-session-notes] { background:#1f2d27; border-color:#6e806d; color:#fff5e8; }
html[data-theme="dark"] [data-session-notes]::placeholder { color:#9cae9e; }
@media (max-width: 1080px) { .workbench { max-height: none; } }
@media (max-width: 600px) {
  .topbar { flex-wrap:wrap; padding:14px 0; gap:9px; }
  .topbar-controls { margin-left:auto; }
  .edition-tag, .topbar-divider { display:none; }
  .folio-counter-top span { font-size:16px; }
  .folio-panel { padding:17px 13px 20px; }
  .wide-features-panel .feature-card-grid { grid-template-columns:1fr; }
  .feature-card h5 { font-size:23px; }
  .folio-hero-main h2 { font-size: clamp(31px, 8vw, 43px); }
  .folio-id-detail strong { font-size:15px; }
  .stage-menu .quiet-button { font-size:13px; }
  .folio-track-mark { flex-basis:34px; }
}

@media (max-width: 360px) {
  .view-tab, .actions button { font-size: 13px; }
}

@media print {
  body { background: white; color: black; }
  .ambient-glow, .topbar, .workbench, .stage-heading, .output-toolbar, .site-footer, .source-view, .empty-state { display: none !important; }
  .app-frame { max-width: none; padding: 0; }
  .workspace { display: block; padding: 0; }
  .folio-page { border: 0; box-shadow: none; padding: 0; background: white; }
  .folio-page::before { display: none; }
  .folio-panel, .domain-card, .feature-group, .weapon-card { break-inside: avoid; }
  .folio-columns { grid-template-columns: 1fr 1fr; }
  .folio-identity { print-color-adjust: exact; -webkit-print-color-adjust: exact; }
  .folio-attribution { display: none; }
}