:root{
  --bg:#09090d;--panel:#15131b;--panel2:#1d1724;--text:#f4efe7;--muted:#a89ead;
  --gold:#c7a347;--gold2:#e2c66f;--purple:#7a43b6;--line:rgba(199,163,71,.28);
  --green:#79c58a;--red:#d06b6b;--blue:#70a4d7;
}
*{box-sizing:border-box}
html{background:#07070a}
body{
  margin:0;
  color:var(--text);
  font-family:Georgia,'Times New Roman',serif;
  min-height:100vh;
  background:
    linear-gradient(90deg,rgba(6,5,9,.32),rgba(6,5,9,.20) 38%,rgba(6,5,9,.30)),
    linear-gradient(180deg,rgba(5,4,7,.20),rgba(5,4,7,.50)),
    url('TKBG.webp') center top / cover fixed no-repeat,
    #09090d;
}
button,input,select,textarea{font:inherit}
button,a{cursor:pointer}
.site-header{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:20px clamp(16px,4vw,56px);border-bottom:1px solid var(--line);background:rgba(7,7,10,.96);position:sticky;top:0;z-index:50}
.site-header h1{margin:0;color:var(--gold2);font-family:Cinzel,Georgia,serif;font-size:clamp(1.8rem,4vw,2.8rem)}
.subtitle{margin:.25rem 0 0;color:#d7cfda}.eyebrow{margin:0 0 6px;color:#b48bd4;font:700 .68rem Arial,sans-serif;letter-spacing:.17em}
.header-actions,.button-row,.three-action{display:flex;flex-wrap:wrap;gap:8px}
main{max-width:1280px;margin:auto;padding:22px 14px 90px}
.button{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:9px 13px;border:1px solid var(--gold);background:#111016;color:var(--gold2);text-decoration:none;font-weight:700}
.button.primary{background:linear-gradient(#dec468,#a97e2d);color:#100e12}.button.secondary{background:#111016}.button.danger{border-color:#8e4545;color:#ffb7b7}.button.small{min-height:34px;padding:5px 9px;font-size:.78rem}.button.full{width:100%;margin-top:7px}
.hero-copy{max-width:800px;padding:38px 4px 20px}.hero-copy h2{font:700 clamp(2rem,5vw,4rem) Cinzel,Georgia,serif;color:var(--gold2);margin:.2rem 0 1rem}.hero-copy p{font-size:1.08rem;line-height:1.7;color:#d3cbd7}
.start-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.start-card{min-height:190px;padding:22px;border:1px solid var(--line);background:linear-gradient(145deg,#17131d,#0e0d12);color:var(--text);text-align:left;text-decoration:none;display:flex;flex-direction:column;align-items:flex-start;gap:9px}
.start-card:hover{border-color:var(--gold2)}.start-card.featured{border-color:rgba(122,67,182,.75);box-shadow:inset 0 0 28px rgba(122,67,182,.09)}
.start-card strong{font:700 1.12rem Cinzel,Georgia,serif;color:var(--gold2)}.start-card span{color:var(--muted);line-height:1.5}.start-card b{margin-top:auto;color:#d9c2ed}.start-icon{font-size:1.6rem!important;color:#d9c2ed!important}
.local-resume{margin-top:16px;padding:20px;border:1px solid var(--gold);background:#15131b;display:flex;justify-content:space-between;gap:15px;align-items:center}
.campaign-bar{display:flex;justify-content:space-between;gap:14px;align-items:end;margin-bottom:14px;padding:12px 16px;border:1px solid var(--line);background:#121017}.campaign-name-input{font:700 1.45rem Cinzel,Georgia,serif!important;color:var(--gold2)!important}.campaign-name-input,.party-name-input{border:0;border-bottom:1px solid rgba(199,163,71,.2);background:transparent;padding:5px 0;min-height:0}.party-name-input{color:#cbc1cd}.save-status{color:var(--muted);font-size:.8rem}
.tabs{display:flex;gap:7px;overflow-x:auto;padding-bottom:9px;margin-bottom:8px;-webkit-overflow-scrolling:touch}.tab{flex:0 0 auto;min-height:43px;padding:8px 13px;border:1px solid var(--line);background:#0e0d12;color:#cec4d1;font-weight:700}.tab.active{background:linear-gradient(#dec468,#a97e2d);color:#100e12}
.tab-panel{display:none}.tab-panel.active{display:block}
.panel{padding:20px;border:1px solid var(--line);background:linear-gradient(145deg,var(--panel2),var(--panel));margin-bottom:14px}
.panel h2{font-family:Cinzel,Georgia,serif;color:var(--gold2);margin:.1rem 0 .6rem}.section-heading,.dialog-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.dashboard-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-bottom:14px}.metric{padding:16px;border:1px solid var(--line);background:#111016}.metric strong{display:block;font:bold 2rem Arial,sans-serif;color:var(--gold2)}.metric span{color:var(--muted)}
.character-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}.character-card{border:1px solid var(--card-accent,var(--gold));background:var(--card-bg,#211629);padding:14px;position:relative;overflow:hidden}.character-card::before{content:"";position:absolute;inset:0 0 auto;height:4px;background:var(--card-accent,var(--gold))}
.character-top{display:flex;gap:13px;align-items:center}.character-image{width:82px;height:82px;border-radius:50%;object-fit:cover;border:2px solid var(--card-accent,var(--gold));background:#08070b}.character-image.placeholder{display:grid;place-items:center;color:var(--muted);font-size:.7rem;text-align:center}
.character-card h3{margin:0;color:#fff;font-family:Cinzel,Georgia,serif}.character-sub{color:#d3c8d6;font-size:.86rem;margin-top:4px}.character-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:12px 0}.character-stat{padding:8px;background:rgba(0,0,0,.22);text-align:center}.character-stat span{display:block;color:#aaa0ad;font-size:.66rem}.character-stat strong{color:#fff}
.hp-bar{height:8px;background:rgba(0,0,0,.4);overflow:hidden;margin:8px 0}.hp-fill{height:100%;background:var(--green)}.card-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}.card-actions .button{flex:1 1 auto}
.field{display:flex;flex-direction:column;gap:6px;margin-bottom:12px;color:var(--gold2);font-weight:700}input,select,textarea{width:100%;min-height:43px;padding:9px 10px;border:1px solid var(--line);background:#09080c;color:var(--text)}textarea{resize:vertical;line-height:1.5}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:10px}.three-col{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.four-col{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.entry-list,.quest-list{display:grid;gap:9px}.entry-card,.quest-card{padding:14px;border:1px solid rgba(255,255,255,.08);background:#0e0d12}.entry-title,.quest-title{color:var(--gold2);font-weight:700;font-size:1.04rem}.entry-meta,.quest-meta{color:var(--muted);font-size:.78rem;margin-top:4px}.entry-body{white-space:pre-wrap;line-height:1.55;margin-top:9px}
.status-badge{display:inline-flex;padding:4px 7px;border-radius:999px;font:bold .67rem Arial,sans-serif;text-transform:uppercase}.status-active{background:rgba(199,163,71,.16);color:#ebd88d}.status-completed{background:rgba(80,150,94,.18);color:#a9e7b5}.status-failed{background:rgba(170,70,70,.18);color:#f1aaaa}
.status-toggle{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.status-toggle button{min-height:40px;border:1px solid var(--line);background:#0c0b10;color:#bfb5c2}.status-toggle button.active[data-status-choice="active"]{background:#6f5822;color:#fff}.status-toggle button.active[data-status-choice="completed"]{background:#316e3d;color:#fff}.status-toggle button.active[data-status-choice="failed"]{background:#7f3434;color:#fff}
.assignee-row{display:grid;grid-template-columns:1fr auto;gap:7px;margin-bottom:7px}.filter-row{display:flex;gap:7px;flex-wrap:wrap;margin:12px 0}.filter{min-height:36px;padding:6px 10px;border:1px solid var(--line);background:#0c0b10;color:#c6bbc8}.filter.active{border-color:var(--gold2);color:var(--gold2)}
.empty-state{padding:25px;text-align:center;color:var(--muted);border:1px dashed rgba(255,255,255,.09)}.hidden{display:none!important}
dialog{width:min(760px,calc(100% - 20px));max-height:calc(100dvh - 20px);overflow:auto;padding:0;border:1px solid var(--gold);background:#15121a;color:var(--text)}dialog.large-dialog{width:min(1050px,calc(100% - 20px))}dialog::backdrop{background:rgba(0,0,0,.78)}.dialog-card{padding:20px}.icon-button{width:38px;height:38px;border:1px solid var(--line);background:#0d0c11;color:var(--gold2);font-size:1.2rem}
.character-edit-layout{display:grid;grid-template-columns:210px 1fr;gap:18px}.portrait-preview{height:210px;border:1px solid var(--line);background:#09080c;display:grid;place-items:center;overflow:hidden;color:var(--muted)}.portrait-preview img{width:100%;height:100%;object-fit:cover}
.sheet-header{display:flex;gap:18px;align-items:center}.sheet-header img{width:120px;height:120px;border-radius:50%;object-fit:cover;border:2px solid var(--gold)}.sheet-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:16px 0}.sheet-stat{padding:12px;text-align:center;background:#0d0c11;border:1px solid rgba(255,255,255,.07)}.sheet-stat span{display:block;color:var(--muted);font-size:.68rem}.sheet-stat strong{font:bold 1.4rem Arial,sans-serif}
.sheet-section{padding:14px;border:1px solid rgba(255,255,255,.08);background:#0e0d12;margin-top:10px}.sheet-section h3{color:var(--gold2);margin:0 0 9px}.quick-hp{display:flex;flex-wrap:wrap;gap:6px}.quick-hp button{min-width:50px}.condition-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.condition-check{display:flex;gap:6px;align-items:center;padding:7px;border:1px solid rgba(255,255,255,.07);font-size:.78rem}.condition-check input{width:18px;height:18px;min-height:0}.death-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.death-row{padding:10px;background:#09080c}.death-dots{display:flex;gap:6px}.death-dot{width:36px;height:36px;border-radius:50%;border:1px solid var(--line);background:#111016;color:#aaa}.death-dot.active.success{background:#2f7b40;color:white}.death-dot.active.failure{background:#883b3b;color:white}
.inventory-list,.spell-list{display:grid;gap:6px}.inventory-item,.spell-item{padding:8px 10px;border:1px solid rgba(255,255,255,.06);background:#09080c}.inventory-item strong,.spell-item strong{color:#eee}.import-main{max-width:1000px}.instructions ol{line-height:1.8}.import-status{min-height:22px;color:#d9c2ed}
@media(max-width:950px){.dashboard-grid{grid-template-columns:repeat(2,1fr)}.character-edit-layout{grid-template-columns:1fr}.portrait-preview{width:min(250px,100%)}.four-col{grid-template-columns:1fr 1fr}.condition-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){body{font-size:16px}.site-header{position:static;align-items:flex-start;flex-direction:column;padding:14px}.header-actions{width:100%}.header-actions .button{flex:1}.start-grid{grid-template-columns:1fr}.local-resume{align-items:flex-start;flex-direction:column}.campaign-bar{align-items:flex-start;flex-direction:column}.tabs{margin-left:-4px;margin-right:-4px}.panel{padding:14px}.section-heading{flex-direction:column}.section-heading .button-row,.section-heading>.button{width:100%}.section-heading .button-row .button{flex:1}.dashboard-grid{grid-template-columns:1fr 1fr}.character-grid{grid-template-columns:1fr}.two-col,.three-col,.four-col,.sheet-stats,.death-grid{grid-template-columns:1fr}.condition-grid{grid-template-columns:1fr 1fr}.three-action,.button-row{flex-direction:column}.three-action .button,.button-row .button{width:100%}.status-toggle{grid-template-columns:1fr}.sheet-header{align-items:flex-start;flex-direction:column}}


/* Tomekeeper v0.2 D&D Beyond import refinements */
.import-page .site-header{position:static}
.import-page .import-main{padding-top:24px}
.ddb-detail-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;margin:10px 0}
.ddb-detail{padding:8px;background:rgba(0,0,0,.22);text-align:center;border:1px solid rgba(255,255,255,.05)}
.ddb-detail span{display:block;color:var(--muted);font:700 .6rem Arial,sans-serif;letter-spacing:.08em}
.ddb-detail strong{display:block;margin-top:3px;color:#fff}
.ability-strip{display:grid;grid-template-columns:repeat(6,1fr);gap:5px;margin-top:10px}
.ability-mini{padding:7px 4px;text-align:center;border:1px solid rgba(255,255,255,.06);background:#0b0a0e}
.ability-mini span{display:block;color:var(--muted);font:.58rem Arial,sans-serif}
.ability-mini strong{color:#fff}
.sheet-wide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.sheet-list{display:grid;gap:5px}
.sheet-list-row{display:grid;grid-template-columns:1fr auto;gap:10px;padding:7px 9px;border:1px solid rgba(255,255,255,.06);background:#09080c}
.sheet-list-row strong{color:#eee}
.sheet-list-row span{color:var(--muted)}
.source-note{margin-top:8px;color:var(--muted);font-size:.72rem;line-height:1.45}
@media(max-width:800px){
  .ddb-detail-grid{grid-template-columns:repeat(2,1fr)}
  .ability-strip{grid-template-columns:repeat(3,1fr)}
  .sheet-wide-grid{grid-template-columns:1fr}
}


/* Tomekeeper v0.4: normalize imported character portraits */
.character-image {
  width: 72px !important;
  height: 72px !important;
  min-width: 72px !important;
  min-height: 72px !important;
  max-width: 72px !important;
  max-height: 72px !important;
  flex: 0 0 72px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  object-position: center center !important;
  overflow: hidden !important;
  display: block !important;
}

.character-image.placeholder {
  display: grid !important;
  place-items: center !important;
}

.character-top {
  align-items: center !important;
}

/* Main Tomekeeper sheet portrait gets the same crop behavior, just larger. */
.sheet-header img {
  width: 120px !important;
  height: 120px !important;
  min-width: 120px !important;
  min-height: 120px !important;
  max-width: 120px !important;
  max-height: 120px !important;
  flex: 0 0 120px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  object-position: center center !important;
}


/* Tomekeeper v0.6: downloaded local backup system */
.backup-cluster{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:4px;
}
.backup-status{
  color:#cbbfcf;
  font-size:.72rem;
}
.dashboard-backup-banner{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:14px;
  padding:14px 16px;
  margin-bottom:14px;
  border:1px solid rgba(199,163,71,.45);
  background:linear-gradient(135deg,rgba(199,163,71,.08),rgba(122,67,182,.08));
}
.dashboard-backup-banner strong{
  color:#f2e5b4;
}
.backup-reminder{
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:999;
  width:min(440px,calc(100% - 36px));
  display:grid;
  grid-template-columns:1fr auto auto;
  gap:10px;
  align-items:center;
  padding:14px;
  border:1px solid var(--gold);
  background:#16121b;
  box-shadow:0 16px 40px rgba(0,0,0,.55);
}
.backup-reminder strong{
  display:block;
  color:var(--gold2);
  margin-bottom:3px;
}
.backup-reminder span{
  color:var(--muted);
  font-size:.8rem;
  line-height:1.4;
}
@media(max-width:640px){
  .backup-cluster{align-items:flex-start}
  .dashboard-backup-banner{align-items:flex-start;flex-direction:column}
  .dashboard-backup-banner .button{width:100%}
  .backup-reminder{
    left:10px;
    right:10px;
    bottom:10px;
    width:auto;
    grid-template-columns:1fr auto;
  }
  .backup-reminder .button{
    grid-column:1/-1;
    width:100%;
  }
}


/* Tomekeeper v0.7: D&D Beyond importer character cards
   Keep all six abilities visible without clipping. */
.import-page #ddbCharacterList.character-grid {
  grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)) !important;
  align-items: stretch;
}

.import-page #ddbCharacterList .character-card {
  min-width: 0 !important;
  overflow: hidden !important;
}

.import-page #ddbCharacterList .ability-strip {
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  width: 100% !important;
  gap: 4px !important;
}

.import-page #ddbCharacterList .ability-mini {
  min-width: 0 !important;
  padding: 7px 2px !important;
}

.import-page #ddbCharacterList .ability-mini span {
  font-size: .54rem !important;
}

.import-page #ddbCharacterList .ability-mini strong {
  display: block !important;
  font-size: .76rem !important;
  white-space: nowrap !important;
}

.import-page #ddbCharacterList .ddb-detail-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  width: 100% !important;
}

.import-page #ddbCharacterList .ddb-detail {
  min-width: 0 !important;
  padding-left: 3px !important;
  padding-right: 3px !important;
}

@media (min-width: 1180px) {
  .import-page #ddbCharacterList.character-grid {
    grid-template-columns: repeat(3, minmax(340px, 1fr)) !important;
  }
}

@media (min-width: 760px) and (max-width: 1179px) {
  .import-page #ddbCharacterList.character-grid {
    grid-template-columns: repeat(2, minmax(320px, 1fr)) !important;
  }
}

@media (max-width: 759px) {
  .import-page #ddbCharacterList.character-grid {
    grid-template-columns: 1fr !important;
  }

  .import-page #ddbCharacterList .ability-strip {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  .import-page #ddbCharacterList .ddb-detail-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}


/* Tomekeeper v0.8: keep D&D Beyond import cards inside the Party panel */
.import-page .import-main {
  max-width: 1220px !important;
  width: calc(100% - 28px) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.import-page #ddbCharacterList.character-grid {
  width: 100% !important;
  max-width: 100% !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

.import-page #ddbCharacterList .character-card {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow: hidden !important;
}

.import-page #ddbCharacterList .character-top {
  min-width: 0 !important;
}

.import-page #ddbCharacterList .character-top > div:last-child {
  min-width: 0 !important;
}

.import-page #ddbCharacterList .character-card h3,
.import-page #ddbCharacterList .character-sub,
.import-page #ddbCharacterList .source-note {
  overflow-wrap: anywhere !important;
}

.import-page #ddbCharacterList .ddb-detail-grid,
.import-page #ddbCharacterList .ability-strip {
  width: 100% !important;
  max-width: 100% !important;
}

@media (min-width: 760px) and (max-width: 1040px) {
  .import-page #ddbCharacterList.character-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 759px) {
  .import-page .import-main {
    width: calc(100% - 20px) !important;
  }

  .import-page #ddbCharacterList.character-grid {
    grid-template-columns: 1fr !important;
  }

  .import-page #ddbCharacterList .ability-strip {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  .import-page #ddbCharacterList .ddb-detail-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}


/* Tomekeeper v0.10: D&D Beyond character refresh */
[data-reimport-character]:disabled{
  opacity:.65;
  cursor:wait;
}


/* Tomekeeper v0.11: exact damage and healing controls */
.custom-hp-row{
  display:grid;
  grid-template-columns:minmax(150px,1fr) auto auto;
  gap:8px;
  align-items:end;
  margin-top:12px;
}
.compact-field{
  margin-bottom:0;
}
.secondary-hp-controls{
  margin-top:10px;
}
@media(max-width:700px){
  .custom-hp-row{
    grid-template-columns:1fr;
  }
  .custom-hp-row .button{
    width:100%;
  }
}


/* Tomekeeper v0.12: expanded character card color customization */
.character-card h3{
  color:var(--card-name,#fff) !important;
}
.character-card .character-sub,
.character-card .entry-meta{
  color:var(--card-text,#d3c8d6) !important;
}
.character-card .character-stat{
  background:var(--card-stat,rgba(0,0,0,.22)) !important;
}
.character-card .character-stat span{
  color:var(--card-text,#aaa0ad) !important;
  opacity:.78;
}
.character-card .character-stat strong{
  color:var(--card-name,#fff) !important;
}
.character-card .hp-fill{
  background:var(--card-hp,#79c58a) !important;
}

.theme-preset-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
}
.theme-preset{
  min-height:64px;
  padding:8px;
  border:1px solid var(--line);
  background:#0c0b10;
  color:var(--text);
  text-align:left;
}
.theme-preset:hover{
  border-color:var(--gold2);
}
.theme-preset b{
  display:block;
  margin-top:6px;
  font-size:.74rem;
  color:#eee;
}
.theme-swatches{
  display:flex;
  width:100%;
  height:20px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
}
.theme-swatches i{
  flex:1;
  display:block;
}
.color-custom-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
}
.color-custom-grid input[type="color"]{
  height:43px;
  padding:4px;
  cursor:pointer;
}
@media(max-width:760px){
  .theme-preset-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .color-custom-grid{
    grid-template-columns:1fr 1fr;
  }
}
@media(max-width:480px){
  .color-custom-grid{
    grid-template-columns:1fr;
  }
}


/* Tomekeeper v0.16: clear party controls */
.backup-cluster #clearPartyButton{
  margin-top:3px;
}


/* Tomekeeper v0.17: clickable character cards */
.character-card[data-character-card]{
  cursor:pointer;
  transition:transform .12s ease,border-color .12s ease,box-shadow .12s ease;
}
.character-card[data-character-card]:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 22px rgba(0,0,0,.28);
}
.character-card[data-character-card]:focus-visible{
  outline:2px solid var(--gold2);
  outline-offset:3px;
}
.character-card[data-character-card] button,
.character-card[data-character-card] a{
  cursor:pointer;
}


/* Tomekeeper v0.18: movable and resizable character sheet windows */
.movable-sheet-window{
  resize:both;
  overflow:auto;
  min-width:520px;
  min-height:420px;
  width:min(920px,calc(100vw - 48px));
  height:min(820px,calc(100vh - 48px));
  max-width:calc(100vw - 12px);
  max-height:calc(100vh - 12px);
}

.sheet-drag-handle{
  cursor:move;
  user-select:none;
}

.movable-sheet-window.is-dragging{
  user-select:none;
}

.movable-sheet-window::after{
  content:"";
  position:absolute;
  right:3px;
  bottom:3px;
  width:13px;
  height:13px;
  pointer-events:none;
  opacity:.7;
  background:
    linear-gradient(135deg,transparent 0 45%,var(--card-accent,var(--gold)) 46% 54%,transparent 55% 66%,var(--card-accent,var(--gold)) 67% 75%,transparent 76%);
}

@media(max-width:760px){
  .movable-sheet-window{
    resize:none;
    min-width:0;
    width:calc(100vw - 20px);
    height:calc(100vh - 20px);
    max-width:calc(100vw - 20px);
    max-height:calc(100vh - 20px);
  }
  .sheet-drag-handle{
    cursor:default;
  }
}


/* Tomekeeper v0.19: explicit resize grip for character sheets */
.movable-sheet-window{
  position:relative;
  resize:none !important;
  overflow:auto;
  min-width:520px;
  min-height:420px;
  width:min(920px,calc(100vw - 48px));
  height:min(820px,calc(100vh - 48px));
  max-width:calc(100vw - 12px);
  max-height:calc(100vh - 12px);
}

.sheet-resize-grip{
  position:absolute;
  right:0;
  bottom:0;
  width:26px;
  height:26px;
  cursor:nwse-resize;
  z-index:50;
  background:
    linear-gradient(135deg,
      transparent 0 45%,
      var(--gold2,#e2c66f) 46% 52%,
      transparent 53% 62%,
      var(--gold2,#e2c66f) 63% 69%,
      transparent 70% 79%,
      var(--gold2,#e2c66f) 80% 86%,
      transparent 87%);
}

.movable-sheet-window.is-resizing{
  user-select:none;
}

@media(max-width:760px){
  .sheet-resize-grip{
    display:none;
  }
  .movable-sheet-window{
    min-width:0;
    min-height:0;
    width:calc(100vw - 20px);
    height:calc(100vh - 20px);
    max-width:calc(100vw - 20px);
    max-height:calc(100vh - 20px);
  }
}


/* Tomekeeper v0.20: solid character sheet windows */
#characterSheetDialog .movable-sheet-window,
#characterSheetDialog .sheet-panel,
#characterSheetDialog .dialog-panel,
#characterSheetDialog .modal-panel{
  background:#151019 !important;
  background-color:#151019 !important;
  opacity:1 !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}

/* Keep the content area opaque even while the sheet is moved or resized. */
#characterSheetDialog .movable-sheet-window::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:#151019;
  pointer-events:none;
}

/* Strong edge/shadow so the floating sheet is visually separate from Tomekeeper behind it. */
#characterSheetDialog .movable-sheet-window{
  isolation:isolate;
  border:1px solid var(--gold,#c7a347);
  box-shadow:0 18px 55px rgba(0,0,0,.72);
}


/* Tomekeeper v0.21: resize grip stays visible while the sheet scrolls */
#characterSheetDialog > .sheet-resize-grip{
  position:fixed !important;
  right:auto !important;
  bottom:auto !important;
  width:26px;
  height:26px;
  cursor:nwse-resize;
  z-index:2147483647;
  display:block;
  background:
    linear-gradient(135deg,
      transparent 0 45%,
      var(--gold2,#e2c66f) 46% 52%,
      transparent 53% 62%,
      var(--gold2,#e2c66f) 63% 69%,
      transparent 70% 79%,
      var(--gold2,#e2c66f) 80% 86%,
      transparent 87%);
  filter:drop-shadow(0 1px 2px rgba(0,0,0,.75));
}

/* Hide any old grip that might still exist inside the scrolling sheet. */
#characterSheetDialog .movable-sheet-window > .sheet-resize-grip{
  display:none !important;
}

@media(max-width:760px){
  #characterSheetDialog > .sheet-resize-grip{
    display:none !important;
  }
}


/* Tomekeeper v0.22: condition definition tooltips */
.condition-help{
  position:relative;
  cursor:help;
}

.condition-help > span:first-of-type{
  border-bottom:1px dotted rgba(226,198,111,.55);
}

.condition-tooltip{
  position:absolute;
  left:0;
  bottom:calc(100% + 8px);
  width:min(360px,70vw);
  z-index:2147483646;
  padding:10px 12px;
  border:1px solid var(--gold,#c7a347);
  background:#0b0a0e;
  color:#f4efe7;
  font-size:.76rem;
  font-weight:400;
  line-height:1.45;
  box-shadow:0 10px 28px rgba(0,0,0,.55);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(4px);
  transition:opacity .12s ease,transform .12s ease,visibility .12s ease;
}

.condition-tooltip::after{
  content:"";
  position:absolute;
  left:16px;
  top:100%;
  border:6px solid transparent;
  border-top-color:var(--gold,#c7a347);
}

.condition-help:hover .condition-tooltip,
.condition-help:focus-within .condition-tooltip,
.condition-help:focus .condition-tooltip{
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}

@media(max-width:760px){
  .condition-tooltip{
    left:0;
    right:auto;
    width:min(320px,82vw);
  }
}


/* Tomekeeper v0.23: condition definitions on Party character cards */
.character-card-conditions{
  position:relative;
  overflow:visible;
}

.condition-card-help{
  position:relative;
  display:inline-block;
  cursor:help;
  border-bottom:1px dotted rgba(226,198,111,.55);
}

.condition-card-tooltip{
  position:absolute;
  left:50%;
  bottom:calc(100% + 8px);
  transform:translate(-50%,4px);
  width:280px;
  max-width:70vw;
  z-index:2147483646;
  padding:9px 11px;
  border:1px solid var(--gold,#c7a347);
  background:#0b0a0e;
  color:#f4efe7;
  font-size:.72rem;
  font-weight:400;
  line-height:1.4;
  text-align:left;
  white-space:normal;
  box-shadow:0 10px 28px rgba(0,0,0,.58);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .12s ease,transform .12s ease,visibility .12s ease;
}

.condition-card-tooltip::after{
  content:"";
  position:absolute;
  left:50%;
  top:100%;
  transform:translateX(-50%);
  border:6px solid transparent;
  border-top-color:var(--gold,#c7a347);
}

.condition-card-help:hover .condition-card-tooltip,
.condition-card-help:focus .condition-card-tooltip{
  opacity:1;
  visibility:visible;
  transform:translate(-50%,0);
}

/* Existing importer rules sometimes clip card contents. Allow Party card
   condition tooltips to extend outside the card. */
#characterList .character-card{
  overflow:visible !important;
}
#characterList .character-card:hover,
#characterList .character-card:focus-within{
  z-index:30;
}


/* Tomekeeper v0.24: automatic Bloodied and HP threshold colors */
.automatic-condition{
  border-color:rgba(216,79,79,.45) !important;
  background:rgba(216,79,79,.08) !important;
}
.automatic-condition small{
  display:inline-block;
  margin-left:5px;
  padding:1px 4px;
  border:1px solid rgba(216,79,79,.55);
  color:#efaaaa;
  font-size:.55rem;
  letter-spacing:.08em;
  vertical-align:1px;
}
.automatic-condition input[disabled]{
  opacity:1;
}


/* Tomekeeper v0.25: Add Character source chooser */
.add-character-source-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin:16px 0;
}
.source-choice-card{
  min-height:160px;
  padding:18px;
  border:1px solid var(--line);
  background:linear-gradient(145deg,#17131d,#0e0d12);
  color:var(--text);
  text-align:left;
  text-decoration:none;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:8px;
}
.source-choice-card:hover{
  border-color:var(--gold2);
}
.source-choice-card.featured{
  border-color:rgba(122,67,182,.75);
  box-shadow:inset 0 0 24px rgba(122,67,182,.08);
}
.source-choice-card strong{
  color:var(--gold2);
  font-family:Cinzel,Georgia,serif;
}
.source-choice-card span{
  color:var(--muted);
  line-height:1.5;
}
.source-choice-card b{
  margin-top:auto;
  color:#d9c2ed;
}
@media(max-width:640px){
  .add-character-source-grid{
    grid-template-columns:1fr;
  }
}

/* Tomekeeper v0.27 */
.sheet-ddb-link{
  margin-top:9px;
  width:max-content;
  max-width:100%;
}


/* Tomekeeper v0.28: Tutorial Mode */
.tutorial-toggle{
  white-space:nowrap;
}
.tutorial-mode .tutorial-hint-target{
  outline:1px dotted rgba(226,198,111,.38);
  outline-offset:2px;
}
.tutorial-current-target{
  position:relative;
  z-index:10002 !important;
  outline:3px solid var(--gold2,#e2c66f) !important;
  outline-offset:4px !important;
  box-shadow:0 0 0 6px rgba(226,198,111,.12),0 0 28px rgba(226,198,111,.25) !important;
}
.tutorial-backdrop{
  position:fixed;
  inset:0;
  z-index:10000;
  background:rgba(0,0,0,.48);
  pointer-events:none;
}
.tutorial-bubble{
  position:fixed;
  z-index:10003;
  box-sizing:border-box;
  max-width:calc(100vw - 24px);
  padding:14px;
  border:1px solid var(--gold,#c7a347);
  background:#131019;
  color:var(--text,#f2ebdf);
  box-shadow:0 16px 48px rgba(0,0,0,.62);
}
.tutorial-bubble.hidden,
.tutorial-backdrop.hidden{
  display:none !important;
}
.tutorial-bubble-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:8px;
}
.tutorial-bubble-head h3{
  margin:2px 0 0;
  color:var(--gold2,#e2c66f);
}
.tutorial-text{
  line-height:1.5;
  color:#e8dfd3;
}
.tutorial-progress{
  margin-top:10px;
  color:var(--muted,#aaa0ad);
  font-size:.76rem;
}
.tutorial-actions{
  margin-top:12px;
}
@media(max-width:700px){
  .tutorial-bubble{
    left:10px !important;
    right:10px !important;
    bottom:10px !important;
    top:auto !important;
    width:auto !important;
  }
}


/* Tomekeeper v0.30: hover-only Tutorial Mode */
.tutorial-bubble .tutorial-actions,
.tutorial-bubble #tutorialPrevious,
.tutorial-bubble #tutorialNext,
.tutorial-bubble #tutorialEnd,
.tutorial-bubble #tutorialClose{
  display:none !important;
}
.tutorial-bubble{
  pointer-events:auto;
}
.tutorial-current-target{
  outline:2px solid var(--gold2,#e2c66f) !important;
  outline-offset:3px !important;
}


/* Tomekeeper v0.31: tutorial help inside open dialogs */
dialog .tutorial-bubble,
dialog .tutorial-backdrop{
  position:fixed !important;
}
dialog .tutorial-bubble{
  z-index:2147483647 !important;
}
dialog .tutorial-backdrop{
  z-index:2147483646 !important;
}
.tutorial-in-dialog{
  z-index:2147483647 !important;
}

/* Movable Tomekeeper data-entry windows */
.movable-dialog-panel{
  max-width:calc(100vw - 20px);
  max-height:calc(100vh - 20px);
  overflow:auto;
}
.movable-dialog-handle{
  cursor:move;
  user-select:none;
}
.movable-dialog-handle button,
.movable-dialog-handle a,
.movable-dialog-handle input,
.movable-dialog-handle select,
.movable-dialog-handle textarea{
  cursor:auto;
}
.movable-dialog-panel.dialog-dragging{
  user-select:none;
  box-shadow:0 20px 60px rgba(0,0,0,.72);
}

@media(max-width:760px){
  .movable-dialog-handle{
    cursor:default;
  }
}


/* Tomekeeper v0.32: separated languages and proficiencies */
.training-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
.training-group{
  min-width:0;
  padding:10px;
  border:1px solid rgba(199,163,71,.25);
  background:rgba(255,255,255,.025);
}
.training-heading{
  margin-bottom:7px;
  color:var(--gold2,#e2c66f);
  font-family:Cinzel,Georgia,serif;
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.training-values{
  display:flex;
  flex-wrap:wrap;
  gap:5px;
  align-items:flex-start;
}
.training-chip{
  display:inline-block;
  max-width:100%;
  padding:4px 7px;
  border:1px solid rgba(226,198,111,.24);
  background:#0d0b11;
  color:#eee5da;
  font-size:.74rem;
  line-height:1.25;
  overflow-wrap:anywhere;
}
@media(max-width:700px){
  .training-grid{grid-template-columns:1fr}
}


/* Tomekeeper v0.33: compact two-column Actions & Attacks */
.action-sheet-grid{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:6px 10px;
  align-items:start;
}
.action-sheet-row{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto;
  gap:8px;
  align-items:start;
  min-width:0;
  padding:6px 8px !important;
}
.action-sheet-row strong{
  min-width:0;
  line-height:1.2;
  overflow-wrap:break-word;
}
.action-sheet-row span{
  max-width:180px;
  text-align:right;
  line-height:1.2;
  overflow-wrap:break-word;
}
@media(max-width:900px){
  .action-sheet-grid{
    grid-template-columns:1fr;
  }
  .action-sheet-row span{
    max-width:220px;
  }
}


/* Tomekeeper v0.34: per-character sheet highlighting */
.sheet-highlight-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
  margin:0 0 12px;
  padding:10px;
  border:1px solid rgba(199,163,71,.28);
  background:rgba(199,163,71,.045);
}
.sheet-highlight-toolbar .eyebrow{
  margin-bottom:3px;
}
.sheet-highlight-controls{
  display:flex;
  gap:7px;
  flex-wrap:wrap;
  align-items:center;
}
.highlight-color-label{
  display:flex;
  gap:6px;
  align-items:center;
  color:var(--gold2,#e2c66f);
  font-size:.75rem;
  font-weight:700;
}
.highlight-color-label input[type="color"]{
  width:38px;
  height:32px;
  min-height:0;
  padding:2px;
  cursor:pointer;
}

#characterSheetDialog [data-highlightable="1"]{
  transition:background-color .12s ease, outline-color .12s ease;
  border-radius:2px;
}
#characterSheetDialog.sheet-highlight-mode [data-highlightable="1"]{
  cursor:crosshair;
}
#characterSheetDialog.sheet-highlight-mode [data-highlightable="1"]:hover,
#characterSheetDialog.sheet-highlight-mode [data-highlightable="1"]:focus{
  outline:2px solid rgba(226,198,111,.7);
  outline-offset:1px;
}
#characterSheetDialog .sheet-entry-highlighted{
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);
}

/* Make highlighted ability/stat cells visually useful without changing layout. */
#characterSheetDialog .character-stat.sheet-entry-highlighted,
#characterSheetDialog .sheet-list-row.sheet-entry-highlighted,
#characterSheetDialog .spell-item.sheet-entry-highlighted,
#characterSheetDialog .inventory-item.sheet-entry-highlighted,
#characterSheetDialog .training-chip.sheet-entry-highlighted,
#characterSheetDialog .save-skill-row.sheet-entry-highlighted,
#characterSheetDialog .training-group.sheet-entry-highlighted{
  padding-left:6px;
  padding-right:6px;
}
@media(max-width:700px){
  .sheet-highlight-toolbar{
    align-items:flex-start;
  }
  .sheet-highlight-controls{
    width:100%;
  }
}

/* Tomekeeper v0.35: AI Assist */
.ai-assist-toggle{display:inline-flex;align-items:center;gap:7px;margin:7px 0 3px;padding:5px 8px;border:1px solid rgba(199,163,71,.28);background:rgba(255,255,255,.025);color:var(--gold2,#e2c66f);font-size:.76rem;font-weight:700;cursor:pointer}
.ai-assist-toggle input{margin:0}
#characterSheetDialog .ai-assist-strong{background:#285b32 !important;box-shadow:inset 0 0 0 1px rgba(151,226,158,.45)}
#characterSheetDialog .ai-assist-weak{background:#78651f !important;box-shadow:inset 0 0 0 1px rgba(244,215,92,.5)}

/* Tomekeeper v0.36: fixed AI Assist targets + ability modifiers */
#characterSheetDialog .ability-modifier{
  display:block;
  margin-top:2px;
  color:#cfc3d5;
  font-size:.72rem;
  font-weight:700;
}
#characterSheetDialog .ai-assist-strong .ability-modifier,
#characterSheetDialog .ai-assist-weak .ability-modifier{
  color:inherit;
}


/* Tomekeeper v0.37: quests on character sheets */
.character-quest-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px 10px;
}
.character-quest-item{
  min-width:0;
  padding:9px 10px;
  border:1px solid rgba(199,163,71,.24);
  background:rgba(255,255,255,.025);
}
.character-quest-heading{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:8px;
  margin-bottom:5px;
}
.character-quest-heading strong{
  color:#f1e8dc;
  line-height:1.25;
}
.character-quest-meta{
  display:flex;
  flex-wrap:wrap;
  gap:4px 10px;
  margin-bottom:5px;
  color:var(--muted,#aaa0ad);
  font-size:.72rem;
}
.character-quest-body,
.character-quest-notes{
  white-space:pre-wrap;
  line-height:1.35;
  font-size:.78rem;
}
.character-quest-notes{
  margin-top:5px;
  color:#d6cbd8;
}
@media(max-width:800px){
  .character-quest-list{
    grid-template-columns:1fr;
  }
}


/* Tomekeeper v0.38: Raven Archive visual treatment */
.site-header{
  background:rgba(7,7,10,.94);
  box-shadow:0 8px 26px rgba(0,0,0,.28);
}
main{
  position:relative;
}
.campaign-bar{
  background:rgba(18,16,23,.94);
  box-shadow:0 10px 28px rgba(0,0,0,.20);
}
.panel{
  background:linear-gradient(145deg,rgba(29,23,36,.95),rgba(21,19,27,.96));
  box-shadow:0 12px 32px rgba(0,0,0,.22);
}
.metric,
.start-card,
.local-resume{
  background-color:rgba(17,16,22,.95);
}
.tabs{
  scrollbar-color:rgba(199,163,71,.4) transparent;
}
.character-card,
.quest-card,
.entry-card,
.session-card,
.npc-card,
.location-card,
.loot-card,
.note-card,
.rumor-card{
  box-shadow:0 8px 22px rgba(0,0,0,.18);
}

/* A soft lower-page veil keeps long journal views readable without hiding the art. */
body::after{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
  background:
    radial-gradient(circle at 48% 35%,transparent 0 22%,rgba(7,6,10,.10) 56%,rgba(7,6,10,.30) 100%);
}

/* On narrower screens, keep the tome/candle side of the artwork in frame while
   maintaining a dark field beneath the interface. */
@media(max-width:900px){
  body{
    background:
      linear-gradient(rgba(6,5,9,.48),rgba(6,5,9,.68)),
      url('TKBG.webp') 66% top / cover fixed no-repeat,
      #09090d;
  }
  .panel,
  .campaign-bar{
    background:rgba(18,15,23,.97);
  }
}

/* Mobile browsers can be jumpy with fixed backgrounds, so let the artwork scroll
   naturally there. */
@media(max-width:600px){
  body{
    background-attachment:scroll;
    background-position:68% top;
  }
}