:root {
  --gzh-shell: #F5FAF8;
  --gzh-panel: #FBFEFC;
  --gzh-text: #11251E;
  --gzh-muted: #718E80;
  --gzh-faint: #8BA396;
  --gzh-line: #D8ECE0;
  --gzh-line-strong: #BFE2CE;
  --gzh-accent: #0D9470;
  --gzh-accent-soft: #E7F7EF;
  --gzh-accent-ink: #0B8565;
  --gzh-control: #F4FAF6;
  --gzh-control-hover: #E7F7EF;
  --gzh-radius: 16px;
  --gzh-topbar: 76px;
}
body { background: radial-gradient(at 15% 0, #E5F6ED 0, transparent 44%), #F5FAF8; font-family: var(--font); }
.gzh-appbar { background: rgba(249, 253, 250, .96); border-color: var(--gzh-line); }
.gzh-appbar-brand { padding: 0 20px; border-color: var(--gzh-line); gap: 10px; }
.gzh-appbar-brand img { width: 30px; height: 30px; border-radius: 8px; }
.gzh-appbar-brand .brand-main { font-size: 25px; letter-spacing: -1px; color: #11251E; }
.gzh-appbar-brand .brand-main span { color: #0D9470; }
.gzh-toolbar, .gzh-inspector { background: rgba(255,255,255,.8); border-color: var(--gzh-line); }
.gzh-toolbar > .gzh-actions { padding-top: 18px; }
.gzh-source, .gzh-group, .gzh-drop, .gzh-inspector-tab, .gzh-upload, .gzh-appbar-button, .gzh-icon-button { border-radius: 12px; }
.gzh-source { border-color: var(--gzh-line); color: #11251E; }
.gzh-stage { border: 1px solid var(--gzh-line); border-radius: 24px; background: #fff; box-shadow: 0 16px 40px rgba(17,90,55,.05); }
.gzh-stage-bar { color: var(--gzh-muted); border-color: var(--gzh-line); border-radius: 24px 24px 0 0; background: #FBFEFC; }
#gzh-content { min-height: 440px; }
#gzh-content:empty::before { content: attr(data-placeholder); display: block; padding: 32px 16px; color: #8BA396; font-size: 15px; line-height: 1.8; pointer-events: none; }
.gzh-import-report[hidden] { display: none !important; }
.gzh-outline-summary { background: #EFFAF3; border-color: #BFE2CE; color: #618574; border-radius: 0 10px 10px 0; }
.gzh-outline-row { grid-template-columns: 42px minmax(0,1fr); text-align: left; }
.gzh-outline-level { color: #0B8565; }
.gzh-outline-row:hover, .gzh-outline-row.active { background: #E7F7EF; }
.gzh-dialog { border-color: var(--gzh-line); border-radius: 24px; }
.gzh-toast { border-radius: 14px; }
.gzh-appbar-button.primary, .gzh-copy, .gzh-mobile-bar .primary { border-radius: 999px; background: #0D9470; color: white; border-color: #0D9470; }
.gzh-appbar-button.primary:hover, .gzh-copy:hover, .gzh-mobile-bar .primary:hover { background: #0B8565; border-color: #0B8565; }
.gzh-mobile-nav { background: #F5FAF8; border-color: var(--gzh-line); }
.gzh-mobile-nav button.active { color: #0B8565; background: #E7F7EF; }
button:focus-visible, input:focus-visible, textarea:focus-visible, [contenteditable="true"]:focus-visible { outline-color: #0D9470; }
.hotai-image-export [hidden] { display: none !important; }
.hotai-export-field { display: grid; gap: 9px; color: var(--gzh-muted); font-size: 13px; }
.hotai-export-field select { min-height: 44px; padding: 10px 14px; border: 1px solid var(--gzh-line); border-radius: 12px; background: white; color: var(--gzh-text); font: inherit; }
#hotaiExportStatus { color: var(--gzh-muted); font-size: 13px; line-height: 1.8; }
#hotaiExportZip { font-size: 12px; align-self: center; white-space: nowrap; }
.hotai-image-export .convert-result-row { padding: 12px; }
@media (max-width: 1240px) {
  .gzh-mobile-bar { grid-template-columns: 1fr 1fr 1.5fr; }
  body { padding-top: calc(var(--gzh-topbar) + 54px); }
  .gzh-appbar { display: grid; grid-template-columns: minmax(0,1fr) auto; padding: 0 14px; }
  .gzh-appbar-brand { padding: 0; border: 0; }
  .gzh-document-status { display: none; }
  .gzh-appbar-actions > :not(:first-child):not(#gzhUndoBtn):not(#gzhRedoBtn) { display: none; }
  .gzh-mobile-nav { top: var(--gzh-topbar); }
  .gzh-stage { margin-top: 12px; }
  .gzh-toolbar > .gzh-actions { padding: 0 0 24px; }
}
@media (max-width: 620px) {
  :root { --gzh-topbar: 68px; }
  .gzh-appbar-brand .brand-main { font-size: 22px; }
  .gzh-appbar-brand img { width: 26px; height: 26px; }
  .gzh-appbar-actions .gzh-appbar-button.secondary { padding: 6px 10px; min-width: auto; }
  .gzh-stage { border-radius: 18px; }
  .gzh-stage-bar { border-radius: 18px 18px 0 0; }
  #gzh-content { min-height: 360px; }
  .gzh-source { height: min(44vh,390px); min-height: 260px; }
}
