:root {
  --ink: #18201f;
  --muted: #64716d;
  --line: #dfe7e3;
  --paper: #fbfdfb;
  --green: #0f7259;
  --green-dark: #0a5845;
  --green-pale: #e7f3ee;
  --coral: #ec6c4d;
  --shadow: 0 24px 70px rgba(31, 63, 53, 0.1);
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  scrollbar-gutter: stable;
}

body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: Inter, "PingFang SC", "Microsoft YaHei", "Noto Sans SC", sans-serif;
  -webkit-font-smoothing: antialiased;
}

button,
input,
select {
  font: inherit;
}

button,
a {
  -webkit-tap-highlight-color: transparent;
}

a {
  color: inherit;
  text-decoration: none;
}

.page-panel[hidden] {
  display: none;
}

main {
  min-height: calc(100vh - 76px);
}

.page-panel.active {
  animation: panel-appear 0.18s ease-out;
}

@keyframes panel-appear {
  from { opacity: 0.86; }
  to { opacity: 1; }
}

.site-header {
  position: sticky;
  z-index: 20;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 76px;
  padding: 0 clamp(24px, 5vw, 80px);
  border-bottom: 1px solid rgba(223, 231, 227, 0.9);
  background: rgba(251, 253, 251, 0.9);
  backdrop-filter: blur(18px);
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.6px;
}

.brand > span:last-child > span {
  color: var(--green);
}

.brand-mark {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border-radius: 11px 11px 11px 3px;
  color: white;
  background: var(--green);
  font-family: Georgia, serif;
  font-size: 21px;
  font-style: italic;
}

.desktop-nav {
  display: flex;
  align-items: center;
  gap: clamp(24px, 3vw, 48px);
}

.desktop-nav a {
  position: relative;
  padding: 29px 0 25px;
  color: #45504d;
  font-size: 15px;
  font-weight: 500;
  transition: color 0.2s ease;
}

.desktop-nav a:hover,
.desktop-nav a.active {
  color: var(--green);
}

.desktop-nav a.active::after {
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 100%;
  height: 2px;
  border-radius: 2px;
  background: var(--green);
  content: "";
}

.header-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.text-button,
.login-button,
.menu-button {
  border: 0;
  cursor: pointer;
}

.text-button {
  padding: 11px 14px;
  color: #48524f;
  background: transparent;
}

.login-button {
  padding: 11px 18px;
  border-radius: 10px;
  color: white;
  background: var(--ink);
  font-weight: 600;
  transition: transform 0.2s ease, background 0.2s ease;
}

.login-button:hover {
  transform: translateY(-1px);
  background: var(--green);
}

.menu-button {
  display: none;
  width: 42px;
  height: 42px;
  padding: 11px 9px;
  border-radius: 10px;
  background: var(--green-pale);
}

.menu-button span {
  display: block;
  height: 2px;
  margin: 4px 0;
  border-radius: 3px;
  background: var(--green-dark);
}

.hero {
  position: relative;
  min-height: 620px;
  overflow: hidden;
  padding: 82px 24px 62px;
  border-bottom: 1px solid var(--line);
  background:
    linear-gradient(rgba(15, 114, 89, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15, 114, 89, 0.035) 1px, transparent 1px),
    #f4f9f6;
  background-size: 48px 48px;
}

.hero::after {
  position: absolute;
  right: -60px;
  bottom: -170px;
  width: 420px;
  height: 420px;
  border: 1px solid rgba(15, 114, 89, 0.16);
  border-radius: 50%;
  box-shadow: 0 0 0 42px rgba(15, 114, 89, 0.025), 0 0 0 90px rgba(15, 114, 89, 0.018);
  content: "";
}

.hero-inner {
  position: relative;
  z-index: 2;
  width: min(1120px, 100%);
  margin: 0 auto;
  text-align: center;
}

.hero-glow {
  position: absolute;
  border-radius: 50%;
  filter: blur(3px);
}

.hero-glow-one {
  top: 80px;
  left: -90px;
  width: 280px;
  height: 280px;
  background: radial-gradient(circle, rgba(236, 108, 77, 0.13), transparent 68%);
}

.hero-glow-two {
  top: -130px;
  right: 8%;
  width: 350px;
  height: 350px;
  background: radial-gradient(circle, rgba(15, 114, 89, 0.13), transparent 68%);
}

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 18px;
  color: var(--green);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1.8px;
}

.eyebrow span {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--coral);
  box-shadow: 0 0 0 5px rgba(236, 108, 77, 0.12);
}

h1 {
  margin: 0;
  font-family: Georgia, "Noto Serif SC", serif;
  font-size: clamp(48px, 6.5vw, 76px);
  font-weight: 500;
  line-height: 1.08;
  letter-spacing: -3px;
}

h1 em {
  color: var(--green);
  font-style: normal;
}

.hero-copy {
  max-width: 600px;
  margin: 24px auto 34px;
  color: var(--muted);
  font-size: 17px;
  line-height: 1.8;
}

.composer-card {
  max-width: 960px;
  margin: 0 auto;
  padding: 10px;
  border: 1px solid rgba(203, 216, 210, 0.86);
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: var(--shadow);
  text-align: left;
}

.composer-tabs {
  display: flex;
  gap: 4px;
  padding: 2px 4px 10px;
}

.language-tab {
  padding: 8px 13px;
  border: 0;
  border-radius: 8px;
  color: #71807b;
  background: transparent;
  cursor: pointer;
  font-size: 13px;
  font-weight: 600;
}

.language-tab.active {
  color: var(--green-dark);
  background: var(--green-pale);
}

.composer-body {
  display: grid;
  grid-template-columns: 0.85fr 2.2fr auto;
  gap: 8px;
}

.field {
  display: flex;
  min-width: 0;
  padding: 10px 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: white;
  flex-direction: column;
  gap: 3px;
}

.field > span {
  color: #89938f;
  font-size: 11px;
  font-weight: 600;
}

.field input,
.field select {
  min-width: 0;
  height: 25px;
  padding: 0;
  border: 0;
  outline: 0;
  color: var(--ink);
  background: transparent;
  font-size: 14px;
  font-weight: 500;
}

.field input::placeholder {
  color: #a4aeaa;
}

.primary-button {
  display: flex;
  min-width: 144px;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 0 22px;
  border: 0;
  border-radius: 12px;
  color: white;
  background: var(--green);
  cursor: pointer;
  font-weight: 600;
  box-shadow: 0 10px 20px rgba(15, 114, 89, 0.18);
  transition: transform 0.2s ease, background 0.2s ease;
}

.primary-button:hover {
  transform: translateY(-2px);
  background: var(--green-dark);
}

.primary-button svg {
  width: 18px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}

.form-message {
  display: none;
  margin: 10px 8px 2px;
  color: var(--coral);
  font-size: 13px;
  text-align: center;
}

.form-message.visible {
  display: block;
}

.form-message.success {
  color: var(--green);
}

.trust-row {
  display: flex;
  justify-content: center;
  gap: 28px;
  margin-top: 25px;
  color: #65736e;
  font-size: 13px;
}

.trust-row i {
  display: inline-grid;
  width: 18px;
  height: 18px;
  margin-right: 5px;
  place-items: center;
  border-radius: 50%;
  color: var(--green);
  background: #dceee6;
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
}

.tool-section {
  width: min(1320px, calc(100% - 48px));
  margin: 0 auto;
  padding: 86px 0 100px;
}

.section-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 30px;
}

.section-heading h2,
.support-card h2 {
  margin: 6px 0 0;
  font-family: Georgia, "Noto Serif SC", serif;
  font-size: clamp(30px, 4vw, 42px);
  font-weight: 500;
  letter-spacing: -1.5px;
}

.section-heading > p {
  max-width: 380px;
  margin: 0 0 4px;
  color: var(--muted);
  line-height: 1.7;
}

.section-kicker {
  margin: 0;
  color: var(--coral);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2px;
}

.audience-tabs {
  display: flex;
  gap: 8px;
  margin: 34px 0 28px;
  padding-bottom: 4px;
  overflow-x: auto;
  scrollbar-width: none;
}

.audience-tabs::-webkit-scrollbar {
  display: none;
}

.audience-tab {
  flex: 0 0 auto;
  padding: 10px 16px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: #68746f;
  background: white;
  cursor: pointer;
  font-size: 13px;
  transition: all 0.2s ease;
}

.audience-tab:hover,
.audience-tab.active {
  border-color: var(--ink);
  color: white;
  background: var(--ink);
}

.tools-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}

.tool-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.tool-card {
  position: relative;
  min-height: 254px;
  padding: 25px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: white;
  transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}

.tool-card::after {
  position: absolute;
  right: -35px;
  bottom: -50px;
  width: 120px;
  height: 120px;
  border: 1px solid rgba(15, 114, 89, 0.08);
  border-radius: 50%;
  content: "";
}

.tool-card:hover,
.tool-card:focus {
  z-index: 2;
  transform: translateY(-5px);
  border-color: #bdd4ca;
  outline: none;
  box-shadow: 0 18px 40px rgba(32, 66, 55, 0.1);
}

.tool-card.hidden {
  display: none;
}

.tool-icon {
  display: grid;
  width: 45px;
  height: 45px;
  place-items: center;
  border-radius: 13px;
}

.tool-icon svg {
  width: 23px;
  height: 23px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.7;
}

.tool-icon.coral { color: #c95038; background: #fbe9e4; }
.tool-icon.blue { color: #3e6fb0; background: #e8f0fa; }
.tool-icon.violet { color: #7053a6; background: #eeeafb; }
.tool-icon.green { color: #28775d; background: #e3f3eb; }
.tool-icon.amber { color: #9b6b1d; background: #faf0d8; }
.tool-icon.cyan { color: #267889; background: #e0f2f4; }
.tool-icon.pink { color: #a64e6d; background: #f8e6ed; }
.tool-icon.indigo { color: #515e9b; background: #e8eaf8; }
.tool-icon.orange { color: #a95832; background: #f8e9df; }

.tool-card .tag {
  position: absolute;
  top: 28px;
  right: 22px;
  padding: 4px 9px;
  border-radius: 999px;
  color: #ae462f;
  background: #fde9e4;
  font-size: 10px;
  font-weight: 700;
}

.tool-card h3 {
  margin: 20px 0 9px;
  font-size: 18px;
  font-weight: 600;
}

.tool-card p {
  min-height: 42px;
  margin: 0;
  color: #74807c;
  font-size: 13px;
  line-height: 1.65;
}

.tool-card a {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-top: 18px;
  color: var(--green);
  font-size: 13px;
  font-weight: 600;
}

.tool-card a span {
  transition: transform 0.2s ease;
}

.tool-card:hover a span {
  transform: translateX(4px);
}

.support-card {
  position: sticky;
  top: 102px;
  min-height: 430px;
  padding: 30px;
  overflow: hidden;
  border-radius: 18px;
  color: white;
  background: #163f36;
  box-shadow: 0 20px 45px rgba(17, 58, 48, 0.18);
}

.support-card::before {
  position: absolute;
  right: -80px;
  bottom: -110px;
  width: 260px;
  height: 260px;
  border-radius: 50%;
  background: #1d5949;
  content: "";
}

.support-art {
  position: relative;
  width: 100%;
  height: 115px;
  margin-bottom: 22px;
}

.support-bubble {
  position: absolute;
  top: 15px;
  right: 35px;
  display: grid;
  width: 74px;
  height: 74px;
  place-items: center;
  border-radius: 50% 50% 50% 18%;
  color: #17463a;
  background: #f3c565;
  font-family: Georgia, serif;
  font-size: 38px;
  font-weight: 700;
  transform: rotate(7deg);
}

.orbit {
  position: absolute;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 50%;
}

.orbit-one {
  top: -34px;
  right: -5px;
  width: 160px;
  height: 160px;
}

.orbit-two {
  top: 6px;
  right: 35px;
  width: 82px;
  height: 82px;
  box-shadow: 0 0 0 26px rgba(255, 255, 255, 0.03);
}

.support-card .section-kicker {
  color: #f3c565;
}

.support-card h2 {
  position: relative;
  margin-top: 10px;
  font-size: 31px;
  line-height: 1.2;
  letter-spacing: -0.8px;
}

.support-card > p:not(.section-kicker) {
  position: relative;
  color: rgba(255, 255, 255, 0.68);
  font-size: 13px;
  line-height: 1.7;
}

.support-card > button {
  position: relative;
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  margin-top: 23px;
  padding: 13px 16px;
  border: 0;
  border-radius: 10px;
  color: #153c33;
  background: #f3c565;
  cursor: pointer;
  font-weight: 700;
}

.support-links {
  position: relative;
  display: flex;
  justify-content: space-between;
  margin-top: 18px;
  color: rgba(255, 255, 255, 0.74);
  font-size: 12px;
}

.support-links a:hover {
  color: white;
}

footer {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 20px;
  padding: 34px clamp(24px, 5vw, 80px);
  border-top: 1px solid var(--line);
  color: #84908c;
  background: white;
  font-size: 12px;
}

.footer-brand {
  color: var(--ink);
  font-size: 17px;
}

.footer-brand .brand-mark {
  width: 28px;
  height: 28px;
  border-radius: 8px 8px 8px 2px;
  font-size: 16px;
}

footer p {
  margin: 0;
}

footer p:last-child {
  justify-self: end;
}

.outline-subsection-row[data-level="3"] { margin-left: 22px; border-left: 2px solid var(--line); padding-left: 10px; }
.outline-add-child { flex: 0 0 auto; border: 0; background: transparent; color: var(--green); font-size: 13px; cursor: pointer; padding: 6px; }
.outline-add-child[hidden] { display: none; }
@media (max-width: 700px) { .outline-subsection-row[data-level="3"] { margin-left: 10px; } }

.floating-support {
  position: fixed;
  z-index: 40;
  top: 50%;
  right: 0;
  left: auto;
  width: 78px;
  height: 116px;
  max-width: calc(100vw - 8px);
  max-height: calc(100dvh - 16px);
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 18px 0 0 18px;
  color: white;
  background: #153f35;
  box-shadow: 0 16px 40px rgba(20, 58, 49, 0.24);
  transform: translateY(-50%);
  transition: width 0.28s ease, height 0.28s ease, box-shadow 0.28s ease, transform 0.28s ease;
  isolation: isolate;
}

.floating-support::before {
  position: absolute;
  z-index: -1;
  right: -48px;
  bottom: -62px;
  width: 150px;
  height: 150px;
  border-radius: 50%;
  background: #1d5949;
  content: "";
}

.floating-support:hover,
.floating-support.expanded,
.floating-support:focus-within {
  width: 216px;
  height: 260px;
  box-shadow: 0 24px 60px rgba(20, 58, 49, 0.32);
}

.floating-support.dragging {
  cursor: grabbing;
  transition: none;
}

.support-drag-handle {
  position: absolute;
  z-index: 3;
  top: 0;
  left: 0;
  display: flex;
  width: 100%;
  height: 25px;
  align-items: center;
  justify-content: center;
  gap: 3px;
  border: 0;
  color: inherit;
  background: rgba(255, 255, 255, 0.06);
  cursor: grab;
  touch-action: none;
}

.support-drag-handle:active {
  cursor: grabbing;
}

.support-drag-handle span {
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.5);
}

.support-trigger {
  position: absolute;
  z-index: 2;
  top: 25px;
  left: 0;
  display: flex;
  width: 78px;
  height: 91px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 9px 7px 12px;
  border: 0;
  color: white;
  background: transparent;
  cursor: pointer;
  flex-direction: column;
}

.support-avatar {
  position: relative;
  display: grid;
  width: 38px;
  height: 38px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 12px 12px 12px 4px;
  color: #17463a;
  background: #f3c565;
}

.support-avatar svg {
  width: 23px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.7;
}

.support-avatar i {
  position: absolute;
  top: -2px;
  right: -2px;
  width: 9px;
  height: 9px;
  border: 2px solid #153f35;
  border-radius: 50%;
  background: #62d594;
}

.support-summary-label {
  white-space: nowrap;
  font-size: 12px;
  font-weight: 600;
}

.floating-support:hover .support-trigger,
.floating-support.expanded .support-trigger,
.floating-support:focus-within .support-trigger {
  top: 36px;
  left: 18px;
  width: auto;
  height: 42px;
  padding: 0;
  justify-content: flex-start;
  flex-direction: row;
}

.floating-support-content {
  position: absolute;
  display: flex;
  flex-direction: column;
  gap: 8px;
  top: 91px;
  bottom: 14px;
  left: 14px;
  right: 14px;
  overflow-y: auto;
  overflow-anchor: none;
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity 0.18s ease 0.05s, transform 0.22s ease 0.05s, visibility 0s linear 0.25s;
}

.floating-support:hover .floating-support-content,
.floating-support.expanded .floating-support-content,
.floating-support:focus-within .floating-support-content {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  transition-delay: 0.08s;
}

.contact-support {
  display: flex;
  flex: 0 0 44px;
  width: 100%;
  height: 44px;
  min-height: 44px;
  align-items: center;
  justify-content: space-between;
  margin: 0;
  padding: 10px 12px;
  border: 0;
  border-radius: 9px;
  color: #153f35;
  background: #f3c565;
  cursor: pointer;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
}

.contact-support b {
  font-size: 14px;
}

.contact-support:hover { color: #153f35; background: #ffda86; }
.contact-support:focus-visible { outline: 2px solid white; outline-offset: -4px; }
.service-page {
  min-height: calc(100vh - 76px);
  padding: 72px clamp(24px, 6vw, 96px) 96px;
  background:
    linear-gradient(rgba(15, 114, 89, 0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15, 114, 89, 0.03) 1px, transparent 1px),
    #f5f9f7;
  background-size: 48px 48px;
}

.service-hero {
  display: grid;
  width: min(1160px, 100%);
  min-height: 510px;
  margin: 0 auto;
  align-items: start;
  grid-template-columns: minmax(0, 0.9fr) minmax(420px, 1.1fr);
  gap: clamp(48px, 7vw, 96px);
}

.service-intro {
  padding-top: 58px;
}

.service-intro h1 {
  margin: 12px 0 22px;
  font-size: clamp(46px, 5vw, 68px);
}

.service-intro > p:not(.section-kicker) {
  max-width: 520px;
  margin: 0;
  color: var(--muted);
  font-size: 17px;
  line-height: 1.85;
}

.service-pills {
  display: flex;
  gap: 10px;
  margin-top: 30px;
  flex-wrap: wrap;
}

.service-pills span {
  padding: 8px 11px;
  border: 1px solid #d6e4de;
  border-radius: 999px;
  color: #54635e;
  background: rgba(255, 255, 255, 0.64);
  font-size: 12px;
}

.service-pills i {
  margin-right: 4px;
  color: var(--green);
  font-style: normal;
  font-weight: 700;
}

.action-card {
  min-height: 455px;
  padding: 28px;
  border: 1px solid rgba(206, 219, 213, 0.9);
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: var(--shadow);
}

.action-tabs {
  display: flex;
  gap: 6px;
  margin-bottom: 20px;
  padding: 5px;
  border-radius: 11px;
  background: #edf3f0;
}

.action-tabs button {
  width: 50%;
  padding: 10px;
  border: 0;
  border-radius: 8px;
  color: var(--muted);
  background: transparent;
  cursor: pointer;
  font-size: 13px;
  font-weight: 600;
}

.action-tabs button.active {
  color: var(--green-dark);
  background: white;
  box-shadow: 0 4px 12px rgba(27, 63, 52, 0.08);
}

.upload-zone {
  display: flex;
  min-height: 150px;
  align-items: center;
  justify-content: center;
  border: 1px dashed #acc9bd;
  border-radius: 14px;
  background: #f7fbf9;
  cursor: pointer;
  flex-direction: column;
  transition: border-color 0.2s ease, background 0.2s ease;
}

.upload-zone:hover {
  border-color: var(--green);
  background: #f0f8f4;
}

.upload-zone input,
.compact-upload input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.upload-zone strong {
  margin-top: 9px;
  font-size: 14px;
}

.upload-zone small {
  margin-top: 5px;
  color: #8a9692;
  font-size: 11px;
}

.upload-icon {
  display: grid;
  width: 39px;
  height: 39px;
  place-items: center;
  border-radius: 12px;
  color: white;
  background: var(--green);
  font-size: 22px;
}

.action-divider {
  position: relative;
  margin: 16px 0;
  color: #a1aaa7;
  font-size: 10px;
  text-align: center;
}

.action-divider::before {
  position: absolute;
  z-index: 0;
  top: 50%;
  right: 0;
  left: 0;
  height: 1px;
  background: var(--line);
  content: "";
}

.action-divider span {
  position: relative;
  z-index: 1;
  padding: 0 10px;
  background: white;
}

.action-card textarea {
  width: 100%;
  min-height: 92px;
  padding: 13px;
  resize: vertical;
  border: 1px solid var(--line);
  border-radius: 11px;
  outline: none;
  color: var(--ink);
  background: #fcfdfc;
  font: inherit;
  font-size: 13px;
  line-height: 1.6;
}

.action-card textarea:focus,
.mini-field:focus-within {
  border-color: #8fb9aa;
  box-shadow: 0 0 0 3px rgba(15, 114, 89, 0.08);
}

.service-button {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin-top: 14px;
  padding: 14px 20px;
  border: 0;
  border-radius: 11px;
  color: white;
  background: var(--green);
  cursor: pointer;
  font-weight: 600;
  transition: transform 0.2s ease, filter 0.2s ease;
}

.service-button:hover {
  transform: translateY(-2px);
  filter: brightness(0.94);
}

.simple-features {
  display: grid;
  width: min(1160px, 100%);
  margin: 60px auto 0;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid var(--line);
}

.simple-features article {
  position: relative;
  padding: 30px 34px 4px 0;
}

.simple-features article + article {
  padding-left: 34px;
  border-left: 1px solid var(--line);
}

.simple-features span {
  color: var(--coral);
  font-family: Georgia, serif;
  font-size: 13px;
  font-style: italic;
}

.simple-features h3 {
  margin: 8px 0;
  font-size: 17px;
}

.simple-features p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.65;
}

.aigc-theme {
  --page-accent: #6755a5;
}

.aigc-theme .section-kicker {
  color: var(--page-accent);
}

.score-preview {
  display: flex;
  max-width: 380px;
  align-items: center;
  gap: 16px;
  margin-top: 32px;
  padding: 14px;
  border: 1px solid #ded9ef;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.72);
}

.score-ring {
  display: grid;
  width: 62px;
  height: 62px;
  place-items: center;
  border: 5px solid #dcd5f2;
  border-top-color: #6755a5;
  border-radius: 50%;
  color: #514080;
  grid-template-columns: auto auto;
  align-content: center;
}

.score-ring strong {
  font-size: 18px;
}

.score-ring small {
  font-size: 9px;
}

.score-preview > div:last-child {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.score-preview > div:last-child span {
  color: var(--muted);
  font-size: 11px;
}

.action-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 18px;
  font-size: 15px;
  font-weight: 600;
}

.action-title small {
  color: #8c9793;
  font-size: 11px;
  font-weight: 400;
}

.live-dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: 5px;
  border-radius: 50%;
  background: #6755a5;
  box-shadow: 0 0 0 4px #eeeafb;
}

.action-card textarea.large-textarea {
  min-height: 260px;
}

.textarea-meta {
  display: flex;
  justify-content: space-between;
  margin-top: 8px;
  color: #98a19e;
  font-size: 10px;
}

.violet-button {
  background: #6755a5;
}

.review-theme {
  --page-accent: #c55d42;
}

.review-list {
  display: grid;
  max-width: 440px;
  gap: 8px;
  margin-top: 30px;
}

.review-list span {
  padding: 11px 13px;
  border-left: 2px solid #e5a08e;
  color: #65716d;
  background: rgba(255, 255, 255, 0.55);
  font-size: 13px;
}

.review-list b {
  display: inline-block;
  width: 52px;
  color: #a84e38;
}

.review-card {
  display: grid;
  gap: 12px;
}

.review-card .action-title {
  margin-bottom: 5px;
}

.mini-field {
  display: flex;
  padding: 10px 13px;
  border: 1px solid var(--line);
  border-radius: 11px;
  flex-direction: column;
  gap: 4px;
}

.mini-field span {
  color: #89938f;
  font-size: 10px;
  font-weight: 600;
}

.mini-field input,
.mini-field select {
  height: 25px;
  padding: 0;
  border: 0;
  outline: 0;
  color: var(--ink);
  background: transparent;
  font-size: 13px;
}

.compact-upload {
  display: flex;
  min-height: 90px;
  align-items: center;
  gap: 13px;
  padding: 15px;
  border: 1px dashed #d3aaa0;
  border-radius: 11px;
  background: #fffaf8;
  cursor: pointer;
}

.compact-upload > span {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border-radius: 10px;
  color: white;
  background: #c55d42;
  font-size: 20px;
}

.compact-upload div {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.compact-upload strong {
  font-size: 13px;
}

.compact-upload small {
  color: #969e9b;
  font-size: 10px;
}

.dark-button {
  margin-top: 2px;
  background: var(--ink);
}

@media (max-width: 1050px) {
  .desktop-nav {
    gap: 20px;
  }

  .desktop-nav a[data-page="ai-review"] {
    display: none;
  }

  .tools-layout {
    grid-template-columns: 1fr;
  }

  .support-card {
    position: relative;
    top: 0;
    min-height: 330px;
  }

  .support-art {
    position: absolute;
    top: 40px;
    right: 30px;
    width: 190px;
  }

  .support-card h2,
  .support-card > p:not(.section-kicker),
  .support-card > button,
  .support-links {
    max-width: 52%;
  }
}

@media (max-width: 780px) {
  .site-header {
    height: 66px;
    padding: 0 18px;
  }

  main {
    min-height: calc(100vh - 66px);
  }

  .desktop-nav {
    position: absolute;
    top: 66px;
    right: 14px;
    left: 14px;
    display: none;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: white;
    box-shadow: var(--shadow);
    flex-direction: column;
    align-items: stretch;
    gap: 0;
  }

  .desktop-nav.open {
    display: flex;
  }

  .desktop-nav a,
  .desktop-nav a[data-page="ai-review"] {
    display: block;
    padding: 12px 14px;
  }

  .desktop-nav a.active::after {
    display: none;
  }

  .text-button {
    display: none;
  }

  .login-button {
    padding: 9px 12px;
    font-size: 13px;
  }

  .menu-button {
    display: block;
  }

  .hero {
    min-height: 600px;
    padding: 62px 18px 48px;
  }

  h1 {
    font-size: clamp(40px, 12vw, 57px);
    letter-spacing: -2px;
  }

  .hero-copy {
    margin: 20px auto 28px;
    font-size: 15px;
  }

  .composer-card {
    padding: 9px;
  }

  .composer-body {
    grid-template-columns: 1fr;
  }

  .field {
    padding: 9px 13px;
  }

  .primary-button {
    min-height: 52px;
  }

  .trust-row {
    gap: 10px 18px;
    flex-wrap: wrap;
  }

  .tool-section {
    width: min(100% - 32px, 700px);
    padding: 64px 0 72px;
  }

  .section-heading {
    align-items: start;
    flex-direction: column;
    gap: 14px;
  }

  .section-heading > p {
    font-size: 14px;
  }

  .tool-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  footer {
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
  }

  footer p:last-child {
    justify-self: center;
  }

  .service-page {
    min-height: calc(100vh - 66px);
    padding: 54px 20px 72px;
  }

  .service-hero {
    min-height: auto;
    grid-template-columns: 1fr;
    gap: 36px;
  }

  .service-intro {
    padding-top: 0;
  }

  .action-card {
    min-height: 0;
  }

  .service-intro h1 {
    font-size: clamp(40px, 11vw, 56px);
    letter-spacing: -2px;
  }

  .service-intro > p:not(.section-kicker) {
    font-size: 15px;
  }

  .simple-features {
    margin-top: 46px;
    grid-template-columns: 1fr;
  }

  .simple-features article,
  .simple-features article + article {
    padding: 24px 0;
    border-bottom: 1px solid var(--line);
    border-left: 0;
  }

  .floating-support {
    right: 0;
    width: 68px;
    height: 106px;
    border-radius: 16px 0 0 16px;
  }

  .floating-support:hover:not(.expanded):not(:focus-within) {
    width: 68px;
    height: 106px;
  }

  .floating-support.expanded,
  .floating-support:focus-within {
    width: 216px;
    height: 260px;
  }

  .support-trigger {
    width: 68px;
    height: 81px;
  }
}

@media (max-width: 520px) {
  .brand {
    font-size: 19px;
  }

  .brand-mark {
    width: 31px;
    height: 31px;
  }

  .eyebrow {
    font-size: 11px;
    letter-spacing: 1.2px;
  }

  .hero {
    padding-top: 50px;
  }

  .tool-grid {
    grid-template-columns: 1fr;
  }

  .tool-card {
    min-height: 230px;
  }

  .support-card {
    min-height: 430px;
  }

  .support-art {
    position: relative;
    top: auto;
    right: auto;
    width: 100%;
  }

  .support-card h2,
  .support-card > p:not(.section-kicker),
  .support-card > button,
  .support-links {
    max-width: 100%;
  }

  .action-card {
    padding: 18px;
    border-radius: 17px;
  }

  .upload-zone small {
    max-width: 220px;
    text-align: center;
  }
}
/* School Word template analysis */
.template-upload-panel {
  margin-top: 14px;
  padding: 16px;
  border: 1px solid rgba(57, 116, 96, 0.18);
  border-radius: 18px;
  background: radial-gradient(circle at 94% 0%, rgba(118, 192, 164, 0.16), transparent 34%), linear-gradient(145deg, rgba(249, 253, 251, 0.98), rgba(243, 249, 247, 0.94));
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.9);
}

.template-upload-panel[hidden], .template-analysis-card[hidden] { display: none !important; }
.template-upload-control { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: stretch; gap: 10px; }
.template-upload-control > label {
  display: flex; align-items: center; min-width: 0; gap: 12px; padding: 12px 14px;
  border: 1px dashed rgba(55, 111, 92, 0.3); border-radius: 14px; background: rgba(255, 255, 255, 0.78);
  cursor: pointer; transition: border-color .2s ease, transform .2s ease, background .2s ease;
}
.template-upload-control > label:hover { border-color: #54a184; background: #fff; transform: translateY(-1px); }
.template-upload-control input { position: absolute; opacity: 0; pointer-events: none; }
.template-upload-control label > span {
  display: grid; place-items: center; flex: 0 0 38px; width: 38px; height: 42px;
  border-radius: 8px 12px 8px 8px; color: #fff; background: linear-gradient(145deg, #347d66, #58a98d);
  box-shadow: 0 8px 20px rgba(52, 125, 102, 0.2); font-family: Georgia, serif; font-size: 18px; font-weight: 700;
}
.template-upload-control label > div { min-width: 0; }
.template-upload-control strong, .template-upload-control small { display: block; }
.template-upload-control strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #253a33; font-size: 14px; }
.template-upload-control small { margin-top: 3px; color: #8a9994; font-size: 11px; }
.template-upload-control button {
  min-width: 108px; padding: 0 18px; border: 0; border-radius: 13px; color: #fff; background: #315f50;
  font-weight: 700; cursor: pointer; transition: transform .2s ease, box-shadow .2s ease, opacity .2s ease;
}
.template-upload-control button:not(:disabled):hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(49, 95, 80, .2); }
.template-upload-control button:disabled { opacity: .4; cursor: not-allowed; }
.template-analysis-card {
  display: flex; align-items: flex-start; gap: 11px; margin-top: 12px; padding: 12px 14px;
  border: 1px solid rgba(68, 151, 120, .2); border-radius: 14px; background: rgba(231, 247, 240, .7);
  animation: template-card-enter .35s ease both;
}
.template-analysis-check {
  display: grid; place-items: center; flex: 0 0 26px; width: 26px; height: 26px; border-radius: 50%;
  color: #fff; background: #4e9d7f; font-size: 13px;
}
.template-analysis-card strong { color: #295d4b; font-size: 13px; }
.template-analysis-card p { margin: 3px 0 0; color: #60746d; font-size: 11px; line-height: 1.55; }
.template-upload-status { min-height: 18px; margin: 8px 2px 0; color: #7b5c3d; font-size: 11px; }
.draft-result-meta .quality-pass-badge {
  color: #28745b;
  border-color: rgba(49, 144, 109, .22);
  background: rgba(224, 246, 237, .84);
}
.draft-result-meta .quality-pass-badge[hidden] { display: none; }
@keyframes template-card-enter { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }

@media (max-width: 640px) {
  .template-upload-control { grid-template-columns: 1fr; }
  .template-upload-control button { min-height: 44px; }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    transition-duration: 0.01ms !important;
  }

  .page-panel.active {
    animation: none;
  }
}

/* AI generation progress dialog */
body.generation-modal-open {
  overflow: hidden;
}

.generation-modal[hidden] {
  display: none !important;
}

.generation-modal {
  position: fixed;
  z-index: 100;
  inset: 0;
  display: grid;
  padding: 24px;
  place-items: center;
}

.generation-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(8, 17, 16, 0.68);
  opacity: 0;
  backdrop-filter: blur(12px) saturate(0.8);
  transition: opacity 0.28s ease;
}

.generation-dialog {
  position: relative;
  z-index: 1;
  display: grid;
  width: min(760px, 100%);
  min-height: 430px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.34);
  border-radius: 28px;
  outline: 0;
  background: rgba(250, 252, 251, 0.98);
  box-shadow: 0 40px 120px rgba(0, 0, 0, 0.34);
  grid-template-columns: 300px minmax(0, 1fr);
  opacity: 0;
  transform: translateY(18px) scale(0.965);
  transition: opacity 0.32s ease, transform 0.42s cubic-bezier(.22, 1, .36, 1);
}

.generation-modal.visible .generation-modal-backdrop {
  opacity: 1;
}

.generation-modal.visible .generation-dialog {
  opacity: 1;
  transform: translateY(0) scale(1);
}

.generation-visual {
  position: relative;
  overflow: hidden;
  min-height: 430px;
  background:
    radial-gradient(circle at 50% 48%, rgba(117, 229, 193, 0.2), transparent 28%),
    linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px),
    linear-gradient(145deg, #132420, #091412);
  background-size: auto, 32px 32px, 32px 32px, auto;
}

.generation-visual::before,
.generation-visual::after {
  position: absolute;
  border-radius: 50%;
  content: "";
  filter: blur(30px);
}

.generation-visual::before {
  top: -40px;
  right: -50px;
  width: 150px;
  height: 150px;
  background: rgba(118, 200, 255, 0.17);
}

.generation-visual::after {
  bottom: -55px;
  left: -40px;
  width: 170px;
  height: 170px;
  background: rgba(255, 115, 92, 0.16);
}

.generation-core,
.generation-orbit,
.generation-check {
  position: absolute;
  top: 50%;
  left: 50%;
}

.generation-core {
  z-index: 3;
  display: grid;
  width: 94px;
  height: 94px;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 30px 30px 30px 10px;
  color: #10211d;
  background: linear-gradient(145deg, #b9f5e1, #67d7b3);
  box-shadow: 0 18px 50px rgba(63, 194, 152, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.7);
  transform: translate(-50%, -50%) rotate(-3deg);
  animation: generation-core-float 3s ease-in-out infinite;
}

.generation-core::before {
  position: absolute;
  inset: -10px;
  border: 1px solid rgba(117, 229, 193, 0.22);
  border-radius: 36px 36px 36px 13px;
  content: "";
  animation: generation-core-pulse 2s ease-out infinite;
}

.generation-core span {
  position: absolute;
  inset: 7px;
  border: 1px solid rgba(18, 54, 44, 0.12);
  border-radius: 24px 24px 24px 8px;
}

.generation-core b {
  font-family: Georgia, serif;
  font-size: 32px;
  font-style: italic;
  font-weight: 600;
}

.generation-orbit {
  z-index: 2;
  border: 1px solid rgba(117, 229, 193, 0.24);
  border-radius: 50%;
}

.generation-orbit-one {
  width: 220px;
  height: 132px;
  animation: generation-orbit-one 7s linear infinite;
}

.generation-orbit-two {
  width: 150px;
  height: 238px;
  animation: generation-orbit-two 9s linear infinite reverse;
}

.generation-orbit i {
  position: absolute;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #78d0ff;
  box-shadow: 0 0 14px currentColor;
}

.generation-orbit i:nth-child(1) { top: -4px; left: 48%; color: #78d0ff; }
.generation-orbit i:nth-child(2) { right: 5px; bottom: 20%; color: #76e7c3; background: #76e7c3; }
.generation-orbit i:nth-child(3) { bottom: -4px; left: 28%; color: #ff8d79; background: #ff8d79; }

.generation-check {
  z-index: 4;
  display: grid;
  width: 94px;
  height: 94px;
  place-items: center;
  border-radius: 50%;
  color: #153b30;
  background: #78e3c0;
  font-size: 38px;
  opacity: 0;
  transform: translate(-50%, -50%) scale(0.6);
  transition: opacity 0.28s ease, transform 0.42s cubic-bezier(.22, 1.4, .36, 1);
}

.generation-copy {
  display: flex;
  min-width: 0;
  padding: 50px 48px 38px;
  flex-direction: column;
}

.generation-label {
  color: #e85e48;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.16em;
}

.generation-copy h2 {
  margin: 10px 0 9px;
  color: #182520;
  font-size: 29px;
  font-weight: 650;
  letter-spacing: -0.045em;
}

.generation-copy > p {
  min-height: 44px;
  margin: 0;
  color: #76837e;
  font-size: 12px;
  line-height: 1.7;
  transition: opacity 0.16s ease, transform 0.16s ease;
}

.generation-copy > p.switching {
  opacity: 0;
  transform: translateY(4px);
}

.generation-progress {
  position: relative;
  height: 4px;
  margin: 22px 0 26px;
  overflow: hidden;
  border-radius: 999px;
  background: #e6ece9;
}

.generation-progress i {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 42%;
  border-radius: inherit;
  background: linear-gradient(90deg, transparent, #62d5af 30%, #70c7fb 70%, transparent);
  animation: generation-progress-flow 1.8s ease-in-out infinite;
}

.generation-phases {
  display: grid;
  margin: 0;
  padding: 0;
  list-style: none;
  gap: 12px;
}

.generation-phases li {
  display: grid;
  min-height: 26px;
  align-items: center;
  color: #a0aaa6;
  font-size: 11px;
  grid-template-columns: 20px 1fr;
  gap: 8px;
  transition: color 0.22s ease, transform 0.22s ease;
}

.generation-phases li::before {
  display: grid;
  width: 18px;
  height: 18px;
  place-items: center;
  border: 1px solid #d7e0dc;
  border-radius: 50%;
  content: "";
  transition: all 0.22s ease;
}

.generation-phases li.active {
  color: #355f52;
  font-weight: 650;
  transform: translateX(2px);
}

.generation-phases li.active::before {
  border: 5px solid #dff7ef;
  background: #4ebd98;
  box-shadow: 0 0 0 3px rgba(78, 189, 152, 0.1);
}

.generation-phases li.complete {
  color: #70807a;
}

.generation-phases li.complete::before {
  border-color: #85d8bc;
  color: #2f8c6e;
  background: #e8faf4;
  content: "✓";
  font-size: 10px;
  font-weight: 800;
}

.generation-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: auto;
  padding-top: 22px;
  color: #9aa4a0;
  font-size: 9px;
}

.generation-meta time {
  color: #687872;
  font-variant-numeric: tabular-nums;
}

.generation-modal.complete .generation-core,
.generation-modal.complete .generation-orbit,
.generation-modal.failed .generation-core,
.generation-modal.failed .generation-orbit {
  opacity: 0;
  transition: opacity 0.22s ease;
}

.generation-modal.complete .generation-check {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

.generation-modal.failed .generation-check {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

.generation-modal.complete .generation-progress i {
  width: 100%;
  background: #62d5af;
  animation: none;
}

.generation-modal.failed .generation-check {
  color: white;
  background: #ff735c;
}

@keyframes generation-core-float {
  0%, 100% { transform: translate(-50%, -50%) translateY(0) rotate(-3deg); }
  50% { transform: translate(-50%, -50%) translateY(-8px) rotate(2deg); }
}

@keyframes generation-core-pulse {
  0% { opacity: 0.75; transform: scale(0.9); }
  100% { opacity: 0; transform: scale(1.25); }
}

@keyframes generation-orbit-one {
  from { transform: translate(-50%, -50%) rotate(12deg); }
  to { transform: translate(-50%, -50%) rotate(372deg); }
}

@keyframes generation-orbit-two {
  from { transform: translate(-50%, -50%) rotate(-28deg); }
  to { transform: translate(-50%, -50%) rotate(332deg); }
}

@keyframes generation-progress-flow {
  0% { left: -45%; }
  100% { left: 105%; }
}

@media (max-width: 680px) {
  .generation-modal { padding: 14px; }
  .generation-dialog { width: min(440px, 100%); min-height: 0; grid-template-columns: 1fr; }
  .generation-visual { min-height: 175px; }
  .generation-core { width: 72px; height: 72px; border-radius: 23px 23px 23px 8px; }
  .generation-core b { font-size: 25px; }
  .generation-orbit-one { width: 170px; height: 95px; }
  .generation-orbit-two { width: 105px; height: 160px; }
  .generation-check { width: 72px; height: 72px; font-size: 30px; }
  .generation-copy { padding: 28px 24px 24px; }
  .generation-copy h2 { font-size: 24px; }
  .generation-progress { margin: 17px 0 20px; }
}

@media (prefers-reduced-motion: reduce) {
  .generation-modal *,
  .generation-modal *::before,
  .generation-modal *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* Structured draft preview and Word export */
.draft-reader {
  display: grid;
  min-width: 0;
  gap: 12px;
  margin: 26px 0 20px;
  align-items: start;
}
.draft-reader.contents-expanded { grid-template-columns: 200px minmax(0, 1fr); }
.draft-reader > .draft-result-content { min-width: 0; margin: 0; overflow-wrap: anywhere; }
@media (min-width: 1101px) {
  .draft-reader.contents-expanded > .draft-result-content { padding-inline: clamp(20px, 3vw, 42px); }
}
/* The editorial hero's #writing h1 rules must not enlarge document titles. */
#writing .draft-reader .draft-result-content h1 {
  margin: 0 0 34px; max-width: none; font-size: 25px; line-height: 1.45;
  font-family: "PingFang SC", "Microsoft YaHei", sans-serif; letter-spacing: 0.01em;
}
.draft-contents {
  min-width: 0;
  max-height: 760px;
  border: 1px solid #dce6e0;
  border-radius: 8px;
  background: #f7faf8;
  color: #31594d;
}
.draft-contents[hidden], .draft-contents [hidden] { display: none; }
.draft-contents-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 10px; }
.draft-contents-head strong { font-size: 14px; letter-spacing: 0.08em; }
.draft-contents button { border: 0; border-radius: 4px; font: inherit; cursor: pointer; }
.draft-contents-head button { padding: 6px 8px; background: transparent; color: #396b5a; font-size: 13px; }
.draft-reader:not(.contents-expanded) > .draft-contents { justify-self: start; }
.draft-contents nav { display: block; max-height: 690px; overflow: auto; overscroll-behavior: contain; padding: 0 8px 10px; }
.draft-contents ol { display: block; list-style: none; margin: 0; padding: 0; }
.draft-contents li { margin: 2px 0; padding: 0; }
.draft-contents li button {
  display: block; width: 100%; padding: 9px 10px; border-left: 3px solid transparent;
  color: #5d6d67; background: transparent; text-align: left; font-size: 13px; line-height: 1.6; overflow-wrap: anywhere;
}
.draft-contents .draft-contents-level-0 button { font-weight: 600; color: #263b34; }
.draft-contents .draft-contents-level-1 button { padding-left: 18px; }
.draft-contents .draft-contents-level-2 button { padding-left: 26px; }
.draft-contents .draft-contents-level-3 button { padding-left: 34px; }
.draft-contents .draft-contents-level-4 button, .draft-contents .draft-contents-level-5 button { padding-left: 40px; }
.draft-contents button:hover { background: #edf4f0; }
.draft-contents li button[aria-current] { color: #17634d; border-left-color: #267e63; background: #e4f2eb; }
.draft-contents button:focus-visible, .draft-reader .draft-result-content :is(h1,h2,h3,h4,h5,h6):focus-visible {
  outline: 2px solid #267e63; outline-offset: 2px;
}
@media (max-width: 1100px) {
  .draft-reader.contents-expanded { grid-template-columns: minmax(0, 1fr); }
  .draft-contents nav { max-height: 240px; }
  .draft-contents li button { min-height: 44px; }
  .draft-contents-head button { min-height: 40px; }
}
@media (max-width: 560px) {
  #writing .draft-reader .draft-result-content h1 { margin-bottom: 30px; font-size: 21px; }
}
@media (prefers-reduced-motion: reduce) {
  .draft-reader .draft-result-content { scroll-behavior: auto; }
}

.draft-result-meta {
  display: flex;
  align-items: flex-end;
  flex-direction: column;
  gap: 7px;
}

.draft-result-meta > span {
  color: #7e8d87;
  font-size: 9px;
}

.draft-result-content {
  max-height: 760px;
  margin: 26px 0 20px;
  padding: clamp(30px, 5vw, 66px) clamp(24px, 7vw, 86px);
  overflow: auto;
  border: 1px solid #e0e5df;
  border-radius: 8px;
  color: #303a36;
  background: #fffefa;
  font-family: "Songti SC", STSong, "Noto Serif SC", serif;
  font-size: 14px;
  line-height: 2;
  box-shadow: 0 18px 45px rgba(45, 55, 49, 0.07);
  scroll-behavior: smooth;
}

.draft-result-content h1,
.draft-result-content h2,
.draft-result-content h3,
.draft-result-content h4,
.draft-result-content h5,
.draft-result-content h6 {
  color: #202b27;
  font-family: "PingFang SC", "Microsoft YaHei", sans-serif;
  line-height: 1.45;
}

.draft-result-content h1 {
  margin: 0 0 42px;
  font-size: 24px;
  text-align: center;
  letter-spacing: 0.02em;
}

.draft-result-content h2 {
  margin: 42px 0 20px;
  padding-bottom: 10px;
  border-bottom: 1px solid #dfe5e1;
  font-size: 20px;
}

.draft-result-content h3 {
  margin: 30px 0 15px;
  font-size: 17px;
}

.draft-result-content h4,
.draft-result-content h5,
.draft-result-content h6 {
  margin: 24px 0 12px;
  font-size: 15px;
}

.draft-result-content p {
  margin: 0 0 16px;
  text-align: justify;
  text-indent: 2em;
}

.draft-result-content .draft-document-keywords {
  padding: 10px 14px;
  border-radius: 8px;
  text-indent: 0;
  background: #f3f7f5;
}

.draft-document-list {
  margin: 8px 0 20px;
  padding-left: 2em;
}

.draft-document-list li {
  margin: 5px 0;
  padding-left: 0.35em;
}

.draft-result-content blockquote {
  margin: 20px 0;
  padding: 13px 18px;
  border-left: 4px solid #75d8b8;
  color: #5d6d67;
  background: #f1f7f4;
}

.draft-result .draft-result-content pre {
  margin: 20px 0;
  padding: 18px;
  overflow-x: auto;
  border: 1px solid #dce4e1;
  border-radius: 10px;
  color: #d9eee7;
  background: #172521;
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 12px;
  line-height: 1.7;
  white-space: pre-wrap;
}

.draft-document-equation {
  margin: 22px 0;
  padding: 16px;
  overflow-x: auto;
  border-radius: 9px;
  color: #263b34;
  background: #f3f6f5;
  font-family: "Cambria Math", "Times New Roman", serif;
  font-size: 16px;
  font-style: italic;
  text-align: center;
}

.draft-document-table-wrap {
  margin: 24px 0;
  overflow-x: auto;
}

.draft-document-table-wrap table {
  width: 100%;
  border-collapse: collapse;
  font-family: "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 12px;
  line-height: 1.6;
}

.draft-document-table-wrap th,
.draft-document-table-wrap td {
  min-width: 100px;
  padding: 10px 12px;
  border: 1px solid #cfd9d5;
  text-align: left;
}

.draft-document-table-wrap th {
  color: #31594d;
  background: #eaf4f0;
}

.draft-result-content figure {
  margin: 28px 0;
  text-align: center;
}

.draft-document-figure-placeholder {
  display: grid;
  min-height: 170px;
  place-items: center;
  border: 1px dashed #aebeb8;
  border-radius: 10px;
  color: #7d8d87;
  background:
    linear-gradient(rgba(57, 107, 90, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(57, 107, 90, 0.04) 1px, transparent 1px),
    #f6f9f8;
  background-size: 24px 24px;
  font-family: "PingFang SC", sans-serif;
  font-size: 28px;
}

.draft-result-content figcaption {
  margin-top: 8px;
  color: #6f7e79;
  font-size: 11px;
}

.draft-result-actions {
  display: flex;
  justify-content: flex-end;
  gap: 9px;
}

.draft-result .draft-result-actions button {
  display: inline-flex;
  min-height: 46px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 17px;
  border: 1px solid #b6c8c1;
  border-radius: 11px;
  color: #396b5a;
  background: white;
  cursor: pointer;
  font-size: 11px;
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.draft-result .draft-result-actions button:hover {
  border-color: #79bca5;
  box-shadow: 0 8px 18px rgba(31, 76, 61, 0.08);
  transform: translateY(-1px);
}

.draft-result .draft-result-actions #draftDownload {
  min-width: 154px;
  border-color: #172c27;
  color: white;
  background: #172c27;
}

.draft-result .draft-result-actions #draftDownload b {
  padding: 3px 6px;
  border-radius: 5px;
  color: #193d32;
  background: #7be0be;
  font-size: 8px;
  letter-spacing: 0.04em;
}

.draft-result .draft-result-actions button:disabled {
  opacity: 0.64;
  cursor: wait;
  transform: none;
}

.draft-export-status {
  min-height: 18px;
  margin: 10px 0 0;
  color: #76857f;
  font-size: 10px;
  text-align: right;
}

.draft-post-quality { margin-top: 20px; padding: 20px; border: 1px solid #d0ddd6; border-radius: 8px; background: #f7faf8; }
.draft-post-quality[hidden] { display: none; }
.draft-post-quality h3 { margin: 0 0 12px; font-size: 20px; }
.draft-post-quality p { font-size: 16px; line-height: 1.7; overflow-wrap: anywhere; }
.draft-post-quality-link { display: inline-block; margin: 8px 16px 8px 0; padding: 8px 12px; color: #17634d; border: 1px solid #b7d1c5; border-radius: 6px; }
.draft-post-quality details { margin-top: 12px; }
.draft-post-quality details p { max-height: 180px; overflow: auto; }

.draft-document-empty {
  color: #8b9893;
  text-align: center !important;
  text-indent: 0 !important;
}

@media (max-width: 560px) {
  .draft-result-meta { align-items: flex-start; }
  .draft-result-content { max-height: 680px; padding: 28px 18px; font-size: 13px; }
  .draft-result-content h1 { margin-bottom: 30px; font-size: 21px; }
  .draft-result-content h2 { margin-top: 34px; font-size: 18px; }
  .draft-result-content h3 { font-size: 16px; }
  .draft-result-actions { align-items: stretch; flex-direction: column-reverse; }
  .draft-result .draft-result-actions button { width: 100%; }
  .draft-export-status { text-align: left; }
}

/* Digital editorial desk — AI writing homepage */
#writing {
  --editorial-paper: #f8f5ed;
  --editorial-canvas: #eee9dd;
  --editorial-ink: #19231f;
  --editorial-red: #b94f3a;
  --editorial-gold: #d7ad55;
}

#writing .hero {
  min-height: 780px;
  padding: 0 clamp(24px, 5vw, 76px);
  border-bottom: 1px solid #cbc5b7;
  background:
    linear-gradient(90deg, transparent 49.92%, rgba(58, 69, 63, 0.045) 50%, transparent 50.08%),
    var(--editorial-canvas);
  background-size: 68px 100%;
}

#writing .hero::after {
  display: none;
}

.editorial-rule {
  display: flex;
  width: min(1320px, 100%);
  height: 45px;
  align-items: center;
  justify-content: space-between;
  margin: 0 auto;
  border-bottom: 1px solid rgba(25, 35, 31, 0.34);
  color: #667069;
  font-family: Georgia, serif;
  font-size: 10px;
  letter-spacing: 1.8px;
  text-transform: uppercase;
}

.editorial-rule i {
  color: var(--editorial-red);
  font-size: 12px;
}

#writing .editorial-hero {
  display: grid;
  width: min(1320px, 100%);
  margin: 0 auto;
  padding: 58px 0 74px;
  align-items: center;
  grid-template-columns: minmax(400px, 0.9fr) minmax(500px, 1.1fr);
  gap: clamp(50px, 7vw, 108px);
  text-align: left;
}

.hero-copy-column {
  position: relative;
  z-index: 3;
}

#writing .eyebrow {
  margin-bottom: 20px;
  color: #53625b;
  font-size: 11px;
  letter-spacing: 2.2px;
}

#writing .eyebrow span {
  width: 22px;
  height: 1px;
  border-radius: 0;
  background: var(--editorial-red);
  box-shadow: none;
}

#writing h1 {
  margin: 0;
  color: var(--editorial-ink);
  font-family: "Songti SC", "STSong", "Noto Serif SC", Georgia, serif;
  font-size: clamp(52px, 5vw, 72px);
  font-weight: 600;
  line-height: 1.11;
  letter-spacing: -4px;
}

#writing h1 em {
  position: relative;
  display: inline-block;
  color: var(--editorial-red);
}

#writing h1 em::after {
  position: absolute;
  right: 0;
  bottom: -5px;
  left: 2px;
  height: 7px;
  opacity: 0.62;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='7' viewBox='0 0 220 7'%3E%3Cpath d='M1 5C48 1 124 7 219 2' fill='none' stroke='%23b94f3a' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
  content: "";
}

#writing .hero-copy {
  max-width: 520px;
  margin: 22px 0 26px;
  color: #667169;
  font-family: "Songti SC", "STSong", serif;
  font-size: 16px;
  line-height: 1.85;
}

#writing .editorial-composer {
  max-width: 560px;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid #bdb6a7;
  border-radius: 3px;
  background: var(--editorial-paper);
  box-shadow: 8px 9px 0 rgba(39, 55, 47, 0.09);
}

.composer-heading {
  display: flex;
  min-height: 64px;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px 11px 18px;
  border-bottom: 1px solid #d3cec2;
}

.composer-heading > div:first-child {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.composer-heading .folio {
  color: var(--editorial-red);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 1.5px;
}

.composer-heading strong {
  font-family: "Songti SC", "STSong", serif;
  font-size: 16px;
}

#writing .composer-tabs {
  gap: 0;
  padding: 0;
  border: 1px solid #c7c1b5;
  border-radius: 2px;
}

#writing .language-tab {
  min-width: 35px;
  padding: 7px 8px;
  border-radius: 0;
  color: #737b76;
  font-family: Georgia, serif;
  font-size: 10px;
}

#writing .language-tab + .language-tab {
  border-left: 1px solid #c7c1b5;
}

#writing .language-tab.active {
  color: white;
  background: var(--editorial-ink);
}

.paper-topic-field {
  display: flex;
  min-height: 108px;
  padding: 16px 18px 12px;
  background:
    repeating-linear-gradient(transparent, transparent 32px, rgba(62, 76, 68, 0.1) 33px),
    var(--editorial-paper);
  flex-direction: column;
}

.paper-topic-field > span,
.subject-select > span {
  color: #89908c;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 1px;
}

.paper-topic-field textarea {
  width: 100%;
  min-height: 58px;
  padding: 6px 0 0;
  resize: none;
  border: 0;
  outline: 0;
  color: var(--editorial-ink);
  background: transparent;
  font-family: "Songti SC", "STSong", serif;
  font-size: 16px;
  line-height: 1.75;
}

.paper-topic-field textarea::placeholder {
  color: #a5a49d;
}

.composer-actions {
  display: grid;
  min-height: 57px;
  padding: 8px;
  border-top: 1px solid #d3cec2;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
}

.subject-select {
  display: flex;
  justify-content: center;
  padding: 3px 10px;
  border-right: 1px solid #d3cec2;
  flex-direction: column;
  gap: 1px;
}

.subject-select select {
  width: 100%;
  padding: 0;
  border: 0;
  outline: 0;
  color: #424c47;
  background: transparent;
  font-size: 12px;
}

#writing .primary-button {
  min-width: 164px;
  border-radius: 2px;
  background: var(--editorial-ink);
  box-shadow: none;
  font-size: 12px;
}

#writing .primary-button:hover {
  background: var(--editorial-red);
}

#writing .form-message {
  margin: 0;
  padding: 8px 12px;
  border-top: 1px solid #d3cec2;
  background: #f4efe5;
  font-size: 11px;
}

#writing .trust-row {
  justify-content: flex-start;
  gap: 20px;
  margin-top: 19px;
  color: #737c77;
  font-size: 10px;
  letter-spacing: 0.3px;
}

#writing .trust-row i {
  width: 15px;
  height: 15px;
  color: white;
  background: #748a7e;
  font-size: 8px;
}

.manuscript-stage {
  position: relative;
  min-width: 0;
  height: 590px;
  perspective: 1300px;
}

.manuscript {
  position: absolute;
  z-index: 2;
  top: 15px;
  right: 24px;
  width: min(500px, calc(100% - 32px));
  height: 555px;
  padding: 30px 42px 22px;
  overflow: hidden;
  border: 1px solid #c9c2b4;
  color: #26312c;
  background:
    linear-gradient(90deg, transparent 50px, rgba(185, 79, 58, 0.16) 51px, transparent 52px),
    repeating-linear-gradient(transparent, transparent 27px, rgba(51, 66, 58, 0.055) 28px),
    #fbf9f2;
  box-shadow: 22px 28px 55px rgba(35, 45, 39, 0.2), -8px 10px 0 #ded8ca;
  transform: rotate(1.25deg);
  transform-origin: center;
  transition: transform 0.45s ease, box-shadow 0.45s ease;
}

.manuscript-stage:hover .manuscript {
  box-shadow: 27px 34px 70px rgba(35, 45, 39, 0.24), -8px 10px 0 #ded8ca;
  transform: rotate(0deg) translateY(-5px);
}

.manuscript::before {
  position: absolute;
  top: 0;
  right: 0;
  width: 44px;
  height: 44px;
  background: linear-gradient(225deg, var(--editorial-canvas) 49%, #d3ccbe 50%, #f5f1e7 52%);
  content: "";
}

.manuscript-header,
.manuscript-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #6f7873;
  font-size: 8px;
  letter-spacing: 1.2px;
}

.manuscript-header {
  padding-bottom: 13px;
  border-bottom: 2px solid #26312c;
}

.manuscript-header > div {
  display: flex;
  align-items: center;
  gap: 9px;
}

.manuscript-header b {
  padding-left: 9px;
  border-left: 1px solid #bab5aa;
  color: var(--editorial-red);
}

.manuscript-body {
  padding: 24px 4px 10px 20px;
}

.manuscript-type {
  margin: 0 0 8px;
  color: var(--editorial-red);
  font-family: Georgia, serif;
  font-size: 8px;
  letter-spacing: 1.8px;
}

.manuscript-body h2 {
  min-height: 60px;
  margin: 0;
  font-family: "Songti SC", "STSong", serif;
  font-size: clamp(23px, 2.2vw, 30px);
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: -1px;
}

.manuscript-abstract {
  margin: 13px 0 15px;
  color: #68716c;
  font-family: "Songti SC", "STSong", serif;
  font-size: 11px;
  line-height: 1.8;
}

.manuscript-abstract mark {
  color: inherit;
  background: linear-gradient(transparent 42%, rgba(215, 173, 85, 0.43) 42%, rgba(215, 173, 85, 0.43) 88%, transparent 88%);
}

.outline-list {
  border-top: 1px solid #aaa69d;
}

.outline-item {
  display: grid;
  min-height: 57px;
  align-items: center;
  border-bottom: 1px solid #d2cec4;
  grid-template-columns: 40px 1fr;
  transition: background 0.25s ease;
}

.outline-item:hover {
  background: rgba(215, 173, 85, 0.08);
}

.outline-item > span {
  color: var(--editorial-red);
  font-family: Georgia, serif;
  font-size: 11px;
  font-style: italic;
}

.outline-item div {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.outline-item b {
  font-family: "Songti SC", "STSong", serif;
  font-size: 13px;
}

.outline-item i {
  color: #7c837f;
  font-size: 9px;
  font-style: normal;
}

.manuscript-footer {
  position: absolute;
  right: 42px;
  bottom: 18px;
  left: 42px;
  padding-top: 9px;
  border-top: 1px solid #aaa69d;
}

.manuscript-footer b {
  color: var(--editorial-red);
  font-family: Georgia, serif;
  font-size: 13px;
}

.margin-note {
  position: absolute;
  z-index: 4;
  display: flex;
  width: 132px;
  padding: 10px 11px;
  border: 1px solid rgba(119, 62, 49, 0.3);
  color: #6d4036;
  background: #f1d8ca;
  box-shadow: 4px 6px 16px rgba(72, 50, 43, 0.12);
  transform: rotate(-3deg);
  flex-direction: column;
  gap: 3px;
}

.margin-note b {
  font-size: 8px;
  letter-spacing: 1px;
}

.margin-note span {
  font-family: "Songti SC", "STSong", serif;
  font-size: 10px;
  line-height: 1.45;
}

.note-one {
  top: 92px;
  right: -8px;
}

.note-two {
  right: 6px;
  bottom: 62px;
  background: #f0e2b8;
  transform: rotate(2.5deg);
}

.manuscript.generated {
  transform: rotate(0deg) translateY(-6px);
}

.manuscript.generated .outline-item {
  opacity: 0;
  animation: outline-reveal 0.42s ease forwards;
}

.manuscript.generated .outline-item:nth-child(2) { animation-delay: 0.1s; }
.manuscript.generated .outline-item:nth-child(3) { animation-delay: 0.2s; }
.manuscript.generated .outline-item:nth-child(4) { animation-delay: 0.3s; }

@keyframes outline-reveal {
  from { opacity: 0; transform: translateX(-10px); }
  to { opacity: 1; transform: translateX(0); }
}

#writing .tool-section {
  width: 100%;
  margin: 0;
  padding: 96px max(24px, calc((100vw - 1320px) / 2)) 110px;
  background: #f7f3ea;
}

#writing .section-heading {
  padding-bottom: 28px;
  border-bottom: 1px solid #bdb7aa;
}

#writing .section-heading h2 {
  font-family: "Songti SC", "STSong", Georgia, serif;
  font-size: clamp(38px, 4vw, 52px);
  font-weight: 600;
}

#writing .section-heading > p {
  font-family: "Songti SC", "STSong", serif;
  font-size: 14px;
}

#writing .section-kicker {
  color: var(--editorial-red);
  font-family: Georgia, serif;
}

#writing .audience-tabs {
  gap: 4px;
  margin: 20px 0 26px;
  padding: 0 0 14px;
  border-bottom: 1px solid #d5cfc2;
}

#writing .audience-tab {
  padding: 8px 13px;
  border: 0;
  border-radius: 1px;
  color: #68716c;
  background: transparent;
  font-size: 11px;
  letter-spacing: 0.2px;
}

#writing .audience-tab:hover,
#writing .audience-tab.active {
  color: white;
  background: var(--editorial-ink);
}

#writing .tool-grid {
  gap: 1px;
  border: 1px solid #c7c1b5;
  background: #c7c1b5;
}

#writing .tool-card {
  min-height: 244px;
  padding: 28px;
  border: 0;
  border-radius: 0;
  background: #fbf8f0;
  box-shadow: none;
}

#writing .tool-card::after {
  right: 0;
  bottom: 0;
  width: 30px;
  height: 30px;
  border: 0;
  border-radius: 0;
  background: linear-gradient(315deg, #e0d9cc 49%, transparent 51%);
}

#writing .tool-card::before {
  position: absolute;
  top: 29px;
  right: 28px;
  color: #a8a59d;
  font-family: Georgia, serif;
  font-size: 10px;
  font-style: italic;
  content: "0" counter(editorial-card);
}

#writing .tool-grid {
  counter-reset: editorial-card;
}

#writing .tool-card {
  counter-increment: editorial-card;
}

#writing .tool-card:hover,
#writing .tool-card:focus {
  z-index: 2;
  transform: translateY(-4px);
  background: white;
  box-shadow: 0 18px 38px rgba(45, 52, 48, 0.13);
}

#writing .tool-icon {
  width: 38px;
  height: 38px;
  border-radius: 2px;
}

#writing .tool-icon svg {
  width: 20px;
}

#writing .tool-card h3 {
  margin-top: 23px;
  font-family: "Songti SC", "STSong", serif;
  font-size: 18px;
}

#writing .tool-card p {
  color: #727a76;
  font-family: "Songti SC", "STSong", serif;
}

#writing .tool-card a {
  color: var(--editorial-red);
}

#writing .tool-card .tag {
  top: auto;
  right: 28px;
  bottom: 26px;
  border-radius: 1px;
}

@media (max-width: 1080px) {
  #writing .editorial-hero {
    grid-template-columns: minmax(360px, 0.9fr) minmax(420px, 1.1fr);
    gap: 38px;
  }

  .manuscript {
    right: 10px;
    width: calc(100% - 10px);
  }

  .margin-note {
    display: none;
  }
}

@media (max-width: 860px) {
  #writing .hero {
    padding: 0 20px;
  }

  #writing .editorial-hero {
    grid-template-columns: 1fr;
    gap: 58px;
  }

  #writing h1 {
    max-width: 680px;
  }

  #writing .hero-copy {
    max-width: 620px;
  }

  #writing .editorial-composer {
    max-width: 680px;
  }

  .manuscript-stage {
    width: min(640px, 100%);
    height: 575px;
    margin: 0 auto;
  }

  .manuscript {
    right: 20px;
    width: min(500px, calc(100% - 36px));
  }
}

@media (max-width: 560px) {
  #writing .editorial-hero {
    padding: 42px 0 56px;
    gap: 42px;
  }

  #writing h1 {
    font-size: clamp(41px, 12vw, 54px);
    letter-spacing: -2.5px;
  }

  #writing .hero-copy {
    font-size: 14px;
  }

  .composer-actions {
    grid-template-columns: 1fr;
  }

  .subject-select {
    min-height: 45px;
    border-right: 0;
    border-bottom: 1px solid #d3cec2;
  }

  #writing .primary-button {
    min-height: 48px;
  }

  #writing .trust-row {
    justify-content: flex-start;
  }

  .manuscript-stage {
    height: 505px;
  }

  .manuscript {
    right: 8px;
    width: calc(100% - 8px);
    height: 490px;
    padding: 24px 25px 18px;
    box-shadow: 12px 16px 30px rgba(35, 45, 39, 0.18), -5px 7px 0 #ded8ca;
  }

  .manuscript-body {
    padding: 18px 0 8px 12px;
  }

  .manuscript-body h2 {
    min-height: 52px;
    font-size: 21px;
  }

  .manuscript-abstract {
    margin: 9px 0 11px;
  }

  .outline-item {
    min-height: 52px;
  }

  .manuscript-footer {
    right: 25px;
    bottom: 14px;
    left: 25px;
  }

  #writing .tool-section {
    padding: 68px 16px 76px;
  }
}

/* Writing service catalog */
.task-filters {
  display: flex;
  gap: 4px;
  margin: 20px 0 26px;
  padding-bottom: 14px;
  overflow-x: auto;
  border-bottom: 1px solid #d5cfc2;
  scrollbar-width: none;
}

.task-filters::-webkit-scrollbar {
  display: none;
}

.task-filter {
  flex: 0 0 auto;
  padding: 9px 14px;
  border: 0;
  border-radius: 1px;
  color: #68716c;
  background: transparent;
  cursor: pointer;
  font-size: 11px;
  letter-spacing: 0.2px;
  transition: color 0.2s ease, background 0.2s ease;
}

.task-filter sup {
  margin-left: 3px;
  color: #a49e92;
  font-family: Georgia, serif;
  font-size: 8px;
}

.task-filter:hover,
.task-filter.active {
  color: white;
  background: var(--editorial-ink);
}

.task-filter.active sup {
  color: #dfc279;
}

.task-catalog {
  display: grid;
  align-items: start;
  grid-template-columns: minmax(0, 1.25fr) minmax(390px, 0.75fr);
  gap: 26px;
}

.task-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  border: 1px solid #c7c1b5;
  background: #c7c1b5;
}

.task-card {
  position: relative;
  display: grid;
  min-height: 162px;
  align-items: start;
  padding: 24px 22px;
  overflow: hidden;
  border: 0;
  color: var(--editorial-ink);
  background: #fbf8f0;
  cursor: pointer;
  grid-template-columns: 34px minmax(0, 1fr) 22px;
  gap: 12px;
  text-align: left;
  transition: color 0.25s ease, background 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
}

.task-card[hidden] {
  display: none;
}

.task-card::after {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 28px;
  height: 28px;
  background: linear-gradient(315deg, #ded7c9 49%, transparent 51%);
  content: "";
}

.task-card:hover {
  z-index: 2;
  transform: translateY(-3px);
  background: white;
  box-shadow: 0 14px 35px rgba(40, 50, 44, 0.13);
}

.task-card.active {
  z-index: 1;
  color: white;
  background: var(--editorial-ink);
}

.task-card.active::after {
  background: linear-gradient(315deg, #9d4938 49%, transparent 51%);
}

.task-index {
  display: grid;
  width: 31px;
  height: 31px;
  place-items: center;
  border: 1px solid #c1baad;
  color: var(--editorial-red);
  font-family: Georgia, serif;
  font-size: 10px;
  font-style: italic;
}

.task-card.active .task-index {
  border-color: rgba(255, 255, 255, 0.25);
  color: #e6bd67;
}

.task-card small {
  display: block;
  margin: 1px 0 10px;
  color: #9a978f;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 1.15px;
  text-transform: uppercase;
}

.task-card.active small {
  color: rgba(255, 255, 255, 0.54);
}

.task-card h3 {
  margin: 0 0 8px;
  font-family: "Songti SC", "STSong", serif;
  font-size: 19px;
  font-weight: 600;
}

.task-card p {
  margin: 0;
  color: #727a76;
  font-family: "Songti SC", "STSong", serif;
  font-size: 11px;
  line-height: 1.65;
}

.task-card.active p {
  color: rgba(255, 255, 255, 0.65);
}

.task-card > b {
  margin-top: 54px;
  color: var(--editorial-red);
  font-size: 15px;
  transition: transform 0.2s ease;
}

.task-card:hover > b {
  transform: translateX(3px);
}

.task-card.active > b {
  color: #e6bd67;
}

.task-detail {
  position: sticky;
  top: 96px;
  min-height: 676px;
  padding: 30px;
  overflow: hidden;
  color: white;
  background:
    linear-gradient(90deg, transparent 35px, rgba(255, 255, 255, 0.06) 36px, transparent 37px),
    repeating-linear-gradient(transparent, transparent 31px, rgba(255, 255, 255, 0.035) 32px),
    #19231f;
  box-shadow: 10px 12px 0 #d8d1c3;
}

.task-detail::after {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 46px;
  height: 46px;
  background: linear-gradient(315deg, #b94f3a 49%, transparent 51%);
  content: "";
}

.task-detail-heading {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 20px;
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.25);
}

.task-detail-heading > div {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.task-detail-heading span {
  color: #d7ad55;
  font-family: Georgia, serif;
  font-size: 8px;
  letter-spacing: 1.7px;
}

.task-detail-heading h3 {
  margin: 0;
  font-family: "Songti SC", "STSong", serif;
  font-size: 29px;
  font-weight: 600;
}

.task-detail-heading em {
  flex: 0 0 auto;
  padding: 5px 8px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  color: rgba(255, 255, 255, 0.68);
  font-size: 8px;
  font-style: normal;
  letter-spacing: 0.8px;
}

.task-detail-summary {
  margin: 16px 0 20px;
  color: rgba(255, 255, 255, 0.68);
  font-family: "Songti SC", "STSong", serif;
  font-size: 11px;
  line-height: 1.75;
}

.task-detail-section {
  margin-top: 20px;
}

.task-detail-section h4 {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 10px;
  color: white;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.6px;
}

.task-detail-section h4 span {
  color: #d7ad55;
  font-family: Georgia, serif;
  font-size: 9px;
  font-style: italic;
}

.input-chips {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
}

.input-chips span {
  padding: 5px 7px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  color: rgba(255, 255, 255, 0.67);
  background: rgba(255, 255, 255, 0.045);
  font-size: 9px;
  line-height: 1.35;
}

.workflow-list {
  display: flex;
  margin: 0;
  padding: 0;
  list-style: none;
  gap: 4px;
}

.workflow-list li {
  position: relative;
  display: flex;
  min-width: 0;
  flex: 1;
  flex-direction: column;
  gap: 6px;
}

.workflow-list li:not(:last-child)::after {
  position: absolute;
  top: 9px;
  right: -3px;
  width: calc(100% - 23px);
  height: 1px;
  background: rgba(255, 255, 255, 0.18);
  transform: translateX(100%);
  content: "";
}

.workflow-list i {
  position: relative;
  z-index: 1;
  display: grid;
  width: 19px;
  height: 19px;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 50%;
  color: #d7ad55;
  background: #19231f;
  font-family: Georgia, serif;
  font-size: 8px;
  font-style: normal;
}

.workflow-list span {
  padding-right: 4px;
  color: rgba(255, 255, 255, 0.63);
  font-size: 8px;
  line-height: 1.45;
}

.rule-section ul {
  display: grid;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.rule-section li {
  position: relative;
  padding-left: 12px;
  color: rgba(255, 255, 255, 0.62);
  font-size: 9px;
  line-height: 1.55;
}

.rule-section li::before {
  position: absolute;
  top: 6px;
  left: 0;
  width: 4px;
  height: 4px;
  background: #b94f3a;
  content: "";
}

.task-start-button {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  margin-top: 22px;
  padding: 12px 14px;
  border: 0;
  color: #19231f;
  background: #d7ad55;
  cursor: pointer;
  font-size: 10px;
  font-weight: 700;
  transition: background 0.2s ease, transform 0.2s ease;
}

.task-start-button:hover {
  transform: translateY(-2px);
  background: #e2bd6d;
}

.task-start-button b {
  font-size: 15px;
}

.task-prototype-message {
  min-height: 14px;
  margin: 8px 0 0;
  color: rgba(255, 255, 255, 0.5);
  font-size: 8px;
  text-align: center;
}

.shared-service-notes {
  display: grid;
  margin-top: 34px;
  border-top: 1px solid #bdb7aa;
  border-bottom: 1px solid #bdb7aa;
  grid-template-columns: repeat(2, 1fr);
}

.shared-service-notes article {
  display: grid;
  padding: 20px 24px 20px 0;
  grid-template-columns: 150px 1fr;
  gap: 18px;
}

.shared-service-notes article + article {
  padding-left: 24px;
  border-left: 1px solid #bdb7aa;
}

.shared-service-notes span {
  color: var(--editorial-red);
  font-family: Georgia, serif;
  font-size: 9px;
  letter-spacing: 1.2px;
}

.shared-service-notes p {
  margin: 0;
  color: #68716c;
  font-family: "Songti SC", "STSong", serif;
  font-size: 11px;
  line-height: 1.65;
}

@media (max-width: 1120px) {
  .task-catalog {
    grid-template-columns: 1fr;
  }

  .task-detail {
    position: relative;
    top: 0;
    min-height: 0;
  }
}

@media (max-width: 700px) {
  .task-list {
    grid-template-columns: 1fr;
  }

  .task-card {
    min-height: 145px;
  }

  .task-detail {
    padding: 24px 20px;
  }

  .workflow-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
  }

  .workflow-list li {
    min-height: 52px;
    padding: 8px;
    border: 1px solid rgba(255, 255, 255, 0.12);
  }

  .workflow-list li:not(:last-child)::after {
    display: none;
  }

  .workflow-list span {
    font-size: 9px;
  }

  .shared-service-notes {
    grid-template-columns: 1fr;
  }

  .shared-service-notes article,
  .shared-service-notes article + article {
    padding: 18px 0;
    border-left: 0;
    grid-template-columns: 1fr;
    gap: 6px;
  }

  .shared-service-notes article + article {
    border-top: 1px solid #d5cfc2;
  }
}

/* Closed-loop writing workspace */
#writing .task-filters {
  margin-bottom: 18px;
}

#writing .task-catalog {
  grid-template-columns: 230px minmax(0, 1fr);
  gap: 22px;
}

#writing .task-list {
  position: sticky;
  top: 94px;
  display: grid;
  overflow: hidden;
  border: 1px solid #c7c1b5;
  background: #c7c1b5;
  grid-template-columns: 1fr;
  gap: 1px;
}

#writing .task-card {
  min-height: 74px;
  align-items: center;
  padding: 11px 12px;
  grid-template-columns: 29px minmax(0, 1fr) 15px;
  gap: 10px;
}

#writing .task-card::after {
  width: 16px;
  height: 16px;
}

#writing .task-card:hover {
  transform: translateX(3px);
}

#writing .task-index {
  width: 27px;
  height: 27px;
  font-size: 9px;
}

#writing .task-card small {
  margin: 0 0 3px;
  font-size: 7px;
}

#writing .task-card h3 {
  margin: 0;
  font-size: 15px;
}

#writing .task-card p {
  display: none;
}

#writing .task-card > b {
  margin-top: 0;
  font-size: 12px;
}

.task-workspace {
  min-width: 0;
  padding: 32px 36px 38px;
  border: 1px solid #c7c1b5;
  background:
    linear-gradient(90deg, transparent 43px, rgba(185, 79, 58, 0.09) 44px, transparent 45px),
    #fbf8f0;
  box-shadow: 10px 12px 0 #ded7c9;
}

.task-workspace .task-detail-heading {
  border-color: #bdb7aa;
  color: var(--editorial-ink);
}

.task-workspace .task-detail-heading span {
  color: var(--editorial-red);
}

.task-workspace .task-detail-heading h3 {
  color: var(--editorial-ink);
  font-size: 32px;
}

.task-workspace .task-detail-heading em {
  border-color: #c9c2b5;
  color: #6f7873;
}

.task-workspace .task-detail-summary {
  max-width: 760px;
  color: #68716c;
  font-size: 12px;
}

.workspace-steps {
  display: grid;
  margin: 24px 0 28px;
  padding: 0;
  border-top: 1px solid #c7c1b5;
  border-bottom: 1px solid #c7c1b5;
  list-style: none;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.workspace-steps li {
  position: relative;
  display: flex;
  min-height: 68px;
  align-items: center;
  padding: 10px 9px;
  color: #69726d;
  gap: 7px;
}

.workspace-steps li + li {
  border-left: 1px solid #d7d1c4;
}

.workspace-steps i {
  display: grid;
  width: 21px;
  height: 21px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 50%;
  color: white;
  background: #76887f;
  font-family: Georgia, serif;
  font-size: 8px;
  font-style: normal;
}

.workspace-steps li:first-child i {
  background: var(--editorial-red);
  box-shadow: 0 0 0 4px rgba(185, 79, 58, 0.1);
}

.workspace-steps span {
  font-size: 9px;
  line-height: 1.4;
}

.writing-task-form {
  padding: 26px;
  border: 1px solid #d2ccbf;
  background: rgba(255, 255, 255, 0.58);
}

.form-section-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 22px;
  padding-bottom: 14px;
  border-bottom: 2px solid var(--editorial-ink);
}

.form-section-heading > div {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.form-section-heading span {
  color: var(--editorial-red);
  font-family: Georgia, serif;
  font-size: 8px;
  letter-spacing: 1.5px;
}

.form-section-heading h4 {
  margin: 0;
  font-family: "Songti SC", "STSong", serif;
  font-size: 21px;
}

.form-section-heading p {
  margin: 0;
  color: #8b908d;
  font-size: 9px;
}

.form-section-heading b,
.dynamic-field-label b {
  color: var(--editorial-red);
}

.dynamic-form-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px 18px;
}

.dynamic-field {
  position: relative;
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 7px;
}

.dynamic-field.wide {
  grid-column: 1 / -1;
}

.dynamic-field-label {
  color: #404a45;
  font-size: 11px;
  font-weight: 600;
}

.dynamic-field > input,
.dynamic-field > select,
.dynamic-field > textarea,
.input-with-action > input {
  width: 100%;
  min-height: 43px;
  padding: 10px 12px;
  border: 1px solid #c9c3b7;
  border-radius: 1px;
  outline: none;
  color: var(--editorial-ink);
  background: #fffdf7;
  font-size: 12px;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.dynamic-field > textarea {
  min-height: 104px;
  resize: vertical;
  font-family: inherit;
  line-height: 1.65;
}

.dynamic-field > input:focus,
.dynamic-field > select:focus,
.dynamic-field > textarea:focus,
.input-with-action > input:focus {
  border-color: #71877c;
  box-shadow: 0 0 0 3px rgba(73, 98, 86, 0.08);
}

.input-with-action {
  display: grid;
  grid-template-columns: 1fr auto;
}

.input-with-action > input {
  border-right: 0;
}

.input-with-action button {
  padding: 0 15px;
  border: 0;
  color: white;
  background: #657d71;
  cursor: pointer;
  font-size: 10px;
  font-weight: 600;
}

.input-with-action button:hover {
  background: var(--editorial-red);
}

.form-choices {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
}

.form-choices label {
  cursor: pointer;
}

.form-choices input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.form-choices span {
  display: block;
  min-width: 68px;
  padding: 9px 12px;
  border: 1px solid #c9c3b7;
  color: #67706b;
  background: #fffdf7;
  font-size: 10px;
  text-align: center;
  transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease;
}

.form-choices input:checked + span {
  border-color: var(--editorial-ink);
  color: white;
  background: var(--editorial-ink);
}

.form-choices.multi input:checked + span {
  border-color: #8c493a;
  color: #8c493a;
  background: #f5e5df;
}

.form-choices input:focus-visible + span {
  outline: 2px solid #d7ad55;
  outline-offset: 2px;
}

.field-help,
.field-counter {
  color: #929793;
  font-size: 8px;
  line-height: 1.5;
}

.field-counter {
  position: absolute;
  right: 8px;
  bottom: 7px;
  padding: 2px 4px;
  background: #fffdf7;
}

.dynamic-field:has(.field-help) .field-counter {
  bottom: 24px;
}

.task-rules-panel {
  margin-top: 22px;
  border-top: 1px solid #d2ccbf;
  border-bottom: 1px solid #d2ccbf;
}

.task-rules-panel summary {
  padding: 12px 2px;
  color: #5d6862;
  cursor: pointer;
  font-size: 10px;
  font-weight: 600;
}

.task-rules-panel ul {
  display: grid;
  gap: 7px;
  margin: 0;
  padding: 0 4px 14px 18px;
  color: #747c77;
  font-size: 9px;
  line-height: 1.55;
}

.usage-agreement {
  display: flex;
  align-items: start;
  gap: 8px;
  margin-top: 17px;
  color: #777e7a;
  cursor: pointer;
  font-size: 9px;
  line-height: 1.5;
}

.usage-agreement input {
  margin-top: 1px;
  accent-color: var(--editorial-red);
}

.writing-task-form .task-start-button {
  max-width: 360px;
  margin: 20px 0 0 auto;
  padding: 14px 16px;
  color: white;
  background: var(--editorial-ink);
}

.writing-task-form .task-start-button:hover {
  background: var(--editorial-red);
}

.writing-task-form .task-start-button:disabled {
  opacity: 0.56;
  cursor: wait;
  transform: none;
}

.task-workspace .task-prototype-message {
  min-height: 15px;
  margin: 8px 0 0;
  color: #69736e;
  text-align: right;
}

.agent-result {
  scroll-margin-top: 94px;
  margin-top: 28px;
  padding: 28px;
  color: white;
  background:
    repeating-linear-gradient(transparent, transparent 31px, rgba(255, 255, 255, 0.035) 32px),
    var(--editorial-ink);
  box-shadow: 8px 9px 0 #cfc8ba;
}

.agent-result[hidden] {
  display: none;
}

.agent-result header {
  display: flex;
  align-items: start;
  justify-content: space-between;
  padding-bottom: 15px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.24);
}

.agent-result header div {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.agent-result header span {
  color: #d7ad55;
  font-family: Georgia, serif;
  font-size: 8px;
  letter-spacing: 1.5px;
}

.agent-result h4 {
  margin: 0;
  font-family: "Songti SC", "STSong", serif;
  font-size: 23px;
}

.agent-result header em {
  padding: 5px 7px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  color: rgba(255, 255, 255, 0.65);
  font-size: 8px;
  font-style: normal;
}

.agent-result pre {
  max-height: 520px;
  margin: 20px 0;
  overflow: auto;
  white-space: pre-wrap;
  color: rgba(255, 255, 255, 0.78);
  font-family: "Songti SC", "STSong", serif;
  font-size: 12px;
  line-height: 1.85;
}

.result-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.result-actions button {
  padding: 8px 12px;
  border: 1px solid rgba(255, 255, 255, 0.24);
  color: white;
  background: transparent;
  cursor: pointer;
  font-size: 9px;
}

.result-actions button:hover {
  color: var(--editorial-ink);
  background: #d7ad55;
}

@media (max-width: 920px) {
  #writing .task-catalog {
    grid-template-columns: 190px minmax(0, 1fr);
  }

  .task-workspace {
    padding: 26px 24px 30px;
  }

  .dynamic-form-fields {
    grid-template-columns: 1fr;
  }

  .dynamic-field.wide {
    grid-column: auto;
  }

  .workspace-steps {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .workspace-steps li:nth-child(4) {
    border-left: 0;
  }

  .workspace-steps li:nth-child(n + 4) {
    border-top: 1px solid #d7d1c4;
  }
}

@media (max-width: 680px) {
  #writing .task-catalog {
    grid-template-columns: 1fr;
  }

  #writing .task-list {
    position: relative;
    top: 0;
    max-height: 310px;
    overflow-y: auto;
  }

  .task-workspace {
    padding: 22px 16px 26px;
    box-shadow: 5px 7px 0 #ded7c9;
  }

  .writing-task-form {
    padding: 18px 14px;
  }

  .workspace-steps {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .workspace-steps li,
  .workspace-steps li:nth-child(4) {
    border: 0;
    border-top: 1px solid #d7d1c4;
  }

  .workspace-steps li:nth-child(-n + 2) {
    border-top: 0;
  }

  .workspace-steps li:nth-child(even) {
    border-left: 1px solid #d7d1c4;
  }

  .form-section-heading {
    align-items: start;
    flex-direction: column;
  }

  .form-choices span {
    min-width: 62px;
    padding: 8px 9px;
  }
}

/* PaperRed-inspired AI draft workspace prototype */
#writing > .hero,
#writing > .tool-section {
  display: none;
}

.draft-app {
  --draft-accent: #ff5e5e;
  --draft-accent-soft: #fff0ef;
  --draft-border: #e7e8ed;
  --draft-text: #30343b;
  min-height: calc(100vh - 76px);
  color: var(--draft-text);
  background: #f6f7fa;
}

.draft-notice {
  display: flex;
  min-height: 42px;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 8px 24px;
  border-bottom: 1px solid #f0e6dc;
  color: #7d7f85;
  background: #fff8ef;
  font-size: 12px;
}

.draft-notice > span {
  color: var(--draft-accent);
}

.draft-notice p {
  margin: 0;
}

.draft-notice em {
  padding: 3px 7px;
  border: 1px solid #ffc7c3;
  border-radius: 999px;
  color: var(--draft-accent);
  font-size: 8px;
  font-style: normal;
  font-weight: 700;
  letter-spacing: 0.7px;
}

.draft-layout {
  display: grid;
  min-height: calc(100vh - 118px);
  grid-template-columns: 182px 292px minmax(620px, 1fr);
}

.draft-sidebar {
  position: relative;
  z-index: 2;
  padding: 22px 12px;
  border-right: 1px solid var(--draft-border);
  background: white;
}

.draft-sidebar-title {
  padding: 0 11px 15px;
  border-bottom: 1px solid #eeeeef;
}

.draft-sidebar-title span {
  color: #a3a5aa;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 1.5px;
}

.draft-sidebar-title h2 {
  margin: 4px 0 0;
  font-size: 18px;
}

.draft-sidebar nav {
  display: grid;
  gap: 4px;
  margin-top: 12px;
}

.draft-sidebar nav button {
  display: grid;
  min-height: 42px;
  align-items: center;
  padding: 0 10px;
  border: 0;
  border-radius: 7px;
  color: #4d5157;
  background: transparent;
  grid-template-columns: 23px 1fr auto;
  gap: 7px;
  text-align: left;
}

.draft-sidebar nav button:not(:disabled) {
  cursor: pointer;
}

.draft-sidebar nav button.active {
  color: var(--draft-accent);
  background: var(--draft-accent-soft);
  font-weight: 600;
}

.draft-sidebar nav button:disabled {
  color: #7e8287;
}

.draft-sidebar nav i {
  display: grid;
  width: 21px;
  height: 21px;
  place-items: center;
  border-radius: 6px;
  color: #a4a6aa;
  background: #f2f3f5;
  font-size: 8px;
  font-style: normal;
}

.draft-sidebar nav .active i {
  color: white;
  background: var(--draft-accent);
}

.draft-sidebar nav span {
  font-size: 12px;
}

.draft-sidebar nav b {
  color: var(--draft-accent);
  font-size: 8px;
}

.draft-sidebar nav small {
  color: #c2c4c8;
  font-size: 8px;
}

.draft-sidebar > a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 14px;
  padding: 12px 14px;
  border: 1px solid #ffaaa5;
  border-radius: 4px;
  color: var(--draft-accent);
  font-size: 11px;
}

.draft-flow-map {
  position: relative;
  overflow: hidden;
  padding: 25px 20px 34px;
  border-right: 1px solid var(--draft-border);
  background: #fffefe;
}

.draft-flow-map::before {
  position: absolute;
  z-index: 0;
  top: 14px;
  left: 40px;
  color: rgba(255, 94, 94, 0.065);
  content: "THESIS";
  font-family: Georgia, serif;
  font-size: 62px;
  font-weight: 700;
  letter-spacing: -3px;
}

.draft-flow-map header,
.flow-map-list,
.flow-tip {
  position: relative;
  z-index: 1;
}

.draft-flow-map header {
  margin-bottom: 20px;
  padding: 9px 8px 14px;
  border-bottom: 1px solid #f0dedc;
}

.draft-flow-map header span {
  color: #b1b1b5;
  font-size: 8px;
  letter-spacing: 1.3px;
}

.draft-flow-map header h2 {
  display: inline-block;
  margin: 3px 8px 0 0;
  color: var(--draft-accent);
  font-size: 28px;
}

.draft-flow-map header em {
  padding: 3px 6px;
  border: 1px solid #ffb8b3;
  border-radius: 3px;
  color: var(--draft-accent);
  font-size: 8px;
  font-style: normal;
}

.flow-map-list {
  display: flex;
  align-items: center;
  flex-direction: column;
}

.flow-map-list article {
  display: grid;
  width: 100%;
  padding: 12px;
  border: 1px solid #ffd3d0;
  border-radius: 10px;
  background: linear-gradient(135deg, #fff9f8, white);
  box-shadow: 0 7px 18px rgba(255, 94, 94, 0.07);
  grid-template-columns: 25px 1fr;
  gap: 9px;
}

.flow-map-list article i {
  display: grid;
  width: 22px;
  height: 22px;
  place-items: center;
  border-radius: 50%;
  color: white;
  background: var(--draft-accent);
  font-size: 10px;
  font-style: normal;
  font-weight: 700;
}

.flow-map-list h3 {
  margin: 2px 0 6px;
  color: #ed5c59;
  font-size: 11px;
}

.flow-map-list p {
  margin: 0;
  color: #8c8d92;
  font-size: 9px;
  line-height: 1.55;
}

.flow-arrow {
  height: 23px;
  color: #ff8d86;
  font-size: 16px;
  line-height: 23px;
}

.flow-tip {
  display: flex;
  gap: 8px;
  margin-top: 17px;
  padding: 11px;
  border: 1px dashed #ffc9c5;
  border-radius: 7px;
  color: #8e8584;
  background: #fff9f8;
}

.flow-tip b {
  display: grid;
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 50%;
  color: white;
  background: #ff8d86;
  font-size: 10px;
}

.flow-tip p {
  margin: 0;
  font-size: 8px;
  line-height: 1.55;
}

.draft-main-panel {
  min-width: 0;
  padding: 16px clamp(20px, 3vw, 48px) 70px;
  background:
    radial-gradient(circle at 100% 0, rgba(255, 94, 94, 0.055), transparent 28%),
    #f7f8fb;
}

.draft-promo {
  display: flex;
  min-height: 56px;
  align-items: center;
  justify-content: center;
  gap: 18px;
  padding: 10px 20px;
  border-radius: 9px;
  background:
    radial-gradient(circle at 12% 130%, rgba(255, 94, 94, 0.13), transparent 30%),
    radial-gradient(circle at 88% -30%, rgba(82, 201, 224, 0.13), transparent 32%),
    white;
}

.draft-promo strong {
  color: var(--draft-accent);
  font-size: 18px;
  font-style: italic;
}

.draft-promo span {
  color: #ff8b83;
  font-size: 9px;
}

.draft-progress {
  display: grid;
  max-width: 780px;
  margin: 26px auto 0;
  padding: 0 10px 25px;
  list-style: none;
  grid-template-columns: repeat(4, 1fr);
}

.draft-progress li {
  position: relative;
  display: flex;
  align-items: center;
  color: #bbbcc0;
  flex-direction: column;
  gap: 6px;
}

.draft-progress li:not(:last-child)::after {
  position: absolute;
  z-index: 0;
  top: 11px;
  left: calc(50% + 12px);
  width: calc(100% - 24px);
  height: 4px;
  border-radius: 99px;
  background: #d6d7da;
  content: "";
}

.draft-progress li.complete:not(:last-child)::after,
.draft-progress li.active:not(:last-child)::after {
  background: var(--draft-accent);
}

.draft-progress i {
  position: relative;
  z-index: 1;
  display: grid;
  width: 24px;
  height: 24px;
  place-items: center;
  border-radius: 50%;
  color: white;
  background: #c7c8cc;
  font-size: 10px;
  font-style: normal;
}

.draft-progress li.active,
.draft-progress li.complete {
  color: var(--draft-accent);
}

.draft-progress li.active i,
.draft-progress li.complete i {
  background: var(--draft-accent);
}

.draft-progress span {
  font-size: 10px;
}

.draft-form-intro {
  max-width: 880px;
  margin: 0 auto 22px;
  text-align: center;
}

.draft-form-intro > span {
  color: var(--draft-accent);
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 1.5px;
}

.draft-form-intro h2 {
  margin: 7px 0;
  font-size: 22px;
  font-weight: 500;
}

.draft-form-intro p {
  margin: 0;
  color: #96989d;
  font-size: 10px;
}

.draft-form {
  display: grid;
  width: min(880px, 100%);
  margin: 0 auto;
  padding: 29px 38px 32px;
  border: 1px solid #ececf0;
  border-radius: 10px;
  background: white;
  box-shadow: 0 14px 40px rgba(62, 67, 78, 0.06);
  grid-template-columns: 1fr;
  gap: 18px;
}

.draft-field {
  display: grid;
  align-items: start;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: 12px;
}

.draft-field > label,
.draft-choice-row legend,
.draft-choice-title {
  padding-top: 11px;
  color: #52565d;
  font-size: 11px;
  text-align: right;
}

.draft-field b,
.draft-choice-row b,
.draft-choice-title b {
  color: var(--draft-accent);
}

.draft-input-action {
  display: grid;
  grid-template-columns: 1fr auto;
}

.draft-input-action input,
.draft-field textarea,
.draft-field select {
  width: 100%;
  min-height: 43px;
  padding: 10px 12px;
  border: 1px solid #dfe1e7;
  border-radius: 2px;
  outline: 0;
  color: #41454b;
  background: white;
  font-size: 11px;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.draft-input-action input {
  border-right: 0;
}

.draft-input-action button {
  min-width: 106px;
  border: 1px solid #ffd4d1;
  color: var(--draft-accent);
  background: var(--draft-accent-soft);
  cursor: pointer;
  font-size: 10px;
  font-weight: 600;
}

.draft-input-action button:hover {
  color: white;
  background: var(--draft-accent);
}

.draft-field textarea:focus,
.draft-field input:focus,
.draft-field select:focus {
  border-color: #ffaaa5;
  box-shadow: 0 0 0 3px rgba(255, 94, 94, 0.08);
}

.feed-field {
  position: relative;
}

.feed-field textarea {
  min-height: 100px;
  resize: vertical;
  line-height: 1.65;
}

.field-help-button {
  display: inline-grid;
  width: 16px;
  height: 16px;
  place-items: center;
  border: 1px solid var(--draft-accent);
  border-radius: 50%;
  color: var(--draft-accent);
  background: white;
  cursor: help;
  font-size: 9px;
}

.draft-counter {
  position: absolute;
  right: 10px;
  bottom: 7px;
  color: #a1a3a8;
  background: white;
  font-size: 9px;
}

.draft-upload-row {
  display: grid;
  align-items: center;
  padding-left: 108px;
  grid-template-columns: auto 1fr;
  gap: 12px;
}

.draft-upload-row > label {
  display: flex;
  min-height: 38px;
  align-items: center;
  padding: 0 13px;
  border-radius: 3px;
  color: white;
  background: var(--draft-accent);
  cursor: pointer;
  gap: 7px;
  font-size: 10px;
}

.draft-upload-row input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.draft-upload-row p {
  margin: 0;
  color: #a0a2a7;
  font-size: 8px;
  line-height: 1.5;
}

.draft-choice-row {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 15px;
  margin: 0;
  padding: 0;
  border: 0;
}

.draft-choice-row legend {
  float: left;
  width: 96px;
  flex: 0 0 96px;
  padding: 4px 12px 0 0;
}

.draft-choice-row label {
  display: flex;
  align-items: center;
  color: #565a61;
  cursor: pointer;
  gap: 5px;
  font-size: 10px;
}

.draft-choice-row input {
  width: 14px;
  height: 14px;
  margin: 0;
  accent-color: var(--draft-accent);
}

.draft-choice-row em {
  padding: 3px 6px;
  border: 1px solid #ffaaa5;
  border-radius: 3px;
  color: var(--draft-accent);
  font-size: 8px;
  font-style: normal;
}

.template-field {
  row-gap: 3px;
}

.template-field small {
  grid-column: 2;
  color: #ff9a38;
  font-size: 8px;
  line-height: 1.5;
}

.draft-agreement {
  display: flex;
  align-items: start;
  padding: 7px 0 0 108px;
  color: #898b91;
  cursor: pointer;
  gap: 7px;
  font-size: 9px;
  line-height: 1.5;
}

.draft-agreement input {
  margin: 0;
  accent-color: var(--draft-accent);
}

.draft-submit-row {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 16px;
}

.draft-submit-row p {
  margin: 0;
  color: #8c8f95;
  font-size: 9px;
}

.draft-submit-row button {
  display: flex;
  min-width: 218px;
  min-height: 44px;
  align-items: center;
  justify-content: space-between;
  padding: 0 17px;
  border: 0;
  border-radius: 4px;
  color: white;
  background: linear-gradient(90deg, #ff6863, #ff514f);
  cursor: pointer;
  font-size: 11px;
  font-weight: 600;
  box-shadow: 0 8px 18px rgba(255, 82, 78, 0.2);
}

.draft-submit-row button:disabled {
  opacity: 0.55;
  cursor: wait;
}

.draft-result {
  width: min(880px, 100%);
  scroll-margin-top: 96px;
  margin: 24px auto 0;
  padding: 29px 34px;
  border: 1px solid #ececf0;
  border-radius: 10px;
  background: white;
  box-shadow: 0 14px 40px rgba(62, 67, 78, 0.07);
}

.draft-result[hidden] {
  display: none;
}

.draft-result header {
  display: flex;
  align-items: start;
  justify-content: space-between;
  padding-bottom: 16px;
  border-bottom: 1px solid #ececf0;
}

.draft-result header span {
  color: var(--draft-accent);
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 1.3px;
}

.draft-result h2 {
  margin: 5px 0 0;
  font-size: 22px;
}

.draft-result header em {
  padding: 5px 8px;
  border: 1px solid #ffc8c5;
  border-radius: 999px;
  color: var(--draft-accent);
  font-size: 8px;
  font-style: normal;
}

.draft-result pre {
  max-height: 620px;
  margin: 20px 0;
  overflow: auto;
  white-space: pre-wrap;
  color: #555a61;
  font-family: "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 11px;
  line-height: 1.85;
}

.draft-result > div:last-child {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.draft-result > div button {
  padding: 9px 14px;
  border: 1px solid #ffaaa5;
  border-radius: 3px;
  color: var(--draft-accent);
  background: white;
  cursor: pointer;
  font-size: 9px;
}

.draft-result > div button:last-child {
  color: white;
  background: var(--draft-accent);
}

@media (max-width: 1240px) {
  .draft-layout {
    grid-template-columns: 168px 245px minmax(560px, 1fr);
  }

  .draft-choice-row {
    gap: 10px;
    flex-wrap: wrap;
  }

  .draft-choice-row legend {
    align-self: flex-start;
  }
}

@media (max-width: 1010px) {
  .draft-layout {
    grid-template-columns: 178px minmax(0, 1fr);
  }

  .draft-flow-map {
    display: none;
  }
}

@media (max-width: 720px) {
  .draft-app {
    min-height: calc(100vh - 66px);
  }

  .draft-notice {
    justify-content: flex-start;
    font-size: 9px;
  }

  .draft-notice em {
    display: none;
  }

  .draft-layout {
    grid-template-columns: 1fr;
  }

  .draft-sidebar {
    padding: 10px;
    border-right: 0;
    border-bottom: 1px solid var(--draft-border);
  }

  .draft-sidebar-title,
  .draft-sidebar > a {
    display: none;
  }

  .draft-sidebar nav {
    display: flex;
    margin: 0;
    overflow-x: auto;
  }

  .draft-sidebar nav button {
    min-width: 110px;
  }

  .draft-main-panel {
    padding: 12px 12px 50px;
  }

  .draft-promo {
    align-items: flex-start;
    flex-direction: column;
    gap: 4px;
  }

  .draft-promo strong {
    font-size: 15px;
  }

  .draft-progress {
    margin-top: 19px;
  }

  .draft-progress span {
    font-size: 8px;
  }

  .draft-form {
    padding: 21px 15px;
  }

  .draft-field {
    grid-template-columns: 1fr;
    gap: 6px;
  }

  .draft-field > label,
  .draft-choice-row legend {
    padding: 0;
    text-align: left;
  }

  .draft-upload-row {
    padding-left: 0;
    grid-template-columns: 1fr;
  }

  .draft-upload-row > label {
    justify-content: center;
  }

  .draft-choice-row {
    align-items: flex-start;
    padding: 4px 0;
  }

  .draft-choice-row legend {
    float: none;
    width: 100%;
    flex-basis: 100%;
  }

  .template-field small {
    grid-column: 1;
  }

  .draft-agreement {
    padding-left: 0;
  }

  .draft-submit-row {
    align-items: stretch;
    flex-direction: column;
  }

  .draft-submit-row button {
    width: 100%;
  }
}

.draft-step-panel[hidden] {
  display: none !important;
}

.draft-step-panel.active {
  animation: draft-step-enter 0.22s ease-out;
}

@keyframes draft-step-enter {
  from { opacity: 0; transform: translateY(7px); }
  to { opacity: 1; transform: translateY(0); }
}

.draft-stage-card {
  width: min(880px, 100%);
  min-height: 580px;
  margin: 0 auto;
  padding: 30px 36px 34px;
  border: 1px solid #ececf0;
  border-radius: 10px;
  background: white;
  box-shadow: 0 14px 40px rgba(62, 67, 78, 0.06);
}

.draft-stage-heading {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 20px;
  padding-bottom: 19px;
  border-bottom: 1px solid #ececf0;
}

.draft-stage-heading > div > span {
  color: var(--draft-accent);
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 1.5px;
}

.draft-stage-heading h2 {
  margin: 6px 0;
  font-size: 23px;
  font-weight: 500;
}

.draft-stage-heading p {
  margin: 0;
  color: #989ba0;
  font-size: 10px;
}

.draft-stage-heading > em {
  flex: 0 0 auto;
  padding: 5px 8px;
  border: 1px solid #ffc4c0;
  border-radius: 999px;
  color: var(--draft-accent);
  font-size: 8px;
  font-style: normal;
}

.reference-mode-tabs {
  display: flex;
  gap: 5px;
  margin: 23px 0 18px;
  padding: 4px;
  border-radius: 6px;
  background: #f4f5f7;
}

.reference-mode-tabs button {
  flex: 1;
  padding: 10px;
  border: 0;
  border-radius: 4px;
  color: #74777d;
  background: transparent;
  cursor: pointer;
  font-size: 10px;
}

.reference-mode-tabs button.active {
  color: var(--draft-accent);
  background: white;
  box-shadow: 0 3px 10px rgba(64, 67, 75, 0.07);
  font-weight: 600;
}

.reference-mode-panel[hidden] {
  display: none;
}

.reference-mode-placeholder {
  display: grid;
  min-height: 190px;
  padding: 30px;
  place-content: center;
  border: 1px dashed #dfe1e6;
  border-radius: 6px;
  color: #898d93;
  background: #fafbfc;
  text-align: center;
}

.reference-mode-placeholder[hidden] {
  display: none;
}

.reference-mode-placeholder strong {
  margin-bottom: 7px;
  color: #5f6369;
  font-size: 12px;
  font-weight: 600;
}

.reference-mode-placeholder p {
  max-width: 390px;
  margin: 0;
  font-size: 9px;
  line-height: 1.6;
}

.reference-api-notice {
  display: flex;
  align-items: start;
  gap: 10px;
  margin-bottom: 19px;
  padding: 12px 14px;
  border: 1px solid #ffe0bd;
  border-radius: 5px;
  color: #846e56;
  background: #fffaf2;
}

.reference-api-notice > b {
  display: grid;
  width: 19px;
  height: 19px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 50%;
  color: white;
  background: #eea85b;
  font-family: Georgia, serif;
  font-size: 10px;
}

.reference-api-notice strong {
  display: block;
  margin-bottom: 3px;
  font-size: 10px;
}

.reference-api-notice p {
  margin: 0;
  font-size: 9px;
  line-height: 1.5;
}

.reference-mode-panel > h3,
.reference-mode-panel > label {
  display: block;
  margin: 0 0 10px;
  font-size: 11px;
}

.reference-keywords {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.reference-keywords label {
  display: flex;
  min-height: 48px;
  align-items: center;
  gap: 8px;
  padding: 9px 11px;
  border: 1px solid #e2e3e7;
  border-radius: 4px;
  color: #686c72;
  cursor: pointer;
  background: #fbfbfc;
  font-size: 9px;
  line-height: 1.45;
}

.reference-keywords input {
  accent-color: var(--draft-accent);
}

.reference-api-notice.crossref {
  border-color: #d7e9dc;
  color: #58705e;
  background: #f6fbf7;
}

.reference-api-notice.crossref > b {
  background: #58a36d;
  font-family: inherit;
}

.reference-search-bar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  margin-top: 16px;
}

.reference-search-bar input {
  min-width: 0;
  height: 40px;
  padding: 0 12px;
  border: 1px solid #dfe1e7;
  border-radius: 4px;
  outline: 0;
  color: #555960;
  font: inherit;
  font-size: 10px;
}

.reference-search-bar input:focus {
  border-color: #ffaaa5;
  box-shadow: 0 0 0 3px rgba(255, 94, 94, 0.08);
}

.reference-search-bar button {
  padding: 0 15px;
  border: 0;
  border-radius: 4px;
  color: white;
  background: var(--draft-accent);
  cursor: pointer;
  font-size: 9px;
}

.reference-search-bar button:disabled {
  opacity: 0.58;
  cursor: wait;
}

.reference-search-meta {
  display: flex;
  justify-content: space-between;
  margin: 10px 2px 7px;
  color: #92959a;
  font-size: 8px;
}

.reference-search-meta strong {
  color: #6c7076;
  font-weight: 500;
}

.reference-selection-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 0 0 8px;
  padding: 8px 10px;
  border-radius: 4px;
  color: #666a70;
  background: #f8f9fa;
  font-size: 9px;
}

.reference-selection-toolbar label {
  display: flex;
  align-items: center;
  gap: 7px;
  cursor: pointer;
}

.reference-selection-toolbar input,
.reference-result-card > input {
  width: 15px;
  height: 15px;
  accent-color: var(--draft-accent);
  cursor: pointer;
}

.reference-selection-toolbar p {
  margin: 0;
}

.reference-selection-toolbar strong {
  color: var(--draft-accent);
  font-size: 11px;
}

.reference-results {
  max-height: 500px;
  padding: 7px;
  overflow: auto;
  border: 1px solid #e1e2e6;
  border-radius: 5px;
  background: #f8f9fa;
}

.reference-result-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 14px;
  padding: 14px 13px;
  border: 1px solid #e4e5e8;
  border-radius: 5px;
  background: white;
  cursor: pointer;
  transition: 0.15s ease;
}

.reference-result-card + .reference-result-card {
  margin-top: 7px;
}

.reference-result-card > input {
  margin: 2px 0 0;
}

.reference-result-card:has(> input:checked) {
  border-color: #ff8e87;
  background: #fff8f7;
  box-shadow: 0 3px 10px rgba(255, 94, 94, 0.06);
}

.reference-result-content,
.reference-result-title,
.reference-result-meta,
.reference-result-abstract,
.reference-result-keywords {
  display: flex;
}

.reference-result-content {
  min-width: 0;
  flex-direction: column;
  gap: 6px;
}

.reference-result-title {
  align-items: center;
  gap: 9px;
}

.reference-result-title em {
  flex: 0 0 auto;
  padding: 4px 8px;
  border-radius: 999px;
  color: #ec8a36;
  background: #fff6e8;
  font-size: 8px;
  font-style: normal;
  font-weight: 600;
}

.reference-result-title strong {
  color: #4f5359;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.45;
}

.reference-result-abstract {
  display: -webkit-box;
  overflow: hidden;
  color: #666a70;
  font-size: 9px;
  line-height: 1.65;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.reference-result-meta {
  color: #92959a;
  font-size: 8px;
  line-height: 1.4;
}

.reference-result-keywords {
  align-items: center;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 1px;
}

.reference-result-keywords b {
  margin-right: 2px;
  color: #6b6f75;
  font-size: 8px;
  font-weight: 500;
}

.reference-result-keywords i {
  padding: 3px 7px;
  border-radius: 999px;
  color: #50a85c;
  background: #edfaef;
  font-size: 7px;
  font-style: normal;
}

.reference-results-empty {
  display: grid;
  min-height: 110px;
  padding: 20px;
  place-items: center;
  color: #9a9da2;
  font-size: 9px;
  line-height: 1.6;
  text-align: center;
}

.reference-results-empty.loading {
  color: var(--draft-accent);
}

.reference-skip {
  display: flex;
  align-items: start;
  gap: 7px;
  margin-top: 15px;
  color: #8c8f94;
  cursor: pointer;
  font-size: 9px;
}

.reference-skip input {
  margin: 0;
  accent-color: var(--draft-accent);
}

.reference-mode-panel textarea {
  width: 100%;
  min-height: 236px;
  padding: 13px;
  resize: vertical;
  border: 1px solid #dfe1e7;
  border-radius: 4px;
  outline: 0;
  color: #555960;
  font: inherit;
  font-size: 10px;
  line-height: 1.65;
}

.reference-mode-panel textarea:focus,
.outline-chapter-title:focus,
.outline-chapter-words:focus,
.outline-subsection-input:focus {
  border-color: #ffaaa5;
  box-shadow: 0 0 0 3px rgba(255, 94, 94, 0.08);
}

.reference-import-meta {
  display: flex;
  justify-content: space-between;
  margin-top: 6px;
  color: #999ba0;
  font-size: 8px;
}

.reference-import-meta em {
  font-style: normal;
}

.education-reference-tip {
  margin-top: 17px;
  padding: 9px 12px;
  border-left: 3px solid var(--draft-accent);
  color: #777a80;
  background: #fff7f6;
  font-size: 9px;
}

.draft-stage-actions {
  display: flex;
  justify-content: flex-end;
  gap: 9px;
  margin-top: 25px;
}

.draft-stage-actions button {
  min-height: 41px;
  padding: 0 17px;
  border-radius: 4px;
  cursor: pointer;
  font-size: 10px;
}

.draft-stage-actions .secondary {
  border: 1px solid #dfe1e7;
  color: #74777d;
  background: white;
}

.draft-stage-actions .primary {
  border: 0;
  color: white;
  background: var(--draft-accent);
  box-shadow: 0 7px 16px rgba(255, 94, 94, 0.18);
}

.draft-stage-actions button:disabled {
  opacity: 0.55;
  cursor: wait;
}

.draft-stage-status {
  min-height: 14px;
  margin: 8px 0 0;
  color: #8c8f94;
  font-size: 9px;
  text-align: right;
}

.outline-editor-head {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) auto auto;
  align-items: center;
  gap: 14px;
  margin: 21px 0 10px;
}

.outline-editor-head > div:first-child {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.outline-editor-head strong {
  color: #555960;
  font-size: 10px;
}

.outline-editor-head span,
.outline-icon-legend {
  color: #96999e;
  font-size: 8px;
}

.outline-icon-legend {
  display: flex;
  align-items: center;
  gap: 4px;
  white-space: nowrap;
}

.outline-icon-legend i {
  display: inline-grid;
  min-width: 17px;
  height: 20px;
  place-items: center;
  color: #787b80;
  font-size: 15px;
  font-style: normal;
}

.outline-icon-legend i.code {
  min-width: 24px;
  font-size: 10px;
  font-weight: 700;
}

.outline-icon-legend svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.outline-editor-head > button {
  padding: 6px 9px;
  border: 1px solid #ffaaa5;
  border-radius: 3px;
  color: var(--draft-accent);
  background: white;
  cursor: pointer;
  font-size: 8px;
}

.outline-editor-head > button:disabled {
  opacity: 0.55;
  cursor: wait;
}

.outline-section-editor {
  overflow: hidden;
  border: 1px solid #dfe1e7;
  border-radius: 5px;
  background: white;
}

.outline-chapter-block + .outline-chapter-block {
  border-top: 1px solid #e6e7ea;
}

.outline-chapter-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 100px;
  align-items: center;
  gap: 12px;
  padding: 9px 12px;
  background: #f8f9fa;
}

.outline-chapter-title,
.outline-chapter-words,
.outline-subsection-input {
  min-width: 0;
  border: 1px solid transparent;
  border-radius: 3px;
  outline: 0;
  color: #555960;
  background: transparent;
  font: inherit;
}

.outline-chapter-title {
  padding: 5px 7px;
  font-size: 10px;
  font-weight: 600;
}

.outline-word-count {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  color: #94979c;
  font-size: 8px;
}

.outline-chapter-words {
  width: 62px;
  padding: 5px 4px;
  text-align: right;
  font-size: 9px;
}

.outline-chapter-title:hover,
.outline-chapter-words:hover,
.outline-subsection-input:hover {
  border-color: #e2e3e7;
  background: white;
}

.outline-subsection-list {
  padding: 4px 0;
}

.outline-subsection-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-height: 40px;
  padding: 5px 12px 5px 18px;
}

.outline-subsection-row + .outline-subsection-row {
  border-top: 1px dashed #eff0f2;
}

.outline-subsection-input {
  width: 100%;
  padding: 5px 7px;
  font-size: 9px;
}

.outline-assets {
  display: flex;
  align-items: center;
  gap: 5px;
}

.outline-assets[hidden] { display: none; }

.outline-asset-button {
  display: grid;
  width: 31px;
  height: 31px;
  padding: 0;
  place-items: center;
  border: 0;
  border-radius: 50%;
  color: #a1a4a9;
  background: transparent;
  cursor: pointer;
  font-size: 16px;
  line-height: 1;
  transition: 0.16s ease;
}

.outline-asset-button:hover {
  color: var(--draft-accent);
  background: transparent;
  transform: translateY(-1px) scale(1.08);
}

.outline-asset-button.active {
  color: var(--draft-accent);
  background: transparent;
  filter: drop-shadow(0 2px 4px rgba(255, 94, 94, 0.22));
  transform: scale(1.12);
}

.outline-asset-svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.outline-asset-svg circle {
  fill: currentColor;
  stroke: none;
}

.outline-asset-text-icon {
  display: block;
  font-size: 19px;
  font-weight: 500;
  line-height: 1;
}

.outline-asset-button[data-outline-asset="代码"] .outline-asset-text-icon {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: -1px;
}

.outline-lock-notice {
  display: flex;
  gap: 8px;
  margin-top: 12px;
  padding: 10px 12px;
  border: 1px solid #ffd5d2;
  border-radius: 4px;
  color: #8c6d69;
  background: #fff7f6;
}

.outline-lock-notice b {
  color: var(--draft-accent);
}

.outline-lock-notice p {
  margin: 0;
  font-size: 8px;
  line-height: 1.5;
}

@media (max-width: 720px) {
  .draft-stage-card {
    min-height: 0;
    padding: 22px 15px 26px;
  }

  .draft-stage-heading {
    flex-direction: column;
  }

  .reference-keywords {
    grid-template-columns: 1fr;
  }

  .reference-search-bar {
    grid-template-columns: 1fr;
  }

  .reference-search-bar button {
    min-height: 40px;
  }

  .reference-result-title {
    flex-direction: column;
    gap: 5px;
  }

  .outline-editor-head {
    grid-template-columns: 1fr auto;
  }

  .outline-icon-legend {
    grid-column: 1 / -1;
    grid-row: 2;
  }

  .outline-subsection-row {
    grid-template-columns: 1fr;
  }

  .outline-assets {
    justify-content: flex-end;
  }

  .draft-stage-actions {
    align-items: stretch;
    flex-direction: column-reverse;
  }
}

/* ========================================================================== */
/* PaperHere AI Draft Studio — 2026 visual system                             */
/* ========================================================================== */

.draft-app {
  --draft-accent: #ff735c;
  --draft-accent-strong: #f4523a;
  --draft-mint: #75e5c1;
  --draft-cyan: #76c8ff;
  --draft-ink: #17211f;
  --draft-muted: #6d7874;
  --draft-surface: rgba(255, 255, 255, 0.88);
  --draft-border: rgba(25, 54, 47, 0.11);
  --pointer-x: 70%;
  --pointer-y: 8%;
  position: relative;
  min-height: calc(100vh - 76px);
  overflow: clip;
  color: var(--draft-ink);
  background:
    radial-gradient(circle at var(--pointer-x) var(--pointer-y), rgba(117, 229, 193, 0.14), transparent 22rem),
    linear-gradient(rgba(28, 63, 54, 0.026) 1px, transparent 1px),
    linear-gradient(90deg, rgba(28, 63, 54, 0.026) 1px, transparent 1px),
    #f4f7f5;
  background-size: auto, 38px 38px, 38px 38px, auto;
}

.draft-app::before {
  position: absolute;
  z-index: 0;
  top: 36rem;
  left: -14rem;
  width: 34rem;
  height: 34rem;
  border-radius: 50%;
  background: rgba(118, 200, 255, 0.13);
  content: "";
  filter: blur(80px);
  pointer-events: none;
}

.draft-hero {
  position: relative;
  z-index: 1;
  display: grid;
  width: 100%;
  min-height: 390px;
  overflow: hidden;
  align-items: center;
  padding: 54px max(7vw, 48px);
  border: 0;
  color: white;
  background:
    radial-gradient(circle at 78% 44%, rgba(117, 229, 193, 0.14), transparent 26%),
    radial-gradient(circle at 92% 0%, rgba(118, 200, 255, 0.14), transparent 24%),
    linear-gradient(120deg, #101b1a 0%, #132522 50%, #0a1516 100%);
  grid-template-columns: minmax(0, 1.2fr) minmax(340px, 0.8fr);
  gap: 48px;
}

.draft-hero::before {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px);
  background-size: 52px 52px;
  content: "";
  mask-image: linear-gradient(90deg, black, transparent 75%);
}

.draft-hero::after {
  position: absolute;
  right: -80px;
  bottom: -210px;
  width: 520px;
  height: 520px;
  border: 1px solid rgba(117, 229, 193, 0.17);
  border-radius: 50%;
  box-shadow:
    0 0 0 56px rgba(117, 229, 193, 0.025),
    0 0 0 112px rgba(118, 200, 255, 0.02);
  content: "";
}

.draft-hero-copy,
.draft-hero-visual {
  position: relative;
  z-index: 2;
}

.draft-hero-copy {
  max-width: 780px;
}

.draft-kicker {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #b9c8c3;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.19em;
}

.draft-kicker i,
.draft-model-status > i,
.draft-live-pill i,
.draft-rail-note > i {
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--draft-mint);
  box-shadow: 0 0 0 5px rgba(117, 229, 193, 0.11), 0 0 18px rgba(117, 229, 193, 0.7);
  animation: draft-status-pulse 2.2s ease-in-out infinite;
}

.draft-hero h1 {
  display: grid;
  max-width: 760px;
  margin: 22px 0 18px;
  color: #ffffff;
  font-family: "SF Pro Display", Inter, "PingFang SC", sans-serif;
  font-size: clamp(38px, 3.75vw, 58px);
  font-weight: 600;
  letter-spacing: -0.045em;
  line-height: 1.16;
  gap: 5px;
}

.draft-hero h1 > span {
  display: block;
  color: #ffffff;
}

.draft-hero h1 .draft-title-accent {
  display: block;
  max-width: 100%;
  padding: 0;
  color: #ffd8ce;
}

.draft-hero-copy > p {
  max-width: 630px;
  margin: 0;
  color: #aebdb8;
  font-size: 16px;
  line-height: 1.8;
}

.draft-hero-features {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 28px;
}

.draft-hero-features span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 13px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 999px;
  color: #d9e2df;
  background: rgba(255, 255, 255, 0.045);
  font-size: 12px;
  backdrop-filter: blur(12px);
}

.draft-hero-features b {
  color: var(--draft-mint);
  font-size: 9px;
  letter-spacing: 0.08em;
}

.draft-hero-visual {
  min-height: 270px;
  perspective: 900px;
}

.draft-paper-stack {
  position: absolute;
  z-index: 3;
  top: 8px;
  left: 50%;
  width: 216px;
  height: 272px;
  padding: 25px;
  border: 1px solid rgba(255, 255, 255, 0.5);
  border-radius: 5px;
  color: #13201e;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(229, 247, 240, 0.93));
  box-shadow: -22px 26px 60px rgba(0, 0, 0, 0.3), 14px 14px 0 rgba(118, 200, 255, 0.13);
  transform: translateX(-50%) rotateY(-9deg) rotateZ(3deg);
  animation: draft-paper-float 5s ease-in-out infinite;
}

.draft-paper-stack::before,
.draft-paper-stack::after {
  position: absolute;
  z-index: -1;
  inset: 7px -8px -7px 8px;
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: inherit;
  background: #203330;
  content: "";
}

.draft-paper-stack::after {
  z-index: -2;
  inset: 15px -16px -15px 16px;
  background: #172825;
}

.draft-paper-stack > span {
  color: #557069;
  font-size: 8px;
  font-weight: 800;
  letter-spacing: 0.18em;
}

.draft-paper-stack > strong {
  display: block;
  margin: 12px 0 28px;
  color: var(--draft-accent);
  font-family: "SF Pro Display", Inter, "PingFang SC", sans-serif;
  font-size: 72px;
  font-style: normal;
  font-weight: 500;
  letter-spacing: -0.08em;
  line-height: 0.9;
}

.draft-paper-stack > p {
  margin: 10px 0 24px;
  color: #19332d;
  font-size: 20px;
  font-weight: 800;
  letter-spacing: 0.08em;
  line-height: 1.05;
}

.draft-paper-stack > i {
  display: block;
  width: 100%;
  height: 3px;
  margin-top: 8px;
  border-radius: 999px;
  background: #b8cac4;
}

.draft-paper-stack > i:nth-of-type(2) { width: 78%; }
.draft-paper-stack > i:nth-of-type(3) { width: 55%; background: var(--draft-accent); }

.draft-orbit {
  position: absolute;
  top: 50%;
  left: 50%;
  border: 1px solid rgba(117, 229, 193, 0.2);
  border-radius: 50%;
  transform: translate(-50%, -50%) rotate(-16deg);
}

.draft-orbit.orbit-one { width: 350px; height: 180px; }
.draft-orbit.orbit-two { width: 250px; height: 340px; transform: translate(-50%, -50%) rotate(32deg); }

.draft-orbit i {
  position: absolute;
  top: -5px;
  left: 50%;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--draft-cyan);
  box-shadow: 0 0 18px var(--draft-cyan);
}

.draft-live-pill {
  position: absolute;
  z-index: 4;
  right: 5%;
  bottom: 14px;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 10px 14px;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 999px;
  color: #dbe8e4;
  background: rgba(8, 18, 17, 0.7);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.13em;
  backdrop-filter: blur(14px);
}

.draft-layout {
  position: relative;
  z-index: 2;
  display: grid;
  width: min(1480px, calc(100% - 48px));
  min-height: 900px;
  margin: -34px auto 72px;
  grid-template-columns: 264px minmax(0, 1fr);
  border: 1px solid rgba(255, 255, 255, 0.8);
  border-radius: 24px;
  background: rgba(248, 250, 249, 0.86);
  box-shadow: 0 30px 90px rgba(22, 47, 41, 0.13);
  backdrop-filter: blur(22px);
}

.draft-sidebar {
  position: relative;
  display: flex;
  min-width: 0;
  padding: 32px 22px 26px;
  border: 0;
  border-right: 1px solid var(--draft-border);
  border-radius: 24px 0 0 24px;
  background: rgba(255, 255, 255, 0.72);
  flex-direction: column;
}

.draft-sidebar-title {
  padding: 0 5px 24px;
  border-bottom: 1px solid var(--draft-border);
}

.draft-sidebar-title span,
.draft-rail-heading span {
  color: #87948f;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.16em;
}

.draft-sidebar-title h2 {
  margin: 7px 0 4px;
  color: var(--draft-ink);
  font-size: 25px;
  letter-spacing: -0.04em;
}

.draft-sidebar-title p {
  margin: 0;
  color: #8a9591;
  font-size: 12px;
}

.draft-sidebar nav {
  display: grid;
  gap: 4px;
  margin: 18px 0 22px;
}

.draft-sidebar nav button {
  width: 100%;
  min-height: 45px;
  padding: 0 10px;
  border-radius: 11px;
  grid-template-columns: 28px minmax(0, 1fr) auto;
  gap: 9px;
  transition: background 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.draft-sidebar nav button.active {
  color: #16302a;
  background: linear-gradient(135deg, rgba(117, 229, 193, 0.24), rgba(118, 200, 255, 0.12));
  box-shadow: inset 0 0 0 1px rgba(65, 168, 135, 0.11);
}

.draft-sidebar nav i {
  width: 27px;
  height: 27px;
  border-radius: 8px;
  color: #14332b;
  background: var(--draft-mint);
  font-size: 9px;
  font-weight: 800;
}

.draft-sidebar nav button.active i {
  color: #16382f;
  background: var(--draft-mint);
}

.draft-sidebar nav span { overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.draft-sidebar nav b { color: #328268; font-size: 9px; font-weight: 700; }
.draft-sidebar nav small { color: #a4afab; font-size: 8px; white-space: nowrap; }

.draft-sidebar nav button:disabled {
  color: #69756f;
  background: transparent;
  cursor: not-allowed;
  opacity: 1;
}

.draft-sidebar nav button:disabled i {
  color: #82908a;
  background: #edf1ef;
}

.draft-sidebar nav button:disabled:hover {
  color: #52615b;
  background: rgba(235, 241, 238, 0.7);
}

.draft-rail-heading {
  display: flex;
  margin: 34px 5px 18px;
  flex-direction: column;
  gap: 5px;
}

.draft-rail-heading strong {
  color: #44514d;
  font-size: 13px;
}

.draft-rail-steps {
  position: relative;
  display: grid;
  margin: 0;
  padding: 0 0 0 4px;
  list-style: none;
  gap: 2px;
}

.draft-rail-steps::before {
  position: absolute;
  top: 24px;
  bottom: 24px;
  left: 20px;
  width: 1px;
  background: linear-gradient(var(--draft-mint), #d9e3df);
  content: "";
}

.draft-rail-steps li {
  position: relative;
  z-index: 1;
  display: grid;
  min-height: 66px;
  align-items: center;
  grid-template-columns: 34px 1fr;
  gap: 12px;
}

.draft-rail-steps i {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 1px solid #d8e1de;
  border-radius: 50%;
  color: #67746f;
  background: #fff;
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
}

.draft-rail-steps li.active i,
.draft-rail-steps li.complete i {
  border-color: transparent;
  color: #16382f;
  background: var(--draft-mint);
  box-shadow: 0 0 0 6px rgba(117, 229, 193, 0.12);
}

.draft-rail-steps li.active strong { color: #245f4d; }
.draft-rail-steps li.complete i::before { content: "✓"; }
.draft-rail-steps li.complete i { font-size: 0; }
.draft-rail-steps li.complete i::before { font-size: 12px; }

.draft-rail-steps div {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.draft-rail-steps strong { color: #47534f; font-size: 12px; }
.draft-rail-steps span { color: #98a19e; font-size: 10px; line-height: 1.4; }

.draft-rail-note {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  margin: auto 0 16px;
  padding: 15px;
  border: 1px solid rgba(63, 143, 118, 0.13);
  border-radius: 15px;
  background: rgba(117, 229, 193, 0.09);
}

.draft-rail-note > i { flex: 0 0 auto; margin-top: 4px; }
.draft-rail-note p { display: flex; margin: 0; flex-direction: column; gap: 3px; }
.draft-rail-note b { color: #315f51; font-size: 11px; }
.draft-rail-note span { color: #7f918a; font-size: 9px; line-height: 1.5; }

.draft-workflow-actions {
  display: grid;
  /* Follow the ten tools; don't consume the sidebar's remaining height. */
  margin-top: 0;
  gap: 8px;
}

.draft-history-trigger,
.draft-new-workflow {
  display: flex;
  width: 100%;
  min-height: 46px;
  align-items: center;
  justify-content: space-between;
  padding: 0 15px;
  border-radius: 13px;
  cursor: pointer;
  font-weight: 700;
}

.draft-history-trigger {
  border: 1px solid #cedbd6;
  color: #40645a;
  background: rgba(255,255,255,.72);
  font-size: 13px;
}

.draft-history-trigger b {
  display: grid;
  min-width: 24px;
  height: 24px;
  padding: 0 6px;
  place-items: center;
  border-radius: 12px;
  color: #286a56;
  background: #dcf3ea;
  font-size: 10px;
}

.draft-new-workflow {
  min-height: 48px;
  margin: 0;
  padding: 0 16px;
  border: 0;
  border-radius: 13px;
  color: white;
  background: var(--draft-ink);
  font-size: 12px;
  font-weight: 700;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.draft-new-workflow:hover {
  box-shadow: 0 12px 25px rgba(23, 33, 31, 0.18);
  transform: translateY(-2px);
}

.draft-history-trigger:hover { border-color: #8eb7a8; background: #f5fbf8; }

.workflow-history-modal[hidden] { display: none; }
.workflow-history-modal {
  position: fixed;
  z-index: 110;
  display: grid;
  inset: 0;
  height: 100vh;
  height: 100dvh;
  grid-template-rows: minmax(0, 1fr);
  grid-template-columns: minmax(0, 1fr);
  overflow: hidden;
  justify-items: end;
}
.workflow-history-backdrop {
  position: absolute;
  border: 0;
  background: rgba(15, 27, 24, .46);
  inset: 0;
  backdrop-filter: blur(8px);
  cursor: default;
}
.workflow-history-panel {
  position: relative;
  display: grid;
  width: min(520px, calc(100vw - 18px));
  height: 100%;
  min-height: 0;
  min-width: 0;
  max-height: 100%;
  overflow: hidden;
  grid-template-rows: auto minmax(0, 1fr) auto;
  background: #f8fbf9;
  box-shadow: -26px 0 70px rgba(12, 31, 25, .2);
  animation: workflow-history-enter .24s ease-out;
}
.workflow-history-panel > header { grid-row: 1; }
.workflow-history-panel > footer { grid-row: 3; }
/* Both views occupy the same bounded middle row, never an implicit auto row. */
.workflow-history-list, .workflow-version-pane {
  grid-row: 2;
  min-height: 0;
  min-width: 0;
  overflow-y: auto;
  overscroll-behavior-y: contain;
  scrollbar-gutter: stable;
}
.workflow-history-panel > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding: 34px 34px 25px;
  border-bottom: 1px solid #dce6e2;
  background: linear-gradient(145deg, #eff9f5, #fff9f5);
}
.workflow-history-panel header span { color: #4d907a; font-size: 9px; font-weight: 800; letter-spacing: .17em; }
.workflow-history-panel h2 { margin: 7px 0 5px; color: #1e3630; font-size: 27px; letter-spacing: -.04em; }
.workflow-history-panel header p { margin: 0; color: #7e8c87; font-size: 12px; line-height: 1.6; }
.workflow-history-close {
  width: 36px;
  height: 36px;
  flex: 0 0 auto;
  border: 0;
  border-radius: 50%;
  color: #687772;
  background: rgba(255,255,255,.78);
  cursor: pointer;
  font-size: 24px;
}
.workflow-history-list {
  display: grid;
  align-content: start;
  gap: 10px;
  padding: 20px 24px 30px;
  overflow-y: auto;
}
.workflow-history-empty { padding: 70px 24px; color: #8b9893; text-align: center; font-size: 13px; }
.workflow-version-pane[hidden], .workflow-history-list[hidden] { display: none; }
.workflow-version-pane {
  --version-ink: #223b34;
  --version-muted: #687772;
  --version-line: #dce6e2;
  --version-paper: #f8fbf9;
  overflow-y: auto;
  min-height: 0;
  padding: 20px 24px 30px;
  color: var(--version-ink);
  font-size: 16px;
  line-height: 1.65;
}
.workflow-version-toolbar, .workflow-version-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.workflow-version-pane button {
  min-height: 40px; padding: 7px 12px; border: 1px solid var(--version-line);
  border-radius: 6px; background: var(--version-paper); color: var(--version-ink);
  font: inherit; font-size: 14px; cursor: pointer; text-align: left;
}
.workflow-version-pane button:hover { border-color: var(--version-ink); }
.workflow-version-pane button:focus-visible { outline: 2px solid var(--version-ink); outline-offset: 3px; }
.workflow-version-pane p { overflow-wrap: anywhere; }
#workflowVersionStatus { color: var(--version-muted); font-size: 14px; }
.workflow-version-card { border-left: 3px solid var(--version-line); padding: 12px 0 18px 16px; margin: 14px 0; }
.workflow-version-card h3 { margin: 0; font-size: 17px; overflow-wrap: anywhere; }
.workflow-version-card p { margin: 6px 0 12px; font-size: 13px; color: var(--version-muted); }
#workflowVersionPreview:empty { display: none; }
#workflowVersionPreview { border-top: 1px solid var(--version-line); padding-top: 16px; }
#workflowVersionPreview dt { font-size: 13px; color: var(--version-muted); }
#workflowVersionPreview dd { margin: 0 0 12px; white-space: pre-wrap; overflow-wrap: anywhere; }
.workflow-version-document { border-top: 1px solid var(--version-line); margin-top: 24px; padding-top: 20px; }
.workflow-version-document h1 { font-size: 24px; }
.workflow-version-document h2 { font-size: 21px; }
.workflow-version-document h3 { font-size: 18px; }
.workflow-version-document img { max-width: 100%; height: auto; }
.workflow-version-document pre, .workflow-version-document .draft-document-table-wrap { max-width: 100%; overflow-x: auto; }
.workflow-history-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  padding: 17px 16px;
  border: 1px solid #dfe8e4;
  border-radius: 15px;
  background: white;
  transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.workflow-history-item:hover { border-color: #a6cabc; box-shadow: 0 10px 28px rgba(36, 72, 61, .07); transform: translateY(-1px); }
.workflow-history-item.active { border-color: #68ac95; background: linear-gradient(135deg, #f5fcf9, #fff); }
.workflow-history-copy { min-width: 0; }
.workflow-history-copy h3 { overflow: hidden; margin: 0 0 7px; color: #2c4039; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.workflow-history-copy p { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 8px; }
.workflow-history-copy p span { padding: 4px 7px; border-radius: 7px; color: #5e756d; background: #edf5f2; font-size: 10px; }
.workflow-history-copy time { color: #9aa5a1; font-size: 10px; }
.workflow-history-item-actions { display: flex; align-items: center; gap: 6px; }
.workflow-history-item-actions button {
  min-height: 34px;
  padding: 0 10px;
  border: 1px solid #cedbd6;
  border-radius: 9px;
  color: #3c6d5d;
  background: white;
  cursor: pointer;
  font-size: 10px;
}
.workflow-history-item-actions .restore { border-color: #376c5b; color: white; background: #376c5b; }
.workflow-history-item-actions .delete { width: 34px; padding: 0; color: #b36958; }
.workflow-history-item-actions button:disabled { color: #7b9189; background: #e8f2ee; cursor: default; }
.workflow-history-panel > footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 18px 24px;
  border-top: 1px solid #dce6e2;
  background: white;
}
.workflow-history-panel footer span { color: #99a5a0; font-size: 10px; }
.workflow-history-panel footer button { min-height: 40px; padding: 0 14px; border: 0; border-radius: 10px; color: white; background: #223b34; cursor: pointer; font-size: 11px; font-weight: 700; }
body.workflow-history-open { overflow: hidden; }
@keyframes workflow-history-enter { from { opacity: .4; transform: translateX(32px); } to { opacity: 1; transform: translateX(0); } }

.artifact-config-modal[hidden] { display: none; }
.artifact-config-modal {
  position: fixed;
  z-index: 130;
  display: grid;
  padding: 22px;
  inset: 0;
  place-items: center;
}
.artifact-config-backdrop {
  position: absolute;
  border: 0;
  background: rgba(13, 27, 23, .5);
  inset: 0;
  backdrop-filter: blur(10px);
}
.artifact-config-dialog {
  position: relative;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  width: min(720px, calc(100vw - 28px));
  max-height: min(780px, calc(100vh - 38px));
  overflow: hidden;
  border: 1px solid rgba(87, 132, 117, .22);
  border-radius: 24px;
  background: #fbfdfc;
  box-shadow: 0 32px 90px rgba(10, 31, 25, .25);
  animation: artifact-config-enter .22s ease-out;
}
.artifact-config-dialog > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding: 25px 28px 21px;
  border-bottom: 1px solid #e0e9e5;
  background: linear-gradient(135deg, #edf8f4 0%, #fff8f4 100%);
}
.artifact-config-dialog header span { color: #4b8c76; font-size: 9px; font-weight: 800; letter-spacing: .16em; }
.artifact-config-dialog h2 { margin: 7px 0 5px; color: #1e3730; font-size: 24px; letter-spacing: -.035em; }
.artifact-config-dialog header p { margin: 0; color: #798984; font-size: 12px; }
.artifact-config-close {
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 50%;
  color: #63766f;
  background: rgba(255,255,255,.75);
  cursor: pointer;
  font-size: 24px;
}
.artifact-config-body { display: grid; gap: 20px; padding: 24px 28px; min-height: 0; overflow-y: auto; }
.artifact-kind-options { display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.artifact-kind-options button {
  display: grid;
  min-height: 112px;
  gap: 7px;
  padding: 17px;
  border: 1px solid #dce7e2;
  border-radius: 16px;
  color: #42534d;
  background: white;
  cursor: pointer;
  text-align: left;
  transition: .18s ease;
}
.artifact-kind-options button:hover:not(:disabled) { border-color: #83b7a5; box-shadow: 0 10px 26px rgba(41, 94, 76, .08); transform: translateY(-1px); }
.artifact-kind-options button.active { border-color: #337a63; background: linear-gradient(145deg, #f0faf6, #fff); box-shadow: inset 0 0 0 1px #337a63; }
.artifact-kind-options button:disabled { opacity: .48; cursor: not-allowed; }
.artifact-kind-options strong { color: #243d35; font-size: 15px; }
.artifact-kind-options span { color: #75847f; font-size: 11px; line-height: 1.5; }
.artifact-kind-options i { width: max-content; padding: 4px 7px; border-radius: 999px; color: #3c7966; background: #e9f5f0; font-size: 9px; font-style: normal; }
.artifact-kind-options button:disabled i { color: #8b7771; background: #f6ece9; }
.artifact-config-fields { display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.artifact-config-fields label { display: grid; gap: 7px; color: #62716c; font-size: 11px; }
.artifact-config-fields label:first-child:last-child { grid-column: 1 / -1; }
.artifact-config-fields select { width: 100%; min-height: 44px; padding: 0 12px; border: 1px solid #d7e2de; border-radius: 10px; outline: none; color: #32483f; background: white; font-size: 12px; }
.artifact-config-fields select:focus { border-color: #63a18c; box-shadow: 0 0 0 3px rgba(73, 146, 121, .1); }
.artifact-data-gate { display: grid; gap: 12px; padding: 16px; border: 1px dashed #e0a99a; border-radius: 14px; background: #fff8f5; }
.artifact-data-gate[hidden] { display: none; }
.artifact-data-gate strong { color: #744d42; font-size: 13px; }
.artifact-data-gate p { margin: 4px 0 0; color: #92786f; font-size: 10px; line-height: 1.55; }
.artifact-data-gate label { width: max-content; padding: 10px 13px; border-radius: 9px; color: white; background: #315f50; cursor: pointer; font-size: 11px; font-weight: 700; }
.artifact-data-gate input { display: none; }
.artifact-data-gate > span { color: #4a7b6b; font-size: 10px; }
.artifact-data-gate > span.is-error { color: #c4543b; }
.artifact-config-dialog > footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 17px 28px; border-top: 1px solid #e2eae7; background: white; }
.artifact-config-dialog footer div { display: flex; gap: 9px; }
.artifact-config-dialog footer button { min-height: 39px; padding: 0 14px; border: 1px solid #d3dfda; border-radius: 10px; color: #526660; background: white; cursor: pointer; font-size: 11px; }
.artifact-config-dialog footer button.primary { border-color: #315f50; color: white; background: #315f50; font-weight: 700; }
.artifact-config-dialog footer button:disabled { border-color: #e3e8e6; color: #a8b0ad; background: #eef1f0; cursor: not-allowed; }
.artifact-config-dialog footer .artifact-config-remove { border-color: #f0d2ca; color: #b85d48; }
body.artifact-config-open { overflow: hidden; }
@keyframes artifact-config-enter { from { opacity: .35; transform: translateY(14px) scale(.985); } to { opacity: 1; transform: translateY(0) scale(1); } }

.outline-asset-button { position: relative; }
.outline-asset-button.needs-data { color: #b6aaa6; }
.outline-asset-subtype {
  position: absolute;
  right: -3px;
  bottom: -2px;
  display: grid;
  width: 16px;
  height: 16px;
  place-items: center;
  border-radius: 50%;
  color: white;
  background: #386f5d;
  box-shadow: 0 0 0 2px #fff;
  font-size: 8px;
  font-weight: 800;
  line-height: 1;
}

@media (max-width: 620px) {
  .artifact-config-modal { padding: 10px; }
  .artifact-config-dialog { width: 100%; border-radius: 18px; }
  .artifact-config-dialog > header, .artifact-config-body, .artifact-config-dialog > footer { padding-right: 18px; padding-left: 18px; }
  .artifact-kind-options, .artifact-config-fields { grid-template-columns: 1fr; }
}

.draft-main-panel {
  min-width: 0;
  padding: 34px clamp(28px, 4.2vw, 72px) 72px;
  border-radius: 0 24px 24px 0;
  background: transparent;
}

.draft-promo {
  display: flex;
  min-height: 74px;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 0 2px 22px;
  border-bottom: 1px solid var(--draft-border);
  border-radius: 0;
  background: transparent;
}

.draft-promo > div:first-child {
  display: grid;
  grid-template-columns: auto auto;
  align-items: end;
  gap: 2px 12px;
}

.draft-promo > div:first-child > span {
  grid-column: 1 / -1;
  color: #8c9894;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.17em;
}

.draft-promo strong {
  color: var(--draft-ink);
  font-size: 24px;
  font-style: normal;
  letter-spacing: -0.04em;
}

.draft-promo > div:first-child > strong {
  grid-column: 1;
}

.draft-promo p {
  margin: 0 0 2px;
  color: #8a9591;
  font-size: 11px;
}

.draft-model-status {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border: 1px solid rgba(63, 143, 118, 0.15);
  border-radius: 999px;
  color: #6e7f79;
  background: rgba(255, 255, 255, 0.72);
  font-size: 10px;
}

.draft-model-status span { color: #6e7f79; font-size: 10px; }
.draft-model-status b { color: #315e51; }

.draft-progress {
  position: sticky;
  z-index: 10;
  top: 88px;
  display: grid;
  width: 100%;
  max-width: 1040px;
  margin: 24px auto 38px;
  padding: 10px;
  border: 1px solid rgba(25, 54, 47, 0.09);
  border-radius: 18px;
  list-style: none;
  background: rgba(255, 255, 255, 0.82);
  box-shadow: 0 12px 35px rgba(28, 55, 48, 0.07);
  backdrop-filter: blur(18px);
  grid-template-columns: repeat(4, 1fr);
  scroll-margin-top: 88px;
}

.draft-progress li {
  position: relative;
  display: grid;
  min-width: 0;
  min-height: 56px;
  align-items: center;
  padding: 8px 12px;
  border-radius: 12px;
  color: #91a09a;
  grid-template-columns: 32px minmax(0, 1fr);
  gap: 10px;
  transition: color 0.25s ease, background 0.25s ease, transform 0.25s ease;
}

.draft-progress li:not(:last-child)::after {
  top: 50%;
  right: -4px;
  left: auto;
  width: 8px;
  height: 1px;
  background: #dce4e1;
}

.draft-progress li.active {
  color: #28483f;
  background: linear-gradient(135deg, rgba(117, 229, 193, 0.2), rgba(118, 200, 255, 0.08));
}

.draft-progress li.complete { color: #3d7b68; }

.draft-progress i {
  width: 32px;
  height: 32px;
  border: 1px solid #d8e1de;
  color: #788681;
  background: white;
  font-size: 11px;
  font-weight: 800;
}

.draft-progress li.active i,
.draft-progress li.complete i {
  color: #17382f;
  background: var(--draft-mint);
  box-shadow: 0 0 0 5px rgba(117, 229, 193, 0.1);
}

.draft-progress span {
  display: flex;
  min-width: 0;
  color: inherit;
  flex-direction: column;
  font-size: inherit;
  gap: 1px;
}

.draft-progress b { color: inherit; font-size: 12px; }
.draft-progress small { color: #a0aaa6; font-size: 9px; font-weight: 400; }

.draft-step-panel.active {
  animation: draft-stage-enter 0.55s cubic-bezier(.22, 1, .36, 1);
}

.draft-form-intro {
  max-width: 1020px;
  margin: 0 auto 26px;
  text-align: left;
}

.draft-form-intro > span,
.draft-stage-heading > div > span,
.draft-result header span {
  color: var(--draft-accent-strong);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.16em;
}

.draft-form-intro h2 {
  margin: 9px 0 8px;
  color: var(--draft-ink);
  font-size: clamp(27px, 2.5vw, 36px);
  font-weight: 600;
  letter-spacing: -0.045em;
}

.draft-form-intro p {
  color: #7e8a86;
  font-size: 13px;
  line-height: 1.7;
}

.draft-form,
.draft-stage-card,
.draft-result {
  width: min(1020px, 100%);
  border: 1px solid rgba(25, 54, 47, 0.1);
  border-radius: 20px;
  background: var(--draft-surface);
  box-shadow: 0 22px 60px rgba(29, 57, 49, 0.08);
  backdrop-filter: blur(18px);
}

.draft-form {
  padding: clamp(26px, 3.5vw, 46px);
  gap: 24px;
}

.draft-field {
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
}

.draft-field > label,
.draft-choice-row legend {
  padding: 0;
  color: #42504c;
  font-size: 13px;
  font-weight: 600;
  text-align: left;
}

.draft-input-action { gap: 8px; }

.draft-input-action input,
.draft-field textarea,
.draft-field select,
.reference-search-bar input,
.reference-mode-panel textarea {
  min-height: 52px;
  padding: 13px 16px;
  border: 1px solid #dbe3e0;
  border-radius: 12px;
  color: #273430;
  background: rgba(255, 255, 255, 0.88);
  font-size: 13px;
  transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease, background 0.25s ease;
}

.draft-input-action input { border-right: 1px solid #dbe3e0; }

.draft-input-action input:hover,
.draft-field textarea:hover,
.draft-field select:hover,
.reference-search-bar input:hover,
.reference-mode-panel textarea:hover {
  border-color: #b8c9c3;
  background: white;
}

.draft-input-action input:focus,
.draft-field textarea:focus,
.draft-field select:focus,
.reference-search-bar input:focus,
.reference-mode-panel textarea:focus,
.outline-chapter-title:focus,
.outline-chapter-words:focus,
.outline-subsection-input:focus {
  border-color: #65cba9;
  box-shadow: 0 0 0 4px rgba(117, 229, 193, 0.16), 0 8px 20px rgba(36, 95, 76, 0.07);
}

.draft-input-action button {
  min-width: 126px;
  border: 1px solid rgba(244, 82, 58, 0.14);
  border-radius: 12px;
  color: var(--draft-accent-strong);
  background: #fff1ee;
  font-size: 12px;
  transition: transform 0.2s ease, color 0.2s ease, background 0.2s ease;
}

.draft-input-action button:hover {
  color: white;
  background: var(--draft-accent);
  transform: translateY(-1px);
}

.feed-field textarea { min-height: 142px; padding-bottom: 32px; }
.draft-counter { right: 16px; bottom: 11px; color: #8d9995; font-size: 10px; }

.field-help-button {
  width: 19px;
  height: 19px;
  border-color: #a7b8b2;
  color: #71817b;
  font-size: 10px;
}

.draft-upload-row {
  padding-left: 0;
  grid-template-columns: auto 1fr;
  gap: 16px;
}

.draft-upload-row > label {
  min-height: 46px;
  padding: 0 17px;
  border: 1px solid rgba(63, 143, 118, 0.16);
  border-radius: 12px;
  color: #275b4c;
  background: rgba(117, 229, 193, 0.16);
  font-size: 12px;
  transition: transform 0.2s ease, background 0.2s ease;
}

.draft-upload-row > label:hover { background: rgba(117, 229, 193, 0.27); transform: translateY(-1px); }
.draft-upload-row p { color: #899691; font-size: 10px; }

.workflow-cloud-status { display: flex; align-items: flex-start; gap: 8px; margin-top: 10px; font-size: 13px; line-height: 1.6; color: #52675b; }
.workflow-cloud-status span { min-width: 0; overflow-wrap: anywhere; }
.workflow-cloud-status button { flex-shrink: 0; padding: 2px 6px; border: 1px solid #dce4df; border-radius: 4px; background: transparent; color: inherit; cursor: pointer; }
#workflowCloudStatus[data-state="error"] { color: #b42318; }
#draftTitleHint { margin: 6px 0 0; color: #62756b; font-size: 13px; line-height: 1.6; }
#draftTitleHint.is-error { color: #a1342c; }
#draftTitle[aria-invalid="true"] { border-color: #b64a40; }
.draft-title-suggestions { margin-top: 8px; overflow: hidden; border: 1px solid #dce4df; border-radius: 10px; background: #fff; }
.draft-title-suggestions[hidden] { display: none; }
.draft-title-suggestions-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; background: #f4f7f5; font-size: 14px; line-height: 1.6; }
.draft-title-suggestions-head button { border: 0; background: transparent; font-size: 24px; cursor: pointer; padding: 0 8px; }
#draftTitleSuggestionStatus.is-error { color: #b42318; }
#draftTitleSuggestionList { list-style: none; margin: 0; padding: 0; max-height: 360px; overflow-y: auto; }
#draftTitleSuggestionList button { display: block; width: 100%; border: 0; border-bottom: 1px solid #edf0ee; background: transparent; padding: 13px 16px; text-align: left; font: inherit; font-size: 16px; line-height: 1.6; color: inherit; cursor: pointer; overflow-wrap: anywhere; }
#draftTitleSuggestionList button:hover, #draftTitleSuggestionList button:focus-visible { background: #eef5f1; color: #275b4c; }
.draft-proposal-panel { min-width: 0; padding: 16px; border: 1px solid #dce4df; border-radius: 10px; }
.draft-proposal-panel[hidden], #draftProposalDetails[hidden] { display: none; }
.draft-proposal-summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; font-size: 14px; line-height: 1.6; }
.draft-proposal-summary button { flex-shrink: 0; padding: 6px 12px; border: 1px solid #dce4df; border-radius: 6px; background: transparent; cursor: pointer; }
#draftProposalStatus.is-error { color: #b42318; }
#draftProposalDetails { margin-top: 12px; font-size: 14px; }
#draftProposalDetails summary { cursor: pointer; }
#draftProposalPreview { max-height: 240px; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; font: inherit; line-height: 1.7; }

.draft-choice-row {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 9px;
}

.draft-form > .draft-choice-row {
  display: flex !important;
  width: 100% !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
}

.draft-choice-row legend,
.draft-choice-title {
  float: none;
  width: 100%;
  flex: 0 0 100%;
  padding: 0 0 3px;
}

.draft-form > .draft-choice-row > .draft-choice-title {
  display: block !important;
  width: 100% !important;
  flex: 0 0 100% !important;
  margin: 0 !important;
  padding: 0 0 5px !important;
  color: #42504c !important;
  text-align: left !important;
}

.draft-form > .draft-choice-row > label,
.draft-form > .draft-choice-row > em {
  margin-right: 0;
  text-align: left;
}

.draft-choice-row label {
  min-height: 39px;
  padding: 0 14px;
  border: 1px solid #dde5e2;
  border-radius: 10px;
  color: #63706c;
  background: rgba(255, 255, 255, 0.7);
  font-size: 12px;
  transition: border-color 0.2s ease, background 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.draft-choice-row label:hover { border-color: #aac4bb; color: #355c50; transform: translateY(-1px); }
.draft-choice-row label:has(input:checked) {
  border-color: rgba(57, 155, 124, 0.35);
  color: #245f4d;
  background: rgba(117, 229, 193, 0.16);
  box-shadow: inset 0 0 0 1px rgba(117, 229, 193, 0.08);
}

.draft-choice-row input { width: 15px; height: 15px; accent-color: #45ad8b; }
.draft-choice-row em {
  padding: 7px 10px;
  border: 0;
  border-radius: 8px;
  color: #8a7770;
  background: #fff4ee;
  font-size: 9px;
}

.template-field small { grid-column: 1; color: #a27149; font-size: 10px; }

.draft-agreement {
  padding: 10px 0 0;
  color: #74817d;
  font-size: 11px;
}

.draft-agreement input { width: 16px; height: 16px; accent-color: #45ad8b; }

.draft-submit-row { margin-top: 4px; gap: 18px; }
.draft-submit-row p { color: #7b8984; font-size: 11px; }

.draft-submit-row button,
.draft-stage-actions .primary {
  position: relative;
  overflow: hidden;
  border: 0;
  color: white;
  background: linear-gradient(100deg, #172c27, #244a40);
  box-shadow: 0 14px 28px rgba(23, 44, 39, 0.18);
}

.draft-submit-row button {
  min-width: 260px;
  min-height: 54px;
  padding: 0 20px;
  border-radius: 14px;
  font-size: 13px;
}

.draft-submit-row button::before,
.draft-stage-actions .primary::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: -60%;
  width: 45%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.16), transparent);
  content: "";
  transform: skewX(-18deg);
  transition: left 0.55s ease;
}

.draft-submit-row button:hover::before,
.draft-stage-actions .primary:hover::before { left: 120%; }

.draft-submit-row button:hover,
.draft-stage-actions .primary:hover { transform: translateY(-2px); box-shadow: 0 18px 34px rgba(23, 44, 39, 0.23); }

.draft-stage-card,
.draft-result {
  min-height: 590px;
  margin: 0 auto;
  padding: clamp(26px, 3.5vw, 44px);
}

.draft-stage-heading {
  padding-bottom: 24px;
  border-bottom-color: var(--draft-border);
}

.draft-stage-heading h2,
.draft-result h2 {
  margin: 8px 0;
  color: var(--draft-ink);
  font-size: 30px;
  font-weight: 600;
  letter-spacing: -0.04em;
}

.draft-stage-heading p { color: #7f8b87; font-size: 12px; line-height: 1.6; }
.draft-stage-heading > em,
.draft-result header em {
  padding: 8px 11px;
  border-color: rgba(63, 143, 118, 0.18);
  color: #397661;
  background: rgba(117, 229, 193, 0.12);
  font-size: 9px;
}

.reference-mode-tabs {
  gap: 8px;
  margin: 28px 0 22px;
  padding: 6px;
  border-radius: 14px;
  background: #edf2f0;
}

.reference-mode-tabs button {
  min-height: 46px;
  border-radius: 10px;
  font-size: 12px;
  transition: all 0.22s ease;
}

.reference-mode-tabs button.active {
  color: #245f4d;
  background: white;
  box-shadow: 0 7px 18px rgba(35, 64, 56, 0.08);
}

.reference-mode-tabs button:hover:not(.active) {
  color: #49635a;
  background: rgba(255, 255, 255, 0.48);
}

.reference-mode-placeholder {
  min-height: 250px;
  padding: 38px;
  border-color: #cbd8d4;
  border-radius: 16px;
  background: rgba(246, 249, 248, 0.8);
}

.reference-mode-placeholder strong { color: #3f514b; font-size: 16px; }
.reference-mode-placeholder p { max-width: 500px; color: #84918c; font-size: 11px; }

.reference-api-notice {
  gap: 13px;
  padding: 15px 17px;
  border-radius: 13px;
}

.reference-api-notice > b { width: 24px; height: 24px; font-size: 12px; }
.reference-api-notice strong { font-size: 12px; }
.reference-api-notice p { font-size: 10px; }

.reference-search-bar { gap: 10px; margin-top: 18px; }
.reference-search-bar input { height: 50px; }
.reference-search-bar button {
  padding: 0 20px;
  border-radius: 12px;
  background: var(--draft-ink);
  font-size: 11px;
  transition: transform 0.2s ease;
}
.reference-search-bar button:hover { transform: translateY(-1px); }

.reference-search-meta { margin: 12px 3px 9px; font-size: 10px; }
.reference-selection-toolbar { padding: 11px 13px; border-radius: 10px; font-size: 11px; }
.reference-selection-toolbar strong { color: var(--draft-accent-strong); font-size: 13px; }

.reference-results {
  max-height: 590px;
  padding: 9px;
  border-color: #d9e2df;
  border-radius: 14px;
  background: #f1f5f3;
}

.reference-result-card {
  gap: 18px;
  padding: 18px;
  border-color: #dde5e2;
  border-radius: 12px;
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.reference-result-card:hover { border-color: #a9c9be; box-shadow: 0 8px 22px rgba(30, 63, 53, 0.07); transform: translateY(-1px); }
.reference-result-card:has(> input:checked) { border-color: #62c7a6; background: #f5fffb; box-shadow: 0 8px 22px rgba(50, 139, 111, 0.09); }
.reference-result-title strong { color: #34433e; font-size: 14px; }
.reference-result-title em { font-size: 9px; }
.reference-result-abstract { color: #66736f; font-size: 11px; }
.reference-result-meta { font-size: 10px; }
.reference-result-keywords b { font-size: 10px; }
.reference-result-keywords i { padding: 4px 8px; color: #398363; background: #e8f8ef; font-size: 9px; }
.reference-results-empty { min-height: 150px; font-size: 11px; }
.reference-skip { font-size: 11px; }
.reference-mode-panel textarea { min-height: 280px; line-height: 1.75; }
.reference-import-meta { margin-top: 9px; font-size: 10px; }

.education-reference-tip {
  margin-top: 20px;
  padding: 12px 15px;
  border-left-color: var(--draft-accent);
  border-radius: 0 10px 10px 0;
  color: #7a6b65;
  background: #fff3ef;
  font-size: 10px;
}

.draft-stage-actions { gap: 10px; margin-top: 30px; }
.draft-stage-actions button { min-height: 48px; padding: 0 20px; border-radius: 12px; font-size: 11px; transition: all 0.2s ease; }
.draft-stage-actions .secondary { border-color: #d5dfdb; color: #60706a; background: rgba(255,255,255,.8); }
.draft-stage-actions .secondary:hover { border-color: #9eb7ae; color: #315e51; transform: translateY(-1px); }
.draft-stage-status { min-height: 18px; margin-top: 10px; font-size: 10px; }

.outline-editor-head {
  grid-template-columns: minmax(210px, 1fr) auto auto;
  gap: 18px;
  margin: 27px 0 13px;
}

.outline-editor-head strong { color: #3d4e48; font-size: 13px; }
.outline-editor-head span,
.outline-icon-legend { color: #84918c; font-size: 10px; }
.outline-icon-legend { gap: 7px; }
.outline-icon-legend i { min-width: 23px; height: 26px; font-size: 19px; }
.outline-icon-legend svg { width: 22px; height: 22px; }
.outline-icon-legend i.code { min-width: 31px; font-size: 12px; }
.outline-editor-head > button { padding: 9px 12px; border-color: #a9c9be; border-radius: 10px; color: #397661; font-size: 10px; }

.outline-section-editor { border-color: #d7e1dd; border-radius: 14px; }
.outline-chapter-block + .outline-chapter-block { border-top-color: #dce5e2; }
.outline-control-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin: 14px 0 10px;
  padding: 11px 13px;
  border: 1px solid #dbe7e2;
  border-radius: 12px;
  background: linear-gradient(135deg, #f7fbf9, #fffaf7);
}
.outline-summary,
.outline-control-actions { display: flex; align-items: center; gap: 9px; }
.outline-summary span {
  padding: 6px 9px;
  border-radius: 8px;
  color: #687872;
  background: rgba(255,255,255,.82);
  font-size: 11px;
}
.outline-summary b { color: #274b3f; font-size: 13px; }
.outline-summary i { color: inherit; font-style: normal; }
.outline-summary span.is-warning { color: #a4563f; background: #fff0eb; }
.outline-summary span.is-warning b { color: #c94e31; }
.outline-control-actions button,
.outline-add-section {
  border: 1px solid #b9d1c8;
  border-radius: 9px;
  color: #397661;
  background: white;
  cursor: pointer;
  font-size: 11px;
}
.outline-control-actions button { min-height: 34px; padding: 0 11px; }
.outline-control-actions .primary-quiet { color: white; background: #386f5d; border-color: #386f5d; }
.outline-chapter-header {
  grid-template-columns: 28px minmax(0, 1fr) 100px 30px 30px;
  padding: 13px 16px;
  background: #f0f5f3;
}
.outline-chapter-title { padding: 8px 10px; color: #33463f; font-size: 13px; }
.outline-word-count { color: #7f8c87; font-size: 10px; }
.outline-chapter-words { width: 70px; padding: 8px 5px; font-size: 11px; }
.outline-subsection-row { grid-template-columns: 25px minmax(0, 1fr) auto auto 30px; min-height: 52px; padding: 7px 16px; }
.outline-subsection-row[data-level="3"] { grid-template-columns: 25px minmax(0, 1fr) auto 30px; }
.artifact-config-fields input { min-width: 0; width: 100%; min-height: 44px; padding: 8px 12px; border: 1px solid #d7e2de; border-radius: 10px; color: #32483f; background: white; font: inherit; }
.artifact-config-fields label { font-size: 14px; }
.artifact-config-fields select { font-size: 14px; }
.outline-subsection-input { padding: 8px 10px; color: #53615c; font-size: 12px; }
.outline-assets { gap: 8px; }
.outline-asset-button { width: 36px; height: 36px; font-size: 20px; }
.outline-asset-svg { width: 24px; height: 24px; }
.outline-asset-text-icon { font-size: 22px; }
.outline-asset-button.active { color: var(--draft-accent-strong); filter: drop-shadow(0 3px 6px rgba(244, 82, 58, 0.24)); }
.outline-drag-handle,
.outline-delete-button,
.outline-word-lock {
  display: grid;
  width: 28px;
  height: 28px;
  padding: 0;
  place-items: center;
  border: 0;
  border-radius: 8px;
  color: #8b9b95;
  background: transparent;
  cursor: grab;
  font-size: 17px;
}
.outline-drag-handle:active { cursor: grabbing; }
.outline-delete-button { color: #a7aaa8; cursor: pointer; font-size: 20px; }
.outline-delete-button:hover { color: #e05b45; background: #fff0ec; }
.outline-delete-button:disabled { color: #c7ceca; cursor: not-allowed; }
.outline-word-lock { color: #9aa8a3; cursor: pointer; font-size: 13px; }
.outline-word-lock.active { color: #397661; background: #dff2ea; }
.outline-add-section {
  margin: 3px 16px 11px 49px;
  padding: 7px 11px;
  border-style: dashed;
  background: #fbfdfc;
}
.outline-add-section:hover,
.outline-control-actions button:hover { border-color: #55927d; background: #edf7f3; }
.outline-control-actions .primary-quiet:hover { color: white; background: #2e604f; }
.outline-chapter-block.is-dragging,
.outline-subsection-row.is-dragging { opacity: .42; }
.outline-chapter-block { transition: opacity .16s ease, box-shadow .16s ease; }
.outline-subsection-row { transition: opacity .16s ease, background .16s ease; }

.outline-lock-notice {
  gap: 10px;
  margin-top: 16px;
  padding: 13px 15px;
  border-color: #f5cfc6;
  border-radius: 11px;
  color: #826e68;
  background: #fff5f2;
}
.outline-lock-notice p { font-size: 10px; }

.draft-result { margin-top: 0; }
.draft-result header { padding-bottom: 22px; border-bottom-color: var(--draft-border); }
.draft-result pre {
  max-height: 720px;
  margin: 26px 0;
  padding: clamp(24px, 4vw, 52px);
  border: 1px solid #e0e5df;
  border-radius: 6px;
  color: #38443f;
  background:
    linear-gradient(90deg, transparent 47px, rgba(244, 82, 58, 0.1) 48px, transparent 49px),
    #fffefa;
  font-family: "Songti SC", STSong, "Noto Serif SC", serif;
  font-size: 14px;
  line-height: 2;
  box-shadow: 0 18px 45px rgba(45, 55, 49, 0.07);
}
.draft-result > div button { min-height: 44px; padding: 0 16px; border-color: #b6c8c1; border-radius: 10px; color: #396b5a; font-size: 11px; }
.draft-result > div button:last-child { border-color: var(--draft-ink); background: var(--draft-ink); }

.draft-app button:focus-visible,
.draft-app a:focus-visible,
.draft-app input:focus-visible,
.draft-app textarea:focus-visible,
.draft-app select:focus-visible {
  outline: 3px solid rgba(118, 200, 255, 0.55);
  outline-offset: 3px;
}

.draft-app button:disabled {
  cursor: wait;
  filter: saturate(0.75);
}

.draft-app .draft-sidebar nav button:disabled {
  cursor: not-allowed;
  filter: none;
}

.draft-stage-status:not(:empty),
.draft-submit-row p:not(:empty) {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.draft-stage-status:not(:empty)::before,
.draft-submit-row p:not(:empty)::before {
  width: 6px;
  height: 6px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--draft-mint);
  box-shadow: 0 0 0 4px rgba(117, 229, 193, 0.1);
  content: "";
}

/* Refine the persistent support control for the studio */
.floating-support {
  right: 0;
  border-color: rgba(117, 229, 193, 0.28);
  background: rgba(16, 30, 28, 0.93);
  box-shadow: 0 18px 50px rgba(10, 26, 22, 0.22);
  backdrop-filter: blur(18px);
}

@keyframes draft-status-pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.55; transform: scale(0.75); }
}

@keyframes draft-line-reveal {
  to { transform: scaleX(1); }
}

@keyframes draft-paper-float {
  0%, 100% { transform: translateX(-50%) translateY(0) rotateY(-9deg) rotateZ(3deg); }
  50% { transform: translateX(-50%) translateY(-10px) rotateY(-5deg) rotateZ(1.5deg); }
}

@keyframes draft-stage-enter {
  from { opacity: 0; transform: translateY(18px) scale(0.992); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (max-width: 1060px) {
  .draft-hero { min-height: 350px; padding: 48px 42px; grid-template-columns: minmax(0, 1fr) 300px; }
  .draft-hero h1 { font-size: clamp(34px, 4.15vw, 44px); }
  .draft-paper-stack { width: 184px; height: 238px; padding: 20px; }
  .draft-paper-stack > strong { font-size: 60px; }
  .draft-layout { width: calc(100% - 28px); grid-template-columns: 224px minmax(0, 1fr); }
  .draft-main-panel { padding-right: 30px; padding-left: 30px; }
  .draft-choice-row legend,
  .draft-choice-title { width: 100%; flex-basis: 100%; padding: 0 0 2px; text-align: left; }
  .draft-upload-row { padding-left: 0; }
  .draft-agreement { padding-left: 0; }
}

@media (max-width: 820px) {
  .draft-hero { min-height: 390px; padding: 46px 26px 70px; grid-template-columns: 1fr; }
  .draft-hero-copy { max-width: 620px; }
  .draft-hero h1 { font-size: clamp(34px, 8vw, 48px); }
  .draft-hero-visual { display: none; }
  .draft-layout { margin-top: -34px; grid-template-columns: 1fr; border-radius: 20px; }
  .draft-sidebar {
    display: block;
    padding: 18px 18px 12px;
    overflow: hidden;
    border-right: 0;
    border-bottom: 1px solid var(--draft-border);
    border-radius: 20px 20px 0 0;
  }
  .draft-sidebar-title { padding: 0 2px 13px; }
  .draft-sidebar-title h2 { display: inline; margin-right: 8px; font-size: 18px; }
  .draft-sidebar-title p { display: inline; font-size: 10px; }
  .draft-sidebar nav {
    display: flex;
    gap: 7px;
    margin: 12px 0 0;
    padding: 0 0 7px;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
  }
  .draft-sidebar nav button { min-width: 148px; flex: 0 0 148px; }
  .draft-sidebar nav button.active { min-width: 168px; flex-basis: 168px; }
  .draft-rail-note,
  .draft-sidebar > a { display: none; }
  .draft-workflow-actions { grid-template-columns: 1fr 1fr; margin-top: 10px; }
  .draft-main-panel { padding: 26px 20px 54px; border-radius: 20px; }
  .draft-promo { min-height: 64px; }
  .draft-progress { top: 78px; }
  .draft-progress li { min-height: 48px; padding: 7px; grid-template-columns: 28px minmax(0,1fr); gap: 7px; }
  .draft-progress i { width: 28px; height: 28px; }
  .draft-progress small { display: none; }
  .draft-field { grid-template-columns: 1fr; gap: 7px; }
  .draft-field > label { padding-top: 0; text-align: left; }
}

@media (min-width: 821px) {
  .draft-hero h1 > span,
  .draft-hero h1 > .draft-title-accent {
    white-space: normal;
  }
}

@media (max-width: 560px) {
  .site-header { height: 66px; padding: 0 16px; }
  .brand { font-size: 19px; }
  .brand-mark { width: 31px; height: 31px; }
  .draft-app { min-height: calc(100vh - 66px); }
  .draft-hero { min-height: 360px; padding: 40px 20px 62px; }
  .draft-kicker { font-size: 8px; letter-spacing: 0.13em; }
  .draft-hero h1 { margin-top: 18px; letter-spacing: -0.055em; }
  .draft-hero-copy > p { font-size: 13px; }
  .draft-hero-features { gap: 6px; margin-top: 22px; }
  .draft-hero-features span { padding: 7px 10px; font-size: 10px; }
  .draft-layout { width: calc(100% - 16px); margin-bottom: 36px; border-radius: 16px; }
  .draft-main-panel { padding: 21px 10px 42px; }
  .draft-workflow-actions { grid-template-columns: 1fr; }
  .workflow-history-panel > header { padding: 27px 22px 21px; }
  .workflow-history-panel h2 { font-size: 24px; }
  .workflow-history-list { padding: 15px 12px 24px; }
  .workflow-history-item { grid-template-columns: 1fr; }
  .workflow-history-item-actions { justify-content: flex-end; }
  .draft-promo { padding: 0 7px 16px; }
  .draft-promo strong { font-size: 20px; }
  .draft-promo p { display: none; }
  .draft-model-status { padding: 8px; }
  .draft-model-status span { display: none; }
  .draft-progress { top: 72px; margin: 16px auto 28px; padding: 6px; border-radius: 14px; }
  .draft-progress li { display: flex; min-height: 40px; justify-content: center; padding: 5px; }
  .draft-progress li span { display: none; }
  .draft-progress li:not(:last-child)::after { right: -3px; width: 6px; }
  .draft-form-intro { padding: 0 8px; }
  .draft-form-intro h2 { font-size: 27px; }
  .draft-form-intro p { font-size: 11px; }
  .draft-form,
  .draft-stage-card,
  .draft-result { padding: 22px 15px 25px; border-radius: 15px; }
  .draft-input-action { grid-template-columns: 1fr; }
  .draft-input-action button { min-height: 44px; }
  .draft-upload-row { grid-template-columns: 1fr; }
  .draft-upload-row > label { justify-content: center; }
  .draft-choice-row { gap: 7px; }
  .draft-choice-row label { min-height: 36px; padding: 0 11px; }
  .draft-submit-row { align-items: stretch; flex-direction: column; }
  .draft-submit-row button { width: 100%; min-width: 0; }
  .draft-stage-heading { flex-direction: column; }
  .draft-stage-heading h2,
  .draft-result h2 { font-size: 25px; }
  .reference-search-bar { grid-template-columns: 1fr; }
  .reference-search-bar button { min-height: 46px; }
  .outline-editor-head { grid-template-columns: 1fr auto; }
  .outline-icon-legend { grid-column: 1 / -1; grid-row: 2; overflow-x: auto; }
  .outline-control-bar { align-items: stretch; flex-direction: column; }
  .outline-summary { flex-wrap: wrap; }
  .outline-control-actions { justify-content: flex-end; }
  .outline-chapter-header { grid-template-columns: 25px minmax(0, 1fr) 84px 28px 28px; gap: 5px; padding: 10px 8px; }
  .outline-subsection-row, .outline-subsection-row[data-level="3"] { grid-template-columns: 24px minmax(0, 1fr) 28px; gap: 5px; padding: 7px 8px; }
  .outline-subsection-row .outline-delete-button { grid-column: 3; grid-row: 1; }
  .outline-subsection-row .outline-add-child { grid-column: 2; justify-self: start; }
  .outline-subsection-row .outline-assets { grid-column: 2 / -1; }
  .outline-assets { justify-content: flex-end; }
  .outline-add-section { margin-left: 38px; }
  .draft-stage-actions { align-items: stretch; flex-direction: column-reverse; }
  .draft-result pre { padding: 22px 18px; background: #fffefa; font-size: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  .draft-app *,
  .draft-app *::before,
  .draft-app *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* Readability and recoverable generation errors */
.generation-copy {
  overflow-y: auto;
  padding: 46px 48px 34px;
}

.generation-dialog {
  max-height: calc(100vh - 48px);
}

.generation-modal.failed .generation-dialog {
  height: min(590px, calc(100dvh - 48px));
}

.generation-modal.failed .generation-copy {
  min-height: 0;
  overflow: hidden;
}

.generation-label {
  font-size: 12px;
}

.generation-copy > p {
  min-height: 48px;
  color: #64736d;
  font-size: 15px;
  line-height: 1.65;
}

.generation-phases {
  gap: 13px;
}

.generation-phases li {
  min-height: 29px;
  font-size: 14px;
  grid-template-columns: 23px 1fr;
}

.generation-phases li::before {
  width: 20px;
  height: 20px;
}

.generation-meta {
  padding-top: 18px;
  font-size: 12px;
}

.generation-error-panel {
  min-height: 0;
  margin-top: 20px;
  padding: 15px 16px;
  border: 1px solid #f2bbb2;
  border-radius: 13px;
  color: #713b33;
  background: #fff3f0;
}

.generation-modal.failed .generation-error-panel {
  flex: 1 1 auto;
  max-height: min(270px, 34dvh);
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

.generation-error-panel[hidden],
.generation-actions[hidden],
.generation-progress[hidden],
.generation-phases[hidden] {
  display: none !important;
}

.generation-error-panel strong {
  display: block;
  margin-bottom: 7px;
  color: #9f3f31;
  font-size: 15px;
}

.generation-error-panel p {
  margin: 0;
  color: #713b33;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.65;
  overflow-wrap: anywhere;
  white-space: pre-line;
}

.generation-error-panel small {
  display: block;
  margin-top: 8px;
  color: #8d625b;
  font-size: 13px;
  line-height: 1.6;
}

.generation-actions {
  display: flex;
  flex: 0 0 auto;
  justify-content: flex-end;
  margin-top: 14px;
  gap: 10px;
}

.generation-modal.failed .generation-actions {
  position: relative;
  z-index: 2;
  padding-top: 12px;
  border-top: 1px solid rgba(159, 64, 51, .12);
  background: rgba(250, 252, 251, .98);
}

.generation-modal.failed .generation-meta {
  flex: 0 0 auto;
  margin-top: 0;
}

.generation-actions button {
  min-height: 46px;
  padding: 0 19px;
  border: 0;
  border-radius: 11px;
  color: white;
  background: #9f4033;
  cursor: pointer;
  font-size: 14px;
  font-weight: 700;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.generation-actions button:hover {
  box-shadow: 0 10px 24px rgba(139, 49, 37, 0.2);
  transform: translateY(-1px);
}

.generation-actions .generation-retry {
  color: #21493e;
  background: #dcefe9;
}

.generation-running-actions {
  display: flex;
  min-height: 42px;
  margin-top: 16px;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  color: #71807a;
  font-size: 12px;
}

.generation-running-actions[hidden] {
  display: none;
}

.generation-running-actions button {
  flex: 0 0 auto;
  min-height: 36px;
  padding: 0 14px;
  border: 1px solid #d6dfdc;
  border-radius: 10px;
  color: #68756f;
  background: #fff;
  cursor: pointer;
  font-size: 12px;
  font-weight: 700;
}

.generation-running-actions button:hover {
  border-color: #ef8a79;
  color: #a64234;
  background: #fff7f5;
}

/* A small task receipt stays available without locking the workspace. */
.generation-dismiss {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 3;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 50%;
  color: var(--muted);
  background: var(--paper);
  cursor: pointer;
  font-size: 26px;
  line-height: 1;
}
.generation-dialog .generation-label { padding-right: 36px; }
.generation-notice[hidden] { display: none; }
.generation-notice {
  position: fixed;
  z-index: 85;
  left: 24px;
  bottom: max(20px, env(safe-area-inset-bottom));
  display: flex;
  align-items: center;
  gap: 12px;
  width: min(480px, calc(100vw - 100px));
  padding: 16px;
  border: 1px solid var(--line);
  border-left: 3px solid var(--green);
  border-radius: 12px;
  color: var(--ink);
  background: var(--paper);
  box-shadow: 0 8px 28px rgba(31, 63, 53, 0.12);
}
.generation-notice-copy { flex: 1; min-width: 0; }
.generation-notice-copy strong { display: block; font-size: 16px; line-height: 1.5; }
.generation-notice-copy span { display: block; margin-top: 3px; color: var(--muted); font-size: 14px; line-height: 1.5; }
.generation-notice-mark { flex: 0 0 auto; color: var(--green); font: 700 22px/1 ui-monospace, monospace; }
.generation-notice[data-state="running"] .generation-notice-mark { animation: generation-notice-pulse 1.5s ease-in-out infinite; }
.generation-notice[data-state="failed"] { border-left-color: var(--coral); }
.generation-notice[data-state="failed"] .generation-notice-mark { color: var(--coral); }
.generation-notice button { flex: 0 0 auto; min-height: 40px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--green-pale); color: var(--green-dark); font-size: 14px; font-weight: 600; cursor: pointer; }
.generation-notice .generation-notice-dismiss { padding: 6px; min-width: 32px; border: 0; background: transparent; color: var(--muted); font-size: 22px; }
.generation-dismiss:hover, .generation-notice button:hover { border-color: var(--green); color: var(--green); }
.generation-dismiss:focus-visible, .generation-notice button:focus-visible { outline: 3px solid var(--green); outline-offset: 3px; }
@keyframes generation-notice-pulse { 50% { opacity: 0.4; } }
@media (max-width: 600px) {
  .generation-notice { left: 12px; width: calc(100vw - 84px); padding: 12px; gap: 8px; display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; }
  .generation-notice-mark { font-size: 18px; }
  .generation-notice-copy { grid-column: 2 / 4; }
  .generation-notice > button { grid-column: 2; justify-self: start; }
  .generation-notice > .generation-notice-dismiss { grid-column: 3; }
}
@media (prefers-reduced-motion: reduce) {
  .generation-notice[data-state="running"] .generation-notice-mark { animation: none; }
}

.dataset-upload-panel {
  padding: 20px;
  border: 1px solid #dce8e4;
  border-radius: 18px;
  background: linear-gradient(145deg, #fbfdfc, #f3f8f6);
}

.dataset-upload-heading,
.dataset-upload-control,
.artifact-readiness header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.dataset-upload-heading strong,
.artifact-readiness header strong {
  display: block;
  color: #203b33;
  font-size: 16px;
}

.dataset-upload-heading p {
  margin: 5px 0 0;
  color: #6d7c76;
  font-size: 13px;
  line-height: 1.65;
}

.dataset-upload-heading > span {
  flex: 0 0 auto;
  color: #638077;
  font-size: 12px;
  font-weight: 700;
}

.dataset-upload-control {
  margin-top: 16px;
}

.dataset-upload-control > label {
  display: flex;
  min-height: 62px;
  flex: 1;
  align-items: center;
  gap: 13px;
  padding: 10px 14px;
  border: 1px dashed #b8cbc5;
  border-radius: 13px;
  background: #fff;
  cursor: pointer;
}

.dataset-upload-control input { display: none; }

.dataset-upload-control label > span {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border-radius: 11px;
  color: #315f53;
  background: #e6f2ee;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .04em;
}

.dataset-upload-control label strong,
.dataset-upload-control label small { display: block; }
.dataset-upload-control label strong { color: #243d35; font-size: 14px; }
.dataset-upload-control label small { margin-top: 3px; color: #81908b; font-size: 11px; }

.dataset-upload-control > button {
  min-height: 44px;
  padding: 0 18px;
  border: 0;
  border-radius: 12px;
  color: #fff;
  background: #315f53;
  font-weight: 800;
  cursor: pointer;
}

.dataset-upload-control > button:disabled { opacity: .45; cursor: default; }

.dataset-profile-card {
  display: flex;
  margin-top: 14px;
  align-items: center;
  gap: 12px;
  padding: 13px 15px;
  border-radius: 12px;
  background: #e9f5f1;
}

.dataset-profile-card[hidden] { display: none; }
.dataset-profile-card > i { color: #2c7a65; font-size: 18px; font-style: normal; font-weight: 900; }
.dataset-profile-card strong { display: block; color: #23473d; font-size: 13px; }
.dataset-profile-card p { margin: 3px 0 0; color: #637971; font-size: 12px; }
.dataset-upload-status { min-height: 18px; margin: 10px 0 0; color: #64766f; font-size: 12px; }
.dataset-upload-status.is-error { color: #b4483a; }

.dataset-library {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid #dce8e4;
}

.dataset-library[hidden] { display: none; }

.dataset-library > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.dataset-library > header strong {
  display: block;
  color: #243d35;
  font-size: 14px;
}

.dataset-library > header p {
  margin: 4px 0 0;
  color: #7a8984;
  font-size: 12px;
  line-height: 1.55;
}

.dataset-library > header > span {
  flex: 0 0 auto;
  padding: 5px 9px;
  border-radius: 999px;
  color: #466c61;
  background: #e6f1ed;
  font-size: 11px;
  font-weight: 800;
}

.dataset-library-list {
  display: grid;
  max-height: 310px;
  margin-top: 12px;
  gap: 8px;
  overflow-y: auto;
  scrollbar-gutter: stable;
}

.dataset-library-item {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 11px 12px;
  border: 1px solid #dfe9e6;
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.9);
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.dataset-library-item:hover {
  border-color: #bcd2cb;
  box-shadow: 0 8px 24px rgba(40, 79, 68, .08);
  transform: translateY(-1px);
}

.dataset-library-item.is-active {
  border-color: #91b8ac;
  background: linear-gradient(120deg, #f2faf7, #fff);
  box-shadow: inset 3px 0 0 #367565;
}

.dataset-library-icon {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border-radius: 11px;
  color: #315f53;
  background: #e4f1ed;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .04em;
}

.dataset-library-details { min-width: 0; }

.dataset-library-name {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 8px;
}

.dataset-library-name strong {
  overflow: hidden;
  color: #263f37;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dataset-library-name em {
  flex: 0 0 auto;
  padding: 3px 7px;
  border-radius: 999px;
  color: #276451;
  background: #dcefe9;
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
}

.dataset-library-details p {
  margin: 4px 0 0;
  overflow: hidden;
  color: #80908a;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dataset-library-actions {
  display: flex;
  align-items: center;
  gap: 5px;
}

.dataset-library-actions button,
.dataset-library-actions a {
  min-height: 32px;
  padding: 0 9px;
  border: 1px solid #d6e2de;
  border-radius: 9px;
  color: #365d52;
  background: #fff;
  cursor: pointer;
  font: inherit;
  font-size: 11px;
  font-weight: 750;
  line-height: 30px;
  text-align: center;
  text-decoration: none;
}

.dataset-library-actions button:hover,
.dataset-library-actions a:hover {
  border-color: #91b8ac;
  color: #245447;
  background: #f4faf8;
}

.dataset-library-actions button:disabled {
  color: #83918c;
  background: #f1f4f3;
  cursor: default;
}

.dataset-library-actions .is-danger { color: #a64a3e; }
.dataset-library-actions .is-danger:hover { border-color: #efb8af; color: #9d3e32; background: #fff4f2; }

.artifact-readiness {
  margin-top: 20px;
  padding: 18px 20px;
  border: 1px solid #d7e5e0;
  border-radius: 16px;
  background: #f8fbfa;
}

.artifact-readiness[hidden] { display: none; }
.artifact-readiness header > div { display: flex; align-items: baseline; gap: 10px; }
.artifact-readiness header span { color: #de6d5b; font-size: 11px; font-weight: 900; letter-spacing: .08em; }
.artifact-readiness header em { padding: 5px 10px; border-radius: 999px; color: #2f6859; background: #e3f1ec; font-size: 11px; font-style: normal; font-weight: 800; }
.artifact-readiness header em.is-warning { color: #a9503f; background: #fff0ec; }
.artifact-readiness > p { margin: 10px 0 0; color: #64746e; font-size: 13px; line-height: 1.7; }

.draft-document-figure-image {
  display: block;
  width: min(100%, 760px);
  height: auto;
  margin: 0 auto;
  border-radius: 8px;
  background: #fff;
}

@media (max-width: 760px) {
  .dataset-upload-heading,
  .dataset-upload-control { align-items: stretch; flex-direction: column; }
  .dataset-upload-heading > span { align-self: flex-start; }
  .dataset-upload-control > button { width: 100%; }
  .dataset-library-item { grid-template-columns: 38px minmax(0, 1fr); }
  .dataset-library-icon { width: 38px; height: 38px; }
  .dataset-library-actions { grid-column: 1 / -1; justify-content: flex-end; }
}

.generation-modal.failed .generation-progress i {
  width: 100%;
  background: #ef7967;
  animation: none;
}

.generation-modal.failed .generation-meta {
  margin-top: 2px;
  padding-top: 12px;
}

.generation-modal.failed .generation-copy {
  justify-content: center;
}

.draft-sidebar nav span { font-size: 14px; }
.draft-sidebar nav b { font-size: 11px; }
.draft-sidebar nav small { font-size: 10px; }
.draft-rail-heading strong { font-size: 15px; }
.draft-rail-steps strong { font-size: 14px; }
.draft-rail-steps span { font-size: 12px; }
.draft-rail-note b { font-size: 13px; }
.draft-rail-note span { font-size: 11px; }
.draft-sidebar > a { font-size: 14px; }

.draft-promo > div:first-child > span { font-size: 11px; }
.draft-promo p { font-size: 14px; }
.draft-model-status,
.draft-model-status span { font-size: 12px; }
.draft-progress b { font-size: 14px; }
.draft-progress small { font-size: 11px; }

/* 智能初稿四步导航：固定高度、清晰状态与更强的视觉层级 */
.draft-progress {
  isolation: isolate;
  gap: 7px;
  min-height: 76px;
  margin-top: 26px;
  margin-bottom: 42px;
  padding: 8px;
  border: 1px solid rgba(33, 76, 64, 0.1);
  border-radius: 20px;
  background:
    linear-gradient(120deg, rgba(236, 250, 245, 0.86), rgba(255, 255, 255, 0.92) 45%, rgba(241, 248, 255, 0.88));
  box-shadow: 0 14px 40px rgba(32, 67, 57, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.86);
}

.draft-progress li {
  min-height: 58px;
  padding: 9px 13px;
  border: 1px solid transparent;
  border-radius: 14px;
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 11px;
}

.draft-progress li:not(:last-child)::after {
  z-index: 2;
  top: 50%;
  right: -9px;
  width: 11px;
  height: 2px;
  border-radius: 10px;
  background: #d9e5e1;
  transform: translateY(-50%);
}

.draft-progress li.complete:not(:last-child)::after {
  background: linear-gradient(90deg, #58b99a, #95d9c3);
}

.draft-progress li.active:not(:last-child)::after {
  background: linear-gradient(90deg, #65cbaa, #a4ddca);
}

.draft-progress li.active {
  color: #f6fffc;
  border-color: rgba(28, 87, 69, 0.14);
  background:
    radial-gradient(circle at 94% 0%, rgba(116, 229, 193, 0.32), transparent 42%),
    linear-gradient(135deg, #183f34, #286a57);
  box-shadow: 0 10px 24px rgba(30, 86, 68, 0.2);
  transform: translateY(-1px);
}

.draft-progress li.complete {
  color: #316f5c;
  border-color: rgba(84, 174, 145, 0.13);
  background: rgba(229, 248, 241, 0.68);
}

.draft-progress i {
  width: 38px;
  height: 38px;
  border: 1px solid #d7e3df;
  color: #72827c;
  background: rgba(255, 255, 255, 0.9);
  font-size: 12px;
  box-shadow: 0 5px 13px rgba(38, 72, 62, 0.07);
}

.draft-progress li.active i {
  border-color: rgba(255, 255, 255, 0.34);
  color: #173d32;
  background: #83e4c4;
  box-shadow: 0 0 0 5px rgba(130, 228, 196, 0.12), 0 7px 16px rgba(8, 43, 33, 0.2);
}

.draft-progress li.complete i {
  border-color: rgba(79, 177, 145, 0.24);
  color: transparent;
  background: #d9f5eb;
  font-size: 0;
  box-shadow: none;
}

.draft-progress li.complete i::before {
  color: #27765d;
  content: "✓";
  font-size: 15px;
  font-weight: 900;
}

.draft-progress span {
  justify-content: center;
  gap: 3px;
  line-height: 1.2;
}

.draft-progress b {
  overflow: hidden;
  font-size: 15px;
  font-weight: 750;
  letter-spacing: 0.01em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.draft-progress small {
  color: #91a09a;
  font-size: 11px;
  letter-spacing: 0.06em;
  white-space: nowrap;
}

.draft-progress li.active small {
  color: rgba(237, 255, 249, 0.68);
}

.draft-progress li.complete small {
  color: #72a191;
}

@media (max-width: 820px) {
  .draft-progress {
    min-height: 66px;
    margin-bottom: 32px;
    padding: 6px;
    gap: 4px;
  }

  .draft-progress li {
    min-height: 52px;
    padding: 7px 8px;
    grid-template-columns: 32px minmax(0, 1fr);
    gap: 7px;
  }

  .draft-progress i {
    width: 32px;
    height: 32px;
  }

  .draft-progress b { font-size: 12px; }
  .draft-progress small { display: none; }
}

@media (max-width: 560px) {
  .draft-progress {
    min-height: 52px;
    margin-top: 16px;
    margin-bottom: 28px;
    border-radius: 16px;
  }

  .draft-progress li {
    min-height: 66px;
    display: grid;
    padding: 4px;
    border-radius: 11px;
    grid-template-columns: minmax(0, 1fr);
    justify-items: center;
    gap: 5px;
  }

  .draft-progress li span { display: grid; text-align: center; }
  .draft-progress i { width: 30px; height: 30px; }
  #writing .draft-hero h1 { font-size: clamp(30px, 8.5vw, 42px); line-height: 1.3; letter-spacing: -0.025em; }
  .draft-hero-copy > p { font-size: 15px; }
}

.draft-form-intro > span,
.draft-stage-heading > div > span,
.draft-result header span { font-size: 12px; }
.draft-form-intro p { font-size: 15px; }
.draft-field > label,
.draft-choice-row legend,
.draft-choice-title { font-size: 15px; }
.draft-input-action input,
.draft-field textarea,
.draft-field select,
.reference-search-bar input,
.reference-mode-panel textarea { font-size: 15px; }
.reference-import-editor[hidden],
.reference-import-review[hidden] { display: none; }

.reference-import-heading,
.reference-import-review-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 14px;
}

.reference-import-heading > div,
.reference-import-review-head > div {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 5px;
}

.reference-import-heading strong,
.reference-import-review-head strong {
  color: #34433e;
  font-size: 17px;
}

.reference-import-heading span,
.reference-import-review-head span {
  color: #74827d;
  font-size: 13px;
  line-height: 1.6;
}

.reference-import-parse {
  width: 100%;
  min-height: 48px;
  margin-top: 16px;
  border: 0;
  border-radius: 12px;
  color: white;
  background: linear-gradient(135deg, #2f4b42, #417c68);
  box-shadow: 0 10px 24px rgba(39, 85, 69, 0.16);
  cursor: pointer;
  font: inherit;
  font-size: 15px;
  font-weight: 650;
  transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
}

.reference-import-parse:hover { transform: translateY(-1px); box-shadow: 0 14px 30px rgba(39, 85, 69, 0.2); }
.reference-import-parse:disabled { opacity: 0.65; cursor: wait; transform: none; }

/* Reference prerequisites: a true disabled state, without the active hover glow. */
.draft-app .draft-stage-actions .primary:disabled,
.draft-app .reference-import-parse:disabled {
  border: 1px solid var(--line);
  color: var(--muted);
  background: #eef1f0;
  box-shadow: none;
  opacity: 1;
  cursor: not-allowed;
  transform: none;
}
.draft-app .draft-stage-actions .primary:disabled::before { display: none; }
.reference-readiness-hint {
  margin: 10px 0 0;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.6;
}
.reference-readiness-hint[hidden] { display: none; }

.reference-import-review-head button {
  flex: 0 0 auto;
  min-height: 40px;
  padding: 0 14px;
  border: 1px solid #cddbd6;
  border-radius: 10px;
  color: #3f6b5c;
  background: #f7fbf9;
  cursor: pointer;
  font: inherit;
  font-size: 13px;
}

.reference-result-card.imported.needs-attention {
  border-color: #efc8c3;
  background: #fff9f8;
  cursor: default;
}

.reference-result-card.imported.needs-attention > input { cursor: not-allowed; opacity: 0.42; }
.reference-result-abstract.imported-citation { -webkit-line-clamp: 4; color: #52615c; }

.reference-import-checks {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 3px;
}

.reference-import-checks i {
  padding: 5px 9px;
  border-radius: 999px;
  font-size: 12px;
  font-style: normal;
  line-height: 1.25;
}

.reference-import-checks .passed { color: #287356; background: #e8f7ef; }
.reference-import-checks .neutral { color: #7a6b42; background: #faf4df; }
.reference-import-checks .failed { color: #a4473f; background: #fdecea; }

@media (max-width: 720px) {
  .reference-import-review-head { align-items: stretch; flex-direction: column; }
  .reference-import-review-head button { width: 100%; }
}
.draft-input-action button,
.draft-upload-row > label,
.draft-choice-row label { font-size: 14px; }
.draft-upload-row p,
.template-field small,
.draft-choice-row em { font-size: 12px; line-height: 1.55; }
.draft-counter { font-size: 12px; }

.draft-knowledge-hint {
  margin: 0;
  color: #66746e;
  font-size: 14px;
  line-height: 1.7;
}
.draft-agreement,
.draft-submit-row p { font-size: 13px; }
.draft-submit-row button { font-size: 15px; }

.template-upload-control strong { font-size: 15px; }
.template-upload-control small,
.template-analysis-card p,
.template-upload-status { font-size: 13px; }
.template-analysis-card strong { font-size: 15px; }

.draft-stage-heading p { font-size: 14px; }
.draft-stage-heading > em,
.draft-result header em { font-size: 11px; }
.reference-mode-tabs button { font-size: 14px; }
.reference-mode-placeholder strong { font-size: 18px; }
.reference-mode-placeholder p { font-size: 14px; }
.reference-api-notice strong { font-size: 14px; }
.reference-api-notice p { font-size: 13px; line-height: 1.6; }
.reference-search-bar button { font-size: 14px; }
.reference-search-meta,
.reference-selection-toolbar,
.reference-skip { font-size: 13px; }
.reference-selection-toolbar strong { font-size: 15px; }
.reference-result-title strong { font-size: 16px; }
.reference-result-title em { font-size: 11px; }
.reference-result-abstract { font-size: 14px; line-height: 1.75; }
.reference-result-meta,
.reference-result-keywords b,
.reference-result-keywords i,
.reference-import-meta,
.education-reference-tip { font-size: 12px; }
.reference-results-empty { font-size: 14px; }

.draft-stage-actions button { font-size: 14px; }
.draft-stage-status { font-size: 13px; line-height: 1.6; }
.outline-editor-head strong { font-size: 15px; }
.outline-editor-head span,
.outline-icon-legend { font-size: 13px; }
.outline-editor-head > button { font-size: 13px; }
.outline-chapter-title { font-size: 15px; }
.outline-word-count,
.outline-chapter-words { font-size: 13px; }
.outline-subsection-input { font-size: 14px; }
.outline-lock-notice p { font-size: 13px; line-height: 1.65; }

.draft-result-content {
  font-size: 16px;
  line-height: 1.95;
}
.draft-result-content h1 {
  margin-bottom: 34px;
  font-size: 25px;
  letter-spacing: 0.01em;
}
.draft-result-content h2 { font-size: 22px; }
.draft-result-content h3 { font-size: 19px; }
.draft-result-content h4,
.draft-result-content h5,
.draft-result-content h6 { font-size: 18px; }
.draft-result .draft-result-content pre { font-size: 14px; }
.draft-document-table-wrap table { font-size: 14px; }
.draft-document-table-caption {
  margin: 0 0 10px !important;
  color: #42534d;
  font-weight: 650;
  text-align: center !important;
  text-indent: 0 !important;
}
.draft-document-bibliography-entry {
  padding-left: 2.4em;
  text-indent: -2.4em !important;
}
.draft-document-reference {
  margin: 0 0.08em;
  padding: 0 0.12em;
  border-radius: 3px;
  color: #24745d;
  text-decoration-color: rgba(36, 116, 93, 0.38);
  text-decoration-line: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.16em;
  cursor: pointer;
  transition: color 0.16s ease, background-color 0.16s ease, text-decoration-color 0.16s ease;
}
.draft-document-reference:hover {
  color: #155741;
  background: rgba(95, 199, 164, 0.13);
  text-decoration-color: #24745d;
}
.draft-document-reference:focus-visible {
  outline: 2px solid rgba(57, 153, 121, 0.42);
  outline-offset: 2px;
}
.draft-result-content [data-draft-preview-target] {
  scroll-margin-block: 90px;
}
.draft-result-content [data-draft-preview-target]:focus { outline: none; }
.draft-result-content .is-reference-target {
  animation: draft-reference-target-flash 1.8s ease both;
}
@keyframes draft-reference-target-flash {
  0%, 100% { box-shadow: none; }
  12%, 62% {
    border-radius: 6px;
    background-color: rgba(255, 226, 137, 0.3);
    box-shadow: 0 0 0 6px rgba(255, 226, 137, 0.18);
  }
}
.draft-result-content figcaption { font-size: 13px; }
.draft-result .draft-result-actions button { font-size: 14px; }
.draft-export-status { font-size: 13px; line-height: 1.6; }

.draft-stage-status.is-error,
.template-upload-status.is-error {
  display: flex;
  margin-top: 12px;
  padding: 12px 14px;
  border: 1px solid #f1c1b8;
  border-radius: 10px;
  color: #8e3f34;
  background: #fff3f0;
  font-weight: 650;
}

.draft-stage-status.is-error::before {
  background: #ec6f5d;
  box-shadow: 0 0 0 4px rgba(236, 111, 93, 0.12);
}

@media (max-width: 680px) {
  .generation-dialog { overflow-y: auto; }
  .generation-copy { overflow: visible; }
  .generation-modal.failed .generation-dialog {
    height: min(620px, calc(100dvh - 28px));
    overflow: hidden;
  }
  .generation-modal.failed .generation-visual { display: none; }
  .generation-modal.failed .generation-copy { overflow: hidden; }
  .generation-modal.failed .generation-error-panel { max-height: none; }
  .generation-copy > p { font-size: 14px; }
  .generation-phases li { font-size: 13px; }
  .generation-meta { font-size: 11px; }
  .generation-error-panel p { font-size: 13px; }
  .generation-error-panel small { font-size: 12px; }
}

@media (max-width: 560px) {
  .draft-form-intro p,
  .draft-stage-heading p,
  .reference-result-abstract,
  .draft-result-content { font-size: 14px; }
  .draft-field > label,
  .draft-choice-title,
  .draft-input-action input,
  .draft-field textarea,
  .draft-field select { font-size: 14px; }
  .draft-result-content h1 { font-size: 21px; }
  .draft-result-content h2 { font-size: 19px; }
  .draft-result-content h3 { font-size: 17px; }
}


/* Planner notices above the outline editor: what is missing, what will not be invented. */
.outline-planning-notices {
  margin: 0 0 12px;
  padding: 10px 14px;
  border: 1px solid #f3dcb1;
  border-radius: 4px;
  color: #6b5326;
  background: #fffaf0;
}

.outline-planning-notices strong {
  display: block;
  margin-bottom: 4px;
  font-size: 13px;
}

.outline-planning-notices ul {
  margin: 0;
  padding-left: 18px;
  font-size: 13px;
  line-height: 1.65;
}
/* Reference collection: existing studio palette, one shared selected shelf. */
#draftReferencesStep .reference-mode-tabs button { font-size: 16px; min-width: 0; }
#draftReferencesStep .reference-mode-tabs button:focus-visible,
#draftReferencesStep .reference-selected-panel summary:focus-visible,
#draftReferencesStep .reference-selected-row button:focus-visible,
#draftReferencesStep .reference-recommend-context button:focus-visible { outline: 2px solid #245f4d; outline-offset: 3px; }
#draftReferencesStep .reference-selected-panel { margin: 0 0 22px; border: 1px solid #d9e2df; border-radius: 12px; background: #f4f7f5; }
#draftReferencesStep .reference-selected-panel summary { padding: 15px 18px; color: var(--draft-ink); font-size: 16px; cursor: pointer; }
#draftReferencesStep .reference-selected-panel summary strong { margin-left: 6px; font-variant-numeric: tabular-nums; }
#draftReferencesStep .reference-selected-panel summary span { color: var(--draft-muted); font-size: 14px; }
#draftReferencesStep .reference-selected-list { max-height: 250px; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; padding: 0 18px 8px; }
#draftReferencesStep .reference-selected-list > p { color: var(--draft-muted); font-size: 14px; line-height: 1.7; }
#draftReferencesStep .reference-selected-row { display: flex; align-items: center; gap: 16px; padding: 12px 0; border-top: 1px solid #d9e2df; }
#draftReferencesStep .reference-selected-row > div { flex: 1; min-width: 0; }
#draftReferencesStep .reference-selected-row strong { display: block; color: #34433e; font-size: 15px; line-height: 1.6; overflow-wrap: anywhere; }
#draftReferencesStep .reference-selected-row span { display: block; color: var(--draft-muted); font-size: 13px; line-height: 1.6; }
#draftReferencesStep .reference-selected-row button,
#draftReferencesStep .reference-recommend-context button { flex: none; border: 1px solid #cbd8d4; border-radius: 6px; background: #fff; color: #245f4d; padding: 8px 12px; min-height: 40px; font: inherit; font-size: 14px; cursor: pointer; }
#draftReferencesStep .reference-selected-row button:hover,
#draftReferencesStep .reference-recommend-context button:hover { background: #edf2f0; }
#draftReferencesStep .reference-recommend-context { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 16px 0; }
#draftReferencesStep .reference-recommend-context p { margin: 0; color: var(--draft-muted); font-size: 15px; line-height: 1.7; overflow-wrap: anywhere; }
#draftReferencesStep .reference-search-meta { gap: 12px; align-items: flex-start; line-height: 1.65; }
#draftReferencesStep .reference-search-meta strong { overflow-wrap: anywhere; }
#draftReferencesStep .reference-search-meta span { flex-shrink: 0; }
#draftReferencesStep .reference-skip { font-size: 14px; line-height: 1.7; }
#draftReferencesStep .reference-skip:has(input:disabled) { color: var(--draft-muted); }
#draftReferencesStep [hidden] { display: none !important; }
@media (max-width: 600px) {
  #draftReferencesStep .reference-mode-tabs { gap: 3px; padding: 4px; }
  #draftReferencesStep .reference-mode-tabs button { padding: 10px 4px; font-size: 14px; line-height: 1.5; }
  #draftReferencesStep .reference-selected-panel summary { padding: 12px; }
  #draftReferencesStep .reference-selected-panel summary span { font-size: 12px; }
  #draftReferencesStep .reference-selected-list { padding: 0 12px 8px; }
  #draftReferencesStep .reference-recommend-context { flex-wrap: wrap; }
  #draftReferencesStep .reference-search-meta { flex-direction: column; gap: 4px; }
}
/* Task-specific controls reuse the studio palette, typography and layout. */
.journal-fields { margin: 0; padding: 0 0 24px; border: 0; border-bottom: 1px solid #dbe3e0; min-width: 0; }
.journal-fields legend { margin-bottom: 20px; font-size: 20px; font-weight: 650; }
.journal-field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 24px; }
.journal-field-grid select { width: 100%; min-width: 0; font-size: 16px; }
#journalRequirementsHint { margin: 14px 0 0; font-size: 14px; line-height: 1.7; color: var(--muted, #65675e); }
@media (max-width: 600px) { .journal-field-grid { grid-template-columns: minmax(0, 1fr); gap: 18px; } }
.draft-app[data-writing-task] .draft-form [hidden] { display: none !important; }
.draft-sidebar button[data-writing-task]:focus-visible { outline: 2px solid #245f4d; outline-offset: 3px; }
.draft-sidebar button[data-writing-task] { transition: background-color 150ms ease, color 150ms ease, box-shadow 150ms ease; }
.draft-sidebar button[data-writing-task].is-opening { box-shadow: inset 3px 0 #245f4d; }
.workflow-navigation-notice { display: flex; align-items: center; gap: 12px; padding: 14px 18px; margin-bottom: 18px; border: 1px solid #dbe3e0; border-radius: 10px; background: #f1f6f3; color: #273430; font-size: 15px; line-height: 1.6; }
.workflow-navigation-notice[hidden], .workflow-navigation-notice button[hidden] { display: none; }
.workflow-navigation-notice [data-navigation-message] { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.workflow-navigation-notice > div { display: flex; gap: 10px; flex-wrap: wrap; }
.workflow-navigation-notice button { min-height: 36px; padding: 5px 10px; border: 1px solid #b8c9c3; border-radius: 6px; color: #245f4d; background: white; font: inherit; cursor: pointer; }
.workflow-navigation-notice button:focus-visible { outline: 2px solid #245f4d; outline-offset: 2px; }
.workflow-navigation-indicator { flex: 0 0 auto; width: 16px; height: 16px; border: 2px solid #cbdad3; border-top-color: #245f4d; border-radius: 50%; animation: workflow-navigation-spin 850ms linear infinite; }
.workflow-navigation-notice[data-state="error"] { background: #fff8f0; border-color: #e8d2b8; }
.workflow-navigation-notice[data-state="error"] .workflow-navigation-indicator { animation: none; border-color: #98642b; }
@keyframes workflow-navigation-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .workflow-navigation-indicator { animation: none; } .draft-sidebar button[data-writing-task] { transition: none; } }
@media (max-width: 600px) { .workflow-navigation-notice { flex-wrap: wrap; padding: 12px; } .workflow-navigation-notice > div { flex-basis: 100%; margin-left: 28px; } }
.draft-app[data-writing-task="practice"] #draftProgress { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.draft-app #draftProgress [hidden] { display: none !important; }
.draft-app .outline-icon-legend[hidden] { display: none !important; }
.practice-fields { margin: 0; padding: 0; border: 0; min-width: 0; }
.practice-fields legend { margin-bottom: 20px; font-size: 20px; font-weight: 650; }
.practice-field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 24px; }
.practice-field-grid input, .practice-field-grid textarea { box-sizing: border-box; width: 100%; min-width: 0; font: inherit; }
.practice-field-grid input { min-height: 52px; padding: 13px 16px; border: 1px solid #dbe3e0; border-radius: 12px; color: #273430; background: rgba(255,255,255,.88); font-size: 16px; }
.practice-field-grid input:hover { border-color: #b8c9c3; }
.practice-field-grid input:focus-visible { outline: 2px solid #245f4d; outline-offset: 2px; }
.practice-field-grid textarea { line-height: 1.7; resize: vertical; }
.practice-field-grid .full { grid-column: 1 / -1; }
#practiceWorkHint { margin: 8px 0 0; font-size: 14px; line-height: 1.7; color: var(--muted, #65675e); }
@media (max-width: 600px) { .practice-field-grid { grid-template-columns: minmax(0, 1fr); gap: 18px; } }
/* Research planning is an independent mode within the existing writing studio. */
.draft-app[data-writing-task="ideas"] .draft-progress,
.draft-app[data-writing-task="ideas"] .draft-step-panel { display: none !important; }
.research-ideas[hidden], .research-ideas [hidden] { display: none !important; }
.research-ideas { padding: 28px 36px 40px; color: var(--draft-ink); font-size: 16px; line-height: 1.65; }
.research-ideas header { margin-bottom: 26px; }
.research-ideas h2 { font-size: clamp(24px, 2.5vw, 30px); font-weight: 700; line-height: 1.4; margin: 6px 0 12px; }
.research-ideas h3 { font-size: 21px; margin: 8px 0; }
.research-ideas p { overflow-wrap: anywhere; }
.ideas-eyebrow { color: #245f4d; font-size: 14px; font-weight: 650; margin: 0; }
.research-ideas header > p:last-child, .ideas-handoff-hint, .ideas-results > p { color: var(--draft-muted); }
.ideas-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.ideas-field { display: grid; align-content: start; gap: 8px; min-width: 0; }
.ideas-field.wide { grid-column: 1/-1; }
.ideas-field > label { font-weight: 600; }
.ideas-field input, .ideas-field textarea, .ideas-field select { width: 100%; min-width: 0; padding: 12px 14px; border: 1px solid #cbd8d2; background: #fff; color: var(--draft-ink); border-radius: 8px; font: inherit; line-height: 1.6; }
.ideas-field textarea { resize: vertical; min-height: 100px; }
.ideas-field input:disabled, .ideas-field textarea:disabled, .ideas-field select:disabled { background: #f4f7f5; }
.ideas-more { margin-top: 24px; border-block: 1px solid var(--draft-border); padding: 18px 0; }
.ideas-more summary { cursor: pointer; font-weight: 600; }
.ideas-more summary span { color: var(--draft-muted); font-size: 14px; margin-left: 8px; font-weight: 400; }
.ideas-more[open] > div { margin-top: 24px; }
.ideas-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin-top: 24px; }
.ideas-actions span { color: var(--draft-muted); font-size: 14px; }
.research-ideas button { min-height: 44px; padding: 10px 18px; border: 1px solid #cbd8d2; border-radius: 8px; background: #fff; color: var(--draft-ink); font: inherit; cursor: pointer; }
.research-ideas button:hover { border-color: #245f4d; }
.research-ideas button:disabled { cursor: default; opacity: .6; }
.research-ideas :is(button, input, select, textarea, summary):focus-visible { outline: 2px solid #245f4d; outline-offset: 3px; }
#ideasGenerate, #ideasUseDraft { background: #245f4d; border-color: #245f4d; color: #fff; font-weight: 600; }
.ideas-task { margin-top: 24px; border-left: 3px solid #245f4d; background: #f4f7f5; padding: 14px 20px; }
#ideasTaskStatus { margin: 0; font-weight: 600; }
#ideasTaskId { font-size: 13px; color: var(--draft-muted); }
#ideasTaskError { max-height: 180px; overflow: auto; color: #a33b2f; white-space: pre-wrap; }
.ideas-results { margin-top: 36px; border-top: 1px solid var(--draft-border); padding-top: 24px; }
.ideas-candidates { display: grid; gap: 10px; margin: 24px 0; }
.ideas-candidates button { display: grid; grid-template-columns: 28px minmax(0, 1fr); text-align: left; gap: 12px; align-items: start; }
.ideas-candidates button[aria-pressed="true"] { background: #eef6f1; border-color: #245f4d; box-shadow: inset 3px 0 #245f4d; }
.ideas-candidates small { display: block; font-size: 14px; line-height: 1.6; color: var(--draft-muted); margin-top: 6px; }
.ideas-candidates strong { display: block; font-size: 17px; overflow-wrap: anywhere; }
.ideas-plan { display: grid; gap: 20px; padding: 24px; background: #f7f9f7; border: 1px solid var(--draft-border); border-radius: 8px; }
.ideas-handoff-hint { font-size: 14px; }
@media (max-width: 680px) { .research-ideas { padding: 20px 16px; } .ideas-fields { grid-template-columns: minmax(0, 1fr); } .ideas-plan { padding: 16px; } .ideas-actions button { width: 100%; } }
/* Survey mode shares the studio shell, not the dissertation step contract. */
.draft-app[data-writing-task="survey"] .draft-progress,
.draft-app[data-writing-task="survey"] .draft-step-panel { display: none !important; }
.survey-workspace[hidden], .survey-workspace [hidden] { display: none !important; }
.survey-workspace { --survey-accent: #245f4d; --survey-line: #cbd8d2; padding: 28px 36px 40px; color: var(--draft-ink); font: inherit; font-size: 16px; line-height: 1.65; }
.survey-workspace h2 { font-size: clamp(24px, 2.5vw, 28px); line-height: 1.4; margin: 6px 0 12px; }
.survey-workspace h3 { font-size: 21px; margin: 16px 0 8px; }
.survey-workspace p { overflow-wrap: anywhere; }
.survey-caption, .survey-actions > span { font-size: 14px; color: var(--draft-muted); }
.survey-steps { display: flex; flex-wrap: wrap; gap: 12px 24px; list-style: none; padding: 18px 0; margin: 24px 0; border-block: 1px solid var(--survey-line); color: var(--survey-accent); font-weight: 600; }
.survey-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.survey-fields label, .survey-question label { display: grid; gap: 8px; font-weight: 600; min-width: 0; }
.survey-wide { grid-column: 1/-1; }
.survey-workspace :is(input, textarea, select) { width: 100%; min-width: 0; padding: 10px 12px; border: 1px solid var(--survey-line); border-radius: 6px; background: #fff; color: inherit; font: inherit; font-weight: 400; }
.survey-workspace textarea { resize: vertical; }
.survey-workspace button, .survey-workspace .survey-link { border: 1px solid var(--survey-line); background: #fff; color: var(--draft-ink); border-radius: 6px; padding: 10px 16px; min-height: 44px; font: inherit; cursor: pointer; text-decoration: none; }
.survey-workspace .survey-primary { background: var(--survey-accent); color: #fff; border-color: var(--survey-accent); }
.survey-workspace button:disabled { opacity: .5; cursor: default; }
.survey-workspace :is(button,input,textarea,select,a):focus-visible { outline: 2px solid var(--survey-accent); outline-offset: 3px; }
.survey-actions { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin-top: 18px; }
.survey-task, .survey-review { padding: 16px 20px; margin: 24px 0; background: #f4f7f5; border-left: 3px solid var(--survey-accent); }
.survey-task p { margin: 6px 0; }
#surveyError { white-space: pre-wrap; color: #a33b2f; max-height: 180px; overflow: auto; }
.survey-question { border: 1px solid var(--survey-line); border-radius: 8px; padding: 22px; display: grid; gap: 16px; margin: 18px 0; }
.survey-question > header { display: flex; align-items: center; gap: 12px; justify-content: space-between; flex-wrap: wrap; }
.survey-question > header strong { color: var(--survey-accent); font-size: 18px; }
.survey-question .survey-actions { margin: 0; }
.survey-question .survey-check { display: flex; align-items: center; font-weight: 400; }
.survey-question input[type="checkbox"] { width: 18px; height: 18px; accent-color: var(--survey-accent); }
.survey-export { border-top: 1px solid var(--survey-line); margin-top: 30px; padding-top: 18px; }
.survey-review ul { padding-left: 20px; }
.survey-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; padding: 12px 0; }
.survey-steps { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.survey-steps li { min-width: 0; }
.survey-steps button { display: flex; align-items: center; gap: 12px; width: 100%; height: 100%; text-align: left; border-color: transparent; padding: 14px 10px; }
.survey-steps button[aria-current="step"] { background: #f4f7f5; border-color: var(--survey-line); color: var(--survey-accent); }
.survey-steps button b { font: 600 20px ui-monospace, monospace; }
.survey-steps button small { display: block; margin-top: 3px; color: var(--draft-muted); font-size: 13px; font-weight: 400; }
.survey-editor-actions { padding-block: 16px; border-top: 1px solid var(--survey-line); }
.survey-preview { max-width: 780px; margin: 24px auto 40px; padding: 28px; border: 1px solid var(--survey-line); border-radius: 8px; background: #fff; }
.survey-preview > h3 { text-align: center; }
.survey-preview > p { white-space: pre-wrap; }
.survey-preview-question { min-width: 0; margin: 24px 0; padding: 16px 0 0; border: 0; border-top: 1px solid var(--survey-line); }
.survey-preview-question legend { font-weight: 600; padding: 0 8px 0 0; overflow-wrap: anywhere; }
.survey-preview-question .survey-check { display: flex; align-items: flex-start; gap: 10px; margin: 10px 0; }
.survey-preview-question input { width: 18px; height: 18px; margin-top: 5px; flex-shrink: 0; accent-color: var(--survey-accent); }
.survey-export { border: 0; margin-top: 0; }
.survey-analysis-field { min-width: 0; margin: 0; padding: 18px; border: 1px solid var(--survey-line); border-radius: 8px; }
.survey-analysis-field legend { padding: 0 8px; font-weight: 600; font-size: 18px; }
.survey-analysis-field legend small { font-size: 14px; color: var(--draft-muted); font-weight: 400; }
.survey-analysis-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.survey-analysis-options .survey-analysis-option { display: flex; align-items: flex-start; gap: 10px; padding: 14px; border: 1px solid var(--survey-line); border-radius: 6px; cursor: pointer; }
.survey-analysis-option:has(input:checked) { background: #f4f7f5; border-color: var(--survey-accent); }
.survey-analysis-option input[type="checkbox"] { width: 18px; height: 18px; margin-top: 5px; padding: 0; flex-shrink: 0; accent-color: var(--survey-accent); }
.survey-analysis-option strong { display: block; font-size: 16px; }
.survey-analysis-option small { display: block; margin-top: 4px; font-size: 14px; font-weight: 400; color: var(--draft-muted); }
.survey-analysis-summary { background: #f4f7f5; border: 1px solid var(--survey-line); border-radius: 8px; padding: 18px 20px; margin: 24px 0; }
.survey-analysis-summary h4 { font-size: 18px; margin: 0 0 10px; }
.survey-analysis-summary p { margin: 8px 0; }
.survey-public-link-row { display: inline-flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-left: 12px; vertical-align: middle; }
.survey-public-link-row .survey-link { display: inline-block; max-width: 100%; overflow-wrap: anywhere; }
.survey-public-link-row button { min-height: 34px; padding: 5px 10px; font-size: 14px; }
.survey-share-card { min-width: 0; padding: 20px; margin-top: 18px; border: 1px solid var(--survey-line); border-radius: 8px; background: #fff; }
.survey-share-title { display: block; font-size: 20px; line-height: 1.5; overflow-wrap: anywhere; }
.survey-workspace .survey-share-text { min-height: 118px; margin: 14px 0 0; padding: 12px; font-size: 16px; line-height: 1.65; color: var(--draft-ink); background: #f4f7f5; resize: vertical; }
.survey-share-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 14px; }
.survey-share-feedback { color: var(--survey-accent); font-size: 15px; min-height: 0; }
.survey-share-feedback:empty { display: none; }
.survey-share-more { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--survey-line); }
.survey-share-more > summary { cursor: pointer; color: var(--survey-accent); font-size: 16px; font-weight: 600; }
.survey-share-more > summary:focus-visible { outline: 2px solid var(--survey-accent); outline-offset: 4px; }
.survey-share-more-body { padding-top: 14px; }
.survey-share-qr { display: grid; justify-items: center; gap: 12px; margin-top: 14px; }
.survey-share-qr:empty { display: none; }
.survey-share-qr img { display: block; width: min(264px, 100%); height: auto; aspect-ratio: 1; background: #fff; image-rendering: pixelated; }
.survey-share-warning { color: #8b5e19; font-size: 15px; line-height: 1.6; }
@media (max-width: 680px) { .survey-share-card { padding: 14px; } .survey-share-actions > :is(button, a) { flex: 1 1 auto; text-align: center; } }
.survey-analysis-summary > div[hidden] { display: none; }
.survey-analysis-summary #surveyPublicSummary p:last-child { white-space: pre-wrap; overflow-wrap: anywhere; }
.survey-analysis-summary ul { padding-left: 22px; margin: 10px 0; }
.survey-analysis-warnings { border-top: 1px solid var(--survey-line); padding-top: 12px; }
.survey-secondary-panel { margin: 18px 0 24px; border: 1px solid var(--survey-line); border-radius: 8px; background: #fbfdfc; }
.survey-secondary-panel > summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 16px; cursor: pointer; list-style: none; }
.survey-secondary-panel > summary::-webkit-details-marker { display: none; }
.survey-secondary-panel > summary::after { content: '+'; color: var(--survey-accent); font-size: 22px; line-height: 1; }
.survey-secondary-panel[open] > summary::after { content: '−'; }
.survey-secondary-panel > summary > span { display: grid; gap: 2px; min-width: 0; }
.survey-secondary-panel > summary strong { color: var(--survey-accent); font-size: 16px; }
.survey-secondary-panel > summary small { color: var(--draft-muted); font-size: 13px; font-weight: 400; }
.survey-secondary-panel > summary b { margin-left: auto; color: var(--draft-muted); font-size: 13px; font-weight: 400; }
.survey-secondary-panel[open] > summary b { font-size: 0; }
.survey-secondary-panel[open] > summary b::after { content: '收起'; font-size: 13px; }
.survey-secondary-body { padding: 0 16px 16px; border-top: 1px solid var(--survey-line); }
.survey-secondary-body > .survey-actions:first-child { margin-top: 16px; }
.survey-secondary-body #surveyWjxStatus { margin: 12px 0 0; }
.survey-secondary-body #surveyWjxCheck { margin-top: 12px; }
.survey-collection { border-top: 1px solid var(--survey-line); margin-top: 30px; padding-top: 24px; }
.survey-collection-head { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:20px; }
.survey-collection-head h3 { margin-top:4px; }
.survey-collection-state { display:flex; flex-wrap:wrap; gap:4px; align-items:baseline; margin:0 0 18px; padding:14px 16px; border-left:3px solid var(--survey-accent); background:#f4f7f5; }
.survey-collection-stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin:18px 0 26px; }
.survey-stat { min-width:0; padding:16px; border:1px solid var(--survey-line); border-radius:8px; background:#fff; }
.survey-stat small,.survey-stat span { display:block; color:var(--draft-muted); font-size:13px; line-height:1.45; overflow-wrap:anywhere; }
.survey-stat strong { display:block; margin:7px 0 4px; color:var(--survey-accent); font-size:22px; line-height:1.25; overflow-wrap:anywhere; }
.survey-collection-questions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.survey-collection-questions > h4 { grid-column:1/-1; margin:0; font-size:18px; }
.survey-result-question { min-width:0; padding:16px; border:1px solid var(--survey-line); border-radius:8px; background:#fff; }
.survey-result-question header { display:flex; justify-content:space-between; gap:12px; align-items:flex-start; margin-bottom:12px; }
.survey-result-question header strong { line-height:1.5; overflow-wrap:anywhere; }
.survey-result-question header span { flex:none; color:var(--draft-muted); font-size:13px; white-space:nowrap; }
.survey-bar-row { display:grid; grid-template-columns:minmax(70px,1fr) minmax(80px,2fr) 28px; align-items:center; gap:8px; margin:10px 0; font-size:14px; }
.survey-bar-row > span:first-child { overflow-wrap:anywhere; }
.survey-bar-track { height:8px; overflow:hidden; border-radius:999px; background:#e5ede8; }
.survey-bar-track i { display:block; height:100%; border-radius:inherit; background:var(--survey-accent); transition:width .25s ease; }
.survey-bar-row b { text-align:right; color:var(--survey-accent); }
.survey-empty { grid-column:1/-1; padding:24px; border:1px dashed var(--survey-line); color:var(--draft-muted); }
.survey-collection-text { margin-top:26px; }
.survey-text-list { display:grid; gap:10px; }
.survey-text-list article { padding:14px 16px; border:1px solid var(--survey-line); border-radius:8px; background:#fff; }
.survey-text-list article p { margin:8px 0; white-space:pre-wrap; overflow-wrap:anywhere; }
.survey-text-list article small { color:var(--draft-muted); }
.survey-collection-actions { border-top:1px solid var(--survey-line); padding-top:18px; }
@media (max-width: 680px) { .survey-analysis-options { grid-template-columns: minmax(0, 1fr); } .survey-analysis-field { padding: 12px; } }
@media (max-width: 820px) { .survey-collection-stats { grid-template-columns:repeat(2,minmax(0,1fr)); } .survey-collection-questions { grid-template-columns:minmax(0,1fr); } }
@media (max-width: 680px) { .survey-steps { grid-template-columns:repeat(2,minmax(0,1fr)); } .survey-steps button { flex-direction: column; align-items: flex-start; gap: 4px; padding: 10px 6px; font-size: 14px; } .survey-steps button small { font-size: 12px; } .survey-preview { padding: 18px; } .survey-collection-head { flex-direction:column; } }
@media (max-width: 680px) { .survey-workspace { padding: 20px 16px; } .survey-fields { grid-template-columns: minmax(0, 1fr); } .survey-question { padding: 16px; } .survey-steps { gap: 8px 16px; } }
.survey-connection { width: min(620px, calc(100vw - 24px)); max-height: 90dvh; padding: 0; border: 1px solid #cbd8d2; border-radius: 10px; background: #fff; color: #263c33; font-size: 16px; line-height: 1.65; box-shadow: 0 24px 70px #142b3426; }
.survey-connection[open] { display: flex; flex-direction: column; }
.survey-connection::backdrop { background: #182b3366; }
.survey-connection > header { display: flex; align-items: flex-start; gap: 16px; justify-content: space-between; padding: 20px 24px; border-bottom: 1px solid #cbd8d2; flex-shrink: 0; }
.survey-connection h2 { font-size: 24px; line-height: 1.4; margin: 4px 0 0; }
.survey-connection header p { margin: 0; font-size: 14px; color: #526c60; }
.survey-connection-body { padding: 0 24px 24px; overflow-y: auto; overscroll-behavior: contain; }
.survey-connection p { overflow-wrap: anywhere; }
.survey-connection-state { background: #f4f7f5; padding: 16px; margin: 20px 0; border-left: 3px solid #245f4d; }
.survey-connection-state p { margin: 6px 0 0; font-size: 14px; }
.survey-connection form > label { font-weight: 600; }
.survey-connection input[type="password"] { width: 100%; min-height: 46px; margin-top: 8px; padding: 10px 12px; border: 1px solid #cbd8d2; border-radius: 6px; font: 15px ui-monospace, monospace; }
.survey-connection-note, .survey-connection footer { font-size: 14px; color: #526c60; }
.survey-connection-toggle { display: flex; align-items: center; gap: 10px; margin-top: 20px; }
.survey-connection input[type="checkbox"] { width: 18px; height: 18px; accent-color: #245f4d; }
.survey-connection-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.survey-connection button { background: #fff; color: #263c33; border: 1px solid #cbd8d2; border-radius: 6px; padding: 9px 14px; min-height: 44px; font: inherit; cursor: pointer; }
.survey-connection .survey-connection-primary { background: #245f4d; color: #fff; border-color: #245f4d; }
.survey-connection button:disabled { opacity: .5; cursor: default; }
.survey-connection :is(button,input):focus-visible { outline: 2px solid #245f4d; outline-offset: 3px; }
#surveyConnectionClose { font-size: 26px; line-height: 1; flex-shrink: 0; min-width: 44px; }
#surveyConnectionFeedback { color: #245f4d; min-height: 26px; }
.survey-connection footer { border-top: 1px solid #cbd8d2; padding-top: 8px; }
@media (max-width: 480px) { .survey-connection > header { padding: 16px; } .survey-connection-body { padding: 0 16px 16px; } .survey-connection h2 { font-size: 22px; } }
.draft-app[data-writing-task="analysis"] .draft-progress,
.draft-app[data-writing-task="analysis"] .draft-step-panel { display: none !important; }
.analysis-workspace[hidden], .analysis-workspace [hidden] { display: none !important; }
.analysis-workspace { --analysis-ink: #23382f; --analysis-muted: #63756d; --analysis-accent: #245f4d; --analysis-line: #cbd8d2; padding: 28px 30px 40px; color: var(--analysis-ink); font: inherit; font-size: 16px; line-height: 1.6; min-width: 0; }
.analysis-workspace h2 { font: inherit; font-size: 28px; font-weight: 700; margin: 0 0 6px; }
.analysis-workspace h3 { font-size: 19px; margin: 0 0 16px; font-weight: 650; }
.analysis-workspace p { margin: 8px 0; overflow-wrap: anywhere; }
.analysis-heading { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 24px; }
.analysis-heading p, .analysis-caption { color: var(--analysis-muted); }
.analysis-badge { background: #f4f7f5; color: var(--analysis-accent); padding: 6px 12px; border-radius: 5px; font-size: 14px; }
.analysis-toolbar, .analysis-file-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.analysis-toolbar > span { font-size: 14px; color: var(--analysis-muted); }
.analysis-workspace button, .analysis-upload { font: inherit; color: var(--analysis-ink); background: #fff; border: 1px solid var(--analysis-line); border-radius: 6px; padding: 9px 12px; min-height: 42px; cursor: pointer; }
.analysis-workspace button:hover:not(:disabled) { border-color: var(--analysis-accent); background: #f4f7f5; }
.analysis-workspace .analysis-primary, .analysis-upload { background: var(--analysis-accent); color: #fff; border-color: var(--analysis-accent); }
.analysis-workspace .analysis-primary:hover:not(:disabled) { background: #1c4e3f; color: #fff; }
.analysis-upload { position: relative; overflow: hidden; }
/* Keep the native picker invisible even when generic disabled controls fade. */
.analysis-workspace .analysis-upload input[type="file"] { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; height: 100%; }
.analysis-upload.is-disabled { opacity: .6; cursor: not-allowed; }
.analysis-workspace .analysis-upload input[type="file"]:disabled { cursor: not-allowed; }
.analysis-workspace :is(button,input,select):disabled { opacity: .5; cursor: not-allowed; }
.analysis-workspace :is(button,input,select,summary):focus-visible, .analysis-upload:focus-within { outline: 2px solid var(--analysis-accent); outline-offset: 3px; }
.analysis-grid { display: grid; grid-template-columns: minmax(0,1fr) 280px; gap: 20px; align-items: start; }
.analysis-data { min-width: 0; display: grid; gap: 20px; }
.analysis-card { min-width: 0; background: #fff; border: 1px solid var(--analysis-line); border-radius: 8px; padding: 20px; }
.analysis-workspace label:not(.analysis-upload) { display: grid; gap: 6px; min-width: 0; font-size: 15px; }
.analysis-workspace :is(input:not([type="file"]):not([type="checkbox"]),select) { min-width: 0; width: 100%; border: 1px solid var(--analysis-line); border-radius: 5px; background: #fff; color: var(--analysis-ink); padding: 9px 10px; font: inherit; }
.analysis-workspace input[type="color"] { height: 43px; padding: 4px; }
.analysis-settings { display: grid; gap: 16px; }
.analysis-settings h3 { margin-bottom: 0; }
.analysis-workspace details { border-top: 1px solid var(--analysis-line); padding-top: 12px; margin-top: 12px; min-width: 0; }
.analysis-workspace summary { cursor: pointer; font-weight: 600; margin-bottom: 10px; }
.analysis-style-fields { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
.analysis-workspace label.analysis-check { display: flex; align-items: flex-start; gap: 8px; font-size: 14px; line-height: 1.6; }
.analysis-workspace .analysis-check input { flex: 0 0 18px; width: 18px; height: 18px; margin-top: 3px; accent-color: var(--analysis-accent); }
.analysis-workspace fieldset { border: 1px solid var(--analysis-line); padding: 10px; margin: 0; min-width: 0; }
.analysis-table-scroll { overflow: auto; max-height: 250px; margin: 12px 0; border: 1px solid var(--analysis-line); border-radius: 5px; }
.analysis-table-scroll table { border-collapse: collapse; min-width: 100%; font: 14px/1.5 ui-monospace, SFMono-Regular, Consolas, monospace; }
.analysis-table-scroll :is(th,td) { border-bottom: 1px solid #e6ece8; padding: 8px 12px; text-align: left; white-space: nowrap; max-width: 320px; overflow: hidden; text-overflow: ellipsis; }
.analysis-table-scroll th { position: sticky; top: 0; background: #f4f7f5; z-index: 1; font-weight: 600; }
.analysis-column { grid-template-columns: minmax(0,1fr) 150px; align-items: center; padding: 8px 0; }
.analysis-column small { grid-column: 1/-1; overflow-wrap: anywhere; color: var(--analysis-muted); }
.analysis-result > header { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px; }
.analysis-result > header span, .analysis-caption, #analysisProfileHint, #analysisPage, #analysisResultNote { font-size: 14px; color: var(--analysis-muted); }
.analysis-image { min-width: 0; }
.analysis-image img { display: block; max-width: 100%; width: 100%; height: auto; }
.analysis-notice, #analysisResultState { white-space: pre-wrap; max-height: 170px; overflow: auto; font-size: 14px; }
.analysis-notice:not(:empty) { border-left: 3px solid var(--analysis-accent); background: #f4f7f5; padding: 10px 12px; margin: 16px 0; }
.analysis-grid { margin-top: 20px; }
.analysis-file-actions { margin: 12px 0; }
.analysis-history { margin-top: 28px; border-top: 1px solid var(--analysis-line); padding-top: 24px; }
#analysisHistory { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; max-height: 460px; overflow: auto; }
.analysis-workspace .analysis-history-item { display: grid; gap: 6px; text-align: left; overflow-wrap: anywhere; }
.analysis-history-item span, .analysis-history-item small { font-size: 14px; color: var(--analysis-muted); }
.analysis-workspace .analysis-history-item.active { border-color: var(--analysis-accent); background: #f4f7f5; }
.analysis-workspace textarea { min-width: 0; width: 100%; border: 1px solid var(--analysis-line); border-radius: 5px; padding: 10px; font: inherit; color: var(--analysis-ink); resize: vertical; }
.analysis-workspace textarea:focus-visible { outline: 2px solid var(--analysis-accent); outline-offset: 3px; }
.analysis-recommendations > .analysis-check { margin-top: 14px; }
.analysis-plan { border-top: 1px solid var(--analysis-line); padding: 16px 0 4px; margin-top: 16px; }
.analysis-plan h4 { margin: 0; font-size: 18px; }
.analysis-plan ul { padding-left: 22px; margin: 8px 0; font-size: 14px; color: var(--analysis-muted); }
.analysis-plan-fields { font: 14px/1.6 ui-monospace, SFMono-Regular, Consolas, monospace; color: var(--analysis-accent); }
#analysisRecommendationStatus { white-space: pre-wrap; max-height: 140px; overflow: auto; overflow-wrap: anywhere; }
#analysisOptions [data-analysis-options] { display: grid; gap: 12px; }
.analysis-mode-switch { display: flex; align-items: center; flex-wrap: wrap; gap: 4px; margin-bottom: 18px; padding-bottom: 14px; border-bottom: 1px solid var(--analysis-line); }
.analysis-survey-source { margin-bottom: 18px; padding: 14px 18px; border: 1px solid var(--analysis-line); border-left: 3px solid #245f4d; border-radius: 6px; background: #f3f6f4; overflow-wrap: anywhere; }
.analysis-survey-source p { margin: 8px 0; font-size: 15px; line-height: 1.65; }
.analysis-survey-source details { margin-top: 12px; }
.analysis-survey-source summary { cursor: pointer; font-weight: 600; }
.analysis-survey-source ul { max-height: 240px; overflow-y: auto; padding-left: 22px; line-height: 1.7; }
#surveyAnalysisTransferHint[data-error="true"] { color: #a43b32; }
.analysis-workspace .analysis-mode-switch button { border: 0; background: transparent; padding: 8px 16px; font-weight: 600; }
.analysis-workspace .analysis-mode-switch button[aria-selected="true"] { background: #e8f1ec; color: #245f4d; }
.analysis-mode-switch > span { margin-left: auto; color: var(--analysis-muted); font-size: 13px; }
.analysis-workspace.analysis-advanced-active { --analysis-line: #d9e2dd; padding: 22px; }
.analysis-advanced-active > .analysis-heading { display: none; }
.analysis-advanced-active > .analysis-toolbar { margin-bottom: 16px; }
.analysis-advanced-active > .analysis-grid { display: none; }
.analysis-advanced { --studio-paper: #ffffff; --studio-bg: #f3f6f4; --studio-ink: #263c33; --studio-accent: #245f4d; border: 1px solid var(--analysis-line); border-radius: 8px; background: var(--studio-paper); min-width: 0; overflow: clip; }
.analysis-studio-title { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; padding: 18px 22px 14px; }
.analysis-studio-title > div { display: flex; align-items: baseline; flex-wrap: wrap; gap: 12px; }
.analysis-workspace .analysis-studio-title h3 { font-size: 21px; font-weight: 700; letter-spacing: -.02em; margin: 0; }
.analysis-studio-title span { color: var(--analysis-muted); font-size: 13px; }
.analysis-studio-mark { font: 11px/1.5 ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .035em; }
.analysis-studio-tabs { display: flex; padding: 0 18px; gap: 18px; border-bottom: 1px solid var(--analysis-line); }
.analysis-workspace .analysis-studio-tabs button { border: 0; border-radius: 0; background: transparent; border-bottom: 2px solid transparent; padding: 9px 4px 11px; min-height: 44px; color: var(--analysis-muted); }
.analysis-workspace .analysis-studio-tabs button[aria-pressed="true"] { color: var(--studio-accent); border-bottom-color: var(--studio-accent); font-weight: 700; }
.analysis-method-ribbon { display: grid; grid-template-columns: repeat(6, minmax(0,1fr)); padding: 10px 14px; gap: 4px; background: #f8faf9; border-bottom: 1px solid var(--analysis-line); }
.analysis-workspace .analysis-method-ribbon button { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 7px; border: 1px solid transparent; background: transparent; padding: 12px 4px 10px; min-height: 78px; font-size: 14px; color: #52685c; transition: background-color 150ms ease, color 150ms ease; }
.analysis-method-ribbon svg { width: 25px; height: 25px; flex-shrink: 0; }
.analysis-validity-options { margin: 0 0 16px; padding: 12px; background: #f6f9f7; border: 1px solid var(--analysis-line); border-radius: 6px; min-width: 0; }
.analysis-validity-options legend { color: #245f4d; font-weight: 650; font-size: 16px; }
.analysis-validity-options label { display: grid; gap: 6px; margin: 10px 0; }
.analysis-validity-options [hidden] { display: none !important; }
.analysis-comparison-options .analysis-caption { line-height: 1.65; margin: 8px 0 0; }
.analysis-regression-assignments { min-width: 0; padding: 12px; margin: 0 0 16px; border: 1px solid var(--analysis-line); border-radius: 6px; }
.analysis-regression-assignments legend { font-size: 16px; font-weight: 650; color: #245f4d; }
.analysis-regression-row { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; padding: 12px 0; border-bottom: 1px solid var(--analysis-line); }
.analysis-regression-row:last-child { border-bottom: 0; }
.analysis-regression-row strong { font-size: 16px; overflow-wrap: anywhere; }
.analysis-regression-row label { display: grid; gap: 6px; }
.analysis-regression-row select { width: 100%; min-width: 0; font-size: 16px; }
.analysis-mediation-options > fieldset { min-width: 0; padding: 10px; margin: 14px 0; border: 1px solid var(--analysis-line); border-radius: 6px; }
.analysis-mediation-options [data-advanced-picker] { max-height: 200px; overflow: auto; }
.analysis-mediation-options [data-advanced-picker] label { display: flex; align-items: center; gap: 8px; margin: 6px 0; }
.analysis-mediation-options [data-advanced-picker] small { margin-left: auto; color: var(--analysis-muted); }
.analysis-moderation-options > fieldset { min-width: 0; padding: 10px; margin: 14px 0; border: 1px solid var(--analysis-line); border-radius: 6px; }
.analysis-moderation-options [data-advanced-picker] { max-height: 200px; overflow: auto; }
.analysis-moderation-options [data-advanced-picker] label { display: flex; align-items: center; gap: 8px; margin: 6px 0; }
.analysis-moderation-options [data-advanced-picker] small { margin-left: auto; color: var(--analysis-muted); }
.analysis-multiple-mediation-options > fieldset { min-width: 0; padding: 10px; margin: 14px 0; border: 1px solid var(--analysis-line); border-radius: 6px; }
.analysis-multiple-mediation-options [data-advanced-picker] { max-height: 200px; overflow: auto; }
.analysis-multiple-mediation-options [data-advanced-picker] label { display: flex; align-items: center; gap: 8px; margin: 6px 0; }
.analysis-multiple-mediation-options [data-advanced-picker] small { margin-left: auto; color: var(--analysis-muted); }
[data-advanced-field="comparisonAssignments"] label { display: grid; gap: 6px; margin: 10px 0; }
.analysis-workspace .analysis-method-ribbon button[aria-pressed="true"] { color: var(--studio-accent); background: #e7f0eb; border-color: #c6d9ce; font-weight: 650; }
.analysis-dataset-bar { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; padding: 9px 18px; min-height: 46px; border-bottom: 1px solid var(--analysis-line); font-size: 13px; background: var(--studio-paper); }
.analysis-dataset-icon { color: var(--studio-accent); font-size: 20px; }
#analysisAdvancedDatasetState { max-width: 270px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: 600; }
#analysisAdvancedDatasetSummary { color: var(--analysis-muted); font-variant-numeric: tabular-nums; }
.analysis-workspace .analysis-dataset-bar button { margin-left: auto; border: 0; background: transparent; min-height: 32px; padding: 4px 0; font-size: 13px; color: var(--studio-accent); }
.analysis-studio-workbench { display: grid; grid-template-columns: minmax(265px, .8fr) minmax(0, 1.3fr); align-items: stretch; min-width: 0; }
.analysis-studio-config { padding: 22px 18px 0; background: var(--studio-bg); border-right: 1px solid var(--analysis-line); min-width: 0; }
.analysis-overline { display: block; color: var(--analysis-muted); font-size: 12px; font-weight: 550; letter-spacing: .06em; }
.analysis-workspace .analysis-studio-config h4 { margin: 6px 0 8px; color: var(--studio-ink); font-size: 20px; font-weight: 650; line-height: 1.4; }
.analysis-studio-config header p { font-size: 13px; line-height: 1.7; }
.analysis-advanced-form { display: grid; gap: 18px; margin-top: 20px; }
.analysis-workspace .analysis-advanced-form label { font-size: 14px; }
.analysis-advanced-form :is(input:not([type="checkbox"]),select) { min-height: 42px; }
.analysis-variable-assignment { display: grid; gap: 14px; }
.analysis-field-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.analysis-field-heading strong { font-size: 14px; }
.analysis-workspace .analysis-field-heading button { border: 0; background: transparent; padding: 0; min-height: 30px; color: var(--studio-accent); font-size: 12px; }
.analysis-workspace .analysis-variable-assignment fieldset { padding: 0; border: 0; }
.analysis-variable-assignment legend { margin-bottom: 6px; font-size: 14px; }
.analysis-variable-assignment legend small { margin-left: 6px; color: var(--analysis-muted); font-weight: 400; font-size: 12px; }
[data-advanced-picker] { max-height: 210px; overflow-y: auto; background: white; border: 1px solid var(--analysis-line); border-radius: 5px; padding: 4px; }
.analysis-workspace [data-advanced-picker] label { padding: 7px 8px; margin: 0; border-radius: 3px; cursor: pointer; align-items: center; }
[data-advanced-picker] label:hover, [data-advanced-picker] label:has(input:checked) { background: #edf4ef; }
[data-advanced-picker] label span { overflow-wrap: anywhere; flex: 1; }
[data-advanced-picker] label small { font-size: 11px; color: var(--analysis-muted); }
.analysis-workspace .analysis-stat-options { margin-top: 0; padding-top: 14px; }
.analysis-stat-options label { margin-top: 12px; }
.analysis-run-area { padding: 16px 0 18px; border-top: 1px solid var(--analysis-line); }
.analysis-workspace .analysis-run-area button { width: 100%; margin-top: 12px; min-height: 44px; font-size: 15px; font-weight: 600; }
.analysis-run-area p { text-align: center; color: var(--analysis-muted); font-size: 12px; }
.analysis-studio-output { min-width: 0; background: #eaf0ec; padding: 0 18px 22px; }
.analysis-output-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 12px; min-height: 54px; font-size: 13px; color: var(--analysis-muted); }
#analysisAdvancedResultId { display: inline-flex; align-items: center; gap: 6px; }
#analysisAdvancedResultId::before { content: ''; width: 6px; height: 6px; background: #9aac9f; border-radius: 50%; }
#analysisAdvancedResultId[data-state="completed"]::before { background: #245f4d; }
#analysisAdvancedResultId[data-state="failed"]::before { background: #b54738; }
#analysisAdvancedResultId:is([data-state="running"],[data-state="queued"])::before { background: #b47c26; animation: analysis-status-pulse 1.4s ease-in-out infinite; }
.analysis-report-sheet { background: white; border: 1px solid #dce4df; padding: 26px 24px; min-height: 510px; }
.analysis-workspace .analysis-report-sheet h4 { font: 650 23px/1.45 Georgia, "Songti SC", "Noto Serif CJK SC", serif; color: #253a30; margin: 8px 0 10px; overflow-wrap: anywhere; }
#analysisAdvancedResultState { font-size: 13px; line-height: 1.65; white-space: pre-wrap; overflow-y: auto; max-height: 160px; }
.analysis-output-empty { padding: 40px 6px 45px; text-align: center; color: var(--analysis-muted); }
.analysis-output-empty > span { display: block; font: 400 42px/1.3 Georgia, serif; color: #7b9686; margin-bottom: 16px; }
.analysis-workspace .analysis-output-empty h5 { font-size: 16px; color: var(--studio-ink); margin: 0 0 10px; }
.analysis-output-empty p { font-size: 14px; line-height: 1.9; max-width: 300px; margin: 0 auto 22px; }
.analysis-workspace .analysis-output-empty button { color: var(--studio-accent); font-size: 14px; }
.analysis-output-dirty { padding: 10px 12px; background: #faf5e9; color: #7c5f23; font-size: 13px; border-left: 2px solid #b88932; }
.analysis-sample-line { color: var(--analysis-muted); font: 13px/1.6 ui-monospace, SFMono-Regular, Consolas, monospace; margin: 18px 0 12px; }
.analysis-sample-line:empty { display: none; }
.analysis-result-statistics { margin: 16px 0 22px; display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); border-top: 1px solid #384f41; }
.analysis-result-statistics:empty { display: none; }
.analysis-result-statistics > div { padding: 10px 8px 10px 0; border-bottom: 1px solid #e4e9e5; min-width: 0; }
.analysis-result-statistics dt { font-size: 12px; color: var(--analysis-muted); }
.analysis-result-statistics dd { font-size: 15px; font-weight: 550; font-variant-numeric: tabular-nums; margin: 3px 0 0; overflow-wrap: anywhere; }
.analysis-report-sheet .analysis-table-scroll { border: 0; border-radius: 0; max-height: 430px; }
.analysis-report-sheet .analysis-table-scroll table { border-top: 1.5px solid #384f41; border-bottom: 1.5px solid #384f41; font-family: inherit; font-size: 14px; line-height: 1.65; font-variant-numeric: tabular-nums; }
.analysis-report-sheet .analysis-table-scroll th { background: #fff; border-bottom: 1px solid #83988a; font-weight: 600; }
.analysis-report-sheet .analysis-table-scroll :is(td,th) { padding: 9px 10px; }
.analysis-report-sheet .analysis-table-scroll :is(td,th):not(:first-child) { text-align: right; }
.analysis-report-sheet .analysis-table-scroll tbody tr:last-child td { border-bottom: 0; }
.analysis-advanced-warnings { margin-top: 18px; border-top: 1px solid var(--analysis-line); padding-top: 8px; }
.analysis-advanced-warnings:empty { display: none; }
.analysis-advanced-warnings p { font-size: 13px; line-height: 1.7; color: var(--analysis-muted); padding-left: 12px; border-left: 2px solid #9bb1a3; }
.analysis-result-provenance { font-size: 12px; color: var(--analysis-muted); }
.analysis-result-provenance p { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; overflow-wrap: anywhere; }
.analysis-report-sheet .analysis-file-actions { margin-top: 20px; }
.analysis-report-sheet .analysis-file-actions button { font-size: 13px; min-height: 38px; }
#analysisAdvancedDataSlot .analysis-card { border: 0; border-radius: 0; }
#analysisAdvancedDataSlot .analysis-table-scroll { max-height: 470px; }
.analysis-advanced-active[data-analysis-view="dataset"] #analysisFields { display: none; }
.analysis-advanced-active[data-analysis-view="variables"] #analysisDataPreview,
.analysis-advanced-active[data-analysis-view="variables"] #analysisDataPreview + .analysis-file-actions { display: none; }
.analysis-advanced-active[data-analysis-view="variables"] #analysisFields summary { display: none; }
.analysis-advanced-active #analysisColumnList .analysis-column { grid-template-columns: minmax(0,1fr) 210px; padding: 12px 10px; border-bottom: 1px solid var(--analysis-line); font-size: 14px; }
.analysis-advanced-active #analysisColumnList .analysis-column:nth-child(even) { background: #f8faf9; }
#analysisAdvancedHistorySlot .analysis-history { margin: 0; padding: 18px 20px 22px; background: #f8faf9; }
#analysisAdvancedHistorySlot .analysis-history h3 { font-size: 15px; margin-bottom: 2px; }
#analysisAdvancedHistorySlot .analysis-history > p { font-size: 12px; margin-top: 4px; }
#analysisAdvancedHistorySlot #analysisHistory { display: flex; gap: 10px; overflow-x: auto; padding-top: 8px; max-height: 260px; }
#analysisAdvancedHistorySlot .analysis-history-item { flex: 0 0 230px; font-size: 14px; box-shadow: none; }
#analysisAdvancedHistorySlot .analysis-history-item :is(span,small) { font-size: 12px; }
@keyframes analysis-status-pulse { 50% { opacity: .35; } }
@media (max-width: 1180px) { .analysis-grid { grid-template-columns: minmax(0,1fr); } .analysis-data { display: contents; } .analysis-settings { order: 1; grid-template-columns: repeat(2,minmax(0,1fr)); } .analysis-result { order: 2; } .analysis-settings > :is(h3,details,fieldset,.analysis-check,.analysis-primary,p) { grid-column: 1/-1; } }
@media (max-width: 1050px) { .analysis-studio-workbench { grid-template-columns: minmax(235px,.8fr) minmax(0,1fr); } .analysis-report-sheet { padding: 20px 16px; } .analysis-studio-mark { display: none; } }
@media (max-width: 760px) { .analysis-studio-workbench { grid-template-columns: minmax(0,1fr); } .analysis-studio-config { border-right: 0; border-bottom: 1px solid var(--analysis-line); } .analysis-report-sheet { min-height: 360px; } .analysis-studio-title { padding: 16px; } .analysis-studio-tabs { gap: 22px; } }
@media (max-width: 600px) { .analysis-workspace, .analysis-workspace.analysis-advanced-active { padding: 18px 12px; } .analysis-card { padding: 14px; } .analysis-settings, #analysisHistory { grid-template-columns: minmax(0,1fr); } .analysis-column, .analysis-advanced-active #analysisColumnList .analysis-column { grid-template-columns: minmax(0,1fr); } .analysis-heading h2 { font-size: 25px; } .analysis-mode-switch > span { width: 100%; margin-left: 8px; font-size: 12px; } .analysis-method-ribbon { grid-template-columns: repeat(3, minmax(0,1fr)); padding: 8px; } .analysis-workspace .analysis-method-ribbon button { min-height: 67px; font-size: 13px; padding: 8px 3px; } .analysis-method-ribbon svg { width: 21px; height: 21px; } .analysis-studio-output { padding: 0 10px 14px; } .analysis-dataset-bar { gap: 6px; padding: 10px 12px; } #analysisAdvancedDatasetState { max-width: 190px; } #analysisAdvancedDatasetSummary { flex-basis: 100%; order: 2; } .analysis-studio-title > div > span { font-size: 12px; } }
@media (prefers-reduced-motion: reduce) { .analysis-workspace .analysis-method-ribbon button { transition: none; } #analysisAdvancedResultId::before { animation: none !important; } }

/* Second-stage workbench: a data dictionary, reversible recipe and report. */
.analysis-journey-footer { padding: 20px; border-top: 1px solid var(--analysis-line); background: #f8faf9; }
.analysis-journey-footer p,.analysis-journey-version { color: #243c31; font-size: 15px; line-height: 1.65; }
.analysis-journey-version { padding: 12px 20px; border-block: 1px solid var(--analysis-line); background: #f8faf9; }
.analysis-journey-footer .analysis-file-actions { justify-content: space-between; }
.analysis-studio-tabs { overflow-x: auto; white-space: nowrap; }
.analysis-prepared-grid, .analysis-dictionary, .analysis-preparation-editor, .analysis-cleaning-quality { padding: 20px; min-width: 0; border-top: 1px solid var(--analysis-line); }
.analysis-inline-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.analysis-workspace .analysis-inline-heading h3 { margin: 0; }
.analysis-advanced-active #analysisAdvancedDataSlot :is(#analysisDataPreview,#analysisFields,#analysisDataPreview + .analysis-file-actions) { display: none; }
.analysis-advanced-active:not([data-analysis-view="dataset"]) .analysis-prepared-grid,
.analysis-advanced-active:not([data-analysis-view="variables"]) .analysis-dictionary,
.analysis-advanced-active:not([data-analysis-view="prepare"]) .analysis-cleaning-quality,
.analysis-advanced-active:not([data-analysis-view="prepare"]) .analysis-preparation-editor { display: none; }
.analysis-cleaning-quality { background: #f7faf8; }
.analysis-cleaning-quality .analysis-table-scroll { max-height: 300px; }
.analysis-cleaning-quality :is(td,th) { font-variant-numeric: tabular-nums; white-space: nowrap; }
.analysis-cleaning-quality .analysis-inline-heading h3, .analysis-preparation-editor h3 { font-size: 18px; }
.analysis-workspace .analysis-prep-fields :is(label,legend), .analysis-preparation-editor .analysis-file-actions button { font-size: 16px; }
.analysis-workspace .analysis-prep-fields :is(input,select,textarea) { font-size: 16px; }
.analysis-preparation-editor .analysis-file-actions { flex-wrap: wrap; }
.analysis-dimension-row { margin: 12px 0; padding: 12px; border: 1px solid var(--analysis-line); background: #f7faf8; border-radius: 5px; }
.analysis-dimension-row .analysis-inline-heading { align-items: end; gap: 8px; }
.analysis-dimension-row .analysis-inline-heading label { min-width: 0; flex: 1; }
.analysis-workspace .analysis-dimension-row :is(input,button), .analysis-workspace .analysis-dimensions > button { font-size: 16px; }
.analysis-dimension-row .analysis-prep-checkboxes { grid-template-columns: minmax(0,1fr); margin-top: 12px; }
.analysis-prep-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; margin: 16px 0; }
.analysis-prep-fields fieldset { grid-column: 1/-1; }
.analysis-prep-checkboxes { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; max-height: 220px; overflow: auto; }
.analysis-variable-row { padding: 10px 12px; border: 1px solid var(--analysis-line); border-radius: 5px; background: #fbfcfb; }
.analysis-variable-row summary { font-size: 14px; font-weight: 500; margin: 0; overflow-wrap: anywhere; }
.analysis-variable-row[open] { background: #f3f6f4; }
#analysisDictionarySearch { max-width: 360px; }
#analysisPrepLog { padding-left: 24px; font-size: 14px; max-height: 240px; overflow: auto; }
.analysis-workspace .analysis-catalog { margin: 0; padding: 12px 18px; border: 0; border-bottom: 1px solid var(--analysis-line); }
.analysis-catalog > summary { margin: 0; font-size: 14px; }
.analysis-catalog #analysisAdvancedHistorySlot .analysis-history { padding: 14px 0 0; border: 0; background: transparent; }
.analysis-catalog .analysis-history > :is(h3,p) { display: none; }
.analysis-output-toolbar { flex-wrap: wrap; padding: 12px 0; }
.analysis-output-tools { display: flex; gap: 4px; margin-left: auto; flex-wrap: wrap; }
.analysis-workspace .analysis-output-tools button { min-height: 30px; padding: 3px 6px; font-size: 12px; border: 1px solid transparent; background: transparent; }
.analysis-workspace .analysis-output-tools button:hover { border-color: var(--analysis-line); }
.analysis-studio-workbench { grid-template-columns: minmax(250px,var(--analysis-pane-width,38%)) 7px minmax(0,1fr); }
.analysis-studio-config { grid-column: 1; grid-row: 1; border-right: 0; }
.analysis-pane-handle { grid-column: 2; grid-row: 1; background: #e3eae5; cursor: col-resize; touch-action: none; }
.analysis-pane-handle:hover, .analysis-pane-handle:focus-visible { background: #abc1b3; outline: 2px solid #245f4d; }
.analysis-studio-output { grid-column: 3; grid-row: 1; }
.analysis-studio-workbench.is-collapsed { grid-template-columns: minmax(0,1fr); }
.analysis-studio-workbench.is-collapsed > :is(.analysis-studio-config,.analysis-pane-handle) { display: none; }
.analysis-studio-workbench.is-collapsed .analysis-studio-output { grid-column: 1; }
.analysis-picker-tools { display: flex; gap: 4px; align-items: center; margin-bottom: 5px; }
.analysis-workspace .analysis-picker-tools input { min-width: 60px; min-height: 34px; font-size: 13px; padding: 4px 7px; }
.analysis-workspace .analysis-picker-tools button { white-space: nowrap; font-size: 11px; padding: 4px; min-height: 34px; background: transparent; border-color: transparent; }
.analysis-supplement h5 { font-size: 15px; font-weight: 600; margin: 26px 0 8px; }
#analysisAdvancedPlots figure { margin: 24px 0 0; padding: 12px 0; border-top: 1px solid var(--analysis-line); }
#analysisAdvancedPlots img { width: 100%; height: auto; display: block; }
#analysisAdvancedPlots figcaption { font-size: 14px; color: var(--analysis-ink); margin-top: 8px; }
.analysis-workspace #analysisAdvancedPlots button { margin: 8px 6px 0 0; font-size: 12px; padding: 4px 9px; min-height: 30px; }
.analysis-workspace .analysis-advanced.is-focus { position: fixed; inset: 12px; z-index: 1600; overflow: auto; box-shadow: 0 0 0 20px rgba(29,44,36,.25); }
@media(max-width: 760px) {
  .analysis-studio-workbench { grid-template-columns: minmax(0,1fr); }
  .analysis-pane-handle { display: none; }
  .analysis-studio-config { grid-column: 1; grid-row: 1; }
  .analysis-studio-output { grid-column: 1; grid-row: 2; }
  .analysis-studio-workbench.is-collapsed .analysis-studio-output { grid-row: 1; }
  .analysis-output-tools { margin-left: 0; }
  .analysis-prep-fields { grid-template-columns: minmax(0,1fr); }
  .analysis-prep-checkboxes { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .analysis-prepared-grid,.analysis-dictionary,.analysis-preparation-editor,.analysis-cleaning-quality { padding: 14px; }
}
.analysis-assistant { margin: 16px 0; padding: 16px; border: 1px solid #cddcd4; border-radius: 6px; background: #f8faf9; font-size: 16px; }
.analysis-assistant > summary { cursor: pointer; color: #245f4d; font-weight: 650; }
.analysis-assistant > label { display: grid; gap: 8px; margin: 16px 0; }
.analysis-assistant textarea { width: 100%; padding: 12px; font: inherit; }
.analysis-assistant .analysis-check { display: flex; align-items: flex-start; }
.analysis-assistant small { overflow-wrap: anywhere; }
/* School identity is the visual anchor; the control retains the studio palette. */
.template-field > label { font-size: 16px; }
.template-picker { min-width: 0; }
.template-picker[hidden], .template-picker-popover[hidden], .template-picker-empty[hidden] { display: none !important; }
.template-picker-popover [hidden] { display: none !important; }
.template-picker-trigger { display: flex; align-items: center; gap: 14px; width: 100%; min-height: 82px; padding: 15px 18px; border: 1px solid var(--line, #dfe7e3); border-radius: 12px; background: #fff; color: var(--ink, #18201f); text-align: left; cursor: pointer; transition: border-color 150ms, box-shadow 150ms; }
.template-picker-trigger:hover, .template-picker-trigger[aria-expanded="true"] { border-color: #83a99a; box-shadow: 0 0 0 3px rgba(15, 114, 89, .06); }
.template-picker-selected { display: grid; gap: 5px; flex: 1; min-width: 0; }
.template-picker-selected strong { font-size: 17px; font-weight: 650; line-height: 1.4; }
.template-picker-selected > span { color: var(--muted, #64716d); font-size: 14px; line-height: 1.5; overflow-wrap: anywhere; }
.template-picker-mark { display: flex; flex-shrink: 0; }
.template-picker-emblem { display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px; overflow: hidden; border: 1px solid #e8edea; border-radius: 10px; background: #fff; color: var(--green, #0f7259); font-size: 15px; font-weight: 650; }
.template-picker-emblem img { width: 36px; height: 36px; object-fit: contain; }
.template-picker-emblem.is-inverse { background: #31594c; border-color: #31594c; }
.template-picker-emblem.is-document { background: #f0f6f3; font: italic 28px/1 Georgia, serif; }
.template-picker-chevron { flex: 0 0 20px; color: #789087; transition: transform 150ms; }
.template-picker-trigger[aria-expanded="true"] .template-picker-chevron { transform: rotate(180deg); }
.template-picker-popover { position: fixed; z-index: 130; display: flex; flex-direction: column; box-sizing: border-box; max-width: calc(100vw - 24px); overflow: hidden; border: 1px solid #d6e2dc; border-radius: 14px; background: #fff; color: var(--ink, #18201f); box-shadow: 0 18px 48px rgba(24, 49, 39, .16), 0 3px 10px rgba(24, 49, 39, .05); font: 15px/1.5 Inter, "PingFang SC", "Microsoft YaHei", sans-serif; animation: template-picker-reveal 150ms ease-out; }
.template-picker-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 17px 18px 12px; }
.template-picker-header > div { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.template-picker-header strong { font-size: 17px; font-weight: 650; }
.template-picker-header span { color: var(--muted, #64716d); font-size: 13px; }
.template-picker-header > button { display: grid; place-items: center; flex: 0 0 32px; height: 32px; padding: 0; border: 0; border-radius: 6px; background: transparent; color: var(--muted, #64716d); font-size: 25px; cursor: pointer; }
.template-picker-header > button:hover { background: #f0f6f3; }
.template-picker-search { display: flex; align-items: center; gap: 10px; margin: 0 18px; padding: 0 12px; border: 1px solid #dfe7e3; border-radius: 8px; background: #f8faf9; color: var(--muted, #64716d); }
.template-picker-search:focus-within { border-color: #83a99a; box-shadow: 0 0 0 3px rgba(15, 114, 89, .06); }
.template-picker-search svg { flex-shrink: 0; }
.template-picker-search input { width: 100%; min-width: 0; min-height: 44px; padding: 8px 0; border: 0; outline: none; background: transparent; color: var(--ink, #18201f); font: inherit; font-size: 16px; box-shadow: none; }
.template-picker-search input::placeholder { color: #89978f; }
.template-picker-filters { display: flex; gap: 7px; padding: 12px 18px; }
.template-picker-filters button { min-height: 32px; padding: 4px 15px; border: 1px solid transparent; border-radius: 6px; background: #f4f7f5; color: #64716d; font: inherit; font-size: 14px; cursor: pointer; }
.template-picker-filters button[aria-pressed="true"] { border-color: #b9d4c8; background: #eaf4ef; color: #0a5845; font-weight: 600; }
.template-picker-list { flex: 1 1 auto; min-height: 0; max-height: 340px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; padding: 0 8px 8px; }
.template-picker-option { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 76px; margin: 2px 0; padding: 12px 10px; border: 1px solid transparent; border-radius: 8px; background: #fff; color: var(--ink, #18201f); text-align: left; font: inherit; cursor: pointer; }
.template-picker-option:hover, .template-picker-option:focus-visible { background: #f2f7f4; }
.template-picker-option[aria-selected="true"] { border-color: #cce1d6; background: #eff7f2; }
.template-picker-option-copy { display: grid; flex: 1; min-width: 0; gap: 4px; }
.template-picker-option-copy strong { font-size: 16px; font-weight: 600; line-height: 1.4; }
.template-picker-option-copy > span { color: #64716d; font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; }
.template-picker-option-check { flex: 0 0 20px; color: #0f7259; font-size: 19px; font-weight: 700; text-align: center; }
.template-picker-empty { padding: 24px 22px 30px; color: #64716d; font-size: 15px; line-height: 1.7; text-align: center; }
.template-picker-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 18px; border-top: 1px solid #e8edea; background: #fafcfb; color: #64716d; font-size: 12px; line-height: 1.6; }
.template-picker-footer > span { flex: 1; }
.template-picker-footer button { flex-shrink: 0; min-height: 32px; padding: 3px 0; border: 0; background: transparent; color: #0f7259; font: inherit; font-size: 13px; cursor: pointer; }
.template-picker button:focus-visible, .template-picker-popover button:focus-visible { outline: 2px solid #0f7259; outline-offset: 2px; }
.template-field > .template-field-hint { color: #64716d; font-size: 13px; line-height: 1.7; }
@keyframes template-picker-reveal { from { opacity: .4; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 600px) {
  .template-picker-trigger { gap: 10px; padding: 13px 12px; }
  .template-picker-selected strong { font-size: 16px; }
  .template-picker-selected > span { font-size: 13px; }
  .template-picker-header { padding: 14px 14px 10px; }
  .template-picker-header > div { gap: 5px 12px; }
  .template-picker-search { margin: 0 14px; }
  .template-picker-filters { padding: 10px 14px; }
  .template-picker-filters button { padding-inline: 13px; }
  .template-picker-option { gap: 10px; padding: 10px 8px; }
  .template-picker-option .template-picker-emblem { flex-basis: 38px; width: 38px; height: 38px; }
  .template-picker-option .template-picker-emblem img { width: 32px; height: 32px; }
  .template-picker-option-copy > span { font-size: 12px; }
  .template-picker-footer { padding: 10px 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .template-picker-popover { animation: none; }
  .template-picker-trigger, .template-picker-chevron { transition: none; }
}
/* Five-step progressive preparation, using the existing writing visual language. */
#draftProgress { grid-template-columns: repeat(5, minmax(0, 1fr)); }
#draftForm { min-width: 0; margin: 0; }
.writing-preparation-group { padding: 24px 0; border-bottom: 1px solid #dce7e2; }
.writing-preparation-group h3, .writing-outline-review h3 { margin: 0 0 10px; color: #225d4b; font-size: 18px; }
.writing-preparation-group > p, .writing-outline-review > p { color: #61766d; line-height: 1.8; margin: 0 0 18px; }
.writing-preparation-group .draft-form { padding: 0; background: transparent; border: 0; box-shadow: none; }
.writing-outline-review { margin: 24px 0; padding: 22px; background: #f3f8f5; border-radius: 14px; }
.writing-preparation-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.writing-preparation-actions button, #writingOpenAnalysis, #writingOutlineCandidate button, #analysisWritingSource button {
  border: 1px solid #bad4c8; border-radius: 10px; background: #fff; color: #225d4b;
  padding: 11px 16px; font: inherit; font-weight: 600; line-height: 1.5; cursor: pointer;
}
#writingRefineOutline, #writingAcceptOutline { background: #225d4b; color: #fff; border-color: #225d4b; }
.writing-preparation-actions button:hover, #writingOpenAnalysis:hover, #writingOutlineCandidate button:hover, #analysisWritingSource button:hover { box-shadow: 0 2px 8px #225d4b20; }
.writing-preparation-actions button:focus-visible, #writingOpenAnalysis:focus-visible, #writingOutlineCandidate button:focus-visible, #analysisWritingSource button:focus-visible { outline: 3px solid #7acfb1; outline-offset: 2px; }
#analysisWritingSource button, #writingOutlineCandidate button { margin: 8px 8px 0 0; }
#analysisWritingSource button:disabled, .writing-preparation-actions button:disabled { opacity: .5; cursor: default; box-shadow: none; }
#draftPreparation button:not(.template-picker-trigger) { max-width: 100%; }
#writingOutlineCandidate { margin-top: 20px; border-top: 1px solid #dce7e2; padding-top: 12px; }
#writingOutlineCandidate pre { max-height: 440px; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; font: inherit; line-height: 1.8; }
#writingPreparationStatus { line-height: 1.8; overflow-wrap: anywhere; }
#writingPreparationStatus.is-error { color: #a43828; }
@media (max-width: 760px) {
  #draftProgress { display: flex; overflow-x: auto; gap: 8px; padding-bottom: 10px; }
  #draftProgress li { flex: 0 0 145px; }
  #draftProgress li[hidden] { display: none; }
  .writing-outline-review { padding: 16px; }
}
.review-status[hidden],
.review-result[hidden] {
  display: none !important;
}

.review-field-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.review-option {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  color: #68736f;
  font-size: 11px;
  line-height: 1.55;
}

.review-option input {
  margin-top: 2px;
  accent-color: #c55d42;
}

.review-version-options {
  padding: 11px 13px;
  border: 1px solid #e0e7e3;
  border-radius: 10px;
  color: #68736f;
  background: #fafcfb;
  font-size: 12px;
}

.review-version-options summary { cursor: pointer; font-weight: 600; }
.review-version-options p { margin: 10px 0; line-height: 1.65; }
.review-version-options .mini-field { display: block; }
.review-version-options small { display: block; margin-top: 8px; line-height: 1.6; overflow-wrap: anywhere; }

.compact-upload.is-dragover {
  border-color: #c55d42;
  background: #fff1ec;
  box-shadow: 0 0 0 4px rgba(197, 93, 66, .1);
}

.compact-upload.has-file {
  border-style: solid;
  border-color: #75a894;
  background: #f4fbf8;
}

.compact-upload.has-file > span { background: #4e9278; }
.compact-upload.has-error { border-color: #cf6658; background: #fff5f4; }
.compact-upload.has-error > span { background: #b83f31; }

.review-status {
  padding: 13px;
  border: 1px solid #ead7d1;
  border-radius: 11px;
  background: #fffaf8;
}

.review-status-head {
  display: flex;
  justify-content: space-between;
  color: #6b3d32;
  font-size: 12px;
}

.review-progress {
  height: 5px;
  margin-top: 9px;
  overflow: hidden;
  border-radius: 999px;
  background: #f0dfda;
}

.review-progress i {
  display: block;
  width: 8%;
  height: 100%;
  border-radius: inherit;
  background: #c55d42;
  transition: width .35s ease;
}

.review-status p {
  margin: 8px 0 0;
  color: #7c7775;
  font-size: 11px;
}

.review-status.failed { border-color: #e3aaaa; background: #fff5f5; }

.review-resume-button {
  margin-top: 10px;
  padding: 8px 14px;
  border: 0;
  border-radius: 8px;
  color: #fff;
  background: #9f3f31;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.review-result {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 16px;
  align-items: center;
  padding: 14px;
  border: 1px solid #d9e2df;
  border-radius: 12px;
  background: #f8fbfa;
}

.review-result-score {
  display: flex;
  align-items: center;
  gap: 10px;
}

.review-result-score > strong {
  display: grid;
  width: 52px;
  height: 52px;
  place-items: center;
  border-radius: 12px;
  color: #fff;
  background: #263a35;
  font-size: 23px;
}

.review-result-score span,
.review-result-actions {
  display: flex;
  flex-direction: column;
}

.review-result-score b { font-size: 15px; }
.review-result-score small { color: #84908c; font-size: 10px; }
.review-result-actions { flex-direction: row; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
.review-result-actions a { padding: 8px 11px; border: 1px solid #d7e3de; border-radius: 8px; color: #a84e38; background: #fff; cursor: pointer; font-size: 11px; font-weight: 700; text-decoration: none; }
.review-result-actions a[hidden] { display: none; }
.review-result-actions .review-result-bundle { color: #fff; border-color: #a84e38; background: #a84e38; }
.review-result-actions .review-result-annotation { color: #fff; border-color: #14694d; background: #14694d; }
.review-result-actions a:hover { filter: brightness(.96); }

@media (max-width: 560px) {
  .review-field-grid,
  .review-result { grid-template-columns: 1fr; }
  .review-result-actions { justify-content: flex-start; }
  .review-result-actions .review-result-annotation { flex-basis: 100%; text-align: center; }
}
#plagiarism [hidden] { display: none !important; }
.plagiarism-input-card textarea { min-height: 126px; }
.plagiarism-report-input {
  display: grid;
  gap: 8px;
  margin: 16px 0;
  padding: 15px;
  border: 1px solid #cbded5;
  border-radius: 13px;
  background: #f7fbf9;
}
.plagiarism-report-input label { color: #173e32; font-size: 14px; font-weight: 700; }
.plagiarism-report-input input { max-width: 100%; font-size: 12px; }
.plagiarism-input-card .plagiarism-report-input textarea { width: 100%; min-height: 75px; box-sizing: border-box; padding: 9px 11px; border: 1px solid #c7dbcf; border-radius: 8px; background: #fff; font: inherit; font-size: 12px; line-height: 1.6; resize: vertical; }
.plagiarism-report-input small, .plagiarism-mode-note { color: #61736b; font-size: 12px; line-height: 1.6; }
.plagiarism-report-diagnostics { margin: 4px 0; color: #805725; font-size: 12px; line-height: 1.7; white-space: pre-wrap; }
.plagiarism-report-input details summary { cursor: pointer; color: #173e32; font-size: 13px; }
.plagiarism-report-color-roles { display: grid; gap: 10px; margin-top: 10px; }
.plagiarism-report-color-roles label { display: grid; grid-template-columns: minmax(140px, 1fr) minmax(130px, 1fr); gap: 6px 12px; align-items: center; }
.plagiarism-report-color-roles label span { display: flex; gap: 7px; align-items: center; font-size: 12px; }
.plagiarism-report-color-roles i { display: inline-block; width: 15px; height: 15px; border: 1px solid #66766f; border-radius: 3px; }
.plagiarism-report-color-roles select { width: 100%; padding: 5px; border: 1px solid #c7dbcf; border-radius: 5px; background: white; }
.plagiarism-report-color-roles small { grid-column: 1 / -1; font-weight: 400; overflow-wrap: anywhere; }
.plagiarism-mode-note { margin: 13px 0 0; }
.plagiarism-status { min-height: 21px; margin: 8px 0 0; color: #1c7256; font-size: 12px; line-height: 1.5; }
.plagiarism-status.is-error { color: #ad3b32; }

.plagiarism-result {
  width: min(1160px, 100%);
  margin: 34px auto 0;
  padding: clamp(20px, 3vw, 34px);
  border: 1px solid #dce9e2;
  border-radius: 23px;
  background: #fff;
  box-shadow: var(--shadow);
}
.plagiarism-result-header { display: flex; align-items: start; justify-content: space-between; gap: 22px; }
.plagiarism-result-header h2 { margin: 6px 0 8px; color: #173e32; font-size: clamp(24px, 3vw, 32px); }
.plagiarism-result-header p:last-child { max-width: 670px; margin: 0; color: #61736b; font-size: 13px; line-height: 1.7; }
.plagiarism-result-actions { display: flex; max-width: 380px; justify-content: flex-end; flex-wrap: wrap; gap: 8px; }
.plagiarism-result-actions button, .plagiarism-restore {
  padding: 9px 12px;
  border: 1px solid #bed7cb;
  border-radius: 9px;
  background: #f5faf7;
  color: #21634d;
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
}
.plagiarism-result-actions button:hover, .plagiarism-restore:hover { background: #e8f4ee; }
.plagiarism-result-actions button:disabled { opacity: .55; cursor: wait; }
.plagiarism-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 23px 0 14px; }
.plagiarism-metrics > div { display: grid; align-content: start; gap: 5px; min-height: 98px; padding: 15px; border: 1px solid #e1ede6; border-radius: 13px; background: #f7faf8; }
.plagiarism-metrics span { color: #5b7167; font-size: 12px; }
.plagiarism-metrics strong { color: #154b38; font-size: 24px; }
.plagiarism-metrics small { color: #738278; font-size: 12px; line-height: 1.45; }
.plagiarism-review-status { margin: 0 0 17px; padding: 11px 14px; border-radius: 10px; background: #eaf5ef; color: #315e47; font-size: 12px; line-height: 1.65; }
.plagiarism-candidate-list { display: grid; gap: 16px; }
.plagiarism-batch-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 18px; }
.plagiarism-batch-actions label { display: flex; align-items: center; gap: 6px; font-size: 13px; }
.plagiarism-batch-actions button { border: 1px solid #c4d9cb; border-radius: 8px; padding: 9px 12px; color: #27563a; background: #f3faf5; cursor: pointer; }
.plagiarism-batch-actions button:disabled { opacity: .55; cursor: default; }
.plagiarism-batch-actions [hidden] { display: none; }
#plagiarismPaperScope { display: block; width: 100%; margin-top: 7px; padding: 9px; border: 1px solid #c4d9cb; border-radius: 8px; background: #fff; color: #334b3e; }
.plagiarism-candidate { padding: 20px; border: 1px solid #dce7df; border-left: 4px solid #91bba2; border-radius: 14px; background: #fff; }
.plagiarism-candidate[data-kind="reported"] { border-left-color: #dc756b; }
.plagiarism-candidate[data-kind="internal"] { border-left-color: #d0a755; }
.plagiarism-candidate header { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.plagiarism-candidate h3 { margin: 0; color: #234639; font-size: 17px; }
.plagiarism-candidate header span { flex: 0 0 auto; padding: 5px 9px; border-radius: 999px; background: #fcece9; color: #a64038; font-size: 12px; font-weight: 700; }
.plagiarism-candidate[data-kind="internal"] header span { background: #fbf2df; color: #835d16; }
.plagiarism-candidate[data-kind="review"] header span, .plagiarism-candidate[data-kind="search"] header span { background: #eaf4ee; color: #2e7150; }
.plagiarism-candidate-meta { margin: 7px 0 16px; color: #738178; font-size: 12px; line-height: 1.6; }
.plagiarism-field-label { display: block; margin: 12px 0 7px; color: #334b3e; font-size: 13px; font-weight: 700; }
.plagiarism-candidate blockquote { max-height: 230px; overflow: auto; margin: 0; padding: 13px 15px; border-left: 2px solid #cadbd0; border-radius: 4px 9px 9px 4px; background: #f8faf8; color: #34443b; font-size: 13px; line-height: 1.8; white-space: pre-wrap; }
.plagiarism-evidence { display: flex; flex-wrap: wrap; gap: 7px; }
.plagiarism-evidence span { max-width: 100%; padding: 5px 8px; border-radius: 7px; background: #fff0ed; color: #9d3d34; font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; }
.plagiarism-guidance { margin: 15px 0 12px; padding-left: 20px; color: #4a6253; font-size: 12px; line-height: 1.75; }
.plagiarism-search-links { display: flex; flex-wrap: wrap; gap: 10px; margin: 10px 0; }
.plagiarism-search-links a { color: #1b7254; font-size: 12px; text-decoration: underline; text-underline-offset: 3px; }
.plagiarism-search-links button { margin-top: 0; }
.plagiarism-candidate textarea { display: block; width: 100%; min-height: 116px; box-sizing: border-box; margin-top: 7px; padding: 13px; border: 1px solid #c7dbcf; border-radius: 9px; outline: none; color: #263e30; background: #fff; font: inherit; font-size: 13px; font-weight: 400; line-height: 1.75; resize: vertical; }
.plagiarism-candidate textarea:focus { border-color: #559977; box-shadow: 0 0 0 3px rgba(28, 114, 81, .1); }
.plagiarism-restore { margin-top: 3px; }
.plagiarism-suggestion { margin-top: 12px; padding: 12px; border: 1px solid #d7e7dc; border-radius: 9px; background: #f5faf6; color: #375b43; font-size: 12px; line-height: 1.65; }
.plagiarism-suggestion blockquote { max-height: none; margin: 7px 0; background: #fff; }
.plagiarism-suggestion p { margin: 8px 0; }
.plagiarism-result-note, .plagiarism-empty { margin: 18px 0 0; color: #718077; font-size: 12px; line-height: 1.7; }

@media (max-width: 820px) {
  .plagiarism-result-header { flex-direction: column; }
  .plagiarism-result-actions { max-width: none; justify-content: flex-start; }
  .plagiarism-metrics { grid-template-columns: 1fr; }
}

/* 降重 / 降AIGC page: three uploads, three services with prices, one button. */
.revision-steps { display: flex; flex-wrap: wrap; gap: 10px; margin: 28px 0 0; padding: 0; list-style: none; }
.revision-steps li { display: flex; align-items: center; gap: 9px; padding: 7px 16px 7px 7px; border: 1px solid #d6e6df; border-radius: 999px; color: #24443b; background: rgba(255, 255, 255, 0.85); box-shadow: 0 4px 12px rgba(17, 114, 96, 0.06); font-size: 14px; font-weight: 600; }
.revision-steps b { display: grid; width: 26px; height: 26px; place-items: center; border-radius: 50%; color: #fff; background: linear-gradient(135deg, #1a8a73, #0f6655); font-size: 13px; }

.revision-card { display: flex; flex-direction: column; gap: 12px; }
.revision-section-title { display: flex; align-items: center; gap: 10px; margin: 2px 0 2px; color: #1b2c27; font-size: 16px; font-weight: 750; }
.revision-section-title:not(:first-child) { margin-top: 14px; }
.revision-section-title span { display: grid; width: 26px; height: 26px; place-items: center; border-radius: 9px; color: #fff; background: linear-gradient(135deg, #1a8a73, #0f6655); font-size: 13px; }

/* Upload boxes. */
.revision-upload { position: relative; display: grid; grid-template-columns: 46px minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 14px 16px; border: 1.5px dashed #c6d9d1; border-radius: 16px; background: #fbfdfc; cursor: pointer; transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease; }
.revision-upload:hover { border-color: #7fb6a3; background: #f3faf7; box-shadow: 0 6px 16px rgba(17, 114, 96, 0.07); }
.revision-upload.is-ready { border-style: solid; border-color: #1a8a73; background: linear-gradient(135deg, #f2faf6, #ffffff); }
.revision-upload input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.revision-upload:focus-within { outline: 2px solid #117260; outline-offset: 2px; }
.revision-upload-icon { display: grid; width: 46px; height: 46px; place-items: center; border-radius: 13px; color: #fff; background: linear-gradient(135deg, #1a8a73, #0f6655); font-size: 17px; font-weight: 800; box-shadow: 0 6px 14px rgba(17, 114, 96, 0.22); }
.revision-upload-icon.is-plagiarism { background: linear-gradient(135deg, #3d84c2, #275d92); box-shadow: 0 6px 14px rgba(47, 111, 168, 0.22); }
.revision-upload-icon.is-aigc { background: linear-gradient(135deg, #7d67c2, #5a4797); box-shadow: 0 6px 14px rgba(107, 86, 168, 0.22); font-size: 15px; }
.revision-upload-text { display: flex; min-width: 0; flex-direction: column; gap: 4px; }
.revision-upload-text strong { overflow: hidden; color: #1b2c27; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.revision-upload-text small { color: #6b7b76; font-size: 12.5px; line-height: 1.5; }
.revision-badge { padding: 5px 13px; border-radius: 999px; color: #fff; background: linear-gradient(135deg, #1a8a73, #0f6655); font-size: 13px; font-weight: 700; letter-spacing: 0.02em; }
.revision-badge.is-optional { color: #4f625c; background: #e9f0ed; }
.revision-inline-link { align-self: flex-start; margin-top: 2px; padding: 0; border: 0; color: #5a4797; background: none; font: inherit; font-size: 12.5px; font-weight: 700; text-decoration: underline; cursor: pointer; }
.revision-inline-link[hidden] { display: none; }
.revision-diagnostics { margin: 0; color: #805725; font-size: 12px; line-height: 1.6; }

/* Service cards: icon, name, price; the chosen one is filled. */
.revision-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.revision-option { position: relative; cursor: pointer; }
.revision-option input { position: absolute; opacity: 0; pointer-events: none; }
.revision-option-body { position: relative; display: flex; height: 100%; box-sizing: border-box; flex-direction: column; align-items: center; gap: 12px; padding: 30px 12px 18px; border: 1.5px solid #dbe6e2; border-radius: 18px; background: #fff; text-align: center; transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease; }
.revision-option:hover .revision-option-body { border-color: #9fcbbb; transform: translateY(-1px); box-shadow: 0 8px 20px rgba(17, 114, 96, 0.08); }
.revision-option-body strong { color: #1b2c27; font-size: 17px; }
.revision-option-body em { padding: 4px 12px; border-radius: 999px; color: #117260; background: #eef6f3; font-size: 14px; font-style: normal; font-weight: 800; }
.revision-option input:checked + .revision-option-body { border-color: #1a8a73; background: linear-gradient(180deg, #f1faf6, #ffffff); box-shadow: 0 0 0 3px rgba(17, 114, 96, 0.13), 0 10px 24px rgba(17, 114, 96, 0.1); }
.revision-option input:checked + .revision-option-body em { color: #fff; background: #117260; }
/* Radio mark: hollow ring, filled with a tick when chosen. */
.revision-option-body::before { content: ""; position: absolute; top: 12px; left: 12px; width: 18px; height: 18px; box-sizing: border-box; border: 2px solid #c3d6cf; border-radius: 50%; background: #fff; transition: border-color 0.15s ease, background 0.15s ease; }
.revision-option input:checked + .revision-option-body::before { content: "✓"; display: grid; place-items: center; border-color: #117260; color: #fff; background: #117260; font-size: 11px; font-weight: 800; }
.revision-option input:focus-visible + .revision-option-body { outline: 2px solid #117260; outline-offset: 2px; }
/* English papers offer 双降低 only; the other options are locked. */
.revision-option.is-locked { cursor: not-allowed; }
.revision-option.is-locked .revision-option-body { opacity: 0.45; filter: grayscale(0.6); }
.revision-option.is-locked:hover .revision-option-body { border-color: #dbe6e2; transform: none; box-shadow: none; }
.revision-tag { position: absolute; top: -10px; right: 12px; padding: 3px 10px; border-radius: 999px; color: #fff; background: linear-gradient(135deg, #f0a04b, #dd7a24); box-shadow: 0 4px 10px rgba(221, 122, 36, 0.3); font-size: 12px; font-style: normal; font-weight: 700; }

/* Paper language: a segmented bar under the options (default Chinese). */
.revision-language { display: flex; align-items: center; gap: 10px; }
.revision-language > span { color: #4f625c; font-size: 13px; font-weight: 700; }
.revision-language label { flex: 1; position: relative; cursor: pointer; }
.revision-language input { position: absolute; opacity: 0; pointer-events: none; }
.revision-language b { display: block; padding: 8px 12px; border: 1.5px solid #dbe6e2; border-radius: 12px; color: #4f625c; background: #fff; font-size: 14px; text-align: center; transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease; }
.revision-language label:hover b { border-color: #9fcbbb; }
.revision-language input:checked + b { border-color: #117260; color: #fff; background: #117260; }
.revision-language input:focus-visible + b { outline: 2px solid #117260; outline-offset: 2px; }
.revision-option-note { margin: 2px 0 0; padding: 10px 12px; border-radius: 12px; color: #4f625c; background: #f4f8f6; font-size: 12.5px; line-height: 1.65; }
.revision-start { width: 100%; margin-top: 4px; box-shadow: 0 10px 22px rgba(17, 114, 96, 0.22); }
.revision-status { min-height: 18px; margin: 0; color: #1c7256; font-size: 13px; line-height: 1.6; }
.revision-status.is-error { color: #ad3b32; }
@media (max-width: 640px) {
  .revision-options { grid-template-columns: 1fr; }
  .revision-option-body { flex-direction: row; justify-content: flex-start; padding: 14px 16px; text-align: left; }
  .revision-option-body em { margin-left: auto; }
  .revision-upload { grid-template-columns: 40px minmax(0, 1fr) auto; }
}
.aigc-theme {
  --page-accent: #6755a5;
}

.aigc-theme .section-kicker {
  color: var(--page-accent);
}

/* Result box in the style of the AI review result: a coloured score tile and the level. */
.score-preview {
  display: flex;
  max-width: 380px;
  align-items: center;
  gap: 14px;
  margin-top: 32px;
  padding: 14px;
  border: 1px solid #ded9ef;
  border-radius: 12px;
  background: #fbfaff;
}

.score-ring {
  display: flex;
  width: auto;
  min-width: 84px;
  height: 56px;
  border: 0;
  padding: 0 12px;
  align-items: baseline;
  justify-content: center;
  align-content: center;
  border-radius: 12px;
  color: #fff;
  background: #8e86a8;
  line-height: 56px;
}

.score-ring strong {
  font-size: 22px;
}

.score-ring small {
  margin-left: 1px;
  font-size: 13px;
}

.score-preview > div:last-child {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.score-preview > div:last-child strong {
  font-size: 17px;
}

.score-preview > div:last-child span {
  color: var(--muted);
  font-size: 12px;
}

.score-preview > div:last-child span:empty {
  display: none;
}

.action-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 18px;
  font-size: 15px;
  font-weight: 600;
}

.action-title small {
  color: #8c9793;
  font-size: 11px;
  font-weight: 400;
}

.live-dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: 5px;
  border-radius: 50%;
  background: #6755a5;
  box-shadow: 0 0 0 4px #eeeafb;
}

.action-card textarea.large-textarea {
  min-height: 260px;
}

.textarea-meta {
  display: flex;
  justify-content: space-between;
  margin-top: 8px;
  color: #98a19e;
  font-size: 10px;
}

.violet-button {
  background: #6755a5;
}

.aigc-input-card {
  min-height: 535px;
}

.aigc-upload {
  display: grid;
  min-height: 72px;
  padding: 12px 14px;
  align-items: center;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  gap: 12px;
  border: 1px dashed #c8c0e4;
  border-radius: 13px;
  background: #faf9fe;
  cursor: pointer;
  transition: border-color 0.2s ease, background 0.2s ease;
}

.aigc-upload:hover {
  border-color: #6755a5;
  background: #f6f3fd;
}

.aigc-upload input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.aigc-upload-icon {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border-radius: 11px;
  color: white;
  background: #6755a5;
  font-family: Georgia, serif;
  font-size: 17px;
  font-weight: 700;
}

.aigc-upload > span:nth-child(3) {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 4px;
}

.aigc-upload strong {
  overflow: hidden;
  color: var(--ink);
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aigc-upload small {
  color: var(--muted);
  font-size: 12px;
}

.aigc-upload > b {
  padding: 7px 10px;
  border-radius: 8px;
  color: #5a478f;
  background: #eeeafb;
  font-size: 12px;
}

.aigc-status {
  min-height: 18px;
  margin: 10px 2px 0;
  color: #665a7c;
  font-size: 12px;
  line-height: 1.55;
}

.aigc-status.is-error {
  color: #b3463a;
}

.violet-button:disabled {
  cursor: wait;
  opacity: 0.68;
  transform: none;
}

.score-ring[data-level="unavailable"] {
  color: #68717a;
  background: #edf0f2;
  border-color: #cbd1d6;
}

.score-ring[data-level="low"] {
  background: #3f8a66;
}

.score-ring[data-level="medium"] {
  background: #c98a24;
}

.score-ring[data-level="high"] {
  background: #bd4b45;
}

.aigc-report-downloads {
  margin-top: 18px;
  gap: 10px;
}

.aigc-rewrite-actions.aigc-report-downloads button {
  padding: 12px 20px;
  border-radius: 11px;
  font-size: 14px;
  transition: background 0.15s ease, border-color 0.15s ease;
}

.aigc-rewrite-actions.aigc-report-downloads button:not(:first-child):not(:disabled):hover {
  border-color: #b9abe0;
  background: #f6f3fd;
}

.aigc-report {
  width: min(1160px, 100%);
  margin: 34px auto 0;
  padding: clamp(24px, 4vw, 46px);
  border: 1px solid #dcd7eb;
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 24px 60px rgba(56, 42, 91, 0.09);
  scroll-margin-top: 96px;
}

.aigc-report-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.aigc-report-header h2 {
  margin: 7px 0 8px;
  font-size: clamp(27px, 3.5vw, 40px);
}

.aigc-report-header > div:first-child > p:last-child {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.aigc-report-actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 14px;
}

.aigc-quick-reduce {
  min-width: 148px;
  padding: 12px 16px;
  border: 1px solid #6d58a8;
  border-radius: 11px;
  color: #fff;
  background: #6d58a8;
  font: inherit;
  font-size: 12px;
  font-weight: 750;
  cursor: pointer;
}

.aigc-quick-reduce:disabled {
  opacity: 0.62;
  cursor: wait;
}

/* Score card: white card with a level-coloured accent, level pill, large score
   and a bar filled to the score with a 20% reference mark. */
.aigc-total-score {
  --tone: #2f8f6b;
  --tint: #e6f4ed;
  display: flex;
  width: 300px;
  flex: 0 0 300px;
  flex-direction: column;
  justify-content: center;
  gap: 10px;
  padding: 18px 20px;
  border: 1px solid #ebe8f2;
  border-left: 5px solid var(--tone);
  border-radius: 16px;
  color: var(--tone);
  background: #fff;
  box-shadow: 0 12px 32px rgba(56, 42, 91, 0.08);
}

.aigc-total-score[data-level="medium"] { --tone: #c27c12; --tint: #fcf0d9; }
.aigc-total-score[data-level="high"] { --tone: #c2483f; --tint: #fbe7e4; }
.aigc-total-score[data-level="unavailable"] { --tone: #7b838b; --tint: #eef0f2; }

.aigc-score-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.aigc-score-top span {
  color: #77708a;
  font-size: 13px;
  font-weight: 600;
}

.aigc-score-top em {
  padding: 3px 11px;
  border-radius: 999px;
  color: var(--tone);
  background: var(--tint);
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
}

.aigc-total-score strong {
  color: var(--tone);
  font-size: 40px;
  font-weight: 800;
  letter-spacing: -0.01em;
  line-height: 1;
}

.aigc-score-bar {
  position: relative;
  height: 8px;
  border-radius: 999px;
  background: #f0eef5;
}

.aigc-score-bar i {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: var(--score, 0%);
  border-radius: inherit;
  background: var(--tone);
  transition: width 0.4s ease;
}

.aigc-score-bar b {
  position: absolute;
  top: -3px;
  left: 20%;
  width: 2px;
  height: 14px;
  border-radius: 1px;
  background: #6b56a8;
  opacity: 0.5;
}

/* "查看报告" above "优化表达". */
.aigc-report-buttons {
  display: flex;
  min-width: 156px;
  flex-direction: column;
  justify-content: center;
  gap: 10px;
}

.aigc-report-buttons .aigc-quick-reduce {
  min-width: 156px;
  padding: 13px 20px;
  border-radius: 12px;
  font-size: 15px;
  transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

#aigcViewReport {
  border-color: #d8d0ee;
  color: #5a4795;
  background: #fff;
}

#aigcViewReport:not(:disabled):hover {
  border-color: #b9abe0;
  background: #f6f3fd;
}

#aigcQuickReduceButton {
  border-color: transparent;
  background: linear-gradient(135deg, #7c64c4, #5c4a9c);
  box-shadow: 0 8px 20px rgba(92, 74, 156, 0.28);
}

#aigcQuickReduceButton:not(:disabled):hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(92, 74, 156, 0.34);
}

.score-preview[hidden] {
  display: none;
}

.aigc-method-note {
  display: flex;
  margin-top: 26px;
  padding: 13px 15px;
  align-items: flex-start;
  gap: 12px;
  border: 1px solid #e3d9be;
  border-radius: 12px;
  color: #6f5d2c;
  background: #fffaf0;
  font-size: 12px;
  line-height: 1.55;
}

.aigc-method-note.is-model {
  border-color: #cde3da;
  color: #315f50;
  background: #f2faf6;
}

.aigc-method-note strong {
  flex: 0 0 auto;
}

.aigc-metrics {
  display: grid;
  margin-top: 20px;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}

.aigc-metrics article {
  display: flex;
  min-height: 96px;
  padding: 16px 18px;
  border: 1px solid #ebe8f2;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 4px 14px rgba(56, 42, 91, 0.04);
  flex-direction: column;
}

.aigc-metrics span {
  color: #77708a;
  font-size: 13px;
  font-weight: 600;
}

.aigc-metrics strong {
  margin: 10px 0 0;
  color: #3f3363;
  font-size: 28px;
  font-weight: 800;
}

.aigc-metrics small {
  margin-top: auto;
  color: #8c8796;
  font-size: 12px;
  line-height: 1.4;
}

.aigc-document-review {
  margin-top: 26px;
  padding: 20px;
  border: 1px solid #e2deeb;
  border-radius: 17px;
  background: #fcfbfe;
}

.aigc-document-review > header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
}

.aigc-document-review > header > div:first-child > span {
  color: #7864aa;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.12em;
}

.aigc-document-review h3 {
  margin: 4px 0 0;
  font-size: 18px;
}

.aigc-risk-legend {
  display: flex;
  gap: 12px;
  color: var(--muted);
  font-size: 12px;
}

.aigc-risk-legend span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.aigc-risk-legend i {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #cfded7;
}

.aigc-risk-legend i[data-level="high"] {
  background: #c84d49;
}

.aigc-risk-legend i[data-level="medium"] {
  background: #d9902a;
}

.aigc-risk-filter {
  margin: 4px 0 0 6px;
  padding: 6px 16px;
  border: 1px solid #c9bfe0;
  border-radius: 999px;
  color: #59478a;
  background: #fff;
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
}

.aigc-risk-filter[aria-pressed="true"] {
  border-color: #59478a;
  background: #f1edf9;
}

.aigc-annotated-document.risk-only .aigc-paragraph-card[data-level="low"] {
  display: none;
}

.aigc-document-summary {
  margin: 12px 0;
  color: #696370;
  font-size: 12px;
  line-height: 1.65;
}

.aigc-annotated-document {
  display: grid;
  max-height: 720px;
  padding-right: 6px;
  /* minmax(0, 1fr): long unbroken text must not widen the column past the panel. */
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  overflow: auto;
}

.aigc-paragraph-card {
  min-width: 0;
  overflow-wrap: anywhere;
  padding: 14px 15px;
  border: 1px solid #e5e2e9;
  border-left: 4px solid #cfded7;
  border-radius: 11px;
  background: #fff;
}

.aigc-paragraph-card[data-level="high"] {
  border-color: #eccbc8;
  border-left-color: #c84d49;
  background: #fffafa;
}

.aigc-paragraph-card header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: #79727f;
  font-size: 12px;
}

.aigc-paragraph-card[data-level="high"] header strong {
  color: #a13e39;
}

.aigc-paragraph-card p {
  margin: 8px 0 0;
  color: #343039;
  font-size: 12px;
  line-height: 1.9;
  white-space: pre-wrap;
}

/* Two clearly different tones, matching the full report: amber below 80%, red at 80%+. */
.aigc-risk-mark {
  padding: 2px 1px;
  border-radius: 3px;
  color: #6b3f05;
  background: #fbe3bd;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}

.aigc-risk-mark[data-level="high"] {
  color: #641f1c;
  background: #f2bbb7;
  text-decoration: underline;
  text-decoration-color: #c84d49;
  text-underline-offset: 3px;
}

.aigc-report-grid {
  display: grid;
  margin-top: 26px;
  grid-template-columns: minmax(280px, 0.8fr) minmax(0, 1.2fr);
  gap: 18px;
}

.aigc-rewrite-panel {
  margin-top: 26px;
  padding: 22px;
  border: 1px solid #dcd4ed;
  border-radius: 17px;
  background: linear-gradient(135deg, #fbf9ff, #f6f3fc);
}

.aigc-rewrite-intro {
  display: grid;
  grid-template-columns: minmax(170px, 0.65fr) minmax(260px, 1.35fr) auto;
  align-items: center;
  gap: 22px;
}

.aigc-rewrite-intro span,
.aigc-rewrite-result header span {
  color: #7864aa;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.12em;
}

.aigc-rewrite-intro h3,
.aigc-rewrite-result h4 {
  margin: 4px 0 0;
  font-size: 18px;
}

.aigc-rewrite-intro p {
  margin: 0;
  color: #65606d;
  font-size: 12px;
  line-height: 1.65;
}

.aigc-rewrite-button,
.aigc-rewrite-actions button {
  border: 1px solid #6d58a8;
  border-radius: 10px;
  color: white;
  background: #6d58a8;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

.aigc-rewrite-button {
  min-width: 128px;
  padding: 12px 17px;
}

.aigc-rewrite-button:disabled {
  opacity: 0.62;
  cursor: wait;
}

.aigc-rewrite-status {
  min-height: 18px;
  margin: 12px 0 0;
  color: #62577d;
  font-size: 12px;
}

.aigc-rewrite-status.is-error {
  color: #a13e39;
}

.aigc-rewrite-result {
  margin-top: 16px;
  padding-top: 18px;
  border-top: 1px solid #ded8eb;
}

.aigc-rewrite-result[hidden] {
  display: none;
}

.aigc-rewrite-result header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
}

.aigc-rewrite-result header small {
  color: var(--muted);
  font-size: 12px;
}

.aigc-rewrite-result textarea {
  width: 100%;
  min-height: 360px;
  margin-top: 14px;
  padding: 17px;
  resize: vertical;
  border: 1px solid #ddd7e8;
  border-radius: 12px;
  outline: none;
  color: #343039;
  background: white;
  font: inherit;
  font-size: 12px;
  line-height: 1.8;
}

.aigc-verification {
  margin-top: 12px;
  padding: 12px 14px;
  border: 1px solid #d7d2e2;
  border-radius: 10px;
  color: #62577d;
  background: #faf8fd;
  font-size: 12px;
  font-weight: 700;
}

.aigc-verification[data-state="improved"] {
  border-color: #bddfce;
  color: #24634d;
  background: #f2faf6;
}

.aigc-verification[data-state="worse"] {
  border-color: #edc9c5;
  color: #9a3b36;
  background: #fff7f6;
}

.aigc-change-comparison {
  margin-top: 18px;
}

.aigc-change-comparison > header,
.aigc-change-list article > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.aigc-change-comparison > header small {
  color: var(--muted);
  font-size: 12px;
}

.aigc-change-list {
  display: grid;
  margin-top: 12px;
  gap: 10px;
}

.aigc-change-list article {
  padding: 14px;
  border: 1px solid #e0daeb;
  border-radius: 12px;
  background: white;
}

.aigc-change-list article > header strong {
  color: #564777;
  font-size: 12px;
}

.aigc-change-list article > header span {
  color: #8b8494;
  font-size: 12px;
}

.aigc-change-list article > div {
  display: grid;
  margin-top: 10px;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
}

.aigc-change-list article section {
  padding: 11px;
  border-radius: 9px;
  background: #faf8fc;
}

.aigc-change-list article section:last-child {
  background: #f2f8f5;
}

.aigc-change-list article section b {
  color: #857d90;
  font-size: 12px;
}

.aigc-change-list article section p,
.aigc-change-list article > p {
  margin: 6px 0 0;
  font-size: 12px;
  line-height: 1.65;
}

.aigc-change-list article > p {
  color: #777080;
}

.aigc-rewrite-actions {
  display: flex;
  margin-top: 11px;
  gap: 9px;
  flex-wrap: wrap;
}

.aigc-rewrite-actions button {
  padding: 9px 13px;
}

.aigc-rewrite-actions button:not(:first-child) {
  border-color: #d6cfea;
  color: #59478a;
  background: white;
}

.aigc-rewrite-warning {
  margin: 11px 0 0;
  color: #827b8c;
  font-size: 12px;
  line-height: 1.55;
}

.aigc-report-panel {
  padding: 21px;
  border: 1px solid #e8e5ef;
  border-radius: 16px;
  background: #fff;
}

.aigc-report-panel > header,
.aigc-evidence-list article header,
.aigc-section-row > div:first-child {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.aigc-report-panel > header span {
  color: #7864aa;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.12em;
}

.aigc-report-panel > header h3 {
  margin: 4px 0 0;
  font-size: 18px;
}

.aigc-report-panel > header small {
  color: var(--muted);
  font-size: 12px;
}

.aigc-section-list,
.aigc-evidence-list {
  display: grid;
  margin-top: 18px;
  gap: 13px;
}

.aigc-section-row > div:first-child {
  font-size: 12px;
  padding-left: calc(var(--section-depth, 0) * 14px);
}

.aigc-section-row span {
  color: var(--muted);
  font-size: 12px;
}

.aigc-score-track {
  height: 7px;
  margin-top: 7px;
  overflow: hidden;
  border-radius: 999px;
  background: #f0eef4;
}

.aigc-score-track i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #4e9b7f;
}

.aigc-score-track i[data-level="medium"] {
  background: #d49a3c;
}

.aigc-score-track i[data-level="high"] {
  background: #c45a53;
}

.aigc-evidence-list article {
  padding: 14px;
  border-left: 3px solid #c65a53;
  border-radius: 4px 11px 11px 4px;
  background: #fcf8f8;
}

.aigc-evidence-list article header span,
.aigc-evidence-list article header strong {
  color: #9f4742;
  font-size: 12px;
}

.aigc-evidence-list article p {
  margin: 10px 0 8px;
  color: #343039;
  font-size: 12px;
  line-height: 1.65;
}

.aigc-evidence-list article ul {
  margin: 0;
  padding-left: 17px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.6;
}

.aigc-empty {
  margin: 0;
  padding: 24px;
  border-radius: 11px;
  color: var(--muted);
  background: #f7f8f7;
  font-size: 12px;
  text-align: center;
}


@media (max-width: 780px) {
  .aigc-report-header { align-items: flex-start; }
  .aigc-report-actions { align-items: stretch; flex-direction: column; }
  .aigc-total-score { width: 100%; flex-basis: auto; }
  .aigc-report-buttons { flex-direction: row; }
  .aigc-report-buttons .aigc-quick-reduce { flex: 1; }
  .aigc-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .aigc-report-grid { grid-template-columns: 1fr; }
  .aigc-rewrite-intro { grid-template-columns: 1fr; gap: 13px; }
  .aigc-rewrite-button { width: 100%; }
  .aigc-change-list article > div, .aigc-agent-list { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
  .aigc-upload { grid-template-columns: 38px minmax(0, 1fr); }
  .aigc-upload > b { display: none; }
  .aigc-report { padding: 20px; border-radius: 18px; }
  .aigc-report-header { flex-direction: column; }
  .aigc-report-actions, .aigc-quick-reduce { width: 100%; }
  .aigc-metrics { grid-template-columns: 1fr; }
  .aigc-metrics article { min-height: 92px; }
  .aigc-document-review { padding: 15px; }
  .aigc-document-review > header, .aigc-paragraph-card header { align-items: flex-start; flex-direction: column; }
  .aigc-method-note { flex-direction: column; gap: 5px; }
}
.aigc-tier-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.aigc-tier-actions > button {
  flex: 1 1 180px;
}

.aigc-tier-note {
  margin: 8px 0 0;
  font-size: 13px;
  opacity: 0.72;
}

/* Dual-file mode: paper + third-party AIGC report. */
.aigc-report-input { margin: 12px 0; }
.aigc-report-input textarea {
  width: 100%;
  min-height: 75px;
  box-sizing: border-box;
  padding: 9px 11px;
  border: 1px solid #d6cfe8;
  border-radius: 8px;
  background: #fff;
  font: inherit;
  font-size: 12px;
  line-height: 1.6;
  resize: vertical;
}
/* Account dialog: a compact first step toward a persistent writing workspace. */
.auth-modal[hidden] { display: none; }
.auth-modal {
  position: fixed;
  z-index: 1000;
  inset: 0;
  display: grid;
  padding: 20px;
  place-items: center;
  overflow-y: auto;
  overscroll-behavior: contain;
}
.auth-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(23, 34, 31, .42);
  backdrop-filter: blur(4px);
}
.auth-dialog {
  position: relative;
  z-index: 1;
  width: min(420px, 100%);
  max-height: min(760px, calc(100dvh - 40px));
  box-sizing: border-box;
  padding: 34px;
  border: 1px solid #d9e0dc;
  border-radius: 18px;
  background: #fffdf8;
  box-shadow: 0 24px 64px rgba(23, 34, 31, .2);
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-color: #b9c3be transparent;
  scrollbar-gutter: stable;
}
.auth-close {
  position: absolute;
  top: 14px;
  right: 16px;
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 50%;
  color: #687570;
  background: transparent;
  cursor: pointer;
  font-size: 24px;
  line-height: 1;
}
.auth-close:hover { color: #dd604a; background: #f4f1ea; }
.auth-kicker { color: #dd604a; font-size: 11px; font-weight: 800; letter-spacing: .14em; }
.auth-dialog h2 { margin: 8px 0 6px; color: #17221f; font-size: 25px; letter-spacing: -.03em; }
.auth-hint { margin: 0 0 22px; color: #687570; font-size: 14px; line-height: 1.55; }
.auth-tabs { display: flex; gap: 4px; margin-bottom: 18px; padding: 4px; border-radius: 9px; background: #e4f0eb; }
.auth-tabs button { flex: 1; min-height: 36px; border: 0; border-radius: 6px; color: #687570; background: transparent; cursor: pointer; font-weight: 700; }
.auth-tabs button.active { color: #17221f; background: #fffdf8; box-shadow: 0 0 0 1px #d9e0dc; }
.auth-dialog form { display: grid; gap: 8px; }
.auth-dialog [hidden] { display: none !important; }
.identity-section { margin: 16px 0; padding: 16px 0; border-block: 1px solid #d9e0dc; }
.identity-section h3 { color: #17221f; font-size: 20px; }
.identity-section p, .identity-status { font-size: 15px; line-height: 1.65; color: #44514d; overflow-wrap: anywhere; }
.identity-section button { padding: 12px 16px; border: 1px solid #cedbd6; border-radius: 6px; background: #fffdf8; color: #223b34; font: inherit; cursor: pointer; }
.identity-section .identity-primary { width: 100%; background: #e4f0eb; font-size: 17px; font-weight: 650; }
.wechat-scene-qr { display: grid; justify-items: center; gap: 8px; margin-top: 14px; padding: 14px; border: 1px solid #d8e0db; border-radius: 10px; background: #f4f1ea; }
.wechat-scene-qr img { width: min(220px, 100%); height: auto; aspect-ratio: 1; object-fit: contain; background: #fff; }
.wechat-scene-entry .identity-status { margin: 0; text-align: center; }
.identity-section button:disabled { opacity: .55; cursor: not-allowed; }
.identity-section button:focus-visible { outline: 3px solid #376c5b; outline-offset: 2px; }
.identity-section form { margin-bottom: 20px; }
.auth-dialog .identity-agreement { display: block; margin-top: 12px; font-size: 14px; line-height: 1.6; }
.auth-dialog .identity-agreement input { width: 18px; min-height: 18px; margin: 0 6px 0 0; vertical-align: middle; }
.identity-agreement a { color: #376c5b; text-decoration: underline; }
.auth-dialog label { color: #44514d; font-size: 13px; font-weight: 700; }
.auth-dialog input { width: 100%; min-height: 44px; box-sizing: border-box; margin-bottom: 8px; padding: 0 12px; border: 1px solid #d8e0db; border-radius: 7px; color: #17221f; background: #f4f1ea; font: inherit; }
.auth-dialog input:focus { border-color: #dd604a; outline: 3px solid rgba(221, 96, 74, .18); }
.auth-error { margin: 2px 0 4px; padding: 9px 10px; border-radius: 6px; color: #a63e2d; background: #fff0eb; font-size: 13px; line-height: 1.45; }
.auth-submit { min-height: 44px; margin-top: 4px; border: 0; border-radius: 7px; color: #fff; background: #17221f; cursor: pointer; font-weight: 700; }
.auth-submit:hover { color: #ffd9cf; opacity: .9; }
.auth-user-state { margin: 18px 0 10px; color: #44514d; font-size: 14px; line-height: 1.5; }
.auth-logout { width: 100%; min-height: 40px; border: 1px solid #d8e0db; border-radius: 7px; color: #44514d; background: #f4f1ea; cursor: pointer; font-weight: 700; }
.auth-logout:hover { border-color: #dd604a; color: #dd604a; }
.auth-projects { margin-top: 18px; padding-top: 16px; border-top: 1px solid #d9e0dc; }
.auth-projects-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 9px; }
.auth-projects-heading h3 { margin: 0; color: #17221f; font-size: 15px; }
.auth-projects-heading button { border: 0; color: #dd604a; background: transparent; cursor: pointer; font-size: 12px; font-weight: 700; }
.auth-project-list { display: grid; max-height: 150px; gap: 5px; overflow-y: auto; }
.auth-project-list > span { padding: 7px 0; color: #687570; font-size: 12px; line-height: 1.45; }
.auth-project-item { display: flex; min-height: 42px; align-items: center; justify-content: space-between; gap: 10px; padding: 7px 10px; border: 1px solid #d8e0db; border-radius: 7px; color: #17221f; background: #f4f1ea; cursor: pointer; text-align: left; }
.auth-project-item:hover { border-color: #dd604a; }
.auth-project-item.active { border-color: #17221f; background: #e4f0eb; }
.auth-project-item strong { overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.auth-project-item small { flex: 0 0 auto; color: #687570; font-size: 11px; }
.auth-project-form { display: flex; gap: 6px; margin-top: 9px; }
.auth-project-form input { min-width: 0; min-height: 38px; margin: 0; }
.auth-project-form button { flex: 0 0 auto; min-height: 38px; padding: 0 10px; border: 0; border-radius: 7px; color: #fff; background: #17221f; cursor: pointer; font-size: 12px; font-weight: 700; }
.auth-project-form button:hover { color: #ffd9cf; opacity: .9; }
.auth-admin { margin-top: 18px; padding-top: 16px; border-top: 1px solid #d9e0dc; }
.auth-admin-actions { display: inline-flex; align-items: center; gap: 10px; }
.auth-admin-form { display: grid; gap: 7px; }
.auth-admin-form input { min-height: 38px; margin: 0; }
.auth-admin-form select { min-height: 38px; padding: 6px 10px; border: 1px solid #d8e0db; border-radius: 7px; background: #fff; font: inherit; color: #17221f; }
.auth-admin-user { flex-wrap: wrap; }
.auth-admin-user button { min-height: 32px; padding: 5px 10px; border: 1px solid #d8e0db; border-radius: 6px; background: #fff; color: #17221f; cursor: pointer; }
.auth-admin-user button:disabled { opacity: .6; cursor: wait; }
.auth-admin-form button { min-height: 40px; border: 0; border-radius: 7px; color: #fff; background: #17221f; cursor: pointer; font-weight: 700; }
.auth-admin-form button:hover { color: #ffd9cf; opacity: .9; }
.auth-admin-status { min-height: 18px; margin: 8px 0 4px; color: #687570; font-size: 12px; }
.auth-admin-list { display: grid; max-height: 130px; gap: 5px; overflow-y: auto; }
.auth-admin-user { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 7px 9px; border: 1px solid #d8e0db; border-radius: 7px; background: #f4f1ea; }
.auth-admin-user strong { overflow: hidden; color: #17221f; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.auth-admin-user small { flex: 0 0 auto; color: #687570; font-size: 11px; }
.admin-audit-modal[hidden] { display: none; }
.admin-audit-modal { position: fixed; z-index: 1100; inset: 0; display: grid; padding: 20px; place-items: center; overflow-y: auto; }
.admin-audit-backdrop { position: absolute; inset: 0; background: rgba(23, 34, 31, .48); backdrop-filter: blur(5px); }
.admin-audit-dialog { position: relative; z-index: 1; width: min(980px, 100%); max-height: min(820px, calc(100dvh - 40px)); box-sizing: border-box; padding: 28px; border: 1px solid #d9e0dc; border-radius: 16px; background: #fffdf8; box-shadow: 0 24px 64px rgba(23, 34, 31, .22); overflow: auto; }
.admin-audit-header, .admin-audit-detail-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.admin-audit-header h2 { margin: 6px 0 0; color: #17221f; font-size: 25px; }
.admin-audit-hint { margin: 8px 0 18px; color: #687570; font-size: 14px; line-height: 1.55; }
.admin-audit-toolbar { display: flex; flex-wrap: wrap; gap: 8px; }
.admin-audit-toolbar select, .admin-audit-toolbar button, .admin-audit-detail-header button { min-height: 38px; padding: 0 12px; border: 1px solid #d8e0db; border-radius: 7px; color: #44514d; background: #f4f1ea; font: inherit; cursor: pointer; }
.admin-audit-toolbar button, .admin-audit-detail-header button { border-color: #17221f; color: #fff; background: #17221f; font-weight: 700; }
.admin-audit-toolbar button:hover, .admin-audit-detail-header button:hover { opacity: .82; }
.admin-audit-status { min-height: 20px; margin: 10px 0; color: #687570; font-size: 13px; }
.admin-audit-list { display: grid; max-height: 360px; gap: 7px; overflow: auto; }
.admin-audit-item { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 16px; padding: 11px 13px; border: 1px solid #d8e0db; border-radius: 8px; color: #17221f; background: #f4f1ea; cursor: pointer; text-align: left; }
.admin-audit-item:hover { border-color: #dd604a; background: #fff8f3; }
.admin-audit-item-main { min-width: 0; display: grid; gap: 3px; }
.admin-audit-item-main strong { overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.admin-audit-item-main small { color: #687570; font-size: 12px; }
.admin-audit-item-state { flex: 0 0 auto; color: #dd604a; font-size: 12px; font-weight: 700; }
.admin-audit-item.status-completed .admin-audit-item-state { color: #21834b; }
.admin-audit-item.status-failed .admin-audit-item-state { color: #b33e2e; }
.admin-audit-empty { color: #687570; }
.admin-audit-operations { margin-top: 18px; padding-top: 16px; border-top: 1px solid #d9e0dc; }
.admin-audit-operations h3 { margin: 0; color: #17221f; font-size: 16px; }
.admin-audit-operation-list { display: grid; max-height: 230px; margin-top: 10px; gap: 6px; overflow: auto; }
.admin-audit-operation { display: grid; gap: 3px; padding: 9px 11px; border-left: 3px solid #9bb7ac; border-radius: 6px; background: #f4f1ea; }
.admin-audit-operation strong { color: #263b34; font-size: 13px; }
.admin-audit-operation span, .admin-audit-operation small { color: #687570; font-size: 12px; line-height: 1.45; }
.admin-audit-operation small { color: #b33e2e; }
.admin-audit-operation.status-success { border-left-color: #54a878; }
.admin-audit-operation.status-failed, .admin-audit-operation.status-error { border-left-color: #dd604a; }
.admin-audit-detail { margin-top: 18px; padding-top: 16px; border-top: 1px solid #d9e0dc; }
.admin-audit-detail-header { align-items: center; }
.admin-audit-detail-header h3 { margin: 0; color: #17221f; font-size: 16px; }
.admin-audit-detail pre { max-height: 310px; margin: 10px 0 0; padding: 13px; border: 1px solid #d8e0db; border-radius: 7px; color: #44514d; background: #f4f1ea; font: 12px/1.55 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; white-space: pre-wrap; overflow: auto; }

.admin-nav-link { display: inline-flex; align-items: center; min-height: 34px; padding: 0 12px; border: 1px solid rgba(15, 114, 89, .24); border-radius: 999px; color: var(--green-dark); background: var(--green-pale); font-size: 13px; font-weight: 700; }
.admin-nav-link:hover { border-color: var(--coral); color: var(--coral); background: #fff8f3; }
.admin-nav-link[hidden] { display: none !important; }
.admin-page { width: min(1320px, calc(100% - 48px)); margin: 0 auto; padding: 56px 0 80px; }
.admin-page-hero { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; padding: 30px 34px; border: 1px solid #d8e0db; border-radius: 18px; background: linear-gradient(135deg, #fffdf8, #f1f7f3); box-shadow: 0 18px 50px rgba(31, 63, 53, .08); }
.admin-page-hero h1 { margin: 8px 0 0; color: #17221f; font-size: clamp(30px, 4vw, 48px); letter-spacing: -.04em; }
.admin-page-hero p { max-width: 660px; margin: 12px 0 0; color: #687570; font-size: 16px; line-height: 1.65; }
.admin-page-kicker { color: var(--coral); font-size: 12px; font-weight: 800; letter-spacing: .16em; }
.admin-page-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; }
.admin-page-actions button, .admin-page-actions a { min-height: 40px; padding: 0 14px; border: 1px solid #d8e0db; border-radius: 8px; color: #44514d; background: #fff; font-weight: 700; cursor: pointer; }
.admin-page-actions button.primary { border-color: #17221f; color: #fff; background: #17221f; }
.admin-page-actions button:hover, .admin-page-actions a:hover { border-color: var(--coral); color: var(--coral); }
.admin-page-actions button.primary:hover { color: #fff; background: #273a34; }
.admin-page-status { min-height: 22px; margin: 16px 2px 0; color: #687570; font-size: 14px; }
.admin-page-status.error { color: #b33e2e; }
.admin-page-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 24px 0; }
.admin-page-metric { padding: 18px 20px; border: 1px solid #d8e0db; border-radius: 12px; background: #fff; }
.admin-page-metric span { display: block; color: #687570; font-size: 13px; }
.admin-page-metric strong { display: block; margin-top: 8px; color: #17221f; font-size: 28px; letter-spacing: -.03em; }
.admin-page-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(340px, .85fr); gap: 18px; align-items: start; }
.admin-page-panel { min-width: 0; padding: 22px; border: 1px solid #d8e0db; border-radius: 14px; background: #fffdf8; }
.admin-page-panel h2 { margin: 0; color: #17221f; font-size: 19px; }
.admin-page-panel-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.admin-page-panel-heading p { margin: 6px 0 0; color: #687570; font-size: 13px; line-height: 1.5; }
.admin-page-concurrency-panel { margin: 18px 0; }
.admin-page-concurrency-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-top: 16px; }
.admin-page-concurrency-metrics .admin-page-metric { padding: 13px 15px; background: #f7f8f4; }
.admin-page-concurrency-metrics .admin-page-metric strong { margin-top: 4px; font-size: 22px; }
.admin-page-concurrency-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 18px; }
.admin-page-concurrency-columns h3 { margin: 0 0 8px; color: #263b34; font-size: 14px; }
.admin-page-task-queue { margin-top: 18px; }
.admin-page-task-queue h3 { margin: 0 0 8px; color: #263b34; font-size: 14px; }
.admin-page-trend-panel { margin: 18px 0; }
.admin-page-trend-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-top: 16px; }
.admin-page-trend-metrics .admin-page-metric { padding: 13px 15px; background: #f7f8f4; }
.admin-page-trend-metrics .admin-page-metric strong { margin-top: 4px; font-size: 20px; }
.admin-page-trend-columns { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 18px; }
.admin-page-trend-columns h3 { margin: 0 0 8px; color: #263b34; font-size: 14px; }
.admin-page-trend-list { display: grid; gap: 6px; max-height: 210px; overflow: auto; }
.admin-page-trend-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: baseline; padding: 8px 10px; border-left: 3px solid #9bb7ac; border-radius: 5px; background: #f4f1ea; }
.admin-page-trend-row strong { overflow: hidden; color: #263b34; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.admin-page-trend-row span { color: #687570; font-size: 12px; white-space: nowrap; }
.admin-page-queue-list { display: grid; gap: 6px; max-height: 190px; overflow: auto; }
.admin-page-queue-row { display: grid; gap: 2px; padding: 9px 10px; border-left: 3px solid #9bb7ac; border-radius: 5px; background: #f4f1ea; }
.admin-page-queue-row strong { overflow: hidden; color: #263b34; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.admin-page-queue-row span { color: #687570; font-size: 12px; line-height: 1.4; overflow-wrap: anywhere; }
.admin-page-toolbar { display: flex; flex-wrap: wrap; gap: 8px; margin: 16px 0; }
.admin-page-task-search { display: grid; gap: 8px; margin: 16px 0; }
.admin-page-task-search label { font-size: 15px; font-weight: 600; }
.admin-page-task-search > div { display: flex; flex-wrap: wrap; gap: 8px; }
.admin-page-task-search input { flex: 1 1 180px; min-width: 0; min-height: 40px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 7px; background: var(--paper); color: var(--ink); font-size: 15px; }
.admin-page-task-search button { min-height: 40px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 7px; background: var(--green-pale); color: var(--green-dark); cursor: pointer; }
.admin-page-task-search small { color: var(--muted); font-size: 13px; line-height: 1.5; }
.admin-page-job .admin-page-task-id { font: 13px/1.5 ui-monospace, monospace; overflow-wrap: anywhere; }
.admin-page-op details { margin-top: 8px; font-size: 14px; }
.admin-page-op summary { cursor: pointer; color: var(--green-dark); }
.admin-page-op pre { max-height: 360px; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; font-size: 13px; }
.admin-page-toolbar select { min-height: 38px; padding: 0 10px; border: 1px solid #d8e0db; border-radius: 7px; color: #44514d; background: #f4f1ea; }
.admin-page-list { display: grid; max-height: 640px; gap: 8px; overflow: auto; }
.admin-page-job { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; width: 100%; padding: 14px; border: 1px solid #d8e0db; border-radius: 9px; color: #17221f; background: #f7f8f4; cursor: pointer; text-align: left; }
.admin-page-job:hover, .admin-page-job.active { border-color: var(--coral); background: #fff8f3; }
.admin-page-job strong { display: block; overflow: hidden; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.admin-page-job small { display: block; margin-top: 5px; color: #687570; font-size: 12px; line-height: 1.4; }
.admin-page-job-state { align-self: start; color: #21834b; font-size: 12px; font-weight: 800; }
.admin-page-job.failed .admin-page-job-state { color: #b33e2e; }
.admin-page-detail { min-height: 280px; margin-top: 16px; padding: 14px; border: 1px solid #d8e0db; border-radius: 9px; background: #f4f1ea; }
.admin-page-detail pre { max-height: 600px; margin: 0; color: #44514d; font: 12px/1.55 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; white-space: pre-wrap; overflow: auto; }
.admin-page-ops { display: grid; max-height: 690px; gap: 7px; margin-top: 16px; overflow: auto; }
.admin-page-op { padding: 11px 12px; border-left: 3px solid #9bb7ac; border-radius: 6px; background: #f4f1ea; }
.admin-page-op.failed, .admin-page-op.error { border-left-color: var(--coral); }
.admin-page-op strong, .admin-page-op span, .admin-page-op small { display: block; }
.admin-page-op strong { color: #263b34; font-size: 13px; }
.admin-page-op span { margin-top: 4px; color: #687570; font-size: 12px; }
.admin-page-op small { margin-top: 4px; color: #b33e2e; font-size: 12px; line-height: 1.45; }
.admin-page-empty { padding: 24px 4px; color: #687570; font-size: 14px; }
@media (max-width: 840px) {
  .admin-page { width: min(100% - 24px, 680px); padding-top: 28px; }
  .admin-page-hero { display: block; padding: 24px; }
  .admin-page-actions { justify-content: flex-start; margin-top: 18px; }
  .admin-page-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-page-concurrency-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-page-concurrency-columns { grid-template-columns: 1fr; }
  .admin-page-trend-metrics, .admin-page-trend-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-page-grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .admin-page-trend-metrics, .admin-page-trend-columns { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .auth-modal { padding: 8px; place-items: start center; }
  .auth-dialog { max-height: calc(100dvh - 16px); padding: 28px 22px 22px; border-radius: 14px; }
  .admin-audit-modal { padding: 8px; place-items: start center; }
  .admin-audit-dialog { max-height: calc(100dvh - 16px); padding: 22px 16px 18px; }
}
.artifact-variable-list { display: grid; gap: 8px; max-height: 190px; overflow-y: auto; }
.artifact-variable-list label { display: flex; align-items: center; gap: 8px; font-size: 14px; }
.artifact-variable-list input[type="checkbox"] { width: 18px; height: 18px; min-height: 18px; padding: 0; flex: 0 0 18px; }
.artifact-config-fields > label { align-content: start; }
/* Homepage is deliberately isolated from the writing / analysis workspaces. */
.ph-home {
  --home-green: #087958;
  --home-deep: #056347;
  --home-ink: #182924;
  --home-muted: #687c73;
  --home-mint: #e9fbf3;
  --home-white: #fff;
  color: var(--home-ink);
  background: var(--home-white);
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 16px;
  line-height: 1.65;
  isolation: isolate;
}
.home-page-active { background: #fff; }
.home-page-active .site-header { background: rgba(255,255,255,.97); border-bottom: 1px solid #edf3ef; padding-inline: max(28px, calc((100vw - 1400px) / 2)); box-shadow: none; }
.home-page-active .brand { font-size: 26px; letter-spacing: -1px; color: #182924; }
.home-page-active .brand > span:last-child > span { color: #087958; }
.home-page-active .brand-mark { background: #056347; color: #fff; border-radius: 10px; width: 42px; height: 42px; box-shadow: none; font-family: Georgia, serif; font-size: 32px; }
.home-page-active .desktop-nav { gap: clamp(18px, 2.2vw, 34px); }
.home-page-active .desktop-nav a { color: #687c73; font-size: 16px; font-weight: 600; white-space: nowrap; }
.home-page-active .desktop-nav a.active, .home-page-active .desktop-nav a:hover { color: #056347; }
.home-page-active .desktop-nav a.active::after { background: #087958; }
.home-page-active .login-button { background: #056347; color: #fff; border-radius: 8px; padding: 11px 24px; font-size: 16px; box-shadow: none; }
.ph-home [hidden] { display: none !important; }
.ph-home a { text-decoration: none; }
.ph-home :is(a, button):focus-visible { outline: 3px solid #087958; outline-offset: 5px; }
.ph-home-container { width: min(1400px, calc(100% - 64px)); margin-inline: auto; }
.ph-home-hero { position: relative; padding: 56px 0 28px; background: radial-gradient(ellipse at 64% 38%, #c9f8e8 0, #eafbf5 34%, transparent 66%), linear-gradient(180deg, #f5fcfa 0, #fff 96%); }
.ph-home-grid { display: grid; grid-template-columns: minmax(0, 1.22fr) minmax(0, 1.03fr) minmax(280px, .76fr); gap: 26px; align-items: center; }
.ph-home-copy { padding-bottom: 8px; position: relative; z-index: 2; animation: ph-home-enter .65s both; }
.ph-home-eyebrow { display: inline-flex; align-items: center; gap: 9px; color: var(--home-deep); background: #dff7ec; border: 1px solid #cef0df; border-radius: 999px; padding: 5px 14px; margin: 0 0 26px; font-size: 14px; font-weight: 600; letter-spacing: .03em; }
.ph-home-eyebrow > span { font-size: 22px; line-height: 1; }
.ph-home #homeTitle { color: var(--home-ink); font-family: inherit; font-size: clamp(40px, 4.15vw, 66px); line-height: 1.24; letter-spacing: -.05em; font-weight: 800; margin: 0 0 22px; max-width: none; text-wrap: nowrap; }
.ph-home #homeTitle > span { display: block; color: var(--home-deep); background: none; -webkit-text-fill-color: currentColor; }
.ph-home-lead { margin: 0; color: var(--home-muted); font-size: 17px; line-height: 1.85; }
.ph-home-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 30px; }
.ph-home-button { display: inline-flex; justify-content: center; align-items: center; gap: 16px; min-height: 52px; padding: 12px 23px; border-radius: 8px; border: 1px solid transparent; font-family: inherit; font-size: 16px; line-height: 1.4; font-weight: 650; cursor: pointer; transition: background .18s ease, box-shadow .18s ease, transform .18s ease; }
.ph-home-primary { background: var(--home-deep); color: white; box-shadow: 0 5px 12px #055b4012; }
.ph-home-primary:hover { background: #084e3b; box-shadow: 0 7px 16px #055b4024; transform: translateY(-2px); }
.ph-home-primary > span { font-size: 22px; font-weight: 400; }
.ph-home-secondary { background: #ffffffc9; color: var(--home-ink); border-color: #dfe9e5; }
.ph-home-secondary:hover { background: white; border-color: #98c5b5; }
.ph-home-play { font-size: 21px; color: var(--home-green); line-height: 1; }
.ph-home-assurances { list-style: none; padding: 0; margin: 26px 0 0; display: flex; flex-wrap: wrap; gap: 10px 18px; font-size: 12px; color: var(--home-muted); }
.ph-home-assurances li { display: inline-flex; align-items: center; gap: 7px; }
.ph-home-assurances li > span { display: grid; place-items: center; width: 19px; height: 19px; background: #c5f6df; color: var(--home-deep); border-radius: 50%; font-size: 12px; font-weight: 750; }
.ph-home-art { position: relative; height: 420px; min-width: 0; animation: ph-home-enter .8s .08s both; }
.ph-home-orbit { position: absolute; width: 118%; height: 240px; top: 106px; left: -11%; border: 2px solid #69debc; border-top-color: transparent; border-radius: 50%; transform: rotate(-19deg); }
.ph-home-orbit::before { content: ""; position: absolute; bottom: 50px; left: 9px; width: 17px; height: 17px; border-radius: 50%; background: radial-gradient(circle at 30% 25%, #b5ffe1, #10b187 55%, #026747); box-shadow: 0 3px 10px #129b7740; }
.ph-home-spark { position: absolute; right: 27%; top: 0; color: #0aa376; font-size: 52px; text-shadow: 0 0 24px #fff; animation: ph-home-float 6s ease-in-out infinite; }
.ph-home-editor { position: absolute; top: 65px; left: 1%; width: 88%; height: 280px; background: #fbfffd; border: 1px solid #e2f3ea; border-radius: 16px; box-shadow: 0 20px 45px #0b715f12; transform: rotate(-3deg); overflow: hidden; }
.ph-home-editor-bar { display: flex; align-items: center; gap: 5px; height: 40px; padding-inline: 16px; background: #f3faf7; border-bottom: 1px solid #e6f2ec; }
.ph-home-editor-bar > i { width: 7px; height: 7px; border-radius: 50%; background: #6bc5a7; }
.ph-home-editor-bar > i:nth-child(2) { background: #a7dbc7; }
.ph-home-editor-bar > i:nth-child(3) { background: #cfeade; }
.ph-home-editor-bar > span { margin-left: auto; color: #8fa99c; font-size: 9px; letter-spacing: .06em; }
.ph-home-editor-body { display: flex; padding: 18px 12px; gap: 20px; }
.ph-home-editor-nav { flex: 0 0 104px; display: grid; gap: 7px; font-size: 12px; color: #70877b; font-weight: 600; }
.ph-home-editor-nav > div { padding: 8px 7px; display: flex; gap: 7px; align-items: center; }
.ph-home-editor-nav > div.selected { background: #dbf7e9; color: #06734f; border-radius: 5px; }
.ph-home-editor-nav > div > span { font-size: 17px; line-height: 1; }
.ph-home-editor-lines { flex: 1; padding-top: 12px; }
.ph-home :is(.ph-home-editor-lines, .ph-home-paper-lines) > i { display: block; height: 7px; border-radius: 5px; background: #e9f0ed; margin-bottom: 13px; }
.ph-home-editor-lines > i:nth-child(2) { width: 70%; }
.ph-home-paper { position: absolute; width: 66%; height: 290px; top: 117px; left: 33%; padding: 23px 20px; background: white; border: 1px solid #e8f2ed; border-radius: 6px 12px 12px 6px; box-shadow: 0 22px 42px #2b89611a; transform: rotate(4deg); }
.ph-home-paper-meta { font-size: 8px; font-weight: 650; letter-spacing: .12em; color: #94ac9d; display: flex; justify-content: space-between; }
.ph-home-paper > h2 { font-family: "Songti SC", "STSong", "SimSun", Georgia, serif; font-size: 21px; font-weight: 600; line-height: 1.6; color: #214e3e; margin: 21px 0 16px; }
.ph-home-paper-rule { width: 28px; height: 3px; background: #24a675; margin-bottom: 15px; }
.ph-home-paper > p { font-size: 9px; color: #84958c; margin: 0 0 14px; }
.ph-home-paper-lines > i:nth-child(2n) { width: 78%; }
.ph-home-paper-quote { border-left: 2px solid #40af88; padding-left: 9px; color: #799587; font-size: 9px; margin-top: 16px; }
.ph-home-checklist { position: absolute; right: -6px; top: 58px; display: grid; gap: 10px; padding: 14px 17px; border: 1px solid #e0f3e8; border-radius: 11px; background: #fffffff2; box-shadow: 0 12px 30px #1c745b12; transform: rotate(8deg); font-size: 11px; color: #547265; }
.ph-home-checklist > span { display: flex; align-items: center; gap: 7px; }
.ph-home-checklist i { font-style: normal; width: 14px; height: 14px; display: grid; place-items: center; font-size: 9px; color: white; background: #087958; border-radius: 50%; }
.ph-home-cap { position: absolute; width: 174px; height: auto; right: -29px; bottom: -3px; filter: drop-shadow(0 12px 13px #00563420); transform: rotate(-7deg); }
.ph-home-art-note { position: absolute; left: 0; bottom: -7px; font-size: 10px; color: #81a293; letter-spacing: .07em; }
.ph-home-account { position: relative; background: #fff; border: 1px solid #e3eee7; border-radius: 18px; padding: 25px 24px 20px; text-align: center; box-shadow: 0 16px 45px #0f65460b; animation: ph-home-enter .8s .16s both; }
.ph-home-wechat-panel { margin: 0 0 12px; }
.ph-home-account h2 { font-size: 22px; font-weight: 700; line-height: 1.4; margin: 0 0 10px; color: var(--home-ink); overflow-wrap: anywhere; }
.ph-home-account .ph-home-button { width: 100%; min-height: 47px; padding: 11px 12px; }
.ph-home-account-divider { display: flex; align-items: center; gap: 9px; font-size: 14px; color: var(--home-muted); margin: 0 0 18px; }
.ph-home-account-divider::before, .ph-home-account-divider::after { content: ""; height: 1px; background: #edf2ef; flex: 1; }
.ph-home-wechat { display: inline-flex; align-items: center; justify-content: center; gap: 8px; background: none; border: 0; padding: 8px; min-height: 40px; font: inherit; font-size: 14px; color: #167853; border-radius: 6px; cursor: pointer; }
.ph-home-wechat:hover:not(:disabled) { background: #edf8f2; }
.ph-home-wechat:disabled { color: #819187; cursor: not-allowed; }
.ph-home-wechat-qr { display: grid; justify-items: center; gap: 7px; margin: 4px auto 2px; }
.ph-home-wechat-qr img { width: 168px; height: 168px; object-fit: contain; background: #fff; border: 1px solid #e2ece6; border-radius: 8px; }
.ph-home-wechat-status { margin: 12px 0 4px; min-height: 22px; color: var(--home-muted); font-size: 14px; line-height: 1.6; }
.ph-home-wechat-terms { display: flex; align-items: flex-start; justify-content: center; gap: 6px; margin: 7px 0; color: var(--home-muted); font-size: 12px; line-height: 1.6; text-align: left; }
.ph-home-wechat-terms input { margin-top: 3px; accent-color: #087958; }
.ph-home-wechat-terms a { color: var(--home-deep); text-decoration: underline; text-underline-offset: 2px; }
.ph-home-benefits { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 40px; padding: 25px 12px; background: #fff; border: 1px solid #edf3ef; border-radius: 16px; box-shadow: 0 12px 40px #0d3e2e08; }
.ph-home-benefit { display: flex; align-items: center; gap: 18px; padding-inline: 24px; position: relative; }
.ph-home-benefit + .ph-home-benefit::before { content: ""; position: absolute; left: 0; top: 12px; bottom: 12px; width: 1px; background: #e9f0ec; }
.ph-home-benefit-icon { flex: 0 0 62px; height: 62px; border-radius: 50%; display: grid; place-items: center; background: #eafaf3; color: #087958; }
.ph-home-benefit-icon > svg { width: 29px; height: 29px; }
.ph-home-benefit h2 { font-size: 18px; font-weight: 700; margin: 0 0 4px; color: var(--home-ink); }
.ph-home-benefit p { font-size: 13px; line-height: 1.6; color: var(--home-muted); margin: 0; }
.ph-home-process { padding-top: 28px; padding-bottom: 30px; scroll-margin-top: 100px; }
.ph-home-section-heading { text-align: center; margin-bottom: 27px; }
.ph-home-section-heading > p { color: var(--home-muted); margin: 0 0 8px; font-size: 14px; }
.ph-home-section-heading > h2 { font-size: 30px; line-height: 1.3; font-weight: 750; letter-spacing: -.03em; color: var(--home-ink); margin: 0; }
.ph-home-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); list-style: none; padding: 0; margin: 0; gap: 28px; }
.ph-home-steps > li { display: flex; gap: 19px; padding: 24px; background: #fcfefd; border: 1px solid #dfede5; border-radius: 10px; position: relative; }
.ph-home-steps > li:not(:last-child)::after { content: "›"; position: absolute; right: -23px; top: calc(50% - 22px); font-size: 32px; color: #8ac5ac; font-weight: 300; }
.ph-home-step-number { font-size: 15px; line-height: 27px; font-weight: 700; color: #0a815a; font-variant-numeric: tabular-nums; }
.ph-home-steps h3 { font-size: 18px; line-height: 1.5; color: var(--home-ink); margin: 0 0 8px; }
.ph-home-steps p { font-size: 14px; line-height: 1.75; color: var(--home-muted); margin: 0 0 17px; }
.ph-home-steps li > div > span { color: #228062; font-size: 12px; }
.ph-home-endnote { display: flex; align-items: center; gap: 20px; border-top: 1px solid #eaf1ed; margin-top: 42px; padding-top: 24px; font-size: 13px; }
.ph-home-endnote p { margin: 0; color: #7b8d81; }
.ph-home-endnote a { margin-left: auto; color: #086445; font-weight: 600; }
@keyframes ph-home-enter { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@keyframes ph-home-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
@media (max-width: 1239px) {
  .ph-home-grid { grid-template-columns: 1.1fr 1fr; gap: 24px; }
  .ph-home-copy { padding-left: 12px; }
  .ph-home #homeTitle { font-size: clamp(38px, 5.3vw, 62px); }
  .ph-home-art { max-width: 425px; width: 100%; justify-self: center; margin-right: 20px; }
  .ph-home-orbit { width: 102%; left: -1%; }
  .ph-home-account { grid-column: 1 / -1; display: block; padding: 24px 32px; text-align: center; }
  .ph-home-account h2 { max-width: 520px; margin-inline: auto; }
  .ph-home-account #homeAccountAction { max-width: 340px; }
  .ph-home-account-divider { display: flex; margin-top: 0; }
  .ph-home-wechat-panel { max-width: 320px; margin-inline: auto; }
  .ph-home-benefit { gap: 12px; padding-inline: 15px; }
  .ph-home-benefit-icon { flex-basis: 48px; height: 48px; }
  .ph-home-benefit p { font-size: 12px; }
}
@media (max-width: 960px) {
  .ph-home-container { width: calc(100% - 40px); }
  .ph-home-hero { padding-top: 32px; }
  .ph-home-grid { gap: 20px; }
  .ph-home-copy { padding-left: 0; }
  .ph-home-art { transform: scale(.9); transform-origin: center; margin-right: 0; }
  .ph-home-desktop-break { display: none; }
  .ph-home-actions { gap: 10px; }
  .ph-home-actions .ph-home-button { padding-inline: 16px; }
  .ph-home-lead { font-size: 16px; }
  .ph-home-benefits { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 0; }
  .ph-home-benefit:nth-child(3)::before { display: none; }
  .ph-home-steps { gap: 20px; }
  .ph-home-steps > li { padding: 20px 15px; gap: 12px; }
  .ph-home-steps > li:not(:last-child)::after { right: -17px; font-size: 25px; }
}
@media (max-width: 640px) {
  .home-page-active .site-header { padding-inline: 18px; }
  .home-page-active .brand { font-size: 22px; }
  .home-page-active .brand-mark { width: 33px; height: 35px; font-size: 27px; border-radius: 7px; }
  .home-page-active .login-button { font-size: 14px; padding: 9px 14px; max-width: 130px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .ph-home-container { width: calc(100% - 36px); }
  .ph-home-hero { padding-top: 32px; overflow: clip; }
  .ph-home-grid { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .ph-home-copy { text-align: center; }
  .ph-home-eyebrow { font-size: 12px; margin-bottom: 23px; }
  .ph-home #homeTitle { font-size: clamp(35px, 9vw, 54px); margin-bottom: 18px; }
  .ph-home-lead { font-size: 15px; max-width: 360px; margin-inline: auto; }
  .ph-home-actions { justify-content: center; margin-top: 24px; }
  .ph-home-actions .ph-home-button { font-size: 14px; padding-inline: 18px; min-height: 48px; gap: 10px; }
  .ph-home-assurances { justify-content: center; gap: 8px 12px; font-size: 11px; margin-top: 20px; }
  .ph-home-art { width: min(340px, 94%); height: 390px; margin: 8px auto 16px; }
  .ph-home-editor { top: 46px; }
  .ph-home-paper { top: 93px; }
  .ph-home-checklist { top: 31px; right: -2px; }
  .ph-home-spark { top: -12px; right: 32%; }
  .ph-home-paper > h2 { font-size: clamp(15px, 4.9vw, 19px); }
  .ph-home-cap { width: 155px; right: -16px; bottom: -8px; }
  .ph-home-art-note { bottom: -7px; }
  .ph-home-account { display: block; padding: 25px 24px; text-align: center; }
  .ph-home-account h2 { font-size: 22px; margin: 10px 0; }
  .ph-home-account #homeAccountAction { max-width: 340px; }
  .ph-home-account-divider { display: flex; margin-bottom: 6px; }
  .ph-home-wechat-qr img { width: 154px; height: 154px; }
  .ph-home-benefits { margin-top: 22px; gap: 20px 0; padding: 20px 4px; border-radius: 12px; }
  .ph-home-benefit { flex-direction: column; text-align: center; gap: 9px; padding-inline: 7px; }
  .ph-home-benefit-icon { flex-basis: auto; width: 48px; }
  .ph-home-benefit h2 { font-size: 16px; }
  .ph-home-benefit p { font-size: 11px; }
  .ph-home-process { padding-top: 18px; }
  .ph-home-section-heading > h2 { font-size: 27px; }
  .ph-home-section-heading > p { font-size: 12px; }
  .ph-home-steps { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .ph-home-steps > li { padding: 22px; gap: 18px; }
  .ph-home-steps > li:not(:last-child)::after { display: none; }
  .ph-home-steps p { margin-bottom: 10px; }
  .ph-home-endnote { flex-wrap: wrap; justify-content: center; gap: 8px 18px; text-align: center; margin-top: 28px; }
  .ph-home-endnote p { flex-basis: 100%; font-size: 12px; }
  .ph-home-endnote a { margin: 6px auto 0; }
}
@media (prefers-reduced-motion: reduce) {
  .ph-home, .ph-home *, .ph-home *::before, .ph-home *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
@media (max-width: 380px) {
  .home-page-active .site-header { padding-inline: 12px; gap: 8px; }
  .home-page-active .brand { font-size: 20px; gap: 7px; }
  .home-page-active .header-actions { gap: 8px; }
  .home-page-active .login-button { max-width: 98px; padding: 9px; font-size: 13px; }
  .home-page-active .menu-button { width: 34px; height: 36px; padding: 8px; }
}
/* Scoped shared shell: do not restyle document readers or workspace footers. */
.site-footer {
  --site-info-green: #056347;
  --site-info-ink: #203b32;
  --site-info-muted: #64776e;
  --site-info-line: #dce7e1;
  display: block;
  padding: 0;
  border-top: 1px solid var(--site-info-line);
  background: #f5f9f6;
  color: var(--site-info-ink);
  font-size: 16px;
  line-height: 1.7;
  text-align: left;
}
.site-footer-grid, .site-footer-bottom { width: min(1120px, calc(100% - 64px)); margin-inline: auto; }
.site-footer-grid { display: grid; grid-template-columns: 1fr .9fr .9fr 1.4fr; gap: 32px; padding-block: 48px 36px; }
.site-footer-column { min-width: 0; }
.site-footer p, .site-footer p:last-child { justify-self: start; }
.site-footer .footer-brand { display: inline-flex; gap: 10px; color: var(--site-info-ink); font-size: 25px; letter-spacing: -.7px; }
.site-footer .footer-brand > span:last-child > span { color: var(--site-info-green); }
.site-footer .footer-brand .brand-mark { width: 34px; height: 36px; color: #fff; background: var(--site-info-green); border-radius: 7px; box-shadow: none; font-family: Georgia, serif; font-size: 28px; }
.site-footer-column h2 { margin: 3px 0 18px; color: var(--site-info-ink); font-family: inherit; font-size: 18px; font-weight: 650; line-height: 1.6; }
.site-footer .site-footer-tagline { margin: 13px 0 18px; color: var(--site-info-muted); font-size: 14px; }
.site-footer-links { display: grid; gap: 7px; margin: 0; padding: 0; list-style: none; }
.site-footer-links :is(a, button), .site-footer-contact-link { display: inline-flex; align-items: center; gap: 7px; min-height: 32px; padding: 0; border: 0; border-radius: 3px; background: transparent; color: var(--site-info-muted); font: inherit; text-align: left; text-decoration: none; cursor: pointer; transition: color 150ms ease; }
.site-footer-links :is(a, button):hover, .site-footer-contact-link:hover { color: var(--site-info-green); text-decoration: underline; text-underline-offset: 5px; }
.site-footer-links a > span[aria-hidden] { font-size: 14px; }
.site-footer-note { max-width: 210px; margin: 17px 0 0; color: var(--site-info-muted); font-size: 13px; }
.site-footer .site-footer-company { margin: 0 0 17px; color: var(--site-info-ink); font-size: 17px; font-weight: 500; overflow-wrap: anywhere; }
.site-footer-qq { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; }
.site-footer-qq > span { font-size: 13px; color: var(--site-info-muted); }
.site-footer-qq strong { color: var(--site-info-ink); font-size: 18px; font-weight: 550; font-variant-numeric: tabular-nums; letter-spacing: .02em; }
.site-footer-qq > button, .site-info-contact-card > button { padding: 3px 10px; border: 1px solid #c9dcd1; border-radius: 5px; background: #fff; color: #056347; font: inherit; font-size: 13px; cursor: pointer; }
.site-footer-qq > button:hover, .site-info-contact-card > button:hover { border-color: #056347; background: #ecf5ef; }
.site-footer .site-copy-status, .site-info-article .site-copy-status { min-height: 0; margin: 8px 0; color: #056347; font-size: 13px; line-height: 1.6; overflow-wrap: anywhere; }
.site-copy-status:empty { display: none; }
.site-footer-contact-link { margin-top: 16px; color: var(--site-info-green); font-size: 14px; }
.site-footer-bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 24px; padding-block: 20px; border-top: 1px solid var(--site-info-line); color: var(--site-info-muted); font-size: 13px; }
.site-footer-bottom > p { margin: 0; }
.site-footer-legal { display: flex; flex-wrap: wrap; gap: 10px 20px; width: 100%; }
.site-footer-legal a { color: #536e60; text-decoration: none; }
.site-footer-legal a:hover { text-decoration: underline; text-underline-offset: 4px; }
.site-footer-legal [hidden], .site-info-sidebar [hidden] { display: none !important; }
.site-info-version { color: #64776e; font-size: 13px; }
.site-footer :is(a, button):focus-visible, .site-information :is(a, button, summary):focus-visible { outline: 3px solid #3d9b79; outline-offset: 4px; }
.information-page { background: #f5f8f6; }
.site-information { width: min(1120px, calc(100% - 64px)); margin-inline: auto; padding-block: 28px 64px; color: #203b32; font: 17px/1.85 -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif; }
.site-info-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 26px; color: #6b8074; font-size: 14px; }
.site-info-breadcrumb a { color: #426554; text-decoration: none; }
.site-info-breadcrumb a:hover { color: #056347; text-decoration: underline; text-underline-offset: 4px; }
.site-info-breadcrumb > span:last-child { color: #203b32; }
.site-info-layout { display: grid; grid-template-columns: 208px minmax(0, 1fr); gap: 36px; align-items: start; }
.site-info-sidebar { position: sticky; top: 112px; padding: 10px 0; }
.site-info-sidebar-title { margin: 0 0 10px 14px; color: #6b8074; font-size: 13px; font-weight: 600; }
.site-info-sidebar > nav { display: grid; gap: 5px; margin-bottom: 26px; }
.site-info-sidebar a { display: block; padding: 10px 14px; border-left: 3px solid transparent; border-radius: 0 6px 6px 0; color: #536e60; font-size: 16px; line-height: 1.5; text-decoration: none; transition: color 150ms ease, background 150ms ease; }
.site-info-sidebar a:hover { color: #056347; background: #edf4ef; }
.site-info-sidebar a[aria-current="page"] { border-left-color: #087958; color: #056347; background: #e6f1ea; font-weight: 650; }
.site-info-article { min-width: 0; min-height: 500px; padding: 36px 42px 42px; border: 1px solid #dce7e1; border-radius: 10px; background: #fff; overflow-wrap: anywhere; }
.site-info-page-heading { margin-bottom: 28px; padding-bottom: 23px; border-bottom: 1px solid #e2ece5; }
.site-info-page-heading > span { color: #6b8074; font-size: 13px; letter-spacing: .02em; }
.site-info-page-heading h1 { max-width: none; margin: 10px 0 0; color: #203b32; font-family: inherit; font-size: 32px; line-height: 1.35; letter-spacing: -.02em; font-weight: 700; }
.site-info-body { min-height: 0; }
.site-info-body [hidden] { display: none !important; }
.site-info-body p { margin: 0 0 18px; }
.site-info-body .site-info-lead { color: #203b32; font-size: 21px; line-height: 1.7; font-weight: 600; }
.site-info-body h3 { margin: 25px 0 9px; color: #203b32; font-size: 18px; font-weight: 650; }
.site-info-body ul { padding-left: 22px; margin: 0 0 22px; }
.site-info-body li + li { margin-top: 6px; }
.site-info-steps { margin: 0; padding-left: 23px; }
.site-info-steps li { padding-left: 8px; }
.site-info-steps li::marker { color: #056347; font-weight: 650; }
.site-info-body .site-info-note { padding: 15px 18px; border-left: 3px solid #9cc7b0; border-radius: 0 5px 5px 0; background: #f3f8f5; color: #536e60; font-size: 14px; }
.site-info-body details { padding: 17px 0; border-bottom: 1px solid #e3ece6; }
.site-info-body details:first-child { padding-top: 0; }
.site-info-body summary { padding-right: 8px; color: #203b32; font-size: 17px; font-weight: 600; cursor: pointer; }
.site-info-body summary::marker { color: #056347; }
.site-info-body details p { margin: 12px 0 0; color: #536e60; }
.site-info-contact-card { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin-bottom: 12px; padding: 20px; border: 1px solid #d4e5da; border-radius: 8px; background: #f5f9f6; }
.site-info-contact-card > span { font-size: 14px; color: #536e60; }
.site-info-contact-card > strong { color: #056347; font-size: 23px; font-weight: 600; letter-spacing: .03em; }
.site-info-contact-card > button { min-height: 36px; margin-left: auto; font-size: 14px; }
.site-info-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
@media (max-width: 960px) {
  .site-footer-grid { grid-template-columns: 1fr 1fr; gap: 32px 48px; padding-block: 36px; }
  .site-info-layout { grid-template-columns: 170px minmax(0, 1fr); gap: 22px; }
  .site-info-article { padding: 28px; }
}
@media (max-width: 600px) {
  .site-footer-grid, .site-footer-bottom { width: calc(100% - 40px); }
  .site-footer-grid { gap: 28px 20px; padding-block: 30px; }
  .site-footer-contact { grid-column: 1 / -1; padding-top: 24px; border-top: 1px solid var(--site-info-line); }
  .site-footer-column h2 { margin-bottom: 12px; font-size: 17px; }
  .site-footer-column:first-child { grid-column: 1 / -1; }
  .site-footer-column:first-child, .site-footer-contact { text-align: center; }
  .site-footer-column:first-child .site-footer-links { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px 24px; }
  .site-footer .site-footer-tagline { margin-block: 12px; justify-self: center; }
  .site-footer-qq { justify-content: center; }
  .site-footer-links :is(a, button) { min-height: 38px; }
  .site-footer-bottom { justify-content: center; text-align: center; font-size: 12px; padding-block: 18px; }
  .site-information { width: calc(100% - 32px); padding-block: 20px 36px; font-size: 16px; }
  .site-info-breadcrumb { gap: 7px; font-size: 13px; margin-bottom: 18px; }
  .site-info-layout { grid-template-columns: minmax(0, 1fr); gap: 15px; }
  .site-info-sidebar { position: static; padding: 0; }
  .site-info-sidebar-title { margin: 0 0 8px; }
  .site-info-sidebar > nav { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 16px; }
  .site-info-sidebar a { padding: 10px 12px; border: 1px solid #dce7e1; border-radius: 6px; background: #fff; font-size: 14px; }
  .site-info-sidebar a[aria-current="page"] { border-color: #087958; }
  .site-info-article { min-height: 380px; padding: 24px 20px; }
  .site-info-page-heading { margin-bottom: 22px; padding-bottom: 18px; }
  .site-info-page-heading h1 { font-size: 27px; }
  .site-info-body .site-info-lead { font-size: 19px; }
  .site-info-contact-card { gap: 10px; padding: 15px; }
  .site-info-contact-card > strong { font-size: 21px; }
}
@media (prefers-reduced-motion: reduce) { .site-footer-links :is(a, button), .site-info-sidebar a { transition: none; } }
/* Shared with the server-rendered legal pages. Scoped: never alter draft prose. */
.ph-site-markdown { min-width: 0; color: #203b32; font: 16px/1.85 -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif; overflow-wrap: anywhere; }
.ph-site-markdown :is(h2,h3,h4,h5,h6) { max-width: none; color: #203b32; font-family: inherit; line-height: 1.5; letter-spacing: 0; margin: 28px 0 12px; }
.ph-site-markdown h2 { font-size: 25px; }
.ph-site-markdown h3 { font-size: 21px; }
.ph-site-markdown h4 { font-size: 18px; }
.ph-site-markdown :is(h5,h6) { font-size: 16px; }
.ph-site-markdown > :first-child { margin-top: 0; }
.ph-site-markdown p { margin: 0 0 16px; }
.ph-site-markdown :is(ul,ol) { padding-left: 26px; margin: 12px 0 20px; list-style-position: outside; }
.ph-site-markdown li { margin: 5px 0; }
.ph-site-markdown li > :is(ul,ol) { margin-block: 6px; }
.ph-site-markdown li > p { margin-bottom: 6px; }
.ph-site-markdown a { color: #056347; text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.ph-site-markdown a:focus-visible, .ph-site-markdown .ph-md-table:focus-visible { outline: 3px solid #3d9b79; outline-offset: 3px; }
.ph-site-markdown blockquote { margin: 20px 0; padding: 14px 20px; border-left: 3px solid #9cc7b0; background: #f3f8f5; color: #536e60; }
.ph-site-markdown blockquote > :last-child { margin-bottom: 0; }
.ph-site-markdown hr { border: 0; border-top: 1px solid #dce7e1; margin: 28px 0; }
.ph-site-markdown :is(code,pre) { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 14px; }
.ph-site-markdown :not(pre) > code { padding: 2px 5px; border-radius: 4px; background: #eef4f0; white-space: break-spaces; overflow-wrap: anywhere; }
.ph-site-markdown pre { min-width: 0; max-width: 100%; box-sizing: border-box; margin: 20px 0; padding: 16px; overflow: auto; border: 1px solid #dce7e1; border-radius: 6px; background: #f4f8f6; color: #203b32; line-height: 1.65; white-space: pre; }
.ph-site-markdown pre code { white-space: inherit; overflow-wrap: normal; }
.ph-site-markdown .ph-md-table { max-width: 100%; margin: 20px 0; overflow-x: auto; border: 1px solid #dce7e1; border-radius: 6px; }
.ph-site-markdown table { width: 100%; border-collapse: collapse; font-size: 15px; line-height: 1.65; }
.ph-site-markdown :is(th,td) { min-width: 96px; padding: 10px 14px; border: 1px solid #dce7e1; text-align: left; vertical-align: top; }
.ph-site-markdown th { background: #eef5f0; font-weight: 650; }
.ph-site-markdown .ph-md-align-left { text-align: left; }
.ph-site-markdown .ph-md-align-center { text-align: center; }
.ph-site-markdown .ph-md-align-right { text-align: right; }
.ph-site-markdown img { display: block; max-width: 100%; height: auto; margin: 16px 0; object-fit: contain; }
.ph-site-markdown .ph-md-task { list-style: none; }
.ph-site-markdown .ph-md-task input { display: inline-block; width: 16px; height: 16px; min-height: 0; padding: 0; margin: 0 5px 0 -22px; vertical-align: middle; accent-color: #376c5b; }
@media(max-width:600px) { .ph-site-markdown h2 { font-size: 22px; } .ph-site-markdown h3 { font-size: 19px; } .ph-site-markdown :is(th,td) { padding: 9px 12px; } }
@media print { .ph-site-markdown .ph-md-table, .ph-site-markdown pre { overflow: visible; } .ph-site-markdown pre { white-space: pre-wrap; overflow-wrap: anywhere; } }