/* Conversation with Lulla: the corrected user-supplied reference, real controls. */
body.world-creator {
  --conversation-art: url("/assets/creator-conversation-reference.png");
  --conversation-paper: #fcf8f0;
  color: #34433d;
  background: #fbf8f3;
}
.world-creator .creator-section { padding: 12px 22px 32px; }
.world-creator .creator-builder-shell { max-width: 1510px; }
.world-creator .creator-builder-shell-heading {
  position: absolute; width: 1px; height: 1px; min-height: 0;
  padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%);
}
.world-creator .creator-stepper { max-width: 580px; margin: 0 auto 10px 0; padding: 0; border: 0; gap: 6px; }
.world-creator .creator-stepper button, .world-creator .creator-stepper-future { min-height: 35px; padding: 3px 8px; font-size: 11px; gap: 6px; background: transparent; }
.world-creator .creator-stepper button > span, .world-creator .creator-stepper-future > span { width: 22px; height: 22px; background: #eee3c9; }
.world-creator .creator-stepper button[aria-current="step"] { background: #eff0e5; border-color: #c7cbb6; }
.world-creator .creator-wizard-layout { grid-template-columns: minmax(0, 1fr); gap: 35px; }
.world-creator .creator-panel { padding: 0; background: none; border: 0; box-shadow: none; border-radius: 0; }
.world-creator .creator-step { min-width: 0; gap: 0; }
.world-creator [hidden] { display: none !important; }
.world-creator .creator-story-toolbar { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 34px; align-items: end; margin-bottom: 0; }
.world-creator .brief-mode-switch { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; margin: 0; border: 1px solid #d9c9b5; border-bottom: 0; border-radius: 18px 18px 0 0; overflow: hidden; background: #faf4e9; }
.world-creator .brief-mode-switch button {
  display: grid; grid-template-columns: 32px auto; justify-content: center; align-content: center; column-gap: 12px;
  min-height: 72px; padding: 13px 10px; font: 16px/1.3 "Trebuchet MS", sans-serif;
  font-weight: 400; background: transparent; color: #33423d; border: 1px solid transparent; border-radius: 16px;
}
.world-creator .brief-mode-switch button::before { content: ""; grid-column: 1; grid-row: 1 / 3; align-self: center; width: 32px; height: 34px; background: var(--conversation-art) -111px -111px / 1536px 1024px; mask-image: radial-gradient(ellipse, #000 42%, transparent 76%); }
.world-creator .brief-mode-switch button[data-brief-mode="guided"]::before { background-position: -386px -110px; }
.world-creator .brief-mode-switch button[data-brief-mode="page_by_page"]::before { background-position: -644px -111px; }
.world-creator .brief-mode-switch button > span, .world-creator .brief-mode-switch button > small { grid-column: 2; }
.world-creator .brief-mode-switch button small { font-size: 12px; margin-top: 4px; opacity: 1; font-weight: 400; }
.world-creator .brief-mode-switch button.active { background: linear-gradient(#fceacc, #fff8ec); color: #344039; border-color: #e1b679; }
.world-creator .brief-mode-switch button:hover { background: #f8edda; }
.world-creator .creator-story-setup { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; margin: 0 0 14px; }
.world-creator .creator-story-setup > .field-group { grid-column: 2; grid-row: 1; }
.world-creator .creator-story-setup > .creator-title-setup { display: none; }
.world-creator .creator-story-setup { grid-template-columns: minmax(0, 1fr); }
.world-creator .creator-length-first { grid-column: 1; grid-row: 1; display: block; padding: 0; border: 0; border-radius: 0; background: none; }
.world-creator .creator-length-heading { display: block; margin-bottom: 9px; }
.world-creator .creator-length-heading h4 { margin: 0; font: 14px/1.5 "Trebuchet MS", sans-serif; letter-spacing: 0; }
.world-creator .creator-length-heading p { display: none; }
.world-creator .package-card-grid { gap: 7px; }
.world-creator .package-card { position: relative; min-height: 52px; padding: 8px 3px; gap: 3px; border: 1px solid #dfceba; border-radius: 11px; background: #fbf6ef; box-shadow: none; }
.world-creator .package-card span { padding: 0; }
.world-creator .package-card strong { font: 13px/1.3 "Trebuchet MS", sans-serif; white-space: nowrap; }
.world-creator .package-card small { display: none; }
.world-creator .package-card b { font: 10px/1.3 "Trebuchet MS", sans-serif; color: #77674f; }
.world-creator .package-card input { position: absolute; width: 1px; height: 1px; padding: 0; opacity: 0; }
.world-creator .package-card:has(input:checked) { background: #f7d898; border-color: #c99647; transform: none; box-shadow: inset 0 0 0 1px #ffeac0; }
.world-creator .package-card:has(input:focus-visible) { outline: 3px solid #71824f; outline-offset: 3px; }
.world-creator .creator-panel label { color: #33413b; font-size: 14px; font-weight: 400; }
.world-creator .creator-panel input:not([type="checkbox"]):not([type="radio"]),
.world-creator .creator-panel textarea, .world-creator .creator-panel select {
  color: #344039; font-size: 16px; font-weight: 400; background: #fffbf5; border-color: #d9cbb8; border-radius: 10px;
}
.world-creator .creator-panel input:not([type="checkbox"]):not([type="radio"]) { min-height: 44px; padding: 9px 12px; }
.world-creator .creator-panel .ai-choice { font-size: 12px !important; line-height: 1.4; color: #4c574e !important; font-weight: 400 !important; gap: 8px; }
.world-creator .creator-panel input[type="checkbox"] { width: 17px; height: 17px; min-height: 17px; flex-shrink: 0; accent-color: #718154; }
.world-creator .creator-panel :is(input, textarea, select, button):focus-visible { outline: 3px solid #82905c; outline-offset: 3px; }

.story-conversation-layout { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 15px; align-items: start; }
.story-conversation { position: relative; min-width: 0; padding: 22px 30px; border: 1px solid #e5d7c6; border-radius: 0 18px 18px 18px; background: radial-gradient(ellipse at 20% 60%, #fffdf7, transparent 75%), #fcf9f4; }
.conversation-promise { display: flex; align-items: center; gap: 10px; margin: 0 0 16px; font: 13px/1.5 "Trebuchet MS", sans-serif; }
.conversation-promise > span { font: 28px/1 Georgia, serif; color: #cf9b4e; }
.conversation-guide { display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: 22px; align-items: center; min-height: 240px; padding: 0 9% 0 20px; }
.world-creator .lulla-question {
  position: relative; isolation: isolate; display: flex; flex-direction: column; justify-content: center; min-height: 175px;
  gap: 12px; padding: 27px 35px; background: #fff9ee; border: 1px solid #e0c8a7;
  border-radius: 48px 42px 50px 38px; box-shadow: 0 5px 7px #75613b13;
}
.world-creator .lulla-question::after { display: none; }
.world-creator .lulla-question::before { content: ""; position: absolute; left: -13px; top: 50%; width: 24px; height: 24px; background: #fff9ee; border-left: 1px solid #e0c8a7; border-bottom: 1px solid #e0c8a7; transform: rotate(35deg); border-radius: 0 0 0 12px; z-index: -1; }
.world-creator .lulla-question h3 { padding: 0; margin: 0; color: #34423b; font: 28px/1.22 Georgia, serif; letter-spacing: 0; }
.world-creator .lulla-question p { margin: 0; max-width: 420px; color: #656459; font: 16px/1.55 "Trebuchet MS", sans-serif; }
.conversation-answer { display: flex; justify-content: space-between; gap: 18px; align-items: end; width: 65%; margin: -6px 9% 25px auto; padding: 16px 22px; border: 1px solid #cfdce0; background: #edf1f3; border-radius: 22px 20px 25px 18px; box-shadow: 0 3px 5px #344c5110; }
.conversation-answer > div { min-width: 0; }
.conversation-answer > div > span { color: #466279; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; }
.conversation-answer p { margin: 7px 0 0; color: #394744; font-size: 15px; line-height: 1.5; white-space: pre-wrap; overflow-wrap: anywhere; max-height: 120px; overflow-y: auto; }
.conversation-answer button { border: 0; border-radius: 8px; padding: 8px; color: #455b63; font-size: 12px; background: transparent; }
.conversation-answer button:hover { background: #dce6e9; }
.conversation-composer {
  position: relative; margin: 22px 4% 20px; padding: 22px 28px 18px; min-width: 0;
  background: #fffbf4; border: 1px solid #c5a87d; border-radius: 23px;
  box-shadow: inset 0 0 0 5px #f7edde, inset 0 0 0 6px #ecdbc2, 0 5px 7px #7c633018;
}
.conversation-composer::before { content: ""; position: absolute; left: -13px; top: 28px; width: 34px; height: 83px; background: var(--conversation-art) -58px -516px / 1229px 819px; mask-image: radial-gradient(ellipse, #000 45%, transparent 74%); pointer-events: none; }
.world-creator .guided-brief-grid { display: block; }
.world-creator [data-storybook-mode="guided"] .conversation-question-field > label,
.world-creator .conversation-free-writing > label { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); }
.world-creator .conversation-question-field { display: block; }
.world-creator .conversation-composer textarea {
  width: 100%; min-height: 158px; padding: 10px 10px 14px; color: #3d493f; background: transparent; border: 0; border-radius: 9px;
  font: 19px/1.7 Georgia, serif; resize: vertical;
}
.world-creator .conversation-composer textarea::placeholder { color: #737861; opacity: 1; font-style: italic; }
.world-creator .conversation-composer textarea:disabled { color: #6c755b; background: #f2f2e880; }
.conversation-field-footer { display: flex; justify-content: space-between; align-items: center; gap: 12px; min-height: 30px; padding: 10px 10px 0; }
.conversation-count { color: #827965; font-size: 12px; white-space: nowrap; }
.conversation-error { margin: 10px 10px 0; color: #a04433 !important; font-size: 13px; line-height: 1.5; }
.conversation-error:empty { display: none; }
.world-creator .conversation-composer textarea[aria-invalid="true"] { outline: 2px solid #ad5c44; outline-offset: 2px; }
.world-creator .conversation-free-writing .field-help { color: #79725f; font-size: 13px; font-weight: 400; }
.conversation-free-details { margin: 0 4% 25px; padding: 14px 18px; border: 1px solid #e0d0b8; border-radius: 15px; background: #fdf7ec; }
.conversation-free-details summary { cursor: pointer; font: 15px/1.5 Georgia, serif; }
.conversation-free-details summary > span { margin-left: 8px; color: #7b7968; font: 12px "Trebuchet MS", sans-serif; }
.conversation-free-details [data-free-detail-fields] { display: grid; gap: 18px; margin-top: 20px; }
.world-creator .conversation-free-details .conversation-field-footer { display: none; }
.world-creator .conversation-free-details textarea { min-height: 90px; margin-top: 8px; }
.conversation-navigation { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 18px; min-height: 78px; margin-top: 22px; padding-right: 63px; }
.conversation-back { display: inline-flex; align-items: center; gap: 10px; padding: 12px 20px; min-height: 44px; color: #445046; background: #fcf9f4; border: 1px solid #ddcdb9; border-radius: 28px; }
.conversation-back:disabled { opacity: .5; cursor: default; }
.conversation-navigation p { margin: 0; color: #7b7c6b; font: italic 13px/1.4 Georgia, serif; }
.world-creator .conversation-navigation .creator-button,
.world-creator .conversation-direct-actions .creator-button {
  flex: 0 0 auto; width: auto;
  min-height: 52px; padding: 14px 28px; border: 1px solid #dda853; border-radius: 30px; color: #514424;
  background: linear-gradient(115deg, #f7d590, #efc472); box-shadow: inset 0 0 0 1px #fff3d660; font: 19px/1.3 Georgia, serif; white-space: nowrap;
}
.world-creator .conversation-navigation .creator-button:hover,
.world-creator .conversation-direct-actions .creator-button:hover { background: #f3ca7b; }
.world-creator .conversation-direct-actions { padding: 0 4%; margin-top: 22px; }
.conversation-sidebar { position: sticky; top: 76px; min-width: 0; display: grid; gap: 14px; }
.conversation-plan, .conversation-summary { position: relative; padding: 22px 17px; border: 1px solid #e6d7c1; border-radius: 15px; background: #fff9ee; box-shadow: 0 3px 8px #9d7e3510; overflow: hidden; }
.world-creator .conversation-sidebar h4 { position: relative; z-index: 1; font: italic 24px/1.25 Georgia, serif; margin: 0 10px 20px; letter-spacing: 0; }
.conversation-plan ol { position: relative; z-index: 1; margin: 0; padding: 0; list-style: none; }
.conversation-plan ol::before { content: ""; position: absolute; top: 30px; bottom: 43px; left: 26px; border-left: 1px dashed #b6b3a3; }
.conversation-plan li { position: relative; }
.conversation-plan button { display: flex; align-items: start; gap: 13px; width: 100%; min-height: 76px; padding: 12px; text-align: left; color: #3d483e; border: 1px solid transparent; border-radius: 15px; background: transparent; }
.conversation-plan button[aria-current="step"] { background: #eeeedf; border-color: #d1c79a; }
.conversation-plan button:hover { background: #f2edde; }
.conversation-plan button > b { position: relative; flex: 0 0 29px; height: 29px; display: grid; place-items: center; background: #a4a498; color: #fffef7; font-size: 14px; font-weight: 400; border-radius: 50%; }
.conversation-plan button[aria-current="step"] > b { background: #748658; }
.conversation-plan button > span { min-width: 0; }
.conversation-plan strong { display: block; font: 18px/1.3 Georgia, serif; }
.conversation-plan small { display: block; margin-top: 3px; color: #726f62; font: 12px/1.5 "Trebuchet MS", sans-serif; }
.question-done { margin-left: auto; color: #6a7b50; font-size: 14px; }
.conversation-plan { padding-bottom: 32px; }
.conversation-summary { padding: 20px 22px 110px; }
.conversation-summary h4 > span { display: inline-block; width: 37px; height: 30px; vertical-align: middle; font-size: 0; margin-right: 8px; background: var(--conversation-art) -805px -487px / 1075px 717px; mask-image: radial-gradient(ellipse, #000 55%, transparent 78%); }
.conversation-summary dl { margin: 25px 0 18px; }
.conversation-summary dl > div { display: flex; align-items: baseline; gap: 13px; margin: 12px 0; font-size: 13px; }
.conversation-summary dt { flex-shrink: 0; color: #4d5348; }
.conversation-summary dd { margin: 0; color: #77715f; overflow-wrap: anywhere; }
.conversation-summary [data-story-summary-length] { padding: 5px 12px; border: 1px solid #e8d5b4; border-radius: 20px; background: #fff0d9; }
.conversation-discovered { margin: 0 0 10px; padding-top: 16px; border-top: 1px solid #ddceb5; font-size: 13px; }
.conversation-discovered > span { color: #c97e54; font-size: 21px; vertical-align: middle; margin-right: 8px; }
[data-story-summary-content] { position: relative; z-index: 1; max-height: 260px; overflow-y: auto; }
[data-story-summary-content] p { margin: 0 0 12px; color: #7a7567; font-size: 13px; line-height: 1.55; overflow-wrap: anywhere; white-space: pre-wrap; }
[data-story-summary-content] strong { display: block; margin-bottom: 3px; font-size: 12px; font-weight: 400; color: #556148; }

/* Display windows reuse the supplied character art unchanged. */
.conversation-art { --art-scale: .8; position: absolute; display: block; background-image: var(--conversation-art); background-size: calc(1536px * var(--art-scale)) calc(1024px * var(--art-scale)); background-repeat: no-repeat; pointer-events: none; mask-image: radial-gradient(ellipse at center, #000 58%, transparent 75%); }
.conversation-lulla { --art-scale: .9; position: relative; width: 172px; height: 234px; background-position: calc(-83px * var(--art-scale)) calc(-265px * var(--art-scale)); }
.conversation-flowers { --art-scale: .8; width: 50px; height: 80px; left: -30px; bottom: 0; background-position: calc(-43px * var(--art-scale)) calc(-777px * var(--art-scale)); }
.conversation-mushroom { --art-scale: .8; width: 65px; height: 64px; right: -22px; bottom: -6px; background-position: calc(-919px * var(--art-scale)) calc(-804px * var(--art-scale)); }
.conversation-bird { --art-scale: .85; width: 59px; height: 55px; right: 0; bottom: 8px; background-position: calc(-995px * var(--art-scale)) calc(-916px * var(--art-scale)); }
.conversation-plan-leaves { --art-scale: .65; width: 75px; height: 50px; top: 0; right: 0; background-position: calc(-1408px * var(--art-scale)) calc(-164px * var(--art-scale)); }
.conversation-plan-mushroom { --art-scale: .55; width: 56px; height: 93px; bottom: 0; right: 0; background-position: calc(-1414px * var(--art-scale)) calc(-497px * var(--art-scale)); }
.conversation-summary-bunny { --art-scale: .7; width: 91px; height: 101px; right: 12px; bottom: 8px; background-position: calc(-1404px * var(--art-scale)) calc(-835px * var(--art-scale)); }

.world-creator .page-by-page-creator { padding: 22px; background: #fffaf1; border-color: #dac8aa; border-radius: 18px; }
.world-creator .page-by-page-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.world-creator .page-by-page-card { min-width: 0; background: #fffcf6; padding: 18px; border-color: #e1cfb3; border-radius: 14px; }
.storyboard-title-workshop { display: grid; grid-template-columns: minmax(220px, .8fr) minmax(280px, 1.2fr); gap: 18px 28px; align-items: end; margin: 22px 0; padding: 24px; background: linear-gradient(135deg, #fff8e9, #f7eedc); border: 1px solid #d9c6a8; border-radius: 20px; }
.storyboard-title-workshop > div:first-child span { color: #ae7650; font-size: 11px; letter-spacing: .11em; text-transform: uppercase; }
.storyboard-title-workshop h4 { margin: 5px 0 8px; font: 25px/1.25 Georgia, serif; color: #405044; }
.storyboard-title-workshop p { margin: 0; color: #706d61; font-size: 13px; }
.storyboard-title-workshop label { font-weight: 600; }
.world-creator .storyboard-title-workshop input { width: 100%; min-height: 54px; margin-top: 7px; padding: 12px 15px; background: #fffdf8; border: 1px solid #cdbb9e; border-radius: 12px; font: 21px/1.4 Georgia, serif; }
.storyboard-title-suggestions { grid-column: 1 / -1; padding-top: 17px; border-top: 1px solid #dcccb4; }
.storyboard-title-suggestions > strong { display: block; margin-bottom: 10px; font: 16px Georgia, serif; }
.storyboard-title-suggestions > div { display: flex; flex-wrap: wrap; gap: 9px; }
.storyboard-title-suggestions button { padding: 10px 14px; color: #4d5d4d; background: #fffbf3; border: 1px solid #d9c7ab; border-radius: 999px; font: 14px/1.35 Georgia, serif; }
.storyboard-title-suggestions button:hover, .storyboard-title-suggestions button[aria-pressed="true"] { color: #473d24; background: #f5d89c; border-color: #c89b50; }
.storyboard-title-workshop [data-preview-title-status] { grid-column: 1 / -1; }
.story-conversation-layout[data-storybook-mode="page_by_page"] { grid-template-columns: minmax(0, 1fr); }
[data-storybook-mode="page_by_page"] .conversation-guide { display: none; }
[data-storybook-mode="page_by_page"] .conversation-sidebar { position: static; }
[data-storybook-mode="page_by_page"] .conversation-summary { padding-bottom: 28px; padding-right: 130px; }
.world-creator .page-by-page-tabs { display: flex; flex-wrap: wrap; gap: 7px; margin: 20px 0 0; padding: 0 0 14px; border-bottom: 1px solid #ddceb5; }
.page-by-page-tabs button { min-height: 46px; padding: 11px 17px; background: #f7efdf; border: 1px solid #ddceb5; border-radius: 13px 13px 5px 5px; color: #556148; font: 15px Georgia, serif; }
.page-by-page-tabs button[aria-selected="true"] { background: #f5d597; border-color: #cba05e; color: #463f29; box-shadow: inset 0 -3px #bc8a45; }
.page-by-page-tabs button[data-complete="true"]::after { content: " ✓"; color: #5a734e; }
.world-creator .page-by-page-list { display: block; padding: 0; margin: 0; }
.world-creator .page-by-page-card { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 20px; padding: 26px; }
.world-creator .page-by-page-card-heading { grid-column: 1 / -1; }
.world-creator .page-by-page-card label, .world-creator .page-by-page-guides label { min-width: 0; }
.world-creator .page-by-page-card textarea, .world-creator .page-by-page-guides textarea { min-height: 280px; padding: 20px; font: 19px/1.65 Georgia, serif; resize: vertical; background: #fffdf7; }
.world-creator .page-by-page-guides { margin: 20px 0 0; }
.page-plan-navigation { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 20px; }
.page-plan-navigation > span { font: 14px Georgia, serif; color: #706d5e; text-align: center; }
.page-plan-count { font-size: 12px; font-weight: 400; color: #7a7567; }
.world-creator .creator-step:not([data-creator-step="1"]) { gap: 24px; padding: clamp(22px, 4vw, 44px); border: 1px solid #e1cfb5; border-radius: 18px; background: #fffaf2; }
.world-creator .creator-step:not([data-creator-step="1"]) .workflow-heading h3 { font-size: 29px; line-height: 1.25; }
.world-creator .creator-status { margin: 18px 0 0; }
.world-creator .creator-journey-card { position: static; display: grid; grid-template-columns: 1fr 1fr; max-width: 1050px; margin: 0 auto; gap: 16px 45px; }
.world-creator .creator-world-invitation { grid-column: 1; grid-row: 1 / 5; display: grid; align-content: center; }
.world-creator .creator-world-portrait { height: 170px; }
.world-creator .creator-world-friends { justify-content: flex-start; }
.world-creator .creator-world-closing { max-height: 230px; margin-top: 20px; }

@media (max-width: 1200px) {
  .world-creator .brief-mode-switch button { display: block; }
  .world-creator .brief-mode-switch button::before { display: none; }
  .world-creator .creator-story-toolbar { grid-template-columns: 1fr 1fr; gap: 20px; }
  .world-creator .creator-story-setup { gap: 12px; }
  .story-conversation-layout { grid-template-columns: minmax(0, 1fr) 295px; }
  .story-conversation { padding: 20px; }
  .conversation-guide { grid-template-columns: 128px minmax(0, 1fr); gap: 16px; padding: 0; min-height: 220px; }
  .conversation-lulla { --art-scale: .68; width: 130px; height: 180px; }
  .world-creator .lulla-question { padding: 24px; }
  .world-creator .lulla-question h3 { font-size: 25px; }
  .conversation-navigation p { display: none; }
  .conversation-plan button { padding: 10px 8px; gap: 9px; }
  .conversation-plan ol::before { left: 22px; }
  .conversation-composer { margin-left: 2%; margin-right: 2%; padding: 20px; }
  .conversation-answer { width: 78%; margin-right: 0; }
}
@media (max-width: 900px) {
  .world-creator .creator-section { padding-left: 14px; padding-right: 14px; }
  .world-creator .creator-story-toolbar { display: flex; flex-direction: column-reverse; align-items: stretch; gap: 8px; }
  .world-creator .creator-story-setup { max-width: 650px; width: 100%; margin: 0 0 6px auto; gap: 22px; }
  .world-creator .brief-mode-switch { max-width: none; width: 100%; }
  .story-conversation-layout { grid-template-columns: minmax(0, 1fr); }
  .conversation-sidebar { position: static; grid-template-columns: 1fr 1fr; }
  .story-conversation { border-top-left-radius: 0; border-top-right-radius: 0; }
  .conversation-guide { grid-template-columns: 155px minmax(0, 1fr); max-width: 680px; margin: auto; }
  .conversation-lulla { --art-scale: .8; width: 155px; height: 210px; }
  .conversation-navigation p { display: block; }
  .conversation-sidebar:has([data-conversation-plan][hidden]) { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .world-creator .creator-section { padding: 10px 8px 28px; }
  .world-creator .creator-stepper { gap: 1px; margin-bottom: 14px; }
  .world-creator .creator-stepper button, .world-creator .creator-stepper-future { padding: 4px 2px; font-size: 10px; }
  .world-creator .creator-story-setup { gap: 12px; }
  .world-creator .creator-story-setup > .field-group { grid-column: 1 / -1; grid-row: 2; }
  .world-creator .creator-length-first { grid-column: 1 / -1; }
  .world-creator .package-card { min-height: 44px; }
  .world-creator .package-card-grid { gap: 10px; }
  .world-creator .creator-story-setup .field-group { gap: 6px; }
  .world-creator .brief-mode-switch button { min-height: 72px; font-size: 14px; padding: 10px 6px; }
  .world-creator .brief-mode-switch button small { font-size: 10px; line-height: 1.4; }
  .story-conversation { padding: 18px 13px; }
  .conversation-promise { font-size: 11px; gap: 5px; margin-bottom: 12px; }
  .conversation-guide { grid-template-columns: 82px minmax(0, 1fr); gap: 9px; min-height: 180px; }
  .conversation-lulla { --art-scale: .44; width: 84px; height: 119px; }
  .world-creator .lulla-question { min-height: 155px; padding: 17px 18px; border-radius: 26px; gap: 9px; }
  .world-creator .lulla-question h3 { font-size: 22px; }
  .world-creator .lulla-question p { font-size: 13px; line-height: 1.5; }
  .conversation-answer { width: 89%; margin-top: 5px; margin-bottom: 16px; padding: 13px 15px; gap: 8px; }
  .conversation-answer p { font-size: 13px; }
  .conversation-composer { margin: 15px 5px; padding: 16px 16px 12px; }
  .world-creator .conversation-composer textarea { min-height: 190px; font-size: 18px; padding: 6px; }
  .conversation-field-footer { padding-left: 3px; padding-right: 3px; gap: 5px; }
  .world-creator .conversation-field-footer .ai-choice { font-size: 11px !important; }
  .conversation-count { font-size: 10px; }
  .conversation-flowers { --art-scale: .5; width: 30px; height: 50px; left: -17px; }
  .conversation-mushroom { --art-scale: .5; width: 42px; height: 41px; right: -14px; }
  .conversation-navigation { gap: 8px; padding-right: 0; }
  .conversation-navigation p, .conversation-bird { display: none; }
  .conversation-back { padding: 10px 15px; font-size: 13px; }
  .world-creator .conversation-navigation .creator-button { font-size: 17px; padding: 13px 20px; }
  .conversation-sidebar { grid-template-columns: 1fr; }
  .conversation-plan { order: 0; }
  .conversation-summary { order: 1; }
  .world-creator .page-by-page-list, .world-creator .page-by-page-guides { grid-template-columns: 1fr; }
  .world-creator .page-by-page-creator { padding: 14px; }
  .storyboard-title-workshop { grid-template-columns: minmax(0, 1fr); padding: 18px; }
  .storyboard-title-suggestions { grid-column: 1; }
  .storyboard-title-workshop [data-preview-title-status] { grid-column: 1; }
  .world-creator .page-by-page-card { grid-template-columns: minmax(0, 1fr); padding: 16px; }
  .world-creator .page-by-page-card textarea, .world-creator .page-by-page-guides textarea { min-height: 240px; padding: 14px; font-size: 18px; }
  .page-by-page-tabs button { padding: 10px 12px; font-size: 14px; }
  .page-plan-navigation { gap: 6px; }
  .page-plan-navigation > span { font-size: 12px; }
  [data-storybook-mode="page_by_page"] .conversation-summary { padding-right: 22px; padding-bottom: 110px; }
  .world-creator .creator-journey-card { grid-template-columns: 1fr; padding: 0 14px; }
  .world-creator .creator-world-invitation { grid-row: auto; }
  .world-creator .creator-world-friends { justify-content: center; }
}