body.front-polish {
  --fp-bg: #f6faf7;
  --fp-surface: rgba(255, 255, 255, 0.92);
  --fp-surface-strong: #ffffff;
  --fp-soft: #eef7f0;
  --fp-line: rgba(41, 84, 55, 0.12);
  --fp-line-strong: rgba(41, 84, 55, 0.18);
  --fp-text: #1f2a23;
  --fp-muted: #5d6b61;
  --fp-brand: #17653a;
  --fp-brand-strong: #0f4f2c;
  --fp-brand-soft: #e4f2e8;
  --fp-shadow: 0 24px 60px rgba(23, 47, 33, 0.08);
  --fp-shadow-soft: 0 16px 34px rgba(23, 47, 33, 0.05);
  background:
    radial-gradient(circle at top left, rgba(34, 139, 74, 0.09) 0, transparent 24%),
    radial-gradient(circle at top right, rgba(15, 79, 44, 0.08) 0, transparent 22%),
    linear-gradient(180deg, #f0f7f1 0, var(--fp-bg) 240px, #fcfefd 100%);
  color: var(--fp-text);
}

body.front-polish.theme-hello {
  --fp-surface: rgba(9, 22, 46, 0.78);
  --fp-surface-strong: rgba(10, 24, 50, 0.92);
  --fp-soft: rgba(59, 130, 246, 0.16);
  --fp-line: rgba(144, 181, 255, 0.18);
  --fp-line-strong: rgba(144, 181, 255, 0.28);
  --fp-text: #f3f7ff;
  --fp-muted: #a8bbdc;
  --fp-brand: #78a9ff;
  --fp-brand-strong: #aecdff;
  --fp-brand-soft: rgba(120, 169, 255, 0.16);
  --fp-shadow: 0 30px 70px rgba(0, 0, 0, 0.28);
  --fp-shadow-soft: 0 18px 36px rgba(0, 0, 0, 0.18);
}

body.front-polish::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background-image: linear-gradient(rgba(23, 101, 58, 0.03) 1px, transparent 1px), linear-gradient(90deg, rgba(23, 101, 58, 0.03) 1px, transparent 1px);
  background-size: 28px 28px;
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.34), transparent 78%);
  opacity: 0.55;
}

body.front-polish.theme-hello::before {
  background-image: linear-gradient(rgba(120, 169, 255, 0.05) 1px, transparent 1px), linear-gradient(90deg, rgba(120, 169, 255, 0.05) 1px, transparent 1px);
  opacity: 0.38;
}

body.front-polish a,
body.front-polish button,
body.front-polish input,
body.front-polish select,
body.front-polish textarea {
  transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

body.front-polish .wrap,
body.front-polish .container {
  position: relative;
  z-index: 1;
}

body.front-polish .top,
body.front-polish .topbar,
body.front-polish .topbar-play {
  position: sticky;
  top: 0;
  z-index: 30;
  backdrop-filter: blur(18px);
  background: color-mix(in srgb, var(--fp-bg) 78%, transparent);
  border-bottom-color: var(--fp-line) !important;
}

body.front-polish.theme-hello .top,
body.front-polish.theme-hello .topbar,
body.front-polish.theme-hello .topbar-play {
  background: rgba(6, 17, 38, 0.74);
}

body.front-polish .hero,
body.front-polish .hero-card,
body.front-polish .side-card,
body.front-polish .results-card,
body.front-polish .panel,
body.front-polish .card,
body.front-polish .list,
body.front-polish .section,
body.front-polish .stat,
body.front-polish .notice,
body.front-polish .metric,
body.front-polish .timeline-item,
body.front-polish .result,
body.front-polish .related-card,
body.front-polish .seo-card,
body.front-polish .comment-card,
body.front-polish .comment-item,
body.front-polish .footer-box,
body.front-polish .platform-card,
body.front-polish .product-card,
body.front-polish .category-card,
body.front-polish .recent-card,
body.front-polish .strip-card,
body.front-polish .capability-card,
body.front-polish .carousel-slide,
body.front-polish .shelf-card {
  background: var(--fp-surface);
  border-color: var(--fp-line) !important;
  box-shadow: var(--fp-shadow-soft);
}

body.front-polish .hero,
body.front-polish .hero-card,
body.front-polish .results-card,
body.front-polish .panel,
body.front-polish .list,
body.front-polish .footer-box,
body.front-polish .carousel-slide {
  box-shadow: var(--fp-shadow);
}

body.front-polish .hero,
body.front-polish .hero-card,
body.front-polish .panel,
body.front-polish .list,
body.front-polish .results-card,
body.front-polish .card,
body.front-polish .section,
body.front-polish .footer-box {
  border-radius: 26px;
}

body.front-polish .nav a,
body.front-polish .topnav a,
body.front-polish .tabs a,
body.front-polish .letters a,
body.front-polish .play-primary-tabs a,
body.front-polish .play-subnav a,
body.front-polish .header-links a,
body.front-polish .panel-links a,
body.front-polish .sitelinks a,
body.front-polish .quick a {
  border: 1px solid transparent;
  background: transparent;
  color: var(--fp-muted) !important;
}

body.front-polish .nav a:hover,
body.front-polish .topnav a:hover,
body.front-polish .tabs a:hover,
body.front-polish .letters a:hover,
body.front-polish .play-primary-tabs a:hover,
body.front-polish .play-subnav a:hover,
body.front-polish .header-links a:hover,
body.front-polish .panel-links a:hover,
body.front-polish .sitelinks a:hover,
body.front-polish .quick a:hover {
  background: var(--fp-soft);
  border-color: var(--fp-line);
  color: var(--fp-brand) !important;
  transform: translateY(-1px);
}

body.front-polish .tabs a.active,
body.front-polish .play-primary-tabs a.active,
body.front-polish .hero-actions .primary,
body.front-polish .actions .primary,
body.front-polish .btn,
body.front-polish .btn-primary,
body.front-polish .search-form button,
body.front-polish .comment-form button,
body.front-polish .form button,
body.front-polish button[type="submit"] {
  background: linear-gradient(135deg, var(--fp-brand) 0, var(--fp-brand-strong) 100%) !important;
  color: #fff !important;
  box-shadow: 0 14px 26px rgba(15, 79, 44, 0.18);
}

body.front-polish .actions .ghost,
body.front-polish .actions .secondary,
body.front-polish .btn-secondary,
body.front-polish .hero-actions .secondary,
body.front-polish .section-title a {
  background: var(--fp-surface-strong) !important;
  border-color: var(--fp-line-strong) !important;
  color: var(--fp-text) !important;
}

body.front-polish .actions .primary:hover,
body.front-polish .btn:hover,
body.front-polish .btn-primary:hover,
body.front-polish .hero-actions .primary:hover,
body.front-polish .search-form button:hover,
body.front-polish .comment-form button:hover,
body.front-polish .form button:hover,
body.front-polish button[type="submit"]:hover {
  transform: translateY(-1px);
  box-shadow: 0 18px 28px rgba(15, 79, 44, 0.22);
}

body.front-polish .eyebrow,
body.front-polish .meta span,
body.front-polish .meta-pill,
body.front-polish .chips span,
body.front-polish .summary span,
body.front-polish .summary-row span,
body.front-polish .sub span,
body.front-polish .pill,
body.front-polish .badge {
  background: var(--fp-brand-soft) !important;
  color: var(--fp-brand) !important;
  border-color: transparent !important;
}

body.front-polish .eyebrow::before {
  box-shadow: 0 0 0 6px color-mix(in srgb, var(--fp-brand) 14%, transparent);
}

body.front-polish .logo,
body.front-polish .icon,
body.front-polish .result-icon,
body.front-polish .hero-logo {
  background: color-mix(in srgb, var(--fp-brand-soft) 82%, var(--fp-surface-strong)) !important;
  border-color: var(--fp-line-strong) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

body.front-polish .result,
body.front-polish .row,
body.front-polish .timeline-item,
body.front-polish .comment-item,
body.front-polish .list div,
body.front-polish .pill,
body.front-polish .field input,
body.front-polish .field select,
body.front-polish .field textarea,
body.front-polish .form input,
body.front-polish .form select,
body.front-polish .form textarea,
body.front-polish .search-form input,
body.front-polish .search-form select,
body.front-polish .table th,
body.front-polish .table td,
body.front-polish .note {
  border-color: var(--fp-line) !important;
}

body.front-polish .field input:focus,
body.front-polish .field select:focus,
body.front-polish .field textarea:focus,
body.front-polish .form input:focus,
body.front-polish .form select:focus,
body.front-polish .form textarea:focus,
body.front-polish .search-form input:focus,
body.front-polish .search-form select:focus {
  outline: none;
  border-color: color-mix(in srgb, var(--fp-brand) 46%, white) !important;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--fp-brand) 10%, transparent);
}

body.front-polish .hero-brief {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 18px;
}

body.front-polish .hero-brief-card {
  padding: 16px 18px;
  border: 1px solid var(--fp-line);
  border-radius: 20px;
  background: color-mix(in srgb, var(--fp-surface) 82%, white);
  box-shadow: var(--fp-shadow-soft);
}

body.front-polish.theme-hello .hero-brief-card {
  background: color-mix(in srgb, var(--fp-surface) 88%, transparent);
}

body.front-polish .hero-brief-card strong {
  display: block;
  font-size: clamp(24px, 3vw, 32px);
  line-height: 1;
  color: var(--fp-text);
}

body.front-polish .hero-brief-card span {
  display: block;
  margin-top: 8px;
  color: var(--fp-muted);
  font-size: 13px;
  line-height: 1.65;
}

body.front-polish .hero .hero-card,
body.front-polish .hero .side-card,
body.front-polish .hero .panel,
body.front-polish .hero .hero-highlight,
body.front-polish .hero .hero-summary-card,
body.front-polish .hero .score-card,
body.front-polish .hero .hero-brief-card,
body.front-polish .hero .stat,
body.front-polish .hero .summary-row span,
body.front-polish .hero .chips span,
body.front-polish .hero .actions a,
body.front-polish .hero .hero-actions a {
  animation: fpRiseIn 560ms ease both;
}

body.front-polish .hero .hero-brief-card:nth-child(1),
body.front-polish .hero .hero-summary-card:nth-child(1),
body.front-polish .hero .score-card:nth-child(1),
body.front-polish .hero .summary-row span:nth-child(1) {
  animation-delay: 60ms;
}

body.front-polish .hero .hero-brief-card:nth-child(2),
body.front-polish .hero .hero-summary-card:nth-child(2),
body.front-polish .hero .score-card:nth-child(2),
body.front-polish .hero .summary-row span:nth-child(2) {
  animation-delay: 120ms;
}

body.front-polish .hero .hero-brief-card:nth-child(3),
body.front-polish .hero .hero-summary-card:nth-child(3),
body.front-polish .hero .score-card:nth-child(3),
body.front-polish .hero .summary-row span:nth-child(3) {
  animation-delay: 180ms;
}

body.front-polish .hero .hero-brief-card:nth-child(4),
body.front-polish .hero .summary-row span:nth-child(4) {
  animation-delay: 240ms;
}

body.front-polish .hero .actions a:nth-child(1),
body.front-polish .hero .hero-actions a:nth-child(1) {
  animation-delay: 130ms;
}

body.front-polish .hero .actions a:nth-child(2),
body.front-polish .hero .hero-actions a:nth-child(2) {
  animation-delay: 190ms;
}

body.front-polish .hero .actions a:nth-child(3),
body.front-polish .hero .hero-actions a:nth-child(3) {
  animation-delay: 250ms;
}

@keyframes fpRiseIn {
  from {
    opacity: 0;
    transform: translateY(18px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

body.front-polish .muted,
body.front-polish .hero p,
body.front-polish .card p,
body.front-polish .meta p,
body.front-polish .value span,
body.front-polish .field-note,
body.front-polish .footer,
body.front-polish .note,
body.front-polish .desc,
body.front-polish .url,
body.front-polish .panel-block p,
body.front-polish .side-item span,
body.front-polish .comment-item p,
body.front-polish .preview-copy span {
  color: var(--fp-muted) !important;
}

body.front-polish h1,
body.front-polish .hero-title,
body.front-polish .title,
body.front-polish .meta strong,
body.front-polish .preview-copy strong,
body.front-polish .section h2,
body.front-polish .panel h2,
body.front-polish .card strong,
body.front-polish .value strong,
body.front-polish .stat strong,
body.front-polish .metric b {
  color: var(--fp-text);
}

body.front-polish .result:hover,
body.front-polish .card:hover,
body.front-polish .related-card:hover,
body.front-polish .category-card:hover,
body.front-polish .recent-card:hover,
body.front-polish .product-card:hover,
body.front-polish .platform-card:hover,
body.front-polish .strip-card:hover,
body.front-polish .capability-card:hover,
body.front-polish .section:hover {
  transform: translateY(-2px);
  box-shadow: 0 22px 40px rgba(23, 47, 33, 0.1);
}

body.front-polish .row::before,
body.front-polish .result::before {
  width: 5px;
  opacity: 0.9;
}

body.front-polish .table th {
  background: color-mix(in srgb, var(--fp-soft) 74%, white) !important;
}

body.front-polish .note,
body.front-polish .notice,
body.front-polish .okbox {
  background: color-mix(in srgb, var(--fp-soft) 64%, white) !important;
}

@media (max-width: 780px) {
  body.front-polish .top,
  body.front-polish .topbar,
  body.front-polish .topbar-play {
    position: relative;
  }

  body.front-polish .hero,
  body.front-polish .hero-card,
  body.front-polish .panel,
  body.front-polish .results-card,
  body.front-polish .list,
  body.front-polish .card {
    border-radius: 22px;
  }

  body.front-polish .hero-brief {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  body.front-polish .hero-brief-card {
    padding: 13px 14px;
    border-radius: 18px;
  }

  body.front-polish .hero-brief-card strong {
    font-size: clamp(20px, 5vw, 28px);
  }

  body.front-polish .hero-brief-card span {
    font-size: 12px;
    margin-top: 5px;
  }

  body.front-polish .result:hover,
  body.front-polish .card:hover,
  body.front-polish .related-card:hover,
  body.front-polish .category-card:hover,
  body.front-polish .recent-card:hover,
  body.front-polish .product-card:hover,
  body.front-polish .platform-card:hover,
  body.front-polish .strip-card:hover,
  body.front-polish .capability-card:hover,
  body.front-polish .section:hover {
    transform: none;
    box-shadow: var(--fp-shadow-soft);
  }
}

@media (max-width: 580px) {
  body.front-polish .hero-brief {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  body.front-polish .hero-actions,
  body.front-polish .actions {
    flex-direction: column;
    gap: 8px;
  }

  body.front-polish .hero-actions a,
  body.front-polish .actions a {
    width: 100%;
    justify-content: center;
    text-align: center;
  }

  body.front-polish .hero,
  body.front-polish .hero-card,
  body.front-polish .panel,
  body.front-polish .results-card,
  body.front-polish .list,
  body.front-polish .card {
    border-radius: 18px;
  }

  body.front-polish .hero-brief-card {
    border-radius: 16px;
    padding: 12px 14px;
  }

  body.front-polish .top,
  body.front-polish .topbar {
    gap: 10px;
    padding-bottom: 12px;
  }

  body.front-polish .nav,
  body.front-polish .topnav {
    width: 100%;
    overflow-x: auto;
    flex-wrap: nowrap;
    padding-bottom: 2px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  body.front-polish .nav::-webkit-scrollbar,
  body.front-polish .topnav::-webkit-scrollbar {
    display: none;
  }

  body.front-polish .nav a,
  body.front-polish .topnav a {
    white-space: nowrap;
    flex-shrink: 0;
  }

  body.front-polish .tabs,
  body.front-polish .play-primary-tabs,
  body.front-polish .play-subnav,
  body.front-polish .letters {
    overflow-x: auto;
    flex-wrap: nowrap;
    padding-bottom: 2px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  body.front-polish .tabs::-webkit-scrollbar,
  body.front-polish .play-primary-tabs::-webkit-scrollbar,
  body.front-polish .play-subnav::-webkit-scrollbar,
  body.front-polish .letters::-webkit-scrollbar {
    display: none;
  }

  body.front-polish .tabs a,
  body.front-polish .play-primary-tabs a,
  body.front-polish .play-subnav a,
  body.front-polish .letters a {
    white-space: nowrap;
    flex-shrink: 0;
  }

  body.front-polish h1 {
    font-size: clamp(26px, 7.5vw, 36px) !important;
    letter-spacing: -0.035em;
  }

  body.front-polish .search-form button,
  body.front-polish .form button,
  body.front-polish .comment-form button,
  body.front-polish button[type="submit"] {
    width: 100%;
  }
}
/* ── Page shell: shared layout for /pages/*.php ────────────────────────── */
body.front-polish {
  --bg: var(--fp-bg);
  --surface: #fff;
  --soft: var(--fp-soft);
  --line: var(--fp-line-strong);
  --text: var(--fp-text);
  --muted: var(--fp-muted);
  --brand: var(--fp-brand);
  --brand-soft: var(--fp-brand-soft);
  --shadow: var(--fp-shadow-soft);
  font-family: "Avenir Next","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
}
body.front-polish *{box-sizing:border-box}
body.front-polish a{text-decoration:none;color:inherit}

body.front-polish .wrap{width:min(1240px,calc(100% - 32px));margin:0 auto}
body.front-polish .container{max-width:1120px;margin:0 auto;padding:0 20px}

/* header / nav */
body.front-polish .top,
body.front-polish .topbar{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 0;border-bottom:1px solid var(--line)}
body.front-polish .top img,
body.front-polish .topbar img{width:188px;height:auto;display:block}
body.front-polish .nav,
body.front-polish .topnav{display:flex;gap:8px;flex-wrap:wrap}
body.front-polish .nav a,
body.front-polish .topnav a{padding:9px 13px;border-radius:12px;background:transparent;border:1px solid transparent;color:var(--muted);font-size:14px;font-weight:700}
body.front-polish .nav a:hover,
body.front-polish .topnav a:hover{background:var(--soft);color:var(--text)}

/* hero / eyebrow */
body.front-polish .hero{padding:28px;border:1px solid var(--line);border-radius:28px;background:#fff;box-shadow:var(--shadow);margin-bottom:20px}
body.front-polish .hero h1{margin:14px 0 10px;font-size:clamp(32px,4.5vw,52px);line-height:1.06;letter-spacing:-.04em}
body.front-polish .hero p{margin:0;color:var(--muted);line-height:1.8;max-width:860px}
body.front-polish .eyebrow{display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border-radius:999px;background:var(--brand-soft);color:var(--brand);font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
body.front-polish .eyebrow:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--brand)}

/* section / panel / card */
body.front-polish .section,
body.front-polish .panel{padding:24px;border:1px solid var(--line);border-radius:24px;background:#fff;box-shadow:var(--shadow)}
body.front-polish .card{padding:22px;border:1px solid var(--line);border-radius:22px;background:#fff;box-shadow:var(--shadow)}
body.front-polish .card strong,
body.front-polish .section h2,
body.front-polish .panel h2{margin:0 0 10px;font-size:22px}
body.front-polish .card p,
body.front-polish .section p{margin:8px 0;color:var(--muted);line-height:1.8}

/* chips / tags */
body.front-polish .chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
body.front-polish .chips span{padding:7px 11px;border-radius:999px;background:var(--soft);color:var(--brand);font-size:13px;font-weight:700}

/* actions */
body.front-polish .actions,
body.front-polish .hero-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
body.front-polish .actions a,
body.front-polish .hero-actions a{padding:10px 16px;border-radius:999px;font-weight:800;font-size:14px}
body.front-polish .actions .primary,
body.front-polish .hero-actions .primary{background:var(--brand);color:#fff}
body.front-polish .actions .secondary,
body.front-polish .hero-actions .secondary{background:var(--soft);color:var(--brand)}
body.front-polish .actions .ghost{border:1px solid var(--line);background:#fff;color:var(--text)}

/* form elements */
body.front-polish .form,
body.front-polish .form-wrap{display:grid;gap:12px}
body.front-polish .form input,
body.front-polish .form select,
body.front-polish .form textarea,
body.front-polish .field input,
body.front-polish .field select,
body.front-polish .field textarea{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:14px;font:inherit;background:#fff;color:var(--text)}
body.front-polish .form button,
body.front-polish .btn{border:0;border-radius:999px;padding:12px 18px;background:var(--brand);color:#fff;font-weight:800;cursor:pointer;font:inherit}
body.front-polish .field{display:grid;gap:6px}
body.front-polish .field label{font-weight:800;font-size:14px}

/* messages */
body.front-polish .msg.ok{background:#e6f4ea;color:#137333;padding:12px 14px;border-radius:14px}
body.front-polish .msg.err{background:#fce8e6;color:#c5221f;padding:12px 14px;border-radius:14px}
body.front-polish .note{padding:16px;border-radius:16px;background:#fff8eb;border:1px solid #f2d7a6;color:#b54708}

/* breadcrumb */
body.front-polish .breadcrumb{display:flex;flex-wrap:wrap;gap:6px;align-items:center;padding:12px 0;color:var(--muted);font-size:13px;font-weight:600}
body.front-polish .breadcrumb a{color:var(--brand)}
body.front-polish .breadcrumb a:hover{text-decoration:underline}
body.front-polish .breadcrumb .sep{color:var(--line);user-select:none}

/* footer */
body.front-polish .site-footer{border-top:1px solid var(--line);padding:28px 0 40px;margin-top:48px;color:var(--muted);font-size:13px}
body.front-polish .footer-links{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:12px}
body.front-polish .footer-links a{color:var(--muted);font-weight:600}
body.front-polish .footer-links a:hover{color:var(--text)}
body.front-polish .footer-copy{margin:0;color:var(--muted)}

/* metric / stat tiles */
body.front-polish .metric,
body.front-polish .stat{padding:18px;border:1px solid var(--line);border-radius:18px;background:#fff}
body.front-polish .metric b,
body.front-polish .stat strong,
body.front-polish .stat b{display:block;font-size:28px;color:var(--brand);line-height:1.06}
body.front-polish .metric span,
body.front-polish .stat span{display:block;margin-top:6px;color:var(--muted);font-size:13px}