/* Planner reading scale. Keep canvas coordinates and fixed editor geometry independent. */
.sanctuary-ui .d4-planner-screen {
  --planner-text: #e6dfd2;
  --planner-muted: #bdb4a5;
  --planner-gold: #efd29c;
  font-family: "Microsoft YaHei", "PingFang SC", "Noto Sans SC", system-ui, sans-serif;
  font-size: 16px;
  line-height: 1.6;
  color: var(--planner-text);
}
.sanctuary-ui .d4-planner-screen :is(button, input, select, textarea) { font-family: inherit; }
.sanctuary-ui .d4-planner-screen :is(input, textarea)::placeholder { color: #b0a89b; opacity: 1; }
.sanctuary-ui .d4-planner-screen :is(button, a, input, select, summary):focus-visible { outline: 2px solid #e6bd78; outline-offset: 3px; }
.sanctuary-ui .d4-planner-screen :is(.text-xs, .text-sm) { font-size: 14px; line-height: 1.65; }

/* Page navigation and build controls. */
.sanctuary-ui .d4-planner-screen .d4-planner-hud > .flex { flex-wrap: wrap; gap: 12px 20px; }
.sanctuary-ui .d4-planner-screen .d4-planner-hud h1 { font-size: 24px; line-height: 1.4; }
.sanctuary-ui .d4-planner-screen .d4core-layout.is-planner-workbench .d4-planner-hud h1 + p { font-size: 14px; color: var(--planner-muted); }
.sanctuary-ui .d4-planner-screen .d4core-layout.is-planner-workbench .d4-class-chip { font-size: 16px; min-height: 38px; padding: 6px 10px; color: #cfc6b7; }
.sanctuary-ui .d4-planner-screen .d4core-layout.is-planner-workbench .d4-class-chip.is-active { color: #ffe1b3; }
.sanctuary-ui .d4-planner-screen :is(.d4-hud-action, .d4-hud-actions select) { font-size: 15px; min-height: 40px; }
.sanctuary-ui .d4-planner-screen .d4-workbench-tabs .d4-mode-tab { min-height: 44px; padding: 8px 22px; }
.sanctuary-ui .d4-planner-screen .d4-workbench-tabs .d4-mode-tab span:first-child { font-size: 18px; letter-spacing: 1px; }
.sanctuary-ui .d4-planner-screen .build-variant-directory { background: #191816; padding: 14px 16px; }
.sanctuary-ui .d4-planner-screen .build-variant-directory header strong { font-size: 16px; color: var(--planner-gold); }
.sanctuary-ui .d4-planner-screen .build-variant-directory :is(small, nav span, .variant-summary, label, .variant-actions) { font-size: 14px; line-height: 1.65; color: var(--planner-muted); }
.sanctuary-ui .d4-planner-screen .build-variant-directory button { font-size: 15px; min-height: 38px; color: var(--planner-text); }
.sanctuary-ui .d4-planner-screen .build-variant-directory nav { gap: 10px; }
.sanctuary-ui .d4-planner-screen .d4core-module-strip { padding: 12px 16px; gap: 14px 24px; flex-wrap: wrap; }
.sanctuary-ui .d4-planner-screen .d4-build-strip-summary { flex-wrap: wrap; gap: 8px 14px; }
.sanctuary-ui .d4-planner-screen .d4-build-strip-title { flex-wrap: wrap; gap: 4px 10px; }
.sanctuary-ui .d4-planner-screen .d4-build-strip-title strong { font-size: 16px; color: var(--planner-text); }
.sanctuary-ui .d4-planner-screen :is(.d4-build-strip-title small, .d4-difficulty-control small, .d4-level-control small) { font-size: 13px; color: var(--planner-muted); line-height: 1.5; }
.sanctuary-ui .d4-planner-screen .d4-build-strip-metric { font-size: 14px; color: var(--planner-muted); }
.sanctuary-ui .d4-planner-screen .d4-build-strip-metric b { font-size: 15px; color: var(--planner-gold); }
.sanctuary-ui .d4-planner-screen .d4-build-context-controls { flex-wrap: wrap; gap: 12px 18px; }
.sanctuary-ui .d4-planner-screen :is(.d4-difficulty-control, .d4-level-control) { font-size: 15px; color: var(--planner-text); }
.sanctuary-ui .d4-planner-screen :is(.d4-difficulty-control select, .d4-level-control input) { min-height: 36px; height: 36px; font-size: 16px; color: #f4e8ce; }
.sanctuary-ui .d4-planner-screen .d4-level-control input { width: 52px; }
.sanctuary-ui .d4-planner-screen .d4-level-control button { width: 34px; height: 36px; font-size: 18px; }

/* Inventory labels need room below the artwork, including four-character weapon names. */
.sanctuary-ui .d4-planner-screen .d4-armory-panel > .mb-4 h2 { font-size: 20px; color: #eee0c6; }
.sanctuary-ui .d4-planner-screen .d4-armory-panel > .mb-4 button { font-size: 14px; min-height: 36px; padding: 6px 10px; color: #ded4c3; }
.sanctuary-ui .d4-planner-screen .d4core-layout.is-planner-workbench .d4-paper-doll-hero .d4-equipment-slot { width: 66px !important; height: 80px !important; }
.sanctuary-ui .d4-planner-screen .d4core-layout.is-planner-workbench .d4-paper-doll-hero .d4-equipment-slot .d4-slot-title {
  inset: auto 2px 2px;
  font-size: 13px !important;
  line-height: 21px !important;
  letter-spacing: 0;
  padding: 0 1px;
  color: #efe4d1;
  background: #100e0deb;
  text-shadow: none;
}
.sanctuary-ui .d4-planner-screen .d4core-layout.is-planner-workbench .d4-paper-doll-hero .d4-slot-icon { height: 56px !important; max-height: 56px; margin-bottom: 15px; }
.sanctuary-ui .d4-planner-screen .d4-paper-doll-hero .d4-slot-anchor .d4-slot-item-name { font-size: 14px !important; line-height: 20px !important; max-height: 60px !important; font-weight: 500; text-shadow: 0 1px 2px #000, 0 0 4px #000; }
.sanctuary-ui .d4-planner-screen .d4-armory-panel .d4-character-system-copy strong { font-size: 16px; color: #ead8b6; letter-spacing: 1px; }
.sanctuary-ui .d4-planner-screen .d4-armory-panel .d4-action-key { font-size: 13px; line-height: 18px; min-width: 16px; color: #efdfc4; }
.sanctuary-ui .d4-planner-screen .d4-system-entry-hint > span { font-size: 14px; color: var(--planner-text); }

/* A native dialog keeps the skill list above the inventory and inside the viewport. */
.sanctuary-ui .d4-planner-screen .d4-action-picker {
  position: fixed;
  inset: 0;
  width: min(640px, calc(100vw - 32px));
  min-width: 0;
  max-width: none;
  max-height: min(640px, calc(100dvh - 48px));
  margin: auto;
  padding: 0;
  overflow: hidden;
  border: 1px solid #b08a50;
  border-radius: 2px;
  background: linear-gradient(135deg, #272017, #131210 65%);
  color: var(--planner-text);
  box-shadow: inset 0 0 0 3px #100d09, 0 20px 70px #000d;
}
.sanctuary-ui .d4-planner-screen .d4-action-picker:not([open]) { display: none; }
.sanctuary-ui .d4-planner-screen .d4-action-picker[open] { display: flex; flex-direction: column; }
.sanctuary-ui .d4-planner-screen .d4-action-picker::backdrop { background: #050403a6; }
.sanctuary-ui .d4-planner-screen .d4-action-picker-title { flex: none; gap: 16px; padding: 18px 20px; border-bottom: 1px solid #735c3b; }
.sanctuary-ui .d4-planner-screen .d4-action-picker-title h2 { font-size: 21px; line-height: 1.5; font-weight: 600; color: #f1d3a0; }
.sanctuary-ui .d4-planner-screen .d4-action-picker-title h2 span { font-size: 16px; white-space: nowrap; }
.sanctuary-ui .d4-planner-screen .d4-action-picker-title p { margin-top: 4px; font-size: 14px; line-height: 1.5; color: var(--planner-muted); }
.sanctuary-ui .d4-planner-screen .d4-action-picker-title button { flex: none; width: 36px; height: 36px; font-size: 22px; border-color: #796343; background: #17130e; }
.sanctuary-ui .d4-planner-screen .d4-action-picker-grid { min-height: 0; max-height: none; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 16px 20px 20px; overflow-y: auto; overflow-x: hidden; overscroll-behavior: contain; scrollbar-gutter: stable; }
.sanctuary-ui .d4-planner-screen .d4-action-picker-grid button { position: relative; grid-template-columns: 48px minmax(0, 1fr); gap: 12px; min-height: 86px; padding: 12px; border-color: #65523b; background: linear-gradient(110deg, #30261b, #191613); color: #eee1cc; }
.sanctuary-ui .d4-planner-screen .d4-action-picker-grid button:hover { border-color: #d8b274; background: #3d2c1c; }
.sanctuary-ui .d4-planner-screen .d4-action-picker-grid button[aria-pressed="true"] { border-color: #e8c17c; box-shadow: inset 3px 0 #e8c17c; background: #49331e; }
.sanctuary-ui .d4-planner-screen .d4-action-picker-grid img { width: 48px; height: 48px; border-color: #98815d; }
.sanctuary-ui .d4-planner-screen .d4-action-picker-grid .d4-action-picker-copy { display: flex; flex-direction: column; gap: 5px; min-width: 0; overflow: visible; white-space: normal; text-overflow: clip; font-weight: 400; }
.sanctuary-ui .d4-planner-screen .d4-action-picker-copy strong { font-size: 16px; line-height: 1.5; overflow-wrap: anywhere; }
.sanctuary-ui .d4-planner-screen .d4-action-picker-copy small { font-size: 13px; line-height: 1.5; color: #c5b89f; }
.sanctuary-ui .d4-planner-screen .d4-action-picker-assigned { grid-column: 2; margin-top: -6px; font-size: 13px; line-height: 1.5; font-style: normal; color: #edc88a; }
.sanctuary-ui .d4-planner-screen .d4-action-picker-empty { padding: 36px 24px; font-size: 16px; line-height: 1.7; color: var(--planner-muted); }
@media (max-width: 600px) {
  .sanctuary-ui .d4-planner-screen .d4-action-picker { width: calc(100vw - 24px); max-height: calc(100dvh - 40px); }
  .sanctuary-ui .d4-planner-screen .d4-action-picker-title { padding: 14px 16px; }
  .sanctuary-ui .d4-planner-screen .d4-action-picker-title h2 { font-size: 19px; }
  .sanctuary-ui .d4-planner-screen .d4-action-picker-grid { grid-template-columns: minmax(0, 1fr); padding: 12px 16px 16px; gap: 8px; }
  .sanctuary-ui .d4-planner-screen .d4-action-picker-grid button { min-height: 76px; padding: 10px 12px; }
}

/* Overview: readable information instead of miniature captions. */
.sanctuary-ui .d4-planner-screen .overview-panel-tabs button { font-size: 18px; min-height: 46px; color: #c8bdac; }
.sanctuary-ui .d4-planner-screen .is-overview > .overview-information { gap: 20px 28px; }
.sanctuary-ui .d4-planner-screen .is-overview > .overview-information .overview-card header { padding: 10px 0; gap: 8px; flex-wrap: wrap; min-height: 44px; }
.sanctuary-ui .d4-planner-screen .is-overview > .overview-information .overview-card h2 { font-size: 18px; color: #ecd4a7; line-height: 1.5; }
.sanctuary-ui .d4-planner-screen .overview-card header button { font-size: 14px; color: #e0c89f; padding: 5px 8px; min-height: 34px; border: 1px solid #6c5840; background: #292219; }
.sanctuary-ui .d4-planner-screen .overview-card .overview-note { font-size: 14px; color: var(--planner-muted); line-height: 1.7; }
.sanctuary-ui .d4-planner-screen .overview-card header .overview-note { font-size: 13px; }
.sanctuary-ui .d4-planner-screen .overview-talisman-strip { padding: 12px 0; gap: 10px; }
.sanctuary-ui .d4-planner-screen .overview-seal-tile { width: 82px; padding-right: 10px; }
.sanctuary-ui .d4-planner-screen .is-overview > .overview-information .overview-seal-tile strong { font-size: 14px; line-height: 1.5; color: var(--planner-gold); }
.sanctuary-ui .d4-planner-screen .overview-seal-tile small { font-size: 13px; color: var(--planner-muted); }
.sanctuary-ui .d4-planner-screen .overview-charms-grid { gap: 6px; }
.sanctuary-ui .d4-planner-screen .overview-charms-grid button { padding: 8px; min-height: 44px; color: #d8cebc; border: 1px solid #574936; background: #211d18; }
.sanctuary-ui .d4-planner-screen .is-overview > .overview-information .overview-charms-grid strong { font-size: 14px; line-height: 20px; }
.sanctuary-ui .d4-planner-screen .overview-set-tags > span { font-size: 14px; color: #e0c48d; }
.sanctuary-ui .d4-planner-screen .is-overview > .overview-information .overview-info-row { padding: 10px 4px; gap: 10px; }
.sanctuary-ui .d4-planner-screen .overview-info-row strong { font-size: 16px; color: #ead1a0; }
.sanctuary-ui .d4-planner-screen .is-overview > .overview-information .overview-info-row p { font-size: 14px; line-height: 1.7; color: #ccc2b1; }
.sanctuary-ui .d4-planner-screen .overview-gems summary { font-size: 16px; color: #e1cba5; padding: 12px 0; }
.sanctuary-ui .d4-planner-screen .overview-gems summary span { font-size: 13px; color: var(--planner-muted); }
.sanctuary-ui .d4-planner-screen .overview-mechanic-group h3 { font-size: 14px; color: var(--planner-muted); }
.sanctuary-ui .d4-planner-screen .overview-mechanic-option strong { font-size: 16px; line-height: 1.6; }
.sanctuary-ui .d4-planner-screen .overview-mechanic-option :is(small, p) { font-size: 14px; line-height: 1.7; color: var(--planner-muted); }
.sanctuary-ui .d4-planner-screen .overview-paragon-entry .overview-paragon-part strong { font-size: 15px; line-height: 1.6; color: #e2c99f; }
.sanctuary-ui .d4-planner-screen :is(.overview-paragon-part small, .overview-paragon-empty) { font-size: 13px; line-height: 1.6; color: var(--planner-muted); }

/* Equipment catalog and item sheet share the same readable control scale. */
.sanctuary-ui .d4-planner-screen .is-item-sheet .d4-equipment-dialog-header h2 { font-size: 21px; }
.sanctuary-ui .d4-planner-screen .is-item-sheet .d4-equipment-dialog-header a { font-size: 13px; color: var(--planner-muted); }
.sanctuary-ui .d4-planner-screen .is-item-sheet .d4-item-type-switch button { font-size: 16px; min-height: 44px; }
.sanctuary-ui .d4-planner-screen .d4-item-catalog-title { font-size: 18px; color: #efd5a5; }
.sanctuary-ui .d4-planner-screen .is-item-sheet .d4-equipment-catalog-tools { grid-template-columns: minmax(0, 1fr); gap: 8px; }
.sanctuary-ui .d4-planner-screen .d4-equipment-catalog-tools input { font-size: 16px; min-height: 42px; color: var(--planner-text); }
.sanctuary-ui .d4-planner-screen .is-item-sheet .d4-equipment-catalog-tools strong { font-size: 13px; color: var(--planner-muted); }
.sanctuary-ui .d4-planner-screen .d4-equipment-filter-row { grid-template-columns: 76px minmax(0, 1fr); }
.sanctuary-ui .d4-planner-screen .d4-equipment-filter-row > span { font-size: 14px; color: #d2c6b2; }
.sanctuary-ui .d4-planner-screen .d4-equipment-filter-row button { font-size: 14px; min-height: 36px; color: #e0d3be; }
.sanctuary-ui .d4-planner-screen .is-item-sheet details.is-tag-filters > summary { font-size: 14px; color: var(--planner-muted); }
.sanctuary-ui .d4-planner-screen .d4-equipment-catalog-card { padding: 14px; line-height: 1.7; }
.sanctuary-ui .d4-planner-screen .d4-equipment-catalog-card strong { font-size: 18px; line-height: 1.6; }
.sanctuary-ui .d4-planner-screen .d4-equipment-catalog-card > span { font-size: 13px; color: #e5bd78; }
.sanctuary-ui .d4-planner-screen .d4-equipment-catalog-card small { font-size: 16px; line-height: 1.75; color: #ded4c4; }
.sanctuary-ui .d4-planner-screen .d4-item-name small { font-size: 14px; color: var(--planner-muted); }
.sanctuary-ui .d4-planner-screen :is(.d4-item-base-settings summary small, .d4-item-base-controls label, .d4-item-add-line small, .d4-item-stat small, .d4-item-greater, .d4-item-socket-heading > span, .d4-item-socket-row small) { font-size: 13px; color: var(--planner-muted); }
.sanctuary-ui .d4-planner-screen .d4-item-base-settings summary small { position: static; display: block; }
.sanctuary-ui .d4-planner-screen .d4-item-base-controls :is(input, select) { font-size: 16px; min-height: 38px; }
.sanctuary-ui .d4-planner-screen .d4-item-add-line { font-size: 16px; min-height: 40px; color: #dbd0be; }
.sanctuary-ui .d4-planner-screen .d4-item-greater input { width: 16px; height: 16px; }
.sanctuary-ui .d4-planner-screen .d4-item-special-power small { font-size: 14px; opacity: 1; }
.sanctuary-ui .d4-planner-screen .d4-item-socket-heading { font-size: 17px; }
.sanctuary-ui .d4-planner-screen .is-item-sheet .d4-item-socket-actions button { font-size: 16px; min-height: 50px; }
.sanctuary-ui .d4-planner-screen .is-item-sheet .d4-item-edit-hint { font-size: 13px; line-height: 1.6; color: var(--planner-muted); }
.sanctuary-ui .d4-planner-screen .is-item-sheet .d4-equipment-ocr { opacity: 1; }
.sanctuary-ui .d4-planner-screen .is-item-sheet .d4-equipment-ocr summary,
.sanctuary-ui .d4-planner-screen .is-item-sheet .d4-equipment-ocr summary :is(span, em) { font-size: 14px; color: #cfc2ad; }
.sanctuary-ui .d4-planner-screen .d4-equipment-footer-actions button { font-size: 16px; min-height: 42px; padding: 8px 16px; }
.sanctuary-ui .d4-planner-screen .d4-item-mobile-panels button { font-size: 15px; min-height: 38px; }
.sanctuary-ui .d4-planner-screen .is-equipped-tooltip :is(.d4-equipment-hover-lines p, .d4-equipment-hover-section p, .d4-equipment-hover-effect) { font-size: 16px; line-height: 1.7; color: #e1d8ca; }
.sanctuary-ui .d4-planner-screen .is-equipped-tooltip :is(.d4-equipment-hover-heading small, .d4-equipment-hover-section > strong, footer) { font-size: 13px; color: var(--planner-muted); }

/* Data and skill toolbars remain readable when switching away from the inventory. */
.sanctuary-ui .d4-planner-screen #planner-stats-fragment :is(.d4-stat-line, .d4-stat-card > p, .d4-skill-dps-empty strong) { font-size: 16px; line-height: 1.7; color: #e1d7c7; }
.sanctuary-ui .d4-planner-screen #planner-stats-fragment .d4-stat-line { padding-block: 9px; }
.sanctuary-ui .d4-planner-screen #planner-stats-fragment :is(.d4-stats-mode-note, .d4-toughness-note, .d4-auto-dps-badge, .d4-skill-dps-empty > span, .d4-skill-dps-identity small, .d4-skill-dps-name small, .d4-stat-card-delta) { font-size: 14px; line-height: 1.6; color: var(--planner-muted); }
.sanctuary-ui .d4-planner-screen #planner-stats-fragment .d4-stats-headline .d4-stat-card > p:nth-child(2) { font-size: 30px; color: #f1d8a7; }
.sanctuary-ui .d4-planner-screen #planner-stats-fragment .d4-stats-headline .d4-stat-card > p:first-child { white-space: nowrap; }
.sanctuary-ui .d4-planner-screen #planner-stats-fragment .d4-toughness-types > div { font-size: 14px; padding: 9px; }
.sanctuary-ui .d4-planner-screen :is(.d4-stats-view-switch button, .d4-stats-skill-link, .d4-skill-tools button, .d4-skill-sync-status, .d4-skill-input-legend, .d4-skill-point-summary > span, .d4-skill-order-toggle) { font-size: 14px; line-height: 1.6; color: #d4c9b7; }
.sanctuary-ui .d4-planner-screen :is(.d4-stats-view-switch button, .d4-skill-tools button) { min-height: 38px; }
.sanctuary-ui .d4-planner-screen :is(.d4-formula-details, .d4-damage-detail-note, .d4-damage-detail small, .d4-damage-method, .d4-damage-source-row > details, .d4-source-tooltip) { font-size: 14px; line-height: 1.7; color: var(--planner-muted); }
.sanctuary-ui .d4-planner-screen #specialization-dialog :is(.mechanic-choice-copy > small, .mechanic-family > header small, .mechanic-family > header span, .d4-systems-dialog-header small, .d4core-charm-caption span, .d4core-talisman-equipped i) { font-size: 13px; color: var(--planner-muted); }
.sanctuary-ui .d4-planner-screen #specialization-dialog :is(.mechanic-choice-effect, .mechanic-sanctum-intro p, .d4core-talisman-bonuses strong, .d4core-talisman-equipped strong) { font-size: 15px; line-height: 1.7; color: #ded5c6; }
.sanctuary-ui .d4-planner-screen #specialization-dialog .mechanic-choice-copy > strong { font-family: inherit; font-size: 17px; }

@media (max-width: 1199px) {
  .sanctuary-ui .d4-planner-screen .is-overview > .overview-information { grid-template-columns: minmax(0, 1fr); }
  .sanctuary-ui .d4-planner-screen .is-overview > .overview-information::before { display: none; }
}
@media (max-width: 760px) {
  .sanctuary-ui .d4-planner-screen .d4core-layout.is-planner-workbench .d4-planner-hud > .flex { display: flex; flex-direction: column; align-items: stretch; }
  .sanctuary-ui .d4-planner-screen .d4core-layout.is-planner-workbench .d4-hud-actions { flex-direction: row; flex-wrap: wrap; }
  .sanctuary-ui .d4-planner-screen .d4-workbench-tabs .d4-mode-tab { padding: 8px 12px; }
  .sanctuary-ui .d4-planner-screen .d4-workbench-tabs .d4-mode-tab span:first-child { font-size: 16px; letter-spacing: 0; }
  .sanctuary-ui .d4-planner-screen .d4-build-strip-summary { gap: 8px; }
  .sanctuary-ui .d4-planner-screen .d4-build-context-controls { width: 100%; }
  .sanctuary-ui .d4-planner-screen .d4-difficulty-control { flex: 1 1 180px; }
  .sanctuary-ui .d4-planner-screen .d4core-module-strip { padding: 12px; }
  .sanctuary-ui .d4-planner-screen .overview-gems summary span { float: none; display: block; margin-top: 4px; }
  .sanctuary-ui .d4-planner-screen .is-item-sheet .d4-equipment-dialog-header h2 { font-size: 18px; }
  .sanctuary-ui .d4-planner-screen .is-item-sheet .d4-item-type-switch button { font-size: 15px; gap: 5px; }
  .sanctuary-ui .d4-planner-screen .d4-equipment-filter-row { grid-template-columns: minmax(0, 1fr); gap: 5px; }
  .sanctuary-ui .d4-planner-screen .d4-equipment-filter-row > span { padding-top: 0; }
  .sanctuary-ui .d4-planner-screen .d4-equipment-footer-actions button { padding-inline: 10px; font-size: 14px; }
  .sanctuary-ui .d4-planner-screen .d4-paper-doll-hero .d4-slot-anchor .d4-slot-item-name { max-width: 105px; font-size: 13px !important; line-height: 19px !important; }
}