:root {
  --bg-color: #0f172a;
  --sidebar-bg: #1e293b;
  --card-bg: #1e293b;
  --text-color: #f8fafc;
  --text-muted: #94a3b8;
  --accent-color: #38bdf8;
  --accent-hover: #0ea5e9;
  --border-color: #334155;
  --hover-color: #334155;
  --input-bg: #0b1220;
  --success-color: #22c55e;
  --warning-color: #f59e0b;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  background: var(--bg-color);
  color: var(--text-color);
  line-height: 1.6;
  display: flex;
  min-height: 100vh;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; }
.sidebar {
  width: 280px;
  background: var(--sidebar-bg);
  border-right: 1px solid var(--border-color);
  display: flex;
  flex-direction: column;
  position: fixed;
  height: 100vh;
  overflow-y: auto;
  z-index: 100;
}
.sidebar-header { padding: 24px; border-bottom: 1px solid var(--border-color); }
.sidebar-header h1 { font-size: 1.5rem; font-weight: 800; color: var(--accent-color); letter-spacing: -0.025em; }
.sidebar-tagline { font-size: 0.8rem; color: var(--text-muted); margin-top: .5rem; line-height: 1.25; }
.search-container { padding: 16px 24px; }
.search-input, .calc-select, .calc-input, .large-input, select.unit-select {
  width: 100%;
  padding: 12px 14px;
  background: var(--input-bg);
  border: 1px solid var(--border-color);
  color: var(--text-color);
  border-radius: 10px;
  font-size: .95rem;
}
.search-input:focus, .calc-select:focus, .calc-input:focus, .large-input:focus, select.unit-select:focus {
  outline: none;
  border-color: var(--accent-color);
  box-shadow: 0 0 0 3px rgba(56, 189, 248, .12);
}
.nav-menu { list-style: none; padding: 8px 0 24px; }
.nav-item {
  padding: 12px 24px;
  cursor: pointer;
  transition: all .2s ease;
  display: flex;
  align-items: center;
  text-decoration: none;
  color: var(--text-muted);
  font-weight: 500;
}
.nav-item:hover, .nav-item.active { background: var(--hover-color); color: var(--accent-color); }
.nav-section-title { padding: 16px 24px 8px; font-size: .75rem; text-transform: uppercase; letter-spacing: .05em; color: var(--text-muted); font-weight: 700; }
.main-content { flex: 1; margin-left: 280px; padding: 40px 48px 56px; max-width: 1100px; }
.hero-section { margin-bottom: 32px; }
.hero-section h1 { font-size: 2.45rem; font-weight: 800; margin-bottom: 12px; letter-spacing: -0.025em; }
.hero-section p { font-size: 1.08rem; color: var(--text-muted); max-width: 760px; }
.converter-card, .info-card, .placeholder-card {
  background: var(--card-bg);
  padding: 32px;
  border-radius: 16px;
  border: 1px solid var(--border-color);
  box-shadow: 0 10px 15px -3px rgba(0,0,0,.12);
  margin-bottom: 28px;
}
.converter-grid { display: grid; grid-template-columns: 1fr auto 1fr; gap: 24px; align-items: center; }
.converter-grid.single { grid-template-columns: 1fr; }
.converter-grid.formula-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; align-items: end; }
.input-group { display: flex; flex-direction: column; }
.input-group label { margin-bottom: 10px; font-size: .875rem; font-weight: 600; color: var(--text-muted); }
.large-input { padding: 18px 20px; font-size: 2rem; font-weight: 700; transition: border-color .2s, box-shadow .2s; }
.large-input[readonly] { opacity: 1; }
.swap-btn {
  background: var(--input-bg);
  border: 1px solid var(--border-color);
  color: var(--text-color);
  width: 48px; height: 48px; border-radius: 50%; cursor: pointer;
  font-size: 1.25rem; display: flex; align-items: center; justify-content: center;
  transition: all .2s ease; margin-top: 28px;
}
.swap-btn:hover { background: var(--hover-color); border-color: var(--accent-color); transform: scale(1.08); }
.quick-values { margin-top: 20px; display: flex; gap: 8px; flex-wrap: wrap; }
.quick-btn {
  padding: 6px 12px; background: var(--input-bg); border: 1px solid var(--border-color); color: var(--text-muted);
  border-radius: 999px; font-size: .875rem; cursor: pointer; transition: all .2s ease;
}
.quick-btn:hover { border-color: var(--accent-color); color: var(--accent-color); }
.actions { margin-top: 24px; display: flex; gap: 12px; flex-wrap: wrap; }
.btn {
  padding: 12px 24px; border: none; border-radius: 10px; cursor: pointer; font-weight: 600; font-size: 1rem;
  transition: all .2s ease; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  text-decoration: none;
}
.btn-primary { background: var(--accent-color); color: #0f172a; }
.btn-primary:hover { background: var(--accent-hover); }
.btn-secondary { background: var(--border-color); color: var(--text-color); }
.btn-secondary:hover { background: var(--hover-color); }
.btn-ghost { background: transparent; color: var(--accent-color); border: 1px solid var(--accent-color); }
.btn-ghost:hover { background: rgba(56,189,248,.08); }
.grid, .feature-grid { display: grid; gap: 16px; }
.feature-grid { grid-template-columns: repeat(auto-fit, minmax(220px,1fr)); margin-top: 20px; }
.link-card, .card {
  background: var(--card-bg);
  border: 1px solid var(--border-color);
  border-radius: 14px;
  padding: 20px;
  text-decoration: none;
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}
.link-card:hover, .card:hover { transform: translateY(-2px); border-color: var(--accent-color); }
.link-card h3, .card h3, .card h4 { margin-bottom: 8px; }
.link-card p, .card p { color: var(--text-muted); font-size: .98rem; }
.mini-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px,1fr)); gap: 12px; margin-top: 20px; }
.mini-stat { padding: 16px; border-radius: 12px; border: 1px solid var(--border-color); background: rgba(15,23,42,.55); }
.mini-stat strong { display: block; color: var(--accent-color); font-size: 1.1rem; }
.inline-list, .related-links { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.pill-link {
  display: inline-flex; align-items: center; gap: 6px; text-decoration: none;
  padding: 10px 14px; border-radius: 999px; background: var(--input-bg); border: 1px solid var(--border-color); color: var(--text-color);
}
.pill-link:hover { border-color: var(--accent-color); color: var(--accent-color); }
.notice, .result-note {
  margin-top: 16px; padding: 14px 16px; border-radius: 12px; border: 1px solid var(--border-color);
  background: rgba(15,23,42,.55); color: var(--text-muted);
}
.result-note strong { color: var(--text-color); }
.kpi-box {
  padding: 18px; border-radius: 14px; border: 1px solid var(--border-color); background: var(--input-bg);
}
.kpi-box h3 { margin-bottom: 6px; color: var(--accent-color); }
.seo-section { margin-top: 44px; }
.seo-section h2 { font-size: 1.875rem; font-weight: 800; margin-bottom: 20px; color: var(--accent-color); }
.seo-section h3 { font-size: 1.25rem; font-weight: 700; margin: 28px 0 14px; }
.seo-section p, .seo-section li { margin-bottom: 14px; color: var(--text-muted); font-size: 1.05rem; }
.seo-section ul { padding-left: 18px; }
.data-table { width: 100%; border-collapse: collapse; margin: 20px 0; border-radius: 12px; overflow: hidden; border: 1px solid var(--border-color); }
.data-table th { background: var(--sidebar-bg); padding: 16px; text-align: left; font-weight: 700; color: var(--accent-color); }
.data-table td { padding: 14px 16px; border-top: 1px solid var(--border-color); }
.data-table tr:hover { background: var(--hover-color); }
.faq-container { margin-top: 36px; }
.faq-item { margin-bottom: 18px; padding: 20px; background: var(--card-bg); border-radius: 12px; border: 1px solid var(--border-color); }
.faq-item h4 { font-size: 1.125rem; margin-bottom: 10px; color: var(--text-color); }
.ad-container {
  margin: 28px 0; text-align: center; background: var(--sidebar-bg); padding: 16px; border-radius: 10px; border: 1px dashed var(--border-color);
  min-height: 78px;
}
.ad-label { font-size: .75rem; color: var(--text-muted); margin-bottom: 8px; display: block; }
.footer { margin-top: 48px; padding-top: 28px; border-top: 1px solid var(--border-color); text-align: center; color: var(--text-muted); }
.footer-links { margin-top: 16px; display: flex; justify-content: center; flex-wrap: wrap; gap: 24px; }
.footer-links a { color: var(--text-muted); text-decoration: none; font-size: .875rem; }
.footer-links a:hover { color: var(--accent-color); }
.placeholder-badge {
  display: inline-flex; padding: 6px 10px; border-radius: 999px; background: rgba(245,158,11,.12); color: #fbbf24; border: 1px solid rgba(245,158,11,.35); font-size: .8rem; font-weight: 700;
}
.visually-hidden { position: absolute !important; height: 1px; width: 1px; overflow: hidden; clip: rect(1px,1px,1px,1px); white-space: nowrap; }
@media (max-width: 900px) {
  .converter-grid.formula-grid { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  body { flex-direction: column; }
  .sidebar { width: 100%; height: auto; position: relative; border-right: none; border-bottom: 1px solid var(--border-color); }
  .main-content { margin-left: 0; padding: 24px; }
  .converter-grid { grid-template-columns: 1fr; }
  .swap-btn { transform: rotate(90deg); margin: 0 auto; }
  .hero-section h1 { font-size: 2rem; }
  .converter-card, .info-card, .placeholder-card { padding: 22px; }
  .large-input { font-size: 1.55rem; }
}

main, section, .converter-card, .info-card, .placeholder-card { content-visibility: auto; contain-intrinsic-size: 1px 900px; }
strong { color: var(--text-color); }


.adblock-popup[hidden]{display:none}.adblock-popup{position:fixed;inset:0;background:rgba(2,6,23,.7);display:flex;align-items:center;justify-content:center;z-index:99999;padding:20px}.adblock-popup-box{max-width:560px;width:100%;background:var(--card-bg);color:var(--text-color);border:1px solid var(--border-color);border-radius:16px;padding:24px;box-shadow:0 20px 45px rgba(0,0,0,.35)}.adblock-popup-box h3{margin:0 0 12px;color:var(--accent-color)}.adblock-popup-box p{margin:0 0 16px;color:var(--text-muted)}.adblock-popup-actions{display:flex;gap:12px;flex-wrap:wrap}.adblock-bait,.adsbox{position:absolute!important;left:-9999px!important;top:-9999px!important;width:1px!important;height:1px!important}.cookie-note{margin-top:10px;font-size:.9rem;color:var(--text-muted)}


.currency-meta{display:grid;gap:10px;margin-top:18px;padding:14px 16px;background:rgba(15,23,42,.45);border:1px solid var(--border-color);border-radius:12px}
.currency-meta p{margin:0;color:var(--text-muted)}
.currency-meta strong{color:var(--text-color)}
.disclaimer-box{margin-top:18px;padding:14px 16px;border-left:4px solid var(--warning-color);background:rgba(245,158,11,.08);border-radius:10px}
.disclaimer-box p{margin:0;color:var(--text-muted)}


[data-theme="light"] {
  --bg-color: #f8fafc;
  --sidebar-bg: #ffffff;
  --card-bg: #ffffff;
  --text-color: #0f172a;
  --text-muted: #475569;
  --accent-color: #0284c7;
  --accent-hover: #0369a1;
  --border-color: #cbd5e1;
  --hover-color: #e2e8f0;
  --input-bg: #f8fafc;
}
[data-theme="light"] .mini-stat,
[data-theme="light"] .notice,
[data-theme="light"] .result-note,
[data-theme="light"] .currency-meta {
  background: rgba(226,232,240,.5);
}
[data-theme="light"] .disclaimer-box {
  background: rgba(245,158,11,.14);
}
.theme-toggle{
  display:inline-flex;align-items:center;gap:8px;margin-top:14px;padding:10px 14px;border-radius:999px;
  border:1px solid var(--border-color);background:var(--input-bg);color:var(--text-color);cursor:pointer;font-weight:600
}
.theme-toggle:hover{border-color:var(--accent-color);color:var(--accent-color)}
.utility-bar{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin:18px 0 0}
.smart-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:end}
.smart-form .input-group{margin:0}
.smart-output{margin-top:16px}
.recent-list{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.recent-list a{display:inline-flex;align-items:center;gap:6px;text-decoration:none;padding:8px 12px;border-radius:999px;background:var(--input-bg);border:1px solid var(--border-color);color:var(--text-color)}
.recent-list a:hover{border-color:var(--accent-color);color:var(--accent-color)}
.all-in-one-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.compact-card{padding:22px;border-radius:14px;border:1px solid var(--border-color);background:var(--card-bg)}
.compact-card h3{margin-bottom:8px}
.compact-card .actions{margin-top:18px}
.result-inline{font-size:1.1rem;font-weight:700;color:var(--accent-color);margin-top:12px}
@media (max-width:768px){.smart-form{grid-template-columns:1fr}.theme-toggle{width:100%;justify-content:center}}


html[data-theme="light"],
html[data-theme="light"] body {
  background: var(--bg-color);
  color: var(--text-color);
}
html[data-theme="light"] .sidebar,
html[data-theme="light"] .converter-card,
html[data-theme="light"] .info-card,
html[data-theme="light"] .placeholder-card,
html[data-theme="light"] .link-card,
html[data-theme="light"] .card,
html[data-theme="light"] .compact-card,
html[data-theme="light"] .faq-item,
html[data-theme="light"] .kpi-box,
html[data-theme="light"] .adblock-popup-box {
  background: var(--card-bg);
  color: var(--text-color);
}
html[data-theme="light"] .btn-secondary { background: #dbe4ef; color: #0f172a; }
html[data-theme="light"] .btn-primary { color: #ffffff; }
html[data-theme="light"] .btn-primary:hover { color: #ffffff; }
html[data-theme="light"] .data-table th { background: #e2e8f0; }
html[data-theme="light"] .ad-container { background: #f8fafc; }
html[data-theme="light"] .theme-toggle { background: #ffffff; }
.theme-toggle[aria-pressed="true"] {
  border-color: var(--accent-color);
  box-shadow: 0 0 0 3px rgba(2,132,199,.12);
}
.category-grid-2 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 16px;
}
.section-kicker {
  display: inline-block;
  margin-bottom: 10px;
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--accent-color);
}
.blog-group { margin-top: 34px; }
.blog-group:first-of-type { margin-top: 0; }
.blog-group .feature-grid { margin-top: 14px; }

/* V6.2.3 hotfix: restore missing layout rules after compact patch and keep compact spacing */
body { line-height: 1.5; }
.main-content { padding: 30px 38px 42px; max-width: 1040px; }
.sidebar-header { padding: 20px 22px; }
.search-container { padding: 14px 22px; }
.nav-menu { padding: 6px 0 16px; }
.nav-item { padding: 10px 22px; }
.nav-section-title { padding: 12px 22px 6px; }
.hero-section { margin-bottom: 22px; }
.hero-section h1 { margin-bottom: 8px; line-height: 1.08; }
.hero-section p { font-size: 1rem; line-height: 1.45; max-width: 820px; }
.converter-card, .info-card, .placeholder-card { padding: 24px; border-radius: 14px; margin-bottom: 20px; }
.converter-grid { gap: 18px; }
.converter-grid.formula-grid { gap: 14px; }
.input-group label { margin-bottom: 8px; }
.large-input { padding: 15px 17px; font-size: 1.8rem; }
.swap-btn { width: 44px; height: 44px; margin-top: 24px; }
.quick-values { margin-top: 14px; gap: 7px; }
.quick-btn { padding: 5px 10px; }
.actions { margin-top: 18px; gap: 10px; }
.btn { padding: 10px 18px; border-radius: 9px; }
.grid, .feature-grid { gap: 12px; }
.feature-grid { margin-top: 14px; }
.link-card, .card, .compact-card { padding: 16px; border-radius: 12px; }
.link-card h3, .card h3, .card h4, .compact-card h3 { margin-bottom: 6px; }
.link-card p, .card p, .compact-card p { font-size: .95rem; line-height: 1.45; }
.mini-grid { gap: 10px; margin-top: 14px; }
.mini-stat { padding: 13px; }
.inline-list, .related-links { gap: 8px; margin-top: 12px; }
.pill-link { padding: 8px 12px; }
.notice, .result-note { margin-top: 12px; padding: 12px 14px; }
.kpi-box { padding: 14px; }
.seo-section { margin-top: 26px; }
.seo-section h2 { font-size: 1.65rem; margin-bottom: 14px; line-height: 1.12; }
.seo-section h3 { font-size: 1.1rem; margin: 18px 0 10px; line-height: 1.2; }
.seo-section p, .seo-section li { margin-bottom: 10px; font-size: 1rem; line-height: 1.5; }
.data-table { margin: 14px 0; }
.data-table th { padding: 12px 14px; }
.data-table td { padding: 11px 14px; }
.faq-container { margin-top: 22px; }
.faq-item { margin-bottom: 12px; padding: 16px; }
.faq-item h4 { margin-bottom: 8px; }
.ad-container { margin: 20px 0; padding: 12px; min-height: 66px; }
.footer { margin-top: 32px; padding-top: 20px; }
.footer-links { margin-top: 12px; gap: 16px; }
.utility-bar { margin-top: 12px; gap: 10px; }
.smart-form { gap: 10px; }
.smart-output { margin-top: 12px; }
.recent-list { gap: 8px; margin-top: 10px; }
.recent-list a { padding: 7px 10px; }
.all-in-one-grid { gap: 12px; }
.result-inline { margin-top: 8px; }
.global-library-cta-wrap { margin: 14px 0 18px; display: flex; flex-wrap: wrap; gap: 10px; }
.global-library-cta-wrap .btn { box-shadow: 0 6px 14px rgba(0,0,0,.08); }
.category-grid-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px; }
.section-kicker { display: inline-block; margin-bottom: 8px; font-size: .78rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--accent-color); }
.blog-group { margin-top: 28px; }
.blog-group:first-of-type { margin-top: 0; }
.blog-group .feature-grid { margin-top: 12px; }

@media (max-width: 768px) {
  .main-content { padding: 20px 18px 30px; }
  .hero-section { margin-bottom: 18px; }
  .hero-section h1 { font-size: 1.75rem; }
  .hero-section p { font-size: .97rem; }
  .converter-card, .info-card, .placeholder-card { padding: 18px; margin-bottom: 16px; }
  .large-input { font-size: 1.45rem; padding: 13px 14px; }
  .link-card, .card, .compact-card { padding: 14px; }
  .seo-section h2 { font-size: 1.4rem; }
  .seo-section p, .seo-section li { font-size: .97rem; }
  .global-library-cta-wrap { margin: 10px 0 14px; }
}



.blog-content{max-width:860px}
.blog-content .story-intro{font-size:1.08rem;color:var(--text-color);line-height:1.75;margin-bottom:18px}
.blog-content h2{margin:28px 0 10px;font-size:1.55rem;color:var(--accent-color);letter-spacing:-0.02em}
.blog-content p{margin:0 0 14px;color:var(--text-muted);line-height:1.72}
.blog-content ul{margin:0 0 8px 20px;color:var(--text-muted)}
.blog-content li{margin:0 0 10px}
.blog-content a{color:var(--accent-color);text-decoration:none}
.blog-content a:hover{text-decoration:underline}
.blog-related-block{margin-top:34px;padding-top:20px;border-top:1px solid var(--border-color)}
.blog-related-block h2{margin:0 0 8px;font-size:1.5rem}
.related-copy{color:var(--text-muted);margin:0 0 16px}
.blog-link-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-top:8px}
.compact-link-card{padding:18px}
.compact-link-card h3{font-size:1.02rem;color:var(--text-color)}
.compact-link-card p{font-size:.94rem;color:var(--text-muted)}
.article-nav{display:flex;gap:12px;justify-content:space-between;flex-wrap:wrap;margin-top:20px}
.article-nav .btn{flex:1 1 220px}
@media (max-width:768px){
  .blog-content .story-intro{font-size:1rem}
  .blog-link-list{grid-template-columns:1fr}
  .article-nav{flex-direction:column}
}


/* V6.2.7 blog layout hotfix */
.link-card, .card { display:block; }
.blog-link-list > * { min-width:0; }
.article-nav .btn, .article-nav .btn.is-disabled { display:inline-flex; align-items:center; justify-content:center; text-align:center; }
.btn.is-disabled {
  opacity: 0.45;
  pointer-events: none;
  cursor: default;
  filter: grayscale(0.2);
  background: rgba(120, 132, 152, 0.18);
  border-color: rgba(120, 132, 152, 0.25);
  color: rgba(224, 232, 242, 0.72);
}
@media (max-width:768px){
  .blog-link-list { grid-template-columns:1fr; }
  .article-nav { flex-direction:column; }
}


/* V6.3.1 shoe size converter */
.converter-stack{display:grid;gap:18px}
.selector-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px}
.selector-grid label{display:block;font-size:.92rem;color:var(--text-muted);margin-bottom:8px}
.selector-grid select,.selector-grid input{width:100%;padding:14px 16px;border-radius:16px;border:1px solid var(--border-color);background:var(--input-bg);color:var(--text-color);font:inherit}
.result-hero{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px}
.result-chip{padding:16px 14px;border-radius:18px;background:rgba(74,163,255,.08);border:1px solid var(--border-color)}
.result-chip .k{display:block;font-size:.82rem;color:var(--text-muted);margin-bottom:6px;text-transform:uppercase;letter-spacing:.04em}
.result-chip .v{display:block;font-size:1.2rem;font-weight:700;color:var(--text-color)}
.size-table-wrap{overflow:auto}
.size-table{width:100%;border-collapse:collapse;font-size:.97rem}
.size-table th,.size-table td{padding:12px 10px;border-bottom:1px solid var(--border-color);text-align:left;white-space:nowrap}
.size-table th{color:var(--text-color);font-weight:700}
.size-table td{color:var(--text-muted)}
.helper-note{font-size:.93rem;color:var(--text-muted)}
@media (max-width:768px){
  .result-chip .v{font-size:1.05rem}
  .size-table th,.size-table td{padding:10px 8px;font-size:.92rem}
}


.footer-disclosure{margin-top:12px;font-size:.9rem;color:var(--text-muted)}
.affiliate-box{background:linear-gradient(180deg,rgba(30,41,59,.96),rgba(15,23,42,.96));padding:24px;border-radius:16px;border:1px solid var(--border-color);box-shadow:0 10px 18px rgba(0,0,0,.16);margin:24px 0 28px}
.affiliate-box h3{margin-bottom:10px;color:var(--accent-color);font-size:1.2rem}
.affiliate-box p{color:var(--text-muted);margin-bottom:14px}
.affiliate-note{font-size:.84rem;text-transform:none;letter-spacing:0;color:var(--text-muted);opacity:.95;margin-bottom:10px}
.affiliate-links{display:flex;flex-wrap:wrap;gap:10px}
.affiliate-pill{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;padding:11px 14px;border:1px solid var(--accent-color);border-radius:999px;color:var(--accent-color);font-weight:600;background:rgba(56,189,248,.06)}
.affiliate-pill:hover{background:rgba(56,189,248,.12)}
.affiliate-box-compact{margin-top:0}
.affiliate-home-strip{margin-bottom:28px}
.legal-content h2{font-size:1.25rem;margin:20px 0 10px;color:var(--accent-color)}
.legal-content p{margin-bottom:14px;color:var(--text-muted);font-size:1.02rem}
.recent-list{display:flex;flex-wrap:wrap;gap:10px}.recent-list a{display:inline-flex;padding:10px 14px;border-radius:999px;background:var(--input-bg);border:1px solid var(--border-color);text-decoration:none}.recent-list a:hover{border-color:var(--accent-color);color:var(--accent-color)}

/*test*/


.home-intro-grid,
.helper-grid {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  margin-top: 18px;
}
.intro-callout,
.helper-card {
  padding: 18px;
  border-radius: 14px;
  border: 1px solid var(--border-color);
  background: rgba(15,23,42,.45);
}
.intro-callout h3,
.helper-card h3 {
  margin-bottom: 8px;
  color: var(--accent-color);
}
.helper-card p,
.intro-callout p { color: var(--text-muted); margin-bottom: 0; }
.helper-list { padding-left: 18px; margin-top: 12px; }
.helper-list li { margin-bottom: 10px; color: var(--text-muted); }
.related-topic-links { display:flex; flex-wrap:wrap; gap:10px; margin-top:16px; }
.inline-intro-links { margin-top: 14px; }
.article-inline-box {
  margin: 24px 0;
  padding: 18px;
  border-radius: 14px;
  border: 1px solid var(--border-color);
  background: rgba(15,23,42,.4);
}
.article-inline-box h3 { margin-bottom: 10px; color: var(--accent-color); }
.blog-content .link-grid {
  display:grid;
  gap:12px;
  grid-template-columns: repeat(auto-fit, minmax(220px,1fr));
  margin-top:16px;
}
[data-theme="light"] .intro-callout,
[data-theme="light"] .helper-card,
[data-theme="light"] .article-inline-box {
  background: rgba(226,232,240,.45);
}


/* V6.6.1 strict patch: rendering and card consistency only */
.feature-grid > .card,
.feature-grid > .link-card,
.category-grid-2 > .card,
.category-grid-2 > .link-card,
.blog-grid > .card,
.blog-grid > .link-card {
  height: 100%;
}
.feature-grid .card,
.feature-grid .link-card,
.category-grid-2 .card,
.category-grid-2 .link-card,
.blog-grid .card,
.blog-grid .link-card {
  display: flex;
  flex-direction: column;
}
.feature-grid .card p,
.feature-grid .link-card p,
.category-grid-2 .card p,
.category-grid-2 .link-card p,
.blog-grid .card p,
.blog-grid .link-card p {
  overflow-wrap: anywhere;
}
.feature-grid .card a,
.feature-grid .link-card a,
.blog-grid .card a,
.blog-grid .link-card a {
  margin-top: auto;
}
.nav-menu a {
  overflow-wrap: anywhere;
}


/* V6.6.2 affiliate mapping patch */
.affiliate-box .content-list{
  margin: 12px 0 0;
  padding-left: 18px;
}
.affiliate-box .content-list li{
  margin-bottom: 8px;
}


/* V6.6.3 affiliate fine-tune */
.affiliate-box h3{
  line-height: 1.2;
}
.affiliate-box .affiliate-links{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}


/* V6.6.4 light mode fixes */
html[data-theme="light"] .affiliate-box {
  background: #ffffff;
  color: var(--text-color);
  border-color: var(--border-color);
  box-shadow: 0 8px 18px rgba(15,23,42,.06);
}
html[data-theme="light"] .affiliate-box h3,
html[data-theme="light"] .affiliate-box p,
html[data-theme="light"] .affiliate-box li,
html[data-theme="light"] .affiliate-box strong,
html[data-theme="light"] .affiliate-note {
  color: var(--text-color);
}
html[data-theme="light"] .affiliate-box .affiliate-note {
  color: var(--text-muted);
}
html[data-theme="light"] .affiliate-pill {
  background: rgba(2,132,199,.06);
  color: var(--accent-color);
  border-color: var(--accent-color);
}
html[data-theme="light"] .affiliate-pill:hover {
  background: rgba(2,132,199,.12);
}
html[data-theme="light"] .affiliate-box .content-list li {
  color: var(--text-color);
}
html[data-theme="light"] .affiliate-box .content-list li::marker {
  color: var(--accent-color);
}
html[data-theme="light"] .affiliate-box a {
  color: var(--accent-color);
}


html[data-theme="dark"] .affiliate-box,
:root .affiliate-box {
  background: linear-gradient(180deg, rgba(30,41,59,.96), rgba(15,23,42,.96));
}


/* V6.6.5 full theme audit patch */

/* Global theme-safe surfaces */
html[data-theme="light"] .card,
html[data-theme="light"] .converter-card,
html[data-theme="light"] .tool-card,
html[data-theme="light"] .faq-item,
html[data-theme="light"] .article-card,
html[data-theme="light"] .hero-card,
html[data-theme="light"] .feature-card,
html[data-theme="light"] .content-card,
html[data-theme="light"] .blog-card,
html[data-theme="light"] .result-card,
html[data-theme="light"] .guide-card,
html[data-theme="light"] .promo-card,
html[data-theme="light"] .affiliate-box,
html[data-theme="light"] .notice-card,
html[data-theme="light"] .info-box,
html[data-theme="light"] .tip-box,
html[data-theme="light"] .warning-box,
html[data-theme="light"] .ad-container,
html[data-theme="light"] .search-container,
html[data-theme="light"] .sidebar,
html[data-theme="light"] .main-content,
html[data-theme="light"] .footer {
  background: var(--card-bg, #ffffff);
  color: var(--text-color);
  border-color: var(--border-color);
}

/* Text consistency */
html[data-theme="light"] h1,
html[data-theme="light"] h2,
html[data-theme="light"] h3,
html[data-theme="light"] h4,
html[data-theme="light"] h5,
html[data-theme="light"] h6,
html[data-theme="light"] p,
html[data-theme="light"] li,
html[data-theme="light"] span,
html[data-theme="light"] strong,
html[data-theme="light"] label,
html[data-theme="light"] .result-note,
html[data-theme="light"] .muted,
html[data-theme="light"] .sidebar-tagline,
html[data-theme="light"] .nav-section-title,
html[data-theme="light"] .footer p,
html[data-theme="light"] .footer small {
  color: var(--text-color);
}

html[data-theme="light"] .result-note,
html[data-theme="light"] .sidebar-tagline,
html[data-theme="light"] .nav-section-title,
html[data-theme="light"] .footer small,
html[data-theme="light"] .affiliate-note {
  color: var(--text-muted, #64748b);
}

/* Links and nav */
html[data-theme="light"] a {
  color: inherit;
}
html[data-theme="light"] .nav-item,
html[data-theme="light"] .footer a,
html[data-theme="light"] .read-more,
html[data-theme="light"] .inline-link {
  color: var(--text-color);
}
html[data-theme="light"] .nav-item:hover,
html[data-theme="light"] .footer a:hover,
html[data-theme="light"] .read-more:hover,
html[data-theme="light"] .inline-link:hover {
  color: var(--accent-color);
}

/* Inputs and controls */
html[data-theme="light"] input,
html[data-theme="light"] select,
html[data-theme="light"] textarea,
html[data-theme="light"] .search-input {
  background: #ffffff;
  color: var(--text-color);
  border-color: var(--border-color);
}
html[data-theme="light"] input::placeholder,
html[data-theme="light"] textarea::placeholder,
html[data-theme="light"] .search-input::placeholder {
  color: var(--text-muted, #64748b);
}

/* Buttons and pills */
html[data-theme="light"] .theme-toggle,
html[data-theme="light"] .secondary-btn,
html[data-theme="light"] .chip,
html[data-theme="light"] .affiliate-pill {
  background: #ffffff;
  color: var(--accent-color);
  border-color: var(--accent-color);
}
html[data-theme="light"] .primary-btn,
html[data-theme="light"] .cta-btn,
html[data-theme="light"] .search-btn {
  background: var(--accent-color);
  color: #ffffff;
  border-color: var(--accent-color);
}

/* Lists, bullets and table cells */
html[data-theme="light"] .content-list li,
html[data-theme="light"] .faq-list li,
html[data-theme="light"] .feature-list li {
  color: var(--text-color);
}
html[data-theme="light"] .content-list li::marker,
html[data-theme="light"] .faq-list li::marker,
html[data-theme="light"] .feature-list li::marker {
  color: var(--accent-color);
}
html[data-theme="light"] th,
html[data-theme="light"] td {
  color: var(--text-color);
  border-color: var(--border-color);
}

/* Shadows and gradients that should not stay dark in light mode */
html[data-theme="light"] .hero-card,
html[data-theme="light"] .promo-card,
html[data-theme="light"] .affiliate-box,
html[data-theme="light"] .feature-card,
html[data-theme="light"] .guide-card {
  box-shadow: 0 8px 18px rgba(15,23,42,.06);
  background-image: none;
}

/* Explicit dark mode keepers */
html[data-theme="dark"] .affiliate-box,
html[data-theme="dark"] .hero-card.dark-surface,
html[data-theme="dark"] .promo-card.dark-surface {
  background-image: linear-gradient(180deg, rgba(30,41,59,.96), rgba(15,23,42,.96));
}


/* V6.6.6 final production candidate */
body{line-height:1.5}
.main-content{padding:32px 36px 42px;max-width:1060px}
.hero-section{margin-bottom:24px}
.hero-section h1{font-size:2.2rem;margin-bottom:10px}
.hero-section p{font-size:1rem;max-width:720px}
.converter-card,.info-card,.placeholder-card{padding:24px;margin-bottom:22px;border-radius:14px}
.converter-grid{gap:18px}
.large-input{padding:15px 18px;font-size:1.75rem}
.quick-values{margin-top:14px}
.quick-btn{padding:5px 10px}
.actions{margin-top:16px;gap:12px}
.btn{padding:12px 18px}
.link-card,.card{padding:16px}
.link-card h3,.card h3,.card h4{margin-bottom:6px}
.link-card p,.card p{font-size:.95rem}
.notice,.result-note,.mini-stat,.kpi-box{padding:13px 14px}
.seo-section{margin-top:28px}
.seo-section h2{font-size:1.7rem;margin-bottom:14px}
.seo-section h3{font-size:1.15rem;margin:20px 0 10px}
.seo-section p,.seo-section li{margin-bottom:10px;font-size:1rem;line-height:1.5}
.data-table{margin:14px 0}
.data-table th{padding:12px 14px}
.data-table td{padding:11px 14px}
.faq-container{margin-top:20px}
.faq-item{margin-bottom:14px;padding:16px 18px}
.faq-item h4{font-size:1.03rem;margin-bottom:8px}
.faq-item p{line-height:1.55}
.footer{margin-top:34px;padding-top:20px}
.footer-links{margin-top:12px;gap:18px}
.search-container{padding:14px 20px}
.sidebar-header{padding:20px}
.nav-menu{padding:6px 0 14px}
.nav-item{padding:10px 20px}

/* Converter menu dropdown */
.nav-group{margin:0 0 6px}
.nav-group summary{list-style:none}
.nav-group summary::-webkit-details-marker{display:none}
.nav-submenu{list-style:none;padding:6px 0 8px 0;margin:0}
.nav-submenu .nav-item{padding-left:36px;font-size:.93rem}
.nav-group .nav-item .nav-caret{margin-left:auto;transition:transform .2s ease}
.nav-group[open] .nav-item .nav-caret{transform:rotate(90deg)}
.nav-group .nav-item{user-select:none}
.nav-group .nav-item:hover{background:var(--hover-color);color:var(--accent-color)}

/* Root converter pages brought in line with standard sidebar */
.sidebar-header .theme-toggle{margin-top:12px}
.sidebar-tagline{display:block}

/* Shoe affiliate tidy */
.affiliate-box .content-list{margin:10px 0 0;padding-left:18px}
.affiliate-box .content-list li{margin-bottom:8px}

@media (max-width:768px){
  .main-content{padding:22px 18px 28px}
  .hero-section h1{font-size:1.9rem}
  .converter-card,.info-card,.placeholder-card{padding:18px}
  .large-input{font-size:1.45rem}
}


/* V6.6.7 compact spacing patch */
body{line-height:1.4}
.main-content{padding:24px 30px 34px;max-width:1020px}
.hero-section{margin-bottom:16px}
.hero-section h1{font-size:2.05rem;margin-bottom:8px;line-height:1.08}
.hero-section p{margin-bottom:0;line-height:1.35}
.converter-card,.info-card,.placeholder-card,.faq-item,.affiliate-box,.result-card,.content-card,.guide-card,.promo-card{
  padding:18px;
  margin-bottom:16px;
  border-radius:12px;
}
.converter-grid{gap:14px}
.link-card,.card,.tool-card{padding:14px}
.link-card h3,.card h3,.card h4,.tool-card h3{margin-bottom:4px;line-height:1.15}
.link-card p,.card p,.tool-card p{font-size:.94rem;line-height:1.38}
.seo-section{margin-top:20px}
.seo-section h2{font-size:1.5rem;margin-bottom:10px;line-height:1.12}
.seo-section h3{font-size:1.06rem;margin:14px 0 8px}
.seo-section p,.seo-section li{margin:0 0 8px;font-size:.97rem;line-height:1.42}
.data-table{margin:10px 0}
.data-table th,.data-table td{padding:9px 12px}
.faq-container{margin-top:14px}
.faq-item h4{font-size:1rem;margin-bottom:6px;line-height:1.18}
.faq-item p{margin:0;line-height:1.42}
.quick-values{margin-top:10px}
.quick-btn{padding:4px 9px}
.actions{margin-top:12px;gap:10px}
.btn,.primary-btn,.secondary-btn,.cta-btn{padding:10px 14px}
.notice,.result-note,.mini-stat,.kpi-box{padding:10px 12px}
.search-container{padding:12px 16px}
.sidebar-header{padding:16px}
.nav-menu{padding:4px 0 10px}
.nav-item{padding:8px 16px}
.nav-submenu .nav-item{padding-left:30px}
.footer{margin-top:24px;padding-top:16px}
.footer-links{margin-top:8px;gap:12px}
.content-list li{margin-bottom:6px}
@media (max-width:768px){
  .main-content{padding:18px 14px 24px}
  .hero-section h1{font-size:1.78rem}
  .converter-card,.info-card,.placeholder-card,.faq-item,.affiliate-box{padding:15px}
  .link-card,.card,.tool-card{padding:12px}
  .large-input{padding:13px 14px;font-size:1.35rem}
}


/* V6.6.8 button spacing patch */
.inline-actions,
.chips,
.quick-values,
.button-group,
.quick-links,
.pill-row,
.tag-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

.inline-actions a,
.inline-actions button,
.chips a,
.chips button,
.quick-values a,
.quick-values button,
.button-group a,
.button-group button,
.quick-links a,
.quick-links button,
.pill-row a,
.pill-row button,
.tag-row a,
.tag-row button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  flex: 0 0 auto;
  margin: 0;
}

.chip,
.affiliate-pill,
.quick-btn,
.inline-actions .btn,
.inline-actions .primary-btn,
.inline-actions .secondary-btn,
.inline-actions .cta-btn {
  white-space: nowrap;
  flex: 0 0 auto;
}

.inline-actions > *,
.chips > *,
.quick-values > *,
.button-group > *,
.quick-links > *,
.pill-row > *,
.tag-row > * {
  min-width: 0;
  max-width: 100%;
}

@media (max-width: 768px) {
  .inline-actions,
  .chips,
  .quick-values,
  .button-group,
  .quick-links,
  .pill-row,
  .tag-row {
    gap: 8px;
  }
}


/* V6.6.9 home chip row fix */
.inline-actions,
.chips,
.quick-values,
.button-group,
.quick-links,
.pill-row,
.tag-row {
  row-gap: 10px;
}

.chips,
.inline-actions {
  position: relative;
  z-index: 2;
  margin-bottom: 14px;
}

.chips a,
.inline-actions a,
.chips .chip,
.inline-actions .chip {
  position: relative;
  z-index: 3;
}

.chip {
  line-height: 1.2;
  padding: 10px 18px;
}

.section .chips + *,
.section .inline-actions + * {
  margin-top: 0 !important;
  clear: both;
}

.hero-section .chips,
.hero-card .chips,
.converter-card .chips,
.info-card .chips,
.placeholder-card .chips {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  align-content: flex-start;
}

/* Prevent next cards from visually cutting through the chip row */
.link-card,
.card,
.converter-card,
.info-card,
.placeholder-card {
  position: relative;
  z-index: 1;
}

@media (max-width: 768px) {
  .chips,
  .inline-actions {
    margin-bottom: 12px;
  }
  .chip {
    padding: 9px 14px;
  }
}


/* V6.6.10 homepage-specific chip overlap fix */
.home-chip-row,
.home-quick-links,
.home-use-case-links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 14px 0 22px 0 !important;
  position: relative;
  z-index: 3;
}
.home-chip-row .chip,
.home-quick-links .chip,
.home-use-case-links .chip,
.home-chip-row a,
.home-quick-links a,
.home-use-case-links a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  margin: 0;
  position: relative;
  z-index: 3;
}
.home-chip-row + .converter-card,
.home-chip-row + .info-card,
.home-chip-row + .placeholder-card,
.home-chip-row + .card,
.home-chip-row + section,
.home-quick-links + .converter-card,
.home-quick-links + .info-card,
.home-quick-links + .placeholder-card,
.home-quick-links + .card,
.home-quick-links + section,
.home-use-case-links + .converter-card,
.home-use-case-links + .info-card,
.home-use-case-links + .placeholder-card,
.home-use-case-links + .card,
.home-use-case-links + section {
  margin-top: 0 !important;
  clear: both;
  position: relative;
  z-index: 1;
}
@media (max-width: 768px) {
  .home-chip-row,
  .home-quick-links,
  .home-use-case-links {
    margin: 12px 0 18px 0 !important;
    gap: 8px;
  }
}


.home-popular-section{
  position: relative;
  z-index: 1;
  margin-top: 0 !important;
}


/* V6.6.11 homepage button bottom spacing fix */
.home-chip-row{
  margin: 14px 0 0 0 !important;
  padding-bottom: 18px !important;
}
.home-popular-section{
  margin-top: 18px !important;
}
.home-chip-row + .home-popular-section,
.home-chip-row + section.home-popular-section,
.home-chip-row + .converter-card.home-popular-section,
.home-chip-row + .info-card.home-popular-section,
.home-chip-row + .placeholder-card.home-popular-section{
  margin-top: 18px !important;
}
@media (max-width: 768px){
  .home-chip-row{
    padding-bottom: 14px !important;
  }
  .home-popular-section{
    margin-top: 14px !important;
  }
}


/* Final list spacing consistency patch */
.content-block ul, .converter-card ul, .info-card ul, .seo-section ul, .card ul, .affiliate-box ul, .faq-list ul {
  margin: 12px 0 16px 20px;
  padding: 0;
}
.content-block li, .converter-card li, .info-card li, .seo-section li, .card li, .affiliate-box li, .faq-list li {
  margin-bottom: 6px;
  line-height: 1.6;
  padding-left: 4px;
}


/* V1.1 content consistency patch */
.content-list,
.seo-section ul,
.info-card ul,
.footer-links {
  margin-top: 10px;
}
.content-list,
.seo-section ul,
.info-card ul {
  padding-left: 1.15rem;
}
.content-list li,
.seo-section li,
.info-card li {
  margin: 0 0 6px 0;
  padding-left: 4px;
  line-height: 1.6;
}
.related-links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 12px;
}
.info-card h2,
.info-card h3 {
  margin-bottom: 10px;
}
.info-card p + p {
  margin-top: 10px;
}
.info-card p + ul,
.info-card h3 + ul,
.info-card h2 + ul {
  margin-top: 10px;
}