.admin-form { display:grid; gap:14px; margin:18px 0; }
.admin-form label { display:grid; gap:7px; font-size:13px; font-weight:600; }
.admin-form input, .admin-form select, .admin-form textarea { width:100%; min-width:0; padding:12px; border:1px solid #d6dbc8; border-radius:12px; background:#fffef9; color:#394632; font:inherit; font-size:16px; }
.admin-form textarea { min-height:120px; resize:vertical; max-height:240px; }
.admin-form .primary, .ai-ready .primary { justify-content:center; min-height:44px; width:100%; }
.login-intro { color:#697858; font-size:14px; }
.admin-label { display:inline-block; padding:5px 8px; border-radius:7px; background:#e8efdd; color:#536d40; font-size:10px; font-weight:650; }
.api-connection { margin:20px 0; padding:16px; border:1px solid #dfe4d4; border-radius:14px; background:#f5f7ed; }
.api-connection > strong { font-size:14px; }
.question-feedback { font-size:12px; line-height:1.7; padding:10px 12px; border-radius:10px; background:#f0f2e7; color:#6d7861; margin:10px 0 0; }
.question-feedback[data-level=short] { color:#a33b34; background:#fbede8; }
.question-feedback[data-level=growing] { color:#9c570a; background:#fbf0dc; }
.question-feedback[data-level=enough] { color:#3c6b40; background:#eaf2e3; }
.test-controls { display:flex; justify-content:space-between; align-items:center; gap:8px; margin-top:5px; }
.test-controls button { font-size:10px; min-height:26px; }
.ai-ready { padding:20px 0; }
.ai-ready h1, .story-title { font-size:23px; font-weight:750; line-height:1.5; color:#3e5132; }
.ai-ready p, .story-intro { font-size:14px; line-height:1.9; }
.story-progress { border:1px solid #dce4cf; background:#f2f6e9; border-radius:18px; padding:22px 18px; text-align:center; }
.story-progress strong { display:block; font-size:15px; color:#4c623c; }
.story-progress p { font-size:12px; line-height:1.8; color:#78866b; }
.progress-orbit { display:inline-block; width:24px; height:24px; border:2px solid #dbe4cf; border-top-color:#6b8752; border-radius:50%; animation:ai-spin 1.2s linear infinite; margin-bottom:14px; }
@keyframes ai-spin { to {transform:rotate(360deg);} }
@media(prefers-reduced-motion:reduce) { .progress-orbit {animation:none;} }
.ai-meta { display:grid; gap:5px; padding:12px; margin:18px 0; border:1px dashed #cdd8be; border-radius:10px; font-size:10px; color:#7b896d; overflow-wrap:anywhere; }
.ai-meta small { font-size:9px; }
.story-tone { display:inline-block; font-size:11px; color:#64804b; background:#edf3e4; padding:5px 8px; border-radius:6px; }
.story-section .section-body { font-size:14px; line-height:1.95; }
.story-notes { border-top:1px dashed #dce2d1; margin-top:18px; padding-top:10px; }
.story-notes summary { font-size:11px; color:#7c8d6b; padding:5px 0; }
.story-notes p { font-size:12px; color:#69795c; }
.closing-note { padding:22px 18px; margin:20px 0; border-radius:16px; background:#e9efdf; }
.closing-note > span { font-size:11px; font-weight:700; color:#698551; }
.closing-note p { font-size:14px; line-height:1.9; color:#445839; }
.suggested-questions { display:grid; gap:8px; margin:20px 0; }
.suggested-questions button { text-align:left; padding:12px; border:1px solid #dce3d0; border-radius:12px; color:#5e744b; background:#fffdf5; font:inherit; font-size:12px; line-height:1.6; }
.followup-answer { padding:16px; border-radius:18px; background:#fffef9; border:1px solid #e0e5d6; margin-bottom:20px; }
.followup-answer p { font-size:14px; line-height:1.9; }
.followup-answer > small { font-size:9px; color:#8c987f; }
.test-history { margin-top:20px; padding-top:15px; border-top:1px solid #dce2d0; }
.test-history summary { font-size:12px; color:#7d8c6c; margin-bottom:10px; }
.test-history button { display:block; width:100%; margin:8px 0; font-size:12px; }
.error button { display:block; margin-top:10px; font-size:12px; }

.story-export { margin:16px 0 20px; padding:14px; border:1px solid #dce3d0; border-radius:12px; }
.story-export > span { display:block; font-size:12px; font-weight:650; margin-bottom:10px; }
.story-export > div { display:flex; gap:8px; flex-wrap:wrap; }
.story-export button, .story-export a { display:inline-flex; align-items:center; justify-content:center; min-height:40px; font:inherit; font-size:12px; padding:9px 13px; text-decoration:none; }
.story-export small { display:block; margin-top:10px; font-size:11px; line-height:1.7; color:#7b896d; }

/* Reading space belongs to the scroll panel; navigation alone remains fixed. */
#step-actions:empty { display:none; }
#question-title[tabindex="-1"]:focus { outline:none; }
#question-title.story-title { font-size:22px; line-height:1.45; word-break:keep-all; overflow-wrap:break-word; }
.story-section > summary { word-break:keep-all; overflow-wrap:break-word; }
/* Friends-and-family pilot: survey under a finished story, admin summary. */
.pilot-block { margin:28px 0 8px; padding:18px 16px; border:1px solid #dfe4d4; border-radius:14px; background:#f5f7ed; }
.pilot-block h2 { margin:0 0 6px; font-size:16px; color:#4f6140; }
.pilot-block summary { cursor:pointer; font-weight:650; color:#536d40; }
.pilot-survey { display:grid; gap:14px; margin-top:12px; }
.pilot-question { margin:0; padding:0; border:0; min-width:0; }
.pilot-question legend { padding:0; margin-bottom:8px; font-size:14px; line-height:1.6; color:#4a4337; }
.pilot-scale { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:6px; }
.pilot-scale label { position:relative; display:flex; flex-direction:column; align-items:center; gap:2px; padding:8px 2px; border:1px solid #d6dbc8; border-radius:10px; background:#fff; cursor:pointer; text-align:center; }
.pilot-scale input { position:absolute; inset:0; width:100%; height:100%; margin:0; opacity:0; pointer-events:none; }
.pilot-scale span { font-weight:700; font-size:15px; color:#536d40; }
.pilot-scale small { font-size:10px; line-height:1.3; color:#85745e; word-break:keep-all; }
.pilot-scale label:has(input:checked) { border-color:#6f8a55; background:#e8efdd; }
.pilot-scale label:has(input:focus-visible) { outline:2px solid #6f8a55; outline-offset:2px; }
.pilot-comment { display:grid; gap:6px; font-size:13px; line-height:1.6; color:#4a4337; }
.pilot-comment textarea { width:100%; min-width:0; padding:12px; border:1px solid #d6dbc8; border-radius:12px; background:#fff; font:inherit; }
.pilot-admin { margin:20px 0; padding:16px; border:1px solid #dfe4d4; border-radius:14px; background:#f5f7ed; }
.button-link { display:inline-flex; align-items:center; padding:8px 12px; border-radius:10px; text-decoration:none; }
.table-wrap { overflow-x:auto; }
.pilot-table { border-collapse:collapse; width:100%; font-size:12px; }
.pilot-table th, .pilot-table td { border-bottom:1px solid #e2e5d8; padding:6px; text-align:left; vertical-align:top; }
.pilot-comments { padding-left:18px; font-size:13px; line-height:1.7; }

/* Waiting bar (3.21.0) */
.progress-track { height:10px; margin:16px 4px 6px; background:#e3ead8; border-radius:999px; overflow:hidden; }
.progress-track span { display:block; height:100%; width:0; background:linear-gradient(90deg,#8fae6f,#5f7f45); border-radius:inherit; transition:width .5s ease; }
.story-progress .progress-pct { margin:0; font-size:13px; font-weight:700; color:#536d40; }
.story-progress .progress-line { min-height:1.8em; margin:6px 0 14px; font-size:13px; color:#6b7a5d; }
.progress-actions { display:flex; flex-wrap:wrap; gap:10px; justify-content:center; align-items:center; }
#luck-panel { margin-top:18px; }
@media(prefers-reduced-motion:reduce) { .progress-track span { transition:none; } }