/* Bio hub only: the shared tool layout remains unchanged. */
.smt-bio-page { --bio-blue: #1677d2; --bio-purple: #7138e8; --bio-green: #08785d; }
.smt-bio-page h1, .smt-bio-page h2, .smt-bio-page h3,
.smt-bio-page .smt-hub-kicker, .smt-bio-page .smt-hub-actions { text-align: center; }
.smt-bio-page .smt-tool-hero { padding-top: 145px; padding-bottom: 64px; }
.smt-bio-page .smt-tool-hero-visual { border-radius: 8px; }
.smt-bio-page .smt-tool-hero-grid > div:first-child { text-align: center; }
.smt-bio-page .smt-tool-hero-visual h2 { font-size: 26px; line-height: 1.3; margin: 0 0 22px; }
.smt-bio-page #bio-tool { scroll-margin-top: 95px; }
.smt-bio-page .smt-hub-head { margin-bottom: 30px; }
.smt-bio-page .smt-hub-head p { margin-left: auto; margin-right: auto; }
.smt-bio-page .smt-hub-kicker { width: fit-content; margin-left: auto; margin-right: auto; }
.smt-bio-snapshot { display: grid; gap: 16px; }
.smt-bio-snapshot > div { padding: 18px; border-radius: 8px; border: 1px solid #e5def7; }
.smt-bio-snapshot > div:first-child { background: #eef7ff; border-color: #d5e7f7; }
.smt-bio-snapshot > div:last-child { background: #eaf9f4; border-color: #c3e8d8; }
.smt-bio-snapshot strong { color: #151523; display: block; text-align: center; margin-bottom: 10px; }
.smt-bio-snapshot p { margin: 0; font-size: 16px; line-height: 1.65; white-space: pre-line; }
.smt-bio-snapshot-label { color: var(--bio-green); text-align: center; font-size: 13px; font-weight: 700; margin-top: 14px; }
.smt-bio-workspace { padding: 24px; border: 1px solid #e5def7; border-radius: 8px; background: #fff; }
.smt-bio-layout { display: grid !important; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 22px; align-items: stretch; }
.smt-bio-panel { display: flex; flex-direction: column; min-width: 0; padding: 22px; border: 1px solid #d5e7f7; border-radius: 8px; background: #f2f9ff; }
.smt-bio-panel-output { border-color: #e0d3fa; background: #f7f3ff; }
.smt-bio-panel > h3 { font-size: 21px; margin: 0 0 22px; line-height: 1.4; }
.smt-bio-fields { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; margin-bottom: 18px; }
.smt-bio-field { min-width: 0; display: flex; flex-direction: column; gap: 8px; margin: 0; }
.smt-bio-field > span { font-size: 14px; font-weight: 700; color: #29213e; }
.smt-bio-page .smt-bio-field input, .smt-bio-page .smt-bio-field select, .smt-bio-page .smt-bio-field textarea { box-sizing: border-box; width: 100%; min-width: 0; background: #fff; color: #151523; border: 1px solid #cbd2e2; border-radius: 6px; padding: 11px 12px; font: inherit; font-size: 15px; line-height: 1.5; }
.smt-bio-page .smt-bio-field select { min-height: 48px; padding-right: 30px; }
.smt-bio-page .smt-bio-field textarea { resize: vertical; min-height: 180px; }
.smt-bio-page .smt-bio-field input:focus-visible, .smt-bio-page .smt-bio-field select:focus-visible, .smt-bio-page .smt-bio-field textarea:focus-visible, .smt-bio-page button:focus-visible { outline: 3px solid #b9a2f5; outline-offset: 2px; }
.smt-bio-modes { display: flex; gap: 6px; justify-content: center; margin: 2px 0 18px; }
.smt-bio-page button { font-family: inherit; letter-spacing: 0; cursor: pointer; }
.smt-bio-modes button { flex: 1; padding: 10px 12px; background: #fff; color: #5325bc; border: 1px solid #d6c8f4; border-radius: 6px; font-size: 14px; font-weight: 700; }
.smt-bio-modes button[aria-pressed="true"] { background: #7138e8; border-color: #7138e8; color: #fff; }
.smt-bio-builder { display: grid; gap: 14px; }
.smt-bio-builder .smt-bio-field textarea { min-height: 70px; }
.smt-bio-page [hidden] { display: none !important; }
.smt-bio-input-area { display: flex; flex-direction: column; flex: 1; }
.smt-bio-input-area > .smt-bio-field { flex: 1; }
.smt-bio-input-area > .smt-bio-field textarea { flex: 1; }
.smt-bio-inline-note { font-size: 13px; color: #62677a; line-height: 1.6; margin: 12px 0 0; }
.smt-bio-edit-actions, .smt-bio-export-actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.smt-bio-edit-actions { margin-top: 22px; }
.smt-bio-edit-actions button { color: #5325bc; background: #fff; border: 1px solid #d6c8f4; border-radius: 6px; padding: 10px 16px; font-size: 14px; font-weight: 700; }
.smt-bio-preview { background: #fff; border: 1px solid #e5def7; border-radius: 8px; padding: 22px; min-height: 210px; display: flex; flex-direction: column; }
.smt-bio-avatar { width: 50px; height: 50px; border-radius: 50%; background: #eaf9f4; color: #08785d; border: 1px solid #b7dfce; display: flex; align-items: center; justify-content: center; font-size: 20px; font-weight: 700; margin: 0 auto 12px; }
.smt-bio-preview-name { font-weight: 700; font-size: 17px; color: #151523; text-align: center; overflow-wrap: anywhere; }
.smt-bio-preview-text { white-space: pre-wrap; overflow-wrap: anywhere; color: #29213e; font-size: 16px; line-height: 1.65; margin: 18px 0 0; }
.smt-bio-preview-text:empty::before { content: "Your formatted bio will appear here."; color: #777084; }
.smt-bio-preview-note { text-align: center; font-size: 12px; color: #62677a; margin: 12px 0 18px; }
.smt-bio-stats { display: grid !important; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; margin: 0 0 18px; }
.smt-bio-stat { border: 1px solid #e0d3fa; border-radius: 6px; background: #fff; text-align: center; padding: 12px 5px; }
.smt-bio-stat strong { display: block; font-size: 23px; color: #5325bc; line-height: 1.3; }
.smt-bio-stat span { font-size: 12px; color: #62677a; }
.smt-bio-budget { font-size: 14px; color: #08785d; background: #eaf9f4; border: 1px solid #c3e8d8; border-radius: 6px; padding: 10px 12px; margin: 0 0 16px; }
.smt-bio-budget[data-over="true"] { background: #fff1ed; color: #923c25; border-color: #f3d1c5; }
.smt-bio-output-field { flex: 1; }
.smt-bio-page .smt-bio-output-field textarea { background: #fff; min-height: 125px; flex: 1; }
.smt-bio-export-actions { margin-top: 24px; }
.smt-bio-export-actions button { padding: 10px 14px; border-radius: 6px; font-size: 14px; font-weight: 700; color: #fff; background: #7138e8; border: 1px solid #7138e8; }
.smt-bio-export-actions button + button { color: #5325bc; background: #fff; border-color: #d6c8f4; }
.smt-bio-export-actions button:disabled { opacity: .5; cursor: not-allowed; }
.smt-bio-status { min-height: 24px; margin: 18px 0 0; text-align: center; font-size: 14px; color: #08785d; }
.smt-bio-workspace > .smt-bio-inline-note { text-align: center; margin-top: 18px; }
.smt-bio-method-grid { display: grid !important; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 22px; }
.smt-bio-method-grid > article { border: 1px solid #e5def7; border-radius: 8px; padding: 24px; display: flex; flex-direction: column; min-width: 0; background: #fff; }
.smt-bio-method-grid h3 { font-size: 20px; margin: 0 0 16px; }
.smt-bio-method-grid p { font-size: 16px; line-height: 1.65; }
.smt-bio-method-grid code { display: block; font-size: 14px; font-family: inherit; font-weight: 400; text-align: center; background: #f5f0ff; color: #5325bc; padding: 12px; border-radius: 6px; margin-top: auto; }
.smt-bio-page .smt-tool-guide-grid { display: grid !important; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 22px; }
.smt-bio-page .smt-tool-guide-card { display: flex; flex-direction: column; min-width: 0; border-radius: 8px; }
.smt-bio-page .smt-tool-guide-card h3 { font-size: 21px; margin-top: 0; }
.smt-bio-page .smt-tool-guide-card > a { display: block; text-align: center; margin-top: auto; padding-top: 18px; }
.smt-bio-page .smt-tool-guide-card > p { margin-bottom: 0; }
.smt-bio-page .smt-tool-guide-grid > p:empty, .smt-bio-page .smt-bio-layout > p:empty, .smt-bio-page .smt-tool-guide-links > p:empty { display: none !important; }
.smt-bio-page .smt-tool-cta { background: #f5f0ff; color: #151523; border: 1px solid #e5def7; display: block; text-align: center; border-radius: 8px; margin-top: 42px; }
.smt-bio-page .smt-tool-cta h2, .smt-bio-page .smt-tool-cta h3 { color: #151523; margin: 18px auto; }
.smt-bio-page .smt-tool-cta p:not(.smt-hub-kicker) { max-width: 850px; margin: 0 auto; color: #62677a; }
.smt-bio-page .smt-tool-cta .smt-hub-actions { margin: 24px 0 0; }
.smt-bio-page .smt-hub-article-body > h2 { margin: 54px 0 22px; }
.smt-bio-page .smt-hub-article-body > p { margin-bottom: 22px; }
.smt-bio-page .smt-hub-faq + h2 { margin-top: 66px; }
.smt-bio-page .smt-tool-guide-nav { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; padding: 24px; margin: 0 0 38px; border-radius: 8px; counter-reset: bio-guide; }
.smt-bio-page .smt-tool-guide-nav > strong { grid-column: 1 / -1; text-align: center; font-size: 24px; margin: 0 0 10px; }
.smt-bio-page .smt-tool-guide-nav > a { counter-increment: bio-guide; display: flex; align-items: center; gap: 12px; font-size: 16px; line-height: 1.45; font-weight: 600; padding: 12px; background: #fff; border: 1px solid #e5def7; border-radius: 6px; min-width: 0; }
.smt-bio-page .smt-tool-guide-nav > a:last-of-type { grid-column: auto; justify-self: stretch; width: auto; }
.smt-bio-page .smt-tool-guide-nav > a:nth-of-type(1) { background: #fcfaff; }
.smt-bio-page .smt-tool-guide-nav > a:nth-of-type(2) { background: #f3f9ff; border-color: #d5e7f7; }
.smt-bio-page .smt-tool-guide-nav > a:nth-of-type(3) { background: #f2fbf7; border-color: #c3e8d8; }
.smt-bio-page .smt-tool-guide-nav > a:nth-of-type(4) { background: #fff7f3; border-color: #f3d1c5; }
.smt-bio-page .smt-tool-guide-nav > a:nth-of-type(5) { background: #fff5f9; border-color: #f1d2e0; }
.smt-bio-page .smt-tool-guide-nav > a:nth-of-type(6) { background: #f2fbfa; border-color: #c5e8e3; }
.smt-bio-page .smt-tool-guide-nav > a:nth-of-type(7) { background: #f7f8ff; border-color: #d5daf6; }
.smt-bio-page .smt-tool-guide-nav > a:nth-of-type(8) { background: #fffbf0; border-color: #f0e0b4; }
.smt-bio-page .smt-tool-guide-nav > a::before { content: counter(bio-guide); flex: 0 0 30px; height: 30px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: #eee5ff; color: #5325bc; }
.smt-bio-page .smt-tool-guide-nav > a:nth-of-type(4n+2)::before { background: #e1f1ff; color: #1265a9; }
.smt-bio-page .smt-tool-guide-nav > a:nth-of-type(4n+3)::before { background: #ddf5e9; color: #08785d; }
.smt-bio-page .smt-tool-guide-nav > a:nth-of-type(4n+4)::before { background: #ffe8dd; color: #994021; }
.smt-bio-page .smt-tool-guide-nav > a:nth-of-type(5)::before { background: #fde4ef; color: #9d2c60; }
.smt-bio-page .smt-tool-guide-nav > a:nth-of-type(6)::before { background: #dcf4f1; color: #146f68; }
.smt-bio-page .smt-tool-guide-nav > a:nth-of-type(7)::before { background: #e9edff; color: #424baf; }
.smt-bio-page .smt-tool-guide-nav > a:nth-of-type(8)::before { background: #fff2cf; color: #83600d; }
.smt-bio-page .smt-tool-guide-links { display: grid !important; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; margin-top: 24px; }
.smt-bio-page .smt-tool-guide-links > a { display: flex; align-items: center; justify-content: center; min-height: 80px; height: 100%; text-align: center; border-radius: 6px; padding: 16px; margin: 0; box-sizing: border-box; font-size: 16px; }
.smt-bio-guide .smt-tool-hero { padding-bottom: 36px; }
.smt-bio-guide .smt-hub-article-hero { max-width: 1050px; text-align: center; }
.smt-bio-guide .smt-hub-article-body { max-width: 1080px; }
.smt-bio-guide .smt-hub-section { padding-top: 30px; }
.smt-bio-page .smt-bio-guides-section { padding-bottom: 28px; }
.smt-bio-page .smt-bio-next-section { padding-top: 30px; }
@media (max-width: 1000px) {
  .smt-bio-page .smt-tool-guide-grid, .smt-bio-page .smt-tool-guide-links { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .smt-bio-page .smt-tool-hero-grid { grid-template-columns: 1fr; gap: 32px; }
  .smt-bio-page .smt-tool-hero-visual { max-width: 650px; width: 100%; margin: 0 auto; box-sizing: border-box; }
  .smt-bio-layout { gap: 16px; }
  .smt-bio-panel { padding: 16px; }
}
@media (max-width: 760px) {
  .smt-bio-layout, .smt-bio-method-grid { grid-template-columns: 1fr !important; }
  .smt-bio-page .smt-tool-hero { padding-top: 112px; }
  .smt-bio-workspace { padding: 14px; }
  .smt-bio-page .smt-tool-guide-nav { padding: 16px; }
  .smt-bio-page .smt-tool-guide-nav > strong { font-size: 22px; }
}
@media (max-width: 560px) {
  .smt-bio-page .smt-tool-guide-grid, .smt-bio-page .smt-tool-guide-links, .smt-bio-page .smt-tool-guide-nav { grid-template-columns: 1fr; }
  .smt-bio-fields { gap: 10px; }
  .smt-bio-page .smt-bio-field input, .smt-bio-page .smt-bio-field select { font-size: 14px; padding: 10px 8px; }
  .smt-bio-panel { padding: 14px; }
  .smt-bio-export-actions { gap: 8px; }
  .smt-bio-export-actions button { padding: 10px 8px; font-size: 12px; }
  .smt-bio-fields > .smt-bio-field > span { min-height: 42px; }
  .smt-bio-preview { padding: 16px; }
}