.utility-input { min-height: 44px; max-width: 100%; width: 190px; padding: 10px 14px; border: 1px solid var(--line); border-radius: 12px; color: var(--ink); background: white; font: inherit; }
.utility-color { width: 70px; height: 44px; padding: 5px; border: 1px solid var(--line); border-radius: 12px; background: white; }
.utility-note { display: block; margin: 12px 0 20px; color: var(--muted); font-size: 12px; line-height: 1.8; }
.utility-summary { color: var(--deep); font-size: 14px; font-weight: 750; }
.utility-file-list { display: grid; gap: 12px; margin-bottom: 20px; }
.utility-file-row { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; padding: 12px 0; color: var(--ink); font-size: 13px; }
.utility-file-row > span:first-child, .utility-file-row > strong:first-child { flex: 1 1 180px; min-width: 0; overflow-wrap: anywhere; }
.tool-work-panel .utility-mini-button { min-height: 36px; padding: 7px 12px; border: 1px solid var(--line); border-radius: 10px; color: var(--deep); background: #f3faf6; font-size: 12px; }
.tool-work-panel .utility-mini-button:hover { background: #e5f6ee; }
.pdf-file-panel { padding: 16px 20px; border: 1px solid var(--line); border-radius: 18px; background: #fbfefc; }
.pdf-file-panel .utility-input { width: 100%; }
.pdf-page-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.tool-work-panel .pdf-page-chip { padding: 8px 12px; border: 1px solid var(--line); border-radius: 10px; color: var(--muted); background: white; font-size: 12px; }
.tool-work-panel .pdf-page-chip.active { color: #087b5c; background: #e4f6ec; border-color: #96ceb8; }
.utility-textarea { min-height: 140px; margin-bottom: 20px; }
.utility-text-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; margin-bottom: 20px; }
.utility-text-grid .tool-result { min-height: 300px; }
.utility-text-grid .utility-note { margin-bottom: 0; }
.utility-checks { display: flex; flex-wrap: wrap; gap: 14px 24px; margin-bottom: 24px; color: var(--muted); font-size: 13px; }
.utility-checks label { display: flex; gap: 8px; align-items: center; }
.utility-checks input { accent-color: var(--mint); width: 16px; height: 16px; }
.markup-preview { margin: 20px 0; padding: 14px; border: 1px solid var(--line); border-radius: 16px; background: #f5faf8; }
#markup-canvas { display: block; max-width: 100%; max-height: 70vh; width: auto; height: auto; margin: 0 auto; touch-action: none; cursor: crosshair; background: repeating-conic-gradient(#eee 0% 25%, white 0% 50%) 50% / 16px 16px; }
@media (max-width: 640px) {
  .utility-input { width: 100%; }
  .utility-text-grid { grid-template-columns: 1fr; }
  .utility-checks { display: grid; gap: 12px; }
  .pdf-file-panel { padding: 12px; }
  .markup-preview { padding: 8px; }
}