/* The speaking lobby is a playful stage; the five-error game keeps its styles. */
body.is-composing {
  background-color:#fff9ef;
  background-image:radial-gradient(circle at 5% 22%,#ffe2a5 0, #ffe2a5 7%,transparent 7.1%),radial-gradient(circle at 97% 76%,#e0d7ff 0,#e0d7ff 10%,transparent 10.1%),radial-gradient(#cec4e650 1.2px,transparent 1.2px);
  background-size:auto,auto,24px 24px;
}
.is-composing .correction-app {width:min(1840px,calc(100% - 40px));padding-bottom:16px;}
.is-composing .topbar {min-height:46px;border:0;font-size:17px;padding:0 6px;}
.is-composing .intro,.is-composing .essay-teacher {display:none;}
.is-composing .lesson-layout {display:block;}
.is-composing .lesson-main {max-width:none;margin:0;}
.spoken-playground {display:none;}
.is-composing .spoken-playground {display:grid;grid-template-columns:minmax(0,1fr);gap:22px;align-items:start;margin:2px auto 24px;}
.is-composing .spoken-playground.has-scene-art {grid-template-columns:clamp(130px,10.5vw,210px) minmax(0,1fr) clamp(130px,10.5vw,210px);}
.spoken-chat {
  --chat-tint:#f0eaff;--chat-tint-border:#c7b3f1;--chat-green:#286957;--chat-outline:#5b4b79;
  --chat-cream:#fff0b6;--chat-blue:#e9f5ff;--chat-pink:#ffe6f0;--chat-paper:#fffefb;
  --chat-ink:#302b47;--chat-muted:#655c76;--blue:#6542ca;
  color:var(--chat-ink);background:var(--chat-paper);border:3px solid var(--chat-outline);border-radius:30px;
  box-shadow:0 7px 0 #d4bfe7,0 15px 30px #5b4b7912;overflow:hidden;min-width:0;
}
.spoken-chat-head {display:flex;align-items:center;justify-content:space-between;gap:16px;padding:17px 28px;background:var(--chat-cream);border-bottom:3px solid var(--chat-outline);}
.spoken-chat-head>div {display:flex;align-items:center;gap:15px;min-width:0;}
.spoken-chat h1 {font-family:inherit;font-size:32px;line-height:1.2;font-weight:850;margin:0;letter-spacing:.01em;}
.spoken-chat h1 span {display:block;font-size:16px;line-height:1.5;font-weight:500;margin-top:5px;color:var(--chat-muted);}
.spoken-party-mark {width:44px;height:44px;flex:none;transform:rotate(-12deg);}
.spoken-party-mark svg {width:100%;height:100%;fill:#ffafba;stroke:var(--chat-outline);stroke-width:2;stroke-linejoin:round;}
.spoken-chat-badge {font-size:19px;font-weight:750;line-height:1.4;color:var(--chat-ink);white-space:nowrap;border:2px dashed var(--chat-outline);background:var(--chat-paper);padding:9px 14px;border-radius:15px;transform:rotate(3deg);}
.spoken-chat-thread {padding:26px 28px 6px;}
.spoken-message {display:flex;gap:24px;align-items:flex-start;min-width:0;}
.spoken-message-body {min-width:0;flex:1;}
.spoken-chat-avatar {width:126px;height:132px;object-fit:contain;flex:none;margin-top:20px;transform:scale(1.55);filter:drop-shadow(0 7px 0 #cebbdf50);}
.spoken-speaker {display:block;font-size:16px;font-weight:650;color:var(--chat-muted);margin:0 0 8px;line-height:1.5;}
.spoken-bubble {border:2.5px solid var(--chat-outline);padding:21px 24px;border-radius:25px;line-height:1.7;overflow-wrap:anywhere;box-shadow:0 4px 0 #d3c3e1;}
.spoken-bubble-bot {border-top-left-radius:7px;background:var(--chat-blue);}
.spoken-bubble p {margin:0;}
#spokenInvitation {font-size:27px;line-height:1.6;font-weight:600;}
.spoken-bubble .spoken-bubble-note {font-size:18px;color:var(--chat-muted);margin-top:12px;line-height:1.65;}
.spoken-bot-tools {display:flex;align-items:flex-start;gap:14px;flex-wrap:wrap;margin-top:12px;}
.spoken-text-button {border:2px solid var(--chat-outline);display:inline-flex;align-items:center;gap:8px;font-size:18px;font-weight:650;color:var(--chat-ink);background:var(--chat-cream);padding:8px 14px;min-height:46px;border-radius:15px;box-shadow:0 3px 0 #dcc58b;}
.spoken-text-button:hover {border-color:var(--blue);background:var(--chat-pink);}
.spoken-text-button svg,.spoken-mic-icon {width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.spoken-task-options {font-size:16px;color:var(--chat-muted);min-width:0;}
.spoken-task-options summary {cursor:pointer;min-height:46px;display:flex;align-items:center;padding:8px;}
.spoken-task-options[open] {flex-basis:100%;}.spoken-task-options[open] summary {padding-left:0;}
.spoken-task-options label {display:block;font-size:16px;margin:0 0 8px;}
#spokenTask {width:100%;box-sizing:border-box;border:2px solid var(--chat-outline);background:var(--chat-paper);color:var(--chat-ink);font:inherit;line-height:1.6;padding:14px;border-radius:14px;resize:vertical;}
.spoken-hint-bubble {padding:18px 20px;border:2px dashed var(--chat-outline);background:var(--chat-cream);border-radius:10px 22px 22px 22px;margin-top:14px;font-size:18px;animation:spoken-appear 180ms ease-out;}
.spoken-hint-bubble p {margin:0 0 12px;}.spoken-hint-bubble small {color:var(--chat-muted);font-size:15px;}
.spoken-keyword-chips {display:flex;gap:10px;flex-wrap:wrap;list-style:none;padding:0;margin:0 0 12px;}
.spoken-keyword-chips li {border-radius:12px;padding:7px 13px;background:var(--chat-paper);border:2px solid var(--chat-outline);font-size:19px;font-weight:600;line-height:1.4;box-shadow:0 3px 0 #e8c878;}
.spoken-keyword-chips li:nth-child(3n+2) {background:var(--chat-pink);}.spoken-keyword-chips li:nth-child(3n) {background:var(--chat-blue);}
.spoken-message-user {margin:22px 0 0;padding-left:150px;gap:14px;}.spoken-message-user .spoken-speaker {text-align:right;}
.spoken-bubble-user {background:var(--chat-tint);border-top-right-radius:7px;padding:19px 22px 14px;}
.spoken-user-avatar {width:42px;height:42px;border-radius:16px;font-size:18px;font-weight:750;display:grid;place-items:center;background:var(--chat-pink);border:2px solid var(--chat-outline);margin-top:32px;flex:none;transform:rotate(6deg);}
#spokenDraft {display:block;width:100%;box-sizing:border-box;padding:0;min-height:136px;max-height:300px;resize:none;border:0;border-radius:0;background:transparent;color:var(--chat-ink);font:24px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;overflow-y:auto;}
#spokenDraft::placeholder {color:var(--chat-muted);font-size:21px;line-height:1.7;}
#spokenDraft:focus-visible {outline:3px solid var(--blue);outline-offset:7px;border-radius:6px;}
.spoken-draft-meta {display:flex;justify-content:flex-end;align-items:center;gap:12px;font-size:16px;color:var(--chat-muted);margin-top:10px;min-height:24px;}
#spokenCount {font-size:17px;font-weight:750;font-variant-numeric:tabular-nums;background:var(--chat-paper);border-radius:10px;padding:3px 10px;}
#spokenListening {display:inline-flex;align-items:center;gap:8px;color:var(--chat-green);}
#spokenListening i {height:8px;width:8px;border-radius:50%;background:currentColor;animation:spoken-listening 1.2s ease-in-out infinite;}
.spoken-chat-progress {display:block;width:100%;height:8px;accent-color:var(--blue);margin-top:10px;border:0;border-radius:12px;}
.spoken-chat-status {min-height:32px;margin:14px 56px 0 150px;display:flex;gap:10px;align-items:flex-start;}
#spokenStatus {font-size:17px;line-height:1.65;margin:0;color:var(--chat-muted);overflow-wrap:anywhere;}
.spoken-typing {display:inline-flex;gap:4px;margin-top:10px;}.spoken-typing i {width:6px;height:6px;background:var(--blue);border-radius:50%;animation:spoken-listening 1s infinite;}
.spoken-typing i:nth-child(2) {animation-delay:150ms;}.spoken-typing i:nth-child(3) {animation-delay:300ms;}
.spoken-chat-footer {padding:15px 24px 13px;margin-top:6px;background:var(--chat-cream);border-top:2px solid var(--chat-outline);}
#spokenLength {font-size:16px;line-height:1.6;color:var(--chat-muted);margin:0 0 13px;text-align:center;}
.spoken-chat-actions {display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap;}
.spoken-chat-actions button {min-height:58px;padding:14px 24px;font-size:21px;font-weight:750;border:2.5px solid var(--chat-outline);border-radius:19px;display:inline-flex;align-items:center;justify-content:center;gap:11px;transition:background-color 180ms,box-shadow 180ms;}
.spoken-record-button {color:var(--chat-ink);background:var(--chat-pink);box-shadow:0 5px 0 #d4a7bc;}
.spoken-record-button:hover {background:var(--chat-blue);}.spoken-record-button[aria-pressed="true"] {background:var(--chat-cream);}
.spoken-chat .spoken-send-button {color:#fff;background:#7040cb;border-color:var(--chat-outline);box-shadow:0 5px 0 #422571;}
.spoken-chat .spoken-send-button:hover {background:#6031bb;}.spoken-chat-actions button:active:not(:disabled) {box-shadow:0 2px 0 var(--chat-outline);}
.spoken-stop-icon {display:none;width:14px;height:14px;border-radius:4px;background:currentColor;}
.spoken-record-button[aria-pressed="true"] .spoken-stop-icon {display:inline-block;}.spoken-record-button[aria-pressed="true"] .spoken-mic-icon {display:none;}
.spoken-chat button:disabled {opacity:.5;cursor:default;}
.spoken-raw-details {font-size:15px;color:var(--chat-muted);margin-top:7px;}.spoken-raw-details summary {cursor:pointer;min-height:38px;display:flex;align-items:center;justify-content:center;}
#spokenRaw {white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.7;}
.spoken-scene-side {display:flex;flex-direction:column;gap:60px;align-items:center;padding-top:100px;pointer-events:none;}
.spoken-scene-right {padding-top:190px;}
.spoken-photo-card {width:100%;margin:0;padding:8px 8px 12px;border:2.5px solid #67577d;background:#fffefb;border-radius:16px;box-shadow:5px 6px 0 #d6c1ef;transform:rotate(-7deg);position:relative;}
.spoken-scene-right .spoken-photo-card {transform:rotate(7deg);box-shadow:5px 6px 0 #efc2d1;}
.spoken-photo-card:nth-child(2) {transform:rotate(5deg);}.spoken-scene-right .spoken-photo-card:nth-child(2) {transform:rotate(-5deg);}
.spoken-photo-card::before {content:"";position:absolute;top:-12px;left:32%;height:22px;width:38%;background:#ffd678df;border:1px solid #d6b66a;transform:rotate(4deg);}
.spoken-photo-card img {display:block;width:100%;height:auto;aspect-ratio:1.36;object-fit:cover;border-radius:9px;}
.spoken-photo-card figcaption {font-size:14px;line-height:1.5;text-align:center;color:#655574;padding-top:10px;font-weight:650;}
.spoken-scene-strip {display:none;}
[data-appearance="dark"] body.is-composing {background-color:#1c1a31;background-image:radial-gradient(#8c78b833 1.2px,transparent 1.2px);background-size:24px 24px;}
[data-appearance="dark"] .spoken-chat {--chat-paper:#25233b;--chat-cream:#383049;--chat-blue:#25364b;--chat-tint:#322b4b;--chat-pink:#493046;--chat-outline:#9e8cb7;--chat-ink:#f6efff;--chat-muted:#c7bbd8;--chat-green:#a0e1c4;--blue:#c5a9ff;box-shadow:0 7px 0 #4c3c62;}
[data-appearance="dark"] .spoken-bubble {box-shadow:0 4px 0 #4c3c62;}[data-appearance="dark"] .spoken-keyword-chips li {box-shadow:0 3px 0 #635376;}[data-appearance="dark"] .spoken-record-button {box-shadow:0 5px 0 #694659;}
@keyframes spoken-listening {0%,100% {opacity:.4;}50% {opacity:1;}}
@keyframes spoken-appear {from {opacity:0;transform:translateY(4px);}to {opacity:1;transform:translateY(0);}}
@media(max-width:1319px) {
 .is-composing .spoken-playground.has-scene-art {grid-template-columns:minmax(0,1fr);max-width:1160px;}
 .spoken-scene-side {display:none;}
 .spoken-scene-strip {display:flex;align-items:center;justify-content:center;gap:14px;padding:12px 22px 0;}
 .spoken-scene-strip img {width:86px;height:50px;object-fit:cover;border:2px solid var(--chat-outline);border-radius:10px;transform:rotate(-4deg);box-shadow:2px 3px 0 #d8c2e7;}.spoken-scene-strip img:nth-child(2) {transform:rotate(4deg);}
}
@media(max-width:700px) {
 .is-composing .correction-app {width:calc(100% - 20px);}.is-composing .topbar {padding:0;font-size:15px;}
 .is-composing .spoken-playground {margin-top:0;gap:0;}.spoken-chat {border-radius:22px;border-width:2px;}
 .spoken-chat-head {padding:14px;gap:8px;border-bottom-width:2px;}.spoken-chat-head>div {gap:8px;}
 .spoken-chat h1 {font-size:24px;}.spoken-chat h1 span {font-size:13px;}.spoken-party-mark {width:30px;height:30px;}
 .spoken-chat-badge {font-size:14px;padding:7px 9px;border-radius:12px;}
 .spoken-chat-thread {padding:17px 14px 4px;}.spoken-message {gap:10px;}.spoken-chat-avatar {width:54px;height:70px;margin-top:20px;transform:scale(1.5);}
 .spoken-speaker {font-size:14px;}.spoken-bubble {padding:15px 16px;border-radius:20px;border-width:2px;}
 #spokenInvitation {font-size:21px;line-height:1.6;}.spoken-bubble .spoken-bubble-note {font-size:16px;}
 .spoken-text-button {font-size:16px;min-height:46px;padding:8px 10px;}.spoken-task-options {font-size:14px;}
 .spoken-message-user {padding-left:24px;margin-top:20px;gap:9px;}.spoken-user-avatar {width:32px;height:36px;font-size:15px;border-radius:12px;}
 #spokenDraft {font-size:21px;min-height:130px;}#spokenDraft::placeholder {font-size:18px;}.spoken-bubble-user {padding:16px;}
 #spokenCount {font-size:15px;}.spoken-chat-status {margin:12px 8px 0 24px;}#spokenStatus {font-size:15px;}
 .spoken-hint-bubble {padding:14px;font-size:16px;}.spoken-keyword-chips {gap:8px;}.spoken-keyword-chips li {font-size:16px;padding:6px 10px;}.spoken-hint-bubble small {font-size:14px;}
 .spoken-chat-footer {padding:14px 12px 10px;}#spokenLength {font-size:14px;}.spoken-chat-actions {gap:12px;}.spoken-chat-actions button {font-size:17px;min-height:54px;padding:12px 16px;flex:1;}
 .spoken-raw-details {font-size:14px;}
}
@media(prefers-reduced-motion:reduce) {.spoken-chat * {animation:none!important;transition:none!important;}}

/* Visible, indeterminate feedback: no invented generation percentages or stages. */
.spoken-generation {display:flex;align-items:center;gap:20px;margin:20px 0 8px 150px;padding:22px 24px;border:2.5px solid var(--chat-outline);border-radius:24px;background:var(--chat-cream);box-shadow:0 5px 0 #d6bfdf;}
.spoken-generation-art {width:138px;height:136px;position:relative;flex:none;}
.spoken-generation-art img {position:absolute;left:-18px;bottom:-14px;width:126px;height:126px;object-fit:contain;z-index:2;}
.spoken-generation-paper {position:absolute;top:10px;right:8px;width:64px;height:82px;border:2px solid var(--chat-outline);border-radius:9px;background:var(--chat-paper);box-shadow:2px 3px 0 #c7addc;}
.spoken-generation-paper-back {transform:rotate(14deg);background:var(--chat-pink);animation:spoken-paper-back 2.4s ease-in-out infinite;}
.spoken-generation-paper-front {top:21px;right:22px;transform:rotate(-9deg);padding:18px 10px;animation:spoken-paper-front 2.4s ease-in-out infinite;}
.spoken-generation-paper i {display:block;width:100%;height:4px;border-radius:3px;background:var(--chat-tint-border);margin-bottom:8px;}.spoken-generation-paper i:last-child {width:65%;}
.spoken-generation-spark {position:absolute;font-size:25px;color:var(--blue);animation:spoken-listening 1.6s ease-in-out infinite;}
.spark-one {left:3px;top:0;}.spark-two {right:-6px;bottom:8px;font-size:19px;animation-delay:800ms;}
.spoken-generation-copy {min-width:0;flex:1;}
.spoken-generation h2 {display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:0;font:750 24px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--chat-ink);}
.spoken-generation p {font-size:17px;line-height:1.7;color:var(--chat-muted);margin:8px 0 12px;}
.spoken-generation small {display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;font-size:14px;color:var(--chat-muted);line-height:1.6;}
.spoken-generation-dots {display:inline-flex;gap:4px;align-self:center;}.spoken-generation-dots i {width:6px;height:6px;border-radius:50%;background:var(--blue);animation:spoken-listening 1.1s infinite;}.spoken-generation-dots i:nth-child(2) {animation-delay:180ms;}.spoken-generation-dots i:nth-child(3) {animation-delay:360ms;}
.spoken-generation-track {height:9px;border:1.5px solid var(--chat-outline);border-radius:20px;overflow:hidden;background:var(--chat-paper);margin:0 0 9px;}
.spoken-generation-track span {display:block;width:38%;height:100%;border-radius:20px;background:#aa86e8;animation:spoken-generation-travel 1.8s ease-in-out infinite alternate;}
[data-chat-state="thinking"] .spoken-chat-status {display:none;}
[data-chat-state="thinking"] .spoken-send-button {opacity:.8;}
[data-appearance="dark"] .spoken-generation {box-shadow:0 5px 0 #4c3c62;}
@keyframes spoken-paper-front {0%,100% {transform:translateY(0) rotate(-9deg);}50% {transform:translateY(-7px) rotate(-3deg);}}
@keyframes spoken-paper-back {0%,100% {transform:translateY(0) rotate(14deg);}50% {transform:translateY(4px) rotate(20deg);}}
@keyframes spoken-generation-travel {from {transform:translateX(-40%);}to {transform:translateX(210%);}}
@media(max-width:700px) {
 .spoken-generation {margin:18px 0 8px;padding:18px 16px;gap:8px;flex-direction:column;align-items:center;}
 .spoken-generation-art {width:124px;height:110px;}.spoken-generation-art img {width:110px;height:110px;left:-12px;}
 .spoken-generation h2 {font-size:21px;justify-content:center;}.spoken-generation p {font-size:16px;text-align:center;}.spoken-generation small {font-size:13px;}
}
@media(prefers-reduced-motion:reduce) {.spoken-generation * {animation:none!important;}.spoken-generation-track span {transform:none;}}