.upload-box {
  border: 1px dashed #bdb4a8;
  border-radius: 16px;
  padding: 22px;
  background: #faf7f0;
  cursor: pointer;
}
.upload-box input { border: 0; background: transparent; padding: 0; }
.upload-box span { font-weight: 400; color: var(--muted); }
.consent-row { flex-direction: row; align-items: flex-start; padding: 18px; border-radius: 14px; background: var(--sage-soft); cursor: pointer; }
.consent-row input { width: 18px; height: 18px; margin-top: 2px; accent-color: var(--ink); }
.consent-row span, .consent-row strong, .consent-row small { display: block; }
.consent-row strong { font-size: 14px; }
.consent-row small { margin-top: 5px; font-size: 12px; line-height: 1.55; }
.save-progress { padding: 13px 16px; border-radius: 12px; background: var(--coral-soft); font-size: 12px; }
.card-actions { display: flex; gap: 7px; flex-wrap: wrap; margin-top: 18px; }
.card-actions button { padding: 9px 12px; font-size: 11px; }
.danger-action { border: 0; background: transparent; color: #a84833; padding-inline: 7px !important; font: 600 11px "DM Sans"; cursor: pointer; }
.danger-action:hover { text-decoration: underline; }
.danger-action:disabled { opacity: .45; cursor: wait; }
.story-card .status-pill { display: inline-block; align-self: flex-start; margin-top: 12px; padding: 5px 9px; border-radius: 99px; background: var(--sage-soft); font-size: 9px; font-weight: 700; letter-spacing: .08em; }
.story-card-media {
  position: relative;
  aspect-ratio: 3 / 2;
  margin-bottom: 20px;
  overflow: hidden;
  border-radius: 16px;
  background: linear-gradient(145deg, #f8d8ce, #dce8df);
  isolation: isolate;
}
.story-card-media img { position: relative; z-index: 2; width: 100%; height: 100%; display: block; object-fit: cover; object-position: 50% 40%; opacity: 0; transition: opacity .22s ease, transform .3s ease; }
.story-card-media.is-portrait img { object-position: 50% 52%; }
.story-card-media.is-ready img { opacity: 1; }
.story-card:hover .story-card-media.is-ready img { transform: scale(1.015); }
.story-card-media-state { position: absolute; inset: 0; z-index: 0; display: grid; place-content: center; justify-items: center; gap: 5px; color: var(--ink); }
.story-card-media-state span { font: 500 32px var(--font-display, "Newsreader", serif); }
.story-card-media-state small { font-size: 10px; color: var(--muted); }
.story-card-media.is-loading::after { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(105deg, transparent 35%, rgba(255,255,255,.62) 50%, transparent 65%); transform: translateX(-100%); animation: card-photo-loading 1.25s ease-in-out infinite; }
.story-card-media.is-empty { background: linear-gradient(145deg, #f2ece2, #e5eee8); }
@keyframes card-photo-loading { to { transform: translateX(100%); } }
.story-card.with-photo h3 { margin-top: 18px; }
.mini-form, .onboarding-form { display: grid; gap: 10px; }
.mini-form { margin-top: 24px; max-width: 420px; grid-template-columns: 1fr 1fr; }
.mini-form button { grid-column: 1 / -1; justify-self: start; }
.onboarding-form { max-width: 420px; margin: 28px auto 0; }
.master-list { margin-top: 30px; }
.master-card { background: var(--paper); border: 1px solid var(--line); border-radius: 18px; padding: 24px; margin-top: 14px; }
.master-card header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.master-card h3 { font: 500 28px "Newsreader"; margin: 0; }
.master-card small { color: var(--muted); }
.master-actions { display: flex; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.master-actions .danger-action { white-space: nowrap; }
.master-entries { margin: 20px 0; display: grid; gap: 8px; }
.master-entry { display: flex; gap: 12px; align-items: center; padding: 11px 13px; background: var(--ivory); border-radius: 10px; font-size: 12px; }
.master-entry b { width: 22px; color: var(--coral); }

/* Review is a complete editorial workspace, not a one-line approval queue. */
.review-work-list { max-width: 1040px; margin-top: 40px; }
.review-work-card { overflow: hidden; border: 1px solid var(--line); border-radius: 24px; background: var(--paper); box-shadow: var(--shadow); }
.review-work-card > header { padding: 25px 28px; display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; border-bottom: 1px solid var(--line); }
.review-work-card > header h2 { margin-top: 7px; font-size: 32px; line-height: 1.05; }
.review-work-card > header p { margin: 8px 0 0; color: var(--muted); font-size: 12px; }
.review-work-card .status-pill { flex: 0 0 auto; padding: 7px 10px; border-radius: 99px; background: var(--sage-soft); font-size: 9px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.review-eyebrow { color: var(--coral); font-size: 9px; font-weight: 700; letter-spacing: .18em; }
.review-source { margin: 22px 28px 0; padding: 18px; border-radius: 16px; background: var(--ivory); }
.review-source strong { font-size: 12px; }
.review-source p { margin: 8px 0 0; color: #40544f; font-size: 13px; line-height: 1.65; white-space: pre-line; }
.review-source > div { margin-top: 13px; display: flex; flex-wrap: wrap; gap: 7px; }
.review-source > div span { padding: 6px 9px; border-radius: 99px; background: var(--paper); color: var(--muted); font-size: 9px; }
.review-change-notice { margin: 22px 28px 0; padding: 17px 19px; border: 1px solid #e6b8a8; border-radius: 16px; background: var(--coral-soft); }
.review-change-notice strong, .review-change-notice p { display: block; }
.review-change-notice strong { font-size: 13px; }
.review-change-notice p { margin: 5px 0 0; color: #6f493f; font-size: 12px; line-height: 1.55; }
.review-draft-form { padding: 28px; }
.review-saved-details { padding: 23px; border: 1px solid #c9d8cf; border-radius: 18px; background: var(--sage-soft); }
.review-saved-heading { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; margin-bottom: 17px; }
.review-saved-heading h3 { margin: 5px 0 0; font: 500 27px/1.1 "Newsreader"; }
.review-saved-heading p { max-width: 280px; margin: 0; color: var(--muted); font-size: 12px; line-height: 1.45; text-align: right; }
.review-saved-note { padding: 17px 18px; border-radius: 13px; background: var(--paper); }
.review-saved-note strong, .review-saved-item dt { color: var(--muted); font-size: 11px; font-weight: 700; letter-spacing: .04em; }
.review-saved-note p { margin: 7px 0 0; color: var(--ink); font-size: 15px; line-height: 1.6; white-space: pre-line; overflow-wrap: anywhere; }
.review-saved-facts, .review-saved-growth { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; margin: 12px 0 0; }
.review-saved-item { min-width: 0; margin: 0; padding: 13px 15px; border-radius: 12px; background: var(--paper); }
.review-saved-item dt, .review-saved-item dd { margin: 0; }
.review-saved-item dd { margin-top: 5px; font-size: 13px; line-height: 1.5; white-space: pre-line; overflow-wrap: anywhere; }
.review-saved-growth { grid-template-columns: repeat(2,minmax(0,1fr)); }
.review-saved-page-copy { margin-top: 10px; border-top: 1px solid rgba(24,49,45,.12); padding-top: 10px; }
.review-copy-note { margin: 12px 0 0; color: #40544f; font-size: 12px; line-height: 1.5; }
.review-copy-editor, .review-source-editor { margin-top: 16px; overflow: hidden; border: 1px solid var(--line); border-radius: 18px; background: #fcfaf5; }
.review-copy-editor summary, .review-source-editor summary { list-style: none; padding: 19px 20px; display: flex; align-items: center; justify-content: space-between; gap: 20px; cursor: pointer; }
.review-copy-editor summary::-webkit-details-marker, .review-source-editor summary::-webkit-details-marker { display: none; }
.review-copy-editor summary strong, .review-copy-editor summary small, .review-source-editor summary strong, .review-source-editor summary small { display: block; }
.review-copy-editor summary strong, .review-source-editor summary strong { font-size: 13px; }
.review-copy-editor summary small, .review-source-editor summary small { margin-top: 4px; color: var(--muted); font-size: 11px; font-weight: 400; }
.review-copy-editor[open] summary, .review-source-editor[open] summary { border-bottom: 1px solid var(--line); }
.review-copy-editor-content { padding: 20px; }
.review-form-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 25px; margin-bottom: 22px; }
.review-form-heading h3 { margin: 7px 0 0; font: 500 28px "Newsreader"; }
.review-form-heading > p { max-width: 390px; margin: 0; color: var(--muted); font-size: 11px; line-height: 1.55; text-align: right; }
.review-ai-badge { color: var(--sage); font-size: 9px; font-weight: 700; letter-spacing: .17em; }
.review-language-choice { margin-bottom: 22px; padding: 16px 18px; border: 1px solid #c9d8cf; border-radius: 16px; background: var(--sage-soft); }
.review-language-choice label { display: grid; grid-template-columns: minmax(0,1fr) minmax(230px,320px); align-items: center; gap: 4px 22px; margin: 0; }
.review-language-choice strong, .review-language-choice small { display: block; }
.review-language-choice strong { font-size: 13px; }
.review-language-choice small { color: var(--muted); font-size: 11px; font-weight: 400; line-height: 1.45; }
.review-language-choice select { grid-column: 2; grid-row: 1 / span 2; background: var(--paper); font-size: 13px; }
.review-field-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.review-field-grid label, .review-rewrite-panel label { font-size: 13px; }
.review-field-grid input, .review-field-grid textarea, .review-field-grid select, .review-rewrite-panel textarea { padding: 14px 15px; background: #fcfaf5; font-size: 14px; line-height: 1.55; }
.review-field-grid textarea { min-height: 92px; }
.review-field-grid textarea[name="portfolioCopy"] { min-height: 190px; }
.review-source-fields { padding: 20px; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 17px; }
.review-source-fields label { font-size: 12px; }
.review-source-fields textarea { min-height: 86px; }
.review-evidence-editor { margin-top: 24px; padding: 20px; display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 16px; border: 1px solid var(--line); border-radius: 18px; background: var(--sage-soft); }
.review-evidence-editor > div:first-child strong, .review-evidence-editor > div:first-child small { display: block; }
.review-evidence-editor > div:first-child strong { font-size: 13px; }
.review-evidence-editor > div:first-child small { margin-top: 5px; color: var(--muted); font-size: 11px; font-weight: 400; }
.review-evidence-list { grid-column: 1/-1; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.review-evidence-item { min-width: 0; padding: 9px; display: grid; grid-template-columns: 62px minmax(0,1fr) auto; align-items: center; gap: 11px; border: 1px solid rgba(24,49,45,.12); border-radius: 13px; background: var(--paper); }
.review-evidence-thumb { width: 62px; height: 56px; overflow: hidden; display: grid; place-items: center; border-radius: 9px; background: var(--ivory); }
.review-evidence-thumb img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 35%; }
.review-evidence-kind { color: var(--muted); font-size: 11px; font-weight: 700; }
.review-evidence-item > div:nth-child(2) { min-width: 0; }
.review-evidence-item strong, .review-evidence-item small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.review-evidence-item strong { font-size: 11px; }
.review-evidence-item small { margin-top: 4px; color: var(--muted); font-size: 9px; }
.review-evidence-delete { border: 0; background: transparent; color: #a84833; font: 600 10px "DM Sans"; cursor: pointer; }
.review-evidence-delete:hover { text-decoration: underline; }
.review-evidence-empty, .review-evidence-loading { grid-column: 1/-1; padding: 18px; border: 1px dashed rgba(24,49,45,.22); border-radius: 12px; color: var(--muted); font-size: 11px; text-align: center; }
.review-evidence-progress { grid-column: 1/-1; color: var(--muted); font-size: 11px; }
.published-lock-note { align-self: center; color: var(--muted); font-size: 9px; }
.review-rewrite-panel { margin-top: 24px; padding: 20px; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 18px; align-items: end; border: 1px solid #dec9a7; border-radius: 18px; background: #faf2e4; }
.review-rewrite-panel textarea { min-height: 84px; background: var(--paper); }
.review-rewrite-panel button { margin-bottom: 1px; }
.review-footer-actions { margin-top: 24px; padding-top: 20px; display: flex; justify-content: space-between; align-items: center; gap: 18px; border-top: 1px solid var(--line); }
.review-footer-actions > div { display: flex; gap: 9px; }
.review-footer-actions button:disabled, .review-rewrite-panel button:disabled { opacity: .48; cursor: wait; }
.review-reject { color: #9a4334; }
.review-processing, .review-failed { min-height: 150px; padding: 28px; display: flex; align-items: center; gap: 22px; }
.review-processing > div:last-child { flex: 1; }
.review-processing h2, .review-failed h2 { margin-top: 8px; font-size: 30px; }
.review-processing p { margin: 8px 0 0; color: var(--muted); font-size: 12px; }
.review-processing-mark { width: 48px; height: 48px; flex: 0 0 48px; border: 5px solid var(--sage-soft); border-top-color: var(--sage); border-radius: 50%; animation: review-spin .9s linear infinite; }
.review-failed { display: block; }
.review-failed > header { padding: 0 0 20px; }
.review-failed .review-rewrite-panel { margin-top: 0; }
@keyframes review-spin { to { transform: rotate(360deg); } }

/* A real A4 design preview. QA controls live outside the artwork so they
   cannot accidentally become part of a saved or printed portfolio page. */
.capture-drafts { margin: 24px 0; padding: 18px 20px; border: 1px solid #cdded6; border-radius: 18px; background: var(--sage-soft); }
.capture-drafts strong { display: block; font-size: 15px; }
.capture-drafts p { margin: 5px 0 14px; color: var(--muted); font-size: 13px; line-height: 1.45; }
.capture-draft-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.capture-draft-item { min-width: 0; display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 8px; padding: 7px; border: 1px solid rgba(24,49,45,.12); border-radius: 16px; background: rgba(255,253,248,.62); }
.capture-draft-list .secondary { min-width: 0; max-width: 100%; padding: 10px 13px; border: 0; border-radius: 11px; white-space: normal; text-align: left; }
.capture-draft-list .secondary:hover { background: rgba(220,232,223,.72); }
.capture-draft-list .secondary small { display: block; margin-top: 3px; color: var(--muted); font-size: 10.5px; font-weight: 500; }
.capture-draft-delete { padding: 9px 11px; border: 0; border-radius: 10px; background: transparent; color: #8d4337; cursor: pointer; font: 700 11px var(--font-body); white-space: nowrap; }
.capture-draft-delete:hover { background: #f6e4de; }
.capture-draft-delete:disabled { opacity: .45; cursor: wait; }
@media (max-width: 760px) {
  .capture-draft-list { grid-template-columns: 1fr; }
}
@media (max-width: 430px) {
  .capture-draft-item { grid-template-columns: 1fr; }
  .capture-draft-delete { justify-self: start; }
}
.capture-editing { display: grid; gap: 5px; padding: 16px 20px; border: 1px solid #a9c8b9; border-radius: 15px; background: #e5f0e9; scroll-margin-top: 24px; }
.capture-editing.hidden { display: none; }
.capture-editing span { color: #315548; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.capture-editing strong { font-size: 18px; overflow-wrap: anywhere; }
.capture-editing small { color: var(--muted); font-size: 13px; line-height: 1.45; }
.design-toolbar { margin-bottom: 24px; display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.design-toolbar > div { display: flex; align-items: center; gap: 16px; }
.design-toolbar .preview-toolbar-actions { justify-content: flex-end; flex-wrap: wrap; gap: 9px; }
.preview-master-added { color: var(--ink); font-size: 13px; font-weight: 700; }
.preview-status { padding: 7px 11px; border-radius: 99px; background: var(--sage-soft); color: var(--ink); font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.design-stage { padding: 38px; border-radius: 28px; background: #e8e1d6; box-shadow: inset 0 1px rgba(255,255,255,.6); }
.design-sheet { --design-accent: #527765; width: min(100%, 794px); aspect-ratio: 210 / 297; min-height: 920px; margin: 0 auto; padding: 42px; overflow: hidden; display: grid; grid-template-rows: auto auto 300px minmax(0,1fr) auto; gap: 22px; background: #fffdf8; color: var(--ink); box-shadow: 0 24px 60px rgba(24,49,45,.16); }
.design-sheet[data-priority="A"] { --design-accent: #527765; }
.design-sheet[data-priority="B"] { --design-accent: var(--sage); }
.design-sheet[data-priority="C"] { --design-accent: var(--ochre); }
.design-sheet.template-T04, .design-sheet.template-T10 { background: linear-gradient(150deg,#fffdf8 0 72%,#e8f0eb 72%); }
.design-sheet.template-T05, .design-sheet.template-T06 { background: linear-gradient(150deg,#fffdf8 0 72%,#dfe9e2 72%); }
.design-sheet.template-T07, .design-sheet.template-T12 { background: linear-gradient(150deg,#fffdf8 0 72%,#efe4ca 72%); }
.design-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.design-footer { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 16px; }
.design-header small, .design-date, .design-footer { color: var(--muted); font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; }
.design-kicker, .design-label { color: var(--design-accent); font-size: 11.5px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.design-title h1 { max-width: 690px; font-size: clamp(34px,3.5vw,42px); line-height: 1.04; overflow-wrap: anywhere; }
.design-title p { max-width: 680px; margin: 13px 0 0; color: var(--muted); font-size: 17px; line-height: 1.48; }
.design-photo-grid { min-height: 0; height: 300px; display: grid; gap: 12px; overflow: hidden; }
.design-photo-grid.one { grid-template-columns: 1fr; }
.design-photo-grid.two { grid-template-columns: repeat(2,minmax(0,1fr)); }
.design-photo-grid.three { grid-template-columns: 1.35fr .8fr; grid-template-rows: repeat(2,minmax(0,1fr)); }
.design-photo-grid.three .photo-1 { grid-row: 1 / 3; }
.design-photo-grid.four { grid-template-columns: repeat(2,minmax(0,1fr)); grid-template-rows: repeat(2,minmax(0,1fr)); }
.design-photo { min-width: 0; min-height: 0; margin: 0; overflow: hidden; border-radius: 22px; background: var(--sage-soft); }
.design-photo img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: 50% 38%; }
.design-photo.is-portrait img, .design-photo.is-small img { object-fit: contain; background: linear-gradient(145deg,#dce8df,#efe4ca); }
.design-photo-grid.one .design-photo img { object-fit: contain; background: linear-gradient(145deg,#dce8df,#efe4ca); }
.design-photo-grid.two.portrait-series { grid-template-columns: repeat(2,minmax(0,1fr)); grid-template-rows: 1fr; }
.design-photo-grid.three.portrait-series { grid-template-columns: repeat(3,minmax(0,1fr)); grid-template-rows: 1fr; }
.design-photo-grid.four.portrait-series { grid-template-columns: repeat(4,minmax(0,1fr)); grid-template-rows: 1fr; }
.design-photo-grid.portrait-series .design-photo { grid-row: auto; }
.design-photo-grid.portrait-series .design-photo img { object-fit: contain; }
.design-photo-placeholder { display: grid; place-items: center; align-content: center; gap: 8px; border-radius: 22px; background: linear-gradient(145deg,var(--coral),var(--ochre) 55%,var(--sage)); color: white; }
.design-photo-placeholder span { font: 600 74px "Newsreader"; }
.design-photo-placeholder small { letter-spacing: .18em; text-transform: uppercase; }
.design-story { display: grid; grid-template-columns: minmax(0,1.22fr) minmax(190px,.78fr); gap: 30px; padding-top: 12px; border-top: 1px solid var(--line); }
.design-story.no-side { grid-template-columns: minmax(0,1fr); }
.design-story p { margin: 11px 0 0; color: #40544f; font-size: 15.5px; line-height: 1.55; white-space: pre-line; }
.design-skills, .design-tags { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 12px; }
.design-skills span { padding: 7px 10px; border-radius: 99px; background: var(--sage-soft); font-size: 11.5px; }
.design-tags span { color: var(--muted); font-size: 9.5px; }
.design-evidence { display: grid; gap: 6px; margin-top: 20px; }
.design-evidence a { color: var(--ink); font-size: 9px; overflow-wrap: anywhere; }
.design-footer { align-items: center; padding-top: 15px; border-top: 1px solid var(--line); }
.design-footer-verification { color: var(--muted); letter-spacing: 0; text-align: center; text-transform: none; }
.preview-actions { margin: 22px auto 0; width: min(100%, 794px); padding: 20px 22px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border: 1px solid var(--line); border-radius: 18px; background: var(--paper); }
.preview-actions strong, .preview-actions small { display: block; }
.preview-actions strong { font: 500 21px "Newsreader"; }
.preview-actions small { margin-top: 4px; color: var(--muted); font-size: 10px; }
.preview-actions > div:last-child { display: flex; gap: 8px; }
.master-book-stage { --coral: #527765; --coral-soft: #e5eee8; display: grid; gap: 42px; }
/* Activity pages share all geometry and colours with All activities. */
.master-draft-panel { margin: 0 0 24px; padding: 24px; border: 1px solid var(--line); border-radius: 22px; background: var(--paper); box-shadow: var(--shadow); }
.master-draft-panel > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; padding-bottom: 20px; border-bottom: 1px solid var(--line); }
.master-draft-panel > header span { color: var(--coral); font-size: 10px; font-weight: 700; letter-spacing: .16em; }
.master-draft-panel > header h2 { margin-top: 7px; font-size: 28px; line-height: 1.1; }
.master-draft-panel > header p { max-width: 690px; margin: 8px 0 0; color: var(--muted); font-size: 13px; line-height: 1.55; }
.primary:disabled { opacity: .45; cursor: not-allowed; }
.master-draft-heading-actions { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; }
.master-draft-heading-actions strong { padding: 8px 11px; border-radius: 99px; background: var(--sage-soft); font-size: 11px; white-space: nowrap; }
.master-draft-heading-actions .secondary { padding: 9px 13px; }
.master-draft-list { display: grid; gap: 10px; padding-top: 18px; }
.master-draft-row { display: grid; grid-template-columns: 34px minmax(220px,1fr) auto auto; align-items: center; gap: 14px; padding: 13px 14px; border-radius: 14px; background: var(--ivory); }
.master-draft-row > b { color: var(--coral); font-size: 12px; }
.master-draft-row > div:nth-child(2) { min-width: 0; }
.master-draft-row > div:nth-child(2) strong, .master-draft-row > div:nth-child(2) small { display: block; }
.master-draft-row > div:nth-child(2) strong { overflow: hidden; font: 500 17px/1.2 var(--font-display, "Newsreader", serif); text-overflow: ellipsis; white-space: nowrap; }
.master-draft-row > div:nth-child(2) small { margin-top: 3px; color: var(--muted); font-size: 10px; }
.master-draft-order, .master-draft-actions { display: flex; align-items: center; gap: 7px; }
.master-draft-order button { width: 34px; height: 34px; border: 1px solid var(--line); border-radius: 50%; background: var(--paper); color: var(--ink); cursor: pointer; font-size: 16px; }
.master-draft-order button:disabled { opacity: .35; cursor: not-allowed; }
.master-draft-actions .secondary { padding: 9px 13px; }
.text-button.danger { color: #a54332; }
.master-draft-empty { padding: 18px; border: 1px dashed var(--line); border-radius: 14px; color: var(--muted); font-size: 13px; }
.master-loading { min-height: 280px; display: grid; place-items: center; color: var(--muted); font-size: 13px; }
.master-cover-sheet {
  position: relative;
  isolation: isolate;
  width: min(100%, 794px);
  aspect-ratio: 210 / 297;
  min-height: 920px;
  margin: 0 auto;
  padding: 54px;
  overflow: hidden;
  display: grid;
  grid-template-rows: auto minmax(255px,1fr) auto auto auto;
  gap: 22px;
  color: var(--ink);
  background:
    linear-gradient(145deg, transparent 0 70%, rgba(120,154,131,.27) 70% 100%),
    #fffaf2;
  box-shadow: 0 24px 60px rgba(24,49,45,.16);
}
.master-cover-sheet::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: -65px;
  right: -75px;
  width: 310px;
  height: 310px;
  border-radius: 48% 0 54% 58%;
  background: linear-gradient(145deg, var(--coral), var(--ochre));
  transform: rotate(9deg);
}
.master-cover-sheet > * { position: relative; z-index: 1; }
.master-cover-sheet header,
.master-cover-sheet footer { display: flex; align-items: center; justify-content: space-between; gap: 20px; font-size: 10px; font-weight: 700; letter-spacing: .17em; text-transform: uppercase; }
.master-cover-sheet header span:last-child { color: white; }
.master-cover-visual { min-height: 255px; display: flex; align-items: center; }
.master-cover-visual.has-photo { justify-content: flex-start; }
.master-cover-visual.no-photo { justify-content: flex-end; }
.master-cover-photo {
  width: 74%;
  height: 280px;
  display: block;
  border: 8px solid rgba(255,253,248,.9);
  border-radius: 34px 34px 34px 12px;
  background: var(--sage-soft);
  box-shadow: 18px 20px 0 rgba(214,166,66,.2);
  object-fit: cover;
  object-position: 50% 32%;
}
.master-cover-monogram {
  width: 142px;
  height: 142px;
  border-radius: 48% 48% 48% 16%;
  display: grid;
  place-items: center;
  color: white;
  background: rgba(24,49,45,.92);
  font: 500 76px/1 var(--font-display, "Newsreader", serif);
  transform: rotate(3deg);
}
.master-cover-title { max-width: 590px; }
.master-cover-title > span { display: block; margin-bottom: 18px; color: var(--coral); font-size: 10px; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; }
.master-cover-title h1 { color: var(--ink); font-size: clamp(52px,6vw,72px); line-height: .96; overflow-wrap: anywhere; }
.master-cover-title p { max-width: 460px; margin: 24px 0 0; color: #49615b; font: 500 28px/1.18 var(--font-display, "Newsreader", serif); }
.master-cover-details { display: grid; grid-template-columns: .8fr 1.5fr 1fr; gap: 10px; }
.master-cover-details > div { min-width: 0; padding: 15px 16px; border: 1px solid rgba(24,49,45,.1); border-radius: 14px; background: rgba(255,253,248,.84); }
.master-cover-details span,
.master-cover-details strong { display: block; }
.master-cover-details span { margin-bottom: 5px; color: var(--muted); font-size: 9px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.master-cover-details strong { font-size: 13px; line-height: 1.35; overflow-wrap: anywhere; }
.master-cover-sheet footer { padding-top: 20px; border-top: 1px solid rgba(24,49,45,.18); color: #49615b; }

/* Add Activity — a calm, mobile-first capture flow. */
.capture-intro { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 430px); gap: 70px; align-items: end; }
.capture-intro h1 { font-size: clamp(54px, 4.5vw, 68px); line-height: .92; }
.capture-intro .lede { max-width: 720px; margin-top: 22px; font-size: 18px; line-height: 1.65; }
.capture-steps { list-style: none; margin: 0; padding: 12px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; border: 1px solid var(--line); border-radius: 20px; background: rgba(255,253,248,.72); }
.capture-steps li { min-width: 0; display: flex; align-items: center; gap: 8px; padding: 9px 7px; border-radius: 13px; color: var(--muted); }
.capture-steps li > div { min-width: 0; }
.capture-steps li.active { background: var(--sage-soft); color: var(--ink); }
.capture-steps li > span { width: 28px; height: 28px; flex: 0 0 28px; border: 1px solid var(--line); border-radius: 50%; display: grid; place-items: center; font-size: 11px; font-weight: 700; background: var(--paper); }
.capture-steps strong, .capture-steps small { display: block; overflow-wrap: normal; }
.capture-steps strong { font-size: 11px; line-height: 1.2; }
.capture-steps small { margin-top: 3px; font-size: 9px; line-height: 1.25; }

.activity-editor { max-width: 1020px; margin-top: 48px; padding: 0; display: block; overflow: hidden; }
.activity-editor label { font-size: 14px; }
.activity-editor input, .activity-editor textarea, .activity-editor select { padding: 15px; font-size: 15px; line-height: 1.45; }
.form-section { margin: 0; padding: 34px; border: 0; border-bottom: 1px solid var(--line); }
.form-section-head { margin-bottom: 25px; display: flex; justify-content: space-between; align-items: flex-start; gap: 28px; }
.form-section-head > div { display: flex; align-items: center; gap: 12px; }
.form-section-head h2 { font-size: 31px; letter-spacing: -.025em; }
.form-section-head p { max-width: 420px; margin: 2px 0 0; color: var(--muted); font-size: 14px; line-height: 1.55; text-align: right; }
.section-number { width: 40px; height: 40px; flex: 0 0 40px; border-radius: 11px; display: grid; place-items: center; background: #dcebe2; color: #214d3e; font-size: 15px; font-weight: 700; letter-spacing: .01em; }
.field-grid { display: grid; gap: 16px; }
.three-fields { grid-template-columns: 1.05fr 1fr 1fr; }
.required-mark, .optional-mark { margin-left: 5px; font-size: 10px; font-weight: 600; }
.required-mark { color: var(--coral); }
.optional-mark { color: #89938f; }
.story-field { display: block; }
.story-field-label { display: flex; justify-content: space-between; gap: 16px; margin-bottom: 8px; color: var(--ink); font-weight: 700; }
.story-field-label small { color: var(--muted); font-size: 12px; font-weight: 500; text-align: right; }
.story-field textarea { min-height: 180px; line-height: 1.65; background: #fcfaf5; }
.note-assist { margin-top: 13px; display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; }
.note-prompts { display: flex; flex-wrap: wrap; gap: 7px; }
.note-prompts span { padding: 8px 11px; border-radius: 99px; background: var(--ivory); color: var(--muted); font-size: 11px; }
.note-assist > small { flex: 0 0 auto; color: var(--muted); font-size: 11px; }
.layout-character-guide { display: block; margin-top: 7px; color: #667873; font-size: 11px; font-weight: 500; line-height: 1.35; text-align: right; }
.layout-character-guide.near-limit { color: #8a6228; font-weight: 700; }

select { width: 100%; border: 1px solid var(--line); background: #faf8f2; border-radius: 12px; padding: 14px; color: var(--ink); font: 14px "DM Sans"; outline: none; }
select:focus { border-color: var(--sage); box-shadow: 0 0 0 3px var(--sage-soft); }
.two-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.essential-fields { margin-bottom: 16px; }
.supporting-fields { margin-top: 20px; }
.compact-story { margin-top: 20px; }
.compact-story textarea { min-height: 96px; }
.detail-builder { overflow: hidden; border: 1px solid var(--line); border-radius: 18px; background: #fcfaf5; }
.detail-builder summary { list-style: none; padding: 20px 22px; display: flex; justify-content: space-between; align-items: center; gap: 20px; cursor: pointer; }
.detail-builder summary::-webkit-details-marker { display: none; }
.detail-builder summary strong, .detail-builder summary small { display: block; }
.detail-builder summary strong { font-size: 14px; }
.detail-builder summary small { margin-top: 4px; color: var(--muted); font-size: 12px; }
.detail-builder[open] summary { border-bottom: 1px solid var(--line); }
.detail-builder-content { padding: 22px; }
.evidence-panel { margin-top: 26px; padding-top: 24px; border-top: 1px solid var(--line); }
.evidence-panel h3 { margin: 0; font: 500 22px/1.2 var(--font-display); color: var(--ink); }
.evidence-panel > p { margin: 6px 0 17px; color: var(--muted); font-size: 13px; line-height: 1.5; }
.verifier-fields { grid-template-columns: 1fr 1fr; align-content: start; }
.placement-choice-group { min-width: 0; margin: 0; padding: 0; border: 0; }
.placement-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.placement-options label { position: relative; min-height: 126px; padding: 19px; border: 1px solid var(--line); border-radius: 17px; background: #fcfaf5; cursor: pointer; }
.placement-options.is-inactive { opacity: .48; }
.placement-options label:has(input:checked) { border-color: #315e50; background: var(--sage-soft); box-shadow: 0 0 0 2px rgba(49,94,80,.22); }
.placement-options input { position: absolute; top: 18px; right: 18px; width: 17px; height: 17px; padding: 0; accent-color: var(--ink); }
.placement-options span { padding-right: 24px; }
.placement-options strong, .placement-options small { display: block; }
.placement-options strong { font-size: 14px; }
.placement-options small { margin-top: 8px; color: var(--muted); font-size: 12px; font-weight: 400; line-height: 1.5; }
.activity-editor .form-section-head h2 { font-size: 29px; line-height: 1.12; }
.activity-editor .form-section-head p { font-size: 14px; line-height: 1.55; }
.activity-editor .placement-options strong, .activity-editor .detail-builder summary strong { font-size: 16px; }
.activity-editor .placement-options small, .activity-editor .detail-builder summary small { font-size: 13px; }
.activity-editor .required-mark, .activity-editor .optional-mark, .activity-editor .note-assist > small { font-size: 12px; }
.new-category-field { display: block; margin: -2px 0 18px; max-width: 560px; }
.new-category-field.hidden { display: none; }
.new-category-field small { display: block; margin-top: 7px; color: var(--muted); font-size: 12px; font-weight: 400; }
.archive-choice { display: flex; align-items: flex-start; gap: 12px; margin-top: 15px; padding: 17px 18px; border: 1px solid var(--line); border-radius: 15px; background: var(--ivory); cursor: pointer; }
.archive-choice input { width: 18px; height: 18px; flex: 0 0 18px; margin-top: 2px; accent-color: var(--ink); }
.archive-choice strong, .archive-choice small { display: block; }
.archive-choice strong { font-size: 14px; }
.archive-choice small { margin-top: 5px; color: var(--muted); font-size: 12px; font-weight: 400; line-height: 1.5; }
.growth-ai-panel { display: flex; justify-content: space-between; align-items: center; gap: 24px; margin-bottom: 16px; padding: 19px 21px; border: 1px solid #c6d8ce; border-radius: 17px; background: #e9f2ed; }
.activity-story-ai { margin-top: 28px; }
.growth-ai-panel strong { font-size: 16px; }
.growth-ai-panel p { max-width: 610px; margin: 5px 0 0; color: #425650; font-size: 13px; line-height: 1.5; }
.growth-ai-panel button { flex: 0 0 auto; }
.growth-language-choice { margin: 0 0 16px; }
.growth-ai-result { margin-bottom: 17px; padding: 20px; border: 1px solid #adc8b8; border-radius: 17px; background: #f4faf6; }
.growth-ai-result.hidden { display: none; }
.growth-ai-result h3 { margin: 0 0 8px; font-size: 22px; }
.growth-ai-result > p { margin: 0 0 15px; color: var(--muted); font-size: 13px; }
.growth-ai-result dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; margin: 0; }
.growth-ai-result dl div { padding: 12px; border-radius: 11px; background: white; }
.growth-ai-result dt { margin-bottom: 7px; display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; font-weight: 700; font-size: 12px; }
.growth-ai-result dt .text-button { flex: 0 0 auto; padding: 0; color: #315e50; font-size: 11px; }
.growth-ai-result dd { margin: 0; color: #40544f; font-size: 13px; line-height: 1.5; white-space: pre-wrap; overflow-wrap: anywhere; }
.growth-ai-result-actions { display: flex; gap: 9px; flex-wrap: wrap; margin-top: 16px; }
/* Always-visible narrative groups; shared labels connect suggestions to their fields. */
.activity-narrative .form-section-head { flex-direction: column; gap: 12px; }
.activity-narrative .form-section-head p { max-width: none; text-align: left; }
.writing-assistant { margin-bottom: 28px; padding: 24px; border: 1px solid #bfd2c6; border-radius: 18px; background: #edf4ef; }
.writing-assistant-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; }
.writing-assistant h3 { margin: 0 0 8px; font: 700 18px/1.4 var(--font-body); }
.writing-assistant p { margin: 0; color: #476056; font-size: 14px; line-height: 1.65; }
.writing-assistant-top > div { min-width: 0; }
.writing-assistant-top > button { flex-shrink: 0; white-space: normal; max-width: 240px; line-height: 1.5; }
.writing-assistant .writing-assistant-scope { margin: 18px 0; padding-top: 16px; border-top: 1px solid #cbdcd0; font-size: 13px; }
.writing-assistant .growth-language-choice { margin: 0; padding: 0; border: 0; }
.writing-assistant .language-choice legend { margin-bottom: 10px; padding: 0; }
.writing-assistant .language-options { gap: 10px; }
.writing-assistant .language-options label { padding: 12px 14px; }
.writing-assistant .writing-assistant-note { margin-top: 16px; font-size: 12px; }
.narrative-group { margin: 0; padding: 30px 0; border: 0; border-bottom: 1px solid var(--line); }
.narrative-group:last-child { padding-bottom: 0; border-bottom: 0; }
.narrative-group-heading { margin-bottom: 22px; }
.narrative-group-heading h3 { margin: 0 0 6px; font: 700 20px/1.35 var(--font-body); }
.narrative-group-heading p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.6; }
.activity-narrative .narrative-group label { display: flex; gap: 8px; min-width: 0; font-size: 15px; }
.narrative-field-label { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 12px; }
.ai-field-tag, .manual-field-tag { display: inline-block; width: fit-content; padding: 3px 8px; border-radius: 6px; color: #315d49; background: #e3eee6; font: 600 11px/1.5 var(--font-body); white-space: nowrap; }
.manual-field-tag { background: #f1ede4; color: #696454; }
.activity-narrative .field-hint { font-size: 13px; line-height: 1.5; }
.activity-narrative textarea { margin: 0; background: #fffefa; line-height: 1.65; }
.activity-narrative .field-grid { gap: 24px 20px; }
.activity-narrative .note-assist { margin: 10px 0 24px; }
.activity-narrative .note-assist > small:first-child { flex: 1 1 auto; }
.activity-narrative .evidence-verifier { margin-top: 24px; }
.activity-narrative .growth-ai-result dt { font-size: 14px; }
.activity-narrative .growth-ai-result dd { font-size: 14px; }
.activity-narrative .growth-ai-result dt .text-button { font-size: 13px; min-height: 32px; }
@media (max-width: 1100px) {
  .writing-assistant-top { flex-direction: column; gap: 16px; }
  .writing-assistant-top > button { max-width: none; }
}
@media (max-width: 640px) {
  .writing-assistant { padding: 18px; }
  .writing-assistant-top > button { width: 100%; }
  .writing-assistant .language-options,
  .activity-narrative .two-fields,
  .activity-narrative .three-fields,
  .activity-narrative .growth-ai-result dl { grid-template-columns: 1fr; }
  .activity-narrative .narrative-field-label { align-items: flex-start; }
  .narrative-group { padding: 24px 0; }
}
.placement-pill { align-self: flex-start; margin-top: 8px; padding: 5px 9px; border-radius: 99px; background: var(--coral-soft); color: #88402f; font-size: 9px; font-weight: 700; }
.placement-control { margin-top: 18px; padding-top: 15px; border-top: 1px solid var(--line); }
.placement-control > span { color: var(--muted); font-size: 9px; letter-spacing: .08em; text-transform: uppercase; }
.placement-control select { padding: 10px 12px; font-size: 11px; }

.profile-editor-card { margin: 35px 0 0; overflow: hidden; border: 1px solid var(--line); border-radius: 22px; background: var(--paper); box-shadow: var(--shadow); }
.profile-editor-card > summary { list-style: none; padding: 22px 26px; display: flex; justify-content: space-between; align-items: center; gap: 25px; cursor: pointer; }
.profile-editor-card > summary::-webkit-details-marker { display: none; }
.profile-editor-card > summary strong, .profile-editor-card > summary small { display: block; }
.profile-editor-card > summary strong { font: 500 25px "Newsreader"; }
.profile-editor-card > summary small { margin-top: 4px; color: var(--muted); font-size: 10px; }
.profile-editor-card[open] > summary { border-bottom: 1px solid var(--line); }
.profile-form { padding: 26px; display: grid; gap: 19px; }
.profile-actions { display: flex; justify-content: flex-end; padding-top: 4px; }
.profile-ai-assist { display: grid; gap: 18px; padding: 20px; border: 1px solid #c8d8cd; border-radius: 17px; background: var(--sage-soft); }
.profile-ai-copy { display: flex; align-items: flex-start; gap: 13px; }
.profile-ai-copy strong, .profile-ai-copy small { display: block; }
.profile-ai-copy strong { font-size: 16px; }
.profile-ai-copy small { margin-top: 4px; color: var(--muted); font-size: 12.5px; line-height: 1.5; }
.profile-ai-mark { flex: 0 0 34px; width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: var(--ink); color: white; font-size: 16px; }
.profile-ai-controls { display: grid; grid-template-columns: minmax(220px, 1fr) minmax(220px, 1fr) auto; gap: 13px; align-items: end; }
.profile-ai-controls label { margin: 0; }
.profile-ai-empty { min-height: 49px; display: flex; align-items: center; gap: 10px; padding: 9px 12px; border: 1px solid rgba(21,50,44,.14); border-radius: 12px; background: rgba(255,255,255,.56); cursor: pointer; }
.profile-ai-empty input { flex: 0 0 auto; width: 17px; height: 17px; padding: 0; accent-color: var(--ink); }
.profile-ai-empty strong, .profile-ai-empty small { display: block; }
.profile-ai-empty strong { font-size: 12.5px; }
.profile-ai-empty small { margin-top: 1px; color: var(--muted); font-size: 10.5px; font-weight: 400; }
.profile-ai-controls button { min-height: 49px; white-space: nowrap; }
.profile-ai-status { margin: -2px 0 0; padding-top: 13px; border-top: 1px solid rgba(21,50,44,.14); color: var(--ink); font-size: 12.5px; line-height: 1.5; }
.profile-ai-status.error { color: #963d2f; }
.profile-form label[data-ai-suggested="true"] { position: relative; }
.profile-form label[data-ai-suggested="true"]::after { content: "✦  GEMINI DRAFT"; position: absolute; top: -3px; right: 0; padding: 4px 8px; border-radius: 99px; background: #3f6f55; color: white; font-size: 9px; font-weight: 700; letter-spacing: .08em; line-height: 1.2; }
.profile-form [data-ai-filled="true"] { border: 2px solid #3f6f55; background: #edf7ef; box-shadow: 0 0 0 4px rgba(63,111,85,.16); }
.profile-form [data-ai-filled="true"]:focus { border-color: #294f3c; box-shadow: 0 0 0 4px rgba(63,111,85,.24); }

.design-facts { margin-top: 20px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.design-facts div { padding: 10px 12px; border-radius: 11px; background: var(--ivory); }
.design-facts span, .design-facts strong { display: block; }
.design-facts span { color: var(--muted); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.design-facts strong { margin-top: 4px; font-size: 12.5px; }
.design-child-voice { margin: 20px 0 0; padding: 15px 18px; border-left: 3px solid var(--design-accent); background: var(--ivory); }
.design-child-voice p { margin-top: 8px; font: 500 18.5px/1.42 "Newsreader"; color: var(--ink); }
.design-growth-details { margin-top: 18px; display: grid; gap: 10px; }
.design-journey > .design-label { display: block; margin-top: 20px; }
.design-growth-details > div { padding-top: 9px; border-top: 1px solid var(--line); }
.design-growth-details span { color: var(--design-accent); font-size: 9.5px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }
.design-growth-details p { margin-top: 4px; font-size: 12.5px; line-height: 1.48; }
.design-growth-details .design-result { padding: 11px 12px 12px; border-top: 2px solid var(--design-accent); border-radius: 0 0 10px 10px; background: var(--ivory); }
.design-growth-details .design-result span { font-size: 11.5px; letter-spacing: .16em; }
.design-growth-details .design-result p { color: var(--ink); font-size: 13.5px; font-weight: 600; line-height: 1.42; }
.design-verification { margin-top: 18px; color: var(--muted); font-size: 10.5px; line-height: 1.45; }
.design-sheet.design-dense { padding: 38px; gap: 16px; grid-template-rows: auto auto 255px minmax(0,1fr) auto; }
.design-sheet.design-dense .design-title h1 { font-size: 36px; }
.design-sheet.design-dense .design-title p { margin-top: 9px; font-size: 16px; }
.design-sheet.design-dense .design-photo-grid { height: 255px; }
.design-sheet.design-dense .design-facts { margin-top: 12px; }
.design-sheet.design-dense .design-story { gap: 27px; }
.design-sheet.design-dense .design-story p { font-size: 15.5px; line-height: 1.52; }
.design-sheet.design-dense .design-growth-details { margin-top: 11px; gap: 6px; }
.design-sheet.design-extra-dense { padding: 34px; gap: 12px; grid-template-rows: auto auto 220px minmax(0,1fr) auto; }
.design-sheet.design-extra-dense .design-title h1 { font-size: 33px; }
.design-sheet.design-extra-dense .design-title p { font-size: 15px; }
.design-sheet.design-extra-dense .design-photo-grid { height: 220px; }
.design-sheet.design-extra-dense .design-story p { font-size: 15px; line-height: 1.48; }
.design-sheet.design-ultra-dense { padding: 28px; gap: 8px; grid-template-rows: auto auto 180px minmax(0,1fr) auto; }
.design-sheet.design-ultra-dense .design-title h1 { font-size: 31px; }
.design-sheet.design-ultra-dense .design-title p { margin-top: 7px; font-size: 14px; line-height: 1.38; }
.design-sheet.design-ultra-dense .design-facts { margin-top: 9px; gap: 6px; }
.design-sheet.design-ultra-dense .design-facts div { padding: 7px 9px; }
.design-sheet.design-ultra-dense .design-photo-grid { height: 180px; }
.design-sheet.design-ultra-dense .design-story { gap: 22px; padding-top: 8px; }
.design-sheet.design-ultra-dense .design-story p { margin-top: 7px; font-size: 14.5px; line-height: 1.44; }
.design-sheet.design-ultra-dense .design-child-voice { margin-top: 11px; padding: 10px 12px; }
.design-sheet.design-ultra-dense .design-child-voice p { font-size: 16px; }
.design-sheet.design-ultra-dense .design-journey > .design-label { margin-top: 12px; }
.design-sheet.design-ultra-dense .design-growth-details { margin-top: 7px; gap: 4px; }
.design-sheet.design-ultra-dense .design-growth-details > div { padding-top: 6px; }
.design-sheet.design-ultra-dense .design-skills { margin-top: 8px; gap: 5px; }
.design-sheet.design-ultra-dense .design-skills span { padding: 5px 7px; font-size: 10.5px; }

.master-section-sheet { width: min(100%, 794px); aspect-ratio: 210 / 297; min-height: 920px; margin: 0 auto; padding: 46px; overflow: hidden; display: grid; grid-template-rows: auto auto 1fr auto; gap: 34px; background: #fffdf8; color: var(--ink); box-shadow: 0 24px 60px rgba(24,49,45,.16); }
.master-section-sheet:nth-child(3n) { background: linear-gradient(155deg,#fffdf8 0 78%,#e6eee8 78%); }
.master-section-sheet:nth-child(3n + 1) { background: linear-gradient(155deg,#fffdf8 0 78%,#e9eee6 78%); }
.master-section-sheet > header, .master-section-sheet > footer { display: flex; justify-content: space-between; align-items: flex-start; gap: 22px; }
.master-section-sheet > header div { display: grid; gap: 6px; }
.master-section-sheet > header span { color: var(--coral); font-size: 9px; font-weight: 700; letter-spacing: .2em; }
.master-section-sheet > header small, .master-section-sheet > footer { color: var(--muted); font-size: 8px; letter-spacing: .1em; text-transform: uppercase; }
.master-section-sheet > header b { font-size: 10px; }
.master-section-title h1 { max-width: 680px; font-size: clamp(48px,6vw,76px); line-height: .91; overflow-wrap: anywhere; }
.master-section-title p { max-width: 600px; margin: 17px 0 0; color: var(--muted); font-size: 14px; line-height: 1.6; }
.master-section-content { min-height: 0; overflow: hidden; }
.master-section-content > h2 { margin: 26px 0 13px; font-size: 28px; }
.master-section-sheet > footer { align-items: center; padding-top: 14px; border-top: 1px solid var(--line); }
.master-category-sheet { background: linear-gradient(155deg, #fffdf8 0 67%, #e8f0eb 67% 100%) !important; }
.master-category-sheet .master-section-title { padding-top: 66px; }
.master-category-sheet .master-section-title h1 { max-width: 640px; font-size: clamp(43px, 5vw, 61px); line-height: 1.03; }
.master-category-sheet .master-section-content { display: flex; align-items: flex-start; }
.category-divider-summary { width: min(100%, 520px); min-height: 310px; padding: 38px 42px; display: flex; align-items: center; gap: 28px; border-left: 5px solid var(--coral); border-radius: 0 24px 24px 0; background: #e5eee8; }
.category-divider-count { color: #315b4c; font: 500 clamp(110px, 12vw, 160px)/.9 var(--font-display); letter-spacing: -.06em; }
.category-divider-summary strong { display: block; color: var(--ink); font-size: 21px; line-height: 1.2; }
.category-divider-summary p { max-width: 220px; margin: 12px 0 0; color: var(--muted); font-size: 15px; line-height: 1.5; }
.master-category-continuation .master-section-title h1 { font-size: 52px; }
.master-empty { padding: 25px; border: 1px dashed #bdb4a8; border-radius: 18px; color: var(--muted); }
.master-empty strong { color: var(--ink); font: 500 23px "Newsreader"; }
.master-empty p { margin: 8px 0 0; font-size: 11px; line-height: 1.55; }
.master-entry-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.master-entry-grid article { min-height: 150px; padding: 18px; display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 18px; background: rgba(255,253,248,.88); }
.master-entry-grid article > span { color: var(--coral); font-size: 8px; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; }
.master-entry-grid h3 { margin: 14px 0 8px; font: 500 21px/1.05 "Newsreader"; }
.master-entry-grid p { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.5; }
.master-entry-grid footer { margin-top: auto; padding-top: 12px; color: var(--muted); font-size: 8px; }
.master-profile-layout { display: grid; grid-template-columns: 145px 1fr; gap: 30px; align-items: start; }
.master-profile-mark { width: 145px; aspect-ratio: 1; display: grid; place-items: center; border-radius: 50% 50% 50% 16px; background: linear-gradient(145deg,var(--coral),var(--ochre)); color: white; font: 600 72px "Newsreader"; }
.master-profile-layout dl { margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.master-profile-layout dl div { padding: 14px; border-radius: 14px; background: var(--ivory); }
.master-profile-layout dt { color: var(--muted); font-size: 8px; letter-spacing: .1em; text-transform: uppercase; }
.master-profile-layout dd { margin: 6px 0 0; font-size: 11px; line-height: 1.4; }
.master-long-copy { margin: 22px 0 0; color: #40544f; font-size: 12px; line-height: 1.75; }
.master-section-content em { color: #8b918e; font-weight: 400; }
.master-metric-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.master-metric-row div { padding: 17px; border-radius: 16px; background: var(--sage-soft); }
.master-metric-row strong, .master-metric-row span { display: block; }
.master-metric-row strong { font: 600 42px "Newsreader"; }
.master-metric-row span { color: var(--muted); font-size: 9px; }
.master-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.master-chips span { padding: 8px 11px; border-radius: 99px; background: var(--sage-soft); font-size: 9px; }
.master-glance-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.master-glance-columns { margin-top: 24px; }
.master-glance-columns h2 { margin: 0 0 12px; font-size: 20px; line-height: 1.2; }
.master-observed { margin-bottom: 18px; }
.master-observed h2 { margin: 0 0 10px; font-size: 26px; }
.master-journey-current { padding: 22px; border-radius: 20px; background: var(--coral-soft); }
.master-journey-current > span { color: #315b4c; font-size: 8px; font-weight: 700; letter-spacing: .16em; }
.master-journey-current h2 { margin-top: 12px; font-size: 34px; }
.master-journey-current p { margin-bottom: 0; color: var(--muted); font-size: 11px; }
.master-timeline { margin: 20px 0; padding-left: 22px; color: var(--muted); font-size: 11px; line-height: 1.6; }
.growth-map { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.growth-map article { padding: 17px; border-radius: 16px; background: var(--sage-soft); }
.growth-map h3 { margin: 0; font: 500 20px "Newsreader"; }
.growth-map p { margin: 7px 0 0; color: var(--muted); font-size: 9px; line-height: 1.5; }
.master-table { display: grid; border: 1px solid var(--line); border-radius: 17px; overflow: hidden; }
.master-table > div { display: grid; grid-template-columns: .65fr 1.8fr 1.2fr; gap: 14px; padding: 13px 15px; border-bottom: 1px solid var(--line); font-size: 9px; }
.master-table > div:last-child { border-bottom: 0; }
.master-table .table-head { background: var(--ink); color: white; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.master-table strong, .master-table small { display: block; }
.master-table small { margin-top: 4px; color: var(--muted); line-height: 1.4; }
.reflection-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.reflection-grid article { padding: 18px; border-radius: 17px; background: var(--ivory); }
.reflection-grid span { color: var(--coral); font-size: 9px; font-weight: 700; }
.reflection-grid p { margin: 9px 0 0; font: 500 17px/1.45 "Newsreader"; }
.goal-list { display: grid; gap: 9px; padding-left: 28px; }
.goal-list li { padding: 11px 15px; border-radius: 13px; background: var(--sage-soft); font-size: 11px; }
.evidence-index { display: grid; gap: 10px; }
.evidence-index article { padding: 13px; display: grid; grid-template-columns: 34px 1fr; gap: 12px; border-bottom: 1px solid var(--line); }
.evidence-index article > b { color: var(--coral); font: 500 19px "Newsreader"; }
.evidence-index h3 { margin: 0; font: 500 17px "Newsreader"; }
.evidence-index p, .evidence-index small { margin: 4px 0 0; color: var(--muted); font-size: 8px; line-height: 1.5; overflow-wrap: anywhere; }
.featured-placeholder { background: linear-gradient(145deg,#fffdf8 0 68%,#e5eee8 68%); }

.upload-section { background: #fcfaf5; }
.upload-dropzone { min-height: 150px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 18px; padding: 26px; border: 1.5px dashed #bcb2a5; border-radius: 18px; background: var(--paper); cursor: pointer; transition: border-color .18s, background .18s, transform .18s; }
.upload-dropzone:hover, .upload-dropzone:focus-visible, .upload-dropzone.dragging { outline: none; border-color: var(--sage); background: #f4f8f4; }
.upload-dropzone.dragging { transform: scale(1.005); }
.upload-symbol { width: 50px; height: 50px; display: grid; place-items: center; border-radius: 16px; background: var(--sage-soft); font-size: 25px; line-height: 1; }
.upload-dropzone strong, .upload-dropzone span { display: block; }
.upload-dropzone strong { font-size: 13px; }
.upload-dropzone span { margin-top: 6px; color: var(--muted); font-size: 11px; line-height: 1.45; }
.evidence-toolbar { margin: 20px 2px 10px; display: flex; justify-content: space-between; align-items: center; }
.evidence-toolbar.hidden { display: none; }
.evidence-toolbar strong { font-size: 12px; }
.evidence-toolbar button { color: #a84833; font-size: 11px; }
.evidence-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.evidence-file { min-width: 0; display: grid; grid-template-columns: 52px minmax(0,1fr) auto; gap: 12px; align-items: center; padding: 10px; border: 1px solid var(--line); border-radius: 14px; background: var(--paper); }
.evidence-thumb { width: 52px; height: 52px; border-radius: 10px; overflow: hidden; display: grid; place-items: center; background: var(--sage-soft); color: var(--ink); font-size: 20px; }
.evidence-thumb img { width: 100%; height: 100%; object-fit: cover; }
.evidence-meta { min-width: 0; }
.evidence-meta strong, .evidence-meta small, .evidence-meta span { display: block; }
.evidence-meta strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; }
.evidence-meta small { margin-top: 4px; color: var(--muted); font-size: 9px; }
.evidence-meta span { margin-top: 5px; color: var(--sage); font-size: 9px; font-weight: 700; }
.evidence-remove { width: 30px; height: 30px; border: 0; border-radius: 50%; background: var(--ivory); color: var(--muted); cursor: pointer; font-size: 16px; }
.evidence-remove:hover { background: var(--coral-soft); color: #a84833; }

.consent-section { background: #fffdf9; }
.consent-stack { display: grid; gap: 12px; }
.consent-row { margin: 0; border: 1px solid transparent; }
.consent-row:has(input:checked) { border-color: #a9c5b1; }
.consent-row.ai-consent { background: #f3eee5; }
.consent-row.ai-consent:has(input:checked) { border-color: #d9aa7c; background: #fcf0e5; }
.language-choice { margin: 0; padding: 19px; border: 1px solid var(--line); border-radius: 16px; background: #fcfaf5; }
.language-choice legend { width: 100%; padding: 0 0 14px; }
.language-choice legend strong, .language-choice legend small { display: block; }
.language-choice legend strong { font-size: 14px; }
.language-choice legend small { max-width: 720px; margin-top: 5px; color: var(--muted); font-size: 12px; font-weight: 400; line-height: 1.5; }
.language-options { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
.language-options label { min-width: 0; margin: 0; padding: 14px; display: flex; flex-direction: row; align-items: flex-start; gap: 10px; border: 1px solid var(--line); border-radius: 13px; background: var(--paper); cursor: pointer; }
.language-options label:has(input:checked) { border-color: var(--sage); box-shadow: 0 0 0 2px rgba(110,151,128,.12); }
.language-options input { width: 17px; height: 17px; flex: 0 0 auto; margin: 2px 0 0; accent-color: var(--ink); }
.language-options span, .language-options strong, .language-options small { display: block; }
.language-options strong { font-size: 13px; }
.language-options small { margin-top: 4px; color: var(--muted); font-size: 10px; font-weight: 400; line-height: 1.4; }
.capture-actions { margin: 0; padding: 25px 34px; display: flex; justify-content: space-between; align-items: center; gap: 24px; background: var(--ink); color: white; }
.capture-actions > div:first-child { min-width: 0; flex: 1 1 auto; }
.capture-actions > div:first-child strong, .capture-actions > div:first-child small { display: block; }
.capture-actions > div:first-child strong { font: 500 21px "Newsreader"; }
.capture-actions > div:first-child small { margin-top: 3px; color: #b9c7c2; font-size: 10px; }
.capture-actions > div:last-child { display: flex; flex: 0 0 auto; align-items: center; gap: 9px; }
.capture-actions button { white-space: nowrap; }
.capture-actions .primary { background: var(--coral); }
.capture-actions .primary:hover { background: #dd684f; }
.capture-actions .secondary { color: white; border-color: #82948e; }
.capture-actions button:disabled { opacity: .55; cursor: wait; }
.save-progress { margin: 18px 34px 0; }
.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Typography system — one calm, bilingual scale for the whole product. */
:root {
  --font-body: "Noto Sans Thai", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: "Noto Serif Thai", Georgia, serif;
  --type-caption: 11px;
  --type-small: 12.5px;
  --type-body: 14.5px;
  --type-lede: 17px;
  --type-card-title: 25px;
  --type-section-title: 34px;
  --type-page-title: clamp(48px, 4.8vw, 68px);
}

body,
button,
input,
textarea,
select { font-family: var(--font-body); }

h1,
h2,
.brand,
.story-card h3,
.review-number,
.review-card h3,
.master-card h3,
.review-work-card h2,
.review-form-heading h3,
.preview-actions strong,
.capture-actions strong,
.profile-editor-card > summary strong,
.design-photo-placeholder span,
.design-child-voice p,
.master-cover-title h1,
.master-cover-title p,
.master-empty strong,
.master-entry-grid h3,
.master-profile-mark,
.master-metric-row strong,
.master-journey-current h2,
.growth-map h3,
.reflection-grid p,
.evidence-index article > b,
.evidence-index h3 { font-family: var(--font-display); }

h1 { font-size: var(--type-page-title); line-height: .98; letter-spacing: -.035em; }
h2 { font-size: var(--type-section-title); line-height: 1.1; }
.eyebrow { margin-bottom: 20px; font-size: var(--type-caption); line-height: 1.4; letter-spacing: .16em; }
.hero-row p,
.lede { margin-top: 22px; font-size: var(--type-lede); line-height: 1.65; }
.primary,
.secondary,
.text-button,
.chip { font-family: var(--font-body); font-size: 13px; }

/* Navigation and shared page chrome. */
.brand { font-size: 22px; line-height: .92; }
.brand-mark { font-family: var(--font-body); font-size: 13px; }
.nav-link { font-size: 14px; }
.nav-link b,
.sidebar-note small,
.child-switcher small { font-size: var(--type-caption); }
.sidebar-note strong,
.account { font-size: var(--type-small); }
.child-switcher strong { font-size: 14px; }
.topbar { margin-bottom: 58px; }

/* Dashboard, Library, and Master list pages. */
.stats small { font-size: var(--type-small); }
.stats strong { font-family: var(--font-display); font-size: 54px; }
.stats span { font-size: var(--type-caption); }
.section-heading { margin-top: 64px; }
.story-card .meta { font-size: var(--type-caption); line-height: 1.45; }
.story-card .status-pill { font-size: 10.5px; line-height: 1.35; }
.placement-pill { font-size: var(--type-caption); }
.story-card h3 { margin-top: 24px; font-size: var(--type-card-title); line-height: 1.08; }
.story-card p { font-size: var(--type-body); line-height: 1.58; }
.story-card footer { font-size: var(--type-caption); }
.empty-state { font-size: var(--type-body); }
.card-actions button,
.danger-action { font-family: var(--font-body); font-size: 12px; }
.placement-control > span,
.published-lock-note { font-size: 10.5px; }
.placement-control select { font-size: 12.5px; }
.master-card h3 { font-size: 27px; line-height: 1.15; }
.master-card small,
.master-entry { font-size: var(--type-small); line-height: 1.45; }
.portfolio-copy h2 { font-size: 43px; line-height: 1.06; }
.portfolio-copy p { font-size: var(--type-body); }
.cover-art {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  color: var(--ink);
  background: linear-gradient(145deg, transparent 0 71%, rgba(120,154,131,.3) 71%), #fffaf2;
}
.cover-art::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: -48px;
  right: -52px;
  width: 175px;
  height: 175px;
  border-radius: 48% 0 54% 58%;
  background: linear-gradient(145deg, var(--coral), var(--ochre));
  transform: rotate(9deg);
}
.cover-art strong { max-width: 88%; margin: auto 0 16px; color: var(--ink); font-family: var(--font-display); font-size: 36px; line-height: 1.02; }
.cover-art span,
.cover-art small { font-size: var(--type-caption); }
.cover-art span { font-weight: 700; }
.cover-art-photo { height: 132px; margin: 28px 0 17px; overflow: hidden; border: 5px solid rgba(255,253,248,.9); border-radius: 21px 21px 21px 8px; box-shadow: 10px 11px 0 rgba(214,166,66,.2); }
.cover-art-photo img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: 50% 32%; }
.cover-art:has(.cover-art-photo:not(.hidden)) strong { margin-top: 0; }
.cover-art-details { display: grid; gap: 5px; padding-top: 15px; border-top: 1px solid rgba(24,49,45,.18); }
.cover-art-details b { color: #49615b; font-family: var(--font-display); font-size: 17px; line-height: 1.25; }
.cover-art-details small { color: var(--muted); line-height: 1.4; }
.mini-form {
  width: 100%;
  max-width: 560px;
  min-width: 0;
  gap: 13px;
}
.mini-form label { gap: 7px; }
.master-cover-file small { color: var(--muted); font-size: 10.5px; font-weight: 400; line-height: 1.4; }
.master-cover-file,
.master-cover-file input { min-width: 0; max-width: 100%; }
.master-cover-file small { overflow-wrap: anywhere; }
.master-cover-file input { padding: 10px; cursor: pointer; overflow: hidden; }

/* Keep the cover and creation form inside the preview card at every width.
   File inputs have a large intrinsic width in some browsers; allowing both
   grid tracks and children to shrink prevents the right column from being
   pushed off-screen when a cover photo is selected. */
.portfolio-preview {
  grid-template-columns: minmax(260px, 390px) minmax(0, 1fr);
}
.portfolio-preview > *,
.portfolio-copy { min-width: 0; }
.portfolio-copy { overflow-wrap: anywhere; }
@media (max-width: 900px) {
  .portfolio-preview {
    grid-template-columns: 1fr;
    padding: 25px;
    gap: 60px;
  }
  .cover-art { max-width: 330px; }
}

/* Master page hierarchy: separate editing the current book from starting a
   new portfolio. */
.master-workspace-section { margin-top: 58px; }
.master-section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; margin-bottom: 22px; }
.master-section-heading .eyebrow { margin-bottom: 10px; }
.master-section-heading h2 { font-size: 34px; line-height: 1.08; }
.master-section-heading p { max-width: 670px; margin: 10px 0 0; color: var(--muted); font-size: var(--type-body); line-height: 1.55; }
.master-section-note { flex: 0 0 auto; max-width: 230px; padding: 10px 13px; border-radius: 12px; background: var(--sage-soft); color: #49615b; font-size: var(--type-caption); line-height: 1.45; }
.master-current-section .profile-editor-card { margin-top: 0; }
.master-current-section .cover-editor-card { margin-top: 16px; }
.cover-editor-card .profile-form { padding-top: 22px; }
.master-current-section .portfolio-preview { margin-top: 28px; }
.cover-copy-editor { padding: 20px; border: 1px solid #c9d8cf; border-radius: 18px; background: var(--sage-soft); }
.cover-copy-editor > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 17px; }
.cover-copy-editor > header strong,
.cover-copy-editor > header small { display: block; }
.cover-copy-editor > header strong { font-size: 14px; }
.cover-copy-editor > header small { margin-top: 5px; color: var(--muted); font-size: 12px; font-weight: 400; line-height: 1.45; }
.cover-copy-editor > header span { flex: 0 0 auto; color: #3f6f55; font-size: 10px; font-weight: 700; letter-spacing: .14em; }
.cover-copy-editor .field-grid { gap: 15px; }
.cover-form-actions { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-top: 18px; }
.cover-form-actions > div { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.cover-form-actions .secondary, .cover-form-actions .primary { min-width: 106px; }
.cover-photo-help { color: var(--muted); font-size: var(--type-caption); line-height: 1.45; }
.cover-art-details #cover-subtitle:empty,
.cover-art-details #cover-footer:empty { display: none; }
.master-cover-title > small { display: block; max-width: 460px; margin-top: 11px; color: var(--muted); font-size: 14px; line-height: 1.5; }
.master-create-section { padding: 30px 32px 34px; border: 1px solid var(--line); border-radius: 24px; background: rgba(255,253,248,.72); }
.master-create-section .master-section-heading { margin-bottom: 20px; }
.master-create-form { max-width: none; margin-top: 0; }
.master-create-form button { min-width: 150px; }
.new-portfolio-cover-copy { padding: 18px 20px 20px; border: 1px solid #c9d8cf; border-radius: 18px; background: var(--sage-soft); }
.new-portfolio-cover-copy > header { margin-bottom: 16px; }
.new-portfolio-cover-copy strong, .new-portfolio-cover-copy small { display: block; }
.new-portfolio-cover-copy strong { font-size: 14px; }
.new-portfolio-cover-copy small { margin-top: 5px; color: var(--muted); font-size: var(--type-caption); line-height: 1.45; }
.new-portfolio-cover-copy .field-grid { gap: 15px; }
.master-library-section { margin-top: 62px; }
.master-library-section .master-section-heading { margin-bottom: 18px; }

/* Keep a stable image frame. Source images are cropped inside it, so their
   native dimensions cannot resize the cover or shift the page layout. */
.cover-art-photo { width: 100%; height: auto; aspect-ratio: 3 / 2; flex: 0 0 auto; }
.cover-art-photo img { object-fit: cover; object-position: 50% 35%; }
.master-cover-photo { width: min(74%, 560px); max-width: 100%; height: auto; aspect-ratio: 3 / 2; min-height: 240px; object-fit: cover; object-position: 50% 35%; }
.master-cover-file small::after { content: " Recommended: 1600 × 1067 px (3:2)."; }
.master-cover-file small { display: block; }
.master-create-form .master-cover-file input { min-height: 48px; }
@media (max-width: 900px) {
  .master-section-heading { align-items: flex-start; flex-direction: column; gap: 10px; }
  .master-section-heading h2 { font-size: 30px; }
  .master-section-note { max-width: none; }
  .master-create-section { padding: 24px 20px 26px; }
  .cover-copy-editor > header { flex-direction: column; gap: 8px; }
}
@media (max-width: 520px) {
  .master-workspace-section { margin-top: 44px; }
  .master-cover-photo { width: 100%; min-height: 0; }
}
.master-picker-dialog { width: min(92vw, 540px); padding: 0; border: 1px solid var(--line); border-radius: 22px; color: var(--ink); background: var(--paper); box-shadow: 0 28px 80px rgba(24,49,45,.25); }
.master-picker-dialog::backdrop { background: rgba(24,49,45,.48); backdrop-filter: blur(3px); }
.master-picker-dialog form { padding: 28px; }
.master-picker-dialog .eyebrow { display: block; margin-bottom: 12px; }
.master-picker-dialog h2 { font-size: 30px; }
.master-picker-dialog p { margin: 10px 0 22px; color: var(--muted); font-size: 13.5px; line-height: 1.55; }
.master-picker-dialog select { width: 100%; }
.master-picker-dialog form > div { margin-top: 22px; display: flex; justify-content: flex-end; gap: 9px; }

/* Forms and review use readable working text, not print-caption sizes. */
label,
.activity-editor label { font-size: 14px; line-height: 1.45; }
input,
textarea,
select,
.activity-editor input,
.activity-editor textarea,
.activity-editor select { font-family: var(--font-body); font-size: 15px; }
.capture-intro h1 { font-size: clamp(46px, 4.2vw, 60px); line-height: 1; }
.capture-intro .lede { font-size: var(--type-lede); line-height: 1.6; }
.capture-steps strong { font-size: 12px; }
.capture-steps small { font-size: 10.5px; }
.form-section-head h2 { font-family: var(--font-display); font-size: 29px; line-height: 1.12; }
.form-section-head p { font-size: 13.5px; line-height: 1.55; }
.required-mark,
.optional-mark { font-size: 11.5px; }
.section-number { font-size: 15px; }
.note-prompts span,
.note-assist > small,
.upload-dropzone span,
.evidence-meta strong,
.evidence-toolbar button { font-size: var(--type-caption); }
.detail-builder summary strong,
.language-choice legend strong,
.placement-options strong,
.consent-row strong { font-size: 14px; }
.detail-builder summary small,
.language-choice legend small,
.language-options small,
.placement-options small,
.consent-row small { font-size: 12.5px; }
.profile-editor-card > summary small { font-size: 12px; line-height: 1.5; }
.capture-actions > div:first-child strong { font-size: 20px; }
.capture-actions > div:first-child small { font-size: var(--type-caption); }

.review-work-card > header h2 { font-size: 30px; line-height: 1.12; }
.review-work-card > header p,
.review-change-notice p,
.review-processing p { font-size: var(--type-small); }
.review-work-card .status-pill,
.review-eyebrow,
.review-ai-badge { font-size: 10.5px; }
.review-source strong,
.review-change-notice strong,
.review-language-choice strong,
.review-field-grid label,
.review-rewrite-panel label,
.review-source-editor summary strong,
.review-evidence-editor > div:first-child strong { font-size: 13.5px; }
.review-source p,
.review-field-grid input,
.review-field-grid textarea,
.review-field-grid select,
.review-rewrite-panel textarea { font-size: var(--type-body); }
.review-source > div span,
.review-form-heading > p,
.review-language-choice small,
.review-source-editor summary small,
.review-evidence-editor > div:first-child small,
.review-evidence-kind,
.review-evidence-item strong,
.review-evidence-empty,
.review-evidence-loading,
.review-evidence-progress { font-size: var(--type-caption); }
.review-evidence-item small,
.review-evidence-delete { font-size: 10.5px; }
.review-form-heading h3 { font-size: 27px; line-height: 1.12; }
.review-processing h2,
.review-failed h2 { font-size: 28px; }

/* Individual portfolio page: a tighter title-to-body ratio. */
.design-title h1 { font-size: clamp(32px, 3.2vw, 38px); line-height: 1.05; }
.design-title p { font-size: 15.5px; line-height: 1.52; }
.design-header small,
.design-date,
.design-footer,
.design-kicker,
.design-label { font-size: var(--type-caption); }
.design-facts span { font-size: 10.5px; }
.design-facts strong { font-size: 12.5px; line-height: 1.4; }
.design-story p { font-size: 15.5px; line-height: 1.56; }
.design-skills span { font-size: var(--type-caption); }
.design-tags span,
.design-evidence a { font-size: 10px; }
.design-growth-details span { font-size: 10px; }
.design-growth-details p { font-size: 14px; line-height: 1.5; }
.design-growth-details .design-result span { font-size: var(--type-caption); }
.design-growth-details .design-result p { font-size: 14.5px; }
.design-verification,
.preview-actions small,
.preview-status { font-size: var(--type-caption); }
.preview-actions strong { font-size: 20px; }

/* Master Portfolio: print-ready but no text below a practical reading size. */
.master-cover-sheet header,
.master-cover-sheet footer,
.master-cover-title > span { font-size: var(--type-caption); }
.master-cover-title h1 { max-width: 620px; font-size: clamp(42px, 4.4vw, 58px); line-height: 1.04; }
.master-cover-title p { margin-top: 18px; font-size: 24px; line-height: 1.3; }
.master-section-sheet { gap: 28px; }
.master-section-sheet > header span { font-size: 10.5px; line-height: 1.4; }
.master-section-sheet > header small,
.master-section-sheet > footer { font-size: 9.5px; line-height: 1.4; }
.master-section-sheet > header b { font-size: var(--type-caption); }
.master-section-title h1 { font-size: clamp(28px, 2.8vw, 34px); line-height: 1.12; }
.master-section-title p { margin-top: 12px; font-size: 15.5px; line-height: 1.55; }
.master-section-content > h2 { margin-top: 22px; font-size: 20px; line-height: 1.25; }
.master-empty strong { font-size: 21px; }
.master-empty p { font-size: 12.5px; line-height: 1.6; }
.master-entry-grid article > span { font-size: 10px; line-height: 1.4; }
.master-entry-grid h3 { font-size: 17.5px; line-height: 1.18; }
.master-entry-grid p { font-size: 13px; line-height: 1.55; }
.master-entry-grid footer { font-size: 10px; }
.master-profile-layout dt { font-size: 10.5px; line-height: 1.4; }
.master-profile-layout dd { font-size: 14px; line-height: 1.45; }
.master-long-copy { font-size: 14.5px; line-height: 1.65; }
.master-metric-row strong { font-size: 38px; }
.master-metric-row span,
.master-chips span { font-size: var(--type-caption); line-height: 1.4; }
.master-observed h2 { font-size: 20px; }
.master-journey-current > span { font-size: 10px; }
.master-journey-current h2 { font-size: 25px; }
.master-journey-current p,
.master-timeline { font-size: 13.5px; line-height: 1.6; }
.growth-map h3 { font-size: 16.5px; line-height: 1.2; }
.growth-map p { font-size: 12px; line-height: 1.55; }
.master-table > div { font-size: 11.5px; line-height: 1.45; }
.reflection-grid span { font-size: 10.5px; }
.reflection-grid p { font-size: 15.5px; line-height: 1.5; }
.goal-list li { font-size: 13.5px; line-height: 1.5; }
.evidence-index h3 { font-size: 15.5px; line-height: 1.2; }
.evidence-index p,
.evidence-index small { font-size: 11.5px; line-height: 1.5; }

.master-section-sheet > footer {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 26px;
  display: block;
}
.master-section-sheet > footer span { position: absolute; bottom: 0; white-space: nowrap; }
.master-section-sheet > footer span:first-child { left: 0; }
.master-section-sheet > footer span:last-child { right: 0; }

@media (max-width: 1050px) {
  .capture-intro { grid-template-columns: 1fr; gap: 34px; }
  .capture-steps { max-width: 560px; }
  .three-fields { grid-template-columns: 1fr 1fr; }
  .three-fields label:last-child { grid-column: 1 / -1; }
  .placement-options { grid-template-columns: 1fr; }
  .review-saved-facts { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .review-source-fields { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .profile-ai-controls { grid-template-columns: 1fr 1fr; }
  .profile-ai-controls button { grid-column: 1 / -1; }
}
@media (max-width: 520px) {
  body { overflow-x: hidden; }
  .mini-form { grid-template-columns: 1fr; }
  .master-card header { flex-direction: column; }
  .master-actions { width: 100%; justify-content: flex-start; }
  .capture-intro, .activity-editor, .form-section, .form-section-head, .form-section-head > div { min-width: 0; }
  .capture-intro h1 { font-size: 44px; line-height: .94; }
  .capture-steps { max-width: none; grid-template-columns: 1fr; padding: 10px; }
  .capture-steps li { padding: 8px 10px; }
  .capture-steps strong, .capture-steps small { white-space: normal; }
  .activity-editor { margin-top: 34px; }
  .form-section { padding: 25px 20px; }
  .form-section-head { display: block; }
  .form-section-head > div { align-items: flex-start; }
  .form-section-head p { margin: 12px 0 0 43px; text-align: left; }
  .form-section-head h2 { font-size: 27px; overflow-wrap: anywhere; }
  .form-section-head p { margin-left: 52px; }
  .growth-ai-panel { align-items: flex-start; flex-direction: column; }
  .story-field-label { display: block; }
  .story-field-label small { display: block; margin-top: 4px; text-align: left; }
  .growth-ai-result dl { grid-template-columns: 1fr; }
  .three-fields { grid-template-columns: 1fr; }
  .two-fields, .verifier-fields { grid-template-columns: 1fr; }
  .three-fields label:last-child { grid-column: auto; }
  .upload-dropzone { grid-template-columns: auto 1fr; padding: 20px; }
  .upload-dropzone > div:nth-child(2) { min-width: 0; }
  .upload-dropzone button { grid-column: 1 / -1; width: 100%; }
  .evidence-grid { grid-template-columns: 1fr; }
  .review-source-fields, .review-evidence-list { grid-template-columns: 1fr; }
  .review-saved-facts, .review-saved-growth { grid-template-columns: 1fr; }
  .review-saved-heading { align-items: flex-start; flex-direction: column; }
  .review-saved-heading p { text-align: left; }
  .review-saved-details { padding: 18px; }
  .review-evidence-editor { grid-template-columns: 1fr; }
  .review-evidence-editor > button { width: 100%; }
  .capture-actions { padding: 22px 20px; align-items: stretch; flex-direction: column; }
  .capture-actions > div:last-child { display: grid; grid-template-columns: 1fr; }
  .capture-actions button { width: 100%; white-space: normal; }
  .save-progress { margin: 16px 20px 0; }
  .design-toolbar, .preview-actions { align-items: stretch; flex-direction: column; }
  .design-toolbar > div, .preview-actions > div:last-child { justify-content: space-between; }
  .master-draft-panel { padding: 18px; }
  .master-draft-panel > header { flex-direction: column; }
  .master-draft-heading-actions { width: 100%; justify-content: space-between; }
  .master-draft-row { grid-template-columns: 28px minmax(0,1fr); }
  .master-draft-order, .master-draft-actions { grid-column: 2; justify-content: flex-start; flex-wrap: wrap; }
  .design-stage { margin: 0 -14px; padding: 14px; border-radius: 18px; }
  .design-sheet { min-height: 760px; padding: 25px; gap: 18px; }
  .master-cover-sheet { min-height: 760px; padding: 28px; }
  .master-cover-sheet::before { top: -48px; right: -65px; width: 220px; height: 220px; }
  .master-cover-visual { min-height: 190px; }
  .master-cover-photo { width: 84%; height: auto; min-height: 0; aspect-ratio: 3 / 2; border-width: 5px; border-radius: 24px 24px 24px 9px; }
  .master-cover-monogram { width: 92px; height: 92px; font-size: 48px; }
  .master-cover-details { grid-template-columns: 1fr; gap: 7px; }
  .master-cover-details > div { padding: 10px 12px; }
  .master-section-sheet { min-height: 760px; padding: 28px; gap: 22px; }
  .master-section-title h1 { font-size: 32px; }
  .master-category-sheet .master-section-title { padding-top: 35px; }
  .category-divider-summary { min-height: 250px; padding: 24px; flex-direction: column; align-items: flex-start; gap: 12px; }
  .category-divider-count { font-size: 96px; }
  .category-divider-summary strong { font-size: 18px; }
  .category-divider-summary p { font-size: 13px; }
  .master-profile-layout { grid-template-columns: 1fr; }
  .master-profile-mark { width: 95px; font-size: 48px; }
  .master-entry-grid, .growth-map, .reflection-grid { grid-template-columns: 1fr; }
  .master-glance-columns { grid-template-columns: 1fr; gap: 0; }
  .master-metric-row { grid-template-columns: 1fr 1fr 1fr; }
  .master-table > div { grid-template-columns: .7fr 1.4fr 1fr; gap: 8px; padding: 10px; }
  .profile-editor-card > summary { align-items: flex-start; flex-direction: column; }
  .profile-ai-assist { padding: 17px; }
  .profile-ai-controls { grid-template-columns: 1fr; }
  .profile-ai-controls button { grid-column: auto; width: 100%; }
  .review-work-card > header, .review-form-heading, .review-footer-actions { align-items: stretch; flex-direction: column; }
  .review-work-card > header, .review-draft-form { padding: 21px; }
  .review-source { margin: 18px 21px 0; }
  .review-form-heading > p { text-align: left; }
  .review-field-grid, .review-rewrite-panel { grid-template-columns: 1fr; }
  .review-language-choice label { grid-template-columns: 1fr; }
  .review-language-choice select { grid-column: 1; grid-row: auto; margin-top: 8px; }
  .language-options { grid-template-columns: 1fr; }
  .review-footer-actions > div:last-child { display: grid; grid-template-columns: 1fr; }
  .review-footer-actions button, .review-rewrite-panel button { width: 100%; }
  h1 { font-size: 44px; line-height: 1; }
  h2 { font-size: 30px; }
  .master-cover-title h1 { font-size: 40px; }
  .master-cover-title p { font-size: 22px; }
  .design-title h1 { font-size: 32px; }
  .design-title p { font-size: 14px; }
  .design-photo-grid { min-height: 270px; }
  .design-story { grid-template-columns: 1fr; gap: 20px; }
  .design-story aside { display: none; }
}

@media print {
  @page { size: A4 portrait; margin: 5mm; }
  html, body { width: 210mm; margin: 0; padding: 0; background: white; }
  .sidebar, .topbar, .design-toolbar, .preview-actions, .master-draft-panel, .notice { display: none !important; }
  .shell, main { display: block; margin: 0; padding: 0; }
  .view { display: none !important; }
  .view.active { display: block !important; max-width: none; margin: 0; animation: none !important; transform: none !important; }
  .design-stage { padding: 0; background: white; }
  .master-book-stage { display: block; }
  .design-sheet, .master-cover-sheet, .master-section-sheet { width: 199mm; height: 286mm; min-height: 0; margin: 0 auto; overflow: hidden; box-shadow: none; break-inside: avoid; page-break-inside: avoid; break-after: page; page-break-after: always; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
  .design-stage:not(.master-book-stage) > .design-sheet:last-child { break-after: auto; page-break-after: auto; }
  .master-book-stage > :last-child { break-after: auto; page-break-after: auto; }
}

/* Portfolio collection and focused single-portfolio workspace. */
.portfolio-overview-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 48px;
  padding: 10px 0 34px;
  border-bottom: 1px solid var(--line);
}
.portfolio-overview-header .eyebrow { margin-bottom: 12px; }
.portfolio-overview-header h1 { font-size: clamp(48px, 5.2vw, 68px); line-height: .96; }
.portfolio-overview-header .lede { max-width: 630px; margin-top: 17px; font-size: 16px; line-height: 1.6; }
.portfolio-summary { display: grid; grid-template-columns: repeat(3, minmax(94px, 1fr)); gap: 9px; }
.portfolio-summary article { min-width: 96px; padding: 15px 17px; border: 1px solid var(--line); border-radius: 16px; background: rgba(255,253,248,.78); }
.portfolio-summary strong, .portfolio-summary span { display: block; }
.portfolio-summary strong { font: 500 30px/1 var(--font-display); }
.portfolio-summary span { margin-top: 7px; color: var(--muted); font-size: 10.5px; white-space: nowrap; }

.master-library-section { margin-top: 36px; }
.master-library-section .master-section-heading h2 { font-size: 30px; }
.portfolio-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 0; }
.portfolio-card { min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 22px; background: var(--paper); box-shadow: 0 8px 26px rgba(38,48,43,.045); transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; }
.portfolio-card:hover { transform: translateY(-3px); border-color: #b8c9be; box-shadow: 0 17px 38px rgba(38,48,43,.09); }
.portfolio-card-open { width: 100%; min-height: 235px; padding: 18px; display: grid; grid-template-columns: 110px minmax(0, 1fr); align-items: stretch; gap: 18px; border: 0; color: var(--ink); background: transparent; text-align: left; cursor: pointer; }
.portfolio-card-open:focus-visible { outline: 3px solid rgba(120,154,131,.38); outline-offset: -4px; }
.portfolio-card-cover { position: relative; isolation: isolate; aspect-ratio: 210 / 297; overflow: hidden; align-self: center; border-radius: 8px; background: linear-gradient(151deg, #fffaf2 0 69%, #dbe5dd 69%); box-shadow: 8px 9px 0 #eee3cb; }
.portfolio-card-cover::before { content: ""; position: absolute; z-index: -1; top: -27px; right: -32px; width: 78px; height: 78px; border-radius: 44% 0 50% 60%; background: linear-gradient(145deg, var(--coral), var(--ochre)); transform: rotate(9deg); }
.portfolio-card-cover img { position: absolute; top: 35px; left: 9%; width: 82%; aspect-ratio: 3 / 2; object-fit: cover; object-position: 50% 35%; border: 3px solid rgba(255,253,248,.94); border-radius: 8px 8px 8px 3px; }
.portfolio-card-cover > span { position: absolute; top: 41px; left: 50%; width: 56px; height: 56px; display: grid; place-items: center; border-radius: 50%; transform: translateX(-50%); background: var(--sage-soft); font: 500 31px/1 var(--font-display); }
.portfolio-card-cover i { position: absolute; top: 13px; left: 11px; right: 10px; overflow: hidden; font-size: 6px; font-style: normal; font-weight: 700; letter-spacing: .16em; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.portfolio-card-cover strong { position: absolute; right: 11px; bottom: 15px; left: 11px; max-height: 38px; overflow: hidden; font: 500 15px/1.05 var(--font-display); overflow-wrap: anywhere; }
.portfolio-card-copy { min-width: 0; display: flex; flex-direction: column; padding: 3px 0; }
.portfolio-card-copy > div { min-height: 24px; display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.portfolio-status, .portfolio-edit-count { display: inline-flex; align-items: center; min-height: 23px; padding: 5px 8px; border-radius: 99px; font-size: 9px; font-weight: 700; letter-spacing: .06em; }
.portfolio-status.is-final { background: var(--sage-soft); }
.portfolio-status.is-progress { background: var(--coral-soft); color: #874331; }
.portfolio-edit-count { color: var(--muted); background: var(--ivory); }
.portfolio-card-copy h3 { margin: 16px 0 0; font: 500 22px/1.08 var(--font-display); overflow-wrap: anywhere; }
.portfolio-card-copy p { margin: 8px 0 0; color: var(--muted); font-size: 11.5px; line-height: 1.45; }
.portfolio-card-copy footer { margin-top: auto; padding-top: 16px; display: flex; justify-content: space-between; gap: 10px; border-top: 1px solid var(--line); color: var(--muted); font-size: 10px; }
.portfolio-card-copy footer b { color: var(--ink); font-weight: 700; }

.master-current-section { margin-top: 0; display: flex; flex-direction: column; }
.master-current-section.hidden { display: none; }
.portfolio-workspace-back { order: 0; align-self: flex-start; margin-bottom: 25px; padding: 0; color: var(--muted); }
.master-current-section > .master-section-heading { order: 1; margin-bottom: 24px; padding-bottom: 25px; border-bottom: 1px solid var(--line); }
.master-current-section > .master-section-heading h2 { max-width: 700px; font-size: clamp(34px, 3.8vw, 48px); }
.workspace-heading-actions { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.master-current-section > .portfolio-preview { order: 2; margin: 0; padding: 30px 34px; gap: 48px; border-radius: 26px; background: rgba(255,253,248,.82); }
.master-current-section > .portfolio-preview .cover-art { width: min(100%, 300px); justify-self: center; }
.master-current-section > .portfolio-preview .portfolio-copy h2 { font-size: 36px; }
.master-current-section > .portfolio-preview .portfolio-copy p { margin-top: 16px; }
.workspace-tools { order: 3; margin-top: 25px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 11px; }
.workspace-tools button { position: relative; min-height: 145px; padding: 18px; display: flex; flex-direction: column; align-items: flex-start; border: 1px solid var(--line); border-radius: 18px; color: var(--ink); background: var(--paper); text-align: left; cursor: pointer; transition: border-color .2s ease, background .2s ease, transform .2s ease; }
.workspace-tools button:hover { transform: translateY(-2px); border-color: #aebfb4; background: #fbf8f1; }
.workspace-tools button > span { color: var(--coral); font-size: 10px; font-weight: 700; letter-spacing: .12em; }
.workspace-tools button strong { margin-top: 18px; font-size: 14px; }
.workspace-tools button small { margin-top: 6px; color: var(--muted); font-size: 10.5px; line-height: 1.45; }
.workspace-tools button b { position: absolute; right: 16px; bottom: 13px; font-size: 16px; }
.workspace-panel { order: 4; margin-top: 30px; padding: 27px; border: 1px solid var(--line); border-radius: 22px; background: var(--paper); box-shadow: var(--shadow); }
.workspace-panel > header { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 20px; }
.workspace-panel .eyebrow { margin-bottom: 8px; }
.workspace-panel h2 { font-size: 28px; }
.workspace-panel p { margin: 8px 0 0; color: var(--muted); font-size: 12.5px; line-height: 1.5; }
.workspace-activity-list { display: grid; gap: 8px; }
.workspace-activity-row { min-width: 0; padding: 13px 14px; display: grid; grid-template-columns: 30px minmax(0, 1fr) auto auto; align-items: center; gap: 13px; border-radius: 13px; background: var(--ivory); }
.workspace-activity-row > b { color: var(--coral); font-size: 11px; }
.workspace-activity-row > div:nth-child(2) { min-width: 0; }
.workspace-activity-row strong, .workspace-activity-row small { display: block; }
.workspace-activity-row strong { overflow: hidden; font-size: 12.5px; text-overflow: ellipsis; white-space: nowrap; }
.workspace-activity-row small { margin-top: 3px; color: var(--muted); font-size: 9.5px; }
.workspace-order, .workspace-row-actions { display: flex; align-items: center; gap: 6px; }
.workspace-order button { width: 30px; height: 30px; padding: 0; border: 1px solid var(--line); border-radius: 50%; color: var(--ink); background: var(--paper); cursor: pointer; }
.workspace-order button:disabled { opacity: .32; cursor: not-allowed; }
.workspace-row-actions .secondary { padding: 8px 12px; font-size: 10.5px; }
.workspace-row-actions .text-button { padding: 7px; font-size: 10.5px; }
.workspace-row-actions .danger { color: #9b4334; }
.workspace-activities-empty { padding: 27px; border: 1px dashed #c9c1b5; border-radius: 14px; text-align: center; }
.workspace-activities-empty strong { font: 500 21px var(--font-display); }
.workspace-activities-empty p { margin: 7px auto 0; }
.master-current-section > .portfolio-details-card { order: 5; margin-top: 16px; }
.master-current-section > #cover-editor-card { order: 6; margin-top: 12px; }
.master-current-section > #profile-editor-card { order: 7; margin-top: 12px; }
.master-current-section > .portfolio-danger-zone { order: 8; margin-top: 28px; padding: 18px 20px; display: flex; align-items: center; justify-content: space-between; gap: 22px; border: 1px solid #ecc9c0; border-radius: 17px; background: #fbf3ef; }
.portfolio-danger-zone strong, .portfolio-danger-zone p { display: block; }
.portfolio-danger-zone strong { font-size: 13px; color: #843d31; }
.portfolio-danger-zone p { margin: 4px 0 0; color: #86665e; font-size: 10.5px; }
.danger-outline { padding: 10px 15px; border: 1px solid #a64837; border-radius: 99px; color: #9a3e30; background: transparent; font: 600 11px var(--font-body); cursor: pointer; }

.master-create-section { margin-top: 38px; padding: 0; overflow: hidden; }
.master-create-section > summary { list-style: none; padding: 21px 24px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 15px; cursor: pointer; }
.master-create-section > summary::-webkit-details-marker { display: none; }
.master-create-section > summary:hover { background: rgba(220,232,223,.28); }
.create-portfolio-symbol { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; background: var(--sage-soft); font-size: 21px; }
.master-create-section > summary strong, .master-create-section > summary small { display: block; }
.master-create-section > summary strong { font: 500 21px/1.15 var(--font-display); }
.master-create-section > summary small { margin-top: 5px; color: var(--muted); font-size: 11.5px; }
.master-create-section > summary b { font-size: 11px; }
.master-create-section[open] > summary { border-bottom: 1px solid var(--line); }
.master-create-section[open] > summary b { font-size: 0; }
.master-create-section[open] > summary b::after { content: "Close −"; font-size: 11px; }
.master-create-body { padding: 29px 31px 33px; }
.master-create-body .master-section-heading h2 { font-size: 30px; }

@media (max-width: 1100px) {
  .portfolio-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .workspace-tools { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 800px) {
  .portfolio-overview-header { grid-template-columns: 1fr; gap: 24px; }
  .portfolio-summary { width: 100%; }
  .master-current-section > .portfolio-preview { grid-template-columns: 1fr; gap: 30px; }
  .master-current-section > .portfolio-preview .cover-art { width: min(100%, 320px); }
  .workspace-activity-row { grid-template-columns: 30px minmax(0, 1fr) auto; }
  .workspace-row-actions { grid-column: 2 / -1; justify-content: flex-start; }
}
@media (max-width: 620px) {
  .portfolio-overview-header h1 { font-size: 46px; }
  .portfolio-summary { grid-template-columns: 1fr; }
  .portfolio-summary article { display: flex; align-items: center; justify-content: space-between; }
  .portfolio-summary span { margin-top: 0; }
  .portfolio-card-grid { grid-template-columns: 1fr; }
  .portfolio-card-open { min-height: 222px; grid-template-columns: 104px minmax(0, 1fr); gap: 16px; padding: 16px; }
  .workspace-heading-actions { width: 100%; }
  .workspace-heading-actions button { flex: 1; }
  .workspace-tools { grid-template-columns: 1fr; }
  .workspace-tools button { min-height: 115px; }
  .workspace-panel { padding: 20px 16px; }
  .workspace-panel > header { align-items: flex-start; flex-direction: column; }
  .workspace-activity-row { grid-template-columns: 27px minmax(0, 1fr); }
  .workspace-order, .workspace-row-actions { grid-column: 2; }
  .workspace-row-actions { flex-wrap: wrap; }
  .master-current-section > .portfolio-danger-zone { align-items: flex-start; flex-direction: column; }
  .master-create-section > summary { padding: 18px; }
  .master-create-section > summary b { display: none; }
  .master-create-body { padding: 23px 18px 26px; }
}

/* Master PDF typography pass: clear hierarchy and a readable minimum size. */
.master-cover-sheet header { font-size: 16px; line-height: 1.35; letter-spacing: .13em; }
.master-cover-sheet footer { font-size: 13px; line-height: 1.4; letter-spacing: .1em; }
.master-cover-title > span { font-size: 14px; line-height: 1.4; letter-spacing: .17em; }
.master-cover-title small { display: block; margin-top: 9px; color: var(--muted); font-size: 16px; line-height: 1.45; }
.master-cover-details span { font-size: 12px; line-height: 1.35; }
.master-cover-details strong { font-size: 16px; line-height: 1.4; }

.master-section-sheet > header span { font-size: 12px; line-height: 1.4; }
.master-section-sheet > header small,
.master-section-sheet > footer { font-size: 11.5px; line-height: 1.4; }
.master-section-sheet > header b { font-size: 12.5px; line-height: 1.4; }
.master-section-title p { font-size: 16px; line-height: 1.55; }
.master-empty p { font-size: 13.5px; line-height: 1.6; }
.master-entry-grid article > span { font-size: 11.5px; }
.master-entry-grid h3 { font-size: 18.5px; }
.master-entry-grid p { font-size: 14px; line-height: 1.5; }
.master-entry-grid footer { font-size: 11.5px; }
.master-profile-layout dt { font-size: 12px; }
.master-profile-layout dd { font-size: 15px; }
.master-long-copy { font-size: 15px; line-height: 1.6; }
.master-metric-row span,
.master-chips span { font-size: 12.5px; }
.master-journey-current > span { font-size: 11.5px; }
.master-journey-current p,
.master-timeline { font-size: 14.5px; line-height: 1.55; }
.growth-map p { font-size: 13.5px; line-height: 1.5; }
.master-table > div { font-size: 13px; line-height: 1.45; }
.reflection-grid span { font-size: 12px; }
.reflection-grid p { font-size: 16px; }
.goal-list li { font-size: 14.5px; }
.evidence-index p,
.evidence-index small { font-size: 13px; }

.portfolio-update-banner { margin: 16px 0; padding: 18px 22px; border: 1px solid var(--line); border-radius: 16px; background: var(--sage-soft); display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.portfolio-update-banner p { margin: 5px 0 0; color: var(--muted); font-size: 14px; }
.portfolio-release-tools { margin-bottom: 18px; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.portfolio-release-frame { display: block; width: 100%; min-height: 800px; border: 0; border-radius: 18px; }

/* The A4 page is laid out once at its actual size, then scaled for the screen.
   A narrow browser must never reflow or hide parts of the approved page. */
.design-sheet, .master-cover-sheet, .master-section-sheet { width: 794px; min-height: 1123px; }
.design-sheet {
  --activity-photo-height: 260px;
  padding: 42px;
  gap: 22px;
  grid-template-rows: auto auto var(--activity-photo-height) minmax(0,1fr) auto;
}
.design-sheet { --coral: #527765; --coral-soft: #e5eee8; }
.design-title h1 { font-size: 38px; }
.design-title p { font-size: 15.5px; }
.design-photo-grid,
.design-sheet.design-dense .design-photo-grid,
.design-sheet.design-extra-dense .design-photo-grid,
.design-sheet.design-ultra-dense .design-photo-grid { min-height: 0; height: var(--activity-photo-height); }
.design-sheet.design-dense,
.design-sheet.design-extra-dense,
.design-sheet.design-ultra-dense { grid-template-rows: auto auto var(--activity-photo-height) minmax(0,1fr) auto; }
.design-story { grid-template-columns: minmax(0,1.22fr) minmax(190px,.78fr); gap: 30px; }
.design-story.no-side { grid-template-columns: minmax(0,1fr); }
.design-story aside { display: block; }
.master-cover-title h1 { font-size: 58px; }
.master-section-title h1 { font-size: 34px; }
.master-category-sheet .master-section-title h1 { font-size: 61px; }
@media print {
  @page { size: A4 portrait; margin: 0; }
  .design-sheet, .master-cover-sheet, .master-section-sheet { width: 210mm; height: 297mm; min-height: 0; zoom: 1 !important; }
  .portfolio-release-tools { display: none !important; }
}

/* Add Activity redesign — four visible steps, calm colour coding, and one clear
   path from facts to story, growth, evidence, and preview. */
#view-add { max-width: 1220px; margin-inline: auto; }
#view-add .capture-intro { align-items: center; }
#view-add .capture-intro .eyebrow { color: #527765; }
#view-add .capture-guidance { margin: 24px 0 0; padding: 12px 16px; border-left: 3px solid #789a83; border-radius: 0 10px 10px 0; background: #e7eee8; color: #466157; font-size: 13px; line-height: 1.6; }
#view-add .capture-steps { padding: 9px; background: rgba(255,253,248,.9); box-shadow: 0 12px 30px rgba(24,49,45,.05); }
#view-add .capture-steps li { min-height: 58px; padding: 10px; }
#view-add .capture-steps li.active { background: #dceae1; }
#view-add .capture-steps li.active > span { border-color: #759986; background: #fff; }

#view-add .activity-editor {
  max-width: 1120px;
  margin: 44px auto 0;
  padding: 0 0 104px;
  display: grid;
  gap: 24px;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
#view-add .capture-editing { margin: 0; border-radius: 18px; }
#view-add .form-section {
  margin: 0;
  padding: 30px;
  overflow: hidden;
  border: 1px solid rgba(24,49,45,.13);
  border-radius: 22px;
  background: #fffdf8;
  box-shadow: 0 14px 38px rgba(24,49,45,.055);
}
#view-add .form-section-head,
#view-add .activity-narrative .form-section-head {
  margin: -30px -30px 28px;
  padding: 21px 26px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  border-bottom: 1px solid rgba(24,49,45,.08);
}
#view-add .form-section-head > div { flex: 0 1 auto; min-width: 0; }
#view-add .form-section-head h2,
#view-add .activity-editor .form-section-head h2 { font: 650 23px/1.3 var(--font-body); letter-spacing: -.025em; }
#view-add .form-section-head p,
#view-add .activity-narrative .form-section-head p { max-width: 430px; margin: 0; font-size: 13px; line-height: 1.6; text-align: left; }
#view-add .section-sage .form-section-head { background: #e4eee7; }
#view-add .section-mint .form-section-head { background: #edf5ef; }
#view-add .section-blue .form-section-head { background: #e9f2f6; }
#view-add .section-ochre .form-section-head { background: #f6eedb; }
#view-add .section-sage .section-number { background: #c9ddd0; color: #214d3e; }
#view-add .section-mint .section-number { background: #d3e7d9; color: #295744; }
#view-add .section-blue .section-number { background: #cfE3ec; color: #295767; }
#view-add .section-ochre .section-number { background: #ebddb7; color: #6d5720; }
#view-add .section-number { width: 42px; height: 42px; flex-basis: 42px; border-radius: 13px; }
#view-add .activity-editor label { position: relative; gap: 8px; font-size: 14px; }
#view-add .activity-editor label > .required-mark,
#view-add .activity-editor label > .optional-mark { position: absolute; right: 0; top: 2px; font-size: 11px; }
#view-add .required-mark { color: #315e50; }
#view-add .activity-editor .field-hint { font-size: 12.5px; line-height: 1.6; }
#view-add .activity-editor input,
#view-add .activity-editor textarea,
#view-add .activity-editor select { transition: border-color .18s, box-shadow .18s; }
#view-add .capture-steps strong { font-size: 12px; }
#view-add .capture-steps small { font-size: 10px; }
#view-add .skills-editor { margin-top: 28px; padding: 22px; border: 1px solid #c6dbd5; border-radius: 16px; background: #eef5f1; }
#view-add .skill-choices { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
#view-add .skill-choices button { padding: 8px 13px; border: 1px solid #b9ccc1; border-radius: 99px; background: #fffefa; color: #36554a; font: 600 12px var(--font-body); cursor: pointer; }
#view-add .skill-choices button[aria-pressed="true"] { background: #315e50; border-color: #315e50; color: #fff; }
#view-add .skill-choices button:disabled { opacity: .5; cursor: default; }
#view-add .skill-choices button:focus-visible { outline: 3px solid #abc8b8; outline-offset: 2px; }
#view-add .activity-editor input,
#view-add .activity-editor textarea,
#view-add .activity-editor select { border-radius: 13px; background: #fffefa; }
#view-add .activity-editor input:focus,
#view-add .activity-editor textarea:focus,
#view-add .activity-editor select:focus { background: #fff; }
#view-add .story-field textarea { min-height: 168px; }
#view-add .summary-field { display: flex; margin-top: 26px; }
#view-add .story-facts { padding-top: 23px; border-top: 1px solid rgba(24,49,45,.1); }
#view-add .story-role-field { max-width: calc(50% - 10px); }
#view-add .preparation-timing-fields { margin-bottom: 28px; padding-bottom: 26px; border-bottom: 1px solid rgba(24,49,45,.12); }
#view-add .note-assist { margin-bottom: 23px; }

#view-add .writing-assistant {
  margin: 0 0 26px;
  padding: 20px;
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  align-items: end;
  gap: 18px;
  border-color: #bcd2c2;
  background: linear-gradient(135deg,#e5f0e8,#f3f7f2);
}
#view-add .writing-assistant-copy { grid-column: 1 / -1; display: flex; align-self: center; gap: 13px; }
#view-add .writing-assistant-mark { width: 38px; height: 38px; flex: 0 0 38px; display: grid; place-items: center; border-radius: 50%; background: #315e50; color: #fff; font-size: 18px; }
#view-add .writing-assistant h3 { margin-bottom: 5px; font-size: 16px; }
#view-add .writing-assistant p { font-size: 12px; line-height: 1.5; }
#view-add .writing-assistant .growth-language-choice { min-width: 0; }
#view-add .writing-assistant .language-choice legend { margin-bottom: 7px; }
#view-add .writing-assistant .language-options { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 6px; }
#view-add .writing-assistant .language-options label { padding: 10px 9px; }
#view-add .writing-assistant .language-options strong { font-size: 11px; }
#view-add .writing-assistant > .primary { min-height: 52px; max-width: 205px; padding-inline: 18px; white-space: normal; line-height: 1.35; }
#view-add .writing-assistant .language-choice legend small { margin-top: 4px; font-size: 12px; }
#view-add .writing-assistant .language-options { max-width: 380px; }
#view-add .writing-assistant .language-options strong { font-size: 13px; }
#view-add .writing-assistant-note { grid-column: 1 / -1; padding-top: 12px; border-top: 1px solid rgba(49,94,80,.15); }

#view-add .compact-group { padding: 0; border: 0; }
#view-add .compact-group + .compact-group { margin-top: 28px; padding-top: 26px; border-top: 1px solid rgba(24,49,45,.12); }
#view-add .narrative-group-heading { margin-bottom: 18px; }
#view-add .narrative-group-heading h3 { font-size: 17px; }
#view-add .narrative-group-heading p { font-size: 12.5px; }
#view-add .upload-dropzone { background: rgba(255,253,248,.75); border-color: #cfbd8f; }
#view-add .upload-symbol { background: #eadcb8; color: #654f18; }

#view-add .capture-actions {
  position: sticky;
  z-index: 12;
  bottom: 18px;
  margin: 0;
  padding: 15px 18px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 18px;
  background: rgba(24,49,45,.96);
  box-shadow: 0 18px 46px rgba(24,49,45,.24);
  backdrop-filter: blur(12px);
}
#view-add .capture-save-state { display: flex; align-items: center; gap: 10px; }
#view-add .capture-save-state small { margin: 0; color: #dce7e3; font-size: 12px; }
#view-add .capture-save-state .text-button { margin-left: 8px; color: #fff; text-decoration: underline; text-underline-offset: 3px; }
#view-add .autosave-check { width: 25px; height: 25px; flex: 0 0 25px; display: grid; place-items: center; border-radius: 50%; background: #dceae1; color: #254f41; font-size: 13px; font-weight: 800; }
#view-add .capture-actions .primary { min-width: 190px; background: #f0a764; color: #18312d; }
#view-add .capture-actions .primary:hover { background: #f5b576; }

@media (max-width: 1050px) {
  #view-add .writing-assistant { grid-template-columns: 1fr 1fr; align-items: end; }
  #view-add .writing-assistant-copy { grid-column: 1 / -1; }
  #view-add .writing-assistant > .primary { max-width: none; }
}
@media (max-width: 760px) {
  #view-add .capture-intro { grid-template-columns: 1fr; gap: 28px; }
  #view-add .form-section { padding: 24px 20px; }
  #view-add .form-section-head,
  #view-add .activity-narrative .form-section-head { margin: -24px -20px 24px; padding: 18px 20px; align-items: flex-start; flex-direction: column; gap: 9px; }
  #view-add .form-section-head p,
  #view-add .activity-narrative .form-section-head p { margin-left: 54px; max-width: none; text-align: left; }
  #view-add .writing-assistant { grid-template-columns: 1fr; }
  #view-add .writing-assistant-copy,
  #view-add .writing-assistant-note { grid-column: auto; }
  #view-add .writing-assistant > .primary { width: 100%; max-width: none; }
  #view-add .note-assist { flex-direction: column; gap: 6px; }
  #view-add .note-assist > small { flex: 0 1 auto; width: 100%; }
  #view-add .note-assist .layout-character-guide { margin-top: 0; }
  #view-add .skills-editor { padding: 18px; }
  #view-add .capture-actions { bottom: 8px; align-items: stretch; flex-direction: column; }
  #view-add .capture-actions > div:last-child { display: block; }
  #view-add .capture-actions .primary { width: 100%; }
  #view-add .story-role-field { max-width: none; }
}

.design-story p { overflow-wrap: anywhere; }
@media (max-width: 520px) {
  #view-add .activity-editor { gap: 17px; margin-top: 30px; padding-bottom: 80px; }
  #view-add .capture-steps { grid-template-columns: 1fr; }
  #view-add .form-section-head h2,
  #view-add .activity-editor .form-section-head h2 { font-size: 24px; }
  #view-add .form-section-head p,
  #view-add .activity-narrative .form-section-head p { margin-left: 0; }
  #view-add .writing-assistant .language-options { grid-template-columns: 1fr; }
  #view-add .capture-save-state { flex-wrap: wrap; }
  #view-add .capture-save-state .text-button { margin-left: 35px; }
}