:root {
  --sun-bg: #ffffff;
  --sun-text: #111827;
  --sun-muted: #6b7280;
  --sun-border: #e5e7eb;
  --sun-soft: #f6f7f9;
  --sun-primary: #0b66ff;
  --sun-shadow: 0 22px 45px rgba(15, 23, 42, .12);
}
html.dark {
  --sun-bg: #0f172a;
  --sun-text: #f8fafc;
  --sun-muted: #94a3b8;
  --sun-border: #243244;
  --sun-soft: #172033;
  --sun-primary: #60a5fa;
  --sun-shadow: 0 22px 45px rgba(0, 0, 0, .32);
}
body.sun-public-enhanced {
  background: var(--sun-bg) !important;
  color: var(--sun-text) !important;
}
html.sun-auth-page body.sun-public-enhanced {
  overflow-x: hidden;
}
.sun-public-nav {
  position: fixed;
  inset: 0 0 auto 0;
  height: 58px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 0 22px;
  z-index: 9998;
  background: color-mix(in srgb, var(--sun-bg) 92%, transparent);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid color-mix(in srgb, var(--sun-border) 70%, transparent);
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.sun-public-nav * { box-sizing: border-box; letter-spacing: 0; }
.sun-nav-tools { display: flex; align-items: center; justify-content: flex-end; gap: 12px; width: 100%; }
.sun-nav-left, .sun-nav-right, .sun-nav-links { display: flex; align-items: center; gap: 10px; }
.sun-brand { display: inline-flex; align-items: center; gap: 10px; color: var(--sun-text); text-decoration: none; font-size: 18px; font-weight: 700; white-space: nowrap; }
.sun-mark { width: 24px; height: 24px; border-radius: 999px; display: grid; place-items: center; color: #fff; font-size: 14px; background: conic-gradient(from 220deg, #06b6d4, #8b5cf6, #ec4899, #22d3ee, #06b6d4); box-shadow: 0 6px 18px rgba(59, 130, 246, .22); }
.sun-nav-link { color: var(--sun-text); text-decoration: none; font-size: 14px; font-weight: 650; padding: 8px 10px; border-radius: 8px; line-height: 1; }
.sun-nav-link:hover, .sun-nav-link.sun-active { background: var(--sun-soft); color: var(--sun-text); }
.sun-pill { min-height: 38px; border: 1px solid color-mix(in srgb, var(--sun-border) 80%, transparent); border-radius: 999px; background: color-mix(in srgb, var(--sun-soft) 94%, var(--sun-bg)); color: var(--sun-text); padding: 10px 16px; font-size: 15px; font-weight: 700; line-height: 1; text-decoration: none; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 7px; box-shadow: 0 8px 20px rgba(15, 23, 42, .06); transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.sun-pill:hover { transform: translateY(-1px); box-shadow: 0 12px 26px rgba(15, 23, 42, .1); }
.sun-theme-pill { width: 42px; padding-inline: 0; font-size: 17px; }
.sun-announcement-pill { padding-inline: 18px; }
.sun-register { background: #0b66ff; color: #fff !important; border-radius: 0; padding-inline: 12px; }
.sun-public-enhanced .sun-hide-original-nav header,
.sun-public-enhanced .sun-hide-original-nav nav { display: none !important; }
html.sun-auth-page body.sun-public-enhanced #app { min-height: 100vh; background: var(--sun-bg) !important; }
html.sun-auth-page body.sun-public-enhanced main { min-height: 100vh !important; display: flex !important; align-items: center !important; justify-content: center !important; padding: 138px 16px 96px !important; background: var(--sun-bg) !important; contain: layout paint; }
html.sun-auth-page body.sun-public-enhanced main > * { max-width: 420px !important; width: min(420px, calc(100vw - 32px)) !important; min-height: 420px !important; margin-inline: auto !important; transform: translateZ(0); will-change: opacity, transform; transition: opacity .18s ease, transform .18s ease; }
html.sun-auth-page body.sun-public-enhanced.sun-route-settling main > * { opacity: .96; transform: translate3d(0, 3px, 0); }
html.sun-auth-page body.sun-public-enhanced main div:has(> form),
html.sun-auth-page body.sun-public-enhanced main [class*="card"]:has(form),
html.sun-auth-page body.sun-public-enhanced main [class*="auth" i]:has(form) { background: var(--sun-bg) !important; border: 1px solid var(--sun-border) !important; border-radius: 12px !important; box-shadow: 0 18px 38px rgba(15, 23, 42, .1) !important; transform: translateZ(0); backface-visibility: hidden; }
html.sun-auth-page body.sun-public-enhanced button[type="submit"],
html.sun-auth-page body.sun-public-enhanced form button:not([type]),
html.sun-auth-page body.sun-public-enhanced form button[type="button"] { border-radius: 999px !important; }
.sun-auth-brand { position: fixed; top: 112px; left: 50%; transform: translateX(-50%); display: inline-flex; align-items: center; gap: 12px; font-weight: 700; font-size: 24px; line-height: 1; color: var(--sun-text); z-index: 5; pointer-events: none; white-space: nowrap; }
.sun-public-page { min-height: 100vh; padding: 92px 20px 72px; background: var(--sun-bg); color: var(--sun-text); font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.sun-public-inner { width: min(1120px, 100%); margin: 0 auto; }
.sun-page-kicker { color: var(--sun-primary); font-size: 13px; font-weight: 750; margin-bottom: 10px; }
.sun-page-title { font-size: clamp(30px, 4vw, 52px); line-height: 1.08; margin: 0 0 14px; font-weight: 800; letter-spacing: 0; }
.sun-page-desc { margin: 0 0 28px; color: var(--sun-muted); font-size: 16px; line-height: 1.7; max-width: 720px; }
.sun-card-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.sun-card { border: 1px solid var(--sun-border); border-radius: 12px; padding: 22px; background: color-mix(in srgb, var(--sun-bg) 96%, var(--sun-soft)); box-shadow: 0 12px 28px rgba(15, 23, 42, .06); }
.sun-card h2, .sun-card h3 { margin: 0 0 10px; font-size: 20px; }
.sun-card p { margin: 0; color: var(--sun-muted); line-height: 1.65; }
.sun-price { font-size: 34px; font-weight: 800; margin: 12px 0 10px; }
.sun-meta { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.sun-tag { border: 1px solid var(--sun-border); background: var(--sun-soft); border-radius: 999px; padding: 6px 9px; font-size: 12px; color: var(--sun-muted); }
.sun-guide-steps { display: grid; gap: 14px; max-width: 840px; }
.sun-guide-step { display: grid; grid-template-columns: 36px 1fr; gap: 14px; align-items: start; border: 1px solid var(--sun-border); border-radius: 12px; padding: 18px; background: var(--sun-bg); }
.sun-step-no { width: 36px; height: 36px; border-radius: 999px; display: grid; place-items: center; background: var(--sun-primary); color: #fff; font-weight: 800; }
.sun-code { margin-top: 10px; padding: 12px; border-radius: 8px; background: #0f172a; color: #e2e8f0; overflow-x: auto; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 13px; }
@media (max-width: 760px) {
  .sun-public-nav { height: 56px; min-height: 56px; align-items: center; padding: 0 12px; gap: 8px; }
  .sun-nav-left { flex-wrap: wrap; gap: 6px; }
  .sun-nav-links { order: 2; width: 100%; gap: 4px; overflow-x: auto; }
  .sun-nav-right, .sun-nav-tools { gap: 8px; }
  .sun-brand { font-size: 17px; }
  .sun-nav-link, .sun-pill { font-size: 14px; padding: 9px 13px; }
  .sun-theme-pill { width: 40px; padding-inline: 0; }
  html.sun-auth-page body.sun-public-enhanced main { padding-top: 150px !important; align-items: flex-start !important; }
  .sun-auth-brand { top: 84px; }
  .sun-public-page { padding-top: 120px; }
}
/* Hide the original Sub2 public header while keeping the Sun public navigation. */
body.sun-public-enhanced header:not(.sun-public-nav),
body.sun-public-enhanced nav:not(.sun-public-nav):not(.sun-nav-links) {
  display: none !important;
}
body.sun-public-enhanced .sun-public-nav,
body.sun-public-enhanced .sun-public-nav * {
  visibility: visible !important;
}
.sun-announcement-modal {
  position: fixed;
  inset: 0;
  z-index: 10020;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(15, 23, 42, .38);
  backdrop-filter: blur(6px);
}
.sun-announcement-panel {
  width: min(520px, 100%);
  max-height: min(72vh, 680px);
  overflow: auto;
  position: relative;
  border-radius: 12px;
  border: 1px solid var(--sun-border);
  background: var(--sun-bg);
  color: var(--sun-text);
  box-shadow: 0 30px 80px rgba(15, 23, 42, .22);
  padding: 24px;
}
.sun-announcement-panel h2 {
  margin: 0 36px 16px 0;
  font-size: 24px;
}
.sun-ann-close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 999px;
  background: var(--sun-soft);
  color: var(--sun-text);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}
.sun-ann-item {
  border-top: 1px solid var(--sun-border);
  padding: 16px 0 0;
  margin-top: 14px;
}
.sun-ann-item:first-child {
  border-top: 0;
  padding-top: 0;
  margin-top: 0;
}
.sun-ann-item h3 {
  margin: 0 0 6px;
  font-size: 18px;
}
.sun-ann-time {
  color: var(--sun-muted);
  font-size: 12px;
  margin-bottom: 10px;
}
.sun-ann-item p,
.sun-ann-body p {
  margin: 0;
  color: var(--sun-muted);
  line-height: 1.75;
}
.sun-logo-img {
  width: 26px;
  height: 26px;
  display: inline-block;
  object-fit: contain;
  flex: 0 0 auto;
}
.sun-auth-brand .sun-logo-img {
  width: 28px;
  height: 28px;
}