:root {
  color-scheme: light;
  --page: #f4f6f9;
  --panel: #ffffff;
  --surface: #ffffff;
  --border: #e1e6ed;
  --primary: #2563eb;
  --muted: #65758b;
  --text: #263448;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 24px; }
body {
  margin: 0;
  padding-left: 230px;
  background: var(--page);
  color: var(--text);
  font-family: Inter, "Segoe UI", "Malgun Gothic", sans-serif;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}
a { color: var(--primary); }
p { color: var(--muted); }
h1, h2, h3 { line-height: 1.35; letter-spacing: -.035em; }
h1 { font-size: clamp(26px, 2.5vw, 34px); }
h2 { font-size: 21px; }
h3 { font-size: 17px; }
button, input, select { font: inherit; }
button, a, input, select, summary { touch-action: manipulation; }
button, summary { cursor: pointer; }
button { min-height: 44px; }
button:disabled { opacity: .45; cursor: default; }
button:focus-visible, a:focus-visible, input:focus-visible,
select:focus-visible, summary:focus-visible {
  outline: 3px solid var(--primary);
  outline-offset: 4px;
}
[hidden] { display: none !important; }
.skip-link {
  position: absolute;
  left: 16px;
  top: -80px;
  padding: 12px 20px;
  background: var(--primary);
  color: var(--page);
  z-index: 30;
}
.skip-link:focus { top: 12px; }
.site-header { border-bottom: 1px solid var(--border); background: #ffffff; }
.header-inner {
  max-width: none;
  margin: auto;
  min-height: 70px;
  padding: 16px 28px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}
.brand { color: var(--text); font-size: 24px; font-weight: 800; letter-spacing: -1px; text-decoration: none; white-space: nowrap; }
.brand img { display: block; width: 185px; max-width: 100%; height: auto; }
.mobile-brand { display: none; }
.page-shell { max-width: 1440px; margin: auto; padding: 24px 32px 64px; }
.page-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; align-items: start; gap: 36px; margin-top: 30px; }
main { min-width: 0; }
.breadcrumbs { display: flex; flex-wrap: wrap; gap: 10px; color: var(--muted); font-size: 13px; margin-bottom: 24px; }
.breadcrumbs a { text-decoration: none; }
.sidebar { display: grid; gap: 20px; min-width: 0; }
.sidebar-extra-ad-items { display: grid; justify-content: center; gap: 20px; padding: 14px 12px; min-height: 528px; }
.sidebar-extra-ad-items iframe { display: block; width: 200px; height: 240px; max-width: 100%; border: 0; }
@media (max-width: 1200px) { .sidebar-extra-ads { display: none; } }
.ad-slot { border: 1px solid #dce3ec; border-radius: 12px; background: #fbfcfe; overflow: hidden; }
.ad-label { display: block; text-align: center; font-size: 10px; letter-spacing: .12em; color: #718096; padding: 7px 0 0; }
.ad-space { width: 100%; }
.ad-slot--top .ad-space { min-height: 90px; }
.ad-slot--top .ad-space--affiliate {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  align-items: center;
  justify-content: space-evenly;
  min-height: 264px;
  padding: 12px;
}
.ad-space--affiliate iframe {
  display: block;
  width: 200px;
  max-width: 200px;
  min-width: 0;
  height: 240px;
  flex: 1 1 0;
  border: 0;
}
@media (max-width: 600px) {
  .ad-space--affiliate iframe { flex: 0 1 calc((100% - 16px) / 2); }
  .ad-space--affiliate iframe:nth-child(n + 3) { display: none; }
}
.affiliate-disclosure {
  margin: 0;
  padding: 0 16px 14px;
  color: #65758b;
  font-size: 12px;
  text-align: center;
  overflow-wrap: anywhere;
}
.ad-slot--sidebar .ad-space { min-height: 250px; }
.ad-space--sidebar-affiliate {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px;
}
.ad-space--sidebar-affiliate iframe {
  display: block;
  width: 200px;
  max-width: 100%;
  height: 240px;
  border: 0;
}
.ad-slot--bottom { margin-top: 36px; }
.ad-slot--bottom .ad-space { min-height: 90px; }
.contact-card, .privacy-card { padding: 22px; border: 1px solid var(--border); border-radius: 8px; }
.contact-card { background: #ffffff; border-color: #dce3ec; }
.contact-card h2, .privacy-card h2 { font-size: 16px; margin: 0 0 12px; }
.contact-card p, .privacy-card p { font-size: 13px; margin: 0 0 14px; }
.contact-card a { font-size: 13px; overflow-wrap: anywhere; text-underline-offset: 4px; }
.privacy-card { border-color: transparent; padding-top: 4px; }
.hero { padding: 0 0 24px; }
.hero h1 { font-size: clamp(26px, 2.5vw, 34px); margin: 0 0 20px; line-height: 1.4; }
.hero > p:last-child { margin-bottom: 0; font-size: 15px; }
.primary-tools { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.primary-tool { border: 1px solid #e1e6ed; padding: 28px; border-radius: 8px; background: #ffffff; color: var(--text); text-decoration: none; }
.primary-tool:hover { border-color: var(--primary); }
.primary-tool h2 { margin: 0 0 8px; font-size: 24px; }
.primary-tool p { font-size: 14px; margin: 0 0 24px; }
.tool-action { display: flex; justify-content: space-between; align-items: center; color: var(--primary); font-size: 14px; font-weight: 600; }
.tool-action > span { font-size: 23px; }
.format-tools { margin-top: 44px; }
.section-heading { margin-bottom: 20px; }
.section-heading h2 { margin: 0 0 6px; }
.section-heading p { margin: 0; font-size: 14px; }
.tools-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.tool-card { position: relative; padding: 20px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface); color: var(--text); text-decoration: none; }
.tool-card:hover { border-color: #93b4f8; background: #f5f8ff; }
.tool-card h3 { margin: 0 0 10px; }
.tool-card p { margin: 0; padding-right: 14px; font-size: 12px; }
.tool-card > span { position: absolute; bottom: 14px; right: 14px; color: var(--primary); }
.tool-intro { margin-bottom: 26px; }
.tool-intro h1 { margin: 0 0 14px; }
.tool-intro p { font-size: 15px; margin: 8px 0; }
.tool-intro p:last-child { font-size: 13px; color: #52657e; }
.pdf-panel, .image-panel { padding: 26px; background: var(--panel); border: 1px solid #e1e6ed; border-radius: 8px; margin-bottom: 22px; }
.pdf-dropzone, .image-drop { padding: 26px; border: 2px dashed #b5c8e5; border-radius: 12px; background: #f7faff; transition: border-color .15s, background .15s; }
.pdf-dropzone.is-over, .image-drop.over { border-color: var(--primary); background: #e9f1ff; }
.pdf-dropzone label, .image-drop > label { display: block; font-size: 17px; font-weight: 600; }
.pdf-dropzone p, .image-drop p { font-size: 14px; margin: 12px 0 18px; }
.pdf-tool input, .image-tool input, .image-tool select { padding: 12px; color: var(--text); background: #ffffff; border: 1px solid #ccd5e1; border-radius: 8px; max-width: 100%; min-width: 0; }
.pdf-tool input, .image-tool input { width: 100%; }
input::file-selector-button { padding: 8px 12px; margin-right: 12px; border: 0; border-radius: 5px; background: #eaf0f8; color: var(--text); cursor: pointer; }
.pdf-actions, .image-actions { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.image-actions { margin-top: 22px; }
.pdf-tool button, .pdf-download, .image-tool button, .image-tool #image-download { padding: 11px 16px; border: 1px solid #2563eb; border-radius: 8px; color: #ffffff; background: var(--primary); font-weight: 700; text-decoration: none; }
.pdf-tool .pdf-secondary { border-color: #c7d5ec; color: var(--primary); background: transparent; }
.pdf-actions button { min-width: 44px; }
.pdf-list { padding: 0; margin: 22px 0; list-style: none; }
.pdf-row { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding: 15px; margin-bottom: 10px; border: 1px solid #dce3ec; border-radius: 10px; background: #ffffff; }
.pdf-name { flex: 1; min-width: 120px; overflow-wrap: anywhere; }
.pdf-name small { display: block; color: var(--muted); font-size: 12px; }
.pdf-order { color: var(--primary); font-weight: 700; min-width: 20px; }
.pdf-row[draggable] { cursor: grab; }
.pdf-row.is-dragging { opacity: .45; }
.pdf-row.drop-before { border-top: 3px solid var(--primary); }
.pdf-row.drop-after { border-bottom: 3px solid var(--primary); }
.pdf-grip { color: var(--muted); font-size: 22px; user-select: none; }
#pdf-status, #image-status { min-height: 28px; color: var(--primary); margin: 18px 0 0; font-size: 14px; }
#file-count { font-size: 13px; }
.pdf-tool iframe { width: 100%; height: 600px; border: 0; border-radius: 8px; background: white; }
.image-previews { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px; }
.image-previews > div { min-width: 0; }
.image-previews img { width: 100%; height: 300px; object-fit: contain; background: repeating-conic-gradient(#e2e8f0 0% 25%, #f8fafc 0% 50%) 0 / 20px 20px; border-radius: 8px; }
.image-previews p { font-size: 13px; overflow-wrap: anywhere; }
.guide-panel, .faq-panel, .related-panel { margin-top: 32px; padding: 26px; border: 1px solid var(--border); border-radius: 8px; background: #ffffff; }
.guide-panel h2, .faq-panel h2, .related-panel h2 { margin: 0 0 18px; }
.guide-panel p, .guide-steps { font-size: 14px; color: var(--muted); }
.guide-steps { padding-left: 22px; margin: 0; }
.guide-steps li { padding-left: 8px; margin: 12px 0; }
.guide-steps li::marker { color: var(--primary); font-weight: 700; }
.faq-panel details { border-top: 1px solid var(--border); }
.faq-panel summary { padding: 16px 0; font-size: 14px; font-weight: 600; }
.faq-panel details p { margin: 0 0 18px; font-size: 14px; }
.related-links { display: flex; gap: 10px; flex-wrap: wrap; }
.related-links a { font-size: 13px; padding: 7px 12px; border: 1px solid #d5dde7; border-radius: 7px; text-decoration: none; }
.next-actions { margin: 22px 0; padding: 18px; border: 1px solid #c9dcfb; border-radius: 8px; background: #f8fbff; }
.next-actions h2 { margin: 0 0 12px; font-size: 17px; }
.home-quick-links { margin-top: 18px; }
.privacy-page .page-layout { grid-template-columns: minmax(0, 1fr); margin-top: 0; }
.privacy-document { max-width: 960px; margin: 0 auto; padding: clamp(18px, 4vw, 36px); border: 1px solid var(--border); border-radius: 10px; background: white; }
.privacy-document h1 { margin-top: 0; }
.privacy-document h2 { margin-top: 32px; font-size: 20px; }
.privacy-document p, .privacy-document li { color: var(--text); font-size: 14px; overflow-wrap: anywhere; }
.privacy-document table { width: 100%; border-collapse: collapse; font-size: 13px; }
.privacy-document th, .privacy-document td { border: 1px solid var(--border); padding: 10px; text-align: left; vertical-align: top; }
.privacy-document th { background: #f5f8fc; }
.admin-login { max-width: 480px; }
.admin-login button { margin-top: 18px; }
.admin-toolbar { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 14px; margin-bottom: 20px; }
.admin-toolbar h1 { margin: 0; }
.admin-toolbar select { padding: 9px; border: 1px solid var(--border); background: white; border-radius: 6px; font: inherit; }
.admin-toolbar .image-actions { margin-top: 0; }
.monitor-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.monitor-cards article { background: white; border: 1px solid var(--border); border-top: 3px solid var(--primary); border-radius: 8px; padding: 20px; min-width: 0; }
.monitor-cards h2 { font-size: 15px; margin: 0 0 8px; }
.monitor-cards strong { display: block; font-size: 25px; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.monitor-cards p { font-size: 12px; margin: 8px 0 0; }
.monitor-cards progress { width: 100%; height: 10px; accent-color: var(--primary); }
.monitor-summary { margin: 20px 0; }
.monitor-charts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.monitor-charts .image-panel { min-width: 0; }
.monitor-charts canvas { width: 100%; height: auto; }
.monitor-table { min-width: 900px; }
.monitor-table td:first-child { width: auto; }
.admin-dashboard .board-table { font-size: 12px; }
@media (max-width: 900px) { .monitor-charts { grid-template-columns: minmax(0, 1fr); } .monitor-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 450px) { .monitor-cards { grid-template-columns: minmax(0, 1fr); } .admin-toolbar .image-actions { gap: 8px; } }
.site-footer { max-width: 1376px; margin: 0 32px; padding: 32px 0; border-top: 1px solid var(--border); display: flex; justify-content: space-between; gap: 24px; }
.site-footer .brand { font-size: 20px; }
.site-footer .brand img { width: 180px; }
.site-footer p { font-size: 12px; margin: 10px 0 0; }
.footer-links { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; font-size: 12px; }
.footer-links a { color: var(--muted); overflow-wrap: anywhere; }

@media (max-width: 1150px) {
  .page-layout { gap: 24px; grid-template-columns: minmax(0, 1fr) 300px; }
  .tools-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .primary-tool { padding: 22px; }
  .site-footer { margin: 0 32px; }
}
@media (max-width: 1200px) {
  .page-layout { grid-template-columns: minmax(0, 1fr); }
  .sidebar { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; margin-top: 10px; }
  .ad-slot--sidebar { grid-row: span 2; }
  .privacy-card { padding-top: 12px; }
  .ad-slot--sidebar .ad-space { min-height: 250px; }
}
@media (max-width: 600px) {
  .header-inner { min-height: 72px; padding: 16px; }
  .brand { font-size: 21px; }
  .page-shell { padding: 16px 16px 40px; }
  .page-layout { margin-top: 24px; }
  .ad-slot--top .ad-space, .ad-slot--bottom .ad-space { min-height: 100px; }
  .primary-tools { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .primary-tool h2 { margin-top: 14px; }
  .hero h1 { font-size: 30px; }
  .tools-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .tool-card { padding: 16px; }
  .tool-card h3 { font-size: 15px; }
  .tool-card p { font-size: 12px; }
  .pdf-panel, .image-panel, .guide-panel, .faq-panel, .related-panel { padding: 18px; border-radius: 12px; }
  .pdf-dropzone, .image-drop { padding: 18px 14px; }
  .pdf-row .pdf-actions { width: 100%; }
  .pdf-row .pdf-actions button { padding: 10px 12px; }
  .pdf-name { flex-basis: 70%; }
  .pdf-tool iframe { height: 420px; }
  .image-previews { grid-template-columns: minmax(0, 1fr); }
  .image-actions { gap: 12px; }
  .image-actions > * { max-width: 100%; }
  .sidebar { grid-template-columns: minmax(0, 1fr); }
  .ad-slot--sidebar { grid-row: auto; }
  .site-footer { margin: 0 16px; padding: 28px 0; flex-direction: column; }
  .footer-links { align-items: flex-start; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { transition: none !important; }
}

/* Application shell */
.app-navigation {
  position: fixed;
  inset: 0 auto 0 0;
  width: 230px;
  overflow-y: auto;
  background: #ffffff;
  border-right: 1px solid var(--border);
  z-index: 20;
}
.app-navigation > .brand {
  display: flex;
  align-items: center;
  min-height: 70px;
  padding: 16px 22px;
  border-bottom: 1px solid var(--border);
  font-size: 23px;
}
.rail-nav { padding: 20px 14px; }
.rail-nav a {
  display: block;
  margin: 4px 0;
  padding: 10px 14px;
  border-radius: 6px;
  color: #526175;
  text-decoration: none;
  font-size: 14px;
}
.rail-nav a:hover { color: var(--primary); background: #f0f5ff; }
.rail-nav a[aria-current="page"] {
  color: #ffffff;
  background: var(--primary);
  box-shadow: 0 3px 8px #2563eb20;
  font-weight: 600;
}
.nav-heading {
  margin: 24px 14px 10px;
  color: #6b7d94;
  font-size: 12px;
  font-weight: 600;
}
.rail-formats { margin-top: 8px; }
.rail-formats summary { padding: 10px 14px; color: #526175; font-size: 13px; }
.rail-formats a { margin-left: 12px; font-size: 13px; }
.header-title { display: flex; align-items: center; gap: 16px; color: #526175; font-size: 14px; }
.header-contact { color: #526175; text-decoration: none; font-size: 13px; }
.header-contact:hover { color: var(--primary); }
.nav-toggle {
  display: none;
  padding: 6px 12px;
  border: 1px solid #d5dde7;
  border-radius: 5px;
  background: #ffffff;
  color: #35455b;
}
.primary-tool, .pdf-panel, .image-panel, .guide-panel, .faq-panel, .related-panel {
  box-shadow: 0 2px 5px #21324d06;
}
.primary-tool { border-top: 3px solid var(--primary); }
.primary-tool:nth-child(2) { border-top-color: #0d9488; }
.pdf-panel, .image-panel { border-top: 3px solid var(--primary); }
.tool-action { padding-top: 15px; border-top: 1px solid var(--border); }
.ad-slot { border-style: dashed; border-radius: 6px; }
.contact-card { border-top: 3px solid #17a2b8; }
.site-footer { background: transparent; }

@media (max-width: 900px) {
  body { padding-left: 0; }
  .mobile-brand { display: inline-flex; }
  .mobile-brand img { width: 130px; }
  .header-title > span { display: none; }
  .nav-toggle { display: inline-block; }
  .app-navigation {
    display: none;
    position: static;
    width: auto;
    max-height: 65vh;
    border-right: 0;
    border-bottom: 1px solid var(--border);
  }
  .app-navigation.is-open { display: block; }
  .app-navigation > .brand { min-height: 58px; padding: 12px 28px; }
  .rail-nav { padding: 8px 14px 18px; }
  .header-title { font-weight: 600; }
}
@media (max-width: 600px) {
  .header-inner { min-height: 64px; }
  .header-title { gap: 10px; font-size: 13px; }
  .hero h1 { font-size: 27px; }
  .primary-tool h2 { margin-top: 0; }
  .app-navigation > .brand { padding-left: 20px; }
}

.split-options { margin: 24px 0; }
.split-options label { display: block; margin: 0 0 8px; font-size: 14px; font-weight: 600; }
.split-options select { padding: 10px 12px; border: 1px solid #ccd5e1; border-radius: 6px; background: white; color: var(--text); max-width: 100%; }
#split-ranges-field { margin-top: 20px; }
#split-ranges-help { font-size: 13px; }
#split-status { min-height: 28px; margin: 18px 0 0; color: var(--primary); font-size: 14px; }
#split-file-info { overflow-wrap: anywhere; font-size: 14px; }
#split-original-download { display: inline-block; margin-top: 10px; font-size: 14px; }

/* Anonymous inquiry board */
.board-panel { padding: 26px; background: white; border: 1px solid var(--border); border-top: 3px solid var(--primary); border-radius: 8px; margin-bottom: 24px; }
.board-toolbar, .board-actions, .board-pagination { display: flex; align-items: center; gap: 18px; }
.board-toolbar { justify-content: space-between; margin-bottom: 18px; }
.board-toolbar p { margin: 0; font-size: 14px; }
.board-button, .board-secondary, .board-danger { display: inline-block; padding: 10px 18px; border-radius: 6px; border: 1px solid var(--primary); background: var(--primary); color: white; font-size: 14px; text-decoration: none; cursor: pointer; }
.board-secondary { background: white; color: var(--primary); }
.board-back {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 46px;
  border-color: #d1dbe8;
  background: #f6f8fb;
  color: #44566e;
  font-weight: 600;
  text-decoration: none;
  transition: background .15s, border-color .15s;
}
.board-back::before { content: '\2190'; font-size: 17px; line-height: 1; }
.board-back:hover { background: #eaf1fc; border-color: #9bb7e8; color: #1d4ed8; }
.board-danger { background: #b42332; border-color: #b42332; }
.board-table-wrap { overflow-x: auto; }
.board-table { width: 100%; border-collapse: collapse; font-size: 14px; text-align: left; }
.board-table th { background: #f6f8fb; color: #526175; font-weight: 600; }
.board-table th, .board-table td { padding: 14px 12px; border-bottom: 1px solid var(--border); }
.board-table td:first-child { width: 65%; overflow-wrap: anywhere; }
.board-table td:last-child { white-space: nowrap; font-size: 12px; color: var(--muted); }
.board-table a { color: var(--text); text-decoration: none; }
.board-table a:hover { color: var(--primary); text-decoration: underline; }
.board-pagination { justify-content: center; margin-top: 24px; font-size: 14px; }
.board-empty { padding: 35px 0; text-align: center; }
.board-notice { padding: 14px 16px; background: #f0f5ff; border-radius: 6px; color: #3b557d; font-size: 14px; }
.board-form { display: grid; gap: 10px; }
.board-form > label { margin-top: 14px; font-size: 14px; font-weight: 600; }
.board-form label small { font-weight: 400; color: var(--muted); }
.board-form input:not([type="checkbox"]), .board-form textarea { width: 100%; padding: 12px; border: 1px solid #ccd5e1; border-radius: 6px; background: white; color: var(--text); font: inherit; }
.board-form textarea { resize: vertical; min-height: 180px; }
.board-help { margin: 0 0 8px; font-size: 12px; }
.board-verification { padding: 18px; margin: 14px 0; border: 1px solid var(--border); border-radius: 6px; }
.board-verification > label { font-size: 14px; font-weight: 600; }
.board-answer-row { display: flex; gap: 12px; margin: 12px 0; }
.board-answer-row input { max-width: 120px; }
.board-answer-row button { white-space: nowrap; }
.board-honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.board-status { min-height: 24px; color: #a42e38; font-size: 14px; margin: 8px 0; }
.board-post-title { margin: 0 0 16px; font-size: 28px; overflow-wrap: anywhere; }
.board-post-meta { display: flex; gap: 20px; color: var(--muted); font-size: 13px; padding-bottom: 20px; border-bottom: 1px solid var(--border); }
.board-post-body { white-space: pre-wrap; overflow-wrap: anywhere; min-height: 150px; padding: 28px 0; }
.board-delete h2 { margin: 0; font-size: 18px; }
.board-delete .board-form { max-width: 380px; }
.board-confirm { display: flex; align-items: center; gap: 10px; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@media (max-width: 600px) {
  .board-panel { padding: 18px; }
  .board-table th, .board-table td { padding: 12px 8px; }
  .board-table td:first-child { width: auto; min-width: 125px; }
  .board-table td:last-child { white-space: normal; min-width: 85px; }
  .board-actions { flex-wrap: wrap; }
}

/* Tool controls precede advertisements in DOM order, including mobile. */
.tool-page .page-layout { margin-top: 0; }
.tool-page main > .ad-slot--top { margin-top: 28px; }
.tool-page .ad-space--affiliate { min-height: 264px; flex-wrap: nowrap; }
.tool-page .ad-space--affiliate iframe { flex: 0 1 200px; }
.tool-page .ad-slot--top { min-height: 322px; }
.tool-page .ad-slot--sidebar { min-height: 350px; }
.compress-presets { display: flex; gap: 12px; flex-wrap: wrap; margin: 20px 0; padding: 12px; border: 1px solid var(--border); border-radius: 8px; }
.compress-presets label { display: flex; align-items: center; gap: 5px; min-height: 36px; }
.image-tool .compress-presets input { width: auto; }
.download-button { display: inline-block; padding: 10px 16px; border-radius: 8px; background: var(--primary); color: white; text-decoration: none; }
.tool-status { min-height: 28px; color: var(--primary); font-size: 14px; }
.keyword-input-row { display: flex; align-items: stretch; gap: 10px; margin: 10px 0; }
.keyword-input-row input { min-width: 0; flex: 1; padding: 12px; border: 1px solid #ccd5e1; border-radius: 8px; font: inherit; }
.keyword-input-row button { white-space: nowrap; border: 1px solid var(--primary); font: inherit; }
.keyword-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.keyword-toolbar button { border: 0; font: inherit; }
.keyword-table { min-width: 430px; }
.keyword-table td:first-child { width: auto; }
.keyword-table th button { color: var(--primary); border: 0; background: transparent; text-align: left; font-size: 13px; }
.keyword-table td { font-variant-numeric: tabular-nums; }
.keyword-match { background: #edf4ff; }
.keyword-badge { display: inline-block; margin-left: 8px; padding: 2px 6px; color: #174fbe; font-size: 11px; border: 1px solid #a3c3fc; border-radius: 5px; white-space: nowrap; }
@media (max-width: 600px) {
  .keyword-table { min-width: 0; width: 100%; table-layout: fixed; }
  .keyword-table th:first-child, .keyword-table td:first-child { width: 38%; min-width: 0; }
  .keyword-table th, .keyword-table td { padding: 10px 6px; overflow-wrap: anywhere; font-size: 12px; }
  .keyword-table td:last-child { min-width: 0; }
  .keyword-table th button { padding: 0; font-size: 12px; }
  .keyword-badge { margin: 4px 0 0; font-size: 10px; }
}
@media (max-width: 450px) { .keyword-input-row { flex-direction: column; } }
@media (max-width: 600px) {
  .tool-page .ad-space--affiliate iframe { flex: 0 1 calc((100% - 16px) / 2); }
  .tool-page .ad-space--affiliate iframe:nth-child(n + 3) { display: none; }
  .tool-page .breadcrumbs { margin-bottom: 14px; }
  .tool-page .tool-intro { margin-bottom: 16px; }
  .tool-page .tool-intro h1 { margin-bottom: 8px; }
  .tool-page .tool-intro p { margin: 5px 0; }
  .tool-page .ad-slot--top { min-height: 350px; }
}