/* Beginner Builder additions. Use PyRoller's semantic theme variables for all modes. */
.beginner-app .beginner-intro,.beginner-app .beginner-human-guide,.beginner-app .beginner-original-rules{
  border:1px solid var(--py-border-soft, var(--line));border-radius:14px;
  margin:16px 0 0;background:var(--py-panel-soft, var(--panel));
}
.beginner-app .beginner-intro>summary,.beginner-app .beginner-original-rules>summary{
  list-style:none;cursor:pointer;display:flex;gap:10px;align-items:center;justify-content:space-between;
  padding:15px 18px;font-weight:750;color:var(--py-text-strong, var(--text));min-height:52px;
}
.beginner-app .beginner-intro>summary::-webkit-details-marker,.beginner-app .beginner-original-rules>summary::-webkit-details-marker{display:none}
.beginner-app .beginner-intro>summary::marker,.beginner-app .beginner-original-rules>summary::marker{content:''}
/* A single consistently centered CSS chevron replaces unreliable text glyphs. */
.beginner-app .beginner-intro>summary::after,.beginner-app .beginner-original-rules>summary::after{
  content:'';display:block;box-sizing:border-box;flex:0 0 9px;width:9px;height:9px;
  border:solid currentColor;border-width:0 2px 2px 0;border-radius:1px;
  margin-left:auto;margin-right:3px;opacity:.76;transform:translateY(-2px) rotate(45deg);
  transition:transform .16s ease;
}
.beginner-app .beginner-intro[open]>summary::after,.beginner-app .beginner-original-rules[open]>summary::after{transform:translateY(2px) rotate(225deg)}
.beginner-app .beginner-intro-hint{margin-left:auto;font-size:12px;font-weight:400;color:var(--py-muted, var(--muted))}
.beginner-app .beginner-intro-body{padding:0 18px 16px}
.beginner-app .beginner-intro-body p{margin:0 0 10px;line-height:1.52}
.beginner-app .beginner-intro-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:12px 0}
.beginner-app .beginner-intro-columns>div{padding:12px;background:var(--py-panel, var(--panel));border:1px solid var(--py-border-soft, var(--line));border-radius:9px}
.beginner-app .beginner-intro-columns strong,.beginner-app .beginner-intro-columns span{display:block}
.beginner-app .beginner-intro-columns span{font-size:13px;line-height:1.48;margin-top:5px}
.beginner-app .beginner-hint{font-size:13px;color:var(--py-muted, var(--muted))}
.beginner-app .beginner-placeholder{margin:15px 0 0;padding:13px 15px;border:1px dashed var(--py-border, var(--line));border-radius:10px;background:var(--py-notice-bg, var(--panel));font-size:14px;line-height:1.5}
.beginner-app .beginner-human-guide{padding:20px 21px;display:grid;gap:18px}
.beginner-app .beginner-guide-eyebrow{font-weight:750;text-transform:uppercase;letter-spacing:.08em;font-size:11px;color:var(--py-muted, var(--muted))}
.beginner-app .beginner-guide-title{font-size:24px;margin:-10px 0 0;color:var(--py-text-strong, var(--text))}
.beginner-app .beginner-human-guide h3{font-size:17px;margin:0 0 9px}
.beginner-app .beginner-human-guide p{font-size:14px;line-height:1.58;margin:0 0 9px}
.beginner-app .beginner-human-guide p:last-child{margin-bottom:0}
.beginner-app .beginner-lore-card{padding:15px 16px;background:var(--py-panel, var(--panel));border:1px solid var(--py-border-soft, var(--line));border-radius:11px}
.beginner-app .beginner-guide-section-title{display:flex;flex-wrap:wrap;align-items:center;gap:7px}
.beginner-app .beginner-guide-section-title h3{margin:0}
.beginner-app .beginner-trait-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:10px}
.beginner-app .beginner-trait{padding:13px 14px;border:1px solid var(--py-border-soft,var(--line));border-radius:11px;background:var(--py-panel,var(--panel));min-width:0}
.beginner-app .beginner-trait-heading{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.beginner-app .beginner-trait-label{font-size:14px}
.beginner-app .beginner-trait-value{display:block;color:var(--py-primary,var(--accent));font-size:15px;font-weight:750;margin:8px 0 4px}
.beginner-app .beginner-trait .beginner-trait-desc{font-size:13px;margin:0;color:var(--py-muted,var(--muted))}
.beginner-app .beginner-example{padding:15px;background:var(--py-panel-tint,var(--panel));border:1px solid var(--py-border-soft,var(--line));border-radius:11px}
.beginner-app .beginner-example>strong{font-size:14px}
.beginner-app .beginner-example-stats{display:flex;align-items:center;gap:10px;margin:10px 0}
.beginner-app .beginner-example-stats>div{min-width:0;flex:1;padding:11px;border-radius:9px;border:1px solid var(--py-border-soft,var(--line));background:var(--py-panel,var(--panel));display:grid;gap:4px}
.beginner-app .beginner-example-stats>div span{font-size:13px;color:var(--py-muted,var(--muted))}
.beginner-app .beginner-example-stats>div b{font-size:15px}
.beginner-app .beginner-example-arrow{font-size:20px;color:var(--py-primary,var(--accent))}
.beginner-app .beginner-advice,.beginner-app .beginner-consideration,.beginner-app .beginner-language-guidance{padding:15px 16px;border-left:3px solid var(--py-primary,var(--accent));border-radius:0 10px 10px 0;background:var(--py-panel,var(--panel))}
.beginner-app .beginner-consideration{border-left-color:var(--py-border-strong,var(--line))}
.beginner-app .beginner-consideration strong{font-size:15px}
.beginner-app .beginner-consideration p{margin-top:9px}
.beginner-app .beginner-language-status{font-weight:700;color:var(--py-primary,var(--accent))}
.beginner-app .beginner-guide-reference{font-size:12px!important;color:var(--py-muted,var(--muted));border-top:1px solid var(--py-border-soft,var(--line));padding-top:12px}
.beginner-app .beginner-original-rules>summary{font-size:14px}
.beginner-app .beginner-original-rules>div{margin:10px 15px}
.beginner-app .beginner-original-rules>.species-feature-details{margin-bottom:15px}
.beginner-app .beginner-original-rules .blurb-box{max-width:100%}
.beginner-app .beginner-guide-topic{position:relative;display:inline-flex;align-items:center;vertical-align:middle}
.beginner-app .beginner-guide-help{display:inline-flex;align-items:center;justify-content:center;width:23px;height:23px;border-radius:50%;padding:0;background:var(--py-panel-tint,var(--panel));border:1px solid var(--py-border,var(--line));color:var(--py-primary,var(--accent));cursor:pointer;font:700 13px/1 Arial,sans-serif}
.beginner-app .beginner-guide-help:focus-visible{outline:3px solid var(--py-primary,var(--accent));outline-offset:2px}
.beginner-app .beginner-guide-help:hover,.beginner-app .beginner-guide-topic.is-open .beginner-guide-help{background:var(--py-primary,var(--accent));color:var(--py-on-primary,#fff)}
.beginner-app .beginner-guide-tooltip{position:absolute;z-index:20;top:calc(100% + 8px);left:-6px;width:min(335px,calc(100vw - 54px));padding:13px 15px;border:1px solid var(--py-border-strong,var(--line));border-radius:10px;background:var(--py-panel,var(--panel));box-shadow:0 10px 30px var(--py-shadow-color,rgba(0,0,0,.2));color:var(--py-text,var(--text));font-size:13px;font-weight:400;line-height:1.5;text-align:left}
.beginner-app .beginner-guide-tooltip[hidden]{display:none}
.beginner-app .beginner-tooltip-title,.beginner-app .beginner-tooltip-text,.beginner-app .beginner-tooltip-example{display:block}
.beginner-app .beginner-tooltip-title{font-weight:750;font-size:14px;margin-bottom:6px}
.beginner-app .beginner-tooltip-example{border-top:1px solid var(--py-border-soft,var(--line));margin-top:9px;padding-top:9px;color:var(--py-muted,var(--muted))}
.beginner-app .beginner-trait:nth-child(2n) .beginner-guide-tooltip{left:auto;right:-6px}
@media(max-width:640px){
 .beginner-app .beginner-intro-columns,.beginner-app .beginner-trait-grid{grid-template-columns:1fr}
 .beginner-app .beginner-human-guide{padding:15px 13px;gap:14px}
 .beginner-app .beginner-guide-title{font-size:22px}
 .beginner-app .beginner-trait:nth-child(2n) .beginner-guide-tooltip{left:-6px;right:auto}
}
@media (prefers-reduced-motion: reduce){.beginner-app *{scroll-behavior:auto!important}}

/* Non-modal replacement for legacy alert() notices in this standalone copy. */
.beginner-app .beginner-global-notice{position:fixed;right:18px;bottom:18px;z-index:1000;max-width:min(430px,calc(100vw - 36px));padding:14px 16px;border:2px solid var(--py-border-strong,var(--line));border-radius:12px;background:var(--py-panel,var(--panel));color:var(--py-text,var(--text));box-shadow:0 14px 45px var(--py-shadow-color,rgba(0,0,0,.2))}
.beginner-app .beginner-global-notice-header{display:flex;align-items:center;justify-content:space-between;gap:14px}
.beginner-app .beginner-global-notice-close{width:29px;height:29px;cursor:pointer;background:var(--py-panel-soft,var(--panel));color:var(--py-text,var(--text));border:1px solid var(--py-border,var(--line));border-radius:8px;font-size:20px}
.beginner-app .beginner-global-notice-message{margin:9px 0 0;white-space:pre-wrap;line-height:1.48;font-size:14px;max-height:35vh;overflow:auto}

/* Human option comparison: compact, accessible, theme-aware, and entirely educational. */
.beginner-app .beginner-human-compare{padding:16px 17px;background:var(--py-panel-soft,var(--panel));border:1px solid var(--py-border-soft,var(--line));border-radius:13px;margin:16px 0 0;display:grid;gap:11px}
.beginner-app .beginner-human-compare>h3{font-size:16px;margin:0;color:var(--py-text-strong,var(--text))}
.beginner-app .beginner-compare-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.beginner-app .beginner-compare-option{border:1px solid var(--py-border-soft,var(--line));border-radius:9px;background:var(--py-panel,var(--panel));padding:12px 13px;min-width:0}
.beginner-app .beginner-compare-option.is-selected{border-color:var(--py-primary,var(--accent));box-shadow:inset 0 0 0 1px var(--py-primary,var(--accent))}
.beginner-app .beginner-compare-option strong{display:block;font-size:14px;margin-bottom:6px}
.beginner-app .beginner-compare-option p{font-size:13px;line-height:1.55;margin:0}
.beginner-app .beginner-compare-note{font-size:12px;line-height:1.5;color:var(--py-muted,var(--muted));margin:0}
.beginner-app .beginner-variant-choices{display:grid;gap:9px}
.beginner-app .beginner-variant-choice-row{display:grid;gap:3px;padding:9px 11px;border:1px solid var(--py-border-soft,var(--line));border-radius:8px;background:var(--py-panel,var(--panel))}
.beginner-app .beginner-variant-choice-row strong{font-size:13px}
.beginner-app .beginner-variant-choice-row span{font-size:13px;color:var(--py-primary,var(--accent));overflow-wrap:anywhere}
.beginner-app .beginner-variant-choice-row span.is-pending{color:var(--py-muted,var(--muted))}
@media(max-width:640px){.beginner-app .beginner-compare-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.beginner-app .beginner-intro>summary::after,.beginner-app .beginner-original-rules>summary::after{transition:none}}

/* Version/subspecies cards replace the native dropdown, not the underlying rules. */
.beginner-app .beginner-version-picker .beginner-compare-option{font:inherit;color:var(--py-text,var(--text));text-align:left;width:100%;display:block;cursor:pointer;transition:border-color .16s ease,background .16s ease,box-shadow .16s ease}
.beginner-app .beginner-version-picker .beginner-compare-option:hover{border-color:var(--py-primary,var(--accent));background:var(--py-panel-tint,var(--panel))}
.beginner-app .beginner-version-picker .beginner-compare-option:focus-visible{outline:3px solid var(--py-primary,var(--accent));outline-offset:3px}
.beginner-app .beginner-version-picker .beginner-compare-option.is-selected{background:var(--py-panel-tint,var(--panel));position:relative;padding-right:33px}
.beginner-app .beginner-version-picker .beginner-compare-option.is-selected::after{content:'✓';position:absolute;top:11px;right:12px;font-weight:900;color:var(--py-primary,var(--accent))}
.beginner-app .beginner-compare-description{display:block;font-size:13px;line-height:1.55;font-weight:400}
.beginner-app .beginner-picker-hint{margin:0;color:var(--py-muted,var(--muted));font-size:13px;line-height:1.45}
.beginner-app .species-choices-block label:has(.beginner-guide-topic){display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.beginner-app .species-choices-block .beginner-guide-tooltip{min-width:260px;max-width:calc(100vw - 52px)}
.beginner-app .species-choices-block .field:nth-child(3n) .beginner-guide-tooltip{left:auto;right:-5px}
@media(max-width:760px){.beginner-app .species-choices-block .field:nth-child(3n) .beginner-guide-tooltip{left:-6px;right:auto}}
@media(prefers-reduced-motion:reduce){.beginner-app .beginner-version-picker .beginner-compare-option{transition:none}}

/* Contextual help is body text, not another uppercase field label. The base
   Character Forge's label typography would otherwise bleed into the popover. */
.beginner-app .beginner-guide-tooltip,
.beginner-app .beginner-guide-tooltip * {
  text-transform:none!important;
  letter-spacing:normal!important;
  font-variant:normal;
  font-style:normal;
  white-space:normal;
}
.beginner-app .beginner-guide-tooltip {
  font-family:inherit;
  font-size:14px;
  font-weight:400;
  line-height:1.55;
}
.beginner-app .beginner-guide-tooltip .beginner-tooltip-title {
  font-size:14px;
  font-weight:750;
  line-height:1.35;
}
.beginner-app .beginner-guide-tooltip .beginner-tooltip-text,
.beginner-app .beginner-guide-tooltip .beginner-tooltip-example {
  font-size:13px;
  font-weight:400;
  line-height:1.55;
}

/* A compact guide for Half-Elf's larger ancestry-choice menu. */
.beginner-half-elf-option-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,245px),1fr));gap:9px;margin-top:12px}
.beginner-ancestry-choice{display:flex;flex-direction:column;gap:4px;background:var(--card-bg,rgba(241,248,243,.7));border:1px solid var(--border,#cbe8d7);border-radius:12px;padding:12px 14px;color:inherit;line-height:1.45;font-size:13px}
.beginner-ancestry-choice strong{font-size:14px;text-transform:none;letter-spacing:normal}
.beginner-ancestry-choice span{opacity:.85}
.beginner-ancestry-choice.is-selected{border:2px solid #258558;padding:11px 13px}
.beginner-ancestry-selected{margin-top:12px;padding:12px 14px;border:1px solid #70b48d;border-radius:12px;line-height:1.5}
.beginner-ancestry-selected strong{font-size:14px;text-transform:none;letter-spacing:normal}
.beginner-ancestry-selected p{margin:.4em 0 0}

/* Nine infernal bloodlines are compared without creating another stateful selector. */
.beginner-app .beginner-tiefling-option-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,185px),1fr));gap:9px;margin:12px 0}
.beginner-app .beginner-tiefling-option{display:flex;flex-direction:column;gap:4px;padding:11px 12px;border:1px solid var(--py-border-soft,var(--line));border-radius:10px;background:var(--py-panel,var(--panel));min-width:0}
.beginner-app .beginner-tiefling-option.is-selected{border-color:var(--py-primary,var(--accent));box-shadow:inset 0 0 0 1px var(--py-primary,var(--accent));background:var(--py-panel-tint,var(--panel))}
.beginner-app .beginner-tiefling-option strong{font-size:14px;letter-spacing:normal;text-transform:none}
.beginner-app .beginner-tiefling-option span{font-size:13px;font-weight:600}
.beginner-app .beginner-tiefling-option p{font-size:13px;margin:0;line-height:1.5}
.beginner-app .beginner-tiefling-spells{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,175px),1fr));gap:9px;margin-top:12px}
.beginner-app .beginner-tiefling-spell{display:flex;flex-direction:column;gap:5px;padding:12px;border-radius:9px;border:1px solid var(--py-border-soft,var(--line));background:var(--py-panel,var(--panel));font-size:13px}
.beginner-app .beginner-tiefling-spell strong{font-size:13px;text-transform:none;letter-spacing:normal}

/* Beginner Builder 0.1.0 F: selectable bloodline and multi-stage Dragonborn cards */
.beginner-app .beginner-tiefling-cards{grid-template-columns:repeat(3,minmax(0,1fr))}
.beginner-app .beginner-dragon-ancestry-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
.beginner-app .beginner-dragon-step{margin-top:20px;padding-top:17px;border-top:1px solid var(--py-border-soft,var(--line))}
.beginner-app .beginner-dragon-step>h3{margin:0 0 7px;font-size:17px;text-transform:none;letter-spacing:normal}
.beginner-app .beginner-dragon-step .beginner-compare-grid{margin-top:12px}
.beginner-app .beginner-dragon-ancestry-grid .beginner-compare-option{min-width:0;padding:12px}
.beginner-app .beginner-tiefling-cards .beginner-compare-option{min-width:0}
@media(max-width:900px){.beginner-app .beginner-tiefling-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.beginner-app .beginner-dragon-ancestry-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:560px){.beginner-app .beginner-tiefling-cards,.beginner-app .beginner-dragon-ancestry-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.beginner-app .beginner-dragon-version-grid,.beginner-app .beginner-dragon-family-grid{grid-template-columns:1fr}}

/* Beginner Backgrounds — guidance and character writing in one visible flow. */
.beginner-app .beginner-background-intro{margin-top:14px;margin-bottom:0}
.beginner-app .beginner-background-source{font-size:12px;line-height:1.5;color:var(--py-muted,var(--muted));margin:13px 0 0;border-top:1px solid var(--py-border-soft,var(--line));padding-top:9px}
.beginner-app .beginner-background-grants,.beginner-app .beginner-background-personality{margin:16px 0 0;border:1px solid var(--py-border-soft,var(--line));border-radius:14px;padding:17px;background:var(--py-panel-soft,var(--panel));min-width:0}
.beginner-app .beginner-background-grants h2,.beginner-app .beginner-background-personality h2{margin:0 0 8px;font-size:20px;line-height:1.3}
.beginner-app .beginner-background-muted{font-size:13px;line-height:1.55;color:var(--py-muted,var(--muted));margin:5px 0 11px}
.beginner-app .beginner-background-grant{margin:12px 0;display:grid;gap:5px}
.beginner-app .beginner-background-grant>strong{font-size:14px}
.beginner-app .beginner-background-grant-values{display:flex;flex-wrap:wrap;gap:7px}
.beginner-app .beginner-background-grant-chip{display:inline-flex;gap:7px;align-items:center;padding:7px 10px;border:1px solid var(--py-border-soft,var(--line));border-radius:9px;background:var(--py-panel,var(--panel));font-size:13px;min-height:39px}
.beginner-app .beginner-background-equipment{margin-top:14px;padding:12px 14px;background:var(--py-panel,var(--panel));border:1px solid var(--py-border-soft,var(--line));border-radius:10px;font-size:14px}
.beginner-app .beginner-background-equipment p{margin:8px 0 0;line-height:1.58;font-size:13px;white-space:pre-wrap}
.beginner-app .beginner-background-choice-heading{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-bottom:7px}
.beginner-app .beginner-background-choice-heading label{margin:0;display:inline;min-width:0}
.beginner-app .beginner-background-choice-field{min-width:0}
.beginner-app .beginner-background-feature-intro{padding:12px 14px;border-left:3px solid var(--py-primary,var(--accent));border-radius:0 10px 10px 0;background:var(--py-panel-soft,var(--panel));margin-bottom:14px}
.beginner-app .beginner-background-feature-intro strong{font-size:14px}
.beginner-app .beginner-background-feature-intro p{margin:8px 0 0;font-size:13px;line-height:1.55}
.beginner-app .beginner-background-summary{line-height:1.55;font-size:13px;margin:0 0 16px;color:var(--py-text,var(--text));border-left:3px solid var(--py-border-soft,var(--line));padding-left:13px}
.beginner-app .beginner-background-personality{display:grid;gap:16px}
.beginner-app .beginner-background-personality-panel{min-width:0;padding:16px;background:var(--py-panel,var(--panel));border:1px solid var(--py-border-soft,var(--line));border-radius:12px}
.beginner-app .beginner-background-personality-heading h3{margin:0;font-size:17px;line-height:1.35}
.beginner-app .beginner-background-prompts{font-size:14px;font-weight:650;line-height:1.5;margin:8px 0 3px}
.beginner-app .beginner-background-editor{display:grid;gap:10px;margin:12px 0}
.beginner-app .beginner-background-edit-slot{padding:10px;border:1px solid var(--py-border-soft,var(--line));border-radius:10px;min-width:0}
.beginner-app .beginner-background-edit-slot.is-active{border-color:var(--py-primary,var(--accent));box-shadow:inset 0 0 0 1px var(--py-primary,var(--accent))}
.beginner-app .beginner-background-edit-slot>label{display:block;font-size:13px;font-weight:650;text-transform:none;letter-spacing:normal;margin:0 0 7px}
.beginner-app textarea.beginner-background-edit-textarea{display:block;width:100%;min-width:0;box-sizing:border-box;min-height:67px;resize:vertical;line-height:1.5;font-size:14px;font-family:inherit}
.beginner-app .beginner-background-slot-actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:8px}
.beginner-app .beginner-background-action{font-size:12px;min-height:34px;padding:6px 11px}
.beginner-app .beginner-background-suggestions{margin-top:14px}
.beginner-app .beginner-background-suggestions-head{font-size:14px}
.beginner-app .beginner-background-option-list{display:grid;gap:6px;max-height:none;overflow:visible;padding:2px 2px 2px 2px}
.beginner-app .beginner-background-option{display:flex;align-items:flex-start;gap:10px;text-align:left;width:100%;font:inherit;font-size:13px;line-height:1.5;letter-spacing:normal;text-transform:none;padding:10px 12px;min-height:44px;cursor:pointer;border:1px solid var(--py-border-soft,var(--line));border-radius:9px;color:var(--py-text,var(--text));background:var(--py-panel-soft,var(--panel));white-space:normal}
.beginner-app .beginner-background-option:hover,.beginner-app .beginner-background-option:focus-visible{border-color:var(--py-primary,var(--accent));outline-offset:2px}
.beginner-app .beginner-background-option.is-chosen{border-color:var(--py-primary,var(--accent));background:var(--py-panel-tint,var(--panel))}
.beginner-app .beginner-background-option-roll{flex:0 0 27px;display:inline-flex;justify-content:center;border-radius:7px;padding:2px 0;font-weight:750;color:var(--py-primary,var(--accent));border:1px solid var(--py-border-soft,var(--line))}
.beginner-app .beginner-background-option-content{flex:1;min-width:0;overflow-wrap:anywhere}
.beginner-app .beginner-background-personality-panel:focus-within{scroll-margin-top:145px}
@media(max-width:640px){.beginner-app .beginner-background-grants,.beginner-app .beginner-background-personality{padding:12px}.beginner-app .beginner-background-personality-panel{padding:12px}.beginner-app .beginner-background-option-list{max-height:none;overflow:visible}}
.beginner-app .beginner-background-quick-look{margin-top:10px;line-height:1.55;font-size:14px}
.beginner-app .beginner-background-quick-look>strong{display:block;font-size:14px;margin-bottom:5px}
.beginner-app .beginner-background-quick-look p{margin:0;font-size:14px;line-height:1.6}
.beginner-app .beginner-background-full-description{margin:12px 0 0!important}
.beginner-app .beginner-background-full-description>summary{font-size:13px}
.beginner-app .beginner-background-full-description>div{font-size:13px;line-height:1.55;margin:0 15px 14px}

.beginner-app .beginner-background-suggestions{margin:12px 0 0}
.beginner-app .beginner-background-table-actions{display:flex;gap:9px;flex-wrap:wrap;margin:12px 0 0}
.beginner-app .beginner-background-editor{margin:14px 0 0}
.beginner-app .beginner-background-final-help{font-size:13px;line-height:1.5;color:var(--py-muted,var(--muted));margin:0 0 7px}

/* 0.1.0 I A: the main creator theme clips .nested-choice to make rounded
   tables. Background's inline help needs to escape that container. Scope the
   change to Character Details so other panels keep their intended clipping. */
.beginner-app #pageBackground .beginner-background-character-details {
  position:relative;
  z-index:4;
}
.beginner-app #pageBackground .beginner-background-character-details > .nested-choice {
  overflow:visible;
}
.beginner-app #pageBackground .beginner-background-character-details .beginner-guide-tooltip {
  z-index:80;
}

/* 0.1.0 J — introductory Fighter guide, focused level context, reusable Fighting Styles. */
.beginner-app .beginner-class-intro,.beginner-app .beginner-class-overview{margin:0 0 18px;padding:18px 19px;border:1px solid var(--py-border-soft,var(--line));border-radius:14px;background:var(--py-panel-soft,var(--panel));color:var(--py-text,var(--text));}
.beginner-app .beginner-class-intro h2,.beginner-app .beginner-class-overview h2{font-size:23px;margin:0 0 9px}
.beginner-app .beginner-class-intro p,.beginner-app .beginner-class-overview p{line-height:1.6;margin:6px 0;font-size:14px}
.beginner-app .beginner-class-eyebrow{color:var(--py-muted,var(--muted));font-weight:700;font-size:12px}
.beginner-app .beginner-class-overview-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:15px}
.beginner-app .beginner-class-panel{min-width:0;border:1px solid var(--py-border-soft,var(--line));border-radius:10px;background:var(--py-panel,var(--panel));padding:14px}
.beginner-app .beginner-class-panel h3{font-size:16px;margin:0 0 7px}
.beginner-app .beginner-class-panel p{font-size:13px;margin:0;line-height:1.5}
.beginner-app .beginner-class-current{margin-top:15px;padding:14px;border-left:3px solid var(--py-primary,var(--accent));background:var(--py-panel,var(--panel));border-radius:0 10px 10px 0}
.beginner-app .beginner-class-current h3{font-size:17px;margin:0 0 10px}
.beginner-app .beginner-class-feature-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.beginner-app .beginner-class-feature{border:1px solid var(--py-border-soft,var(--line));border-radius:9px;padding:10px;min-width:0}
.beginner-app .beginner-class-feature strong{font-size:13px}
.beginner-app .beginner-class-feature p{font-size:13px}
.beginner-app .beginner-class-source{font-size:12px!important;color:var(--py-muted,var(--muted));margin-top:14px!important}
.beginner-app .beginner-class-current-style{font-weight:650;color:var(--py-primary,var(--accent))}
.beginner-app .beginner-class-selection-heading{margin:20px 0 12px}
.beginner-app .beginner-class-selection-heading h2{font-size:19px;margin:0 0 6px}
.beginner-app .beginner-class-selection-heading p,.beginner-app .beginner-class-hint{color:var(--py-muted,var(--muted));font-size:13px;line-height:1.5}
.beginner-app .beginner-class-styles{margin:15px 0}
.beginner-app .beginner-class-styles h4{font-size:17px;margin:0 0 7px}
.beginner-app .beginner-class-style-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:12px 0}
.beginner-app .beginner-class-style-card{font:inherit;color:var(--py-text,var(--text));text-align:left;cursor:pointer;border:1px solid var(--py-border-soft,var(--line));border-radius:10px;padding:12px;min-width:0;background:var(--py-panel,var(--panel));display:flex;flex-direction:column;gap:5px}
.beginner-app .beginner-class-style-card:hover,.beginner-app .beginner-class-style-card.is-selected{border-color:var(--py-primary,var(--accent));background:var(--py-panel-tint,var(--panel))}
.beginner-app .beginner-class-style-card.is-selected{box-shadow:inset 0 0 0 1px var(--py-primary,var(--accent))}
.beginner-app .beginner-class-style-card:focus-visible{outline:3px solid var(--py-primary,var(--accent));outline-offset:2px}
.beginner-app .beginner-class-style-card strong{font-size:14px}
.beginner-app .beginner-class-style-tag{font-size:13px;font-weight:650;color:var(--py-primary,var(--accent))}
.beginner-app .beginner-class-style-description{font-size:13px;line-height:1.5}
.beginner-app .beginner-class-style-meta{font-size:12px;color:var(--py-muted,var(--muted))}
.beginner-app .beginner-class-native-select{display:none}
.beginner-app .beginner-class-full-progression{margin:20px 0 8px;padding:13px;border:1px solid var(--py-border-soft,var(--line));border-radius:10px;background:var(--py-panel-soft,var(--panel))}
.beginner-app .beginner-class-full-progression>summary{cursor:pointer;font-weight:700}
.beginner-app .beginner-class-full-progression table{margin-top:11px;width:100%}
.beginner-app .beginner-class-full-progression p{font-size:13px}
.beginner-app .beginner-class-modal-summary h3{font-size:17px;margin:0 0 7px}
.beginner-app .beginner-class-modal-summary p,.beginner-app .beginner-class-modal-summary li{font-size:14px;line-height:1.5}
.beginner-app .beginner-class-modal-summary li{margin-bottom:5px}
.beginner-app #pageClass .field label:has(.beginner-guide-topic){display:flex;align-items:center;gap:7px;flex-wrap:wrap}
@media(max-width:680px){.beginner-app .beginner-class-overview-grid,.beginner-app .beginner-class-feature-list,.beginner-app .beginner-class-style-grid{grid-template-columns:1fr}}
/* Skill help on the Class page must not be clipped by the inherited nested-choice box. */
.beginner-app #pageClass .nested-choice:has(.beginner-guide-topic){overflow:visible;position:relative}
.beginner-app #pageClass .field-grid .field:nth-child(even) .beginner-guide-tooltip{left:auto;right:-6px}
@media(max-width:640px){.beginner-app #pageClass .field-grid .field:nth-child(even) .beginner-guide-tooltip{left:-6px;right:auto}}

/* 0.1.0 K — Class and proficiency explanations. Keep all help readable without
   trapping it inside the creator's rounded feature rows. */
.beginner-app #pageClass .beginner-class-intro{margin:16px 0 18px}
.beginner-app #pageClass .creator-class-proficiencies-feature,
.beginner-app #pageClass .creator-class-proficiencies-feature .creator-class-proficiency-lines,
.beginner-app #pageClass .feature-item:has(.beginner-guide-topic),
.beginner-app #pageClass .nested-choice:has(.beginner-guide-topic),
.beginner-app #pageClass .beginner-class-feature:has(.beginner-guide-topic){overflow:visible}
.beginner-app #pageClass .creator-class-proficiency-lines>p{display:flex;align-items:center;gap:8px;flex-wrap:wrap;line-height:1.55;margin:8px 0}
.beginner-app #pageClass .creator-class-proficiency-lines>p>strong{margin-right:-3px}
.beginner-app #pageClass .beginner-class-feature-heading{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}
.beginner-app #pageClass .beginner-class-feature-heading>strong{line-height:1.5}
.beginner-app #pageClass .beginner-class-hitdie{margin-bottom:12px}
.beginner-app #pageClass .beginner-class-feature:nth-child(even) .beginner-guide-tooltip{left:auto;right:-5px}
.beginner-app #pageClass .creator-class-proficiency-lines>p:nth-child(n+4) .beginner-guide-tooltip{left:auto;right:-5px}
.beginner-app .beginner-abilities-hitdice-note{line-height:1.5;margin:12px 0 4px}
@media(max-width:700px){
 .beginner-app #pageClass .beginner-class-feature:nth-child(even) .beginner-guide-tooltip,
 .beginner-app #pageClass .creator-class-proficiency-lines>p:nth-child(n+4) .beginner-guide-tooltip{left:-6px;right:auto}
}

/* 0.1.0 L — Fighter Martial Archetype selection and educational guides. */
.beginner-app .beginner-fighter-subclass-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:14px 0 17px}
.beginner-app .beginner-fighter-subclass-card{appearance:none;border:1px solid var(--py-border-soft,var(--line));border-radius:11px;background:var(--py-panel,var(--panel));font:inherit;color:var(--py-text,var(--text));padding:13px 14px;min-width:0;text-align:left;cursor:pointer;display:flex;flex-direction:column;gap:6px;letter-spacing:normal;text-transform:none;line-height:1.48}
.beginner-app .beginner-fighter-subclass-card:hover,.beginner-app .beginner-fighter-subclass-card.is-selected{border-color:var(--py-primary,var(--accent));background:var(--py-panel-tint,var(--panel))}
.beginner-app .beginner-fighter-subclass-card.is-selected{box-shadow:inset 0 0 0 1px var(--py-primary,var(--accent))}
.beginner-app .beginner-fighter-subclass-card:focus-visible{outline:3px solid var(--py-primary,var(--accent));outline-offset:2px}
.beginner-app .beginner-fighter-subclass-card-title{display:flex;justify-content:space-between;align-items:center;gap:9px;min-width:0}
.beginner-app .beginner-fighter-subclass-card-title strong{font-size:15px}
.beginner-app .beginner-fighter-subclass-state{font-size:12px;color:var(--py-muted,var(--muted));font-weight:600}
.beginner-app .beginner-fighter-subclass-card.is-selected .beginner-fighter-subclass-state{color:var(--py-primary,var(--accent))}
.beginner-app .beginner-fighter-subclass-tag{font-size:12px;font-weight:650;color:var(--py-primary,var(--accent))}
.beginner-app .beginner-fighter-subclass-pitch{font-size:13px;line-height:1.5;color:var(--py-text,var(--text));opacity:.9}
.beginner-app .beginner-fighter-subclass-guide{border:1px solid var(--py-border-soft,var(--line));border-radius:11px;background:var(--py-panel-soft,var(--panel));padding:16px 18px;margin:15px 0}
.beginner-app .beginner-fighter-subclass-guide h3{font-size:19px;margin:6px 0 9px}
.beginner-app .beginner-fighter-subclass-guide p{font-size:14px;line-height:1.6;margin:5px 0 12px}
.beginner-app .beginner-fighter-subclass-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:12px 0}
.beginner-app .beginner-fighter-subclass-facts .beginner-class-panel h4{font-size:15px;margin:0 0 6px}
.beginner-app .beginner-fighter-subclass-facts .beginner-class-panel p{font-size:13px;margin:0;line-height:1.5}
.beginner-app .beginner-fighter-subclass-level-note{border-left:3px solid var(--py-primary,var(--accent));padding:10px 12px;margin-top:14px;background:var(--py-panel,var(--panel));border-radius:0 8px 8px 0}
.beginner-app .beginner-fighter-subclass-level-note strong{font-size:14px}
.beginner-app .beginner-fighter-subclass-level-note p{font-size:13px;margin:6px 0 0}
.beginner-app .beginner-fighter-subclass-reference{border:1px solid var(--py-border-soft,var(--line));border-radius:10px;margin:12px 0;padding:11px 13px;background:var(--py-panel-soft,var(--panel))}
.beginner-app .beginner-fighter-subclass-reference>summary{font-weight:700;font-size:14px;cursor:pointer}
.beginner-app .beginner-fighter-subclass-reference>.feature-item{margin-top:10px}
.beginner-app #pageClass .fighter-maneuver-selectors .field label,.beginner-app #pageClass .fighter-arcane-shot-selectors .field label{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.beginner-app #pageClass .fighter-maneuver-selectors,.beginner-app #pageClass .fighter-arcane-shot-selectors{overflow:visible}
@media(max-width:680px){.beginner-app .beginner-fighter-subclass-grid,.beginner-app .beginner-fighter-subclass-facts{grid-template-columns:1fr}.beginner-app .beginner-fighter-subclass-guide{padding:12px}}

/* Help inside open rules/reference details must extend beyond the panel edge. */
.beginner-app #pageClass details.choice-description:has(.beginner-guide-topic){overflow:visible}

/* Core Barbarian uses the shared Fighter teaching panels and responsive spacing. */
.beginner-app .beginner-barbarian-resources{margin:12px 0;gap:8px;flex-wrap:wrap}
.beginner-app .beginner-barbarian-resources .counter-pill{display:flex;align-items:center;gap:7px;flex-wrap:wrap;overflow:visible}
.beginner-app .beginner-barbarian-table-scroll{overflow-x:auto;margin-top:12px}
.beginner-app .beginner-barbarian-progression .feature-table{width:100%;min-width:460px}
/* Mobile reference cards retain rounded borders without clipping their help. */
.beginner-app #pageClass :is(.fighter-arcane-shot-reference-table,.fighter-maneuver-reference-table,.fighter-rune-reference-table),
.beginner-app #pageClass :is(.fighter-arcane-shot-reference-table,.fighter-maneuver-reference-table,.fighter-rune-reference-table) tr{overflow:visible!important}

/* Shared core attack count and Barbarian option references. */
.beginner-app .beginner-core-attacks{margin:12px 0;gap:8px;flex-wrap:wrap}
.beginner-app .beginner-core-attacks .counter-pill{display:flex;align-items:center;gap:7px;overflow:visible}
.beginner-app .beginner-barbarian-option-table,.beginner-app .beginner-barbarian-option-table tr{overflow:visible!important}
.beginner-app .beginner-barbarian-option-reference{margin-top:12px}
.beginner-app .beginner-barbarian-option-reference td:first-child{vertical-align:top}
.beginner-app .beginner-barbarian-option-reference .creator-spell-name-button{white-space:normal}
.beginner-app #subclassModalBackdrop .beginner-guide-tooltip{z-index:10010}
.beginner-app #subclassModalBackdrop .feature-item:has(.beginner-guide-topic),.beginner-app #subclassModalBackdrop details:has(.beginner-guide-topic){overflow:visible}
/* Match the shared mobile card rules' specificity so reference help remains visible. */
.beginner-app :is(#pageClass,#subclassModalBackdrop) .beginner-barbarian-option-table,
.beginner-app :is(#pageClass,#subclassModalBackdrop) .beginner-barbarian-option-table tr{overflow:visible!important}
.beginner-app .beginner-barbarian-option-table :is(th,td):first-child{width:26%}

/* Contextual summaries in the remaining Barbarian reference tables. */
.beginner-app :is(#pageClass,#subclassModalBackdrop) .beginner-barbarian-help-reference .feature-table,
.beginner-app :is(#pageClass,#subclassModalBackdrop) .beginner-barbarian-help-reference .feature-table tr{overflow:visible!important}
.beginner-app .beginner-barbarian-help-reference{margin-top:12px}
.beginner-app :is(#pageClass,#subclassModalBackdrop) .beginner-barbarian-help-reference .barbarian-feature-table-wrap{overflow:visible!important}

/* Wizard reference helpers must escape their cells and rule disclosures. */
.beginner-app .beginner-wizard-reference, .beginner-app .beginner-wizard-reference :is(table,tbody,tr,td), .beginner-app :is(.wizard-spellcasting-rules,.wizard-spellcasting-feature-rules), .beginner-app details:has(> .wizard-spellcasting-rules), .beginner-app details:has(> .wizard-spellcasting-feature-rules) {overflow:visible!important;}
.beginner-wizard-reference {margin:14px 0 22px;}
.beginner-wizard-reference .counter-row {margin-top:14px;}
.beginner-app :is(.beginner-wizard-reference,.beginner-wizard-overview,.wizard-spellcasting-rules,.wizard-spellcasting-feature-rules) .beginner-guide-help {width:23px;min-width:23px;height:23px;min-height:23px;flex-shrink:0;}

/* School reference helpers must remain visible outside rounded tables. */
.beginner-app :is(.beginner-wizard-subclass-feature,.beginner-wizard-option-reference,.beginner-wizard-option-table,.beginner-wizard-option-table tbody,.beginner-wizard-option-table tr,.beginner-wizard-option-table td){overflow:visible!important;}
.beginner-app :is(.beginner-wizard-subclass-feature,.beginner-wizard-option-reference) .beginner-guide-help {width:23px;min-width:23px;height:23px;min-height:23px;flex-shrink:0;}
.beginner-wizard-full-rules {margin-top:10px;}

.beginner-app :is(#pageClass,#subclassModalBackdrop) :is(.beginner-wizard-option-table,.beginner-wizard-option-table tr,.beginner-wizard-option-table td){overflow:visible!important;}

/* Feature rules remain visible; helper panels can extend beyond their cards. */
.beginner-app #pageClass .creator-spell-mode-description:has(.beginner-guide-topic),
.beginner-app #pageClass .wizard-spellcasting-info,
.beginner-app :is(#pageClass,#subclassModalBackdrop) .beginner-wizard-subclass-feature,
.beginner-app #pageClass .beginner-wizard-subclass-feature .integrated-feature-choice {overflow:visible!important;}
.beginner-app #pageClass .creator-spell-mode-description > strong {position:relative;z-index:1;}
.beginner-app .beginner-wizard-full-rules {margin-top:10px;line-height:1.6;}
.beginner-app .beginner-wizard-option-reference > h4 {margin:0 0 10px;}
.beginner-app #pageClass .creator-spell-mode-description .beginner-guide-help {min-height:23px;min-width:23px;height:23px;width:23px;}

.beginner-app #spellModeWrap:has(.wizard-spellcasting-info) .beginner-guide-help,
.beginner-app #progressionWrap:has(.beginner-wizard-overview) .beginner-guide-help {min-height:23px;min-width:23px;height:23px;width:23px;}

/* Artificer guidance: full rules stay visible and helper panels escape their cards. */
.beginner-app :is(#pageClass,#subclassModalBackdrop,#modalBackdrop) :is(.artificer-source-table,.artificer-infusion-reference-table,.artificer-known-infusions-table,.artificer-replicate-reference-table,.beginner-artificer-option-table),
.beginner-app :is(#pageClass,#subclassModalBackdrop,#modalBackdrop) :is(.artificer-source-table,.artificer-infusion-reference-table,.artificer-known-infusions-table,.artificer-replicate-reference-table,.beginner-artificer-option-table) :is(tbody,tr,td),
.beginner-app :is(#pageClass,#subclassModalBackdrop,#modalBackdrop) .artificer-table-scroll:has(.beginner-guide-topic),
.beginner-app :is(#pageClass,#subclassModalBackdrop,#modalBackdrop) :is(.artificer-reference-details,.artificer-known-infusions-details,.beginner-artificer-option-reference,.beginner-artificer-spell-info):has(.beginner-guide-topic),
.beginner-app #pageClass :is(.artificer-infusion-selectors,.artificer-infusion-slot,.creator-replicated-items-section):has(.beginner-guide-topic),
.beginner-app #pageClass [data-artificer-feature], .beginner-app .creator-replica-choice:has(.beginner-guide-topic) {overflow:visible!important;}
.beginner-app #progressionWrap:has(.beginner-artificer-overview) .beginner-guide-help,
.beginner-app #spellModeWrap:has(.beginner-artificer-spell-info) .beginner-guide-help,
.beginner-app .beginner-artificer-option-reference .beginner-guide-help {width:23px;min-width:23px;height:23px;min-height:23px;flex-shrink:0;}
.beginner-app .beginner-artificer-option-reference h4 {margin:0 0 10px;}
.beginner-app .beginner-artificer-spell-reference {margin:14px 0;}
.beginner-app .beginner-artificer-option-table {width:100%;}
.beginner-app .beginner-artificer-option-table td:first-child {width:26%;}
.beginner-app .creator-replica-modal-backdrop .beginner-guide-tooltip {z-index:10020;}

.beginner-app :is(#pageClass,#subclassModalBackdrop,#modalBackdrop) .artificer-subclass-spell-table,
.beginner-app :is(#pageClass,#subclassModalBackdrop,#modalBackdrop) .artificer-subclass-spell-table :is(tbody,tr,td) {overflow:visible!important;}
.beginner-app .beginner-artificer-granted-spell {display:inline-block;margin:4px 12px 4px 0;max-width:100%;}
.beginner-app .beginner-artificer-granted-spell .creator-spell-name-button {white-space:normal;}

.beginner-app .creator-replica-modal-backdrop .beginner-guide-help {width:23px;min-width:23px;height:23px;min-height:23px;}
.beginner-app .creator-replica-modal-backdrop .beginner-guide-tooltip {position:fixed;max-height:calc(100vh - 24px);overflow-y:auto;}

/* Bard core: helpers remain outside card and reference-table clipping. */
.beginner-app :is(#pageClass,#modalFeatures) :is(.beginner-bard-overview,.beginner-bard-spell-reference,.beginner-bard-spell-rules,.beginner-bard-progression,[data-bard-core],[data-bard-choice]) {overflow:visible!important;}
.beginner-app #pageClass .beginner-bard-progression :is(table,tbody,tr,td) {overflow:visible!important;}
.beginner-app :is(#progressionWrap:has(.beginner-bard-overview),#spellModeWrap:has(.beginner-bard-spell-reference)) .beginner-guide-help {width:23px;min-width:23px;height:23px;min-height:23px;flex-shrink:0;}
.beginner-app .beginner-bard-spell-reference {margin:14px 0;}
.beginner-app .beginner-bard-reference-feature {display:inline-block;margin:3px 10px 3px 0;}
.beginner-app .beginner-bard-spell-rules > h3 {margin-top:0;}

/* Bard colleges: visible full rules and helper popups beyond feature/table edges. */
.beginner-app :is(#pageClass,#subclassModalFeatures) :is(.beginner-bard-subclass-feature,.beginner-bard-option-reference,.beginner-bard-full-rules,.beginner-bard-command-reference,.beginner-bard-lore-spells,.beginner-bard-option-table) {overflow:visible!important;}
.beginner-app :is(#pageClass,#subclassModalFeatures) .beginner-bard-option-table :is(tbody,tr,td) {overflow:visible!important;}
.beginner-app .beginner-bard-subclass-feature .integrated-feature-choice {overflow:visible!important;}
.beginner-app :is(.beginner-bard-subclass-feature,.beginner-bard-lore-spells,.beginner-bard-command-reference) .beginner-guide-help {width:23px;min-width:23px;height:23px;min-height:23px;flex-shrink:0;}
.beginner-app .beginner-bard-full-rules {margin-top:10px;line-height:1.6;overflow-wrap:anywhere;}
.beginner-app .beginner-bard-option-reference > h4 {margin:0 0 10px;}
.beginner-app .beginner-bard-granted-spell {display:inline-flex;align-items:center;gap:6px;}

/* Bard stat blocks and the final colleges: retain creature layout and visible help. */
.beginner-app :is(#pageClass,#subclassModalFeatures) .beginner-bard-subclass-feature :is(.beginner-bard-tales-table,.fighter-style-reference-table,.fighter-known-fighting-styles-table) :is(tbody,tr,td) {overflow:visible!important;}
.beginner-app :is(#pageClass,#subclassModalFeatures) :is(.beginner-bard-tales-table,.beginner-bard-guidance-reference,.beginner-bard-subclass-feature .known-fighting-styles-table,.beginner-bard-subclass-feature .feature-reference-table) {overflow:visible!important;}
.beginner-app .beginner-bard-guidance-reference .beginner-guide-help {width:23px;min-width:23px;height:23px;min-height:23px;}
.beginner-app .beginner-bard-full-rules .dancing-item-statblock-details {margin-top:12px;white-space:normal;}
.beginner-app .beginner-bard-full-rules .dancing-item-statblock-details > h4 {margin-top:0;}
.beginner-app :is(#pageClass,#subclassModalFeatures) .beginner-bard-subclass-feature :is(.fighter-style-reference-table,.fighter-known-fighting-styles-table) {overflow:visible!important;}

/* Core Cleric: full rules remain visible and help escapes cards/tables. */
.beginner-app :is(#pageClass,#modalFeatures) :is(.beginner-cleric-overview,.beginner-cleric-spell-reference,.beginner-cleric-spell-rules,.beginner-cleric-progression,[data-cleric-core],[data-cleric-skill]) {overflow:visible!important;}
.beginner-app #pageClass .beginner-cleric-progression :is(table,tbody,tr,td) {overflow:visible!important;}
.beginner-app :is(#progressionWrap:has(.beginner-cleric-overview),#spellModeWrap:has(.beginner-cleric-spell-reference)) .beginner-guide-help {width:23px;min-width:23px;height:23px;min-height:23px;flex-shrink:0;}
.beginner-app .beginner-cleric-reference-feature {display:inline-block;margin:3px 10px 3px 0;}
.beginner-app .beginner-cleric-spell-reference {margin:14px 0;}

/* First Cleric domains: full rules, reference rows, and selector helpers. */
.beginner-app :is(#pageClass,#subclassModalFeatures) :is(.beginner-cleric-subclass-feature,.beginner-cleric-option-reference,.beginner-cleric-full-rules,.cleric-eighth-feature-reference,.cleric-eighth-feature-option,.cleric-domain-spells-table-wrap,.cleric-domain-spells-table,.beginner-cleric-option-table,.beginner-cleric-feature-spell,.beginner-cleric-domain-spell-guide) {overflow:visible!important;}
.beginner-app :is(#pageClass,#subclassModalFeatures) :is(.cleric-domain-spells-table,.beginner-cleric-option-table) :is(tbody,tr,td) {overflow:visible!important;}
.beginner-app .beginner-cleric-subclass-feature .integrated-feature-choice {overflow:visible!important;}
.beginner-app :is(.beginner-cleric-subclass-feature,.cleric-eighth-feature-reference,.cleric-domain-spells-table,.beginner-cleric-feature-spell,.beginner-cleric-domain-spell-guide) .beginner-guide-help {width:23px;min-width:23px;height:23px;min-height:23px;}
.beginner-app .beginner-cleric-full-rules {margin-top:10px;line-height:1.6;overflow-wrap:anywhere;}
.beginner-app .beginner-cleric-granted-spell {display:inline-block;max-width:100%;margin:4px 12px 4px 0;}
.beginner-app .beginner-cleric-granted-spell .creator-spell-name-button {white-space:normal;}
.beginner-app .beginner-cleric-option-reference > h4 {margin:0 0 10px;}

.beginner-app :is(#pageClass,#subclassModalFeatures) :is(.beginner-cleric-domain-spell-feature,.beginner-cleric-eighth-feature,.beginner-cleric-eighth-feature .integrated-feature-choice) {overflow:visible!important;}
@media(min-width:761px){
  .beginner-app .beginner-cleric-option-table {width:100%;table-layout:fixed;}
  .beginner-app .beginner-cleric-option-table :is(th,td) {word-break:normal;overflow-wrap:break-word;}
  .beginner-app .beginner-cleric-option-table :is(th,td):first-child {width:30%;min-width:6.5rem;}
}

/* Druid core helpers stay outside feature/table boundaries, including phone rows. */
.beginner-app :is(#pageClass,#modalFeatures) :is(.beginner-druid-core-feature,.beginner-druid-spell-rules,.beginner-druid-shape-reference,.druid-wild-shape-table,.beginner-druid-progression,.beginner-druid-companion,.beginner-druid-hitdie) {overflow:visible!important;}
.beginner-app :is(#pageClass,#modalFeatures) .druid-wild-shape-table :is(tbody,tr,th,td) {overflow:visible!important;}
.beginner-app :is(.beginner-druid-core-feature,.beginner-druid-spell-reference,.beginner-druid-spell-rules,.beginner-druid-progression,.beginner-druid-companion,.beginner-druid-hitdie,[data-druid-skill],.beginner-druid-overview) .beginner-guide-help {width:23px;min-width:23px;height:23px;min-height:23px;flex-shrink:0;}
.beginner-app .beginner-druid-reference-feature {display:inline-block;margin:3px 10px 3px 0;}
.beginner-app .beginner-druid-spell-reference {margin:14px 0;}
.beginner-app .beginner-druid-shape-reference > h4 {margin:0 0 10px;}
.beginner-app :is(#pageClass,#modalFeatures) :is([data-druid-core],[data-druid-skill],.beginner-druid-overview,.beginner-druid-spell-reference) {overflow:visible!important;}
.beginner-app #pageClass .beginner-druid-progression :is(table,tbody,tr,td) {overflow:visible!important;}
.beginner-app :is(#progressionWrap:has(.beginner-druid-overview),#modalFeatures:has(.beginner-druid-modal-summary)) .beginner-guide-help {width:23px;min-width:23px;height:23px;min-height:23px;flex-shrink:0;}
/* Druid circle rules and option-row helpers retain full text and escape their cards. */
.beginner-app :is(#pageClass,#subclassModalFeatures) :is(.beginner-druid-subclass-feature,.beginner-druid-full-rules,.beginner-druid-option-reference,.beginner-druid-option-table,.druid-star-map-table,.druid-moon-circle-forms-table,[data-druid-circle-choice]){overflow:visible!important}
.beginner-app :is(#pageClass,#subclassModalFeatures) :is(.beginner-druid-option-table,.druid-star-map-table,.druid-moon-circle-forms-table) :is(tbody,tr,td,th){overflow:visible!important}
.beginner-app .beginner-druid-subclass-feature .integrated-feature-choice{overflow:visible!important}
.beginner-app :is(.beginner-druid-subclass-feature,.beginner-druid-option-reference,[data-druid-circle-choice],.beginner-druid-subclass-guide) .beginner-guide-help{width:23px;min-width:23px;height:23px;min-height:23px;flex-shrink:0}
.beginner-app .beginner-druid-full-rules{margin-top:10px;line-height:1.6;overflow-wrap:anywhere}
.beginner-app .beginner-druid-option-reference > h4{margin:0 0 10px}
@media(max-width:640px){.beginner-app .beginner-druid-option-table :is(th,td):first-child{min-width:6rem}.beginner-app .beginner-druid-subclass-feature .wildfire-spirit-statblock-details{min-width:0}}

/* Monk reuses the shared cards; feature rules remain visible and helpers use the body popup. */
.beginner-app .beginner-monk-full-rules{line-height:1.55;margin-top:6px}
.beginner-app .beginner-monk-ki-reference{margin-top:12px}.beginner-app .beginner-monk-ki-reference h4{margin:0 0 8px}
.beginner-app .beginner-monk-option-table{width:100%;table-layout:fixed}.beginner-app .beginner-monk-option-table th:first-child{width:30%}
.beginner-app [data-monk-subclass-feature] table th:first-child{width:48px}.beginner-app [data-monk-subclass-feature] table td{overflow-wrap:break-word}

/* Keep the spell-ki cap and weapon/discipline names readable in Monk references. */
.beginner-app [data-monk-subclass-feature] .monk-elemental-ki-cap-table th:first-child{width:35%}
.beginner-app [data-monk-subclass-feature] :is(.monk-elemental-discipline-reference-table,.monk-known-elemental-disciplines-table) th:first-child{width:auto}
.beginner-app [data-monk-subclass-feature] .monk-kensei-weapon-reference-table th:first-child{width:38%}
.beginner-app .known-kensei-weapons-table table th:first-child{width:100%}
.beginner-app .beginner-monk-full-rules td .beginner-guide-topic{margin-left:4px}
.beginner-app .monk-discipline-rules{line-height:1.55}

/* Ranger core: preserve readable references without widening the page. */
.beginner-ranger-table-scroll{max-width:100%;overflow-x:auto;margin:12px 0;}
.beginner-ranger-comparison-table{min-width:590px;table-layout:auto;}
.beginner-ranger-comparison-table th:first-child,.beginner-ranger-comparison-table td:first-child{width:54px;white-space:nowrap;}
.beginner-ranger-comparison-table td{vertical-align:top;}
.beginner-ranger-comparison{margin-top:18px;}
.beginner-ranger-full-rules{overflow:visible;}
.beginner-ranger-selected-help{margin:10px 0;}
[data-ranger-mode] .subclass-card-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
[data-ranger-mode] .subclass-card{min-width:0;font-family:inherit;}
[data-ranger-mode] .beginner-ranger-option-summary{line-height:1.5;}
@media(max-width:720px){[data-ranger-mode] .subclass-card-list{grid-template-columns:1fr;}}

/* Ranger conclave references use the shared cards, full rules, and creature blocks. */
.beginner-ranger-subclass-guide{margin-top:14px;padding:16px;border:1px solid var(--py-border,var(--line));border-radius:12px;background:var(--py-panel-tint,var(--panel));}
.beginner-ranger-subclass-guide .beginner-class-overview-grid{margin:12px 0;}
.beginner-ranger-subclass-full-rules{overflow:visible;}
.ranger-hunter-option-table{table-layout:auto;width:100%;margin:12px 0;}
.ranger-hunter-option-table td{vertical-align:top;}
.ranger-hunter-option-table td:first-child{width:28%;min-width:100px;}
.beginner-ranger-option-reference{margin:12px 0;}
.ranger-option-summary-table td{vertical-align:top;}
.ranger-option-summary-table td:first-child{width:32%;}
.beginner-ranger-granted-spells td:first-child{width:100px;white-space:nowrap;}
[data-ranger-subclass-feature] .dnd-statblock-title{display:flex;align-items:center;gap:7px;flex-wrap:wrap;}
[data-ranger-subclass-feature="Companion Feature"] .ability-method-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
@media(max-width:720px){[data-ranger-subclass-feature="Companion Feature"] .ability-method-grid{grid-template-columns:1fr;}.ranger-hunter-option-table td:first-child{width:35%;}}

/* Keep Pact Boon choice help adjacent without nesting buttons. */
.warlock-boon-choice-row{display:flex;align-items:center;gap:8px;min-width:0;}
.warlock-boon-choice-row>.subclass-card{flex:1;min-width:0;}

/* Feat comparison summaries keep the selected full rules independent. */
.beginner-feat-reference-table{width:100%;table-layout:fixed;}
.beginner-feat-reference-table th:first-child{width:32%;}
.beginner-feat-reference-table th,.beginner-feat-reference-table td{white-space:normal;overflow-wrap:break-word;vertical-align:top;}
.beginner-feat-reference .small-note{margin:8px 0;}

/* Ability helpers remain outside method buttons and HP radio labels. */
.beginner-ability-method-choice{display:flex;align-items:flex-start;gap:7px;min-width:0;}
.beginner-ability-method-choice>.ability-method-card{flex:1;min-width:0;height:100%;}
.beginner-ability-method-choice>.beginner-guide-topic{margin-top:14px;flex-shrink:0;}
.beginner-ability-action-help,.beginner-hp-mode-choice{display:inline-flex;align-items:center;gap:6px;max-width:100%;}
.beginner-manual-score-choice{display:flex;align-items:center;gap:6px;min-width:0;}
.beginner-manual-score-choice>input{min-width:0;flex:1;}
.ability-breakdown-row>span{min-width:0;}
.abilities-collapsible-summary>strong{min-width:0;}
#abilitiesWrap .badge-prof:has(.beginner-guide-topic){display:inline-flex;align-items:center;gap:3px;white-space:normal;}
#abilitiesWrap .ability-breakdown-row > strong{white-space:nowrap;flex-shrink:0;}

.beginner-ability-priorities{margin-bottom:18px;}
.beginner-priority-focus{max-width:430px;margin:14px 0;}
.beginner-priority-table{width:100%;table-layout:fixed;margin-top:12px;}
.beginner-priority-table th,.beginner-priority-table td{vertical-align:top;white-space:normal;overflow-wrap:break-word;}
.beginner-priority-table th:first-child,.beginner-priority-table td:first-child{width:15%;}
.beginner-priority-table thead th:nth-child(2),.beginner-priority-table tbody th{width:23%;}
.beginner-priority-table .feature-spell-help{vertical-align:middle;}

.beginner-app .beginner-warlock-subclass-guide>.beginner-class-panel,
.beginner-app .beginner-sorcerer-subclass-guide>.beginner-class-panel{margin-top:10px}
.beginner-app .beginner-warlock-subclass-guide>.beginner-class-panel h4,
.beginner-app .beginner-sorcerer-subclass-guide>.beginner-class-panel h4{margin:0 0 6px;font-size:15px}

.beginner-app .beginner-asi-guidance{padding:12px 14px;margin:12px 0;border-left:3px solid var(--py-primary,var(--accent));background:var(--py-panel-tint,var(--panel));border-radius:0 9px 9px 0;line-height:1.5}
.beginner-app .beginner-asi-guidance p{margin:8px 0 0}
.beginner-app #summaryPageWrap :is(.stat-label,.ability-score-name,.level-feature-title){overflow:visible}
