/* Duilink global theme with browser-based light/dark */
body.duilink-theme{
  --dui-bg:#f6f8fb;
  --dui-bg-soft:#edf1f6;
  --dui-surface:#ffffff;
  --dui-surface-2:#f3f6fa;
  --dui-text:#17202a;
  --dui-muted:#5c6673;
  --dui-border:#d4dbe4;
  --dui-accent:#8a95a3;
  --dui-accent-hover:#5f6b7a;
  --dui-accent-rgb:138,149,163;
  --dui-accent-soft:rgba(138,149,163,0.15);
  --dui-btn-bg:#ffffff;
  --dui-btn-hover-bg:#f1f4f8;
  --dui-nav-bg:#ffffff;
  --dui-topbar-bg:rgba(248,250,252,0.9);
  --dui-footer-bg:#eef2f6;
  --dui-input-bg:#ffffff;
  --dui-scrollbar-thumb:#aab4c0;
  --dui-scrollbar-track:#eef2f6;
  --dui-radius-sm:10px;
  --dui-radius-md:14px;
  --dui-radius-lg:18px;
  --dui-space-1:8px;
  --dui-space-2:12px;
  --dui-space-3:16px;
  --dui-space-4:20px;
  --accent:var(--dui-accent);
  --accent-hover:var(--dui-accent-hover);
  --accent-soft:var(--dui-accent-soft);
  --fg:var(--dui-text);
  --muted:var(--dui-muted);
  --border:var(--dui-border);
  color-scheme:light dark;
  margin:0;
  background:
    radial-gradient(circle at 12% -18%, rgba(148,163,184,0.22), transparent 34%),
    radial-gradient(circle at 92% -10%, rgba(255,255,255,0.9), transparent 24%),
    linear-gradient(180deg, #fbfcfe 0%, #f2f5f9 52%, #f8fafc 100%);
  color:var(--dui-text);
  font-family:"Avenir Next","Segoe UI",system-ui,-apple-system,sans-serif;
}

@media (prefers-color-scheme: dark){
  body.duilink-theme{
    --dui-bg:#10141b;
    --dui-bg-soft:#171d27;
    --dui-surface:#171d27;
    --dui-surface-2:#202837;
    --dui-text:#f3f4f6;
    --dui-muted:#c0c6d2;
    --dui-border:#334051;
    --dui-accent:#cfaa5b;
    --dui-accent-hover:#e0be74;
    --dui-accent-rgb:207,170,91;
    --dui-accent-soft:rgba(207,170,91,0.16);
    --dui-btn-bg:#161c26;
    --dui-btn-hover-bg:#1d2430;
    --dui-nav-bg:#161c26;
    --dui-topbar-bg:rgba(11,15,22,0.84);
    --dui-footer-bg:#0d1118;
    --dui-input-bg:#121821;
    --dui-scrollbar-thumb:#4a5568;
    --dui-scrollbar-track:#10141b;
    background:
      radial-gradient(circle at 12% -18%, rgba(207,170,91,0.2), transparent 34%),
      radial-gradient(circle at 92% -10%, rgba(255,255,255,0.05), transparent 24%),
      linear-gradient(180deg, #0f131a 0%, #121824 52%, #10141b 100%);
  }
}

body.duilink-theme,
body.duilink-theme *{
  box-sizing:border-box;
  scrollbar-color:var(--dui-scrollbar-thumb) var(--dui-scrollbar-track);
}

body.duilink-theme{
  max-width:100%;
  overflow-x:hidden;
}

body.duilink-theme .topbar,
body.duilink-theme .topbarInner,
body.duilink-theme .topbarActions,
body.duilink-theme .langSwitch,
body.duilink-theme main,
body.duilink-theme .section,
body.duilink-theme .container,
body.duilink-theme .duiTopNav,
body.duilink-theme .heroGrid,
body.duilink-theme .heroMedia{
  width:100%;
  min-width:0;
  max-width:100%;
}

body.duilink-theme a{color:var(--dui-text);}
body.duilink-theme a:hover{color:var(--dui-accent-hover);border-bottom-color:rgba(var(--dui-accent-rgb),0.5);}

body.duilink-theme .container{
  max-width:1120px;
  margin:0 auto;
  padding:0 14px;
}

body.duilink-theme .section{padding:26px 0;}

body.duilink-theme .card,
body.duilink-theme .featureCard,
body.duilink-theme .kpi,
body.duilink-theme .showItem,
body.duilink-theme .hubCard,
body.duilink-theme .box,
body.duilink-theme .hero,
body.duilink-theme .heroMedia,
body.duilink-theme .flowLine,
body.duilink-theme .duiTopNav,
body.duilink-theme .duiCard,
body.duilink-theme .matrix th,
body.duilink-theme .matrix td{
  background:linear-gradient(180deg, rgba(255,255,255,0.045), rgba(255,255,255,0.01)), var(--dui-surface);
  border-color:var(--dui-border);
  color:var(--dui-text);
  box-shadow:0 8px 24px rgba(17,24,39,0.04);
}

body.duilink-theme .lead,
body.duilink-theme .heroLead,
body.duilink-theme .featureBody p,
body.duilink-theme .showBody p,
body.duilink-theme .kpi p,
body.duilink-theme .hubCard p,
body.duilink-theme .box p,
body.duilink-theme .list,
body.duilink-theme .meta,
body.duilink-theme p{
  color:var(--dui-muted);
}

body.duilink-theme .h1,
body.duilink-theme .h2,
body.duilink-theme h1,
body.duilink-theme h2,
body.duilink-theme h3,
body.duilink-theme label{color:var(--dui-text);}

body.duilink-theme .topbar{
  background:var(--dui-topbar-bg);
  border-bottom-color:rgba(var(--dui-accent-rgb),0.22);
  backdrop-filter:blur(10px);
}

body.duilink-theme .topbarInner{
  max-width:1120px;
  margin:0 auto;
  padding:10px 14px;
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
  align-items:center;
}

body.duilink-theme .topbar .brand{
  display:inline-flex;
  align-items:center;
  min-width:0;
  text-decoration:none;
}

body.duilink-theme .topbar .brand picture{
  display:block;
  line-height:0;
}

body.duilink-theme .topbar .brandLogo{
  display:block;
  width:132px;
  max-width:52vw;
  height:auto;
  opacity:.94;
}

body.duilink-theme .topbarActions{
  display:grid;
  grid-template-columns:1fr;
  gap:8px;
  min-width:0;
}

body.duilink-theme .langSwitch{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}

body.duilink-theme .flag{
  display:inline-block;
  width:16px;
  height:12px;
  border-radius:2px;
  border:0;
  box-sizing:border-box;
  overflow:hidden;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.14);
}

body.duilink-theme .flagIt{
  background:linear-gradient(90deg,#008c45 0 33.333%,#fff 33.333% 66.666%,#cd212a 66.666% 100%);
}

body.duilink-theme .flagEn{
  background:
    linear-gradient(90deg,transparent 0 45%,#c8102e 45% 55%,transparent 55% 100%),
    linear-gradient(0deg,transparent 0 43%,#c8102e 43% 57%,transparent 57% 100%),
    linear-gradient(90deg,transparent 0 37%,#fff 37% 63%,transparent 63% 100%),
    linear-gradient(0deg,transparent 0 35%,#fff 35% 65%,transparent 65% 100%),
    linear-gradient(33deg,transparent 0 47%,#c8102e 47% 53%,transparent 53% 100%),
    linear-gradient(-33deg,transparent 0 47%,#c8102e 47% 53%,transparent 53% 100%),
    linear-gradient(33deg,transparent 0 41%,#fff 41% 59%,transparent 59% 100%),
    linear-gradient(-33deg,transparent 0 41%,#fff 41% 59%,transparent 59% 100%),
    linear-gradient(0deg,#012169 0 100%);
}

body.duilink-theme .duiTopNav{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  width:calc(100% - 28px);
  max-width:1120px;
  margin:8px auto 10px;
  padding:8px;
  border:1px solid var(--dui-border);
  border-radius:14px;
  background:var(--dui-topbar-bg);
  backdrop-filter:blur(4px);
}

body.duilink-theme .pill,
body.duilink-theme .pillTag{
  background:linear-gradient(180deg, rgba(var(--dui-accent-rgb),0.16), rgba(var(--dui-accent-rgb),0.06));
  border:1px solid rgba(var(--dui-accent-rgb),0.28);
  color:var(--dui-text);
}

body.duilink-theme .btn,
body.duilink-theme .loginBtn,
body.duilink-theme .langBtn,
body.duilink-theme .duiNav{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:42px;
  padding:10px 14px;
  border:1px solid rgba(148,163,184,0.72);
  border-radius:999px;
  background:linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  color:var(--dui-text);
  box-shadow:
    0 8px 18px rgba(15,23,42,0.10),
    0 1px 2px rgba(15,23,42,0.06);
  text-decoration:none;
  font-weight:800;
  text-shadow:none;
  transition:background .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease,filter .18s ease;
}

body.duilink-theme .loginBtn,
body.duilink-theme .langBtn{
  max-width:100%;
  white-space:nowrap;
  overflow-wrap:normal;
  flex:0 0 auto;
  min-width:0;
}

body.duilink-theme .loginBtn svg{
  width:16px;
  height:16px;
  display:block;
  flex:0 0 auto;
}

body.duilink-theme .loginBtn span,
body.duilink-theme .langBtn span{
  display:block;
  min-width:0;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

body.duilink-theme .btn:hover,
body.duilink-theme .loginBtn:hover,
body.duilink-theme .langBtn:hover,
body.duilink-theme .duiNav:hover{
  border-color:rgba(var(--dui-accent-rgb),0.52);
  color:var(--dui-text);
  background:linear-gradient(180deg, #ffffff 0%, rgba(var(--dui-accent-rgb),0.12) 100%);
  border-bottom-color:rgba(var(--dui-accent-rgb),0.52);
  box-shadow:
    0 11px 22px rgba(15,23,42,0.13),
    0 2px 5px rgba(15,23,42,0.07);
  transform:translateY(-2px);
}

body.duilink-theme .btn.primary{
  background:
    linear-gradient(180deg, rgba(255,255,255,0.98) 0%, #f7f9fc 42%, #dfe5ec 100%) !important;
  border-color:#aeb8c4 !important;
  color:#141922 !important;
  box-shadow:
    0 1px 1px rgba(255,255,255,0.95) inset,
    0 -1px 2px rgba(91,103,117,0.16) inset,
    0 12px 24px rgba(71,85,105,0.18),
    0 2px 5px rgba(15,23,42,0.08) !important;
}

body.duilink-theme .btn.primary:hover,
body.duilink-theme .btn.primary:focus,
body.duilink-theme .btn.primary:focus-visible{
  background:
    linear-gradient(180deg, #ffffff 0%, #fbfcfe 38%, #e7edf4 100%) !important;
  border-color:#8f9baa !important;
  color:#111827 !important;
  transform:translateY(-2px);
}

body.duilink-theme .btn:active,
body.duilink-theme .loginBtn:active,
body.duilink-theme .langBtn:active,
body.duilink-theme .duiNav:active,
body.duilink-theme .btn.primary:active{
  transform:translateY(0);
  box-shadow:
    0 2px 5px rgba(15,23,42,0.16) inset,
    0 4px 10px rgba(15,23,42,0.08) !important;
  filter:saturate(.96);
}

@media (prefers-color-scheme: dark){
  body.duilink-theme .btn,
  body.duilink-theme .loginBtn,
  body.duilink-theme .langBtn,
  body.duilink-theme .duiNav{
    border-color:#334051;
    background:
      linear-gradient(180deg, rgba(255,255,255,0.08) 0%, rgba(255,255,255,0.035) 45%, rgba(0,0,0,0.12) 100%),
      var(--dui-btn-bg);
    color:var(--dui-text);
    text-shadow:0 1px 0 rgba(0,0,0,0.38);
    box-shadow:
      0 1px 1px rgba(255,255,255,0.10) inset,
      0 -1px 1px rgba(0,0,0,0.32) inset,
      0 10px 20px rgba(0,0,0,0.24),
      0 2px 4px rgba(0,0,0,0.18);
  }
  body.duilink-theme .btn:hover,
  body.duilink-theme .loginBtn:hover,
  body.duilink-theme .langBtn:hover,
  body.duilink-theme .duiNav:hover{
    background:
      linear-gradient(180deg, rgba(255,255,255,0.10) 0%, rgba(var(--dui-accent-rgb),0.13) 48%, rgba(0,0,0,0.12) 100%),
      var(--dui-btn-hover-bg);
    box-shadow:
      0 1px 1px rgba(255,255,255,0.12) inset,
      0 -1px 1px rgba(0,0,0,0.34) inset,
      0 14px 26px rgba(0,0,0,0.28),
      0 4px 8px rgba(0,0,0,0.2);
  }
  body.duilink-theme .btn.primary{
    background:linear-gradient(180deg, #dcc38a 0%, #bf9648 56%, #9c742d 100%) !important;
    border-color:#8a6728 !important;
    color:#18140d !important;
    box-shadow:
      0 1px 1px rgba(255,255,255,0.48) inset,
      0 -2px 3px rgba(24,20,13,0.22) inset,
      0 15px 28px rgba(156,116,45,0.24),
      0 4px 8px rgba(0,0,0,0.18) !important;
  }
  body.duilink-theme .btn.primary:hover,
  body.duilink-theme .btn.primary:focus,
  body.duilink-theme .btn.primary:focus-visible{
    background:linear-gradient(180deg, #e6cf9e 0%, #caa45a 56%, #a87d32 100%) !important;
    border-color:#775a24 !important;
    color:#17120a !important;
  }
}

body.duilink-theme .duiNav{font-size:13px;}
body.duilink-theme .duiNav{text-align:center;line-height:1.15;white-space:normal;overflow-wrap:anywhere;}

body.duilink-theme input,
body.duilink-theme textarea,
body.duilink-theme select{
  background:var(--dui-input-bg);
  border:1px solid var(--dui-border);
  border-radius:12px;
  color:var(--dui-text);
}

body.duilink-theme input:focus,
body.duilink-theme textarea:focus,
body.duilink-theme select:focus{
  border-color:var(--dui-accent);
  box-shadow:0 0 0 3px rgba(var(--dui-accent-rgb),0.18);
}

body.duilink-theme .duiNote,
body.duilink-theme .flashBox{
  margin:10px 0 12px;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid var(--dui-border);
  background:var(--dui-accent-soft);
  color:var(--dui-text);
}

body.duilink-theme .flashBox.error{
  border-color:#be123c;
  background:#ffe9ec;
  color:#9f1239;
}

body.duilink-theme .footer{
  margin-top:52px;
  padding-top:18px;
  padding-bottom:28px;
  background:var(--dui-footer-bg);
  border-top:1px solid rgba(var(--dui-accent-rgb),0.22);
  color:var(--dui-muted);
  font-size:13px;
  position:relative;
}

body.duilink-theme .footer::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:2px;
  background:linear-gradient(90deg, var(--dui-accent), transparent);
  transform:translateY(-1px);
}

body.duilink-theme .footerLinks{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  padding-top:10px;
}

body.duilink-theme .footer a{
  color:var(--dui-accent-hover);
  border-bottom:1px solid transparent;
  font-weight:900;
}

body.duilink-theme .footer a:hover{
  color:var(--dui-accent-hover);
  border-bottom-color:rgba(var(--dui-accent-rgb),0.42);
}

body.duilink-theme .footerCopyright{
  margin-top:10px;
  font-size:11px;
  color:var(--dui-muted);
}

body.duilink-theme .footerMeta{
  margin-top:6px;
  font-size:12px;
  color:var(--dui-muted);
}

@media (min-width:720px){
  body.duilink-theme .container{padding:0 18px;}
  body.duilink-theme .section{padding:34px 0;}
  body.duilink-theme .topbarInner{padding:10px 18px;display:flex;justify-content:space-between;}
  body.duilink-theme .topbarActions{display:flex;align-items:center;gap:10px;justify-content:flex-end;flex-wrap:nowrap;width:auto;max-width:calc(100% - 180px);}
  body.duilink-theme .langSwitch{display:flex;align-items:center;gap:8px;}
  body.duilink-theme .loginBtn{min-width:108px;max-width:min(260px,42vw);}
  body.duilink-theme .langBtn{min-width:78px;}
  body.duilink-theme .duiTopNav{display:flex;flex-wrap:wrap;padding:8px;}
}

@media (max-width:520px){
  body.duilink-theme .topbarInner{
    padding:8px 14px;
  }

  body.duilink-theme .topbar .brandLogo{
    width:118px;
  }

  body.duilink-theme .loginBtn,
  body.duilink-theme .langBtn{
    width:100%;
    padding-left:10px;
    padding-right:10px;
  }
}

@media (min-width:980px){
  body.duilink-theme .container{padding:0 20px;}
}
