/* The tool uses the Use Cases page frame, DM Sans, shared buttons and color tokens. */
.reply-tool-page { --usecase-gap:112px; }
.reply-tool-page main > .reply-tool-hero { padding-top:48px; }
.reply-tool-intro { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); align-items:center; gap:64px; margin-bottom:40px; }
.reply-tool-intro h1 { font-size:64px; line-height:1.06; letter-spacing:-.05em; }
.reply-tool-intro .lead { margin:0; color:var(--muted); font-size:18px; line-height:1.6; }
.reply-workspace { padding:22px; border-radius:24px; background:linear-gradient(115deg,#c1d9d2 0%,#e4e7de 48%,#ded5ea 100%); }
.reply-workspace,.reply-output-panel { scroll-margin-top:112px; }
.reply-channel { display:flex; gap:6px; padding:0 2px 18px; }
.reply-channel button,.reply-candidates button { padding:9px 18px; border:0; border-radius:999px; color:var(--ink); background:transparent; font:inherit; font-size:14px; line-height:1.5; }
.reply-channel button[aria-pressed=true] { background:#fff; box-shadow:0 2px 5px #252a3608; }
.reply-channel button:hover { background:#ffffff80; }
.reply-workspace-grid { display:grid; grid-template-columns:1fr 1fr; overflow:hidden; border:1px solid #ffffffc7; border-radius:16px; background:#ffffffed; }
.reply-input-panel,.reply-output-panel { display:flex; flex-direction:column; min-width:0; padding:28px; }
.reply-input-panel { gap:20px; }
.reply-output-panel { background:#f8faf9; border-left:1px solid #dfe5e2; }
.reply-panel-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:34px; }
.reply-panel-heading h2 { font-size:23px; letter-spacing:-.035em; line-height:1.3; }
.reply-text-button { padding:6px 0; border:0; background:none; color:var(--muted); font-size:13px; text-decoration:underline; text-underline-offset:4px; }
.reply-field { display:flex; flex-direction:column; gap:8px; min-width:0; }
.reply-field label { color:var(--ink); font-size:14px; font-weight:500; line-height:1.4; }
.reply-field textarea,.reply-field select { width:100%; min-width:0; border:1px solid #d8dfdc; border-radius:9px; padding:12px 14px; color:var(--ink); background:#fff; font-size:14px; line-height:1.55; }
.reply-field textarea { resize:vertical; }
.reply-field textarea::placeholder { color:#7b828d; opacity:1; }
.reply-field select { min-height:45px; padding-right:24px; }
.tool-select-trigger { display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; min-height:45px; border:1px solid #d8dfdc; border-radius:12px; padding:10px 14px; background:#fff; color:var(--ink); font:inherit; font-size:14px; line-height:1.55; text-align:left; cursor:pointer; }
.tool-select-trigger span { min-width:0; }
.tool-select-trigger svg { flex:none; transition:transform .24s var(--glass-ease); }
.tool-select-trigger[aria-expanded=true] svg { transform:rotate(180deg); }
.tool-select-trigger:focus-visible { outline:2px solid #526abb; outline-offset:2px; }
.tool-select-menu { position:fixed; z-index:120; margin:0; padding:6px; overflow-y:auto; overscroll-behavior:contain; border:1px solid var(--glass-edge); border-radius:16px; background:var(--glass-fill); box-shadow:var(--glass-shadow),0 0 0 1px #7687991a; backdrop-filter:blur(22px) saturate(1.6); -webkit-backdrop-filter:blur(22px) saturate(1.6); }
.tool-select-option { display:flex; align-items:center; min-height:44px; padding:12px 14px; border-radius:10px; color:#454b58; font-size:13px; font-weight:500; line-height:normal; cursor:pointer; transition:background-color .18s,color .18s; }
.tool-select-option:is(.is-active,[aria-selected=true]) { background:#ffffffbf; color:#20283b; }
.reply-workspace :is(.reply-more,.tool-changes)>summary { display:flex; align-items:center; gap:7px; list-style:none; }
.reply-workspace :is(.reply-more,.tool-changes)>summary::-webkit-details-marker { display:none; }
.reply-workspace :is(.reply-more,.tool-changes)>summary svg { flex:none; transition:transform .24s var(--glass-ease); }
.reply-workspace :is(.reply-more,.tool-changes)[open]>summary svg { transform:rotate(180deg); }
.reply-workspace :is(.reply-more,.tool-changes)>summary[aria-expanded=false] svg { transform:none; }
.reply-workspace :is(.reply-more,.tool-changes)>summary:focus-visible { outline:2px solid #526abb; outline-offset:3px; border-radius:4px; }
.reply-workspace .is-tool-expanding { overflow:hidden; }
@media(max-width:1199px) { .tool-select-option { font-size:15px; } }
@media(max-width:600px) { .tool-select-trigger { font-size:16px; } }
@media(prefers-reduced-motion:reduce) { .tool-select-trigger svg,.tool-select-option,.reply-workspace :is(.reply-more,.tool-changes)>summary svg { transition:none; } }
@media(prefers-reduced-transparency:reduce) { .tool-select-menu { background:#f3f6fa; backdrop-filter:none; -webkit-backdrop-filter:none; } }
.reply-field textarea:focus,.reply-field select:focus,#reply-draft:focus { outline:2px solid #6f967d; outline-offset:2px; }
.reply-settings { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.reply-examples { display:flex; align-items:center; flex-wrap:wrap; gap:6px 10px; }
.reply-examples > span,.reply-refine > span { color:var(--muted); font-size:12px; }
.reply-examples button,.reply-refine button { border:1px solid #dbe1de; padding:6px 10px; border-radius:999px; background:#fff; color:var(--ink); font:inherit; font-size:12px; line-height:1.5; }
.reply-examples button:hover,.reply-refine button:hover { background:#eef4ed; border-color:#b0c7b7; }
.reply-more { padding-top:2px; }
.reply-more summary { color:var(--muted); font-size:13px; cursor:pointer; }
.reply-more .reply-settings { margin-top:16px; }
.reply-generate-row { display:flex; align-items:center; gap:18px; margin-top:2px; }
:root body.reply-tool-page main .reply-generate { flex:1; min-height:48px; padding:13px 24px; border-radius:999px; font-size:15px; line-height:1.4; }
/* Loading stays inside the existing button without moving its label or controls. */
:root body.reply-tool-page main .reply-generate.is-loading { white-space:normal; opacity:1; background:var(--button-fill); color:var(--button-ink); border-color:var(--button-edge); }
.reply-generate.is-loading::after { content:''; position:absolute; z-index:-1; inset-block:0; left:0; width:40%; background:linear-gradient(90deg,transparent,#ffffffb3,transparent); pointer-events:none; animation:reply-loading-sweep 1.2s ease-in-out infinite; }
@keyframes reply-loading-sweep { from { transform:translateX(-100%); } to { transform:translateX(350%); } }
@media(prefers-reduced-motion:reduce) { .reply-generate.is-loading::after { animation:none; transform:translateX(75%); } }
.reply-tool-page button:disabled { cursor:default; opacity:.48; }
.reply-data-note { font-size:11px; line-height:1.6; }
.reply-data-note { margin-top:-8px; }
.reply-data-note a { text-decoration:underline; text-underline-offset:3px; }
.reply-copy { display:flex; align-items:center; justify-content:center; gap:7px; min-width:83px; padding:8px 12px; border:1px solid #d8dfdc; border-radius:999px; background:#fff; color:var(--ink); font-size:12px; }
.reply-empty { display:flex; flex:1; flex-direction:column; align-items:center; justify-content:center; gap:18px; padding:48px 8px; text-align:center; }
.reply-empty img { opacity:.8; }
.reply-empty h3 { max-width:240px; font-size:23px; line-height:1.3; }
.reply-empty p { font-size:14px; line-height:1.6; }
.reply-result { display:flex; flex:1; flex-direction:column; gap:20px; margin-top:24px; }
.reply-candidates { display:flex; flex-wrap:wrap; gap:4px; padding-bottom:10px; border-bottom:1px solid #dde4df; }
.reply-candidates button { padding:7px 14px; font-size:13px; }
.reply-candidates button[aria-pressed=true] { background:#e2ece3; }
#reply-draft { flex:1; width:100%; min-height:220px; resize:vertical; border:0; border-radius:4px; padding:8px 2px; background:transparent; color:var(--ink); font-size:17px; line-height:1.7; }
.reply-refine { display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
.reply-status-wrap { margin-top:16px; }
.reply-status { font-size:13px; line-height:1.5; color:var(--ink); }
.reply-status[data-error=true] { color:#9c322b; }
.reply-status:empty { display:none; }
.reply-status-wrap:has(.reply-status:empty) { margin-top:0; }
.reply-output-panel[aria-busy=true] .reply-status::before { content:''; display:inline-block; width:8px; height:8px; margin-right:8px; border-radius:50%; background:#719d79; animation:reply-pulse 1s ease-in-out infinite alternate; }
.reply-noscript { padding:20px; }
.reply-section-heading { margin-bottom:44px; text-align:center; }
.reply-section-heading h2 { font-size:46px; line-height:1.12; letter-spacing:-.045em; }
.reply-section-heading p { margin-top:20px; font-size:18px; }
.reply-steps { display:grid; grid-template-columns:repeat(3,1fr); grid-template-rows:auto auto auto; gap:18px 40px; list-style:none; padding:0; }
.reply-steps li { display:grid; grid-template-rows:subgrid; grid-row:1 / span 3; padding-top:24px; border-top:1px solid var(--line); }
.reply-step-number { color:#6c8577; font-size:13px; }
.reply-steps h3 { font-size:24px; }
.reply-steps p { font-size:16px; }
.reply-mini-message { margin-right:36px; padding:24px; border-radius:18px; background:#ffffffe8; }
.reply-mini-message span { color:var(--muted); font-size:12px; }
.reply-mini-message p { margin-top:10px; color:var(--ink); font-size:18px; line-height:1.5; }
.reply-mini-answer { display:flex; align-items:flex-start; gap:14px; margin-left:24px; padding:24px; border:1px solid #ffffffc9; border-radius:18px; background:#ffffffc9; }
.reply-mini-answer img { flex-shrink:0; }
.reply-mini-answer p { color:var(--ink); font-size:16px; line-height:1.6; }
.reply-faq .faq-list { max-width:850px; margin:auto; }
.reply-faq .faq-list summary { padding-block:24px; font-size:18px; }
.reply-tool-page .sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@keyframes reply-pulse { to { opacity:.25; } }
@media(max-width:1100px) {
  .reply-tool-intro { gap:32px; }
  .reply-tool-intro h1 { font-size:52px; }
  .reply-input-panel,.reply-output-panel { padding:22px; }
}
@media(max-width:850px) {
  .reply-tool-intro { grid-template-columns:1fr; gap:22px; }
  .reply-tool-intro h1 { font-size:48px; }
  .reply-tool-intro .lead br { display:none; }
  .reply-workspace-grid { grid-template-columns:1fr; }
  .reply-output-panel { border-left:0; border-top:1px solid #dfe5e2; }
  .reply-empty { min-height:260px; }
  .reply-section-heading h2 { font-size:38px; }
  .reply-steps { gap:18px 24px; }
  .reply-steps h3 { font-size:21px; }
}
@media(max-width:600px) {
  .reply-tool-page main > .reply-tool-hero { padding-top:28px; }
  .reply-tool-intro { margin-bottom:28px; }
  .reply-tool-intro h1 { font-size:40px; }
  .reply-tool-intro .lead { font-size:17px; }
  .reply-workspace { padding:12px; border-radius:18px; }
  .reply-channel { gap:2px; padding:2px 0 12px; }
  .reply-channel button { padding:9px 12px; font-size:13px; }
  .reply-workspace-grid { border-radius:12px; }
  .reply-input-panel,.reply-output-panel { padding:20px 16px; }
  .reply-panel-heading h2 { font-size:21px; }
  .reply-settings { gap:12px; }
  .reply-more .reply-settings { grid-template-columns:1fr; }
  .reply-field textarea,.reply-field select { font-size:16px; }
  .reply-field select { padding-inline:9px 20px; }
  .reply-empty { padding:36px 0; }
  .reply-data-note { font-size:11px; }
  .reply-section-heading { margin-bottom:32px; text-align:left; }
  .reply-section-heading h2 { font-size:32px; }
  .reply-section-heading p { margin-top:16px; font-size:16px; }
  .reply-steps { display:flex; flex-direction:column; gap:28px; }
  .reply-steps li { display:flex; flex-direction:column; gap:14px; padding-top:20px; }
  .reply-steps h3 { font-size:23px; }
  .reply-mini-message { margin-right:16px; padding:20px; }
  .reply-mini-answer { margin-left:12px; padding:20px; gap:10px; }
  .reply-mini-answer p { font-size:15px; }
  .reply-faq .faq-list summary { font-size:16px; }
}
@media(max-width:400px) { .reply-settings { grid-template-columns:1fr; } }
@media(prefers-reduced-motion:reduce) { .reply-output-panel[aria-busy=true] .reply-status::before { animation:none; } }

/* The sections below the workspace follow the existing Use Cases module rhythm. */
.reply-allowance { font-size:12px; line-height:1.5; }
.reply-allowance:empty { display:none; }
.reply-result-download { width:fit-content; }
:root body.reply-tool-page main .reply-result-download.button { min-height:44px; padding:12px 16px; border-radius:var(--button-radius); font-size:13px; line-height:1.4; align-self:flex-start; max-width:100%; white-space:normal; text-align:center; text-decoration:none; }
.reply-app-intent { color:#56645b; font-size:12px; }
.reply-limit-download { display:inline-flex; width:fit-content; margin-top:16px; padding:11px 18px; border-radius:999px; background:#a3ed70; color:var(--ink); font-size:13px; }
.reply-cases { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); align-items:center; gap:64px; }
.reply-cases-copy h2,.reply-download-copy h2 { font-size:46px; line-height:1.12; letter-spacing:-.045em; }
.reply-cases-copy > p { margin-top:24px; font-size:17px; }
.reply-case-tabs { display:flex; flex-direction:column; align-items:stretch; margin-top:32px; border-top:1px solid var(--line); }
.reply-case-tabs button { padding:18px 12px; border:0; border-bottom:1px solid var(--line); background:transparent; color:var(--muted); font-size:16px; line-height:1.4; text-align:left; }
.reply-case-tabs button[aria-selected=true] { color:var(--ink); background:#eff4ef; }
.reply-case-stage { min-width:0; padding:32px; border-radius:28px; background:linear-gradient(130deg,#d3e3dc,#e5e3e8); }
.reply-case-stage article { display:flex; flex-direction:column; gap:20px; }
.reply-case-stage h3 { font-size:25px; line-height:1.25; }
.reply-case-message,.reply-case-goal { padding:20px 22px; border-radius:16px; background:#ffffffb3; }
.reply-case-stage span { color:#626e66; font-size:12px; }
.reply-case-stage p { color:var(--ink); font-size:15px; line-height:1.6; }
.reply-case-message p,.reply-case-goal p { margin-top:7px; }
.reply-case-answer { display:flex; gap:14px; padding:22px; border-radius:16px; background:#fff; }
.reply-case-answer img { flex-shrink:0; margin-top:4px; }
.reply-case-answer p { margin-top:8px; font-size:17px; }
.reply-case-stage .reply-case-why { color:#4d5b53; font-size:13px; }
.reply-case-use { align-self:flex-start; padding:11px 18px; border:1px solid #becfc3; border-radius:999px; background:#ffffffd9; color:var(--ink); font-size:13px; }
.reply-research .reply-section-heading { max-width:840px; margin-inline:auto; }
.reply-research-grid { display:grid; grid-template-columns:1fr 1fr; grid-template-rows:repeat(4,auto); gap:18px 64px; }
.reply-research-grid article { display:grid; grid-template-rows:subgrid; grid-row:1 / span 4; padding:32px 0; border-block:1px solid var(--line); }
.reply-research-number { color:#315541; font-size:64px; line-height:1.1; letter-spacing:-.055em; }
.reply-research-grid h3 { font-size:26px; }
.reply-research-grid article > p:not(.reply-research-number) { font-size:16px; }
.reply-research-grid a,.reply-native-link a,.reply-native-features > article > a,.reply-product-link { width:fit-content; color:var(--ink); font-size:14px; text-decoration:underline; text-underline-offset:5px; }
.reply-compare .reply-section-heading { max-width:900px; margin-inline:auto; }
.reply-comparison-scroll { overflow:auto; border-block:1px solid var(--line); border-radius:0; }
.reply-comparison-scroll table { width:100%; min-width:880px; border-collapse:collapse; font-size:14px; line-height:1.6; text-align:left; }
.reply-comparison-scroll caption { padding:18px 20px; color:var(--muted); font-size:12px; text-align:left; caption-side:bottom; }
.reply-comparison-scroll th,.reply-comparison-scroll td { padding:22px 20px; border-bottom:1px solid var(--line); vertical-align:top; }
.reply-comparison-scroll thead th { background:#edf3ee; font-weight:500; }
.reply-comparison-scroll tbody th { width:21%; font-weight:500; }
.reply-comparison-scroll tbody td { width:26.33%; color:var(--muted); }
.reply-comparison-scroll a { color:var(--ink); text-decoration:underline; text-underline-offset:4px; }
.reply-desktop-row { background:#f1f7ef; }
.reply-choice-copy { display:grid; grid-template-columns:1fr 1fr; gap:20px 48px; padding-top:40px; }
.reply-choice-copy h3 { grid-column:1 / -1; font-size:27px; }
.reply-choice-copy p { font-size:16px; }
.reply-native .reply-section-heading { max-width:850px; margin-inline:auto; }
.reply-native .relationship-workspace { background:linear-gradient(140deg,#d4e4db,#d8e0e2); }
.reply-native .relationship-copy > h3 { font-size:38px; line-height:1.12; }
.reply-native .relationship-copy > p { font-size:17px; line-height:1.6; }
.reply-native-link { margin-top:24px; text-align:center; }
.reply-native-features { display:grid; grid-template-columns:1fr 1fr; grid-template-rows:repeat(4,auto); gap:24px 64px; }
.reply-native-features > article { display:grid; grid-template-rows:subgrid; grid-row:1 / span 4; min-width:0; }
.reply-native-features h2 { font-size:38px; line-height:1.12; letter-spacing:-.04em; }
.reply-native-features > article > p { font-size:17px; line-height:1.6; }
.reply-native-features .usecase-style-art { margin:8px 0 0; padding:32px; background:linear-gradient(130deg,#e0e9db,#e7e4e6); }
.reply-native-features .usecase-style-window { width:100%; }
.reply-native-features .usecase-style-rules { margin-top:24px; }
.reply-native-features .usecase-style-rules li p { font-size:16px; }
.reply-app-workflow { display:flex; flex-direction:column; justify-content:center; gap:24px; margin-top:8px; padding:32px; border-radius:32px; background:linear-gradient(130deg,#dce8e2,#e2ddea); }
.reply-app-icons { display:flex; justify-content:center; gap:24px; }
.reply-app-workflow .reply-mini-message { padding:20px; margin-right:20px; }
.reply-app-workflow .reply-mini-message p { font-size:16px; }
.reply-app-workflow .reply-mini-answer { padding:20px; margin-left:16px; }
.reply-workflow-line { font-size:12px; text-align:center; }
.reply-tool-page main > .reply-download { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); gap:64px; align-items:center; padding:48px; border-radius:28px; background:linear-gradient(125deg,#d2e3dc,#e7e7de 50%,#e3dcec); }
.reply-download-copy h2 { margin-top:28px; }
.reply-download-copy > p { margin-top:24px; font-size:17px; }
.reply-product-link { display:inline-block; margin-top:24px; }
.reply-download-details { padding:32px; border-radius:20px; background:#ffffffe0; }
.reply-download-details > h3 { font-size:25px; line-height:1.3; }
.reply-download-details ul { display:grid; gap:16px; margin:28px 0 32px; padding-left:20px; font-size:15px; line-height:1.6; }
.reply-platform-downloads { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
:root body.reply-tool-page main .reply-platform-downloads .button { display:flex; min-height:52px; width:100%; padding:14px 16px; border-radius:999px; font-size:14px; text-align:center; }
.reply-platform-downloads > div > p { margin-top:10px; font-size:11px; text-align:center; }
.reply-download-size-note { margin-top:20px; font-size:11px; line-height:1.6; }
@media(max-width:1100px) {
  .reply-cases { grid-template-columns:1fr 1.15fr; gap:32px; }
  .reply-cases-copy h2,.reply-download-copy h2 { font-size:38px; }
  .reply-case-stage { padding:24px; }
  .reply-native-features { column-gap:32px; }
  .reply-tool-page main > .reply-download { gap:32px; padding:32px; }
  .reply-download-details { padding:24px; }
  .reply-platform-downloads { grid-template-columns:1fr; }
}
@media(max-width:850px) {
  .reply-cases { grid-template-columns:1fr; gap:32px; }
  .reply-case-tabs { flex-direction:row; flex-wrap:wrap; border:0; gap:8px; }
  .reply-case-tabs button { padding:11px 14px; border:1px solid var(--line); border-radius:999px; font-size:13px; }
  .reply-research-grid { column-gap:32px; }
  .reply-native-features { display:flex; flex-direction:column; gap:64px; }
  .reply-native-features > article { display:flex; flex-direction:column; gap:24px; }
  .reply-native-features .usecase-style-art { padding:40px; }
  .reply-native .relationship-layout { display:flex; flex-direction:column; align-items:stretch; gap:32px; }
  .reply-tool-page main > .reply-download { grid-template-columns:1fr; gap:40px; }
  .reply-platform-downloads { grid-template-columns:1fr 1fr; }
}
@media(max-width:600px) {
  .reply-cases-copy h2,.reply-download-copy h2,.reply-native-features h2,.reply-native .relationship-copy > h3 { font-size:32px; }
  .reply-cases-copy > p,.reply-native-features > article > p { font-size:16px; }
  .reply-case-stage { padding:24px 16px; border-radius:24px; }
  .reply-case-stage h3 { font-size:23px; }
  .reply-case-message,.reply-case-goal,.reply-case-answer { padding:18px; }
  .reply-case-answer p { font-size:16px; }
  .reply-research-grid { display:flex; flex-direction:column; gap:32px; }
  .reply-research-grid article { display:flex; flex-direction:column; gap:18px; padding:28px 0; }
  .reply-research-number { font-size:56px; }
  .reply-research-grid h3 { font-size:24px; }
  .reply-choice-copy { grid-template-columns:1fr; gap:20px; padding-top:32px; }
  .reply-choice-copy h3 { font-size:24px; }
  .reply-native-features .usecase-style-art,.reply-app-workflow { padding:24px 18px; }
  .reply-app-workflow .reply-mini-answer,.reply-app-workflow .reply-mini-message { margin:0; padding:18px; }
  .reply-tool-page main > .reply-download { padding:28px 20px; border-radius:24px; }
  .reply-download-details { padding:24px 18px; }
  .reply-platform-downloads { grid-template-columns:1fr; }
}

.reply-panel-heading > button { flex-shrink:0; white-space:nowrap; }

.tool-required { margin-left:8px; color:var(--muted); font-size:11px; font-weight:400; }
.tool-field-feedback { display:flex; flex-wrap:wrap; justify-content:space-between; gap:6px 14px; color:var(--muted); font-size:12px; line-height:1.5; }
.tool-field-hint { flex:1 1 210px; }
.tool-field-hint:empty { display:none; }
[data-input-count] { margin-left:auto; white-space:nowrap; font-variant-numeric:tabular-nums; }
.tool-input-warning { flex-basis:100%; color:#885a28; }
.tool-options-hint { margin-left:12px; color:var(--muted); font-size:12px; font-weight:400; }
.tool-shared-allowance { margin:16px 0 0; color:var(--muted); font-size:12px; line-height:1.6; }
.tool-kept-details { display:flex; flex-wrap:wrap; gap:8px; margin-top:20px; }
.tool-kept-details span { padding:4px 9px; border:1px solid #c6d7cc; border-radius:7px; color:#385744; font-size:13px; }
.reply-case-stage mark { background:#e0ecdf; color:inherit; border-radius:3px; padding:1px 2px; }
.tool-case-intent { margin-block:18px; }
.tool-case-intent span { font-size:12px; color:var(--muted); }
.tool-case-intent p { margin-top:6px; }
@media(max-width:600px) { .tool-options-hint { display:block; margin:4px 0 0; } }
.tool-edit-example { max-width:800px; margin:0 auto 24px; }
.tool-edit-example > p { color:var(--muted); font-size:15px; }
.tool-edit-example blockquote { margin:12px 0 28px; padding:16px 22px; border-left:3px solid #9ab6a3; font-size:21px; line-height:1.5; }

.reply-steps-with-captures { grid-template-rows:repeat(4,auto); }
.reply-steps-with-captures li { grid-row:1 / span 4; }
.tool-step-capture { display:flex; flex-direction:column; align-items:flex-start; align-self:start; gap:12px; width:100%; min-width:0; margin-top:8px; }
.tool-step-capture img { display:block; width:100%; max-width:500px; height:auto; border-radius:8px; }
@media(max-width:850px) {
  .reply-steps-with-captures { display:flex; flex-direction:column; gap:28px; }
  .reply-steps-with-captures li { display:flex; flex-direction:column; gap:14px; }
}

.reply-steps-cards { grid-template-rows:repeat(4,auto); gap:0 24px; }
.reply-steps-cards li { grid-row:1 / span 4; padding:0; border:1px solid #dfe5e2; border-radius:20px; background:#fff; min-width:0; }
.tool-step-illustration { display:grid; grid-template-rows:subgrid; grid-row:span 2; gap:16px; min-width:0; padding:24px 18px; border-radius:19px 19px 0 0; background:#edf3ef; }
.workflow-window { display:grid; grid-template-rows:subgrid; grid-row:span 2; gap:16px; justify-self:center; width:100%; max-width:330px; padding:16px; border:1px solid #dfe5e2; border-radius:13px; background:#fff; box-shadow:0 5px 18px #2445300a; }
.workflow-window-source { display:block; align-self:center; }
.workflow-panel-body { width:100%; display:flex; flex-direction:column; align-self:start; gap:14px; min-width:0; }
.workflow-guide-action { display:flex; align-items:flex-start; justify-content:flex-start; pointer-events:none; user-select:none; }
.workflow-modes { display:flex; gap:3px; padding:3px; border:1px solid #e0e7e2; border-radius:8px; background:#f5f8f6; font-size:10.5px; line-height:1.4; }
.workflow-modes span { flex:1; min-width:0; padding:6px 4px; border-radius:5px; text-align:center; }
.workflow-modes .is-active,.workflow-candidates .is-active { background:#e3eee5; color:#365941; }
.workflow-context-item + .workflow-context-item { padding-top:12px; border-top:1px solid #e8ede9; }
.workflow-field-label { display:flex; align-items:baseline; justify-content:space-between; gap:8px; color:var(--ink); font-size:11px; line-height:1.5; }
.workflow-field-label small { flex:none; color:var(--muted); font-size:9px; }
.workflow-placeholder { display:flex; flex-direction:column; gap:7px; padding-block:10px 2px; }
.workflow-placeholder i { display:block; width:88%; height:4px; border-radius:2px; background:#dfe7e2; }
.workflow-placeholder i:nth-child(2) { width:70%; }
.workflow-placeholder i:nth-child(3) { width:53%; }
.workflow-view { padding-bottom:2px; }
.workflow-option-pair { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:auto auto; gap:6px 12px; }
.workflow-option { display:grid; gap:6px; min-width:0; }
.workflow-option-pair .workflow-option { grid-template-rows:subgrid; grid-row:span 2; }
.workflow-option-label { display:flex; flex-direction:column; align-items:flex-start; gap:2px; color:var(--muted); font-size:11px; line-height:1.4; }
.workflow-option-label small { color:#62816c; font-size:9px; }
.workflow-option-value { display:flex; align-items:center; justify-content:space-between; gap:8px; min-width:0; min-height:34px; padding:8px 10px; border:1px solid #dce5df; border-radius:8px; color:var(--ink); font-size:12px; line-height:1.4; }
.workflow-option-value span { min-width:0; }
.workflow-option-value svg { flex:none; width:12px; height:12px; color:var(--muted); }
.workflow-candidates { display:flex; gap:6px; }
.workflow-candidates span { flex:1; padding:6px 8px; border:1px solid #e0e7e2; border-radius:7px; background:#fff; color:var(--muted); font-size:11px; line-height:1.4; text-align:center; }
.workflow-draft-symbol { padding-block:6px 10px; }
.workflow-evidence { display:flex; flex-direction:column; gap:7px; }
.workflow-context-symbol { padding:0 0 4px 10px; border-left:2px solid #9ab6a3; }
:root body.reply-tool-page .tool-step-illustration .workflow-key { display:inline-flex; align-items:center; justify-content:center; gap:8px; max-width:100%; min-height:42px; padding:10px 16px; border-radius:var(--button-radius); font-size:13px; line-height:1.4; text-align:center; }
.workflow-key svg { flex:none; width:16px; height:16px; }
.workflow-key-secondary { border:1px solid #cbd6cf; background:#fff; color:var(--ink); }
.reply-steps-cards .workflow-step-heading { display:flex; align-items:baseline; gap:12px; min-width:0; margin:22px 22px 0; font-size:23px; line-height:1.25; }
.workflow-step-heading > .reply-step-number { flex:none; font-size:12px; }
.workflow-step-heading > span:last-child { min-width:0; }
.reply-steps-cards > li > p { margin:12px 22px 24px; }
@media(max-width:1050px) {
  .reply-steps.reply-steps-cards { display:flex; flex-direction:column; gap:24px; max-width:560px; margin-inline:auto; }
  .reply-steps-cards li { display:flex; flex-direction:column; gap:0; }
  .tool-step-illustration { display:flex; flex-direction:column; align-items:center; padding:24px; }
  .workflow-window { display:flex; flex-direction:column; gap:16px; }
  .workflow-window-source { align-self:center; }
}
@media(max-width:400px) {
  .tool-step-illustration { padding:18px 14px; }
  .workflow-window { padding:14px; }
  .reply-steps-cards .workflow-step-heading { margin-inline:18px; font-size:21px; }
  .reply-steps-cards > li > p { margin-inline:18px; }
}

.workflow-settings-heading { padding-top:2px; }
.workflow-refinements { display:flex; flex-wrap:wrap; gap:6px; }
.workflow-refinements span { padding:6px 9px; border:1px solid #dce5df; border-radius:var(--button-radius); color:var(--ink); font-size:10px; line-height:1.4; }
.workflow-inline-copy { display:inline-flex; align-items:center; gap:4px; color:var(--muted); font-size:9px; }
.workflow-inline-copy svg { flex:none; width:11px; height:11px; }
.workflow-change { display:flex; align-items:center; gap:10px; color:var(--muted); font-size:9px; }
.workflow-change > .workflow-placeholder { flex:1; padding-block:4px; }

/* Related content stays close; section boundaries use a separate responsive rhythm. */
.reply-tool-page:not(:has([data-tool-id="keigo-converter"])):has(.reply-steps-cards) { --usecase-gap:clamp(96px,10.8vw,156px); }
.reply-tool-page:not(:has([data-tool-id="keigo-converter"])):has(.reply-steps-cards) .reply-section-heading { margin-bottom:clamp(28px,3vw,44px); }
.reply-tool-page:not(:has([data-tool-id="keigo-converter"])) .reply-desktop-link { display:inline-block; margin-top:20px; color:var(--ink); font-size:14px; text-decoration:underline; text-underline-offset:5px; }
.reply-tool-page:not(:has([data-tool-id="keigo-converter"])) .reply-native:has(.reply-desktop-cta) .reply-section-heading { text-align:center; }
:root body.reply-tool-page:not(:has([data-tool-id="keigo-converter"])) main .reply-desktop-cta.button { display:table; width:fit-content; max-width:100%; min-height:48px; margin:24px auto 0; padding:13px 22px; border-radius:var(--button-radius); font-size:15px; line-height:1.4; white-space:normal; text-align:center; }
.reply-tool-page:not(:has([data-tool-id="keigo-converter"])) .reply-comparison-scroll .reply-desktop-row > * { background:#edf4ed; }
.reply-tool-page:not(:has([data-tool-id="keigo-converter"])) .reply-choice-copy > p:only-of-type { grid-column:1 / -1; max-width:840px; }

.reply-tool-page:not(:has([data-tool-id="keigo-converter"])) .relationship-demo[data-circle-view=table] .relationship-map { display:none; }
@media(max-width:600px) {
  .reply-tool-page:not(:has([data-tool-id="keigo-converter"])) .reply-native:has(.reply-desktop-cta) .reply-section-heading h2 { font-size:clamp(25px,7vw,32px); }
  .reply-tool-page:not(:has([data-tool-id="keigo-converter"])) .relationship-table th:nth-child(2),.reply-tool-page:not(:has([data-tool-id="keigo-converter"])) .relationship-table td:nth-child(2) { display:table-cell; }
  .reply-tool-page:not(:has([data-tool-id="keigo-converter"])) .relationship-table th:first-child { width:30%; }
  .reply-tool-page:not(:has([data-tool-id="keigo-converter"])) .relationship-table th:nth-child(2) { width:38%; }
  .reply-tool-page:not(:has([data-tool-id="keigo-converter"])) .relationship-table th:last-child { width:32%; }
  .reply-tool-page:not(:has([data-tool-id="keigo-converter"])) .relationship-table th,.reply-tool-page:not(:has([data-tool-id="keigo-converter"])) .relationship-table td { padding-inline:5px; overflow-wrap:anywhere; }
  .reply-tool-page:not(:has([data-tool-id="keigo-converter"])) .wispr-leading-feature .relationship-copy { display:flex; flex-direction:column; gap:16px; order:0; }
  .reply-tool-page:not(:has([data-tool-id="keigo-converter"])) .wispr-leading-feature .relationship-copy > .wispr-relationship-title,.reply-tool-page:not(:has([data-tool-id="keigo-converter"])) .wispr-leading-feature .relationship-intro { margin:0; }
  .reply-tool-page:not(:has([data-tool-id="keigo-converter"])) .relationship-table th > button { flex-direction:column; align-items:flex-start; gap:5px; }
  .reply-tool-page:not(:has([data-tool-id="keigo-converter"])) .relationship-table th small { overflow-wrap:normal; }
}
.reply-tool-page:not(:has([data-tool-id="keigo-converter"])) #reply-native-title { scroll-margin-top:112px; }

.reply-related { text-align:center; }
.reply-related h2 { font-size:32px; line-height:1.2; letter-spacing:-.03em; }
.reply-related > div { display:flex; justify-content:center; flex-wrap:wrap; gap:16px 28px; margin-top:24px; }
.reply-related a { color:var(--ink); font-size:15px; text-decoration:underline; text-underline-offset:5px; }
.reply-related a:focus-visible { outline:2px solid #52735c; outline-offset:3px; }
@media(max-width:600px) { .reply-related h2 { font-size:28px; } }

.tool-shared-allowance:empty { display:none; }
