/* ========================================
   OmoSun — Design System v2
   Dark/Light Theme
   ======================================== */

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}

/* ===== DARK (default) ===== */
[data-theme="dark"]{
  --bg:#09090b;
  --bg-grad:radial-gradient(ellipse at 50% 30%,rgba(249,115,22,.06) 0%,transparent 60%);
  --surface:rgba(24,24,27,.8);
  --surface-solid:#18181b;
  --surface-hover:rgba(39,39,42,.7);
  --border:rgba(63,63,70,.5);
  --border-focus:rgba(249,115,22,.5);
  --accent:#f97316;
  --accent-hover:#ea580c;
  --accent-soft:rgba(249,115,22,.08);
  --accent-mid:rgba(249,115,22,.15);
  --gold:#fbbf24;
  --text:#fafafa;
  --text-secondary:#a1a1aa;
  --text-muted:#71717a;
  --green:#22c55e;
  --red:#ef4444;
  --geo-stroke:rgba(249,115,22,.06);
  --nav-bg:rgba(9,9,11,.85);
  --footer-border:rgba(63,63,70,.5);
  --modal-bg:rgba(0,0,0,.6);
  --input-bg:rgba(255,255,255,.04);
  --plan-check-bg:rgba(249,115,22,.08);
  --plan-check-dot:#f97316;
  --overlay-xs:rgba(255,255,255,0.02);
  --overlay-sm:rgba(255,255,255,0.04);
  --overlay-md:rgba(255,255,255,0.06);
  --overlay-lg:rgba(255,255,255,0.08);
  --overlay-border:rg
  --badge-grad:linear-gradient(135deg,#8b5cf6,#3b82f6);
ba(255,255,255,0.5);
}

/* ===== LIGHT ===== */
[data-theme="light"]{
  --bg:#fafafa;
  --bg-grad:radial-gradient(ellipse at 50% 30%,rgba(249,115,22,.04) 0%,transparent 60%);
  --surface:rgba(255,255,255,.85);
  --surface-solid:#ffffff;
  --surface-hover:rgba(244,244,245,.9);
  --border:rgba(228,228,231,.8);
  --border-focus:rgba(249,115,22,.5);
  --accent:#ea580c;
  --accent-hover:#c2410c;
  --accent-soft:rgba(249,115,22,.06);
  --accent-mid:rgba(249,115,22,.12);
  --gold:#d97706;
  --text:#18181b;
  --text-secondary:#52525b;
  --text-muted:#a1a1aa;
  --green:#16a34a;
  --red:#dc2626;
  --geo-stroke:rgba(249,115,22,.08);
  --nav-bg:rgba(250,250,250,.88);
  --footer-border:rgba(228,228,231,.8);
  --modal-bg:rgba(0,0,0,.3);
  --input-bg:rgba(0,0,0,.03);
  --plan-check-bg:rgba(249,115,22,.06);
  --plan-check-dot:#ea580c;
  --overlay-xs:rgba(0,0,0,0.01);
  --overlay-sm:rgba(0,0,0,0.02);
  --overlay-md:rgba(0,0,0,0.03);
  --overlay-lg:rgba(0,0,0,0.04);
  --overlay-border:rgba(0,0,0,0.12);
  --badge-grad:linear-gradient(135deg,#7c3aed,#2563eb);
}

:root{
  --radius:12px;--radius-sm:8px;--radius-lg:16px;
  --shadow:0 1px 3px rgba(0,0,0,.12),0 8px 24px rgba(0,0,0,.08);
  --shadow-lg:0 2px 8px rgba(0,0,0,.15),0 16px 48px rgba(0,0,0,.1);
  --font:'Inter',-apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei',sans-serif;
  --mono:'JetBrains Mono','SF Mono',Consolas,monospace;
  --container:1120px;
  --grad-btn:linear-gradient(135deg,#f97316,#fbbf24);
  --grad-btn-hover:linear-gradient(135deg,#ea580c,#f59e0b);
}

html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--font);background:var(--bg);background-image:var(--bg-grad);background-attachment:fixed;color:var(--text);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden;transition:background .3s,color .3s}
.container{width:100%;max-width:var(--container);margin:0 auto;padding:0 24px}
@supports(padding:max(0px)){.container{padding-left:max(24px,env(safe-area-inset-left));padding-right:max(24px,env(safe-area-inset-right))}}

/* ===== BACKGROUND ===== */
.bg-geo{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.geo-layer{position:absolute;inset:0;will-change:transform;transition:transform .08s linear}
.geo-svg{position:absolute;animation-timing-function:linear;animation-iteration-count:infinite}
@keyframes geoSpin{0%{transform:rotate(0deg);opacity:.5}50%{opacity:.8}100%{transform:rotate(360deg);opacity:.5}}

/* ===== NAVBAR ===== */
.navbar{position:fixed;top:0;left:0;right:0;z-index:100;background:var(--nav-bg);border-bottom:1px solid var(--border);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);padding-top:env(safe-area-inset-top);transition:background .3s,border-color .3s}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:56px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none}
.logo-sun{display:flex;align-items:center;line-height:1}.logo-text{font-size:17px;font-weight:700;letter-spacing:-.3px;transition:color .3s;background:linear-gradient(135deg,#f97316,#fbbf24,#a78bfa,#38bdf8,#34d399);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.nav-right{display:flex;align-items:center;gap:12px}
.nav-right .btn{margin-left:4px}

/* Theme toggle */
.theme-toggle{position:relative;width:34px;height:30px;padding:0;display:flex;align-items:center;justify-content:center}
.theme-icon-dark,.theme-icon-light{position:absolute;font-size:16px;transition:all .25s}
[data-theme="dark"] .theme-icon-light{opacity:0;transform:rotate(-90deg) scale(.5)}
[data-theme="dark"] .theme-icon-dark{opacity:1;transform:rotate(0) scale(1)}
[data-theme="light"] .theme-icon-dark{opacity:0;transform:rotate(90deg) scale(.5)}
[data-theme="light"] .theme-icon-light{opacity:1;transform:rotate(0) scale(1)}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:8px 16px;border:none;border-radius:var(--radius-sm);font-family:var(--font);font-size:13px;font-weight:500;cursor:pointer;transition:all .15s ease;text-decoration:none;white-space:nowrap;line-height:1.4;-webkit-tap-highlight-color:transparent;touch-action:manipulation;user-select:none}
.btn-primary{background:var(--grad-btn);color:#fff!important;box-shadow:0 2px 8px rgba(249,115,22,.2);border:none}
.btn-primary:hover{background:var(--grad-btn-hover);box-shadow:0 4px 16px rgba(249,115,22,.3);transform:translateY(-1px)}
.btn-primary:active{transform:translateY(0)}
.btn-ghost{background:transparent;color:var(--text-secondary)!important;border:1px solid transparent;transition:all .15s}
.btn-ghost:hover{color:var(--text)!important;background:rgba(249,115,22,.04)}
.btn-outline{background:transparent;color:var(--text-secondary)!important;border:1px solid var(--border);transition:all .15s}
.btn-outline:hover{color:var(--text)!important;border-color:var(--accent);background:var(--accent-soft)}
.btn-sm{padding:6px 14px;font-size:12px}
.btn-block{width:100%;padding:12px 20px;font-size:14px;font-weight:600}

/* User */
.user-menu{display:flex;align-items:center;gap:8px}
.user-name{font-size:12px;color:var(--text);max-width:80px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tier-badge{padding:3px 10px;border-radius:20px;font-size:10px;font-weight:600;background:var(--accent-soft);color:var(--accent);border:1px solid var(--accent-mid);transition:all .3s}
.quota-badge{padding:3px 10px;border-radius:20px;font-size:10px;background:rgba(34,197,94,.08);color:var(--green);border:1px solid rgba(34,197,94,.15)}

/* Avatar dropdown */
.avatar-btn{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:var(--grad-btn);border:none;cursor:pointer;color:#fff;font-size:14px;font-weight:700;transition:box-shadow .2s}
.avatar-btn:hover{box-shadow:0 0 0 3px rgba(249,115,22,.25)}
.avatar-dropdown{position:absolute;top:calc(100% + 8px);right:0;min-width:180px;background:var(--surface-solid);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-lg);padding:6px;z-index:200;display:none}
.avatar-dropdown.open{display:block}
.dropdown-header{display:flex;flex-direction:column;gap:4px;padding:8px 10px}
#dropdown-name{font-size:13px;font-weight:600;color:var(--text)}
#dropdown-tier{font-size:10px;align-self:flex-start}
.dropdown-divider{height:1px;background:var(--border);margin:4px 0}
.dropdown-item{display:block;width:100%;padding:8px 10px;border:none;background:transparent;color:var(--red);font-size:13px;font-family:var(--font);cursor:pointer;border-radius:var(--radius-sm);text-align:left;transition:background .15s}
.dropdown-item:hover{background:rgba(239,68,68,.08)}

/* ===== HERO ===== */
main{position:relative;z-index:1}
.hero{padding:120px 0 64px;text-align:center}
.hero-inner{max-width:680px;margin:0 auto}
.hero-badge{display:inline-flex;padding:5px 14px;border-radius:20px;font-size:11px;font-weight:500;color:var(--accent);background:var(--accent-soft);border:1px solid var(--accent-mid);letter-spacing:.5px;margin-bottom:24px;text-transform:uppercase;transition:all .3s}

/* Slogan animation */
.hero-title{font-size:clamp(30px,6vw,50px);font-weight:800;line-height:1.2;letter-spacing:-.8px;margin-bottom:32px;min-height:2.5em;display:flex;flex-direction:column;align-items:center}
.slogan-line{transition:opacity .35s ease,transform .35s ease}
.accent{background:var(--grad-btn);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.hero-title-light{font-weight:400;color:var(--text-secondary);font-size:clamp(18px,3vw,26px);letter-spacing:-.3px;display:block;margin-top:4px;transition:color .3s}

/* ===== SEARCH ===== */
.search-box{max-width:560px;margin:0 auto}
.search-box-inner{display:flex;align-items:center;background:var(--surface);border:1.5px solid var(--border);border-radius:var(--radius-lg);padding:5px 5px 5px 18px;transition:all .25s;box-shadow:var(--shadow)}
.search-box-inner:focus-within{border-color:var(--border-focus);box-shadow:var(--shadow-lg),0 0 0 3px rgba(249,115,22,.08)}
.search-icon{flex-shrink:0;color:var(--text-muted);margin-right:10px;transition:color .2s}
.search-box-inner:focus-within .search-icon{color:var(--accent)}
.search-input{flex:1;border:none;outline:none;background:transparent;color:var(--text);font-size:15px;font-family:var(--font);padding:12px 0;min-width:0;-webkit-appearance:none;transition:color .3s}
.search-input::placeholder{color:var(--text-muted)}
.search-btn{display:flex;align-items:center;gap:8px;padding:12px 22px;background:var(--grad-btn);color:#fff;border:none;border-radius:var(--radius);font-family:var(--font);font-size:14px;font-weight:600;cursor:pointer;transition:all .2s;flex-shrink:0;-webkit-tap-highlight-color:transparent;touch-action:manipulation;box-shadow:0 2px 8px rgba(249,115,22,.2)}
.search-btn:hover{background:var(--grad-btn-hover);transform:translateY(-1px);box-shadow:0 4px 16px rgba(249,115,22,.3)}
.search-btn:active{transform:translateY(0)}
.search-btn svg{transition:transform .2s}
.search-btn:hover svg{transform:translateX(3px)}
.search-error{color:var(--red);font-size:13px;margin-top:8px;text-align:left;padding-left:4px}
.quota-info{color:var(--text-muted);font-size:12px;margin-top:10px;text-align:left;padding-left:4px}

/* Brand Wall - 双层双向无限滚动 */
.brand-wall{
  margin-top:36px;
  overflow:hidden;
  position:relative;
}
.brand-wall .container{
  margin-bottom:16px;
}
.brand-wall-inner{
  overflow:hidden;
  display:flex;
  flex-direction:column;
  gap:14px;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
}
.brand-track{
  display:flex;
  width:max-content;
  animation:scroll-left 40s linear infinite;
}
.brand-track.track-reverse{
  animation-name:scroll-right;
}
@keyframes scroll-left{
  0%{transform:translateX(0)}
  100%{transform:translateX(-50%)}
}
@keyframes scroll-right{
  0%{transform:translateX(-50%)}
  100%{transform:translateX(0)}
}
.brand-track:hover{
  animation-play-state:paused;
}
.brand-item{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:13px;
  color:var(--text-muted);
  white-space:nowrap;
  opacity:.35;
  transition:opacity .25s;
  flex-shrink:0;
  padding:6px 16px;
}
.brand-item:hover{
  opacity:.7;
}
.brand-icon{
  font-size:15px;
}

/* Trust bar */
.trust-bar{display:flex;align-items:center;justify-content:center;gap:24px;margin-top:40px;flex-wrap:wrap}
.trust-item{display:flex;align-items:baseline;gap:6px}
.trust-num{font-size:15px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums;transition:color .3s}
.trust-label{font-size:12px;color:var(--text-muted);transition:color .3s}
.trust-dot{width:3px;height:3px;border-radius:50%;background:var(--text-muted);opacity:.4}

/* ===== RESULTS ===== */
.results{padding:0 0 64px}
.result-summary{display:flex;align-items:center;justify-content:space-between;padding:24px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:24px;transition:all .3s}
.result-domain{font-size:clamp(16px,4vw,22px);font-weight:700;font-family:var(--mono);word-break:break-all;flex:1;padding-right:16px;transition:color .3s}
.result-score-wrap{display:flex;flex-direction:column;align-items:center;gap:4px;flex-shrink:0}
.result-score-label{font-size:10px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.8px}
.result-score{width:56px;height:56px;border-radius:50%;background:var(--grad-btn);display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700;color:#fff;box-shadow:0 0 24px rgba(249,115,22,.25)}

/* Cards */
.cards-grid{display:flex;flex-direction:column;gap:16px}
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:24px;transition:border-color .2s,background .3s}
.card:hover{border-color:rgba(249,115,22,.2)}
.card-header{display:flex;align-items:center;gap:10px;margin-bottom:20px}
.card-badge{padding:3px 10px;border-radius:20px;font-size:10px;font-weight:600;background:var(--accent-soft);color:var(--accent);text-transform:uppercase;letter-spacing:.5px;transition:all .3s}
.card-title{font-size:15px;font-weight:600;color:var(--text);transition:color .3s}

/* Industry bars */
.industry-bars{display:flex;flex-direction:column;gap:16px}
.industry-bar{display:flex;align-items:center;gap:12px}
.industry-bar .label{width:56px;font-size:13px;color:var(--text-secondary);text-align:right;flex-shrink:0;font-weight:500}
.industry-bar .bar{flex:1;height:8px;background:var(--accent-soft);border-radius:4px;overflow:hidden}
.industry-bar .fill{height:100%;background:var(--grad-btn);border-radius:4px;transition:width 1s cubic-bezier(.22,1,.36,1);will-change:width}
.industry-bar .score{width:32px;font-size:13px;font-weight:600;color:var(--accent);font-family:var(--mono);text-align:right;flex-shrink:0}
.upsell-bar{margin-top:16px;padding:10px 14px;background:var(--accent-soft);border:1px solid var(--accent-mid);border-radius:var(--radius-sm);font-size:12px;color:var(--text-secondary);display:flex;align-items:center;gap:6px;transition:all .3s}

/* Fengshui */
.fengshui-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}

/* Server Direction Grid */
.server-direction-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:14px}
.server-direction-item{padding:14px;background:var(--overlay-xs);border-radius:10px;border:1px solid var(--overlay-sm);text-align:center}
.server-direction-compass{width:64px;height:64px;margin:0 auto 10px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent-secondary));display:flex;align-items:center;justify-content:center;font-size:28px;color:#fff;box-shadow:0 4px 12px rgba(var(--accent-rgb),0.3)}
.server-direction-name{font-size:14px;font-weight:600;color:var(--text);margin-bottom:4px}
.server-direction-element{font-size:12px;color:var(--accent);margin-bottom:6px}
.server-direction-desc{font-size:11px;color:var(--text-muted);line-height:1.4}
/* Server Direction Detail */
.server-direction-wuxing{font-size:14px;color:var(--text);margin-bottom:12px;padding:8px 12px;background:var(--overlay-xs);border-radius:var(--radius-sm)}
.server-direction-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;margin-bottom:12px}
.server-direction-item{padding:14px;background:var(--overlay-xs);border:1px solid var(--overlay-sm);border-radius:var(--radius-sm);transition:border-color .2s}
.server-direction-item:hover{border-color:var(--accent-mid)}
.server-direction-dir{font-size:14px;font-weight:600;color:var(--accent);margin-bottom:4px}
.server-direction-element{font-size:12px;color:var(--text-secondary);margin-bottom:6px}
.server-direction-desc{font-size:12px;color:var(--text-muted);line-height:1.5;margin-bottom:4px}
.server-direction-benefit{font-size:11px;color:var(--accent-secondary);font-weight:500}
.server-direction-suggestion{font-size:13px;color:var(--text-secondary);padding:10px 12px;background:var(--overlay-xs);border-radius:var(--radius-sm);border-left:3px solid var(--accent)}


.fs-item{padding:16px;background:var(--accent-soft);border:1px solid rgba(249,115,22,.06);border-radius:var(--radius-sm);transition:border-color .2s}
.fs-item:hover{border-color:var(--accent-mid)}
.fs-label{font-size:11px;color:var(--text-muted);margin-bottom:4px;text-transform:uppercase;letter-spacing:.5px}
.fs-value{font-size:14px;font-weight:600;color:var(--text);word-break:break-word}

/* Lucky */
.lucky-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px}
.lw-item{padding:20px 14px;background:var(--accent-soft);border:1px solid rgba(249,115,22,.06);border-radius:var(--radius-sm);text-align:center;transition:all .2s}
.lw-item:hover{border-color:var(--accent-mid);transform:translateY(-2px)}
.lw-char{font-size:32px;font-weight:700;background:var(--grad-btn);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;margin-bottom:8px}
.lw-reason{font-size:11px;color:var(--text-secondary);line-height:1.5}

/* Upsell */
.card-upsell{position:relative;overflow:hidden;min-height:100px}
.upsell-blur{filter:blur(5px);user-select:none;padding:8px 0}
.upsell-blur p{margin-bottom:6px;font-size:13px;color:var(--text-muted)}
.upsell-cover{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:var(--surface-solid);opacity:.85}
.upsell-title{font-size:16px;font-weight:600}
.upsell-desc{font-size:13px;color:var(--text-secondary)}

/* Actions */
.result-actions{display:flex;gap:10px;margin-top:20px}

/* ===== SECTIONS ===== */
.section{padding:80px 0;transition:background .3s}
.section-header{text-align:center;margin-bottom:48px}
.section-tag{display:inline-block;padding:4px 12px;border-radius:20px;font-size:11px;font-weight:500;color:var(--accent);background:var(--accent-soft);border:1px solid var(--accent-mid);margin-bottom:12px;text-transform:uppercase;letter-spacing:.5px;transition:all .3s}
.section-title{font-size:clamp(24px,4vw,32px);font-weight:700;letter-spacing:-.5px;transition:color .3s}

/* Features */
.features{background:linear-gradient(180deg,transparent,rgba(249,115,22,.02),transparent)}
.feature-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px}
.feature-card{padding:28px 24px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);transition:all .2s}
.feature-card:hover{border-color:rgba(249,115,22,.15);transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.feature-icon-wrap{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:var(--radius-sm);background:var(--accent-soft);color:var(--accent);margin-bottom:16px;transition:all .3s}
.feature-name{font-size:16px;font-weight:600;margin-bottom:8px}
.feature-desc{font-size:13px;color:var(--text-muted);line-height:1.6}

/* Pricing */
.pricing{border-top:1px solid var(--border)}
.pricing-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px}
.plan{position:relative;padding:28px 24px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);display:flex;flex-direction:column;transition:all .2s}
.plan:hover{border-color:rgba(249,115,22,.2);transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.plan-featured{border-color:var(--accent);box-shadow:var(--shadow),0 0 30px rgba(249,115,22,.08)}
.plan-popular{position:absolute;top:-12px;left:50%;transform:translateX(-50%);padding:4px 14px;background:var(--grad-btn);color:#fff;border-radius:20px;font-size:11px;font-weight:600;white-space:nowrap}
.plan-name{font-size:14px;font-weight:600;color:var(--text-secondary);margin-bottom:12px;transition:color .3s}
.plan-price{font-size:36px;font-weight:800;letter-spacing:-.5px;margin-bottom:20px;color:var(--text);transition:color .3s}
.plan-currency{font-size:18px;font-weight:500;vertical-align:super;margin-right:2px}
.plan-period{font-size:14px;font-weight:400;color:var(--text-muted)}
.plan-list{list-style:none;margin-bottom:24px;flex:1;display:flex;flex-direction:column;gap:8px}
.plan-list li{font-size:13px;color:var(--text-secondary);padding-left:20px;position:relative;line-height:1.4}
.plan-list li::before{content:'';position:absolute;left:0;top:7px;width:12px;height:12px;border-radius:3px;background:var(--plan-check-bg)}
.plan-list li::after{content:'';position:absolute;left:4px;top:11px;width:4px;height:4px;border-radius:50%;background:var(--plan-check-dot)}
.plan .btn-block{margin-top:auto}

/* Footer */
.footer{border-top:1px solid var(--footer-border);padding:24px 0;transition:border-color .3s}
.footer-inner{display:flex;align-items:center;justify-content:space-between}
.footer-brand{font-size:14px;font-weight:600;color:var(--text);transition:color .3s}
.footer-copy{font-size:12px;color:var(--text-muted);transition:color .3s}

/* Modal */
.modal{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;padding:16px}
.modal-bg{position:absolute;inset:0;background:var(--modal-bg);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.modal-panel{position:relative;background:var(--surface-solid);border:1px solid var(--border);border-radius:var(--radius-lg);padding:28px 24px;width:100%;max-width:380px;box-shadow:var(--shadow-lg);transition:background .3s}
.modal-x{position:absolute;top:12px;right:12px;background:none;border:none;color:var(--text-muted);cursor:pointer;padding:6px;border-radius:6px;transition:all .15s}
.modal-x:hover{color:var(--text);background:rgba(249,115,22,.06)}
.modal-title{font-size:18px;font-weight:600;margin-bottom:20px}
.modal-panel input{display:block;width:100%;padding:12px 14px;margin-bottom:10px;background:var(--input-bg);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);font-size:14px;font-family:var(--font);outline:none;transition:all .2s}
.modal-panel input:focus{border-color:var(--accent)}
.auth-switch{text-align:center;margin-top:16px;font-size:12px;color:var(--text-muted)}
.auth-switch a{color:var(--accent);text-decoration:none;cursor:pointer;font-weight:500}
.auth-error{color:var(--red);font-size:12px;text-align:center;margin-top:10px}

/* Toast */
.toast{position:fixed;top:72px;left:50%;transform:translateX(-50%);padding:10px 24px;background:var(--surface-solid);border:1px solid var(--border);border-radius:var(--radius-sm);font-size:13px;box-shadow:var(--shadow-lg);z-index:300;max-width:calc(100vw - 32px);text-align:center}

#radar-canvas{display:block;margin:0 auto;max-width:100%}

/* ===== RESPONSIVE ===== */
@media(max-width:768px){
  .hero{padding:96px 0 48px}
  .trust-bar{gap:16px;margin-top:32px}
  .section{padding:56px 0}
  .section-header{margin-bottom:36px}
  .pricing-grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .plan{padding:22px 18px}
  .plan-price{font-size:28px}
  .feature-grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .footer-inner{flex-direction:column;gap:8px;text-align:center}
}

/* ===== 新增板块样式 ===== */

/* 拥有者契合度 */
.owner-fit-grid{display:flex;flex-direction:column;gap:12px;margin-bottom:16px}
.fit-item{display:flex;align-items:center;gap:12px}
.fit-label{font-size:13px;color:var(--text-secondary);width:72px;flex-shrink:0}
.fit-bar{flex:1;height:8px;background:var(--surface-hover);border-radius:4px;overflow:hidden}
.fit-fill{height:100%;background:linear-gradient(90deg,var(--accent),var(--gold));border-radius:4px;transition:width .6s ease}
.fit-score{font-size:14px;font-weight:600;color:var(--text);width:36px;text-align:right}
.owner-recommend{margin-top:16px;padding:12px;background:var(--accent-soft);border-radius:var(--radius-sm);font-size:13px;line-height:1.6}
.owner-recommend .rec-title{font-weight:600;color:var(--accent);margin-bottom:8px}
.owner-recommend .rec-item{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.owner-recommend .rec-item:last-child{margin-bottom:0}
.owner-recommend .rec-badge{display:inline-block;padding:2px 8px;background:var(--accent);color:#fff;border-radius:4px;font-size:11px;font-weight:500}
.owner-suggestion{margin-top:12px;padding:12px;background:var(--surface-hover);border-radius:var(--radius-sm);font-size:13px;color:var(--text-secondary);line-height:1.5;border-left:3px solid var(--accent)}

/* 域名结构分析 */
.structure-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:16px}
.struct-item{display:flex;flex-direction:column;gap:4px}
.struct-label{font-size:11px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}
.struct-value{font-size:16px;font-weight:500;color:var(--text)}
.struct-value.highlight{color:var(--accent)}
.struct-suggestions{margin-top:12px;font-size:13px;color:var(--text-secondary);line-height:1.6}
.struct-suggestions .sug-item{display:flex;align-items:flex-start;gap:8px;margin-bottom:8px}
.struct-suggestions .sug-icon{color:var(--gold);flex-shrink:0}

/* 商业价值 */
.commercial-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-bottom:16px}
.comm-item{display:flex;flex-direction:column;gap:4px}
.comm-label{font-size:11px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}
.comm-score{font-size:20px;font-weight:600}
.comm-score.high{color:var(--green)}
.comm-score.mid{color:var(--gold)}
.comm-score.low{color:var(--text-secondary)}
.comm-price{font-size:16px;font-weight:500;color:var(--accent)}
.comm-channels{margin-top:12px;padding:12px;background:var(--surface-hover);border-radius:var(--radius-sm)}
.comm-channels .ch-title{font-size:12px;font-weight:600;color:var(--text);margin-bottom:8px}
.comm-channels .ch-item{display:flex;justify-content:space-between;align-items:center;font-size:12px;padding:6px 0;border-bottom:1px solid var(--border)}
.comm-channels .ch-item:last-child{border-bottom:none}
.comm-channels .ch-name{color:var(--text-secondary)}
.comm-channels .ch-score{color:var(--text);font-weight:500}
.comm-recommendation{margin-top:12px;padding:12px;background:var(--accent-soft);border-radius:var(--radius-sm);font-size:13px;color:var(--accent);font-weight:500;text-align:center}

/* SEO 潜力 */
.seo-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-bottom:16px}
.seo-item{display:flex;flex-direction:column;gap:4px}
.seo-label{font-size:11px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}
.seo-value{font-size:16px;font-weight:500;color:var(--text)}
.seo-value.highlight{color:var(--green)}
.seo-tips{margin-top:12px;font-size:13px;color:var(--text-secondary);line-height:1.6}
.seo-tips .tip-item{display:flex;align-items:flex-start;gap:8px;margin-bottom:8px}
.seo-tips .tip-icon{color:var(--green);flex-shrink:0}
.seo-strategies{margin-top:12px;padding:12px;background:var(--surface-hover);border-radius:var(--radius-sm)}
.seo-strategies .st-title{font-size:12px;font-weight:600;color:var(--text);margin-bottom:8px}
.seo-strategies .st-item{margin-bottom:8px}
.seo-strategies .st-item:last-child{margin-bottom:0}
.seo-strategies .st-name{font-size:13px;font-weight:500;color:var(--accent)}
.seo-strategies .st-desc{font-size:12px;color:var(--text-muted);margin-top:2px}

/* 相似域名推荐 */
.similar-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.sim-item{display:flex;flex-direction:column;gap:4px;padding:12px;background:var(--surface-hover);border-radius:var(--radius-sm);transition:all .2s;cursor:pointer}
.sim-item:hover{background:var(--accent-soft);transform:translateY(-2px)}
.sim-domain{font-size:14px;font-weight:500;color:var(--text);font-family:'JetBrains Mono',monospace}
.sim-type{font-size:11px;color:var(--text-muted)}
.sim-status{font-size:11px;display:inline-block;padding:2px 6px;border-radius:4px;margin-top:4px;width:fit-content}
.sim-status.available{background:rgba(34,197,94,.1);color:var(--green)}
.sim-status.taken{background:rgba(239,68,68,.1);color:var(--red)}
.sim-status.unknown{background:var(--surface);color:var(--text-muted)}

@media(max-width:520px){
  .structure-grid,.commercial-grid,.seo-grid{grid-template-columns:repeat(2,1fr)}
  .similar-grid{grid-template-columns:1fr}
}

@media(max-width:520px){
  .search-box-inner{flex-direction:column;padding:6px;gap:4px}
  .search-icon{display:none}
  .search-input{padding:12px 14px;text-align:center}
  .search-btn{width:100%;justify-content:center;padding:13px 20px;border-radius:var(--radius-sm)}
  .result-summary{flex-direction:column;gap:16px;text-align:center}
  .result-domain{padding-right:0}
  .pricing-grid{grid-template-columns:1fr}
  .feature-grid{grid-template-columns:1fr}
  .fengshui-grid{grid-template-columns:1fr 1fr}
  .lucky-grid{grid-template-columns:repeat(2,1fr)}
}

@media(max-width:400px){
  .container{padding:0 16px}
  .hero{padding:80px 0 36px}
  .fengshui-grid{grid-template-columns:1fr}
}

@media(hover:none) and (pointer:coarse){
  .card:hover,.plan:hover,.feature-card:hover,.search-btn:hover{transform:none!important}
  .search-btn:active{transform:scale(.98)!important}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
  .industry-bar .fill{transition:none}
}

/* ===== 颜色维度分析 ===== */
.color-badge{
  background: linear-gradient(135deg, #f97316, #ec4899);
  color: #fff;
}
  /* ===== 品牌色彩分析 ===== */
  #color-card{
    padding: 20px 24px;
  }
  .color-section-header{
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color:var(--text-muted);
    margin-bottom: 12px;
    padding-left: 2px;
  }
  .color-palette{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(72px, 1fr));
    gap: 16px 12px;
    margin-bottom: 24px;
  }
  .color-swatch{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
  }
  .color-swatch-circle{
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border:2px solid var(--overlay-lg);
    transition: transform .25s, box-shadow .25s;
  }
  .color-swatch-circle:hover{
    transform: scale(1.1);
    box-shadow: 0 0 12px rgba(var(--swatch-rgb), 0.2);
  }
  .color-swatch-circle.primary{
    border-color:var(--overlay-border);
    box-shadow: 0 0 8px rgba(var(--swatch-rgb), 0.5), 0 0 24px rgba(var(--swatch-rgb), 0.25);
  }
  .color-swatch-name{
    font-size: 12px;
    color:var(--text-secondary);
    font-weight: 500;
    text-align: center;
  }
  .color-swatch-hex{
    font-size: 10px;
    color:var(--text-muted);
    font-family: 'SF Mono','Fira Code',monospace;
    text-align: center;
  }
  .color-swatch-bar{
    width: 100%;
    max-width: 56px;
    height: 3px;
    border-radius: 2px;
    background:var(--overlay-md);
    overflow: hidden;
  }
  .color-swatch-bar-fill{
    height: 100%;
    border-radius: 2px;
    transition: width .8s cubic-bezier(.22,1,.36,1);
  }
  .color-swatch-score{
    font-size: 10px;
    color:var(--text-secondary);
    text-align:center;
  }
  .color-scheme-wrap{
    display: flex;
    align-items: stretch;
    gap: 20px;
    padding: 16px 18px;
    background:var(--overlay-xs);
    border-radius: 12px;
    border:1px solid var(--overlay-sm);
    margin-bottom: 20px;
  }
  .color-scheme-meta{
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 8px;
  }
  .color-scheme-name{
    font-size: 14px;
    font-weight: 600;
    color:var(--text);
    line-height:1.4;
  }
  .color-scheme-tags{
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
  }
  .color-scheme-tag{
    padding: 3px 9px;
    border-radius: 5px;
    font-size: 11px;
    font-weight: 500;
  }
  .color-scheme-blocks{
    display: flex;
    gap: 6px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-end;
  }
  .color-scheme-block{
    width: 40px;
    height: 26px;
    border-radius: 6px;
    flex-shrink: 0;
  }
  .color-scheme-block.lg{
    width: 52px;
    height: 34px;
  }
  .color-advice-wrap{
    display: flex;
    flex-direction: column;
    gap: 16px;
  }
  .color-suggestion{
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 14px;
    background:var(--overlay-xs);
    border-radius: 8px;
    font-size: 13px;
    color:var(--text-secondary);
    line-height:1.55;
  }
  .color-suggestion-icon{
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: rgba(249,115,22,0.15);
    color:var(--accent);
    font-size: 11px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-top: 2px;
  }
  .color-suggestion-text{
    flex: 1;
  }
  .color-suggestion em{
    color:var(--text);
    font-style:normal;
  }
  .color-avoid{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }
  .color-avoid-item{
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 6px 11px;
    border-radius: 6px;
    background:var(--overlay-xs);
    font-size: 12px;
  }
  .color-avoid-dot{
    width: 16px;
    height: 16px;
    border-radius: 50%;
    flex-shrink: 0;
    border:1px solid var(--overlay-md);
  }
  .color-avoid-label{
    color:var(--text-secondary);
  }
  .color-avoid-reason{
    color:var(--text-secondary);
    font-size:11px;
  }

/* ===== 中文名推荐 ===== */
.chinese-badge{
  background: linear-gradient(135deg,#ef4444,#f97316);
  color: #fff;
}
.english-badge{
  background: linear-gradient(135deg,#3b82f6,#8b5cf6);
  color: #fff;
}
.name-container{
  padding: 8px 0;
}
.name-list{
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.name-item{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  background: var(--overlay-xs);
  border: 1px solid var(--border);
  border-radius: 12px;
  transition: all 0.2s ease;
}
.name-item:hover{
  background: var(--overlay-sm);
  border-color: var(--accent);
}
.name-text{
  font-size: 18px;
  font-weight: 600;
  color: var(--text);
  letter-spacing: 0.5px;
}
.name-meta{
  display: flex;
  align-items: center;
  gap: 12px;
}
.name-score{
  font-size: 13px;
  font-weight: 600;
  color: var(--accent);
}
.name-tag{
  font-size: 11px;
  padding: 2px 8px;
  background: var(--accent-soft);
  color: var(--accent);
  border-radius: 10px;
}
.name-meaning{
  font-size: 12px;
  color: var(--text-secondary);
  margin-top: 4px;
}

/* ===== Slogan 推荐 ===== */
.slogan-badge{
  background: var(--badge-grad);
  color: #fff;
}
.slogan-container{
  text-align: center;
  padding: 10px 0;
}
.slogan-display{
  min-height: 120px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 12px;
}
.slogan-text{
  font-size: 22px;
  font-weight: 600;
  color: var(--text);
  line-height: 1.6;
  letter-spacing: 0.5px;
  animation: sloganFadeIn .6s cubic-bezier(0.22, 1, 0.36, 1);
}
.slogan-text em{
  font-style: normal;
  background:linear-gradient(135deg,#f97316,#ec4899);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  font-weight: 700;
}
@keyframes sloganFadeIn{
  from{opacity:0;transform:translateY(16px) scale(0.97)}
  to{opacity:1;transform:translateY(0) scale(1)}
}
.slogan-style{
  font-size: 12px;
  padding: 4px 14px;
  border-radius: 20px;
  display: inline-block;
}
.style-bold{background:var(--style-bold-bg);color:var(--style-bold-text)}
.style-minimal{background:var(--style-minimal-bg);color:var(--style-minimal-text)}
.style-visionary{background:var(--style-visionary-bg);color:var(--style-visionary-text)}
.style-playful{background:var(--style-playful-bg);color:var(--style-playful-text)}
.style-trust{background:var(--style-trust-bg);color:var(--style-trust-text)}
.style-conversion{background:var(--style-conversion-bg);color:var(--style-conversion-text)}
.style-authority{background:var(--style-authority-bg);color:var(--style-authority-text)}
.style-cultural{background:var(--style-cultural-bg);color:var(--style-cultural-text)}
.style-creative{background:var(--style-creative-bg);color:var(--style-creative-text)}

.slogan-nav{
  display: flex;
  align-items: center;
  gap: 16px;
  margin-top: 8px;
}
.slogan-nav-btn{
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid var(--border);
  background: var(--surface-hover);
  color: var(--text-secondary);
  font-size: 16px;
  cursor: pointer;
  transition: all .2s;
  display: flex;
  align-items: center;
  justify-content: center;
}
.slogan-nav-btn:hover{
  background: var(--accent-soft);
  color: var(--text);
  border-color: var(--accent-mid);
}
.slogan-counter{
  font-size: 13px;
  color: var(--text-muted);
  font-variant-numeric: tabular-nums;
}

.slogan-dots{
  display: flex;
  justify-content: center;
  gap: 6px;
  margin-top: 20px;
}
.slogan-dot{
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--border);
  transition: all .4s cubic-bezier(0.22, 1, 0.36, 1);
}
.slogan-dot.active{
  width: 24px;
  border-radius: 3px;
  background: var(--slogan-dot-active);
}

@media(max-width:520px){
  .color-palette{gap:6px}
  .color-swatch{min-width:60px}
  .color-swatch-circle{width:40px;height:40px}
  .slogan-text{font-size:18px}
  .color-scheme-preview{padding:14px;flex-direction:column;align-items:flex-start}
}

/* Donation Banner */
#donation-banner{transition:border-color .2s,background .2s}
#donation-banner:hover{background:var(--overlay-xs);border-color:var(--accent) !important}