/* AI Writer v3 — conversational drafting workspace. Depends on aiwa-core.css and aiwa-tools.css. */
.ai-writer-page main { background: #fff; }
.writer-command-inner { gap: 8px; }
.writer-settings-row { width: 100%; flex: 1 1 auto; justify-content: flex-start; margin-left: 0; }
.writer-settings-row .command-select select { min-width: 96px; }
.writer-settings-row .writer-role-select select { width: 170px; }
.writer-role-select .aiwa-ui-icon { width: 16px; height: 16px; }
.writer-settings-row .command-language { margin-left: 0; }
.writer-settings-row .command-language select { width: 190px; }
.writer-length-label { margin-left: 2px; }
.writer-new-draft { min-height: 40px; display: inline-flex; align-items: center; gap: 7px; margin-left: auto; order: 98; padding: 8px 12px; border: 1px solid var(--aiwa-line); border-radius: 10px; background: #fff; color: var(--aiwa-text); font: inherit; font-size: 13px; font-weight: 700; white-space: nowrap; cursor: pointer; }
.writer-new-draft:hover { border-color: var(--aiwa-line-strong); background: var(--aiwa-bg); }
.writer-new-draft .aiwa-ui-icon { width: 15px; height: 15px; }

.writer-chat-shell { position: relative; display: flex; flex-direction: column; background: #fff; }
.writer-notice { width: min(860px, calc(100% - 32px)); margin: 14px auto 0; }
.writer-notice:empty { display: none; }

/* Empty stage */
.writer-empty-stage { width: min(760px, calc(100% - 32px)); display: grid; justify-items: center; gap: 10px; margin: auto auto 0; padding-top: 40px; text-align: center; }
.writer-empty-mark { width: 50px; height: 50px; display: grid; place-items: center; margin-bottom: 4px; border-radius: 14px; background: var(--aiwa-brand-soft); }
.writer-empty-mark .aiwa-ui-icon { width: 24px; height: 24px; filter: invert(35%) sepia(70%) saturate(680%) hue-rotate(97deg) brightness(91%); }
.writer-empty-stage h2 { margin: 0; color: var(--aiwa-ink); font-size: 27px; line-height: 1.25; letter-spacing: -0.025em; }
.writer-empty-stage p { max-width: 560px; margin: 0; color: var(--aiwa-muted); font-size: 14px; line-height: 1.55; }
.writer-starters { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 12px; }
.writer-starters button { min-height: 42px; display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border: 1px solid var(--aiwa-line); border-radius: 10px; background: #fff; color: var(--aiwa-text); font: inherit; font-size: 13px; font-weight: 650; cursor: pointer; transition: background-color 140ms var(--aiwa-ease), border-color 140ms var(--aiwa-ease); }
.writer-starters button:hover { border-color: #a9cbb4; background: #fbfdfb; color: var(--aiwa-brand-dark); }
.writer-starters .aiwa-ui-icon { width: 16px; height: 16px; }

/* Thread */
.writer-thread { width: min(860px, calc(100% - 36px)); display: none; margin: 0 auto; padding: 24px 0 20px; }
.ai-writer-page[data-writer-state="active"] .writer-empty-stage { display: none; }
.ai-writer-page[data-writer-state="active"] .writer-thread { display: block; }
.writer-turn { border-bottom: 1px solid var(--aiwa-line); }
.writer-user-turn { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 12px; padding: 18px 0; }
.writer-turn-avatar { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 9px; color: var(--aiwa-brand-dark); background: var(--aiwa-brand-soft); }
.writer-turn-avatar .aiwa-ui-icon { width: 16px; height: 16px; }
.writer-user-content { min-width: 0; display: grid; gap: 8px; }
.writer-user-content strong { color: var(--aiwa-brand-dark); font-size: 12px; letter-spacing: 0.02em; }
.writer-user-content p { margin: 0; color: var(--aiwa-ink); font-size: 15px; line-height: 1.65; white-space: pre-wrap; }

.writer-turn-files, .writer-attachment-list { display: flex; flex-wrap: wrap; gap: 7px; }
.writer-file-chip { max-width: 280px; min-height: 42px; display: flex; align-items: center; gap: 8px; padding: 6px 8px; border: 1px solid var(--aiwa-line); border-radius: 9px; background: #fff; color: var(--aiwa-text); }
.writer-file-chip.is-processing { background: var(--aiwa-bg); }
.writer-file-chip.is-error { border-color: #e9b8b4; background: #fff8f7; }
.writer-file-icon { width: 28px; height: 28px; display: grid; flex: 0 0 28px; place-items: center; border-radius: 7px; background: var(--aiwa-brand-soft); }
.writer-file-icon .aiwa-ui-icon { width: 14px; height: 14px; }
.writer-file-copy { min-width: 0; display: grid; gap: 1px; }
.writer-file-copy strong { overflow: hidden; color: var(--aiwa-ink); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.writer-file-copy span { color: var(--aiwa-muted); font-size: 11px; }
.writer-file-remove { width: 28px; height: 28px; display: grid; flex: 0 0 28px; place-items: center; padding: 0; border: 0; border-radius: 7px; background: transparent; cursor: pointer; }
.writer-file-remove:hover { background: var(--aiwa-bg); }
.writer-file-remove .aiwa-ui-icon { width: 12px; height: 12px; }

/* Response */
.writer-response { padding: 20px 0 22px; }
.writer-response-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.writer-response-identity { display: flex; align-items: center; gap: 9px; }
.writer-response-identity .writer-turn-avatar { background: transparent; }
.writer-response-identity .writer-turn-avatar .aiwa-ui-icon { width: 19px; height: 19px; filter: invert(35%) sepia(70%) saturate(680%) hue-rotate(97deg) brightness(91%); }
.writer-response-identity strong { color: var(--aiwa-brand-dark); font-size: 13px; }
.writer-version { color: var(--aiwa-muted); font-size: 12px; font-weight: 650; }
.writer-response:not(.is-current) .writer-document-card { opacity: 0.82; }
.writer-response:not(.is-current) .writer-document-card:hover { opacity: 1; }

.writer-document-card { overflow: visible; border: 1px solid var(--aiwa-line); border-radius: 14px; background: #fff; box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04); }
.writer-document-toolbar { min-height: 48px; display: flex; align-items: center; gap: 4px; padding: 6px 10px; border-bottom: 1px solid var(--aiwa-line); border-radius: 14px 14px 0 0; background: #fbfcfb; }
.writer-document-toolbar button { width: 34px; height: 34px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 7px; background: transparent; color: var(--aiwa-text); cursor: pointer; }
.writer-document-toolbar button:hover:not(:disabled) { background: #edf2ee; }
.writer-document-toolbar button:disabled { opacity: 0.45; cursor: default; }
.writer-document-toolbar .aiwa-ui-icon { width: 15px; height: 15px; }
.writer-toolbar-divider { width: 1px; height: 22px; margin: 0 4px; background: var(--aiwa-line); }
.writer-toolbar-spacer { flex: 1; }
.writer-toolbar-action { width: auto !important; display: inline-flex !important; gap: 6px; padding: 0 10px !important; font: inherit; font-size: 12px; font-weight: 700; white-space: nowrap; }
.writer-toolbar-action.is-done { color: var(--aiwa-brand-dark); }
.writer-toolbar-action.is-busy { opacity: 0.6; pointer-events: none; }
.writer-caret { font-size: 10px; opacity: 0.7; }
.writer-menu-wrap { position: relative; }
.writer-menu { position: absolute; right: 0; top: calc(100% + 6px); z-index: 60; min-width: 270px; padding: 6px; border: 1px solid var(--aiwa-line); border-radius: 12px; background: #fff; box-shadow: 0 12px 32px rgba(16, 24, 40, 0.14), 0 2px 6px rgba(16, 24, 40, 0.06); }
.writer-menu[hidden] { display: none !important; }
.writer-menu-item { width: 100% !important; height: auto !important; display: flex !important; align-items: center; justify-content: flex-start; gap: 10px; padding: 8px 10px !important; border: 0; border-radius: 8px; background: transparent; font: inherit; font-size: 13px; text-align: left; cursor: pointer; }
.writer-menu-item:hover { background: #f1f6f2; }
.writer-menu-item b { display: block; font-weight: 700; color: var(--aiwa-ink); }
.writer-menu-item small { display: block; color: var(--aiwa-muted); font-size: 11px; font-weight: 500; }
.writer-menu-ico { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 8px; background: #f1f6f2; }
.writer-menu-ico .aiwa-ui-icon { width: 16px; height: 16px; }

.writer-document { min-height: 220px; padding: 28px 34px 30px; overflow-wrap: anywhere; color: #24352c; font-size: 16px; line-height: 1.75; outline: 0; }
.writer-document:focus { box-shadow: inset 0 0 0 2px rgba(19, 122, 61, 0.22); }
.writer-document h2 { margin: 0 0 16px; color: var(--aiwa-ink); font-size: 25px; line-height: 1.28; letter-spacing: -0.02em; }
.writer-document h3 { margin: 24px 0 8px; color: var(--aiwa-ink); font-size: 18px; line-height: 1.4; }
.writer-document h3:first-child, .writer-document h2 + h3 { margin-top: 0; }
.writer-document p { margin: 0 0 14px; }
.writer-document p:last-child { margin-bottom: 0; }
.writer-document ul, .writer-document ol { margin: 0 0 16px; padding-left: 24px; }
.writer-document li { margin: 5px 0; }
.writer-document blockquote { margin: 0 0 14px; padding: 4px 16px; border-left: 3px solid #cfe6d7; color: var(--aiwa-muted); }
.writer-document code { padding: 1px 5px; border-radius: 5px; background: #f1f4f2; font-size: 0.92em; }
.writer-document.is-loading { display: grid; align-content: start; gap: 12px; }
.writer-document.is-streaming { min-height: 260px; }
.writer-live-text { white-space: normal; }
.writer-stream-caret { width: 2px; height: 1.05em; display: inline-block; margin-left: 3px; vertical-align: -0.12em; border-radius: 1px; background: var(--aiwa-brand); animation: writer-caret 0.8s steps(1, end) infinite; }
@keyframes writer-caret { 50% { opacity: 0; } }
.writer-loading-line { height: 12px; border-radius: 7px; background: #e8ede9; animation: writer-pulse 1.3s ease-in-out infinite alternate; }
.writer-loading-line:nth-child(1) { width: 55%; height: 22px; margin-bottom: 11px; }
.writer-loading-line:nth-child(2) { width: 94%; }
.writer-loading-line:nth-child(3) { width: 87%; }
.writer-loading-line:nth-child(4) { width: 76%; margin-top: 8px; }
.writer-loading-line:nth-child(5) { width: 90%; }
@keyframes writer-pulse { from { opacity: 0.55; } to { opacity: 1; } }

.writer-document-meta { min-height: 46px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 12px; border-top: 1px solid var(--aiwa-line); border-radius: 0 0 14px 14px; color: var(--aiwa-muted); background: #fbfcfb; font-size: 12px; font-weight: 650; }
.writer-response-actions { display: flex; flex-wrap: wrap; gap: 7px; }
.writer-response-actions button { min-height: 34px; display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px; border: 1px solid var(--aiwa-line); border-radius: 8px; color: var(--aiwa-text); background: #fff; font: inherit; font-size: 12px; font-weight: 700; cursor: pointer; }
.writer-response-actions button:hover:not(:disabled) { border-color: #a9cbb4; background: var(--aiwa-brand-soft); color: var(--aiwa-brand-dark); }
.writer-response-actions button:disabled { opacity: 0.5; cursor: default; }
.writer-response-actions .aiwa-ui-icon { width: 13px; height: 13px; }
.writer-refine { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 12px; }
.writer-refine[hidden] { display: none; }
.writer-refine > span { margin-right: 2px; color: var(--aiwa-muted); font-size: 12px; font-weight: 650; }
.writer-refine button { min-height: 30px; display: inline-flex; align-items: center; gap: 6px; padding: 4px 11px; border: 1px solid var(--aiwa-line); border-radius: 999px; background: #fff; color: var(--aiwa-text); font: inherit; font-size: 12px; font-weight: 650; cursor: pointer; }
.writer-refine button:hover:not(:disabled) { border-color: #a9cbb4; background: var(--aiwa-brand-soft); color: var(--aiwa-brand-dark); }
.writer-refine button:disabled { opacity: 0.5; cursor: default; }
.writer-refine .aiwa-ui-icon { width: 13px; height: 13px; }

/* Composer */
.writer-composer-dock { width: min(820px, calc(100% - 32px)); margin: 25px auto auto; padding-bottom: 22px; }
.ai-writer-page[data-writer-state="active"] .writer-composer-dock { position: sticky; z-index: 70; bottom: 0; width: 100%; margin: auto 0 0; padding: 12px max(18px, calc((100% - 860px) / 2)) max(12px, env(safe-area-inset-bottom)); border-top: 1px solid var(--aiwa-line); background: rgba(255, 255, 255, 0.96); backdrop-filter: blur(6px); }
.writer-composer { position: relative; overflow: hidden; border: 1px solid #cbd7cf; border-radius: 14px; background: #fff; box-shadow: 0 2px 8px rgba(23, 33, 27, 0.08); }
.writer-composer:focus-within { border-color: var(--aiwa-brand); box-shadow: 0 0 0 3px rgba(19, 122, 61, 0.12); }
.writer-request-progress { position: absolute; z-index: 5; inset: 0 0 auto; height: 3px; overflow: hidden; background: #e7eee9; }
.writer-request-progress[hidden] { display: none; }
.writer-request-progress span { width: 38%; height: 100%; display: block; background: var(--aiwa-brand); transform: translateX(-120%); animation: writer-progress 1.4s cubic-bezier(0.22, 1, 0.36, 1) infinite; }
@keyframes writer-progress { 0% { transform: translateX(-120%); } 65%, 100% { transform: translateX(285%); } }
.writer-composer.is-dragging { border-color: var(--aiwa-brand); background: #fbfdfb; }
.writer-drop-overlay { position: absolute; z-index: 4; inset: 0; display: none; place-items: center; align-content: center; gap: 8px; background: rgba(234, 247, 238, 0.96); color: var(--aiwa-brand-dark); pointer-events: none; }
.writer-composer.is-dragging .writer-drop-overlay { display: grid; }
.writer-drop-overlay .aiwa-ui-icon { width: 23px; height: 23px; }
.writer-drop-overlay strong { font-size: 13px; }
.writer-attachment-list:empty { display: none; }
.writer-attachment-list { padding: 10px 12px 0; }
.writer-composer textarea { width: 100%; min-height: 76px; max-height: 200px; padding: 14px 15px 8px; resize: none; border: 0; outline: 0; color: var(--aiwa-ink); background: transparent; font: inherit; font-size: 15px; line-height: 1.55; }
.writer-composer textarea::placeholder { color: #65736a; opacity: 1; }
.writer-composer textarea:disabled { color: var(--aiwa-muted); }
.writer-composer-footer { min-height: 52px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 7px 9px 9px 12px; }
.writer-composer-tools, .writer-submit-group { display: flex; align-items: center; gap: 8px; }
.writer-attach-button { min-height: 36px; display: inline-flex; align-items: center; gap: 7px; padding: 7px 9px; border: 0; border-radius: 8px; color: var(--aiwa-text); background: transparent; font: inherit; font-size: 12.5px; font-weight: 700; cursor: pointer; }
.writer-attach-button:hover:not(:disabled) { background: var(--aiwa-bg); }
.writer-attach-button .aiwa-ui-icon { width: 16px; height: 16px; }
.writer-file-support, .writer-shortcut { color: var(--aiwa-muted); font-size: 11px; }
.writer-word-budget { width: 130px; gap: 4px; text-align: left; }
.writer-send-button, .writer-stop-button { width: 40px; height: 40px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 10px; background: var(--aiwa-brand); cursor: pointer; }
.writer-send-button:hover:not(:disabled) { background: var(--aiwa-brand-dark); }
.writer-send-button:disabled { opacity: 0.55; cursor: wait; }
.writer-send-button[hidden], .writer-stop-button[hidden] { display: none; }
.writer-send-button .aiwa-ui-icon, .writer-stop-button .aiwa-ui-icon { width: 17px; height: 17px; filter: brightness(0) invert(1); }
.writer-stop-button { background: var(--aiwa-ink); }
.writer-stop-button:hover { background: #000; }
.writer-privacy-note { margin: 7px 0 0; color: var(--aiwa-muted); font-size: 11px; text-align: center; }
.writer-toast { position: fixed; left: 50%; bottom: 22px; z-index: 200; transform: translate(-50%, 16px); padding: 10px 16px; border-radius: 999px; background: var(--aiwa-ink); color: #fff; font-size: 13px; font-weight: 650; box-shadow: var(--aiwa-shadow-low); opacity: 0; pointer-events: none; transition: opacity 160ms var(--aiwa-ease), transform 160ms var(--aiwa-ease); }
.writer-toast.show { opacity: 1; transform: translate(-50%, 0); pointer-events: auto; }
.writer-toast { display: inline-flex; align-items: center; gap: 12px; }
.writer-toast-action { padding: 4px 12px; border: 1px solid rgba(255,255,255,.34); border-radius: 999px; background: transparent; color: inherit; font: inherit; font-size: 12.5px; font-weight: 750; cursor: pointer; transition: background-color 130ms, border-color 130ms; }
.writer-toast-action:hover { border-color: currentColor; background: rgba(255,255,255,.14); }

/* Explainer */
.writer-explainer { padding-top: 54px; background: var(--aiwa-bg); }
.ai-writer-page[data-writer-state="active"] .writer-explainer { padding-top: 40px; }
.writer-seo-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin: 28px 0 8px; }
.writer-seo-grid article { padding: 18px 18px 16px; border: 1px solid var(--aiwa-line); border-radius: 14px; background: #fff; }
.writer-seo-grid h3 { margin: 0 0 6px; font-size: 15px; font-weight: 760; letter-spacing: -0.01em; }
.writer-seo-grid p { margin: 0; color: #4b5560; font-size: 13.5px; line-height: 1.6; }
.writer-seo-h3 { margin: 30px 0 8px; font-size: 17px; font-weight: 760; letter-spacing: -0.015em; }
.writer-explainer .tool-explainer-inner > p { color: #4b5560; font-size: 14px; line-height: 1.65; }
.writer-faq { margin: 0; }
.writer-faq dt { margin: 14px 0 4px; font-weight: 740; font-size: 14.5px; }
.writer-faq dd { margin: 0 0 12px; padding-bottom: 12px; border-bottom: 1px solid var(--aiwa-line); color: #4b5560; font-size: 13.5px; line-height: 1.6; }

.writer-new-draft:focus-visible, .writer-starters button:focus-visible, .writer-file-remove:focus-visible, .writer-document-toolbar button:focus-visible, .writer-response-actions button:focus-visible, .writer-refine button:focus-visible, .writer-attach-button:focus-visible, .writer-send-button:focus-visible, .writer-stop-button:focus-visible { outline: 2px solid var(--aiwa-focus, #2563eb); outline-offset: 2px; }

@media (max-width: 1180px) {
  .writer-command-inner { overflow-x: auto; scrollbar-width: none; }
  .writer-command-inner::-webkit-scrollbar { display: none; }
  .writer-settings-row { flex: 0 0 auto; }
}
@media (max-width: 900px) {
  .writer-command-inner { padding-inline: 12px; }
  .writer-settings-row .writer-length-label { display: none; }
  .writer-thread { width: min(100% - 28px, 820px); }
  .writer-seo-grid { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .writer-command-inner { min-height: 64px; gap: 10px; padding: 6px 8px; }
  .writer-settings-row { margin-left: 0; }
  .writer-settings-row .command-divider { display: none; }
  .writer-settings-row .command-select select { min-width: 84px; }
  .writer-settings-row .command-language select { width: 128px; }
  .writer-new-draft { min-width: 40px; padding-inline: 10px; }
  .writer-new-draft span { display: none; }
  .writer-chat-shell { min-height: calc(100svh - 56px - 114px); }
  .writer-empty-stage { width: min(100% - 24px, 520px); padding-top: 20px; }
  .writer-empty-stage h2 { font-size: 22px; }
  .writer-starters { width: 100%; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .writer-starters button { min-height: 74px; flex-direction: column; justify-content: center; padding: 10px 7px; font-size: 12px; }
  .writer-composer-dock { width: calc(100% - 20px); margin-top: 20px; }
  .ai-writer-page[data-writer-state="active"] .writer-composer-dock { padding: 8px 8px max(8px, env(safe-area-inset-bottom)); }
  .writer-thread { width: calc(100% - 20px); padding: 8px 0 16px; }
  .writer-user-turn { grid-template-columns: 28px minmax(0, 1fr); gap: 9px; padding: 14px 0; }
  .writer-turn-avatar { width: 27px; height: 27px; }
  .writer-response { padding: 16px 0 20px; }
  .writer-document-toolbar { overflow-x: auto; scrollbar-width: none; }
  .writer-menu { position: fixed; left: 12px; right: 12px; top: auto; bottom: 90px; }
  .writer-document { min-height: 220px; padding: 20px 16px; font-size: 15.5px; }
  .writer-document h2 { font-size: 22px; }
  .writer-toolbar-action span:not(.writer-caret) { display: none; }
  .writer-document-meta { align-items: flex-start; flex-direction: column; }
  .writer-response-actions { width: 100%; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .writer-response-actions button { min-width: 0; justify-content: center; padding-inline: 5px; }
  .writer-composer textarea { min-height: 68px; padding: 12px 12px 5px; font-size: 16px; }
  .writer-composer-footer { min-height: 50px; padding: 5px 7px 7px; }
  .writer-file-support, .writer-shortcut { display: none; }
  .writer-word-budget { width: 95px; }
  .writer-privacy-note { padding-inline: 8px; }
}
@media (max-width: 440px) {
  .writer-attach-button span { display: none; }
  .writer-attach-button { width: 38px; justify-content: center; padding: 0; }
  .writer-word-budget { width: 86px; }
  .writer-file-chip { max-width: 100%; }
  .writer-attachment-list { display: grid; grid-template-columns: 1fr; }
  .writer-response-actions button span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}
@media (max-height: 680px) and (min-width: 761px) {
  .writer-empty-stage { padding-top: 16px; }
  .writer-starters { margin-top: 5px; }
  .writer-composer-dock { margin-top: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .writer-loading-line, .writer-request-progress span, .writer-stream-caret { animation: none; }
  .writer-request-progress span { width: 100%; transform: none; }
}

/* ---- v4 shell: full-height workspace, dropdown command bar, brief dialog ---- */
.ai-writer-page > main, body.ai-writer-page main { flex: 0 0 auto; height: calc(100dvh - 64px); min-height: 520px; display: flex; flex-direction: column; overflow: hidden; }
.ai-writer-page .wr-bar { flex: 0 0 auto; }
.writer-chat-shell { flex: 1 1 auto; min-height: 0; overflow: auto; }
.ai-writer-page[data-writer-state="active"] .writer-composer-dock { position: sticky; bottom: 0; }
.writer-explainer { padding-top: 40px; }
.wr-bar-inner { gap: 10px; }
.wr-format-menu { width: 560px; }
.wr-format-list { grid-template-columns: 1fr 1fr; }
.wr-group { grid-column: 1 / -1; margin: 8px 0 2px; padding: 0 12px; color: var(--aiwa-muted); font-size: 10.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.wr-group:first-child { margin-top: 2px; }
.wr-format-dd .pp-mode-btn-text b, #wrToneDd .pp-mode-btn-text b { max-width: 170px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wr-extras { gap: 14px; }
.wr-length .pp-synonyms-value { min-width: 62px; }
.wr-new { order: 0; margin-left: 0; min-height: 42px; }
.wr-hidden-selects { display: none !important; }
.wr-dialog label { display: grid; gap: 5px; color: var(--aiwa-muted); font-size: 11.5px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; }
.wr-dialog input, .wr-dialog textarea { padding: 0 12px; border: 1px solid var(--aiwa-line); border-radius: 10px; background: #fbfcfb; color: var(--aiwa-ink); font: inherit; font-size: 14px; outline: 0; }
.wr-dialog input { height: 40px; }
.wr-dialog textarea { min-height: 120px; padding: 10px 12px; line-height: 1.5; resize: vertical; }
.wr-dialog input:focus, .wr-dialog textarea:focus { border-color: var(--aiwa-brand); box-shadow: 0 0 0 3px rgba(19, 122, 61, 0.14); background: #fff; }
.wr-kw { display: inline-flex; align-items: center; gap: 6px; margin-left: 6px; color: var(--aiwa-brand-dark); font-size: 12px; font-weight: 650; }
@media (max-width: 1500px) { .wr-format-dd .pp-mode-btn-text b, #wrToneDd .pp-mode-btn-text b { max-width: 130px; } }
@media (max-width: 900px) {
  .ai-writer-page main { height: calc(100dvh - 56px); }
  .wr-format-menu { width: auto; }
  .wr-format-list { grid-template-columns: 1fr; }
  .wr-extras { flex: 1 1 100%; }
  .wr-new span { display: none; }
  .hm-dialog { width: calc(100vw - 24px); }
}
.em-details-btn { display: inline-flex; align-items: center; gap: 7px; height: 36px; max-width: 260px; padding: 0 13px; border: 1px solid var(--aiwa-line); border-radius: 999px; background: #fff; color: var(--aiwa-text); font: inherit; font-size: 12.5px; font-weight: 650; white-space: nowrap; cursor: pointer; transition: background-color 140ms, border-color 140ms, color 140ms; }
.em-details-btn span { overflow: hidden; text-overflow: ellipsis; }
.em-details-btn .aiwa-ui-icon { width: 14px; height: 14px; flex: 0 0 auto; }
.em-details-btn:hover { border-color: #9bc7aa; background: var(--aiwa-brand-soft); color: var(--aiwa-brand-dark); }
.em-details-btn.is-on { border-color: var(--aiwa-brand); background: var(--aiwa-brand); color: #fff; }
.em-details-btn.is-on .aiwa-ui-icon { filter: invert(1); }

.hm-dialog { width: min(560px, calc(100vw - 32px)); padding: 0; border: 1px solid var(--aiwa-line); border-radius: 18px; background: #fff; color: var(--aiwa-text); box-shadow: 0 28px 70px rgba(10, 40, 24, 0.26); }
.hm-dialog::backdrop { background: rgba(14, 30, 20, 0.42); backdrop-filter: blur(2px); }
.hm-dialog-in { margin: 0; padding: 18px 20px 16px; display: grid; gap: 12px; }
.hm-dialog-head { display: flex; align-items: flex-start; gap: 12px; }
.hm-dialog-head > .aiwa-ui-icon { flex: 0 0 auto; width: 34px; height: 34px; padding: 8px; border-radius: 10px; background: var(--aiwa-brand-soft); filter: invert(35%) sepia(70%) saturate(680%) hue-rotate(97deg) brightness(91%); }
.hm-dialog-head h2 { margin: 0 0 2px; font-size: 16px; font-weight: 800; color: var(--aiwa-ink); }
.hm-dialog-head p { margin: 0; color: var(--aiwa-muted); font-size: 12.5px; line-height: 1.45; }
.hm-dialog-close { margin-left: auto; flex: 0 0 auto; width: 30px; height: 30px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 8px; background: transparent; cursor: pointer; }
.hm-dialog-close:hover { background: var(--aiwa-bg); }
.hm-dialog-close .aiwa-ui-icon { width: 12px; height: 12px; }
.hm-dialog textarea { width: 100%; min-height: 170px; padding: 12px 14px; border: 1px solid var(--aiwa-line); border-radius: 12px; background: #fbfcfb; color: var(--aiwa-ink); font: inherit; font-size: 14px; line-height: 1.6; resize: vertical; outline: 0; }
.hm-dialog textarea:focus { border-color: var(--aiwa-brand); box-shadow: 0 0 0 3px rgba(19, 122, 61, 0.14); background: #fff; }
.hm-dialog-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.hm-dialog-foot > span { color: var(--aiwa-muted); font-size: 12px; font-weight: 650; }
.hm-dialog-actions { display: flex; gap: 8px; margin-left: auto; }
.hm-dialog-actions [hidden] { display: none; }
@media (max-width: 900px) {
  .hm-extras { flex: 1 1 100%; justify-content: space-between; }
  .hm-score { font-size: 10.5px; }
  .hm-dialog { width: calc(100vw - 24px); }
  .hm-dialog textarea { min-height: 150px; }
  .hm-voice-btn span { max-width: 140px; overflow: hidden; text-overflow: ellipsis; }
}
.hm-dialog-actions button { min-height: 38px; display: inline-flex; align-items: center; gap: 7px; padding: 8px 16px; border: 1px solid var(--aiwa-line); border-radius: 10px; background: #fff; color: var(--aiwa-ink); font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; transition: background-color 140ms, border-color 140ms; }
.hm-dialog-actions button:hover { background: var(--aiwa-bg); }
.hm-dialog-actions button.primary { border-color: var(--aiwa-brand); background: var(--aiwa-brand); color: #fff; }
.hm-dialog-actions button.primary:hover { background: var(--aiwa-brand-dark); border-color: var(--aiwa-brand-dark); }
.hm-dialog-actions button.primary .aiwa-ui-icon { width: 14px; height: 14px; filter: invert(1); }
.hm-dialog-actions button[hidden] { display: none; }